@charset "utf-8";
/* 공통 */
.c01 {color: var(--color-primary);}

.doc-tit {position:relative; padding-left:18px; margin-bottom:26px; font-size:var(--font-size-26); font-weight:600; color:#242424; letter-spacing:-.03em; line-height:1.3em;}
.doc-tit:before {content:''; position:absolute; left:0; top:-2px; width:8px; height:8px; border-radius:100%; background-color:var(--color-primary);}

.doc-sec:not(:last-child) {margin-bottom:var(--space-100);}

/* 회사소개 */
.intro-top {position:relative;}
.intro-top p {position:absolute; left:80px; top:50%; transform:translateY(-50%); font-size:var(--font-size-28); font-weight:500; color:#fff; letter-spacing:-.03em; line-height:1.5em;}
.intro-top p span {font-weight:700;}


.intro-txt {padding:45px 0 0 45px;}
.intro-txt h2 {font-weight:500; font-size:var(--font-size-30); line-height:1.3em; letter-spacing:-.03em; color:#242424;}
.intro-txt h2 span {font-weight:700;}

.intro-txt .doc-txt {margin-top:30px; font-weight:500; font-size:var(--font-size-20); letter-spacing:-.03em; line-height:1.4em; color:#242424;}

.intro-txt .doc-txt2 {line-height:1.63em; letter-spacing:-.03em;}
.intro-txt .doc-txt2:nth-child(odd) {margin:30px 0;}
.intro-txt .doc-txt2 span {color:#242424; font-weight:500; font-size:var(--font-size-18);}

.philo {background-color:#f8f8f8; padding:150px 0 65px; margin-top:95px;}
.philo h3 {position:relative; padding-left:18px; font-size:var(--font-size-26); font-weight:600; color:#242424; letter-spacing:-.03em; line-height:1.2em;}
.philo h3::before {content:''; position:absolute; left:0; top:-6px; width:8px; height:8px; border-radius:100%; background-color:var(--color-primary);}

.ph-wrap {display:flex;}

.ph-t-wrap {height:100%; padding:33px 0 0 75px;}
.ph-box {margin-bottom:73px;}
.ph-box:last-child {margin-bottom: 0;}
.ph-t {margin-bottom:15px; font-size:var(--font-size-20); font-weight:700; color:#242424; letter-spacing:-.03em; line-height:1.2em;}
.ph-t2 {letter-spacing:-.03em; color:#686868; line-height:1.5em;}

/* hitory */
.hitory {position: relative;}
.hitory::after {content: ''; position: absolute; top: 0; left: 50%; width: 1px; height: 98.5%; background-color:#ddd;}

.hitory .cnt {margin-bottom: 70px;}
.hitory .cnt:last-child {margin-bottom: 0;}
.box-wrap {display: flex;}
.hitory .left .box-wrap {flex-direction: row-reverse;}
.bin-box {width: 50%;}
.h-box {width: 50%;}

.hitory .since {border-bottom: 1px dashed #ddd;}
.hitory .since h2 {position: relative; width: fit-content; font-size: var(--font-size-34); line-height: 1.3em; letter-spacing: -.03em; padding: 0 40px 20px; color: #0e61b6;}
.hitory .left .since h2 {margin: 0 0 0 auto;}

.hitory .since h2::before {content: ''; position: absolute; bottom: -8px; z-index: 1; background-image: url(../images/sub/history-ico.png); width: 15px; height: 15px; background-repeat: no-repeat; background-size: contain;}
.hitory .right .since h2::before {left: -8px;}
.hitory .left .since h2::before {right: -8px;}

.hitory .left .h-box {text-align: right;}

.h-box ul li:first-child {margin-top: 0;}
.hitory .right .h-box ul {margin:20px 0 0 40px;}
.hitory .left .h-box ul {margin:20px 40px 0 0;}

.h-box ul li {position: relative; display: flex; margin-top: 30px; line-height: 1.56em;}
.hitory .right .h-box ul li {padding-left: 15px;}
.hitory .left .h-box ul li {flex-direction: row-reverse; padding-right: 15px;}
.h-li::after {content: ''; position: absolute; width: 5px; height: 5px; left:0; background-color: #ccc; top: 8px; border-radius: 100%;}
.hitory .left .h-box .h-li::after {right: 0; left: unset;}

.h-s-box {display: flex;}
.hitory .left .h-s-box {flex-direction: row-reverse;}

.h-li .year {font-size:var(--font-size-17); font-weight: 600; letter-spacing: -.03em;}
.h-s-box {letter-spacing: -.03em;}
.h-s-box:first-child {margin-top: 0;}
.h-s-box .month {width: 20px; font-weight: 600;  color: #242424; margin: 0 15px 0 10px ;}
.hitory .right .month {margin: 0 10px 0 15px;}

/* //--hitory */


.vi-tit {font-size: var(--font-size-24); font-weight: 500; color: #242424; letter-spacing: -.03em; line-height: 1.2em; text-align: center;}
.vi-tit span {font-weight: 700; font-size: var(--font-size-28);}

.mi-vi-wrap {display: flex; justify-content: center; margin: 75px 0 90px;}
.mi-vi-box {display: flex;}
.mi-vi-box h3 {margin-right: 20px; font-size: var(--font-size-22); letter-spacing: -.03em; line-height: 1.2em;}
.mi-vi-box p {font-size: var(--font-size-16); letter-spacing: -.03em; line-height: 1.5em;}

.mission {margin-left: -100px;}
.vision {position: relative; margin-left: 50px; padding-left: 50px;}
.vision::before {content: ''; position: absolute; width: 1px; height: 80px; background-color: #ddd; left: 0; top: 50%; transform: translateY(-50%);}

.vi-img {text-align: center;}

.org-wrap {background-color: #f8f8f8; padding:var(--space-100) 0; margin-top: 125px;}
.org-wrap .img {text-align: center;}

.certifications {font-size:var(--font-size-18); font-weight:500; line-height:1.3em; letter-spacing:-.03em; color:#242424; text-align:center;}
.certifications ul {display:grid; grid-template-columns:repeat(4, 1fr); gap:70px 20px;}
.certifications ul li img {display:block; margin:0 auto 16px;}

.root_daum_roughmap .wrap_controllers,
.root_daum_roughmap .border1,
.root_daum_roughmap .border2,
.root_daum_roughmap .border3,
.root_daum_roughmap .border4 {display: none;}

.directions {margin-top:40px; display: flex; justify-content: space-between;}
.directions .address-info {width: 50%;}
.directions .address-info .comp {color:#04a6de; font-weight:600; margin-bottom:2px;}
.directions .address-info .addr {color:#242424; font-size:var(--font-size-23); 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 {line-height:1.5em; width: 50%;}
.directions .contact-info dl {display:flex;}
.directions .contact-info dl:nth-child(2) {margin: 30px 0;}
.directions .contact-info dt {width:180px; padding-left:30px; color:#242424; font-weight:500;}
.directions .contact-info dt svg {vertical-align:middle; margin:-.2em 15px 0 0;}
.directions .contact-info dt path {fill:#a5dff3;}
.directions .contact-info dd {flex:1 1 auto; min-width:0; width:1%; color:#454545;}

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

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


/* 사업분야 */
.business-list {display:grid; grid-template-columns:repeat(3, 1fr); gap:30px;}
.business-list .item {display:block; overflow:hidden; position:relative; border-radius:var(--radius-20);}
.business-list .item .img {transition:.4s linear;}
.business-list .item .tit {position:absolute; bottom:0; left:0; z-index:2; width:100%; padding:11px; background:rgba(0,0,0,.2); color:#fff; font-size:var(--font-size-22); font-weight:600; line-height:1.3em; letter-spacing:-.03em; text-align:center;}
.business-list .item.border:after {content:''; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid #ddd; border-radius:inherit;}
.business-list .item:hover .img {transform:scale(1.05);}
.business-list.st2 {grid-template-columns:repeat(2, 1fr);}

.business-summary {position:relative; overflow:hidden; padding-bottom:var(--space-60); margin-bottom:var(--space-100); text-align:center;}
.business-summary:before {content:''; position:absolute; top:clamp(100px, calc( 250 / 1200 * 100vw ), 250px); right:0; left:0; bottom:0; background:#f8f8f8;}
.business-summary .contain {position:relative;}
.business-summary .img {margin-bottom:var(--space-40);}
.business-summary .img img {border-radius:var(--radius-30);}
.business-summary .cnt {line-height:1.63em; letter-spacing:-.03em;}

.business-slider {overflow:hidden; margin-bottom:var(--space-50);}
.business-slider .slider {position:relative;}
.business-slider .items {margin:0 -6px;}
.business-slider .slick-track {display:flex;}
.business-slider .slick-track:before,
.business-slider .slick-track:after {display:none;}
.business-slider .slick-slide {flex-shrink:0; width:100%; padding:0 6px;}
.business-slider .slick-arrow {display:flex; align-items:center; justify-content:center; position:absolute; top:50%; z-index:50; -webkit-transform:translateY(-50%); transform:translateY(-50%); width:46px; height:46px; background:#fff; border:1px solid #ddd; border-radius:100%; color:#ddd; font-size:var(--font-size-18); transition:.2s;}
.business-slider .slick-arrow:hover {border-color:var(--color-primary); background:var(--color-primary); color:#fff;}
.business-slider .slick-prev {left:-85px;}
.business-slider .slick-next {right:-85px;}

.business-summary2 .cnt {line-height:1.63em; letter-spacing:-.03em; font-size: var(--font-size-16); display: flex;}
.business-summary2 .sub-cnt {width: 50%; margin: 105px 0;}
.business-summary2 .biz-tit {position: relative; font-size: var(--font-size-26); color: #242424; padding-left: 17px; margin-bottom:20px}
.business-summary2 .biz-tit::before {content: ''; position: absolute; background-color: var(--color-primary); width: 8px; height: 8px; border-radius: 100%; left: 0; top: -5px;}

.business-summary2 .characteristic {padding-left: 60px; position: relative;}
.business-summary2 .characteristic::before {content: ''; position: absolute; left: 0; top: -10px; background-color: #ddd; width: 1px; height: 110%;}

.business-slider2 {overflow:hidden; margin-bottom:var(--space-50);}
.business-slider2 .slider {position:relative;}
.business-slider2 .items {margin:0 -5px;}
.business-slider2 .item {padding: 0 5px;}

.business-slider2 {overflow:hidden; margin-bottom:var(--space-50);}
.business-slider2 .slider {position:relative;}
.business-slider2 .items {margin:0 -6px;}
.business-slider2 .slick-track {display:flex; width:100%;}
.business-slider2 .slick-track:before,
.business-slider2 .slick-track:after {display:none;}
.business-slider2 .slick-slide {padding:0 6px;}
.business-slider2 .slick-arrow {display:flex; align-items:center; justify-content:center; position:absolute; top:50%; z-index:50; -webkit-transform:translateY(-50%); transform:translateY(-50%); width:46px; height:46px; background:#fff; border:1px solid #ddd; border-radius:100%; color:#ddd; font-size:var(--font-size-18); transition:.2s;}
.business-slider2 .slick-arrow:hover {border-color:var(--color-primary); background:var(--color-primary); color:#fff;}
.business-slider2 .slick-prev {left:-85px;}
.business-slider2 .slick-next {right:-85px;}

.business-tab {margin: 80px 0 60px;}
.business-tab ul {display: flex; width: 100%; height: 60px;}
.business-tab li {flex: 1; font-size: var(--font-size-18); font-weight: 500; letter-spacing: -0.03em; line-height: 1.44em; color: #454545; border-right: 1px solid #ddd; border-top: 1px solid #ddd; border-bottom: 2px solid #04a6de;}
.business-tab li:first-child {border-left: 1px solid #ddd;}
.business-tab li.active {border: 2px solid #04a6de !important; border-bottom: none !important; background-color: #fff !important; color: #04a6de !important;}
.business-tab li a {padding: 0 10px; width: 100%; height: 100%; display: inline-flex; align-items: center; justify-content: center;}

/* 고객지원 */
.esg-top {text-align:center; font-size:var(--font-size-18); line-height:1.56em; letter-spacing:-.03em;}
.esg-top .cnt {position:relative; width:90%; max-width:940px; margin:-20px auto 0; padding:45px 45px 0; background:#fff; border-radius:var(--radius-20);}

.esg-items {display:grid; grid-template-columns:repeat(2, 1fr); gap:20px;}
.esg-items .item {display:flex; padding:34px 30px; background:#f2fafd; border-radius:12px;}
.esg-items .item .num {width:40px; font-size:var(--font-size-22); font-weight:600; line-height:1.15em; letter-spacing:-.03em; color:#0367a5;}
.esg-items .item dl {flex:1 1 auto; min-width:0; width:1%;}
.esg-items .item dt {margin-bottom:12px; font-size:var(--font-size-20); font-weight:600; line-height:1.3em; letter-spacing:-.03em; color:#242424;}
.esg-items .item dd {line-height:1.5em; letter-spacing:-.03em;}