@import url('sub.css'); 


/* fullpage */
.section {position:relative; display: block; width: 100%; height: var(--fullvh); overflow: hidden !important;}
.section .fp-overflow{width: 100%; height: var(--fullvh); overflow: hidden !important; display: flex; flex-direction: column; justify-content: center;}
/* 배경 이미지 애니메이션 정의 */
.section .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; transform: scale(1.15); transition: transform 2.2s ease; will-change: transform; }
.section.action .bg { transform: scale(1); transition-delay: 0.2s; }

#overview .bg {background:url("/about/img/overview_bg.jpg")no-repeat center / cover;}
#reason .bg {background:url("/about/img/reason_bg.jpg")no-repeat center / cover;}
#process .bg {background:url("/about/img/process_bg.jpg")no-repeat center / cover;}
#organ .bg {background:url("/about/img/organ_bg.jpg")no-repeat center / cover;}
#timeline .bg {background:url("/about/img/timeline_bg.jpg")no-repeat center / cover;}
/* fullpage */


#main .tit_wrap .fs56 { color:var(--black); font-weight:300; font-family:var(--kor); letter-spacing:-4%;}
#main .tit_wrap .fs56 b {font-weight:bold; line-height:inherit; letter-spacing:inherit;}

#overview {position:relative; text-align:left; height: var(--fullvh); padding:0 !important}
#overview .fp-overflow  {height:100%;}
#overview .basic_in {max-width:100%; width:90%; padding-left:210px; box-sizing:border-box;}
#overview .fs60 {font-weight:300; color:var(--white); margin:0 0 30px;}
#overview .fs60 b {font-weight:bold; line-height:inherit; letter-spacing:inherit;}
#overview .fs18 { color:var(--white); /* opacity: 0.7; */}
#overview .fs18+.fs18 {margin:48px 0 0;}

#overview .scroll_down {display:block; font-size: 12px; font-weight: 700; line-height: 183.333%; color:var(--white); gap:0 20px; font-family:var(--eng); position:absolute; bottom:30px; left:50%; transform:translateX(-50%); z-index:999;}
#overview .scroll_down span { position: relative; display: block; width: 5px; height: 50px; background: rgba(255,255,255,0.3); border-radius: 5px; margin:20px auto 0;}
#overview .scroll_down span::after { content: ''; width: 100%; height: 50%; background: var(--white); border-radius: 5px; position: absolute; top: 0; left: 0; animation: scrollDrop 1.5s ease-in-out infinite; }
@keyframes scrollDrop { 0% { transform: translateY(0); opacity: 0; } 20% { opacity: 1; } 80% { opacity: 1; } 100% { transform: translateY(100%); opacity: 0; } }


/* 화살표 */
#reason .slick-arrow {display: flex; width: 60px; flex-direction: column; justify-content: center; align-items: center; flex-shrink: 0; aspect-ratio: 1/1; border-radius: 100%; background: rgba(255, 255, 255, 0.90); backdrop-filter: blur(5px); transition:all 0.4s; top:-64px; position:absolute; font-size:0; border:0; transform:translateY(-100%); z-index:999; cursor:pointer; border:1px solid var(--border);}
#reason .slick-arrow::before {display:none;}
#reason .slick-arrow::after {content:''; width: 14px; flex-shrink: 0; aspect-ratio: 1/1; -webkit-mask: url("/img/arr_svg.svg") no-repeat center / 100% auto;  mask: url("/img/arr_svg.svg") no-repeat center / 100% auto; display:block; background:var(--black);}
#reason .slick-prev {left:0;}
#reason .slick-prev::after {transform: scaleX(-1);}
#reason .slick-next {right:0;}
#reason .slick-arrow:hover {background:var(--main); border-color:var(--main);}
#reason .slick-arrow:hover::after {background:var(--white);}



