/* 서브 비주얼 배경 이미지 */
#sub .bg1{ background: url("/img/sub/company_bg.jpg") no-repeat center center / cover; }
#sub .bg2{ background: url("/img/sub/technology_bg.jpg") no-repeat center center / cover; }
#sub .bg3{ background: url("/img/sub/news_bg.jpg") no-repeat center center / cover; }
#sub .bg4{ background: url("/img/sub/career_bg.jpg") no-repeat center center / cover; }
#sub .bg5{ background: url("/img/sub/contact_bg3.jpg") no-repeat center right / cover; }
#sub .bg6{ background: url("/img/sub/partnership_bg.jpg") no-repeat center center / cover; }
#sub .bg7{ background: url("/img/sub/ir_bg.jpg") no-repeat center center / cover; }

/* 서브 비주얼 */
#sub .sub-content{ padding: 60px 0 130px; }
#sub .visual .overflow{ overflow: hidden; }
#sub .bg{ padding: 150px 0 11.3%; transform: scale(1.1); animation: scale 1.5s 0.3s forwards; }
#sub .visual h2{ font-size: 8rem; font-weight: 700; color: #fff; opacity: 0; filter: blur(10px); animation: blurText 1.5s 0.5s forwards; position: absolute; top: 53%; left: 0; right: 0; transform: translateY(-50%); text-align: center; } 
#sub .visual .text-box{ width: fit-content; background: #fff; text-align: center; border-radius: 10px; padding: 10px 15px; box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.08); position: relative; z-index: 10; margin: 0 auto; margin-top: -28px; }

@keyframes scale{
	0%{ transform: scale(1.1); }
	100%{ transform: scale(1); }
}

@keyframes blurText{
	0%{ opacity: 0; filter: blur(10px); }
	100%{ opacity: 1; filter: blur(0); }
}

