@charset "utf-8";

/* 공통 */
.txt-white {color:#fff !important;}
.font-play {font-family:"Play", sans-serif;}
.c1 {color:var(--c1) !important;}
.cj {font-family:'Noto Sans SC';}

/* 인사말 */
.greeting {padding-bottom:var(--100px); background:url('../images/sub/greeting-bg.jpg') no-repeat right bottom;}
.greeting .bg {margin-bottom:var(--60px); padding:125px 75px; background:url('../images/sub/greeting-bg02.jpg') no-repeat 50% 50%; background-size:cover; color:#fff;}
.greeting .bg .t1 {font-size:1.56em; font-weight:500; line-height:1.4em;}
.greeting .bg .t1 span {font-weight:400;}
.greeting .bg .t2 {font-size:2em; font-weight:700; line-height:1.4em}
.greeting .bg .t3 {font-size:2.5em; font-weight:700; line-height:1.4em}
.greeting .cnt .col {display:flex; margin-bottom:var(--60px);}
.greeting .cnt .col:last-child {margin-bottom:0;}
.greeting .cnt .col-tit {width:200px; position:relative; padding-left:5px; font-size:var(--f24); font-weight:700; line-height:1.2em; letter-spacing:-0.03em; color:#242424;}
.greeting .cnt .col-tit:before {content:''; position:absolute; width:12px; height:12px; background:#dde4ee; border-radius:0; left:0; top:0; z-index:-1; border-radius:100%;}
.greeting .cnt .in {flex:1 1 auto; min-width:0; width:1%;}
.greeting .cnt .tt {margin-bottom:1em; font-size:var(--f24); font-weight:500; line-height:1.6em; letter-spacing:-0.03em; color:#242424;}
.greeting .cnt .tt .c1 {font-weight:600;}
.greeting .cnt .tx {margin-bottom:1.2em; letter-spacing:-0.03em;}
.greeting .cnt .tx strong {font-weight:600; color:#242424;}
.greeting .cnt .tx strong .cj {font-weight:500;}
.greeting .cnt .tx:last-child {margin-bottom:0;}

/* 환경안전보건 */
.environment .top-bg {margin-bottom:var(--60px); padding:75px 100px; background:url('../images/sub/environment-bg.jpg') no-repeat 50% 50%; background-size:cover;}
.environment .top-bg p {margin-bottom:var(--30px); font-size:var(--f24); font-weight:700; line-height:1.2em; letter-spacing:-0.03em; color:#242424;}
.environment .top-bg p strong {display:block; font-family:"Montserrat", sans-serif; line-height:1.2em; font-size:var(--f50); color:#1b4a8b;  text-shadow:-2px -2px 0 #fff, 2px -2px 0 #fff, -2px 2px 0 #fff, 2px 2px 0 #fff;}
.environment .top-bg ul li {position:relative; padding-left:27px; font-size:var(--f20); font-weight:600; line-height:2em; letter-spacing:-0.03em; color:#242424;}
.environment .top-bg ul li:before {content:''; position:absolute; left:0; top:9px; width:21px; height:21px; background:url('../images/sub/bullet-check.png') no-repeat 50% 50%; background-size:contain;}
.environment .group {display:flex; margin-bottom:var(--60px);}
.environment .group:last-child {margin-bottom:0;}
.environment .group-tit {position:relative; padding-left:5px; width:270px; font-size:var(--f24); font-weight:700; line-height:1.2em; letter-spacing:-0.03em; color:#242424;}
.environment .group-tit:before {content:''; position:absolute; width:12px; height:12px; border-radius:100%; left:0; top:0; background:#dde4ee; z-index:-1;}
.environment .group .cnt {flex:1 1 auto; min-width:0; width:1%;}
.environment .group .cnt .tit {margin-bottom:var(--30px); font-size:var(--f24); font-weight:500; line-height:1.2em; letter-spacing:-0.03em; color:#242424;}
.environment .group .cnt .num-list > li {position:relative; padding-left:25px; font-size:var(--f18); font-weight:400; line-height:1.7em; letter-spacing:-0.03em; color:#454545;}
.environment .group .cnt .num-list > li .num {position:absolute; left:0;}
.environment .group .cnt .list02 > li {position:relative; padding-left:10px; font-size:var(--f16); font-weight:400; line-height:1.7em; letter-spacing:-0.03em; color:#686868;}
.environment .group .cnt .list02 > li:before {content:''; position:absolute; width:5px; height:1px; background:#686868; left:0; top:12px;}
.environment .group .cnt .tt {margin-bottom:var(--30px); font-size:var(--f20); font-weight:500; line-height:1.6em; letter-spacing:-0.03em; color:#242424;}


/* history */
.history .tit-wrap {margin-bottom:var(--70px);}
.history .tit-wrap .tit {margin-bottom:20px; font-size:var(--f18); font-weight:700; color:#1b4a8b; letter-spacing:-0.03em;}
.history .tit-wrap .txt {font-size:var(--f38); font-weight:700; line-height:1.45em; letter-spacing:-0.03em; color:#242424;}

.history .wrap {display:flex; align-items:flex-start;}
.history .img {margin-right:90px; border-radius:100vh; overflow:hidden;}
.history .cnt {flex:1 1 auto; min-width:0; width:1%;}
.history .group {display:flex; padding-top:25px; margin-bottom:50px; border-top:2px solid #505050;}
.history .group:last-child {margin-bottom:0;}
.history .group .year {min-width:156px;font-size:var(--f28); font-weight:700; line-height:1.2em; letter-spacing:-0.03em; color:#2c2c2c;}
.history .group .month {width:46px; font-family:"Play", sans-serif; font-weight:700; color:#1b4a8b;}
.history .group > ul {flex:1 1 auto; min-width:0; width:1%; padding-top:5px;}
.history .group > ul > li {display:flex; font-size:var(--f18); font-weight:400; line-height:1.8em; letter-spacing:-0.03em; color:#505050;}
.history .group > ul > li:last-child {margin-bottom:0;}
.history .group > ul > li li .small {font-size:0.89em; color:#898989; line-height:1.4em;}

/* 찾아오시는 길 */
.root_daum_roughmap {width:100% !important; height:450px !important;}
.root_daum_roughmap .wrap_map {height:450px !important;}

.directions {margin-top:40px;}
.directions .address-info {margin-bottom:30px;}
.directions .address-info .comp {color:#1b4a8b; font-weight:600; margin-bottom:2px;}
.directions .address-info .addr {color:#242424; font-size:23px; font-weight:600; line-height:1.33em; letter-spacing:-.03em; margin-bottom:5px;}
.directions .address-info .etc {color:#454545;}
.directions .address-info .etc span {display:inline-block; margin-right:16px;}
.directions .address-info .etc span:last-child {margin-right:0;}
.directions .contact-info {border-top:1px solid #ddd; line-height:1.5em;}
.directions .contact-info dl {display:flex; padding:28px 0; border-bottom:1px solid #ddd;}
.directions .contact-info dt {width:180px; padding-left:30px; color:#242424; font-size:1.125em; font-weight:500;}
.directions .contact-info dt svg {vertical-align:middle; margin:-.2em 15px 0 0;}
.directions .contact-info dt path {fill:#ababab;}
.directions .contact-info dd {flex:1 1 auto; min-width:0; width:1%; color:#454545;}

@media (max-width: 1024px) {
	.root_daum_roughmap {height:300px !important;}
	.root_daum_roughmap .wrap_map {height:300px !important;}
	.directions .address-info .addr {font-size:20px;}
	.directions .contact-info dl {padding:20px 0;}
	.directions .contact-info dt {padding-left:20px; width:140px;}
}

@media (max-width: 640px) {
	.root_daum_roughmap {height:250px !important;}
	.root_daum_roughmap .wrap_map {height:250px !important;}	
	.directions {margin-top:30px;}
	.directions .address-info .addr {font-size:18px;}
	.directions .address-info {margin-bottom:20px;}
	.directions .contact-info dl {padding:16px 0;}
	.directions .contact-info dt {padding-left:5px; width:110px;}
	.directions .contact-info dt svg {margin-right:10px;}
}

/* 사업분야 */
.business-menu {}
.business-menu ul {position:relative; display:flex;}
.business-menu ul:before {content:''; position:absolute; width:100%; left:0; height:100%; top:0; border-right:1px solid #ddd; border-left:1px solid #ddd; z-index:1; pointer-events:none;}
.business-menu ul li {flex:1; border:1px solid #ddd; position:relative; text-align:center; margin-left:-1px; border-bottom:1px solid #1b4a8b; border-right:0; border-left:0;}
.business-menu ul li:first-child {margin-left:0;}
.business-menu ul li:after {content:''; position:absolute; width:1px; height:30px; right:0; top:50%; margin-top:-15px; background:#ddd; z-index:1;}
.business-menu ul li.active {border:0;}
.business-menu ul li.active:before {content:''; position:absolute; left:0; top:0; right:0; bottom:-1px; border:1px solid #1b4a8b; z-index:2; border-bottom:0;}
.business-menu ul li.active a {color:#1b4a8b; background:#fff;}
.business-menu ul li a {display:flex; height:50px; align-items:center; justify-content:center; text-align:center; font-weight:600; line-height:1.2em; letter-spacing:-0.03em; color:#898989; background:#fafafa;}

.sub-tab-fixed .business-menu {position:fixed; top:var(--80px); left:50%; transform:translateX(-50%); width:100%; max-width:1200px; z-index:50; background:#fff;}

.product-wrap .group {padding-bottom:var(--100px); padding-top:var(--60px); border-bottom:1px solid #ddd;}
.product-wrap .group:last-child {margin-bottom:0; padding-bottom:0; border-bottom:0;}
.product-wrap .group .inner {display:flex;}
.product-wrap .group .tit-wrap {width:400px;}
.product-wrap .group .tit-wrap .tit {margin-bottom:0.93em; display:inline-block; position:relative; font-size:var(--f28); font-weight:600; line-height:1.6em; letter-spacing:-0.03em; color:#242424;}
.product-wrap .group .tit-wrap .tit:before {content:''; position:absolute; width:7px; height:7px; background:#1b4a8b; border-radius:100%; right:-9px; top:-9px;}
.product-wrap .group .tit-wrap .txt {font-size:var(--f20); font-weight:500; line-height:1.65em; color:#242424;}
.product-wrap .group .cnt {flex:1 1 auto; min-width:0; width:1%; padding-right:var(--100px);}
.product-wrap .group .cnt .txt-wrap {margin-bottom:var(--50px);}
.product-wrap .group .cnt .txt-wrap p {font-weight:400; letter-spacing:-0.03em; margin-bottom:13px;}
.product-wrap .group .cnt .txt-wrap p:last-child {margin-bottom:0;}
.product-wrap .group .img-slider {margin-bottom:20px;}
.product-wrap .group .thumb-slider {position:relative;}
.product-wrap .group .thumb-slider .slick-list {margin:0 -10px;}
.product-wrap .group .thumb-slider .slick-slide {position:relative; margin:0 10px; cursor:pointer;}
.product-wrap .group .thumb-slider .slick-current:before {content:''; position:absolute; width:100%; height:100%; left:0; top:0; border:5px solid #1b4a8b;}
.product-wrap .group .thumb-slider .slick-arrow {position:absolute; z-index:1; top:50%; width:19px; height:18px; margin-top:-9px; border:0; background-color:transparent; background-position:50% 50%; background-size:contain; text-indent:-999em; overflow:hidden; transition:0.2s all ease;}
.product-wrap .group .thumb-slider .slick-prev {background-image:url('../images/sub/icon-prev.png'); left:-40px;}
.product-wrap .group .thumb-slider .slick-next {background-image:url('../images/sub/icon-next.png'); right:-40px;}
.product-wrap .group .thumb-slider .slick-prev:hover {background-image:url('../images/sub/icon-prev02.png');}
.product-wrap .group .thumb-slider .slick-next:hover {background-image:url('../images/sub/icon-next02.png');}

/* 사업현황 */
.situation {position:relative; padding-top:var(--100px); padding-bottom:var(--100px);}
.situation:before {content:''; position:absolute; width:100vw; height:100%; left:50%; transform:translateX(-50%); top:0; z-index:-1; background:url('../images/sub/situation-bg.jpg') no-repeat 50% 50%; background-size:cover;}
.situation p {margin-bottom:20px; position:relative; padding-bottom:80px; font-size:var(--f40); font-weight:500; line-height:1.2em; letter-spacing:-0.05em; color:#242424;}
.situation p:before {content:''; position:absolute; width:7px; height:41px; background:url('../images/sub/bullet01.png') no-repeat 50% 50%; background-size:contain; left:50%; bottom:0; margin-left:-3.5px;}
.situation p strong {color:var(--c1);}
.situation .img {border-radius:100vh; box-shadow:10px 10px 30px rgba(0,0,0,0.1);}

/* 채용공고 */
.job-list ul {display:flex; margin:-15px;}
.job-list ul li {flex:1; padding:15px;}
.job-list ul li a {position:relative; display:block; padding:50px 30px; height:100%; background:#fff; border:1px solid #ddd; border-radius:20px;}
.job-list ul li .logo {margin-bottom:35px;}
.job-list ul li .txt {font-weight:400; letter-spacing:-0.05em; color:#454545;}
.job-list ul li .more {position:absolute; right:30px; top:50px; width:50px; height:50px; background:#000 url('../images/main/icon-arrow.png') no-repeat 50% 50%; border-radius:100%; text-indent:-999em; overflow:hidden;}
.job-list ul li a:hover {transform:translateY(-20px);}

/* 복리후생 */
.benefit {display:flex; flex-wrap:wrap; margin:-15px;}
.benefit .box {width:33.333%; padding:15px;}
.benefit .box .in {padding:40px 30px; height:100%; border:1px solid #ddd; border-radius:20px; position:relative;}
.benefit .box .tit {margin-bottom:20px; font-size:var(--f24); font-weight:700; line-height:1.2em; letter-spacing:-0.03em; color:#242424;}
.benefit .box .icon {position:absolute; right:40px; top:40px;}
.benefit .box ul.type2 {display:flex; flex-wrap:wrap;}
.benefit .box ul.type2 li {width:90px;}
.benefit .box ul.type2 li:nth-child(2n) {width:200px;}
.benefit .box ul li {position:relative; padding-left:10px;}
.benefit .box ul li:before {content:''; position:absolute; width:4px; height:4px; background:#1b4a8b; border-radius:100%; left:0; top:11px;}

/* 직원복지 */
.welfare {display:flex;}
.welfare .left {flex:1 1 auto; min-width:0; width:1%;}
.welfare .left .item {position:relative;}
.welfare .left .tit {position:absolute; left:0; bottom:0; width:100%; background:rgba(0,0,0,0.5); font-size:var(--f20); font-weight:600; line-height:1.2em; letter-spacing:-0.03em; color:#fff; padding:23px 25px;}
.welfare .right {position:relative; display:flex; align-items:center; width:240px; padding:35px; background:#f2f2f2;}
.welfare .right .slick-list {margin:-5px 0;}
.welfare .right .slick-slide {position:relative; margin:5px 0; cursor:pointer;}
.welfare .right .slick-current:before {content:''; position:absolute; width:100%; height:100%; left:0; top:0; border:5px solid #1b4a8b;}
.welfare .right .slick-arrow {position:absolute; z-index:1; left:50%; width:35px; height:19px; background-position:50% 50%; background-size:contain; background-repeat:no-repeat; border:0; background-color:transparent; text-indent:-999em; overflow:hidden; margin-left:-17.5px;}
.welfare .right .slick-prev {top:-40px; background-image:url('../images/sub/icon-arrow.png');}
.welfare .right .slick-next {bottom:-40px; background-image:url('../images/sub/icon-arrow02.png');}