@charset "utf-8";

.doc-cnt {padding-top:120px;margin-top:-80px;}
.doc-cnt.ty2 {margin-top:120px; padding:0;}

.doc-cnt h2 {font-size:var(--font-size-56); line-height:1.2em; color:#222222;}
.doc-cnt h2 span {color:#515370;}
.doc-cnt.ty2 h2 {margin-bottom:70px;}



.intro .doc-tit {padding-bottom:180px; background-image:url(../images/sub/intro-bg.png); background-repeat:no-repeat; background-position:bottom right;}
.intro-doc {padding:115px 0 145px; background-color:#eff3fc;}
.intro-doc p {margin:30px 0 0 160px; font-size:var(--font-size-18); letter-spacing:-.03em; line-height:1.5em;}
.intro-doc p:first-child {margin-top:0;}

.history .doc-tit {padding-bottom:80px;}
.history h2 span {color:var(--color-primary);}

.history-doc {background-repeat:no-repeat; background-position:50% 50%; background-attachment:fixed; background-image:url(../images/sub/history-bg.png);}

.h-box {display:flex;}
.since {width:185px; font-family:"Cabin", sans-serif; font-size:var(--font-size-56); font-weight:700; line-height:1em; letter-spacing:-.03em; color:#242424;}

.story-wrap {position:relative; margin-left:105px; padding-left:70px;}
.story-wrap::before {content:''; position:absolute; left:0; top:6px; height:100%; width:1px; background-color:#ccc;}
.h-box:last-child .story-wrap::before {height:87%;}

.story-wrap .box {padding-bottom:30px;}
.story-wrap .box:last-child {padding-bottom:85px;}
.h-box:last-child .story-wrap .box:last-child {padding-bottom:0;}
.story-wrap .year {position:relative; margin-bottom:20px; font-family:"Cabin", sans-serif; font-size:var(--font-size-28); color:#242424; letter-spacing:-.03em;}
.story-wrap .year::before {content:''; position:absolute; width:18px; height:18px; left:-78px; top:6px; background-image:url(../images/sub/history-ico.png);background-size:contain; background-repeat:no-repeat;}
.story-wrap .box ul .story {position:relative; padding-left:20px; font-size:var(--font-size-16); color:#505050; letter-spacing:-.03em; line-height:1.2em;}
.story-wrap .box ul .story:nth-child(n+2) {margin-top:10px;}
.story-wrap .box ul .story::before {content:''; position:absolute; left:0; top:8px; width:3px; height:3px; border-radius:100%; background-color:#505050;}

.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;}
.directions .address-info {margin-bottom:30px;}
.directions .address-info .comp {color:var(--color-primary); 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 {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:#222222; 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:rgba(55,100,219,.5);}
.directions .contact-info dd {flex:1 1 auto; min-width:0; width:1%; color:#505050;}

@media (max-width:1024px) {
	.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 .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;}
}


.fancybox-wrap.viewing .fancybox-skin {border-radius:16px;}
.viewing .fancybox-close {width:23px; height:23px; right:13px; top:-33px; background-image:url(../images/sub/close-btn.png); background-size:contain; background-repeat:no-repeat;}

.top-prod {padding:95px 0 !important; background-image:url(../images/sub/prod-bg.jpg); background-repeat:no-repeat; background-size:cover;}
.top-prod .img {text-align:center;}
.prod-tit {font-size:var(--font-size-42); margin-bottom:75px; font-weight:700; font-family:"Cabin", sans-serif; color:#000; text-align:center; line-height:1.2em;}


.all-wrap {padding:0 70px;}
.all-wrap ul {display:flex; flex-wrap:wrap; margin:-40px; background-image:url(../images/sub/prod-img-bg.png); background-repeat:no-repeat; background-position:50%;}
.all-wrap li {width:33.3%; padding:40px;}
.all-wrap li a {position:relative;width:100%; height:100%; display:block; border-radius:16px; overflow:hidden;}
.all-wrap li a p {position:absolute; bottom:20px; left:17px; font-size:var(--font-size-22); font-weight:700; font-family:"Cabin", sans-serif; color:#fff;line-height:1.2em;}

.prod-view {display:flex; width:75vw; padding:60px 040px; max-width:1200px;}
.prod-left { flex:1 1 auto; min-width:0; width:1%;}
.prod-left .slide-for {margin-bottom:20px;}
.prod-left .slide-for .item {position:relative; padding-bottom:64.36%; border-radius:16px;overflow:hidden; }
.prod-left .slide-for .item img {position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}
.prod-left .slide-nav {padding:0 25px;}
.prod-left .slide-nav .item {position:relative; padding-bottom:63.64%; border-radius:8px; overflow:hidden;}
.prod-left .slide-nav .item img {position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}
.prod-left .slide-nav .slick-list {margin:0 -10px;}
.prod-left .slide-nav .slick-slide {padding:0 10px;}

.prod-right {margin-left:40px; max-width:47.4%; width:100%;}

.pop-tit {padding-bottom:17px; margin-bottom:27px; font-size:var(--font-size-30); letter-spacing:-.03em; color:#222; border-bottom:1px solid #ccc; text-transform: uppercase;}
.prod-right dl {display:flex; margin-top:20px;}
.prod-right dl:nth-child(2) {margin-top:0;}
.prod-right dl dt {font-size:var(--font-size-16); width:90px; margin-right:40px; line-height:1.2em; color:#242424; letter-spacing:-.03em; font-weight:700;}
.prod-right dl dd {font-size:var(--font-size-16); color:#505050; letter-spacing:-.03em; line-height:1.2em;}