.reason_roll {display:flex; flex-wrap:wrap; gap:30px; justify-content:center;}
/* .reason_roll .slick-list {margin-left:-30px;}
.reason_roll li.slick-slide {counter-increment: reason-num; position:relative; padding:80px 50px; box-sizing:border-box; background:var(--grayBg); border-radius:15px; margin-left:30px; text-align:center; transition:all 0.4s ease-in-out;}
.reason_roll li.slick-slide::after {content: counter(reason-num, decimal-leading-zero); font-size:14px;  font-weight: 700; line-height: 24px; letter-spacing: -0.42px; color: var(--main); padding:0 15px; border-radius:50px; background: rgba(29, 44, 89, 0.10); position:absolute; top:10px; right:10px;  display:block; transition:all 0.4s ease-in-out;} */
.reason_roll li {display:flex; flex-wrap:wrap; gap:30px; align-items:center; width:calc((100% - 60px) / 3); border-radius: 15px; background: var(--grayBg); padding:30px 50px; box-sizing:border-box; transition:all 0.4s ease-in-out;}
.reason_roll li i {flex-shrink: 0;}
.reason_roll li i img { transition:all 0.4s ease-in-out;}
.reason_roll li .in {flex:1;}
.reason_roll li .fs20 {margin:0 0 5px; color:var(--black); transition:all 0.4s ease-in-out; font-weight:600;}
.reason_roll li .fs14 { transition:all 0.4s ease-in-out;}

.reason_roll li:hover {background:var(--main); transition:all 0.4s ease-in-out;}
.reason_roll li:hover::after {background: rgba(255, 255, 255, 0.10); color:var(--white); transition:all 0.4s ease-in-out;}
.reason_roll li:hover i img {filter: brightness(0) invert(1); transition:all 0.4s ease-in-out;}
.reason_roll li:hover .fs20 {color:var(--white); transition:all 0.4s ease-in-out;}
.reason_roll li:hover .fs14 {color:var(--white); transition:all 0.4s ease-in-out;}

.reason_roll .slick-dots {position:relative; bottom:0; left:0; z-index:20; width:100%; display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin:30px 0 0;}
.reason_roll .slick-dots li {width:10px;  aspect-ratio: 1 / 1; border-radius:100%; background: rgba(255, 255, 255, 1); border:1px solid var(--main); box-sizing:border-box; font-size:0; }
.reason_roll .slick-dots li.slick-active {background:var(--main); border-color:var(--main);}
.reason_roll .slick-dots li button {margin:0; padding:0; background:transparent; display:block; width:100%; height:100%; cursor:pointer; border:0; font-size:0; }


#process .tit_wrap .fs56 {color:var(--white);}
#process .process_list {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-gap:30px;}
#process .process_list dl {padding:30px 50px; box-sizing:border-box; background:var(--grayBg); border-radius:15px; display:flex; flex-wrap:wrap; align-items:center; gap:0 30px;}
#process .process_list dl dt {width:60px; flex-shrink: 0;}
#process .process_list dl dd {flex:1;}
#process .process_list dl dd .step {font-size:14px;  font-weight: 700; line-height: 171.429%; letter-spacing: -0.42px; color: var(--main); display:block;}
#process .process_list dl dd .fs20 {color:var(--black); font-weight:600;}
#process .process_list dl dd .fs14 {margin:10px 0 0;}

#timeline .fp-overflow{overflow-x: hidden !important; overflow-y: auto !important; display: block !important;}
#fp-nav ul li a .fp-tooltip {display:block !important; color: var(--white); font-size: 0.8888888888888889rem; font-weight: 600; line-height: 162.5%; opacity:0; visibility:hidden; transition: all .3s; letter-spacing: -0.48px;}
#fp-nav ul li a.active .fp-tooltip {opacity:1; visibility:visible; transition: all .3s;}
#fp-nav ul li:last-of-type {display: block !important;}

/* #fp-nav.on_ver ul li a .fp-tooltip {color:var(--white) !important;} */
#fp-nav.on_ver ul li a span:not([class])::after {background:var(--basic); }
#fp-nav.on_ver ul li a.active .fp-tooltip {color:var(--main);}
#fp-nav.on_ver ul li a.active span:not([class])::after {background:var(--main) !important;}


