@charset "utf-8";

/* 
* content CSS Document
* KOWEB
*/

/* sub visual */
.subVisual{ overflow: hidden; display: flex; align-items:flex-end; justify-content: center; position:relative; padding-bottom:100rem; height:500rem; color: #fff; }
.subVisual::before{ content: ''; position: absolute; inset: 0; background: no-repeat 50% / cover; }
.subVisual.about::before{ background-image:url('/images/content/subVisual1.webp'); }
.subVisual.business::before{ background-image:url('/images/content/subVisual2.webp'); }
.subVisual.recruit::before{ background-image:url('/images/content/subVisual3.webp'); }
.subVisual.board::before{ background-image:url('/images/content/subVisual4.webp') }
.subVisual.common::before{ background-image:url('/images/content/subVisual1.webp'); }
.subVisual p{display:none; align-items:flex-end; margin-bottom:35rem; font-size:var(--fs22); line-height:1; font-weight:600;}
.subVisual p span{display:block; margin:0 0 2rem 20rem; width:0; height:1px; background:#fff;}
.subVisual.about .about_p,
.subVisual.business .business_p,
.subVisual.recruit .recruit_p,
.subVisual.board .board_p{display:flex;}
.subVisual h2{font-size:80rem; line-height:1; font-weight:800; font-family:var(--font-mont);}
.subVisual.common h2{font-size:50rem;}
.subVisual.common+.lnbWrap{display:none;}
@media(prefers-reduced-motion:no-preference){
	.subVisual::before{ animation: subVisual_bg 1.8s both; }
	@keyframes subVisual_bg {
		0%{ transform: scale(1.05); }
		100%{ transform: scale(1); }
	}
	.subVisual .inr > *{ opacity: 0; animation: subVisualText .6s .2s both; }
	.subVisual .inr > *:nth-child(2){ animation-delay: .4s; }
	@keyframes subVisualText {
		0%{ transform: translateY(40rem); opacity: 0; }
		100%{ transform: translateY(0); opacity: 1; }
	}
    
    .subVisual p span{animation:subVisualSpan .6s .2s both;}
    @keyframes subVisualSpan{
        0%{width:0;}
        100%{width:100rem;}
    }
}
@media(max-width:1279px){
    .subVisual{padding-bottom:60rem; height:400rem;}
    .subVisual h2{font-size:60rem;}
    .subVisual.common h2{font-size:40rem;}
}
@media(max-width:767px){
    .subVisual p{margin-bottom:25rem;}
    .subVisual h2{font-size:45rem;}
    .subVisual.common h2{font-size:30rem;}
}


/* lnb */
.lnbWrap{border-bottom:1px solid #ddd; z-index:5;}
.lnb ul{ margin: 0 auto; font-size:0; height:65rem;}
.lnb li{display:inline-block; height:100%;}
.lnb li+li{padding-left:80rem;}
.lnb a{position:relative; display:flex; align-items:center; font-size:18rem; font-weight:500; color:#aaa; transition:0.2s; height:100%;}
.lnb a:hover{color:var(--primary);}
.lnb a.on{color:var(--primary); font-weight:bold;}
.lnb a.on::before{ content: ''; position: absolute; inset: 0; border-bottom:4rem solid currentColor; }
@media(max-width:1279px){
    .lnb li+li{padding-left:60rem;}
}
@media(max-width:767px){
	.lnb{ overflow: auto clip; white-space:nowrap; }
	.lnb ul{ display:table; margin:0 auto; table-layout:auto; overflow-y: hidden;}
	.lnb li{ display:table-cell; }
    .lnb li+li{padding-left:45rem;}
}

/* common content */
#content{ min-height:300rem; padding:120rem 0; }
.sub_title{ margin-bottom:120rem;}
.sub_title h2{text-align:center; font-size:var(--fs40); line-height:1;}

.common_table{ border-top: 2px solid #222; text-align: center; }
.common_table :is(th, td){ padding: 14rem 1em 12rem; border: 1rem solid #e5e5e5; }
.common_table col:is(:nth-of-type(1), :nth-of-type(2)){ width: 18.33333333%; }
.common_table :is(th, td):first-child{ border-left: 0; }
.common_table :is(th, td):last-child{ border-right: 0; }
.common_table :is(thead, tfoot){ background: #f6f7f9; font-size: 17rem; font-weight: 500; }
@media(max-width:1279px){
    #content{padding:100rem 0; }
    .sub_title{ margin-bottom:100rem;}
}
@media(max-width:767px){
    .sub_title h2{font-size:30rem;}
    #content{padding:80rem 0; }
    .sub_title{ margin-bottom:80rem;}
}


/* 회사소개 > 인사말 */
.grt{position:relative;}
.grtBacktxt{position:absolute; right:0; bottom:0; font-family:var(--font-mont); font-size:75rem; color:#000; opacity:0.06; text-align:end; line-height:1.1; font-weight:900;}
.grtImg{display:block;}
.grtImg img{display:block; width:100%; height:100%; object-fit:cover;}
.grtTxt{position:relative; margin-top:-140rem; font-size:0; z-index:1;}
.grtTxt h2{display:inline-block; margin-bottom:40rem; padding:40rem 50rem 0 0; font-size:var(--fs40); line-height:1.4; font-weight:600; color:#aaa; background:#fff;}
.grtTxt h2 em{font-weight:800; color:var(--primary);}
.grtTxt p{font-size:18rem; color:#555;}
.grtTxt p+p{margin-top:20rem;}
@media(max-width:1279px){
    .grtBacktxt{font-size:35rem;}
    .grtTxt{margin-top:-125rem;}
}
@media(max-width:767px){
    .grtBacktxt{display:none;}
    .grtImg{height:220rem;}
    .grtTxt{margin-top:30rem;}
    .grtTxt h2{margin-bottom:25rem; padding:0; font-size:22rem; background:none;}
    .grtTxt p > br{display:none;}
}


/* 회사소개 > 오시는 길 */
.locationMap{width:100% !important; height:540rem;}
.locationMap .wrap_map{height:100% !important;}
.locationMap .map_border,
.locationMap .wrap_controllers{display:none !important;}
.locationInfo{display:flex; align-items:center; justify-content:space-between;}
.locationInfo_add{display:flex; align-items:center; justify-content:center; padding:0 50rem; height:100rem; background:var(--primary);}
.locationInfo_add svg{display:block; margin-right:10rem; width:auto; height:22rem;}
.locationInfo_add path{fill:#fff;}
.locationInfo_add em{font-size:20rem; color:#fff;}
.locationInfo_ul{display:flex;}
.locationInfo_ul li{font-size:18rem; font-family:var(--font-mont);}
.locationInfo_ul li+li{margin-left:40rem;}
.locationInfo_ul em{display:inline-block; margin-right:5rem; font-weight:bold; color:#111;}
.locationInfo_ul a{display:inline-block; color:#555;}
@media(max-width:1279px){
    .locationMap{height:460rem;}
    .locationInfo{display:block;}
    .locationInfo_add{margin-bottom:30rem; padding:18rem 20rem; height:auto;}
    .locationInfo_ul{justify-content:center;}
}
@media(max-width:767px){
    .locationInfo_ul{display:block; padding:0 20rem;}
    .locationInfo_ul li+li{margin-left:0; margin-top:12rem;}
}


/* 회사소개 > 파트너사 */
.partnerH2{margin-bottom:40rem; font-size:var(--fs50); line-height:1.4; font-weight:600; color:#aaa;}
.partnerH2 em{font-weight:800; color:var(--primary);}
.partnerH2 > br{display:none;}
.partnerImg{display:block;}
.partnerImg img{display:block; width:100%; height:100%; object-fit:cover;}
.partnerList{display:grid; grid-template-columns:repeat(3, 1fr); gap:50rem 60rem; margin-top:60rem;}
.partnerList li{height:100rem;}
.partnerList img{display:block; margin:auto; width:65%; height:100%; object-fit:contain;}
@media(max-width:1279px){
    .partnerList li{height:80rem;}
    .partnerList img{width:80%;}
}
@media(max-width:767px){
    .partnerH2{margin-bottom:30rem; font-size:35rem;}
    .partnerH2 > br{display:block;}
    .partnerImg{height:220rem;}
    .partnerList{grid-template-columns:repeat(3, 1fr); gap:30rem 40rem; margin-top:40rem;}
    .partnerList li{height:50rem;}
    .partnerList img{width:100%;}
}
@media(max-width:580px){
    .partnerList{grid-template-columns:repeat(2, 1fr); gap:40rem;}
    .partnerList li{height:60rem;}
    .partnerList img{width:80%;}
}