@charset "utf-8";

.gray-bg {background:#F8F8F8;}

.doc-cnt {padding:var(--space-100) 0;}

.s-head {margin-bottom:var(--space-80); font-size:var(--font-size-44); font-weight:700; color:#242424; line-height:1.33em; letter-spacing:0;}

.ico-tit {margin-bottom:var(--space-60); display:flex; align-items:center; gap:0 var(--space-10); font-size:var(--font-size-24); font-weight:600; letter-spacing:-.03em; line-height:1.33em;}
.ico-tit:before {content:''; width:clamp(3px, calc(6 / var(--inner) * 100vw), 6px); height:clamp(16px, calc(24 / var(--inner) * 100vw), 24px); background:var(--color-primary);;}

.about {text-align:center;}
.about .image {margin-bottom:var(--space-60);}
.about h3 {font-size:var(--font-size-30); letter-spacing:0; font-weight:600; color:#242424; line-height:1.4em; }
.about h3:after {content:''; display:block; width:40px; height:1px; background:#ddd; margin:var(--space-30) auto;}
.about p { margin-bottom:var(--space-40); font-size:var(--font-size-16); letter-spacing:0; color:#454545; line-height:1.75em; }
.about p strong { color:var(--color-primary);}

.client {overflow:hidden;}
.client .marquee:not(:last-child) {margin-bottom:30px;}
.client .marquee ul {display:flex;}
.client .marquee ul li {margin:0 var(--space-15); width:clamp(160px, calc(320 / var(--inner) * 100vw), 320px);}
.client .marquee:after {content:" "; display:block; clear:both;}

.certi .items {display:grid; grid-template-columns:repeat(5, 1fr); gap:var(--space-30);}
.certi .items .box {display:block; aspect-ratio:256 / 341; overflow:hidden; border:1px solid #ddd;}
.certi .items .box img {width:100%; height:100%; object-fit:contain;}

.pop-certi {width:80vw !important; max-width:480px !important; height:auto !important;}
.pop-certi .fancybox-skin {width:80vw !important; max-width:480px !important; height:auto !important;}
.pop-certi .fancybox-inner {width:80vw !important; max-width:480px !important; height:auto !important;}

.field-cnt h3 {margin-bottom:var(--space-40); text-align:center; font-size:var(--font-size-30); font-weight:600; color:#242424; line-height:1.4em;}

.field-tab {margin-bottom:var(--space-40);}
.field-tab ul {display:flex; justify-content:center; gap:var(--space-10);}
.field-tab ul li a {display:flex; align-items:center; justify-content:center; min-width:172px; height:clamp(40px, calc(56 / var(--inner) * 100vw), 56px); padding:0 12px; border:1px solid #ddd; background:#fff; font-size:var(--font-size-16); font-weight:500; color:#242424; line-height:1.875em; text-align:center;}
.field-tab ul li.active a {border-color:var(--color-primary); background:var(--color-primary); color:#fff;}

.field-content {display:grid; grid-template-columns:repeat(2, 1fr); gap:var(--space-30);}
.field-content .content {background:url(/images/sub/field-bg.png) no-repeat right var(--space-30) bottom var(--space-30); padding:var(--space-60); border:1px solid #ddd; border-radius:24px;}
.field-content .content .ico-tit {margin-bottom:var(--space-40);}
.field-content .content .txt {font-size:var(--font-size-16); color:#454545; line-height:1.75em;}
.field-content .content .txt strong {color:var(--color-primary); font-weight:600;}
.field-content .slider {min-width: 0;}
.field-content .slider .items img {border-radius:24px;}

.root_daum_roughmap {width:100% !important;}
.root_daum_roughmap .wrap_map {height:clamp(250px, calc(500 / var(--inner) * 100vw), 500px) !important;}
.root_daum_roughmap .cont {display:none;}
.directions {margin-top:var(--space-60);}
.directions .address-info {margin-bottom:var(--space-60);}
.directions .address-info .comp {color:var(--color-primary); font-size:var(--font-size-18); font-weight:600; margin-bottom:var(--space-20);}
.directions .address-info .addr {color:#242424; font-size:var(--font-size-30); font-weight:600; line-height:1.33em; letter-spacing:-.03em; margin-bottom:var(--space-20);}
.directions .address-info .etc {color:#454545; font-size:var(--font-size-18);}
.directions .address-info .etc span {display:inline-block; margin-right:var(--space-15);}
.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:var(--space-40) 0; border-bottom:1px solid #ddd;}
.directions .contact-info dt {width:clamp(140px, calc(220 / var(--inner) * 100vw), 220px); padding-left:var(--space-40); color:#242424; font-size:1.125em; font-weight:500;}
.directions .contact-info dt svg {width:clamp(16px, calc(24 / var(--inner) * 100vw), 24px); height:clamp(16px, calc(24 / var(--inner) * 100vw), 24px); vertical-align:middle; margin:-.2em var(--space-15) 0 0;}
.directions .contact-info dt path {fill:#242424;}
.directions .contact-info dd {font-size:var(--font-size-18); flex:1 1 auto; min-width:0; width:1%; color:#454545;}

.history .group {position:relative;  padding-bottom:var(--space-80); display:flex;}
.history .group:last-child {padding-bottom:0;}
.history .group:before {content:''; position:absolute; left:50%; top:1em; height:100%; width:1px; background:var(--color-primary);}
.history .year {position:relative; width:50%; font-size:var(--font-size-40); font-weight:700; color:#111; line-height:1em; }
.history .year:after {content:''; position:absolute; top:var(--space-12); width:20px; height:20px; border-radius:100%; border:6px solid var(--color-primary); background:#fff;}
.history .cnt {flex:1; padding-top:var(--space-10); display:flex; gap:0 var(--space-15);}
.history .cnt:before {margin-top:var(--space-10); content:''; width:75px; height:1px; border:1px dashed #ddd;}
.history .item {margin-bottom:var(--space-20); display:flex; align-items:flex-start; gap:var(--space-10); }
.history .item:last-child {margin-bottom:0;}
.history .mon {min-width:33px; font-size:var(--font-size-18); font-weight:600; color:#242424; line-height:1.33em; text-align:right; }
.history .txt {flex:1;}
.history .txt p {margin-bottom:var(--space-20); font-size:var(--font-size-16); color:#454545; line-height:1.33em; }
.history .txt p:last-child {margin-bottom:0;}

.history .group:nth-child(odd) .year {padding-right:var(--space-100); text-align:right;}
.history .group:nth-child(odd) .year:after {right:0; margin-right:-10px;}
.history .group:nth-child(even) { flex-direction:row-reverse; }
.history .group:nth-child(even) .year {padding-left:var(--space-100);}
.history .group:nth-child(even) .year:after {left:0; margin-left:-10px;}
.history .group:nth-child(even) .cnt {flex-direction:row-reverse;}
.history .group:nth-child(even) .item {text-align:right; flex-direction:row-reverse; }
.history .group:nth-child(even) .mon { text-align:left; }