.organ_wrap {}
.organ_wrap .ceo {width:170px; aspect-ratio: 1 / 1; border:1px solid var(--main); border-radius:100%; margin:0 auto 50px; position:relative; z-index:10; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; color:var(--white);}
.organ_wrap .ceo::before {content:''; width:1px; height:25px; background:var(--border); position:absolute; bottom:-1px; left:50%; transform:translateY(100%);}
.organ_wrap .ceo::after {content:''; width:calc(100% - 20px); aspect-ratio: 1 / 1; border-radius:inherit; background:var(--main) /*url("/about/img/ci_svg.png")no-repeat bottom right*/; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:-1;}
.organ_wrap .two_depth {position:relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-gap:30px;}
.organ_wrap .two_depth::after {content:''; width: calc(100% - ((100% - 60px) / 3)); height:1px; background:var(--border); position:absolute; top:-25px; left:50%; transform:translateX(-50%);}
.organ_wrap .two_depth dl {text-align:center; }
.organ_wrap .two_depth dl dt {background:var(--blue); color:var(--white); font-weight: 600; }
.organ_wrap .two_depth dl .fs16 {position:relative;padding:15px; box-sizing:border-box; border-radius: 10px; }
.organ_wrap .two_depth dl .fs16::before {content:''; width:1px; height:25px; background:var(--border); position:absolute; top:0; left:50%; transform:translateY(-100%);}
.organ_wrap .two_depth dl .fs16::after {content:''; width:5px; aspect-ratio: 1 / 1; border-radius:100%; background:Var(--border); position:absolute; top:-24px; left:50%; transform:translate(-50%,-50%);}
.organ_wrap .two_depth dl dd {position:relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-gap:30px ; margin:50px 0 0;}
.organ_wrap .two_depth dl dd::before {content:''; width:1px; height:25px; background:var(--border); position:absolute; top:-25px; left:50%; transform:translateY(-100%);}
.organ_wrap .two_depth dl dd::after {content:''; width: calc(100% - ((100% - 30px) / 2)); height:1px; background:var(--border); position:absolute; top:-25px; left:50%; transform:translateX(-50%);}
.organ_wrap .two_depth dl dd b.fs16 {display:block; color:var(--blue); border:1px solid var(--blue); background: #E8EDF9;}
.organ_wrap .two_depth dl dd p.fs16 {color:var(--black); border:1px solid var(--border); background: var(--white); margin:10px 0 0;}
.organ_wrap .two_depth dl dd p.fs16::before {height:10px;}
.organ_wrap .two_depth dl dd p.fs16::after {display:none;}


#timeline {}
#timeline .basic_in {display:flex; flex-wrap:wrap; align-items:flex-start;}
#timeline .basic_in .tit_wrap {width:50%; padding-right:5%; box-sizing:border-box; text-align:left; position:sticky; top:180px; left:0;}
#timeline .basic_in .tit_wrap .fs56, #timeline .basic_in .tit_wrap .fs18 {color:var(--white);}
#timeline .basic_in .timeline_list {width:50%; border-top:1px solid rgba(255,255,255,0.2);}
#timeline .basic_in .timeline_list .tline {padding:30px; border-bottom:1px solid rgba(255,255,255,0.2);}
#timeline .basic_in .timeline_list .tline .fs24 {color:var(--white); font-weight: 700; font-family:var(--eng); margin:0 0 10px;}
#timeline .basic_in .timeline_list .tline ul {}
#timeline .basic_in .timeline_list .tline ul li {display:flex; gap:10px;}
#timeline .basic_in .timeline_list .tline ul li+li {margin:5px 0 0;}
#timeline .basic_in .timeline_list .tline ul li span {flex-shrink: 0; color:var(--white);}
#timeline .basic_in .timeline_list .tline ul li p {flex:1; color:var(--white);}


/* ===================================================
   ✨ 화면 전환 딜레이가 적용된 basic_in 통디졸브
=================================================== */

/* 1. 기본 상태: 투명하고 40px 아래로 내려둠 */
.section .basic_in {
    opacity: 0;
    transform: translateY(40px);
    /* 화면이 넘어가는 도중 미리 오픈되는 것을 방지하기 위해 기본 transition을 초기화합니다 */
    transition: opacity 0.8s cubic-bezier(0.25, 1, 0.5, 1), transform 0.8s cubic-bezier(0.25, 1, 0.5, 1);
    will-change: transform, opacity;
}

/* 2. 활성화 상태: .action 클래스가 붙고 0.4초 후에 부드럽게 등장 */
.section.action .basic_in {
    opacity: 1;
    transform: translateY(0);
    /* 0.4초 딜레이를 주어 풀페이지 스크롤이 거의 끝난 시점에 애니메이션이 시작되도록 합니다 */
    transition-delay: 0.4s; 
}

/* --------------------------------------------------------
   3. 예외 처리: footer 내부의 basic_in은 애니메이션 제외
-------------------------------------------------------- */
.section .footer .basic_in,
.section.action .footer .basic_in {
    opacity: 1;
    transform: translateY(0); /* 이동 효과 초기화 */
    transition: none;         /* 전환 효과 초기화 */
    transition-delay: 0s;     /* 딜레이 초기화 */
}




/**** S:: 회사소개 > 회사개요 ****/
.overview_cont {display:flex; flex-wrap:wrap; align-items:center; gap:80px;}
.overview_cont .imgBox {max-width:633px; flex-shrink: 0; border-radius:20px; overflow:hidden; width:42%; aspect-ratio: 1 / 1;}
.overview_cont .imgBox img {display: block; width: 100%; height: 100%; object-fit: cover; object-position: center;}
.overview_cont .tBox {flex:1;}
.overview_cont .tBox .fs46 {margin:0 0 30px; font-weight: 300;}
.overview_cont .tBox .fs46 .point {color:var(--main); letter-spacing:inherit; line-height:inherit; font-weight:bold;}
.overview_cont .tBox .fs18 {}
.overview_cont .tBox .fs18+.fs18 {margin:30px 0 0;}

.tit_wrap {margin:0 0 50px; text-align:center;}
.tit_wrap .fs18 {margin:20px 0 0;}
#business {background:url("/about/img/business_bg.jpg")no-repeat center / cover;}
#business .tit_wrap {}
#business .tit_wrap .fs60 {color:var(--white);}
#business .tit_wrap .fs18 {color:var(--white);}

.business_list {display:flex; flex-wrap:wrap;}
.business_list li {min-height:305px; flex:1; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; }
.business_list li a {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; height:calc(100% - 60px); width:100%; background: rgba(255, 255, 255, 0.05); position:relative; transition:all 0.5s;}
.business_list li a::after {content:''; width:100%; height:100%; border-radius: 20px; background: var(--gradation); position:absolute; top:0; left:0; opacity:0; transition:all 0.5s;}
.business_list li a:hover {height:100%; background:transparent; transition:all 0.5s;}
.business_list li a:hover::after {opacity:1; transition:all 0.5s;}
.business_list li .in {width:100%; text-align:center; position:relative; z-index:10; transition:all 0.5s; }
.business_list li .in::before {content:''; width:1px; height:100px; background:rgba(255,255,255,0.1); position:absolute; top:50%; right:0; transform:translateY(-50%); transition:all 0.5s;}
.business_list li:last-of-type .in::before {display:none;}
.business_list li .in .fs20 {color:var(--white); font-weight:600; margin:15px 0 0;}
.business_list li .in::after {content:''; width:12px; aspect-ratio: 1 / 1; background:url("/about/img/arr.svg")no-repeat center / 100% auto; display:block; position:absolute; bottom:0; left:50%; transform:translateX(-50%); opacity:0; transition:all 0.5s;}
.business_list li a:hover .in {padding-bottom:57px; transition:all 0.5s;}
.business_list li a:hover .in::before {opacity:0; transition:all 0.5s;}
.business_list li a:hover .in::after {opacity:1; transition:all 0.5s;}

.business_list li:first-of-type a {border-radius:20px 0 0 20px;}
.business_list li:last-of-type a {border-radius:0 20px 20px 0;}
/**** E:: 회사소개 > 회사개요 ****/


.partner_list {display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); grid-gap:30px;}
.partner_list li {position:relative; overflow: hidden; aspect-ratio: 282 / 100; width:auto;}
.partner_list li img {display: block; width: 100%; height: 100%; object-fit: contain; object-position: center;}
.partner_list li::after {content:''; width:100%; height:100%; border:1px solid var(--border); box-sizing:border-box; border-radius:20px; position:absolute; top:0; left:0; pointer-events: none;}




