@charset "utf-8";
/* Dealership */
.dl-tab { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; margin-bottom: 75px; }
.dl-tab li { width: 400px; height: 50px; border: 1px solid #ddd;}
.dl-tab li a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-size: 16px; font-weight: 400; letter-spacing: -.01em; color: #878787;}
.dl-tab li.active { background: #2c2c2c; border: 1px solid #2c2c2c;}
.dl-tab li.active a { color: #fff; }
.ds-box { padding-bottom: 100px; border-bottom: 1px solid #ddd; margin-bottom: 85px;}
.ds-box h2 { font-size: 46px; font-weight: 300; letter-spacing: -.01em; line-height: 1.2em; margin-bottom:20px; color: #2c2c2c;}
.mapbox { position: relative; margin-bottom: 40px; }
.ds-box.mg { border: none; margin: 0; padding: 0; }
.lct { display: flex; }
.lct>div { width: calc(100%/2); display: flex; align-items: center; }
.lct>div .iconbox { display: flex; align-items: center; justify-content: center; width: 80px; height: 80px; background: #2c2c2c; }
.lct>div .info { padding-left: 30px; flex: 1 1 auto; min-width: 0; width: 1%;}
.lct>div .info h3 { font-size: 20px; font-weight: 300; letter-spacing: -.01em; line-height: 1em; color: #2c2c2c; margin-bottom: 15px;}
.lct>div .info .infobox { display: flex; gap: 10px 50px; flex-wrap: wrap;} 
.lct>div .info .infobox p { display: inline-block; font-weight: 300; letter-spacing: -.01em; line-height: 1.3em; color: #505050; }
.lct>div .info .infobox p strong { font-weight: 600; color: #2c2c2c;}

/* sub1 공통 */
.sub1-fx { margin-bottom: 150px; position: relative; }
.sub1-fx.mg {margin-bottom: 0; }
.sub1-fx::before { content: ""; position: absolute; left: 0; width: 100px; height: 100%; background: #f4f4f4; top: 0;}
.sub1-fx .contain { display: flex; align-items: center; }
.sub1-fx .contain::after { content: none;}
.sub1-left { width: 50%; font-family:'Lambo'; padding-right: 100px;}
.sub1-tit { font-size: 46px; font-weight: 400; letter-spacing: -.01em; line-height: 1.2em; color: #2c2c2c;}
.sub1-left .line { width: 1px; height: 60px; background: #2c2c2c; margin: 25px 5px; }
.sub1-left p { line-height: 1.666em; font-size: 16px; letter-spacing: -.01em; color: #505050; font-weight: 200; margin-bottom: 20px; }
.sub1-txtbox p { color: #2c2c2c; position: relative; font-weight: 400; padding-left: 30px; margin-bottom: 30px; }
.sub1-txtbox p:last-child { margin-bottom: 0; }
.sub1-txtbox p::before { content: ""; position: absolute; left: 0; width: 19px; height: 17px; background: url(../images/sub/huracan-chk.png) center no-repeat; background-size: contain; top: 5px;}
.sub1-left p span { font-size: 14px; display: block; font-weight: 200; letter-spacing: -.01em; line-height: 1.6em; color: #878787; margin-top: 15px;}
.sub1-fx.rv .contain{ flex-direction: row-reverse; }
.sub1-right { width: 100%; margin-right: -50%;}
.sub1-fx.rv::before { left: auto; right: 0;}
.sub1-fx.rv .sub1-left { padding-right: 0; padding-left: 100px; }
.sub1-fx.rv .sub1-right { margin-right: 0; margin-left: -50%; text-align: right;}
.sub1-contact .contain { align-items: flex-start;}
.sub1-contact { display: flex; align-items: center; background: #000; }
.sub1-contact .img { width: 100%; margin-left: -50%; text-align: right;}
.sub1-contact .form { width: 50%; padding-left: 70px; padding-top: 50px; padding-bottom: 50px;}
.sub1-contact::before { display: none !important;}
.sub1-contact .form .sub1-tit { color: #fff; margin-bottom: 55px; }
.sub1-contact .form-fx { display: flex; flex-wrap: wrap; gap: 30px 38px; }
.sub1-contact .form-fx dl { width: calc(100%/2 - 19px); color: #fff;}
.sub1-contact .form-fx dl.w100 { width: 100%; }
.sub1-contact .form-fx dl dt { font-size: 18px; font-weight: 500; line-height: 1.3em; letter-spacing: -.03em; margin-bottom: 15px;}
.sub1-contact .form-fx dl dd { width: 100%; }
.sub1-contact .form-fx dl dd .input { height: 42px; border: none; border-bottom: 1px solid #2c2c2c; background: transparent; color: #fff; padding: 5px;}
.sub1-contact .form-fx dl dd select { color: #888 !important;}
.sub1-contact .form-fx dl dd .input::placeholder { font-size: 14px; font-weight: 400; letter-spacing: -.03em; color: rgba(255,255,255,0.6);}
.sub1-contact .form-fx dl dd .input:focus { outline: none;}
.sub1-contact .form-fx dl dd .input.datepicker { background: transparent url(/images/sub/datepicker.png) right 10px center no-repeat;}
.sub1-contact .form-fx dl dd .input2 { border: 1px solid #2c2c2c;}
.sub1-contact .form .submit-area {display:flex; justify-content:space-between; align-items:flex-end; margin-top:40px;}
.sub1-contact .form .form-agree {margin:0; color: #fff;}
.sub1-contact .form .form-agree .check {text-align:left; color: #fff;}
.sub1-contact .form .form-agree .check a { color: #505050;}
.sub1-contact .form .btn-pack.dark {background:#000; border-color:#000;}

.sub1-swiper { width: 100%; position: relative; overflow: hidden; background: #000; height: 87vh;}
/* .sub1-swiper .swiper-wrapper {transform:none !important;}
.sub1-swiper .swiper-slide { position: absolute; top: 0; right: 0; width: 100%; height: 100%; z-index: 1; overflow: hidden;}
.sub1-swiper .swiper-slide-active { z-index: 2;} */

.sub1-swiper .swiper-slide {position: absolute; top: 0; right: 0; width: 100%; height: 100%; z-index: 1; opacity:0 !important; transition:none !important;}
.sub1-swiper .swiper-slide.visible {z-index: 2; opacity:1 !important;}
.sub1-swiper .swiper-slide .inner-slide { position: relative; height: 100%; background-color: transparent;background-repeat: no-repeat; -webkit-background-position: center; background-position: center; -webkit-background-size: cover; background-size: cover; overflow: hidden;}
.sub1-swiper .swiper-slide img {position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;}
.sub1-swiper .swiper-slide.is-animating  {z-index: 3; opacity:1 !important;}
.sub1-swiper .swiper-slide.is-animating .inner-slide { -webkit-animation: 800ms ease-out animation-1g0e0x4 forwards; animation: 800ms ease-out animation-1g0e0x4 forwards; }
.sub1-swiper .swiper-slide.prev.is-animating .inner-slide { -webkit-animation: 800ms ease-out animation-12dq76d forwards; animation: 800ms ease-out animation-12dq76d forwards; }

@-webkit-keyframes animation-12dq76d{
    0%{-webkit-clip-path:polygon(-40% 0, -20% 0, 0% 100%, -20% 100%); clip-path:polygon(-40% 0, -20% 0, 0% 100%, -20% 100%);}
    100%{-webkit-clip-path:polygon(0 0, 100% 0%, 120% 100%, 0% 100%);clip-path:polygon(0 0, 100% 0%, 120% 100%, 0% 100%);}
}
@keyframes animation-12dq76d{
    0%{-webkit-clip-path:polygon(-40% 0, -20% 0, 0% 100%, -20% 100%);clip-path:polygon(-40% 0, -20% 0, 0% 100%, -20% 100%);}
    100%{-webkit-clip-path:polygon(0 0, 100% 0%, 120% 100%, 0% 100%);clip-path:polygon(0 0, 100% 0%, 120% 100%, 0% 100%);}
}
@-webkit-keyframes animation-1g0e0x4{
    0%{-webkit-clip-path:polygon(120% 0%, 140% 0, 120% 100%, 100% 100%);clip-path:polygon(120% 0%, 140% 0, 120% 100%, 100% 100%);}
    100%{-webkit-clip-path:polygon(0% 0%, 100% 0%, 100% 100%, -20% 100%);clip-path:polygon(0% 0%, 100% 0%, 100% 100%, -20% 100%);}
}
@keyframes animation-1g0e0x4{
    0%{-webkit-clip-path:polygon(120% 0%, 140% 0, 120% 100%, 100% 100%);clip-path:polygon(120% 0%, 140% 0, 120% 100%, 100% 100%);}
    100%{-webkit-clip-path:polygon(0% 0%, 100% 0%, 100% 100%, -20% 100%);clip-path:polygon(0% 0%, 100% 0%, 100% 100%, -20% 100%);}
}

.sub1-swiper-button-prev::after, .sub1-swiper-button-next::after { display: none;}
.sub1-swiper-button-prev, .sub1-swiper-button-next { width: 60px; height: 67px; margin-top: -33px; background-repeat: no-repeat; background-position: center; background-image: url(../images/main/main-bt-af.png); transition: .2s; position: absolute; top: 50%; transform: translateY(-50%); margin-top: -33px; z-index: 9; background-color: transparent; display: flex; align-items: center; justify-content: center; cursor: pointer;}
.sub1-swiper-button-prev .arrow, .sub1-swiper-button-next .arrow{ background-size: contain; background-repeat: no-repeat; background-position: center; width: 11px; height: 19px; margin: auto; transition: .2s;}
.sub1-swiper-button-prev { left: 60px;}
.sub1-swiper-button-prev .arrow { background-image: url(../images/main/main-leftbt-w.png);}
.sub1-swiper-button-prev:hover { background-image: url(../images/main/main-bt-clr.png);}
.sub1-swiper-button-prev:hover .arrow { background-image: url(../images/main/main-leftbt.png);}
.sub1-swiper-button-next { right: 60px;}
.sub1-swiper-button-next .arrow { background-image: url(../images/main/main-rightbt-w.png);}
.sub1-swiper-button-next:hover { background-image: url(../images/main/main-bt-clr.png);}
.sub1-swiper-button-next:hover .arrow { background-image: url(../images/main/main-rightbt.png);}

.sub1-swiper.transition {pointer-events:none;}

/* huracan */
.hc-list { display: flex; flex-wrap: wrap; gap: 55px 40px; margin-bottom: 130px;}
.hc-list li { width: calc(100%/2 - 20px); font-family:'Lambo';}
.hc-list li .tit { font-size: 32px; font-weight: 400; letter-spacing: -.01em; line-height: 1.3em; color: #2c2c2c; margin: 35px 0 18px;}
.hc-list li .txt { font-size: 16px; font-weight: 200; line-height: 1.666em; letter-spacing: -.01em; color: #505050; margin-bottom: 18px;}
.hc-list li .txt:last-child { margin-bottom: 0; }

/* customer app */
.ct-fx { margin-bottom: 150px; background: #f4f4f4;}
.ct-fx .contain { display: flex; align-items: center; }
.ct-fx .contain::after { content: none;}
.ct-left { width: 100%; margin-left: -50%;}
.ct-right { width: 50%; padding-left: 100px; font-family:'Lambo';}
.ct-right h3 { font-size: 32px; font-weight: 400; letter-spacing: -.01em; line-height: 1.3em; margin-bottom: 20px; color: #2c2c2c;}
.ct-right p { font-size: 16px; color: #454545; font-weight: 200; letter-spacing: -.01em; line-height: 1.666em; margin-bottom: 70px;}
.ct-btbox { display: flex; gap: 10px; align-items: center; position: relative; }
.ct-swiper{ width: 100%; position: relative; overflow: hidden; text-align: right;}
.ct-swiper-button-prev::after, .ct-swiper-button-next::after { display: none;}
.ct-swiper-button-prev, .ct-swiper-button-next { width: 56px; height: 56px; border-radius: 100%; border: 1px solid #ddd; position: relative; top: auto; margin-top: 0; background-repeat: no-repeat; background-position: center; background-size: 12px; transition: .2s;}
.ct-swiper-button-prev { background-image: url(../images/sub/owner-leftbt-w.png); left: auto;}
.ct-swiper-button-prev:hover { background-image: url(../images/sub/owner-leftbt.png); border: 1px solid #2c2c2c;}
.ct-swiper-button-next { background-image: url(../images/sub/owner-rightbt-w.png); right: auto;}
.ct-swiper-button-next:hover { background-image: url(../images/sub/owner-rightbt.png); border: 1px solid #2c2c2c;}
.ct-ab { padding-bottom: 500px;}
.ct-img { position: absolute; left: 0; bottom: 0;}

/* event */
.event-tab { display: flex; justify-content: center; max-width: 800px; width: 100%; position: relative; margin: 0 auto 100px; gap: 5px;}
.event-tab li { flex: 1; height: 50px; border: 1px solid #ddd; text-align: center;} 
.event-tab li a { display: flex; align-items: center; height: 100%; width: 100%; justify-content: center; font-size: 16px; font-weight: 400; letter-spacing: -.01em; line-height: 1em; color: #878787;}
.event-tab li.active { border: 1px solid #2c2c2c; background: #2c2c2c;}
.event-tab li.active a { color: #fff; }
