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

.bullet-item .bullet-list {position:relative; padding-left:15px; margin-top:10px; line-height:1.3;}
.bullet-item .bullet-list:first-child {margin-top:0;}
.bullet-item .bullet-list::before {position:absolute; content:''; left:0; top:9px; width:3px; height: 3px; 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:#f4f4f7;}
.subsec-pd {padding: clamp(60px, calc( 100 / var(--inner) * 100vw ), 100px) 0;}
.bdtopsec-pd {padding-top: clamp(40px, calc( 60 / var(--inner) * 100vw ), 60px); margin-top: clamp(40px, calc( 60 / var(--inner) * 100vw ), 60px); border-top: 1px dashed #ddd;}
.bdtopsec-pd.none {margin-top: 0; padding-top: 0; border-top: 0;}
.textdot {margin-bottom:clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); padding-left: clamp(20px, calc( 28 / var(--inner) * 100vw ), 28px); position: relative; font-size:clamp(20px, calc( 32 / var(--inner) * 100vw ), 32px); font-weight: bold;}
.textdot::before {position: absolute; content: ''; left: 0; top: clamp(7px, calc( 10 / var(--inner) * 100vw ), 10px); width: clamp(14px, calc( 20 / var(--inner) * 100vw ), 20px); height: clamp(14px, calc( 20 / var(--inner) * 100vw ), 20px); border: 4px solid var(--color-secondary); border-radius: 50%;}
.textbg {padding-left: clamp(25px, calc( 30 / var(--inner) * 100vw ), 30px); margin-bottom: clamp(15px, calc( 24 / var(--inner) * 100vw ), 24px); position: relative; font-size: clamp(16px, calc( 22 / var(--inner) * 100vw ), 22px); font-weight: 600;}
.textbg::before {position: absolute; content: ''; left: 0; top: clamp(4px, calc( 8 / var(--inner) * 100vw ), 8px); ; width: clamp(14px, calc( 20 / var(--inner) * 100vw ), 20px); height: clamp(14px, calc( 20 / var(--inner) * 100vw ), 20px); background: url(../images/sub/textbg.png) no-repeat; background-size: contain; }


.sub01_1 {padding-top: clamp(20px, calc( 120 / var(--inner) * 100vw ), 120px);}
.sub01_1 .flxWrap {padding:clamp(50px, calc( 80 / var(--inner) * 100vw ), 80px) 0; position: relative;}
.sub01_1 .imgbx {position: absolute; bottom: 0; }
.sub01_1 .imgbx img {height: clamp(150px, calc( 524 / var(--inner) * 100vw ), 524px);}
.sub01_1 .textbx {flex: 1 0 auto; width: 1%; padding-left: clamp(100px, calc( 524 / var(--inner) * 100vw ), 524px);}
.sub01_1 .tit {font-size: clamp(24px, calc( 60 / var(--inner) * 100vw ), 60px); font-weight: 600;}
.sub01_1 .signbx {display: flex; align-items: center; padding-top: clamp(30px, calc( 50 / var(--inner) * 100vw ), 50px); font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: 600;}
.sub01_1 .signbx .name {padding-left: clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px);}
.sub01_1 .signbx .name img {width:clamp(40px, calc( 77 / var(--inner) * 100vw ), 77px) ;}
.sub01_1 .signbx .name.ty2 img {width:clamp(50px, calc( 93 / var(--inner) * 100vw ), 93px) ;}
.greetingtext {margin-top: clamp(40px, calc( 80 / var(--inner) * 100vw ), 80px); letter-spacing: -0.5px;}
.greetingtext .dec + .dec {margin-top:clamp(18px, calc( 32 / var(--inner) * 100vw ), 32px); }
.greetingtext .dec {font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); color: #454545; line-height: 1.6;}