/*******************************************************************************
	@media ~1500px
*******************************************************************************/
@media all and (max-width:1700px) { 

.reason_roll li {padding:20px 30px;}
.reason_roll li br {display:none;}

#organ .fs60 { font-size: 3.5294vw !important; }
.organ_wrap .fs24 { font-size: 1.4117vw !important; }
.organ_wrap .fs18 { font-size: 1.0588vw !important; }
.organ_wrap .ceo { width: 10vw; margin: 0 auto 2.9411vw; }
.organ_wrap .ceo::before { height: 1.4705vw; }
.organ_wrap .ceo::after { width: calc(100% - 1.1764vw); }
.organ_wrap .two_depth { grid-gap: 1.7647vw; }
.organ_wrap .two_depth::after { top: -1.4705vw; width: calc(100% - ((100% - 3.5294vw) / 3)); }
.organ_wrap .two_depth dl .fs18 { padding: 0.8823vw; border-radius: 0.5882vw; }
.organ_wrap .two_depth dl .fs18::before { height: 1.4705vw; }
.organ_wrap .two_depth dl .fs18::after { width: 0.2941vw; top: -1.4117vw; }
.organ_wrap .two_depth dl dd { grid-gap: 1.7647vw; margin: 2.9411vw 0 0; }
.organ_wrap .two_depth dl dd::before { height: 1.4705vw; top: -1.4705vw; }
.organ_wrap .two_depth dl dd::after { top: -1.4705vw; width: calc(100% - ((100% - 1.7647vw) / 2)); }
.organ_wrap .two_depth dl dd p.fs18 { margin: 0.5882vw 0 0; }
.organ_wrap .two_depth dl dd p.fs18::before { height: 0.5882vw; }


}
/*******************************************************************************
	@media ~1500px
*******************************************************************************/
@media all and (max-width:1500px) { 

.reason_roll li .fs22 {font-size:1.111rem;}
.reason_roll li .fs16 {font-size:0.888rem;}

}
/*******************************************************************************
	@media ~1300px
*******************************************************************************/
@media all and (max-width:1300px) { 

.overview_cont {gap:5%;}

.reason_roll li.slick-slide br {display:none;}
#process .process_list {grid-gap:15px;}
#process .process_list dl {padding:20px; gap:0 15px;}
#process .process_list dl dt {width:40px;}
#process .process_list dl dt img {width:100%;}
#process .process_list dl dd .fs24 {font-size:1.111rem;}
#process .process_list dl dd .fs18 {font-size:0.8888rem;}


#main .tit_wrap .fs60 {font-size:2.55rem;}
.tit_wrap .fs18 {margin:10px 0 0;}
.reason_roll {gap:15px;}
.reason_roll li {gap:0 15px; width: calc((100% - 30px) / 3);}
.reason_roll li i img {width:40px;}



}
/*******************************************************************************
	@media 769~980px
*******************************************************************************/
@media all and (max-width:980px) { 

.section {height:auto; min-height: auto; padding:150px 0; box-sizing:border-box;}
.section .fp-overflow{height:auto; min-height: auto;}


#overview br {display:none;}
#overview .basic_in {padding-left:0; }
#process .process_list dl {gap:0 15px; align-items:flex-start; padding:20px;}
#process .process_list dl dt {width:100%; margin:0 0 10px;}
#process .process_list dl dt img {width:40px;}


.tit_wrap br {display:none;}

.overview_cont {align-items:flex-start;}
.overview_cont .tBox .fs46 {margin:0 0 20px;}
.overview_cont .tBox .fs18+.fs18 {margin:20px 0 0;}


.business_list li .in i img {max-width:50px;}

.reason_roll .slick-list {margin-left:-20px;}
.reason_roll li.slick-slide {margin-left:20px;}


#organ .fs60 { font-size: 2.8rem !important; }
.organ_wrap .fs24 { font-size: 1.333333333333333rem !important; }
.organ_wrap .fs18 { font-size: 1rem !important; }
.organ_wrap .ceo { width: 98px; margin: 0 auto 28.82px; }
.organ_wrap .ceo::before { height: 14.41px; }
.organ_wrap .ceo::after { width: calc(100% - 11.53px); }
.organ_wrap .two_depth { grid-gap: 17.29px; }
.organ_wrap .two_depth::after { top: -14.41px; width: calc(100% - ((100% - 34.59px) / 3)); }
.organ_wrap .two_depth dl .fs18 { padding: 8.65px; border-radius: 5.76px; }
.organ_wrap .two_depth dl .fs18::before { height: 14.41px; }
.organ_wrap .two_depth dl .fs18::after { width: 2.88px; top: -13.84px; }
.organ_wrap .two_depth dl dd { grid-gap: 17.29px; margin: 28.82px 0 0; }
.organ_wrap .two_depth dl dd::before { height: 14.41px; top: -14.41px; }
.organ_wrap .two_depth dl dd::after { top: -14.41px; width: calc(100% - ((100% - 17.29px) / 2)); }
.organ_wrap .two_depth dl dd p.fs18 { margin: 5.76px 0 0; }
.organ_wrap .two_depth dl dd p.fs18::before { height: 5.76px; }


.organ_wrap .two_depth::after {    width: calc(100% - ((100% - 20px) / 3));}
.organ_wrap .two_depth {grid-gap: 10px;}
.organ_wrap .two_depth dl dd {grid-gap: 10px;}
.organ_wrap .two_depth dl dd::after {width: calc(100% - ((100% - 10px) / 2));}


.partner_list {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-gap:20px;}

}
/*******************************************************************************
	@media 481~680px
*******************************************************************************/
@media all and (max-width:680px) { 

.section {height:auto; min-height: auto !important; padding:80px 0; box-sizing:border-box;}
.section .fp-overflow{height:auto; min-height: auto !important;}


#overview .fs60 {margin:0 0 15px;}
#overview .fs18+.fs18 {margin:20px 0 0;}

.reason_roll {gap:10px;}
.reason_roll li { padding:20px; width: 100%; gap:0 15px; border-radius:10px;}
.reason_roll li i img {width:40px;}
/* .reason_roll li.slick-slide {padding:40px 20px;} */
.reason_roll li .fs20 {margin:0 0 5px;}
.reason_roll li.slick-slide::after {font-size:12px;}
.reason_roll .slick-dots {margin:20px 0 0; gap:7px;}


#process .process_list {grid-template-columns: repeat(2, minmax(0, 1fr)); grid-gap:5px;}
#process .process_list dl dd .step {font-size:12px;}
#process .process_list dl {gap:0 15px; align-items:flex-start; padding:15px; position:relative; border-radius:10px;}
#process .process_list dl dt {width:auto; margin:0 0 5px; position:absolute; top:15px; right:15px;}
#process .process_list dl dt img {width:26px;}
#process .process_list dl dd .fs24 {padding-right:30px; box-sizing:border-box;}
#process .process_list dl dd .fs18 {margin:5px 0 0;}


#timeline .bg+.basic_in {padding-top:100px;}
#timeline .basic_in .tit_wrap {width:100%;position:relative; top:0;}
#timeline .basic_in .timeline_list {width:100%;}
#timeline .basic_in .timeline_list .tline {padding:15px;}



.organ_wrap .ceo {width:100%; margin:0 auto 10px;  aspect-ratio: unset; border-radius:5px; padding:15px; box-sizing:border-box;}
.organ_wrap .ceo::before {display:none;}
.organ_wrap .ceo::after {width: calc(100% - 10px); height: calc(100% - 10px);  background-size:50% auto; aspect-ratio: unset;}
.organ_wrap .two_depth::after {display:none;}

.organ_wrap .two_depth {grid-gap: 10px; grid-template-columns: repeat(1, minmax(0, 1fr));}
.organ_wrap .two_depth dl .fs18::before {height:10px;}
.organ_wrap .two_depth dl .fs18::after {width:3px; top:-10px;}
.organ_wrap .two_depth dl dd {grid-gap: 10px;}
.organ_wrap .two_depth dl dd::after {width: calc(100% - ((100% - 10px) / 2));}
.organ_wrap .two_depth dl .fs18 {padding:12px;}
.organ_wrap .two_depth dl dd {margin:20px 0 0;}
.organ_wrap .two_depth dl dd::after {top:-10px;}
.organ_wrap .two_depth dl dd::before {height:10px; top:-10px;}



#timeline {padding:0;}

.tit_wrap {margin:0 0 30px;}
.tit_wrap .fs18 {margin:10px 0 0;}

.overview_cont .imgBox {max-width:100%; width:100%; aspect-ratio: 3 / 2; border-radius:10px;}
.overview_cont .tBox {margin:30px 0 0;}
.overview_cont .tBox .fs46 {margin:0 0 15px;}
.overview_cont .tBox .fs18+.fs18 {margin:15px 0 0;}

.business_list {border-radius:10px; overflow:hidden; gap:2px;}
.business_list li {flex:none; width:calc(50% - 1px); min-height:200px;}
.business_list li a {height:100%; border-radius:0 !important;}
.business_list li:last-of-type {width:100%;}
.business_list li .in::before {display:none;}
.business_list li a:hover .in {padding-bottom:30px; transition:all 0.5s;} 
.business_list li a::after {border-radius:10px;}

.partner_list {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-gap:5px;}
.partner_list li::after {border-radius:10px;}


}

@media all and (max-height: 800px) {

.tit_wrap {margin: 0 0 30px;}
.about_card_list dl dt {aspect-ratio: 366 / 400;}

.portfolio_list {max-width:650px; margin:0 auto; position: unset;}



}

@media all and (max-height: 700px) {

.section {height:auto; min-height: var(--fullvh); padding:150px 0;}
.section .fp-overflow{height:auto; min-height: var(--fullvh);}


}