/* lnb */
.lnb{ display: fit-content; overflow: hidden; }
.lnb .mobile{ display: none; }
.lnb ul{ display: fit-content; display: flex; justify-content: center; align-items: center; }
.lnb > ul > li{ position: relative; }
.lnb > ul > li::after{ content: ""; width: 1px; height: 5px; background: #ccc; position: absolute; top: 50%; right: 0; transform: translateY(-50%); }
.lnb > ul > li:last-of-type::after{ display: none; }
.lnb ul li a{ display: inline-block; font-size: 1.6rem; font-weight: 400; color: #888; padding: 10px 20px; }
.lnb .depth02{ margin-left: 5px; }
.lnb .depth02 li a{ padding: 10px 15px; }

.lnb .depth02 li.on a{ font-weight: 600; color: var(--mainColor); }

@media screen and (max-width: 1500px){
	#sub .visual h2{ font-size: 6.5rem; }
	#sub .sub-content{ padding: 100px 0 100px; }
}

@media screen and (max-width: 1250px){
	#sub .visual h2{ font-size: 5rem; }
	#sub .sub-content{ padding: 30px 0 100px; }
}

@media screen and (max-width: 800px){
	#sub .visual h2{ font-size: 4rem; }
	#sub .visual .text-box{ padding: 5px 10px; margin-top: -23px; }
	.lnb ul li a{ font-size: 1.5rem; }
	.lnb ul li a{ padding: 10px; }
}

/* common */
.section-title{ text-align: center; margin-bottom: 60px; }
.section-title h3{ display: inline-block; font-size: 5rem; font-weight: 700; color: #000; position: relative; }

.section-title.border{  border-bottom: 1px solid #ddd; }
.section-title.border h3{ padding-bottom: 20px; }
.section-title.border h3::after{ content: ""; width: 100%; height: 2px; background: var(--mainColor); position: absolute; bottom: -1px; left: 50%; transform: translateX(-50%) scaleX(0); transform-origin: center center; transition: all 0.5s; transition-delay: 0.2s; } 

.section-title.left{ text-align: left; }

.section-title.aos-animate h3::after{ transform: translateX(-50%) scaleX(1); }


/* border-btn */
.border-btn{ display: inline-block; font-size: 1.8rem; font-weight: 300; color: #fff; padding: 20px 30px; position: relative; }
.border-btn::before{ content: ""; width: 55px; height: 55px; position: absolute; top: 50%; left: 0; transform: translateY(-50%); border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 100px; transition: all 0.5s; } 
.border-btn:active{ color: #fff; }
.border-btn:visited{ color: #fff; }
.border-btn:link{ color:#fff; }
.border-btn i{ margin-left: 10px; transition: all 0.8s; }

.border-btn.black{ color: #222; }
.border-btn.black::before{ border: 1px solid rgba(34, 34, 34, 0.2); }

.border-btn:hover::before{ width: 100%; border: 1px solid #fff; }  
.border-btn.black:hover::before{ border: 1px solid rgba(34, 34, 34, 1); }  
.border-btn:hover i{ margin-left: 25px; }

@media screen and (max-width: 1250px){
	.border-btn{ font-size: 1.7rem; }
	.border-btn::before{ width: 50px; height: 50px; }
}

@media screen and (max-width: 900px){
	.border-btn{ font-size: 1.5rem; padding: 15px 25px; }
	.border-btn::before{ width: 40px; height: 40px; }
}

/* 스크롤바 커스텀 */
.scroll_y{ overflow-y: scroll; } 
.scroll_y::-webkit-scrollbar{ width: 50px; }
.scroll_y::-webkit-scrollbar-thumb{ height: 20px; background: #777; border-radius: 60px; background-clip: padding-box; border: 23px solid transparent; }
.scroll_y::-webkit-scrollbar-track{ background: #f1f1f1; background-clip: padding-box; border: 24px; border: 24px solid transparent; }

/* 푸터 바로 위 영역에 회색 배경 - 페이지 내에 $bgColor = "gray-bg"; 넣기 */
#sub.gray-bg .sub-content{ padding-bottom: 0; }
#sub.gray-bg section:last-of-type{ background: #F8F8F8; padding: 80px 0 130px; }
#footer.gray-bg::after{ content: ""; width: 100%; height: 330px; background: #F8F8F8; position: absolute; top: 0; left: 0; z-index: -100; }

@media screen and (max-width: 1500px){
	#sub.gray-bg section:last-of-type{ padding: 80px 0 100px; }
	.section-title h3{ font-size: 4.5rem; }
}

@media screen and (max-width: 1250px){
	.section-title{ margin-bottom: 40px; }
	.section-title h3{ font-size: 4rem; }
	.section-title.border h3{ padding-bottom: 5px; }
}

@media screen and (max-width: 800px){
	#sub.gray-bg section:last-of-type{ padding: 60px 0 100px; }
	.section-title{ margin-bottom: 20px; }
	.section-title h3{ font-size: 3.5rem; }
}

/* 서치 폼 */
.search-box{ display: flex; justify-content: flex-end; margin-bottom: 30px; }
.search-box div{ max-width: 400px; width: 100%; height: 50px; position: relative; }
.search-box input{ width: 100%; height: 100%; border: none; border-bottom: 1px solid #ddd; font-size: 1.7rem; font-weight: 300; color: #222; padding: 0 40px 0 10px; }
.search-box input::placeholder{ color: #999; } 
.search-box button{ width: 40px; height: 40px; border: none; background: none; background: url("/img/sub/search_icon.png") no-repeat center center / auto; position: absolute; top: 50%; right: 0; transform: translateY(-50%); cursor: pointer; }

@media screen and (max-width: 1250px){
	.search-box{ margin: 40px 0 30px; }
	.search-box div{ height: 45px; }
	.search-box input{ font-size: 1.6rem; }
}


/* 리스트 페이지 */
#list .section-title{ margin-bottom: 80px; }

#list .list-box ul li{ border-bottom: 1px solid #ddd; position: relative; transition: border 0.5s; }
#list .list-box ul li:not(:first-of-type){ margin-top: 40px; }
#list .list-box ul li div{ padding: 20px 0; position: relative; }
#list .list-box ul li div::before{ content: url("/img/sub/list_arrow.png"); position: absolute; top: 50%; right: 20px; transform: translateY(-50%); opacity: 1; transition: all 0.5s; }
#list .list-box ul li div::after{ content: url("/img/sub/list_arrow_on.png"); position: absolute; top: 50%; right: 20px; transform: translateY(-50%); opacity: 0; transition: all 0.5s; }
#list .list-box ul li h5{ width: calc(100% - 60px); font-size: 3rem; font-weight: 500; color: #222; margin-bottom: 19px; /* white-space: nowrap; overflow: hidden; text-overflow: ellipsis; */ transition: all 0.5s; }
#list .list-box ul li p{ display: flex; font-size: 1.8rem; font-weight: 300; color: #555; margin-left: -15px; }
#list .list-box ul li p span{ display: inline-block; padding: 0 15px; position: relative; }
#list .list-box ul li p span::after{ content: ""; width: 1px; height: 14px; background: #EEE; position: absolute; top: 50%; right: 0; transform: translateY(-50%); }
#list .list-box ul li p span:last-of-type::after{ display: none; }
#list .list-box ul li a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 10; }

#list .list-box ul li:hover{ border-bottom: 1px solid var(--mainColor); }
#list .list-box ul li:hover div::before{ opacity: 0; }
#list .list-box ul li:hover div::after{ opacity: 1; }
#list .list-box ul li:hover h5{ color: var(--mainColor); }

#list .list-box ul li.nodata{ border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; text-align: center; }
#list .list-box ul li.nodata div{ padding: 130px 0; }
#list .list-box ul li.nodata div::before, #list .list-box ul li.nodata div::after{ display: none; }
#list .list-box ul li.nodata p{ font-size: 2.2rem; font-weight: 400; color: #555; justify-content: center; }

@media screen and (max-width: 1500px){
	#list .section-title{ margin-bottom: 60px; }
	#list .list-box ul li h5{ font-size: 2.6rem; }
	#list .list-box ul li:not(:first-of-type){ margin-top: 30px; }

	#list .list-box ul li.nodata div{ padding: 100px 0; }
	#list .list-box ul li.nodata p{ font-size: 2rem; }
}

@media screen and (max-width: 1250px){
	#list .section-title{ margin-bottom: 40px; }
	#list .list-box ul li h5{ font-size: 2.3rem; margin-bottom: 10px; }
	#list .list-box ul li p{ font-size: 1.7rem; }

	#list .list-box ul li.nodata div{ padding: 70px 0; }
	#list .list-box ul li.nodata p{ font-size: 1.8rem; }
}

@media screen and (max-width: 800px){
	#list .section-title{ margin-bottom: 20px; }
	#list .list-box ul li div{ padding: 15px 0; }
	#list .list-box ul li h5{ font-size: 2rem; margin-bottom: 5px; }
	#list .list-box ul li p{ font-size: 1.6rem; }
	#list .list-box ul li:not(:first-of-type){ margin-top: 20px; }

	#list .list-box ul li.nodata div{ padding: 40px 0; }
	#list .list-box ul li.nodata p{ font-size: 1.7rem; }
}


/* 상세 페이지 */
#view .title-box{ padding-bottom: 10px; position: relative; }
#view .title-box::after{ content: ""; width: 260px; height: 2px; background: var(--mainColor); position: absolute; bottom: -1px; left: 50%; transform: translateX(-50%) scaleX(0); transform-origin: center center; transition: all 0.5s; transition-delay: 0.2s; }
#view .title-box h5{ font-size: 3.4rem; font-weight: 700; color: #222; text-align: center; }
#view .title-box ul{ display: flex; justify-content: flex-end; }
#view .title-box ul li{ font-size: 1.6rem; font-weight: 300; color: #555; padding: 0 10px; opacity: 0; transition: all 0.5s; transition-delay: 0.2s; }
#view .content-box{ padding: 60px; border-top: 1px solid #ddd; }
#view .link-box th{ width: 160px; font-size: 2rem; font-weight: 500; color: #222; border: 1px solid #eee; border-left: none; }
#view .link-box td{ font-size: 2rem; font-weight: 300; color: #555; padding: 15px 30px; position: relative; border: 1px solid #eee; border-right: none; }
#view .link-box td p{ width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#view .link-box td a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 10; }

#view .title-box.aos-animate::after{ transform: translateX(-50%) scaleX(1); }
#view .title-box.aos-animate ul li{ opacity: 1; }

#view .right{ display: flex; justify-content: flex-end; margin-top: 30px; }
#view .right a{ display: flex; justify-content: center; align-items: center; width: 120px; height: 50px; font-size: 2rem; font-weight: 300; color: #222; border: 1px solid #EEE; transition: all 0.3s; }
#view .right a:hover{ background: var(--mainColor); border: 1px solid var(--mainColor); color: #fff; }

@media screen and (max-width: 1500px){
	#view .title-box h5{ font-size: 3rem; }
	#view .content-box{ padding: 40px; }
	#view .link-box th{ font-size: 1.8rem; }
	#view .link-box td{ font-size: 1.8rem; }
	#view .right a{ width: 100px; height: 45px; font-size: 1.8rem; }  
}

@media screen and (max-width: 1250px){
	#view .title-box h5{ font-size: 2.8rem; }
	#view .content-box{ padding: 20px; }
	#view .link-box th{ font-size: 1.7rem; }
	#view .link-box td{ font-size: 1.7rem; padding: 10px 20px; }
	#view .right{ margin-top: 20px; }
	#view .right a{ width: 90px; height: 40px; font-size: 1.7rem; }  
}

@media screen and (max-width: 800px){
	#view .title-box h5{ font-size: 2.5rem; }
	#view .title-box ul li{ font-size: 1.5rem; margin-top: 10px; }
	#view .link-box th{ width: 100px; font-size: 1.6rem; }
	#view .link-box td{ font-size: 1.6rem; }
}

/* 페이징 */
.paging{ margin-top: 40px; }
.paging, .paging .arr, .paging ul{ display: flex; justify-content: center; align-items: center; }
.paging a{ display: inline-block; padding: 5px 10px; font-size: 1.8rem; font-weight: 300; color: #222; }
.paging .arr a{ padding: 5px; }
.paging a.first i:first-of-type, .paging a.last i:first-of-type{ margin-right: -12px; }

.paging ul li.on a{ background: var(--mainColor); border-radius: 50%; }

/* Company - About Us */
#about.sub-content{ overflow: hidden; }
#about section{ position: relative; }
#about section .section-title{ margin-bottom: 50px; }
#about section .flex-box{ display: flex; justify-content: space-between; align-items: center; }

#about .img-box figure{ border-radius: 10px; overflow: hidden; }
#about .text-box p{ font-size: 2.2rem; font-weight: 300; color: #555; line-height: 1.5454; }
#about .text-box p:not(:last-of-type){ margin-bottom: 20px; } 
#about .text-box .red{ font-weight: 500; color: var(--mainColor); }

#about .about{ padding-bottom: 140px; }
#about .about::before{ content: url("/img/sub/company/about_bg01.png"); position: absolute; bottom: -80px; right: -235px; }
#about .about .img-box{ width: 38%; }
#about .about .text-box{ width: 57%; }

#about .mission::after{ content: url("/img/sub/company/about_bg01.png"); position: absolute; bottom: -85px; left: -210px; }
#about .mission .flex-box{ flex-direction: row-reverse; }
#about .mission .flex-box > div{ width: 47%; }

@media screen and (max-width: 1500px){
	#about .text-box p{ font-size: 2rem; }
	#about .text-box p:not(:last-of-type){ margin-bottom: 15px; } 
}

@media screen and (max-width: 1490px){
	#about .w1450{ padding: 0; }
}

@media screen and (max-width: 1250px){
	#about section .section-title{ margin-bottom: 40px; }
	#about section .flex-box{ align-items: flex-start; }
	#about .text-box p{ font-size: 1.9rem; }
	#about .text-box p:not(:last-of-type){ margin-bottom: 10px; }
	
	#about .about{ padding-bottom: 60px; }
}

@media screen and (max-width: 950px){
	#about section .flex-box{ flex-direction: column; }
	#about .img-box{ text-align: center; margin-bottom: 40px; } 

	#about .about{ padding-bottom: 60px; }
	#about .about .img-box{ width: 100%; }
	#about .about .text-box{ width: 100%; }
	
	#about .mission .flex-box{ flex-direction: column; }
	#about .mission .flex-box > div{ width: 100%; }
}

@media screen and (max-width: 850px){
	#about section .section-title{ margin-bottom: 20px; }
	#about .img-box{ margin-bottom: 20px; } 
}


/* Company - Leadership */
#leadership .leadership p{ font-size: 2.2rem; font-weight: 300; color: #555; text-align: center; } 

#leadership h5{ font-size: 3rem; font-weight: 600; color: #222; margin-bottom: 40px; }
#leadership ul{ display: flex; flex-wrap: wrap; margin-bottom: -50px; --width: calc((100% - 320px) / 3); position: relative; z-index: 20; }
#leadership ul li{ width: var(--width); margin-right: 160px; margin-bottom: 50px; position: relative; }
#leadership ul li:nth-of-type(3n){ margin-right: 0; }
#leadership ul li.on{ z-index: 20; }
#leadership .profile{ position: relative; }
#leadership .profile figure{ position: relative; }
#leadership .profile .info{ width: 100%; position: absolute; bottom: 0; left: 0; padding: 40px; display: flex; justify-content: space-between; align-items: flex-end; }
#leadership .profile .info dl{ width: calc(100% - 70px); color: #fff; }
#leadership .profile .info dl dt{ font-size: 2.4rem; font-weight: 700; margin-bottom: 20px; }
#leadership .profile .info dl dd{ font-size: 1.8rem; font-weight: 300; opacity: 0.7; line-height: 1.7777; }
#leadership .profile .info button{ width: 50px; height: 50px; background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 50%; }

#leadership ul li > .profile figure::after{ content: ""; width: 100%; height: 100%; background: #000; opacity: 0.1; position: absolute; top: 0; left: 0; transition: opacity 0.5s; }
#leadership ul li > .profile img{ filter: grayscale(1); transition: filter 0.5s; }

#leadership .popup{ /* width: 1701px; */ position: absolute; top: 0; left: 0; z-index: 20; left: 0; display: none; pointer-events: none; }
#leadership .popup .flex-box{ display: flex; }
#leadership .popup .profile{ width: var(--width); pointer-events: auto; }
#leadership .popup .scroll-box{ width: calc(100% - var(--width)); background: #FDFDFE; border: 1px solid #EEE; padding: 50px; padding-right: 5px; pointer-events: auto; }
#leadership .popup .scroll-box dl{ display: flex; flex-wrap: wrap; margin-bottom: 25px; }
#leadership .popup .scroll-box dl dt{ width: 100%; font-size: 2.6rem; font-weight: 700; color: #222; margin-bottom: 15px; }
#leadership .popup .scroll-box dl dd{ font-size: 2rem; font-weight: 300; color: #555; opacity: 0.7; }
#leadership .popup .scroll-box dl dd::after{ content: "/"; margin: 0 5px; }
#leadership .popup .scroll-box dl dd:last-of-type::after{ display: none; }

#leadership .popup .scroll-box p{ font-size: 2.2rem; font-weight: 300; color: #555; line-height: 1.5454; }
#leadership .popup .scroll-box p:not(:last-of-type){ margin-bottom: 15px; }

#leadership .team1{ padding: 100px 0; position: relative; z-index: 25; }

#leadership .team2 .profile .info dl dt{ margin-bottom: 0; }
#leadership .team2 .popup .scroll-box dl dt{ margin-bottom: 0; }

#leadership ul li:hover > .profile figure::after{ opacity: 0; }
#leadership ul li:hover > .profile img{ filter: grayscale(0); }

/* @media screen and (max-width: 1740px){
	#leadership .popup{ width: calc(100vw - 40px); }
} */

@media screen and (max-width: 1500px){
	#leadership .leadership p{ font-size: 2rem; }  

	#leadership h5{ font-size: 2.7rem; }
	#leadership ul{ --width: calc((100% - 200px) / 3); }
	#leadership ul li{ margin-right: 100px; }
	#leadership .profile .info{ padding: 25px; } 
	#leadership .profile .info dl dt{ font-size: 2.2rem; margin-bottom: 10px; }
	#leadership .profile .info dl dd{ font-size: 1.7rem; }

	#leadership .popup .scroll-box dl dt{ font-size: 2.4rem; }
	#leadership .popup .scroll-box dl dd{ font-size: 1.8rem; }
	#leadership .popup .scroll-box p{ font-size: 2rem; }

	#leadership .team1{ padding: 100px 0; }
}

@media screen and (max-width: 1250px){
	#leadership .leadership p{ font-size: 1.8rem; }  

	#leadership ul{ --width: calc((100% - 100px) / 3); }
	#leadership ul li{ margin-right: 50px; }

	#leadership .profile .info dl dt{ font-size: 2rem; }
	#leadership .profile .info dl dd{ font-size: 1.6rem; }

	#leadership .popup .scroll-box{ padding: 30px; }
	#leadership .popup .scroll-box dl{ margin-bottom: 20px; }
	#leadership .popup .scroll-box dl dt{ font-size: 2.2rem; margin-bottom: 5px; }
	#leadership .popup .scroll-box dl dd{ font-size: 1.7rem; }
	#leadership .popup .scroll-box p{ font-size: 1.8rem; }

	#leadership .team1{ padding: 70px 0; }
}

@media screen and (max-width: 1136px){
	#leadership .leadership p br{ display: none; }

	#leadership ul{ --width: calc((100% - 105px) / 2); }
	#leadership ul li{ margin-right: 105px; }
	#leadership ul li:nth-of-type(3n){ margin-right: 105px; }
	#leadership ul li:nth-of-type(2n){ margin-right: 0; }
}

@media screen and (max-width: 850px){
	#leadership ul{ --width: calc((100% - 50px) / 2); }
	#leadership ul li{ margin-right: 50px; }
	#leadership ul li:nth-of-type(3n){ margin-right: 50px; }
	#leadership ul li:nth-of-type(2n){ margin-right: 0; }
}

@media screen and (max-width: 700px){
	#leadership ul{ --width: calc((100% - 20px) / 2); margin-bottom: -20px; }
	#leadership ul li{ margin-right: 20px; margin-bottom: 20px; }
	#leadership ul li:nth-of-type(3n){ margin-right: 20px; }
	#leadership ul li:nth-of-type(2n){ margin-right: 0; }

	#leadership .popup .flex-box{ flex-direction: column; }
	#leadership .popup .scroll-box{ width: 100%; padding: 20px; }
	#leadership ul li:nth-of-type(2n) .popup{ margin-left: -2px; }
	#leadership ul li:nth-of-type(2n) .popup .flex-box{ align-items: flex-end; }
}

@media screen and (max-width: 650px){
	#leadership .profile .info{ padding: 15px; }
	#leadership .profile .info dl{ width: calc(100% - 55px); }
	#leadership .profile .info dl dt{ font-size: 1.8rem; }
	#leadership .profile .info dl dd{ font-size: 1.5rem; }
	#leadership .profile .info button{ width: 40px; height: 40px; }

	#leadership .popup .scroll-box dl dt{ font-size: 2rem; }
	#leadership .popup .scroll-box dl dd{ font-size: 1.6rem; }
	#leadership .popup .scroll-box p{ font-size: 1.6rem; }
}




/* Company - partnership */
#partnership .partnership p{ font-size: 2.2rem; font-weight: 300; color: #555; text-align: center; margin:0 0 30px;} 


@media screen and (max-width: 1500px){
	#partnership .partnership p{ font-size: 2rem; }  
}

@media screen and (max-width: 1250px){
	#partnership .partnership p{ font-size: 1.8rem; }  
}

@media screen and (max-width: 1136px){
	#partnership .partnership p br{ display: none; }

}


/* Technology - Our Science */
#science .section-title.border{ margin-bottom: 0; }
#science .section-title.left{ margin-bottom: 40px; }
#science section{ overflow: hidden; padding: 60px 0 100px; }
#science section .section-box:not(:last-of-type){ padding-bottom: 80px; }
#science .back{ background: #FDFDFE; border: 1px solid #EEE; border-radius: 20px; }
#science .red-dot{ font-size: 2.8rem; font-weight: 500; color: #222; padding-left: 20px; margin-bottom: 20px; position: relative; }
#science .red-dot::before{ content: ""; width: 10px; height: 10px; background: var(--mainColor); border-radius: 50%; position: absolute; top: 14px; left: 0; margin-bottom: 20px; }

#science .approach .video{ max-width: 1270px; width: 100%; margin: 0 auto; }
#science .approach .video video{ width: 100%; }
#science .approach .center{ text-align: center; margin-top: 30px; }

#science .approach p{ font-size: 2.2rem; font-weight: 300; color: #222; line-height: 1.5454; }
#science .approach .flex-box{ display: flex; justify-content: space-between; margin-top: 40px; text-align: center; }
#science .approach .slide h4{ display: inline-block; font-size: 2.8rem; font-weight: 700; color: #222; margin-bottom: 10px; text-align: center; }

#science .approach .figure-box{ width: 46.5%; padding: 60px; position: relative; }
#science .approach .figure-box::after{ content: url("/img/sub/technology/science_arrow.png"); position: absolute; top: 59%; right: -60px; z-index: 20; transform: translateY(-50%); }
#science .approach .figure-box figure{ margin-top: 30px; }
#science .approach .slide-box{ width: 51.8%; position: relative; }
#science .approach .figure-wrap, #science .approach .figure-wrap .slick-track, #science .approach .figure-wrap .slick-list, #science .approach .figure-wrap .figure{ height: 100%; }
#science .approach .figure-wrap{ width: calc(100% + ((100vw - 1700px) / 2)); position: absolute; top: 0; left: 0; }
#science .approach .figure-wrap .figure{ width: calc(((1700px / 2) / 2) + 6px); display: flex; flex-direction: column; justify-content: space-between; padding: 60px 30px; margin-right: 20px; }
#science .approach .figure-wrap .figure figure{ padding: 0 30px; }
#science .approach .figure-wrap .figure figure img{ display: inline; }  

#science .approach .box{ width: 36.5%; display: flex; flex-direction: column; justify-content: space-between; align-items: center; padding: 40px 70px; text-align: center; position: relative; }
#science .approach .box::after{ position: absolute; top: 50%; right: -20px; z-index: 20; transform: translateY(-50%); }
#science .approach .box:nth-of-type(1)::after{ content: url("/img/sub/technology/science_arrow01.png"); }
#science .approach .box:nth-of-type(2)::after{ content: url("/img/sub/technology/science_arrow02.png"); }
#science .approach .middle{ width: 27%; justify-content: center; }
#science .approach .middle span{ display: inline-block; font-size: 2.2rem; font-weight: 500; color: #fff; background: var(--mainColor); border-radius: 10px; padding: 10px 30px; margin-top: 20px; }

#science .approach .box:not(:last-of-type){ border-right: 1px dashed #ccc; }
#science .approach .box h6{ font-size: 2.2rem; font-weight: 600; color: #222; margin-bottom: 40px; }
#science .approach .box ul{ display: flex; padding: 15px 20px; border: 1px solid #EEE; border-radius: 10px; margin-top: 15px; }
#science .approach .box ul li{ font-size: 1.8rem; font-weight: 300; color: #222; }
#science .approach .box ul li::after{ margin-left: 10px; }
#science .approach .box ul.up li::after{ content: url("/img/sub/technology/science_after01.png"); }
#science .approach .box ul.down li::after{ content: url("/img/sub/technology/science_after02.png"); }
#science .approach .box ul li:not(:last-of-type){ margin-right: 25px; }

#science .approach .icon-list{ display: flex; flex-wrap: wrap; margin-top: 30px; margin-bottom: -10px; }
#science .approach .icon-list li{ font-size: 1.6rem; font-weight: 300; color: #222; margin-bottom: 10px; }
#science .approach .icon-list li:not(:last-of-type){ margin-right: 20px; }
#science .approach .icon-list li img{ margin-right: 10px; vertical-align: middle; }

#science .core .text-wrap *{ font-size: 2.2rem; font-weight: 300; color: #222;  text-align: center; }
#science .core .text-wrap h4{ font-size: 2.8rem; font-weight: 500; color: #222; }
#science .core .text-wrap ul li, #science .core .text-wrap ul li *{ font-size: 1.8rem; color: #666; }
#science .core .text-wrap ul li:not(:last-of-type){ margin-bottom: 5px; }
#science .core .text-wrap ul li span{ font-weight: 400; }
#science .core .text-wrap p.gray{ margin-top: 15px; }

#science .relative{ position: relative; }
#science .img-wrap{ padding: 30px 0; margin: 40px 0 20px; overflow: hidden; }
#science .img-wrap .img{ width: calc(1700px - 170px); }
#science .img-wrap .img div{ display: inline-block; position: relative; left: 0; transform: translateX(0); opacity: 0.2; transition: all 0.5s; }
#science .img-wrap .img div.flex{ width: fit-content; display: flex; align-items: center; }
#science .img-wrap .img ul{ margin-left: 40px; margin-bottom: -95px; }
#science .img-wrap .img ul li{ font-size: 2rem; font-weight: 400; color: #222; padding-left: 15px; position: relative; }
#science .img-wrap .img ul li::before{ content: ""; width: 4px; height: 4px; background: #222; border-radius: 50%; position: absolute; top: 12px; left: 0; }

#science .button{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; justify-content: space-between; padding: 0 200px; }
#science .button button{ width: 100px; height: 100px; background: rgba(248, 248, 248, 0.3); border: 1px solid rgba(34, 34, 34, 0.3); border-radius: 50%; transition: all 0.5s; }

#science .img-wrap .img.reverse div{ left: 100%; transform: translateX(-100%); }
#science .img-wrap .img.slick-center div{ left: 50%; transform: translateX(-50%); opacity: 1; }
#science .button button.none{ opacity: 0.5; }

#science .references ul li{ display: flex; font-size: 1.8rem; font-weight: 300; color: #555; }
#science .references ul li p{ margin-left: 10px; line-height: 1.4545; }
#science .references ul li p span{ text-decoration: underline; text-decoration-thickness: from-font; }

@media screen and (max-width: 1740px){
	#science .approach .figure-box{ padding: 50px; }
	#science .approach .figure-wrap{ width: calc((100vw / 2) + 25px); }
	#science .approach .figure-wrap .figure{ width: calc((100vw / 4) - 20px); }

	#science .img-wrap .img{ width: calc((100vw - 40px) - 170px); }
}

@media screen and (max-width: 1520px){
	#science .approach .figure-wrap .figure{ padding: 50px 20px; }
}

@media screen and (max-width: 1500px){
	#science .red-dot{ font-size: 2.5rem; }
	#science .red-dot::before{ top: 12px; }
	#science .approach p{ font-size: 2rem; }
	#science .approach .slide h4{ font-size: 2.5rem; }
	#science .approach .box{ padding: 40px; }
	#science .approach .middle span{ font-size: 2rem; }

	#science .core .text-wrap *{ font-size: 2rem; }
	#science .core .text-wrap h4{ font-size: 2.5rem; }
	
	#science .img-wrap .img ul li{ font-size: 1.8rem; }  

	#science .button{ padding: 0 150px; }
	#science .button button{ width: 80px; height: 80px; }
}

@media screen and (max-width: 1450px){
	#science .approach .box ul{ flex-direction: column; }
	#science .approach .box ul li:not(:last-of-type){ margin-right: 0; margin-bottom: 10px; }
}

@media screen and (max-width: 1320px){
	#science .approach .figure-wrap .figure{ padding: 50px 15px; }
}

@media screen and (max-width: 1250px){
	#science section{ padding: 60px 0 80px; }
	#science .section-title.left{ margin-bottom: 20px; }
	#science section .section-box:not(:last-of-type){ padding-bottom: 60px; }
	#science .red-dot{ font-size: 2.3rem; margin-bottom: 20px; }
	#science .red-dot::before{ top: 11px; }
	#science .approach .flex-box{ margin-top: 20px; }
	#science .approach p{ font-size: 1.8rem; }
	#science .approach .middle span{ font-size: 1.8rem; padding: 10px 20px; }

	#science .approach .figure-box figure{ margin-top: 20px; }
	#science .approach .slide h4{ font-size: 2.1rem; }
	#science .approach .box h6{ font-size: 2rem; }
	#science .approach .box ul li{ font-size: 1.7rem; }

	#science .relative{ padding-bottom: 80px; }  
	#science .button{ justify-content: center; top: calc(100% - 10px); transform: translate(-50%, -100%); }
	#science .button button{ width: 60px; height: 60px; }
	#science .button button:not(:last-of-type){ margin-right: 20px; }

	#science .core .text-wrap *{ font-size: 1.8rem; }
	#science .core .text-wrap h4{ font-size: 2.3rem; }
	#science .core .text-wrap ul li, #science .core .text-wrap ul li *{ font-size: 1.6rem; }

	#science .img-wrap{ margin: 20px 0 10px; }

	#science .references ul li{ font-size: 1.6rem; }
}

@media screen and (max-width: 1100px){
	#science .approach .flex-box{ flex-direction: column; }
	#science .approach .figure-box{ width: 100%; display: flex; flex-direction: column; align-items: center; margin-bottom: 20px; }
	#science .approach .figure-box figure{ width: 60%; }
	#science .approach .figure-box::after{ top: calc(100% - 25px); right: 50%; transform: translateX(50%) rotate(90deg); }
	#science .approach .slide-box{ width: 100%; }
	#science .approach .figure-wrap{ width: 100%; position: static; }
	#science .approach .figure-wrap, #science .approach .figure-wrap .slick-track, #science .approach .figure-wrap .slick-list, #science .approach .figure-wrap .figure{ height: auto; }
	#science .approach .figure-wrap .slick-list{ overflow: visible; margin-left: 0px; }
	#science .approach .figure-wrap .slick-track{ display: flex; }
	#science .approach .figure-wrap .figure{ width: calc((100vw - 95px) / 3); padding: 40px 15px; }

	#science .approach .box{ width: 100%; }
	#science .approach .middle{ width: 100%; }
	#science .approach .box:not(:last-of-type){ border-right: none; border-bottom: 1px dashed #ccc; }
	#science .approach .box::after{ top: calc(100% - 10px); right: 50%; transform: translateX(50%) rotate(90deg); }
	#science .approach .box ul{ flex-direction: row; }
	#science .approach .box ul li:not(:last-of-type){ margin-right: 20px; margin-bottom: 0; }
	#science .approach .box h6{ margin-bottom: 20px; }

	#science .img-wrap .img{ width: calc(100vw - 60px); padding: 0 30px; } 
	#science .img-wrap .img div.flex{ width: auto; flex-direction: column; }
	#science .img-wrap .img ul{ margin-left: 0; margin-bottom: 0; margin-top: 20px; }

} 

@media screen and (max-width: 900px){
	#science .approach .center{ margin-top: 15px; }
	
	#science .approach .figure-box{ padding: 40px; }
	#science .approach .figure-box::after{ transform: translateX(50%) rotate(90deg) scale(0.8); }
	#science .approach .figure-box figure{ width: 100%; }
	#science .approach .figure-wrap .figure{ width: calc((100vw - 95px) - ((100vw - 95px) / 3)); }

	#science .approach .box{ padding: 30px; }
	#science .approach .middle{ padding: 40px; }
	#science .approach .box ul{ flex-direction: column; padding: 10px 20px; }
	#science .approach .box ul li:not(:last-of-type){ margin-right: 0; margin-bottom: 10px; }
}

@media screen and (max-width: 800px){
	#science .red-dot{ font-size: 2rem; }

	#science .approach p{ font-size: 1.7rem; }
	#science .approach .box h6{ font-size: 1.8rem; }

	#science .core .text-wrap h4{ font-size: 2.1rem; }
	#science .core .text-wrap *{ font-size: 1.7rem; }
	#science .core .text-wrap ul li, #science .core .text-wrap ul li *{ font-size: 1.5rem; }

	#science .references ul li{ font-size: 1.5rem; }
}


/* Technology - Pipeline */
#pipeline section{ overflow: hidden; }
#pipeline h5{ font-size: 2.8rem; font-weight: 500; color: #222; line-height: 1.3571; text-align: center; margin-bottom: 20px; }
#pipeline p{ font-size: 2.2rem; font-weight: 300; color: #555; line-height: 1.5454; }

#pipeline .table-box{ margin-top: 80px; border-top: 1px solid var(--mainColor); }
#pipeline .table-box thead{ border-bottom: 1px solid rgba(191, 30, 46, 0.2); }
#pipeline .table-box thead th{ font-size: 1.8rem; font-weight: 600; color: #222; background: #F6F6F6; border-right: 1px solid #eee; padding: 20px; }
#pipeline .table-box thead th:first-of-type{ border-left: 1px solid #eee; }
#pipeline .table-box thead th.big{ width: 15%; }
#pipeline .table-box thead th.middle{ width: 9.2%; }
#pipeline .table-box thead th.small{ width: 7%; }

#pipeline .table-box tbody th, #pipeline .table-box tbody td{ font-size: 1.6rem; font-weight: 300; color: #222; text-align: center; padding: 20px; border: 1px solid #eee; }
#pipeline .table-box tbody th{ font-weight: 600; }
#pipeline .table-box tbody td:nth-of-type(2){ border-right: none; }
#pipeline .table-box tbody td:nth-of-type(3), #pipeline .table-box tbody td:nth-of-type(4){ border-left: none; border-right: none; }
#pipeline .table-box tbody td.gauge{ padding: 20px 0; }
#pipeline .table-box tbody td.gauge div{ width: var(--gauge); height: 20px; background: var(--color); border-radius: 0 20px 20px 0; transform: scaleX(0); transform-origin: left; transition: all 2s; transition-delay: inherit; }

#pipeline ul{ margin-top: 10px; }
#pipeline ul li{ font-size: 1.8rem; font-weight: 300; color: #666; text-align: right; }
#pipeline ul li:not(:last-of-type){ margin-bottom: 5px; }

#pipeline .table-box tbody td.aos-animate div{ transform: scaleX(1); }

@media screen and (max-width: 1600px){
	#pipeline p br{ display: none; }
}

@media screen and (max-width: 1550px){
	#pipeline .table-box thead th{ padding: 20px 10px; }
	/* #pipeline .table-box thead th.small{ width: 11%; } */
}

@media screen and (max-width: 1500px){
	#pipeline h5{ font-size: 2.5rem; }
	#pipeline p{ font-size: 2rem; }

	#pipeline .table-box thead th{ font-size: 1.7rem; }

	#pipeline ul li{ font-size: 1.7rem; }
}

@media screen and (max-width: 1300px){
	#pipeline .table-box{ overflow-x: scroll; }
	#pipeline .table-box::-webkit-scrollbar{ height: 25px; }
	#pipeline .table-box::-webkit-scrollbar-thumb{ width: 20px; background: #777; border-radius: 60px; background-clip: padding-box; border: 10px solid transparent; }
	#pipeline .table-box::-webkit-scrollbar-track{ background: #f1f1f1; background-clip: padding-box; border-radius: 60px; border: 12px; border: 12px solid transparent; }
	#pipeline .table-box table{ width: 1300px; }
}

@media screen and (max-width: 1250px){
	#pipeline h5{ font-size: 2.2rem; }
	#pipeline p{ font-size: 1.8rem; }

	#pipeline .table-box{ margin-top: 40px; }
}

@media screen and (max-width: 800px){
	#pipeline h5 br{ display: none; }
}

/* news - media */
#media .section-title{ margin-bottom: 70px; }
#media .media-box ul{ display: flex; flex-wrap: wrap; }
#media .hover-list li{ cursor: pointer; }
#media .media-box li{ width: calc((100% - 120px) / 4); margin-right: 40px; margin-bottom: 65px; position: relative; text-align: center; }
#media .media-box li:nth-of-type(4n){ margin-right: 0; }
#media .media-box figure{ padding-bottom: 74%; }
#media .hover-list li figure{ width: 100%; display: inline-block; margin: 0; text-align: center; position: relative; overflow: hidden; border-radius: 10px; }
#media .hover-list li figure::before{ content: ""; width: 0; height: 0; position: absolute; top: 50%; left: 50%; z-index: 5; transform: translate(-50%, -50%); background: rgba(195, 13, 35, 0.7); border-radius: 50%; transition: 0.8s; backdrop-filter: blur(4px); }
#media .hover-list li figure::after{ content: "VIEW MORE"; display: inline-block; font-size: 1.6rem; font-weight: 500; color: #fff; padding-top: 70px; background: url("/img/sub/view_more.png") no-repeat top center / auto; opacity: 0; position: absolute; top: 60%; left: 50%; z-index: 10; transform: translate(-50%, -50%); transition: 0.5s; transition-delay: 0.3s; }
#media .hover-list li img{ width: 100%; height: 100%; object-fit: cover; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#media .hover-list li p{ width: 100%; font-size: 1.8rem; font-weight: 500; color: #222; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding: 0 15px; text-align: center; margin-top: 20px; margin-bottom: 5px; }
#media .hover-list li span{ font-size: 1.6rem; font-weight: 300; color: #555; }
#media .media-box li a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 20; }

#media .hover-list li:hover p{ color: var(--mainColor); }
#media .hover-list li:hover figure::before{ width: 160%; height: 160%; }
#media .hover-list li:hover figure::after{ opacity: 1; top: 50%; }

@media screen and (max-width: 1450px){
	#media .media-box li{ width: calc((100% - 80px) / 3); }
	#media .media-box li:nth-of-type(4n){ margin-right: 40px; }
	#media .media-box li:nth-of-type(3n){ margin-right: 0; }
}

@media screen and (max-width: 1250px){
	#media .section-title{ margin-bottom: 40px; }
}

@media screen and (max-width: 1200px){
	#media .media-box li{ margin-bottom: 30px; }
	#media .flex-box{ flex-direction: column; align-items: flex-start; padding-bottom: 20px; }
	#media .search-box{ width: 100%; text-align: right; margin-top: 30px; }
}

@media screen and (max-width: 1000px){
	#media .hover-list li span{ font-size: 1.5rem; }
}

@media screen and (max-width: 900px){
	#media .media-box li{ width: calc((100% - 20px) / 2); margin-right: 20px; }
	#media .media-box li:nth-of-type(3n){ margin-right: 20px; }
	#media .media-box li:nth-of-type(2n){ margin-right: 0; }
}


/* Contact */
#contact{ overflow: hidden; }
#contact .contact{ padding-bottom: 100px; }
#contact .contact .flex-box{ display: flex; justify-content: space-between; }
#contact .contact .image-box{ width: 52.3%; overflow: hidden; border-radius: 10px; }
#contact .contact .image-box figure{ width: 100%; position: relative; padding-bottom: 70.5%; margin-bottom: -5px; }
#contact .contact .image-box figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#contact .contact .list-box{ width: calc(47.7% - 20px); }
#contact .contact .list-box li{ height: calc((100% - 10px) / 3); border-radius: 10px; border: 1px solid rgba(204, 204, 204, 0.6); }
#contact .contact .list-box li > div{ height: 100%; display: flex; justify-content: space-between; align-items: center; background: #F7F7F7; border-radius: 10px; border: 3px solid transparent; padding: 0 50px; transition: all 0.5s; transition: all 0.5s; }
#contact .contact .list-box li:not(:last-of-type){ margin-bottom: 5px; }
#contact .contact .list-box dl dt{ font-size: 2.6rem; font-weight: 700; color: #222; text-transform: uppercase; margin-bottom: 15px; }
#contact .contact .list-box dl dd{ font-size: 2rem; font-weight: 400; color: #666; }

/* 240807 */
#contact .contact .list-box li{ height: calc((100% - 15px) / 4); }

#contact .contact .list-box li .icon{ position: relative; }
#contact .contact .list-box li .icon .hover{ width: 100%; position: absolute; top: 50%; left: 50%; z-index: 5; transform: translate(-50%, -50%); opacity: 0; transition: all 0.5s; } 

#contact .contact .list-box li:hover{ border: 1px solid transparent; }
#contact .contact .list-box li:hover > div{ border: 3px solid var(--mainColor); }
#contact .contact .list-box li:hover .icon .hover{ opacity: 1; }

#contact .location .section-title{ margin-bottom: 40px; }
#contact .location .iframe-box{ border-radius: 10px; overflow: hidden; }
#contact .location .iframe-box iframe{ width: 100%; height: 500px; }

#contact .location dl{ display: flex; align-items: center; font-size: 2.2rem; margin-top: 30px; }
#contact .location dl dt{  font-weight: 500; color: #222; margin-right: 20px; }
#contact .location dl dd{ display: flex; flex-wrap: wrap; align-items: center; font-weight: 300; color: #555; }
#contact .location ul{ display: flex; margin-left: 30px; }
#contact .location ul li{ position: relative; }
#contact .location ul li:not(:last-of-type){ margin-right: 10px; }
#contact .location ul li span{ display: flex; justify-content: center; align-items: center; width: 28px; height: 28px; border-radius: 50%; border: 1px solid #aaa; font-size: 1.7rem; color: #aaa; transition: all 0.5s; }
#contact .location ul li a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; }

#contact .location ul li:hover span{ border: 1px solid var(--mainColor); color: var(--mainColor); }

@media screen and (max-width: 1500px){
	#contact .contact{ padding-bottom: 100px; }  
	#contact .contact .image-box, #contact .contact .list-box{ width: calc((100% - 20px) / 2); }
	#contact .contact .list-box li > div{ padding: 0 30px; }
}

@media screen and (max-width: 1250px){
	#contact .contact .list-box dl dt{ font-size: 2rem; margin-bottom: 5px; }
	#contact .contact .list-box dl dd{ font-size: 1.8rem; }

	#contact .location dl{ font-size: 1.9rem; margin-top: 10px; }
}

@media screen and (max-width: 1000px){
	#contact .contact .flex-box{ flex-direction: column; }
	#contact .contact .image-box, #contact .contact .list-box{ width: 100%; }
	#contact .contact .image-box{ margin-bottom: 20px; }
	#contact .contact .list-box li > div{ height: auto; padding: 30px; }
	#contact .contact .list-box li:not(:last-of-type){ margin-bottom: 20px; }
}

@media screen and (max-width: 800px){
	#contact .contact{ padding-bottom: 80px; }  
	#contact .contact .list-box li > div{ padding: 20px; }
	#contact .contact .list-box dl dt{ font-size: 1.8rem; }
	#contact .contact .list-box dl dd{ font-size: 1.6rem; }

	#contact .location .section-title{ margin-bottom: 20px; }
	#contact .location dl{ font-size: 1.8rem; }
}

@media screen and (max-width: 700px){
	#contact .location .iframe-box iframe{ height: 400px; }
	#contact .location dl{ flex-direction: column; align-items: flex-start; }  
	#contact .location dl dt{ margin-bottom: 5px; }
	#contact .location ul{ width: 100%; margin-left: 0; margin-top: 10px; } 
}

@media screen and (max-width: 550px){
	#contact .contact .list-box li > div{ flex-direction: column-reverse; }
	#contact .contact .list-box dl{ width: 100%; margin-top: 20px; text-align: center; }
}


/* Career - Career */
#list.career .section-title{ margin-bottom: 0; }

#career{ background: #F7F7F7; border: 1px solid #DDD; padding: 35px; margin: 60px 0; text-align: center; }
#career h4{ font-size: 3rem; font-weight: 700; color: var(--mainColor); margin-bottom: 20px; }
#career p{ font-size: 2.2rem; font-weight: 400; color: #000; }
#career p a{ color: #000; text-decoration: underline; }

@media screen and (max-width: 1500px){
	#career h4{ font-size: 2.6rem; margin-bottom: 15px; }
	#career p{ font-size: 2rem; }
}

@media screen and (max-width: 1250px){
	#career{ padding: 30px; margin: 40px 0; }
	#career h4{ font-size: 2.4rem; margin-bottom: 10px; }
	#career p{ font-size: 1.8rem; }
}

@media screen and (max-width: 870px){
	#career br{ display: none; }
}

@media screen and (max-width: 800px){
	#career{ padding: 30px 20px; }
	#career h4{ font-size: 2.2rem; }
	#career p{ font-size: 1.7rem; }
}

/* Career - Career(상세) */
#view.career .title-box ul li{ position: relative; }
#view.career .title-box ul li::after{ content: ""; width: 1px; height: 12px; background: #DDD; position: absolute; top: 50%; right: -1px; transform: translateY(-50%); }
#view.career .title-box ul li:last-of-type::after{ display: none; }


/* Partnership - Partnership */
#partnership.sub-content{ padding-bottom: 0; }
#partnership .intro{ padding-bottom: 140px; }
#partnership .intro .text-box{ text-align: center; }
#partnership .intro .text-box p{ font-size: 2.8rem; font-weight: 500; color: #222; line-height: 1.3571; }
#partnership .intro .text-box dl{ margin-top: 20px; }
#partnership .intro .text-box dl *{ display: inline; font-size: 2.2rem; font-weight: 300; color: #555; line-height: 1.5454; }
#partnership .intro .text-box dl dt{ font-weight: 500; }
#partnership .intro figure{ width: 100%; text-align: center; margin-top: 160px; }

#partnership .logos{ background: #F8F8F8; padding: 80px 0 130px; }
#partnership .logos .logo-box:not(:last-of-type){ margin-bottom: 140px; }
#partnership .logos .logo-list{ display: flex; flex-wrap: wrap; margin-bottom: -13px; }
#partnership .logos .logo-list li{ width: calc((100% - 39px) / 4); margin-right: 13px; margin-bottom: 13px; }
#partnership .logos .logo-list li:nth-of-type(4n){ margin-right: 0; }
#partnership .logos .logo-list li figure{ display: flex; justify-content: center; align-items: center; width: 100%; height: 150px; background: #fff; border: 1px solid #EEE; padding: 20px; }

@media screen and (max-width: 1500px){
	#partnership .intro{ padding-bottom: 100px; }
	#partnership .intro .text-box p{ font-size: 2.5rem; }
	#partnership .intro .text-box dl *{ font-size: 2rem; }
	#partnership .intro figure{ margin-top: 100px; }

	#partnership .logos{ padding: 80px 0 100px; }
	#partnership .logos .logo-box:not(:last-of-type){ margin-bottom: 100px; }
	#partnership .logos .logo-list li figure{ height: 130px; }
}

@media screen and (max-width: 1250px){
	#partnership .intro .text-box p{ font-size: 2.2rem; }
	#partnership .intro .text-box dl *{ font-size: 1.8rem; }

	#partnership .logos .logo-list li{ width: calc((100% - 26px) / 3); }
	#partnership .logos .logo-list li:nth-of-type(4n){ margin-right: 13px; }
	#partnership .logos .logo-list li:nth-of-type(3n){ margin-right: 0; }
}

@media screen and (max-width: 1000px){
	#partnership .intro figure{ margin-top: 60px; }

	#partnership .logos .logo-list li figure{ height: 115px; } 
}

@media screen and (max-width: 800px){
	#partnership .intro{ padding-bottom: 80px; }
	#partnership .intro .text-box p{ font-size: 2rem; }  
	#partnership .intro .text-box p br{ display: none; }  

	#partnership .logos{ padding: 50px 0 80px; }
	#partnership .logos .section-title h3{ font-size: 3rem; }
	#partnership .logos .logo-box:not(:last-of-type){ margin-bottom: 60px; }
	#partnership .logos .logo-list li figure{ height: 100px; } 
	#partnership .logos .logo-list li{ width: calc((100% - 13px) / 2); }
	#partnership .logos .logo-list li:nth-of-type(3n){ margin-right: 13px; }
	#partnership .logos .logo-list li:nth-of-type(2n){ margin-right: 0; }
}