@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.jpg'); }
.subVisual.prd::before{background-image:url('/images/content/subVisual2.jpg'); }
.subVisual.status::before{background-image:url('/images/content/subVisual3.jpg'); }
.subVisual.board::before{background-image:url('/images/content/subVisual4.jpg'); }
.subVisual.common::before{background-image:url('/images/content/subVisual1.jpg'); }
.subVisual .inr{display:flex; align-items:flex-end; justify-content:space-between;}
.subVisual_navi > div{display:flex; align-items:center;}
.subVisual_navi > div img{display:block; width:16rem; opacity:0.7;}
.subVisual_navi > div p{position:relative; margin-top:2rem; margin-left:8rem; padding-left:22rem;  font-size:16rem; color:#fff; opacity:0.7; line-height:1;}
.subVisual_navi > div p:before{content:''; display:block; position:absolute; left:0; top:2rem; width:8rem; height:8rem; border-top:2px solid #fff; border-right:2px solid #fff; transform:rotate(45deg); opacity:0.5;}
.subVisual_navi h2{margin-top:30rem; font-size:var(--fs50);  line-height:1;}
/* lnb */
.lnb{text-align:center; font-size:18rem; font-weight:500; z-index:5; }
.lnb ul{margin:0 auto;}
.lnb li{display:inline-block; padding:0 30rem;}
.lnb li:first-child{padding-left:0 !important;}
.lnb li:last-child{padding-right:0 !important;}
.lnb a{position:relative; display:flex; align-items:center; padding-top:12rem; color:#fff; opacity:0.6; line-height:1; transition:0.2s;}
.lnb a:hover,
.lnb a.on{font-weight:bold; opacity:1;}
.lnb a.on{border-top:2px solid #fff;}
@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; }
	}
}
@media(max-width:1279px){
    .subVisual{padding-bottom:60rem; height:360rem;}
    .subVisual_navi h2{margin-top:20rem;}
    .lnb li{display:inline-block; padding:0 20rem;}
}
@media(max-width:767px){
    .subVisual{padding-bottom:50rem;}
    .subVisual .inr{display:block;}
	.lnb{ overflow: auto clip; white-space:nowrap; }
	.lnb ul{ display:table; margin:30rem 0 0; table-layout:auto; overflow-y: hidden;}
	.lnb li{ display:table-cell; }
}


/* common content */
#content{min-height:300rem; padding:120rem 0;}
.sub_title{ margin-bottom: 3.75em;}
.sub_title h2{ text-align:center; font-size:var(--fs35); }
h2.subTit01{position:relative; margin-bottom:30rem; padding-left:16rem; font-size:var(--fs28); color:#000;}
h2.subTit01:before{content:''; display:block; position:absolute; left:0; top:6rem; width:6rem; height:30rem; background:var(--primary);}

.mt100{margin-top:100rem;}

ul.list1{display:grid;}
ul.list1 li{padding:20rem; border:1px solid #ddd;}
ul.list1 em{display:block; position:relative; padding-left:15rem; font-size:20rem; color:#111; font-weight:600; transition:0.2s ease;}
ul.list1 em:before{content:'·'; display:block; position:absolute; left:0; top:0; font-weight:900; transition:0.2s ease;}
ul.list1 p{margin-top:6rem; padding-left:15rem; font-size:18rem; color:#444;}
ul.list1.grid4{grid-template-columns:repeat(4, 1fr); gap:40rem;}

.common_table{ border-top: 2px solid #222; text-align: center; width:100%; table-layout:fixed;}
.common_table :is(th, td){ padding:16rem 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:#f5f5f5; font-size: 17rem; font-weight: 500; }
@media(hover:hover){
    ul.list1 li:hover em{color:var(--primary);}
    ul.list1 li:hover em:before{color:var(--primary);}
}
@media(max-width:1279px){
    #content{padding:100rem 0;}
    h2.subTit01{margin-bottom:25rem;}
    h2.subTit01:before{height:22rem;}
    .mt100{margin-top:80rem;}
    ul.list1.grid4{grid-template-columns:repeat(3, 1fr); gap:15rem;}
}
@media(max-width:767px){
    #content{padding:80rem 0;}
    .mt100{margin-top:60rem;}
    ul.list1.grid4{grid-template-columns:repeat(2, 1fr); gap:15rem;}
    [lang="en"] ul.list1.grid4{grid-template-columns:repeat(1, 1fr); gap:15rem;}
}


/* 회사소개 > 인사말 */
.greetingsCont1{display:flex;}
.greetingsCont1_txt{padding:20rem 100rem 20rem 0; width:50%;}
.greetingsCont1_txt p{font-size:18rem; color:#444;}
.greetingsCont1_txt p+p{margin-top:16rem;}
.greetingsCont1_img{width:50%;}
.greetingsCont1_img img{display:block; width:100%; height:100%; object-fit:cover;}
.greetingsCont2_ul{display:grid; grid-template-columns:repeat(3, 1fr); gap:20rem 40rem;}
.greetingsCont2_ul li{display:flex; padding-bottom:20rem; border-bottom:1px solid #ddd; font-size:18rem; color:#444;}
.greetingsCont2_ul li em{color:#111; font-weight:bold; width:140rem;}
.greetingsCont2_ul li p{width:calc(100% - 140rem); text-align:end;}
[lang="en"] .greetingsCont2_ul li{ flex-direction: column; gap:.5ch; }
[lang="en"] .greetingsCont2_ul li em{ width:unset; }
[lang="en"] .greetingsCont2_ul li p{ width:unset; text-align:unset; }
@media(max-width:1279px){
    .greetingsCont1_txt{padding:0 50rem 0 0; width:60%;}
    .greetingsCont1_txt p > br{display:none;}
    .greetingsCont1_img{width:40%;}
    .greetingsCont2_ul{grid-template-columns:repeat(2, 1fr);}
}
@media(max-width:767px){
    .greetingsCont1{flex-direction:column-reverse;}
    .greetingsCont1_txt{margin-top:30rem; padding:0; width:100%;}
    .greetingsCont1_img{width:100%;}
    .greetingsCont2_ul{display:block;}
    .greetingsCont2_ul li{padding-bottom:15rem;}
    .greetingsCont2_ul li+li{margin-top:15rem;}
    .greetingsCont2_ul li p{text-align:left;}
}


/* 회사소개 > 연혁 */
.history{position:relative;}
.historyBox{position:relative; padding-left:clamp(20rem, 6.07142857%, 85rem); box-sizing:border-box;}
.historyBox + div{ margin-top: 35rem; }
.historyBox::before{ content: ''; position:absolute; top:10rem; left:-6rem; width:12rem; height:12rem; background:#fff; border:3px solid var(--primary); border-radius:50%; box-sizing:border-box; }
.historyBox_year{margin-bottom:15rem; font-size:var(--fs30); font-weight:800; color:var(--primary);}
.historyBox_ul1{font-size:18rem; color:#444; }
.historyBox_ul1__li{display:flex; margin-top: 7rem; }
.historyBox_ul1__li.mt15{margin-top:15rem;}
.historyBox_ul1__li em{font-weight:bold; color:#111; display:block; width:40rem;}
.historyBox_ul1__li p{width:calc(100% - 40rem);}
.historyBar{ overflow: hidden; position: absolute; inset: 14rem 0 6rem; width: 1px; background: #ddd; z-index: -1; }
.historyBar::before{ content: ''; position: absolute; inset: 0; background: var(--primary); z-index: 1; }
@media(prefers-reduced-motion:no-preference){
	.historyBox,
	.historyBox::before{ transition: .4s; }
	.historyBox:not(.seActive){ opacity: .7; }
	.historyBox:not(.seActive)::before{ border-color: #ddd; }
	.historyBar::before{ height: var(--height); }
}
@media(min-width:768px){
	.historyBox{width:50%; }
	.historyBox:nth-child(odd){ margin-left: auto; }
	.historyBox:nth-child(even){ padding: 0 clamp(20rem, 6.07142857%, 85rem) 0 0; text-align: right; }
	.historyBox:nth-child(even)::before{ left: auto; right: -6rem;  }
    .historyBox:nth-child(even) li{flex-direction:row-reverse;}
	.historyBar{ margin: auto; }
}
@media(max-width:767px){
    .historyBox::before{top:15rem;}
    .historyBar{inset:16rem 0 6rem;}
}


/* 회사소개 > 파트너쉽 */
.partner h2{font-size:var(--fs30); color:#111; text-align:center;}
.partner h2 em{color:var(--primary);}
.partner h2 > br{display:none;}
.partnerList{display:grid; margin-top:50rem; grid-template-columns:repeat(4, 1fr); gap:40rem;}
.partnerList_Logo{display:flex; align-items:center; padding:20rem 60rem; width:100%; max-height:120rem; border:1px solid #ddd;}
.partnerList_Logo img{display:block; width:100%; height:100%; object-fit:contain;}
@media(max-width:1279px){
    .partnerList{gap:20rem;}
    .partnerList_Logo{padding:20rem 30rem; max-height:100rem;}
}
@media(max-width:767px){
    .partner h2 > br{display:block;}
    .partnerList{margin-top:30rem; grid-template-columns:repeat(3, 1fr); gap:15rem;}
    .partnerList_Logo{padding:15rem; max-height:80rem;}
}


/* 회사소개 > 오시는 길 */
.locationMap{margin-bottom:50rem; width:100%; height:500rem;}
.locationMap .root_daum_roughmap_landing{width:100% !important; height:100% !important;}
.locationMap .root_daum_roughmap .wrap_map{height:100% !important;}
.locationMap .root_daum_roughmap .map_border,
.locationMap .root_daum_roughmap .wrap_controllers{display:none;}
.locationInfo{display:flex; align-items:center; justify-content:space-between;}
.locationInfo_logo{display:block; height:30rem;}
.locationInfo_logo img{display:block; height:100%;}
.locationInfo_txt{display:flex; gap:8rem 40rem;}
.locationInfo_txt li{display:flex; font-size:18rem; color:#444;}
.locationInfo_txt em{display:inline-block; margin-right:10rem; color:#111; font-weight:bold;}
[lang="en"] .locationInfo{flex-direction:column; align-items:unset; gap:2ch;}
[lang="en"] .locationInfo_txt{flex-wrap:wrap;}
@media(max-width:1279px){
    .locationMap{margin-bottom:40rem; height:400rem;}
    .locationInfo{display:block;}
    .locationInfo_logo{height:25rem; margin-bottom:25rem;}
    .locationInfo_txt{column-gap:30rem;}
    @media(min-width:768px){
        [lang="en"] .locationInfo_txt li:nth-child(1){ flex: 1 100%; }
    }
}
@media(max-width:767px){
    .locationInfo_logo{margin-bottom:0;}
    .locationInfo_txt{flex-direction: column; margin-top:25rem;}
    .locationInfo_txt em{margin-right:0; width:50rem;}
    .locationInfo_txt a{width:calc(100% - 50rem);}
}


/* 제품소개 */
ul.prdPoint li+li{margin-top:20rem;}
ul.prdPoint li em{display:block; margin-bottom:6rem; font-size:20rem; color:#111; font-weight:600;}
ul.prdPoint li p{font-size:18rem; color:#444;}
.prdEx_box+.prdEx_box{margin-top:50rem;}
.prdEx_box h3{display:inline-block; padding:8rem; font-size:22rem; background:var(--primary); color:#fff; font-weight:600; border-radius:10rem 10rem 0 0; width:18%; text-align:center;}
.prdType_table th > br{display:none;}
.prdEx_table th > br{display:none;}
.prdEx_table td{text-align:left !important;}
.prdEx_table li{position:relative; padding-left:10rem;}
.prdEx_table li+li{margin-top:5rem;}
.prdEx_table li:before{content:'·'; display:block; position:absolute; left:0; top:0; color:#444; font-weight:900;}
ul.prdImg{display:grid; grid-template-columns:repeat(4, 1fr); gap:40rem;}
ul.prdImg span{display:block; width:100%;}
ul.prdImg img{display:block; width:100%;}
ul.prdImg em{display:block; margin-top:10rem; font-size:17rem; color:#333; font-weight:500;}

.prdCnt1{padding:40rem; text-align:center; background:#f5f5f5; border-top:4rem solid var(--primary);}
.prdCnt1 p{font-size:18rem; color:#333; font-weight:500;}
.prd2Cnt2 p{font-size:18rem; color:#444;}
.prd2Cnt2_box{display:flex; margin-top:50rem;}
.prd2Cnt2_box__img{display:flex; align-items:center; background:#f8f8f8; width:35%;}
.prd2Cnt2_box__img img{display:block; width:100%; height: 100%; object-fit:contain;}
.prd2Cnt2_box__table{padding-left:50rem; width:65%;}
.prd2Cnt2_box__table h3{margin-bottom:15rem; font-size:22rem; color:#111; font-weight:600;}
@media(max-width:1279px){
    .prdCnt1 p > br{display:none;}
    .prdpoint li p > br.pc_br{display:none;}
    .prdEx_box+.prdEx_box{margin-top:30rem;}
    .prdEx_box h3{font-size:20rem;}
    ul.prdImg{grid-template-columns:repeat(3, 1fr); gap:30rem 20rem;}
    
    .prd2Cnt2_box__table{padding-left:30rem;}
}
@media(max-width:767px){
    .prdType_table{overflow-x:scroll;}
    .prdType_table table{width:800rem;}
    .prdEx_box h3{width:53%;}
    .prdEx_table th > br{display:block;}
    ul.prdImg{grid-template-columns:repeat(2, 1fr); gap:25rem 15rem;}
    
    .prdCnt1{padding:30rem 20rem;}
    .prd2Cnt2_box{display:block; margin-top:40rem;}
    .prd2Cnt2_box__img{width:100%;}
    .prd2Cnt2_box__table{margin-top:20rem; padding:0; width:100%;}
    .prd2Cnt2_box__table h3{margin-bottom:12rem; font-size:20rem;}
}


/* R&D > 기술/설비현황 */
.statusCnt1_txt{padding:80rem 40rem 190rem; text-align:center; background:url(../images/content/status01.jpg)no-repeat center/cover;}
.statusCnt1_txt p{font-size:20rem; color:#fff; line-height:1.6;}
.statusCnt1_box{display:flex; margin:-110rem auto 0; padding:60rem 0 0; width:80%; background:#fff;}
.statusCnt1_box > div{display:flex; align-items:center; padding:0 50rem;}
.statusCnt1_box > div:first-child{border-right:1px dashed #ccc;}
.statusCnt1_box__icon{display:flex; align-items:center; justify-content:center; padding:20rem; width:100rem; height:100rem; background:var(--primary); border-radius:50%;}
.statusCnt1_box__img{display:block; width:100%;}
.statusCnt1_box__txt{padding-left:30rem; width:calc(100% - 100rem);}
.statusCnt1_box__em{display:block; margin-bottom:10rem; font-size:22rem; color:#111; font-weight:bold;}
.statusCnt1_box__p{font-size:18rem; color:#444;}
.statusCnt1_box__p b{color:#222;}
.statusCnt3_equi{display:grid; margin-top:50rem; grid-template-columns:1fr 1fr 1fr; gap:40rem;}
.statusCnt3_equi__em{display:block; margin-bottom:10rem; font-size:18rem; color:#333; font-weight:500;}
.statusCnt3_equi__span{display:block; width:100%;}
.statusCnt3_equi__img{display:block; width:100%;}
@media(max-width:1279px){
    .statusCnt1_txt{padding:60rem 40rem 150rem;}
    .statusCnt1_txt p > br{display:none;}
    .statusCnt1_box{margin:-90rem auto 0; padding:40rem 0 0; width:90%;}
    .statusCnt1_box > div{padding:0 30rem;}
    .statusCnt3_equi{margin-top:40rem; gap:30rem 15rem;}
}
@media(max-width:767px){
    .statusCnt1_box{display:block; padding:30rem 20rem 0;}
    .statusCnt1_box > div{padding:0;}
    .statusCnt1_box > div:first-child{padding-bottom:30rem; margin-bottom:30rem; border-right:0; border-bottom:1px dashed #ccc;}
    .statusCnt1_box__icon{width:90rem; height:90rem;}
    .statusCnt1_box__txt{padding-left:20rem;}
    .statusCnt3_equi{grid-template-columns:1fr 1fr;}
}


/* R&D > 인증현황 */
.certiList.ko_board_list[data-type="A"]{grid-template-columns:repeat(5, 1fr);}
.certiList.ko_board_list[data-type="A"] .img{height:350rem; border:1px solid #ddd;}
.certiList.ko_board_list[data-type="A"][data-gallery] [data-board="img"]{width:100%; height:100%; background-size:contain; aspect-ratio:unset;}
@media(max-width:1279px){
    .certiList.ko_board_list[data-type="A"]{grid-template-columns:repeat(4, 1fr); gap:40rem 20rem;}
    .certiList.ko_board_list[data-type="A"] .img{height:310rem;}
}
@media(max-width:767px){
    .certiList.ko_board_list[data-type="A"]{grid-template-columns:repeat(2, 1fr); gap:30rem 15rem;}
    .certiList.ko_board_list[data-type="A"] .img{height:295rem;}
}