.sub01_2_1 .topimg {position: relative; background: url(../images/sub/sub01_2-img1.jpg) no-repeat center center / cover; height: clamp(200px, calc( 450 / var(--inner) * 100vw ), 450px);}
.sub01_2_1 .topimg .text {padding: clamp(20px, calc( 50 / var(--inner) * 100vw ), 50px) clamp(15px, calc( 50 / var(--inner) * 100vw ), 50px); position: absolute; left: 0; top: 0; color: #fff; font-size: clamp(22px, calc( 50 / var(--inner) * 100vw ), 50px); font-weight: 800;}
.sub01_2_1 .toplogobx {padding-top: clamp(50px, calc( 90 / var(--inner) * 100vw ), 90px); position: relative; text-align: center;}
.sub01_2_1 .toplogobx:after {position: absolute; content: ''; left: 50%; top: -50px; transform: translateX(-50%); width: 2px; height: clamp(50px, calc( 100 / var(--inner) * 100vw ), 100px); background: var(--color-secondary);}
.sub01_2_1 .toplogobx img {width: clamp(100px, calc( 156 / var(--inner) * 100vw ), 156px);}
.subbdlist .inner {padding: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px) clamp(12px, calc( 20 / var(--inner) * 100vw ), 20px); border-top: 1px solid #ddd;}
.subbdlist .textbx {padding-left: clamp(20px, calc( 28 / var(--inner) * 100vw ), 28px);}
.subbdlist .textbx .tt {font-size: clamp(18px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight: 600; color:var(--color-primary); line-height: 1.2;}
.subbdlist .textbx .dec {padding-top:8px; font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); color: #454545; line-height: 1.55;}
.subbdlist .rodilist {display: flex; flex-wrap: wrap; }
.subbdlist .rodiitem {flex: 1 0 33.33%; max-width: 33.33%; }
.subbdlist .rodiitem .ininner {padding: clamp(30px, calc( 50 / var(--inner) * 100vw ), 50px) 20px; text-align: center; height: 100%; border: 1px solid #ddd;}
.subbdlist .rodiitem:not(:last-child) .ininner {margin-right: -1px;}
.subbdlist .rodiitem {flex: 1 0 33.33%; max-width: 33.33%; }
.subbdlist .rodiitem .name {margin-top: clamp(10px, calc( 18 / var(--inner) * 100vw ), 18px); font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 600; line-height:1.4;}
.stepnumlist {display: flex; flex-wrap: wrap; margin:-15px;}
.stepnumitem {flex:1 0 33.33%; max-width: 33.33%; padding:15px;}
.stepnumitem .inner {padding: clamp(25px, calc( 40 / var(--inner) * 100vw ), 40px) 20px; border: 1px solid #ddd; height: 100%; border-radius: 16px; background: #fff; text-align: center;}
.stepnumitem .num {display: inline-flex; align-items: center; justify-content: center; margin-bottom: clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px); width:clamp(65px, calc( 80 / var(--inner) * 100vw ), 80px); height: 28px; border-radius: 14px; background: var(--color-primary); color: #fff; font-size:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: bold;}
.stepnumitem .name {margin-top: clamp(15px, calc( 25 / var(--inner) * 100vw ), 25px); font-size: clamp(16px, calc( 22 / var(--inner) * 100vw ), 22px); font-weight: 600;}
.stepnumitem .dec {padding-top:8px;  color: #454545; line-height: 1.55;}

.orgimg + .orgimg {margin-top:clamp(40px, calc( 100 / var(--inner) * 100vw ), 100px);}

.history-wrap {position:relative; color: #454545;}
.history-wrap:before {top:10px; bottom:0; position:absolute; left:300px; width:1px; background-color:#ddd; content:"";}
.history-item {padding-bottom:100px; display:flex; align-items:initial;}
.history-item:last-child {padding-bottom:0;}
.history-item .history-year {position:relative; top:0; left:0; width:300px; color:#242424; font-size:28px; line-height:1.4em; letter-spacing:-.03em; text-align:right; padding-right:0; display:flex; justify-content:space-between;}
.history-item .history-year strong {line-height:1em; display:inline-block; text-align:center; transition:all 0.5s ease; font-weight:500; flex:1;}
.history-month-box {padding-left:105px; flex:1;}
.history-detail {margin-bottom:15px; display:flex; font-size:18px; letter-spacing:-.03em; font-weight:500; transition:all 0.5s ease;}
.history-detail:last-child {margin-bottom:0;}
.history-detail .month {width:40px; color:#242424; display:block;}
.history-detail p {flex:1;}

.history-item .dots {width:10px; height:10px; top:9px; right:-5px; margin:0; position:relative; border:2px solid #000; background:#fff; border-radius:50%; transition:all 0.3s; z-index:0;}
.history-item .dots .inner-dots {width:100px; height:100px; position:absolute; background:rgba(219, 42, 39, 0.1); border-radius:100%; top:50%; left:50%; transform:translate(-50%,-50%) scale(0); z-index:-1; transition:all 0.3s;}
.history-item .dots .inner-dots:after {width:60px; height:60px; display:block; content:""; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%) scale(0); z-index:-1; background:rgba(219, 42, 39, 0.3); border-radius:100%; transition:all 0.5s;}
.history-item.active .history-year {font-size:60px;}
.history-item.active .history-year strong {font-weight:600;line-height:.6em; color:var(--color-primary);}
.history-item.active .history-detail {color: #242424;}
.history-item.active .history-month-item {color:#242424;}
.history-item.active .dots .inner-dots {transform:translate(-50%,-50%) scale(1); animation:ani .5s forwards ease; animation-delay:.05s;}
.history-item.active .dots .inner-dots:before {width:40px; height:40px; display:block; content:""; background:#fff; position:absolute; left:50%; top:50%; border-radius:100%; border:10px solid rgba(219, 42, 39, 1); animation:ani .5s forwards ease; animation-delay:.02s;}
.history-item.active .dots .inner-dots:after {animation:ani .5s forwards ease; animation-delay:.08s;}

@keyframes ani {
	0% {transform:translate(-50%,-50%) scale(0);}
	100% {transform:translate(-50%,-50%) scale(1);}
}

@media (max-width: 1024px) {
	.history-item {padding-bottom: 80px;}
	.history-item .history-year {width: 250px;}
	.history-month-box {padding-left:100px;}
	.history-detail {font-size: 16px;}
	.history-wrap:before {top:80px; left: 250px;}
	.history-item .dots .inner-dots {width:80px; height:80px;}
	.history-item .dots .inner-dots:after {width:50px; height:50px;}
	.history-item.active .dots .inner-dots:before {width:30px; height:30px;}
	.history-item.active .history-year {font-size: 36px;}
}

@media (max-width: 640px) {
	.history-wrap {padding-top:50px;}
	.history-month-box {padding-left:0;}
	.history-item {padding-bottom: 50px; display:block;}
	.history-item .history-year {width:100%; text-align:left;}
	.history-item .history-year strong {text-align:left; line-height:1.5em; margin-bottom:15px; display:block;}
	.history-item .dots {display:none;}
	.history-wrap:before {display:none;}
	.history-detail {margin-bottom:7px;}
	.history-detail .month {width:30px;}
	.history-item.active .history-year strong {line-height:1em;}
}

.tabwrap {margin-bottom:clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px);}
.tabwrap.ty2 {margin-bottom:clamp(40px, calc( 90 / var(--inner) * 100vw ), 90px);}
.tablist {display: flex;}
.tabitem {flex:1;}
.tabitem .tablink {display: flex; align-items: center; justify-content: center; padding: 0 10px;  height: clamp(42px, calc( 60 / var(--inner) * 100vw ), 60px); border: 1px solid #ddd; border-right: 1px solid #ddd; font-size: clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 600;}
.tabitem:not(:last-child) .tablink {margin-right: -1px;}
.tabitem.active .tablink {background: var(--color-primary); color: #fff;}

.licenselist {display: flex; flex-wrap: wrap; margin:-15px;}
.licenseitem {flex: 1 0 25%; max-width: 25%; padding:15px;}
.licenseitem .images {position:relative; padding-bottom:128.57%; overflow:hidden;}
.licenseitem .images img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%; height:auto; max-width:100%; min-height:100%;object-fit : cover;}

.licenselist + .tblbx {margin-top: clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px);}
.tblbx table {border-top: 2px solid #242424;}
.tblbx table th,
.tblbx table td {padding:clamp(12px, calc( 18 / var(--inner) * 100vw ), 18px) clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px); text-align: center; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd;} 
.tblbx table th:last-child,
.tblbx table td:last-child {border-right: 0;}
.tblbx table th {background: #f8f8f8;font-size:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 600;}
.tblbx table td {font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); color: #454545;}


.sectitbox {margin-bottom: clamp(25px, calc( 30 / var(--inner) * 100vw ), 30px); text-align: center;}
.sectitbox .tit {font-size: clamp(22px, calc( 40 / var(--inner) * 100vw ), 40px); font-weight: 700;}
.sectitbox .dec {padding-top: clamp(15px, calc( 32 / var(--inner) * 100vw ), 32px); font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); color: #454545; line-height: 1.55;}
.sectitbox .dot {margin:clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px) auto 0; width: 1px; height: clamp(30px, calc( 50 / var(--inner) * 100vw ), 50px); background: #ddd; }
.cilogolist {display: flex; flex-wrap: wrap;}
.cilogoitem {flex: 1 0 50%; max-width: 50%; }
.cilogoitem:not(:last-child) {margin-right: -1px;}
.cilogoitem .inner {display: flex; flex-wrap: wrap; justify-content: center;align-items: center; padding:20px; position: relative; height: clamp(200px, calc( 300 / var(--inner) * 100vw ), 300px); border: 1px solid #ddd;}
.cilogoitem .inner img {height: clamp(120px, calc( 147 / var(--inner) * 100vw ), 147px);}
.cilogoitem .inner.bg1 {background:var(--color-primary);}
.cilogoitem .tt {position: absolute; left: clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px); top: clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px); font-size: clamp(18px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight: 500; }

.mapfix {display: flex; flex-wrap: wrap;}
.map-tit {margin-bottom:clamp(20px, calc( 50 / var(--inner) * 100vw ), 50px); font-size:clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px);text-align:center;}
.mapwrap {margin-bottom:clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px);}
.mapwrap .map iframe {width:100%;height:clamp(250px, calc( 500 / var(--inner) * 100vw ), 500px);}
.mapinfo {position:relative;}
.mapinfo .maplinklist {position:absolute; right:0;top:0;}
.mapfixlist {display:flex;flex-wrap:wrap;margin:-50px -30px;}
.mapfixitem {flex:1 0 50%; max-width:50%; padding:50px 30px;}
.mapfixitem .mapinitem {flex-wrap:wrap;}
.mapfixitem .mapinitem .namebx {flex:1 0 100%; max-width:100%;}
.mapfixitem .mapinitem .desc {padding-left:clamp(22px, calc( 26 / var(--inner) * 100vw ), 26px);}

/*.mapinfo {flex: 1 0 auto; width: 1%;}*/
/*.mapwrap {flex: 1 0 55%; max-width: 55%; margin-left: 20px;}*/
.mapwrap .map {border-radius: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px); overflow: hidden;}
.mapinitem  + .mapinitem  {margin-top: clamp(12px, calc( 20 / var(--inner) * 100vw ), 20px);}
.mapinitem {display: flex;line-height: 1.875; letter-spacing: -0.5px;}
.mapinitem .namebx {flex: 1 0 clamp(95px, calc( 110 / var(--inner) * 100vw ), 110px); max-width: clamp(95px, calc( 110 / var(--inner) * 100vw ), 110px); display: flex; }
.mapinitem .namebx img {margin-top: 2px; width: clamp(14px, calc( 16 / var(--inner) * 100vw ), 16px); vertical-align: middle;}
.mapinitem .namebx .name {display: inline-block; padding-left:10px; font-size: clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: 500;}
.mapinitem .desc {flex: 1 0 auto ;width: 1%; color: #454545; }
.maplinklist {display: flex;   margin:-5px;}
.maplinkitem {padding: 5px;}
.maplinkitem .link {display: inline-flex; align-items: center; justify-content: center; padding: 0 5px; width: clamp(120px, calc( 160 / var(--inner) * 100vw ), 160px); height: clamp(38px, calc( 48 / var(--inner) * 100vw ), 48px); border-radius: 24px; border: 2px solid #686868; color:#686868; font-weight: 600;text-align:center;}
.maplinkitem:nth-child(odd):hover .link {background: var(--color-primary); color: #ffff; border-color: var(--color-primary);}
.maplinkitem:nth-child(even):hover .link {background: var(--color-secondary); color: #ffff; border-color: var(--color-secondary);}

.sub02topsec .textbx {text-align: center; letter-spacing: -0.6px;}
.sub02topsec .tit {font-size:clamp(18px, calc( 32 / var(--inner) * 100vw ), 32px); font-weight: 600;}
.sub02topsec .text {padding-top:clamp(15px, calc( 29 / var(--inner) * 100vw ), 29px); font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: 500; color: #454545; line-height:1.55;}
.sub02topsec .imgbx {padding-top: clamp(25px, calc( 55 / var(--inner) * 100vw ), 55px);}

.sub02midbgsec {padding: clamp(40px, calc( 50 / var(--inner) * 100vw ), 50px) 0; background: linear-gradient(to right, #292568, #1f4fa3);}
.midlist {display: flex; flex-wrap: wrap; margin: -10px;}
.miditem {flex: 1 0 33.33%; max-width: 33.33%; padding:10px; text-align: center;letter-spacing:-0.5px;}
.miditem .inner {padding:0 10px; height: 100%;}
.miditem:not(:last-child) .inner {border-right: 1px solid #ddd;}
.miditem .name {padding-top:clamp(15px, calc( 25 / var(--inner) * 100vw ), 25px);font-size: clamp(16px, calc( 22 / var(--inner) * 100vw ), 22px); font-weight: 600; color: #fff; line-height: 1.45;} 
.miditem .dec {padding-top: 6px; font-size: 18px; color: #fff; line-height: 1.7;}

/* 사업부문 슬라이드 공통스타일 */
.slideimgbx .images {aspect-ratio: 1200 / 600;}
.slideimgbx .images img {width:100%; height:100%; object-fit:cover;}
.slideimgbx .main-swipe {position: relative;}
.slideimgbx .main-textbx {display: flex; align-items: center; justify-content: space-between; position: absolute; left: 50%; bottom:clamp(10px, calc( 30 / var(--inner) * 100vw ), 30px); transform: translateX(-50%); padding:clamp(10px, calc( 12 / var(--inner) * 100vw ), 12px) clamp(12px, calc( 18 / var(--inner) * 100vw ), 18px); background: #5f5f5f;border-radius: 25px; color: #fff; z-index: 10; min-width: clamp(240px, calc( 400 / var(--inner) * 100vw ), 400px); text-align: center;} 
.main-textbx .title {font-size: clamp(14px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 600;}
.main-textbx .btn-arrow:after {display: none;}
.main-textbx .btn-arrow {flex: 1 0 clamp(18px, calc( 20 / var(--inner) * 100vw ), 20px); max-width: clamp(18px, calc( 20 / var(--inner) * 100vw ), 20px); width: clamp(18px, calc( 20 / var(--inner) * 100vw ), 20px); height: clamp(18px, calc( 22 / var(--inner) * 100vw ), 22px); color: #fff; position: initial; margin-top: 0;}
.main-textbx .text {padding: 0 10px;}
.slideimgbx .sub-swipe {margin-top:  clamp(10px, calc( 30 / var(--inner) * 100vw ), 30px); padding:0 clamp(20px, calc( 60 / var(--inner) * 100vw ), 60px) ; position: relative;}
.slideimgbx .sub-swipe .btn-arrow:after {display: none;}
.slideimgbx .sub-swipe .btn-arrow {width: clamp(26px, calc( 40 / var(--inner) * 100vw ), 40px); height: clamp(26px, calc( 40 / var(--inner) * 100vw ), 40px); color:#ccc; margin-top: 0; transform: translateY(-50%);}
.slideimgbx .sub-swipe .btn-arrow:hover {color:#242424;}
.slideimgbx .sub-swipe .swiper-button-prev {left: -8px;}
.slideimgbx .sub-swipe .swiper-button-next {right: -8px;}
/*.sub-swipe .swiper-slide-thumb-active:after {content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:2px solid var(--color-primary);}*/
.sub-swipe .swiper-slide .inner:hover .hover {opacity:1;}

.main-swipe .inner {position:relative;}
.main-swipe .hover {display:flex;flex-direction: column;  justify-content: flex-end;padding:clamp(5px, calc( 15 / var(--inner) * 100vw ), 15px) clamp(10px, calc( 50 / var(--inner) * 100vw ), 50px); position:absolute;left:0;bottom:0;width:100%;height:100%;z-index:10;color:#fff;background: linear-gradient(to top, rgba(0,0,0,0.7) 5%, transparent 50%);}
.main-swipe .hover .title { font-size:clamp(16px, calc( 36 / var(--inner) * 100vw ), 36px);font-weight:bold;}
.main-swipe .hover .title + .hoverlist {padding-top:clamp(15px, calc( 28 / var(--inner) * 100vw ), 28px);}
.main-swipe .hoverlist {display:flex;flex-wrap:wrap;width:100%;}
.main-swipe .hoveritem {flex:1 0 50%; max-width:50%;display:flex;align-items:center; padding-right:15px;letter-spacing:-0.02em;line-height:1.8;}
.main-swipe .hoverlist:lang(ko) {max-width:800px;}
.main-swipe .hoveritem.wid-100 {flex:1 0 100%; max-width:100%;}
.main-swipe .hoveritem .name {flex:1 0 clamp(65px, calc( 75 / var(--inner) * 100vw ), 75px); max-width:clamp(65px, calc( 75 / var(--inner) * 100vw ), 75px);font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px);font-weight:600;line-height:1.3;}
.main-swipe .hoveritem .desc {flex:1 0 auto;width:1%; font-size:clamp(13px, calc( 16 / var(--inner) * 100vw ), 16px);word-break:break-all;}
.main-swipe .hoveritem +.hoveritem {margin-top:2px;}
.sub-swipe .inner {position:relative;}
.sub-swipe .hover {display:flex; align-items:center;justify-content:center; padding:0 5px; position:absolute;left:0;bottom:0;width:100%;height:100%;color:#fff;z-index:1;text-align:center;opacity:0;}
.sub-swipe .hover:after {position:absolute;content:'';right:0;top:0;width:100%;height:100%; background:rgba(0,0,0,0.6);z-index:-1;}
.sub-swipe .hover .title {font-size:clamp(13px, calc( 16 / var(--inner) * 100vw ), 16px);font-weight:600;}

.subslidecont {position: relative;}
.subslidecont .images {aspect-ratio: 1200 / 400;}
.subslidecont .images img {width:100%; height:100%; object-fit:cover;}
.subslidecont .navigation {padding: clamp(4px, calc( 6 / var(--inner) * 100vw ), 6px) clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px); position: absolute; bottom:clamp(3px, calc( 20 / var(--inner) * 100vw ), 20px); right: clamp(3px, calc( 20 / var(--inner) * 100vw ), 20px); background: rgba(0,0,0,0.6); border-radius: 16px; z-index: 10;}
.subslidecont .navigation .flxWrap {align-items: center; margin:0 -6px;}
.subslidecont .commbx {padding:0 6px; position: relative;}
.subslidecont .commbx:not(:last-child):after {position: absolute; content: ''; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height:clamp(10px, calc( 12 / var(--inner) * 100vw ), 12px); background:rgba(255,255,255,0.4);}
.subslidecont .commbx .txt {display: block; padding: 0 clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px); font-size: clamp(10px, calc( 13 / var(--inner) * 100vw ), 13px); font-weight: 500;}
.subslidecont .btn-arrow { position: initial; margin-top: 0; width: auto; height: auto; color: #fff;}
.subslidecont .btn-arrow:after {display: none;}
.subslidecont .btn-arrow svg {width: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); height: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px);}

.bdtsection .bdtopsec-pd:first-child {margin-top: 0; padding-top: 0; border-top: 0;}
.slideinfobx {padding-top: clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px);}
.slideinfobx .title {font-size:clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px); font-weight: 600;}
.slideinfobx .bullet-item {padding-top: clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px);}
.slideinfobx .inner {display: flex; flex-wrap: wrap; color: #454545;}
.slideinfobx .inner .name {flex:1 0 clamp(110px, calc( 140 / var(--inner) * 100vw ), 140px); max-width: clamp(110px, calc( 140 / var(--inner) * 100vw ), 140px); padding-right:10px; font-weight: 500; font-size: clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px);}
.slideinfobx .inner .text {flex: 1 0 auto; width: 1%;}

.toptexticn {text-align: center;}
.toptexticn .toptit { font-size:clamp(24px, calc( 40 / var(--inner) * 100vw ), 40px); line-height:1.2; }
.toptexticn .subdec {padding-top: 6px; font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); color: #686868;}
.toptexticn .icn {margin: clamp(25px, calc( 50 / var(--inner) * 100vw ), 50px) 0 clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px);}
.toptexticn .icn img {width:clamp(120px, calc( 220 / var(--inner) * 100vw ), 220px);}

/* en */
.sub01_1 .tit:lang(en) {font-size: clamp(22px, calc(50 / var(--inner) * 100vw), 50px);}
.maplinkitem .link:lang(en)  {font-size: clamp(12px, calc(15 / var(--inner) * 100vw), 15px);}
/*.main-swipe .hoverlist:lang(en) {max-width:900px;}*/
.main-swipe .hoveritem .name:lang(en) {flex:1 0 clamp(85px, calc(120 / var(--inner) * 100vw), 120px); max-width:clamp(85px, calc(120 / var(--inner) * 100vw), 120px);padding-right:10px;}
.main-swipe .hover .title:lang(en) {font-size:clamp(16px, calc( 30 / var(--inner) * 100vw ), 30px);}
.main-swipe .hover:lang(en) {background: linear-gradient(to top, rgba(0,0,0,0.7) 10%, transparent 70%);}