/* BASIC css start */
#contents {}

.cateWrap {position:relative;background:#fff;width:95%; margin:0 auto;}
.cateWrap .cate1 dl dt{position:fixed;left:50%;top:1.111vw;transform:translateX(-50%); z-index:1001;}
.cateWrap .cate1 dl dt a{display:block; position:relative; padding-right:4.167vw; max-width:50vw; font-size:4.722vw;line-height:11.111vw; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;font-family :'FlightSans-Regular', sans-serif;}
.cateWrap .cate1 dl dt a svg{position:absolute; width:3.611vw; top: 50%; right:0; transform: translateY(-50%); transition:transform 0.3s;}
.cateWrap .cate1 dl dt a.active svg{ transform: translateY(-50%) rotate(-180deg);}
.cateWrap .cate1 dl dd{ display:none; position:fixed; top:var(--mainHeaderHeight); left:0; width:100%; padding:3.333vw 0; background:#fff; border-top: 1px solid #e9e9e9; z-index:1001;}
.cateWrap .cate1 dl dd ul li a{ display:block; padding:3.056vw; font-size:4.167vw; text-align:center; line-height:5.556vw; color:#b1b1b1; font-weight:500;font-family :'FlightSans-Regular', sans-serif;}
.cateWrap .cate1 dl dd ul li a.now{color:#000;font-family :'FlightSans-Bold', sans-serif;}
.cateWrap .cate1 .bgMask{ display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.2); z-index:998;}
.cateWrap .cate2 { padding:0 4.167vw; border-bottom:0.278vw solid #e9e9e9;}
.cateWrap .cate2 ul li{ width:auto; margin-right:6.111vw;}
.cateWrap .cate2 ul li a{ display:block; line-height:11.111vw; color:#b1b1b1; border-bottom:0.556vw solid #fff;font-family :'FlightSans-Regular', sans-serif;}
.cateWrap .cate2 ul li a.on{ color:#000; border-bottom:0.556vw solid #000;}
.cateWrap .cate3{ padding:0 4.167vw;background:#f8f8f8; border-bottom:0.278vw solid #e9e9e9;}
.cateWrap .cate3 ul li{ width:auto; margin-right:6.111vw;}
.cateWrap .cate3 ul li a{ display:block; line-height:11.111vw; font-size:3.056vw; color:#b1b1b1;}
.cateWrap .cate3 ul li a.on{color:#000;}

/* 메인 비쥬얼 배너 */
#main-banner01 {background:rgb(43, 46, 67);width:100%;}
.main-banner { position:relative;margin:0 auto;}
.main-banner .txt_wrap {color:#fff; width:90%; margin:0 auto; padding-top:50px;}
.main-banner .txt_wrap .sub{font-size:1.375rem; color:#fff; font-family :'FlightSans-Regular', sans-serif;}
.main-banner .txt_wrap .tit {font-size:2.5rem; font-family: 'FlightSans-Bold', sans-serif; display:block; padding-top:20px; color:#F89D1F; word-break:keep-all; line-height:1.2;}
.main-banner .txt_wrap .txt{font-size:1rem; padding-top:1.5rem; line-height:1.4; font-family :'FlightSans-Regular', sans-serif; opacity:0.7;word-break:keep-all; }
.main-banner .txt_wrap .txt span{color:#F5C5A9; font-weight:600; line-height:2.5; font-size:1.725rem;}
.main-banner .img{ margin:30px auto 0; text-align:right; display:block;}
.main-banner .img img{width:70%;}
.main-banner .swiper-slide img {}
.main-banner .swiper-slide .visual_txt { position:absolute; left:50%; top:0; font-weight:300; transform:translateX(-50%); width:100%; height:100%; display:flex; flex-flow:column; justify-content:center; max-width:1400px; margin:0 auto;}
.main-banner .swiper-slide .visual_txt h2 {font-size:2.3vw; font-weight:700;font-family: 'FlightSans-Bold', sans-serif; display:block; margin-bottom:20px; line-height:1.3; letter-spacing:-.5;}
.main-banner .swiper-slide .visual_txt h2>span{font-weight:bold;font-family: 'FlightSans-Title', sans-serif; color:#2871fa;}
.main-banner .swiper-slide .visual_txt .sub {font-size:1.2vw;font-weight:400;font-family: 'FlightSans-Regular', sans-serif;}
.main-banner .swiper-slide .visual_txt .time {font-size:.8vw; line-height:1; margin-top:20px; display:block;}
.main-banner .swiper-slide .visual_txt .visual_btn{height:50px; line-height:50px; border-radius:30px; padding:0 30px 0 30px; margin-top:7%; width:130px; overflow:hidden; font-size:18px; font-family: 'FlightSans-Bold', sans-serif; transition:all .5s; background:#2871fa; display:flex; border:2px solid #355BF5; color:#fff; justify-content:space-between;}
.main-banner .swiper-slide .visual_txt .visual_btn:hover{color:#2871fa; background:none;}
.main-banner .swiper-pagination-wrap {position: absolute; bottom: 26px; left: 50%; transform: translateX(-50%); display: flex; gap: 15px; width: 160px; height: 42px; border-radius: 25px; background: rgba(0, 0, 0, 0.4) !important; z-index: 1;}
.main-banner .swiper-button-prev,
.main-banner .swiper-button-next {width: 24px;height: 24px;top: 50%;transform: translateY(-50%);margin: 0;z-index: 20;opacity: 1 !important; visibility: visible !important;background-size:24px 24px !important;}
.main-banner:hover .swiper-button-prev,
.main-banner:hover .swiper-button-next { opacity: 1; visibility: visible; background-size:24px 24px !important;} 
.main-banner .swiper-pagination .swiper-pagination-bullet { width: 10px; height: 10px; background: #ddd; opacity: 0 !important; } 
.main-banner .swiper-button-prev {background: url('//skin.makeshop.co.kr/skin/onstore/pc/images/ic_arrow_w_prev.png') no-repeat center;}
.main-banner .swiper-button-next {background: url('//skin.makeshop.co.kr/skin/onstore/pc/images/ic_arrow_w_next.png') no-repeat center;}
.main-banner .swiper-pagination-fraction {position: relative;display: flex;gap: 20px;align-items: center;justify-content: center;height: 100% !important;top: 0; border-radius: 25px;}
.main-banner .swiper-pagination-fraction:before {content: '';position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 1px;height: 10px;background: #AAAAAA;}
.main-banner .swiper-pagination-fraction > span {font-weight: 700;font-size: 14px;text-align: center;color: #AAAAAA;}
.main-banner .swiper-pagination-fraction .swiper-pagination-current {color: #FFFFFF;}
#main-banner01 .main-banner .swiper-horizontal>.swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-horizontal, .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite, .swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{height:auto;}


.what{text-align:center; width:100%; padding:4rem 0 2rem; background:#F89D1F;}
.what .tit-wrap{width:90%; margin:0 auto; }
.what .tit-wrap .tit{font-size:1.125rem; font-family: 'FlightSans-Bold', sans-serif; display:inline-block; background:#fff; border:1px solid #ffc600; color:#F89D1F; padding:15px 35px; border-radius:50px;position:relative;}
.what .tit-wrap .tit:before {content:""; position:absolute; left:50%; top:100%; transform:translateX(-50%); width:1px; height:2.5rem; background:#fff; margin:1rem auto; display:inline-block;}
.what .tit-wrap .txt{font-size:1rem; padding-top:4.5rem; line-height:1.5; word-break:keep-all; color:#fff;font-family: 'FlightSans-Regular', sans-serif;}
.what .cate_wrap {display:flex; align-items:center; margin:3rem auto 0; gap:2%;flex-direction:column; width:90%;}
.what .cate_wrap .cate {padding:2.5rem 0; background:#fff; border:1px solid #e87011; border-radius:40px 5px; margin-bottom:20px;}
.what .cate_wrap .cate img{width:64px;float:left; padding-left:20px;}
.what .cate_wrap .cate .cate_tit{font-size:1.25rem; font-family :'FlightSans-Bold', sans-serif; color:#343434; text-align:left; padding-left:6.25rem;letter-spacing:-0.3px;}
.what .cate_wrap .cate .cate_txt{font-size:1rem; color:#343434; padding:.5rem 1rem 0 6.25rem;font-family :'FlightSans-Regular', sans-serif;text-align:left; word-break:keep-all;letter-spacing:-0.3px;}



.products{color:#1e1106; margin:7rem auto 0; width:90%; position:relative;}
.products h1 { font-size:2.5rem; font-weight:700; line-height:1.3; display:flex; align-items:flex-start;flex-direction:column; padding-bottom:30px;font-family: 'Montserrat', sans-serif; }
.products .txt {font-size:1rem; opacity:.7; line-height:1.5; display:inline-block; margin-top:2rem;font-family :'FlightSans-Regular', sans-serif;}
.products .btn{ float:right; display:inline-block; background:#2871fa; border:1px solid #2871fa;  border-radius:50px; padding:10px 25px; color:#fff; font-size:0.875rem; font-family: 'FlightSans-Bold', sans-serif; transition:all .5s;}
.products .btn i{padding-left:10px;}


.step_tit {margin:20px auto 0; padding:15px;}
.step_tit .tit_wrap {margin-bottom:30px; text-align:left;}
.step_tit .tit_wrap .main_tit {position:relative;}
.step_tit .tit_wrap .main_tit .tit {display:inline-block; font-size:1.75rem; font-family: 'FlightSans-Bold', sans-serif;}
.step_tit .tit_wrap .main_tit .txt {margin-top:1em; font-family :'FlightSans-Regular', sans-serif; font-size:1rem; opacity:.7; line-height:1.4; word-break:keep-all;}
.step_tit .re_wrap {display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:0.75rem;}
.step_tit .re_wrap a { padding:1rem 0 0 1.25rem; color:#fff; height:7.5rem; display:block; border-radius:10px; font-size:1.125rem; font-family: 'FlightSans-Regular', sans-serif; line-height:1.5; position:relative; border:1px solid #ddd; transition:all .3s;}
.step_tit .re_wrap a.call{background:#724bcd;}
.step_tit .re_wrap a.store{background:#2871fa;}
.step_tit .re_wrap a p {display:inline-block;}
.step_tit .re_wrap a p i{padding-left:5px;}
.step_tit .re_wrap a p font{font-family: 'FlightSans-Bold', sans-serif; }
.step_tit .re_wrap a img{width:28%; position:absolute; right:1.25rem; bottom:1rem;}
.step_tit .re_wrap a .call {font-size:1rem; line-hight:2;}
.step_tit .re_wrap a .goto {display:inline-block; padding-bottom:.5em; margin-top:5px;border-bottom:1px solid #1c1c1c; color:#1c1c1c; font-size:1rem; font-weight:600; line-height:1em; transition:border-color 0.25s, color 0.25s;}
.step_tit .re_wrap a:hover {background:#333; box-shadow:0 0 20px 0 rgba(0,0,0,0.12);}


.cust {position:relative;}
.cust .con {position:relative; }
.cust .con .con_inner {margin:0 auto; padding:15px; }
.cust .con .con_inner .num {color:#191919; font-family:"NanumMyeongjo", serif; font-size:1rem; font-style:normal; font-weight:700; line-height:normal; letter-spacing:0.5px; padding:20px 0 10px;}
.cust .con .con_inner .txt_wrap {}
.cust .con .con_inner .txt_wrap .sub01 {color:#355BF5; font-size:1.375rem; line-height:1.4; font-family: 'FlightSans-Bold', sans-serif;}
.cust .con .con_inner .txt_wrap .txt01 {margin:15px 0; color:#555; font-size:1rem; font-family :'FlightSans-Regular', sans-serif;line-height:1.5;word-break:keep-all;}
.cust .con .con_inner .txt_wrap .txt01 span {font-weight:600;}
.cust .con .con_inner .img_area {overflow:hidden;}
.cust .con .con_inner .img_area img {width:100%; object-fit:cover;}
.blue {color:rgb(0,66,255) !important; font-family: 'FlightSans-Regular', sans-serif !important; display:block; font-size:1.25rem; line-height:2.2;}





#main_slider { position:relative; padding:5rem 0 0; margin:4rem auto 0; background:#fff;width:95%; }
#main_slider ul.slick-dots { margin: 0 auto; text-align: right; position: absolute; top: 0; font-size: 0; -webkit-box-sizing: border-box; -khtml-box-sizing :border-box; -moz-box-sizing :border-box; -ms-box-sizing :border-box; -o-box-sizing :border-box; box-sizing :border-box;left: 0; right: 0; transition:opacity 1s 0.2s;} 
#main_slider .slick-list {padding:0 !important;}
#main_slider .slick-list .slick-track{margin-left:0px; overflow:hidden;}
#main_slider .slick-slide { position:relative; height:600px; background-position: top center !important;background-repeat: no-repeat !important; border-radius:1000px;background-size : contain !important; transition:border-radius 1s;}
#main_slider .slick-slide.slick-active {border-radius:0 !important;}
#main_slider .slick-slide:not(.slick-active){opacity: .3;}
#main_slider .slick-slide .txt_wrap{ position:absolute; right:0; top:50%; }
#main_slider .slick-slide .txt_wrap .name {font-size:1.5rem; font-family: 'FlightSans-Bold', sans-serif; line-height:1.3;word-break:keep-all;}
#main_slider .slick-slide .txt_wrap .subname {font-size:1.125rem; line-height:1.3; word-break:keep-all; margin-top:1rem; color:#454545; font-family :'FlightSans-Regular', sans-serif;}
#main_slider .slick-slide .txt_wrap .size {font-size:0.875rem; margin-top:1rem;  color:#999; line-height:1.5;font-weight:300; }
#main_slider .slick-slide .txt_wrap .view {display:inline-block; border:1px solid #DAF0F9; margin-top:2rem; padding:12px 30px; border-radius:50px; font-size:1rem; font-weight:300; transition:all .5s; background-color:#DAF0F9;}
#main_slider .slick-slide .txt_wrap .view:hover{ background-color:#fff; border-color:#787878;}
#main_slider .slick-slide .txt_wrap .view span {margin-left:10px; display:inline-block;}
#main_slider .slick-slide .slick-track img{width:100%;}
#main_slider ul.slick-dots li {display: inline-block;font-size: 1rem;width: 20%;background: #fff; text-align: center;vertical-align: top;position: relative; border-bottom: 1px solid #dfdfdf; padding-bottom:5px;}
#main_slider ul.slick-dots li button {background: #fff;color: #2e2e2e;font-size: 0.875rem;outline:0; border:none; word-break:keep-all;font-family :'FlightSans-Regular', sans-serif; line-height:1.3;} 
#main_slider ul.slick-dots li.slick-active button {color: #2871fa; font-family :'FlightSans-Bold', sans-serif;}
#main_slider ul.slick-dots li.slick-active {border-bottom: 3px solid #2871fa;}





.recom {width:90%; margin:4rem auto 3rem; text-align:center;}
.recom .re_wrap { margin:0 auto;}
.recom .re_wrap .ttls img{width:100px;}
.recom .re_wrap h3 {font-size:1.75rem; margin-top:20px; font-family: 'FlightSans-Bold', sans-serif;word-break:keep-all; line-height:1.4;}
.recom .re_wrap .lists {width:100%; margin:2.5rem auto 0;}
.recom .re_wrap .lists li{display:flex; background-color:rgba(255,255,255,1);align-items:center; margin-bottom:15px; border-radius:50px; border:2px solid #30a9fd; padding:6px 8px;}
.recom .re_wrap .lists li .num {display:flex; align-items:center; justify-content:center; width:40px; height:40px; background:#30a9fd; color:#fff; font-size:1.125rem; font-weight:500; flex-shrink: 0; border-radius:50%; font-family: 'Montserrat', sans-serif; }
.recom .re_wrap .lists li p {font-size:1rem; line-height:1.35; text-align:center; width:100%; box-sizing:border-box; padding:0 10px; color:#191919;font-family: 'FlightSans-Regular', sans-serif; word-break:keep-all;}
.recom .re_wrap .lists li p span{color:#30a9fd;}










.marquee-container {overflow: hidden; white-space: nowrap; width: 100%; position: absolute; top:-.5rem; display: flex; align-items: center; cursor: default;}
.marquee {display: flex;animation: scroll 80s linear infinite; font-size: 9.525rem; font-weight:700; font-family:"Cormorant Garamond", serif; color:rgba(234, 236, 236, 0.3); z-index:-1;}
.marquee span {padding: 0 30px;}
@keyframes scroll {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}



/* BASIC css end */

