@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.root_daum_roughmap {width:100% !important; height:clamp(250px, calc( 522 / var(--inner) * 100vw ), 522px) !important;}
.root_daum_roughmap .wrap_map {height:clamp(250px, calc( 522 / var(--inner) * 100vw ), 522px) !important;}
.roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.roughmap_lebel_text:after {content:"명주창고"; font-size:12px; line-height:15px;}

.bullet-item .bullet-list {position:relative; padding-left:clamp(13px, calc( 16 / var(--inner) * 100vw ), 16px); margin-top:clamp(9px, calc( 12 / var(--inner) * 100vw ), 12px); line-height:1.6; color: #484848;}
.bullet-item .bullet-list:first-child {margin-top:0;}
.bullet-item .bullet-list::before {position:absolute; content:''; left:0; top:9px; width:clamp(3px, calc( 5 / var(--inner) * 100vw ), 5px); height: clamp(3px, calc( 5 / var(--inner) * 100vw ), 5px); background:var(--color-primary); border-radius: 50%;}
.bullet-item .bullet-list.none {padding-left: 0;}
.bullet-item .bullet-list.none::before {display: none;}

.bg-gray {background:#fafafa;}

.mainsubtext {margin-bottom: clamp(30px, calc( 40 / var(--inner) * 100vw ), 40px); font-size: clamp(17px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight: 600; line-height: 1.5;}

.greetcontain {padding: clamp(60px, calc( 110 / var(--inner) * 100vw ), 110px) 0; background:url(../images/sub/greet-bg.jpg) no-repeat 50% 50%/cover;}
.greetcontain .txtbx {padding:clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px) clamp(15px, calc( 40 / var(--inner) * 100vw ), 40px); text-align: center; background: rgba(0, 0, 0, 0.48); backdrop-filter: blur(20px); color: #fff; font-size: clamp(18px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight: bold; line-height: 1.5;}
.greetcontain .logoitem {display: flex; justify-content: center;flex-wrap: wrap; padding:clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px) clamp(10px, calc( 16 / var(--inner) * 100vw ), 16px) 0;max-width:1030px;width:100%;margin:0 auto;}
.greetcontain .logolist {padding: 20px;flex:1 0 25%; max-width:25%;}
.greetcontain .logolist .logo-header {margin-bottom: clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px); padding:clamp(12px, calc( 17 / var(--inner) * 100vw ), 17px) 10px; background: #dddddd;border-radius: 9px; font-size:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 600; text-align: center;}
.greetcontain .logolist .logo-body {padding: clamp(12px, calc( 20 / var(--inner) * 100vw ), 20px) 10px; background: #fff; border-radius: 8px;text-align: center;}
.greetcontain .logolist .logo-body img {height: clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px);}
.greetcontain .logolist .name {color: #484848;}

.introimg {margin-bottom: clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); text-align: center;}
.introtxtbx {display: flex; flex-wrap: wrap; margin: -5px;}
.intxtitem {padding: 5px; width: 50%;}
.intxtlist {display: flex; flex-wrap: wrap; letter-spacing: -0.4px;}
.intxtlist + .intxtlist {margin-top: 10px;}
.intxtlist .titbx {flex: 1 0 clamp(120px, calc( 160 / var(--inner) * 100vw ), 160px); max-width: clamp(120px, calc( 160 / var(--inner) * 100vw ), 160px); margin-right: 10px; display: flex; align-items: center; justify-content: center; border-radius: 8px; background: #dddddd; font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: 600;text-align: center;}
.intxtlist .descbx {flex: 1 0 auto; width: 1%; border-radius: 8px; border: 1px solid #ddd;color: #484848;background:#fff;}
.intxtlist .titbx,
.intxtlist .descbx {padding: 12px 15px;}
.intxtitem.type2 {width: 53%;}
.intxtitem.type2 .intxtlist .titbx {flex: 1 0 clamp(200px, calc( 250 / var(--inner) * 100vw ), 250px); max-width: clamp(200px, calc( 250 / var(--inner) * 100vw ), 250px);}
.intxtitem.type3 .intxtlist .titbx {flex: 1 0 clamp(150px, calc( 190 / var(--inner) * 100vw ), 190px); max-width: clamp(150px, calc( 190 / var(--inner) * 100vw ), 190px);}

.logotxtitem {display: flex; flex-wrap: wrap; margin: -10px;}
.logotxtlist {flex: 1 0 25%; max-width: 25%; padding: 10px;}
.logotxtlist .inner {height: 100%; letter-spacing: -0.3px;}
.logotxtlist .link {display: flex; flex-direction: column; align-items: center; justify-content: center; padding:clamp(12px, calc( 20 / var(--inner) * 100vw ), 20px) 10px; margin-bottom: clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px); border-radius: 8px; border: 1px solid #ddd;}
.logotxtlist .link img {height: clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px);}
.logotxtlist .link .name {color: #484848;}
.logotxtlist .bulletbx {padding:clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px) clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); border-radius: 8px; border: 1px solid #ddd; height: 340px;}
.logotxtlist .inbullet-list {line-height: 1.6;}

.arrowbx {margin-top: 20px; padding:clamp(20px, calc( 35 / var(--inner) * 100vw ), 35px) clamp(12px, calc( 15 / var(--inner) * 100vw ), 15px); background: #fff8f8;}
.arrowitem {display: flex; justify-content: center; align-items: center; flex-wrap: wrap; margin: -10px -43px;}
.arrowlist {padding:10px 43px; font-size: clamp(15px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight: 600;}
.arrowlist img {width: clamp(15px, calc( 49 / var(--inner) * 100vw ), 49px); vertical-align: middle;}
.arrowlist.arrow {padding: 0;}

.businessbx {display: flex; justify-content: space-between; flex-wrap: wrap; background:url(../images/sub/logo-bg.png) no-repeat top 90px center; background-size:clamp(300px, calc( 623 / var(--inner) * 100vw ), 623px) auto;}
.businessbx .commbx {width:480px;}
.businessbx .comhead {margin-bottom: clamp(30px, calc( 40 / var(--inner) * 100vw ), 40px); padding: clamp(12px, calc( 18 / var(--inner) * 100vw ), 18px) 10px; font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: bold; background: #dddddd; border-radius: 8px; box-shadow:0 4px 8px rgba(0, 0, 0, 0.32); text-align: center; width: 100%;}
.businessbx .bodylist + .bodylist {margin-top: clamp(30px, calc( 40 / var(--inner) * 100vw ), 40px);}
.businessbx .bodylist .name {display: flex; justify-content: space-between; align-items: center; margin-bottom: clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); width: 100%; font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 600; }
.businessbx .bodylist .name .txt {display: inline-block; padding-right: clamp(15px, calc( 40 / var(--inner) * 100vw ), 40px); white-space: nowrap;}
.businessbx .bodylist .name .border {width: 100%; height: 1px; background: #222;}

.envcotain {position: relative; margin-top: -78px;}
.envcotain .intxtitem.type2 {position: absolute; bottom: 0; right: 0;}
.envcotain .intxtlist .titbx,
.envcotain .intxtlist .descbx {padding: clamp(12px, calc( 18 / var(--inner) * 100vw ), 18px) 15px; color: #484848;}

.envinner  {margin-top: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px);}
.envinner .introtit {margin-bottom:clamp(10px, calc( 15 / var(--inner) * 100vw ), 15px); font-size:clamp(16px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight: bold;}
.envinner .innerborder {display: flex; flex-wrap: wrap; padding: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px) clamp(15px, calc(36 / var(--inner) * 100vw ),36px);border: 1px solid #ddd; border-radius: 8px;}
.envinner .bullet-item {width: 50%;}


.btn-arrow {margin-top:0; top:50%; width:clamp(30px, calc( 80 / var(--inner) * 100vw ), 80px); height:clamp(30px, calc( 80 / var(--inner) * 100vw ), 80px); border-radius:50%;  transition: all 0.3s;}
.btn-arrow::after {display: none;}
.swiper-button-next {right:clamp(2px, calc( 10 / var(--inner) * 100vw ), 10px); background:url(../images/sub/arrow-right.png) no-repeat center center; background-size:contain !important;}
.swiper-button-next:hover {background:url(../images/sub/arrow-righton.png) no-repeat ; }
.swiper-button-prev {left:clamp(2px, calc( 10 / var(--inner) * 100vw ), 10px); background:url(../images/sub/arrow-left.png) no-repeat center; background-size:contain !important;}
.swiper-button-prev:hover {background:url(../images/sub/arrow-lefton.png) no-repeat ;}

.slidecont {position:relative; padding-right:clamp(10px, calc( 225 / var(--inner) * 100vw ), 225px); padding-left:clamp(10px, calc( 225 / var(--inner) * 100vw ), 225px); max-width:1500px; width:100%; margin:0 auto;}
.slidecont .ginner {display:block;}
.slidecont .ginner .textbx {padding-bottom:clamp(20px, calc( 45 / var(--inner) * 100vw ), 45px); text-align:center;}
.slidecont .ginner .title {font-size:clamp(16px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight:600; }

.location-area {max-width: 1000px; margin: 0 auto; width: 100%;}
.location-area .wrap iframe {height:clamp(250px, calc( 522 / var(--inner) * 100vw ), 522px); width:100%;}
.location-area .intxtitem {margin-top: 20px; padding: 0; width: 100%;}
.location-area .intxtlist .titbx,
.location-area .intxtlist .descbx {padding: clamp(12px, calc( 20 / var(--inner) * 100vw ), 20px) clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px);}

.greetcontain .logolist .logo-header:lang(en) {height:clamp(70px, calc( 86 / var(--inner) * 100vw ), 86px);}
.logotxtlist .bulletbx:lang(en) {height:450px;}
.envcotain:lang(en) {margin-top:0;padding-bottom:120px;}