@charset "utf-8";

.page_wrap .container {color:var(--blue)}

/*공용*/

.top_tit.center { text-align: center; }
.top_tit.white { color: #fff; }

.top_tit .desc { font-size: 2.2rem; font-weight: 700; }
.top_tit .tit { font-size: 5.6rem; font-weight: 700; font-family: var(--serif); line-height: 1.1 }
.top_tit .tit.Kr { font-size: 4.2rem; font-family: var(--NotoSerif); }
.top_tit .tit.sans { font-family: 'Pretendard', sans-serif; }
.top_tit .tit b { font-family: var(--NotoSerif); font-weight: 500; line-height: 1; }
.top_tit .desc + .tit {margin-top: 15px}
.top_tit .txt { margin-top: 1.5rem; font-size: 1.8rem; font-weight: 500; word-break: keep-all; }


.inp_wrap { display: flex; align-content: center; justify-content: space-between; }
.inp_wrap .inp_box + .inp_box { margin-left: 1rem; }
.inp_box { width: 100%; }
.inp_box input { width: 100%; height: 55px; line-height: 55px; padding: 0 20px; background-color: #fff; border: 1px solid #5a82a1; font-size: 1.8rem; font-weight: 500 }
.inp_box input::placeholder { color: var(--blue); font-weight: 400; }

/*공용*/


.container { padding-top: var(--header_Height); transition: padding-top 0.3s; }
.page_wrap.basic .container { padding-top: var(--header_Height)}
.page_wrap.basic .container.banner { padding-top: calc(var(--header_Height) + 10rem) ; }
.page_wrap.basic .container.banner.no_banner { padding-top: calc(var(--header_Height)) ; }



.visual_sect { position: relative; padding: 36% 8em 0; }
.visual_sect .visualSwiper { position: absolute; left: 50%; top: 0; width: 95%; height: 100%; transform: translateX(-50%); }
.visual_sect .visualSwiper .swiper-slide:before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0); z-index: 10; pointer-events: none; }
.visual_sect .visualSwiper .swiper-slide.bg:before {background-color: rgba(0,0,0,0.3); }
.visual_sect .visualSwiper .swiper-slide .img { width: 100%; height: 100%; }
.visual_sect .visualSwiper .swiper-slide .img iframe {position: absolute; width: 100%;height: 150%; left: 50%; top: 50%; transform: translate(-50%,-50%); object-fit: cover; object-position: center; pointer-events: none}
.visual_sect .visualSwiper .swiper-slide .img video {width: 100%;height: 100%; object-fit: cover; object-position: center;}
.visual_sect .visualSwiper .swiper-slide .img img { width: 100%; height: 100%; object-fit: cover;
    image-rendering: -moz-crisp-edges; /* firefox */
    image-rendering: -o-crisp-edges; /* opera */
    image-rendering: -webkit-optimize-contrast; /* chrome */
    image-rendering: crisp-edges;
    transform: translateZ(0);
    backface-visibility: hidden;

}


.visual_sect .txt_box  p {overflow: hidden}
.visual_sect .txt_box  p span {display: block; transform: translateY(100%); }

.visual_sect .txt_box .btn1 { margin-top: 7rem; border-color: #fff; background-color: transparent;}
.visual_sect .txt_box .btn1:before {background-color: #fff}
.visual_sect .txt_box .btn1 span {color: #fff}

/*.visual_sect .txt_box .btn:hover  {background-color: var(--blue); border-color: var(--blue)}*/



.visual_sect .swiper-slide .txt_box span,
.visual_sect .swiper-slide .txt_box span {display: block; word-break: keep-all}

.visual_sect .txt_wrap.delay .view_btn,
.visual_sect .txt_wrap.delay span {transform: translateY(100%) !important; opacity: 0 !important}

.visual_sect .swiper-slide-active .txt_box .txt span,
.visual_sect .swiper-slide-active .txt_box .tit p span { transform: translateY(0%); transition: transform 0.75s; transition-delay: 0s}
.visual_sect .swiper-slide-active .txt_box .tit p span{ transition: transform 1s;}
.visual_sect .swiper-slide-active .txt_box .tit p:nth-child(1) span{transition-delay: 0.3s}
.visual_sect .swiper-slide-active .txt_box .tit p:nth-child(2) span{transition-delay: 0.5s}
.visual_sect .swiper-slide-active .txt_box .tit p:nth-child(3) span{transition-delay: 0.7s}
.visual_sect .swiper-slide-active .btn{opacity: 1; transform: translateY(00px)}


/*.visual_sect .swiper-slide-active .txt_box .tit span {transition-delay: 0.3s}*/



/*.page_wrap + div {display: none !important}*/

.main .visual_sect .slide_move { position: absolute; left: 14.5%; bottom: 10%; z-index: 10; display: flex; align-items: center }
.main .visual_sect .slide_move .swiper-pagination {position: static}
.main .visual_sect .slide_move .swiper-pagination-bullet {width: 0.8rem; height: 0.8rem ;background-color: #fff; position: relative; opacity: 1}
.main .visual_sect .slide_move .swiper-pagination-bullet:before {content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 38px; height: 38px; border-radius: 50%; /*border: 2px solid rgba(255,255,255,0.3)*/}
.main .visual_sect .slide_move .swiper-pagination-bullet + .swiper-pagination-bullet {margin-left: 7rem;}
.main .visual_sect .slide_move .swiper-pagination-bullet > svg {position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-90deg); stroke-dasharray: 125;stroke-dashoffset: 125; }
.main .visual_sect .slide_move .swiper-pagination-bullet .circle {opacity: 0}
.main .visual_sect .slide_move .swiper-pagination-bullet-active .circle {animation: draw 11.8s linear forwards;}
.main .visual_sect .slide_move .swiper-pagination-bullet.no_delay .circle{animation: draw 11s linear forwards; opacity: 1}
.main .visual_sect .slide_move .swiper-pagination-bullet-active .circle.off {animation: none; opacity: 0}
.main .visual_sect .slide_move .swiper-pagination-bullet + .swiper-pagination-bullet-active .circle{}

.main .visual_sect .slide_move .swiper-pagination-bullet-active {background-color: transparent}
.main .visual_sect .slide_move .swiper-pagination-bullet-active .circle {opacity: 1}

.main .visual_sect .slide_move .swiper-pagination-bullet .btn.off{display: none}
.main .visual_sect .slide_move .swiper-pagination-bullet .btn {display: flex;position: absolute;left: 50%; top: 50%; transform: translate(-50%,-50%); opacity: 0; z-index: 3}
.main .visual_sect .slide_move .swiper-pagination-bullet .btn span {display: block; width: 3px; height: 13px; border-radius: 50px; background-color: #fff}
.main .visual_sect .slide_move .swiper-pagination-bullet .btn span + span {margin-left: 5px}
.main .visual_sect .slide_move .swiper-pagination-bullet .btn svg {fill: #fff; height: 12px;}

.main .visual_sect .slide_move .swiper-pagination-bullet-active .btn {opacity: 1}



@keyframes draw {
    to {stroke-dashoffset: 0;}
}

/*.main .visual_sect .slide_move .btn { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); }
.main .visual_sect .slide_move .btn .pause { display: flex;justify-content: space-between;width: 10px;height: 12px; }
.main .visual_sect .slide_move .btn .pause span { width: 3px; height: 100%; background-color: #fff; display: block; border-radius: 5px; }
.main .visual_sect .slide_move .btn .off { display: none; }
.main .visual_sect .slide_move .btn .play { color: #fff; }
.main .visual_sect .slide_move .btn .play i { color:#fff; */}
.main .visual_sect .slide_move .paging_btn { display: flex;align-items: center; margin-left: 50px }
.main .visual_sect .slide_move .swiper-button-next,
.main .visual_sect .slide_move .swiper-button-prev { position: static; margin: 0; width: auto; height: auto; color: #fff; font-size: 18px; opacity: 0.5 ;transition: all .3s }
.main .visual_sect .slide_move .pagination { position: static;  margin-left: 50px ; color: #ffffff; font-size: 1.6rem; font-weight: 500; font-family: var(--NotoSerif); }
.main .visual_sect .slide_move .pagination .bar { margin: 0 0.5rem 0 1rem;  }
.main .visual_sect .slide_move .pagination .active { position: relative; top: -3px; opacity: 1; font-size: 2.3rem; }

.main .visual_sect .scroll-down { position: absolute; left: 50%; bottom: 30px; transform: translate(-50%,0%); text-align:center; z-index: 15; color: #fff; }
.scroll_down span { display:block; position:relative; width: 23px; height: 30px; border: 1px solid #fff; border-radius: 10px; box-sizing: border-box; margin: 0 auto; }
.scroll_down span:before { content:''; display: block; position: absolute; top: 2px; left: 50%; width: 4px; height: 6px; border: 1px solid #fff; border-radius: 2rem; transform: translateX(-50%); box-sizing:border-box; -webkit-animation:scroll 2s infinite; animation:scroll 2s infinite; }

@-webkit-keyframes scroll {
    0% { -webkit-transform:translate(-50%, 0); opacity:0; }
    40% { opacity:1; }
    80% { -webkit-transform:translate(-50%, 20px); opacity:0; }
    100% { opacity:0; }
}

@keyframes scroll {
    0% { transform:translate(-50%, 0); opacity:0; }
    40% { opacity:1; }
    80% { transform:translate(-50%, 20px); opacity:0; }
    100% { opacity:0; }
}

#timer { margin: 0; width: 40px; height: 40px; position: relative;}

.main .visual_sect .txt_box { position: absolute; left: 12%; top: 50%; transform: translateY(-50%); color: #fff; z-index: 20; }
.main .visual_sect .txt_box .txt { margin-bottom: 0.6rem; font-size: 2.6rem; font-weight: 400; }
.main .visual_sect .txt_box .tit { font-size: 6.9rem; font-weight: 600; line-height: 1.3; margin-top: 15px}


.since_sect { padding: 30rem 0 20rem; overflow: hidden; }

.since_sect .num_cont { position: relative; display: flex; align-items: center; justify-content: center; width: 90%; margin: 0 auto 3rem; height: 30rem; color: var(--blue); }
.since_sect .num_cont .num_wrap { position: absolute; }
.since_sect .num_cont .num_wrap1 { left: 34%; top: 50%; transform: translateY(-50%) scale(1); opacity: 0.2; }
.since_sect .num_cont .num_wrap2 { right: 0; top: 50%; transform: translateY(-50%); opacity: 0; }

.since_sect .num_cont .num_wrap2 .odometer-formatting-mark { display: none; }

.since_sect .num_cont .num_wrap .desc { position: absolute; left: 10%; top: -3%; font-size: 4.8rem; font-weight: 700; font-family: var(--serif); }
.since_sect .num_cont .num_wrap .num { font-size: 24rem; font-weight: 600; font-family: 'Nanum Myeongjo', serif; }

.since_sect .num_cont .cont { position: absolute; left: 50%; top: 40%; padding: 0 1rem; transform: translate(-50%, -50%); font-size: 3rem; font-weight: 500; font-family: var(--NotoSerif); }
.since_sect .num_cont .cont span { opacity: 0; }
.since_sect .num_cont .cont .top { position: absolute; left: 50%; top: 0; font-size: 2em; transform: translate(-50%, -55%); }
.since_sect .num_cont .cont .line { position: absolute; left: 0; bottom: -20px; width: 0; height: 1px; background-color: var(--blue); }

.since_sect .txt_wrap { position: relative; top: 50px; text-align: center; font-size: 2.4rem; line-height: 1.8; color: var(--blue); font-weight: 500; opacity: 0; }

.since_sect .line_wrap { position: relative; display: flex; align-items: center; justify-content: space-between; width: 100%; margin: 13rem auto 6rem; }
/*.since_sect .line_wrap .bg { position: absolute; right: -50%; top: 50%; width: 300%; height: 180%; background-color: rgba(255,255,255,0.9); transform: translate(0,-50%); z-index: 10; }*/
.since_sect .line_wrap .line { position: absolute; left: -50%; top: 50%; width: 0; height: 1px; background-color: var(--blue); transform: translate(0, -50%); z-index: -2; transform-origin: left; }
.since_sect .line_wrap:before { content: ''; position: absolute; left: 0; top: 50%; width: 300%; height: 1px; background-color: var(--blue); transform: translate(-50%, -50%); z-index: -2; opacity: 0.2; }
.since_sect .line_wrap .txt_box { position: relative; width: calc(100%/3); }
.since_sect .line_wrap .txt_box + .txt_box { margin-left: 7em }
.since_sect .line_wrap .txt_box .tit { position: relative; display: inline-block; font-size: 5.6rem; color: var(--blue); font-weight: 700; font-family: var(--serif); }
.since_sect .line_wrap .txt_box .tit:before { content: ''; position: absolute; left: 50%; top: 50%; min-width: 200px; height: 100%; transform: translate(-50%, -50%); background-color: #fff; z-index: -1; }
.since_sect .line_wrap .txt_box .tit .back { position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; background-color: rgba(255,255,255,0.9); z-index: 10; }
.since_sect .line_wrap .txt_box .txt { position: absolute; left: 0; bottom: -5px; transform: translateY(100%); font-size: 1.9rem; color: var(--blue); font-weight: 600; word-break: normal}
.since_sect .line_wrap .txt_box .txt .back { position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; background-color: rgba(255,255,255,0.9); z-index: 10; }

.since_sect .btn_wrap { margin-top: 14rem; }


.special_sect { padding: var(--mainPd); overflow: hidden}

.special_sect .top { position: relative; }
.special_sect .top .paging { position: absolute; right: 30%; bottom: 0; }
.special_sect .top .paging .swiper-pagination-bullet { width: 2px; height: 2rem; background: var(--blue); border-radius: 0; opacity: 1; transform-origin: center; transition: transform 0.3s; }
.special_sect .top .paging .swiper-pagination-bullet + .swiper-pagination-bullet { margin-left: 3rem; }
.special_sect .top .paging .swiper-pagination-bullet-active { transform: rotate(90deg); }

.special_sect .cont { position: relative; margin-top: 6rem; transform: translateY(200px); opacity: 0; transition: transform 0.5s, opacity 0.5s; }
.special_sect .cont.active { transform: unset; opacity: 1; }
.special_sect .cont:before { content: ''; position: absolute; left: 0; top: 0; width: 30%; height: 100%; background-color: #fff; z-index: 10; transition: width 0.7s ease-in; transition-delay: 0.1s; }
.special_sect .cont:after { content: ''; position: absolute; right: 0; top: 0; width: 30%; height: 100%; background-color: #fff; z-index: 10; transition: width 0.7s ease-in; transition-delay: 0.1s; }
.special_sect .cont.active:before { width: 0; }
.special_sect .cont.active:after { width: 0; }



.special_sect .cont .specialSwiper { padding-bottom: 30rem; overflow: visible}
.special_sect .cont .slide_move {position: absolute;left: 50%;top: calc(50% - 15rem);width: 73vw;height: 30px;transform: translate(-50%,-50%); z-index: 2;}
.special_sect .cont .slide_move svg {fill: #fff; height: 4.6rem}

.special_sect .cont .special_box .img img{ filter: grayscale(1); opacity: 0.4; transition: opacity 0.5s, filter 0.5s; }
.special_sect .cont .special_box[class$='-active'] .img img{ filter: none; opacity: 1; }

.special_sect .cont .special_box .wrap { position: relative; padding-top: 55%; }
.special_sect .cont .special_box .wrap .img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.4)}
.special_sect .cont .special_box .wrap .img img { width: 100%; height: 100%; object-fit: cover; }

.special_sect .cont .special_box .wrap .box_tit { position: absolute; left: 0; bottom: -20px; font-size: 1.6rem; font-weight: 700; transform: translateY(100%); opacity: 1; transition: opacity 0.5s; }
.special_sect .cont .special_box[class$='-active'] .wrap .box_tit { opacity: 0; }

.special_sect .cont .special_box .wrap .txt_wrap { position: absolute; left: 50%; bottom: 9rem; width: 85%; padding: 4rem 9rem 4rem 5rem; background-color: #fff; transform: translate(-50%, 100%); opacity: 0; transition: opacity 0.5s; transition-delay: -0.1s; pointer-events: none; }
.special_sect .cont .special_box[class$='-active'] .wrap .txt_wrap { opacity: 1; pointer-events: auto; transition-delay: 0.1s; }
.special_sect .cont .special_box .wrap .txt_wrap .desc { font-size: 1.9rem; font-weight: 600; }
.special_sect .cont .special_box .wrap .txt_wrap .tit { font-size: 5rem; font-weight: 800; font-family: var(--serif) }
.special_sect .cont .special_box .wrap .txt_wrap .b_txt { margin-top: 1em; font-size: 3rem; }
.special_sect .cont .special_box .wrap .txt_wrap .txt { margin-top: 1.5rem; font-size: 2.2rem; line-height: 1.8; font-weight: 500; word-break: keep-all; }

.special_sect .cont .special_box .wrap .more_btn { position: absolute; right: 0; top: 0; }
.special_sect .cont .special_box .wrap .more_btn svg { width: 40%; height: 40%; margin: auto; }


.staff_sect { position: relative; padding: 18rem 0 13rem; overflow: hidden}
.staff_sect:before { content: ''; position: absolute; left: 0; top: 0; width: 100%; padding-top: clamp(123rem,49%,123rem); background: url('/img_up/shop_pds/sample06/build/option/staff_bg.jpg')center/cover no-repeat;  }

.staff_sect .cont { margin-top: 13rem; color: #fff; }
.staff_sect .cont .tit { font-size: 7.5rem; font-weight: 200;}
.staff_sect .cont .tit span { font-family: var(--serif); font-weight: 700; letter-spacing: 0.5px; }
.staff_sect .cont .txt { font-size: 2.2rem; font-weight: 200; word-break: keep-all; }


.staff_sect .img_wrap { position: relative; width: 100%; margin: 5rem auto 0; padding-top: 55%; }
.staff_sect .img { position: absolute; left: 50%; top: 0; width: 50%; height: 100%; overflow: hidden; transform: translateX(-50%); }
.staff_sect .img > video { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; outline: none; border: none; box-shadow: none; -webkit-mask-image: -webkit-radial-gradient(white, black); -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; }
.staff_sect .img_wrap .cir_txt { position: absolute; right: 0; top: 0; width: 22rem; height: 22rem; transform: translate(50%, -50%); }
.staff_sect .img_wrap .cir_txt img { animation: spin 12s infinite; animation-timing-function: linear; transform-origin: center; }

@keyframes spin {
    0% { transform: rotate(0); }
    100% { transform: rotate(-360deg); }
}


.philo_sect { padding: var(--mainPd); overflow: hidden}

.philo_sect .in { display: flex; align-items: center; justify-content: center; }

.philo_sect .left { width: 45%; }
.philo_sect .left .txt { position: relative; margin-top: 30%; font-size: 1.7rem; font-weight: 500; word-break: keep-all; }
.philo_sect .left .txt .bg_tit { position: absolute; left: 0; top: 0; display: flex; align-items: center; justify-content: flex-start; font-size: 20rem; color: #f2f2f2; font-family: var(--serif); font-weight: 700; transform: translate(-25%, -100%); line-height: 1; }
.philo_sect .left .txt .bg_tit span { opacity: 0; transition: opacity 0.4s; }
.philo_sect .left .txt .bg_tit span:nth-of-type(1) { transition-delay: 0.4s }
.philo_sect .left .txt .bg_tit span:nth-of-type(2) { transition-delay: 0.55s }
.philo_sect .left .txt .bg_tit span:nth-of-type(3) { transition-delay: 0.7s }
.philo_sect .left .txt .bg_tit span:nth-of-type(4) { transition-delay: 0.85s }
.philo_sect .left .txt .bg_tit span:nth-of-type(5) { transition-delay: 1s }
.philo_sect .left .txt .bg_tit span:nth-of-type(6) { transition-delay: 1.15s }
.philo_sect .left .txt .bg_tit span:nth-of-type(7) { transition-delay: 1.3s }
.philo_sect .left .txt .bg_tit span:nth-of-type(8) { transition-delay: 1.45s }
.philo_sect .left .txt .bg_tit span:nth-of-type(9) { transition-delay: 1.6s }
.philo_sect .left .txt .bg_tit span:nth-of-type(10) { transition-delay: 1.75s }
.philo_sect.active .left .txt .bg_tit span { opacity: 1; }
.philo_sect .btn_wrap { margin-top: 5rem; }

.philo_sect .right { width: 55%; margin-left: 4rem}
.philo_sect .cont .box { display: flex; align-items: center; justify-content: flex-start; padding: 6rem 0; border-top: 1px solid var(--blue); opacity: 0; transition: opacity 0.8s; transition-delay: 0.4s;}
.philo_sect.active .cont .box { opacity: 1}
.philo_sect .cont .box:last-of-type { border-bottom: 1px solid var(--blue); }
.philo_sect .cont .box .tit { width: 22rem; flex-shrink: 0; font-size: 3rem; font-weight: 600; font-family: var(--NotoSerif); opacity: 0; transform: translateX(50px); transition: transform 0.8s, opacity 0.8s; transition-delay: 0.5s}
.philo_sect .cont .box .txt { margin-left: 9rem; font-size: 1.9rem; color: #8899a6;  opacity: 0; transform: translateX(50px); transition: transform 0.8s, opacity 0.8s;  transition-delay: 0.7s; word-break: keep-all; }
.philo_sect.active .cont .box .tit {transform: unset; opacity: 1}
.philo_sect.active .cont .box .txt {transform: unset; opacity: 1}


.guarantee_sect { padding: var(--mainPd); }
.guarantee_sect .cont { display: flex; align-items: center; justify-content: center; padding: 6rem 15rem; background-color: #f4f6fa; transform: scaleX(0.3); transform-origin: left; opacity: 0; transition: 0.6s ease-in-out, opacity 0.3s; transition-delay: 0.3s; }
.guarantee_sect.active .cont { transform: scale(1); opacity: 1; }

.guarantee_sect .img { width: 35%; flex-shrink: 0; opacity: 0; transition: opacity 1.2s; transition-delay: 1s; }
.guarantee_sect.active .img { opacity: 1; }
.guarantee_sect.active .img.empty_news { background-color: #A9A9A9; }
.guarantee_sect.active .img.empty_news img { position: absolute; left: 50%; top: 50%; width: 50%; opacity: 0.6; }

.guarantee_sect .txt_wrap { width: 65%; margin-left: 15%; opacity: 0; transition: opacity 0.8s; transition-delay: 1.2s; }
.guarantee_sect.active .txt_wrap { opacity: 1; }
.guarantee_sect .txt_wrap .top_tit .tit span { position: relative; display: inline-block; margin-top: 0.2rem; }
.guarantee_sect .txt_wrap .top_tit .badge { position: absolute; right: -5%; bottom: 0; width: 30%; transform: translateX(100%); }
.guarantee_sect .txt_wrap .txt { margin-top: 2.5rem; font-size: 1.9rem; font-weight: 500; line-height: 1.8; word-break: keep-all; }

.youtube_sect { position: relative; padding: var(--mainPd); }
.youtube_sect .top { display: flex; align-items: flex-end; justify-content: space-between; }

.youtube_sect .cont { position: relative; }

.youtube_sect .paging { position: absolute; left: 50%; top: 30%; display: flex; align-items: center; justify-content: space-between; width: 108%; transform: translate(-50%, 0%); }
.youtube_sect .paging .navi {  cursor: pointer; }
.youtube_sect .paging svg { fill: var(--blue); height: 4.6rem}

.youtube_sect .slide_box {position: relative; margin: 8rem auto 0; }
.youtube_sect .youtubeSwiper { width: 100%;}

.youtube_sect .swiper-slide .img { position: relative; padding-top: 68%; }
.youtube_sect .swiper-slide .img:before { content: ''; position: absolute; left: 50%; top: 50%; width: calc(100% - 2px); height: 100%; background-color: #000; transform: translate(-50%, -50%); }
.youtube_sect .swiper-slide .img img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.95; }
.youtube_sect .swiper-slide .img .hover_box { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(23, 51, 72, 0.8); opacity: 0; transition: opacity 0.5s; }
.youtube_sect .swiper-slide .img .hover_box svg { position: absolute; left: 50%; top: 50%; width: 5rem; height: 5rem; transform: translate(-50%, -50%); fill: #fff; transition: transform 0.4s; transition-delay: 0.1s; }

.youtube_sect .swiper-slide .txt_box { width: 100%; margin: 1.8rem auto 0; }
.youtube_sect .swiper-slide .txt_box .tit { font-size: 2.7rem; font-weight: 600; }
.youtube_sect .swiper-slide .txt_box .txt { font-size: 1.8rem; font-weight: 500; display: -webkit-box; word-wrap: break-word; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; }



.review_sect { padding: var(--mainPd); }

.review_sect .top { display: flex; align-items: flex-end; justify-content: space-between; }
.review_sect .paging { position: relative; min-width: 190px; }
.review_sect .paging .navi { position: absolute; cursor: pointer; }
.review_sect .paging .navi.navi_prev { left: 0; top: 50%; transform: translate(0, -50%); }
.review_sect .paging .navi.navi_next { right: 0; top: 50%; transform: translate(0, -50%); }
.review_sect .paging .navi svg { display: flex; align-items: center; justify-content: center; width: 20px; height: 15px; }
.review_sect .paging .num_wrap { width: 100%; font-size: 1.8rem; font-family: var(--NotoSerif); text-align: center; }
.review_sect .paging .num_wrap .barSpace { margin: 0 5px; }
.review_sect .paging .num_wrap .swiper-pagination-current { color: #177fbb; }

.review_sect .paging .bar_wrap { position: absolute; left: 50%; bottom: -15px; width: 130%; height: 1px; transform: translateX(-50%); }
.review_sect .paging .bar_wrap.swiper-pagination-progressbar { background: #d9d9d9; }
.review_sect .paging .bar_wrap.swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: #000; }

.review_sect .cont { position: relative; margin-top: 8rem; padding-left: max(20px,calc((100% - 164rem)/2 + 2rem)); opacity: 0; transition: opacity 2.5s; }
.review_sect.active .cont { opacity: 1; }
.review_sect .reviewSwiper { position: relative }
.review_sect .reviewSwiper .swiper-wrapper { align-items: flex-end; }
.review_sect .reviewSwiper .swiper-slide { display: flex; align-items: center; justify-content: flex-start; width: 50%; text-align: center; color: #343434; font-weight: 600; filter: grayscale(1); opacity: 0.4; transform: scale(0.8) translateX(-78%); transform-origin: bottom; transition: 0.7s; transition-delay: 0.1s; }
.review_sect .reviewSwiper .swiper-slide .img { position: relative; width: 45%; padding-top: 60%; }
.review_sect .reviewSwiper .swiper-slide .img.empty {background-color: #F4F6FA}
.review_sect .reviewSwiper .swiper-slide .img.empty:before {content: "";position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);width: 40%;height: 40%;background: url("/inc/img/common/logo_gray.svg") no-repeat center / contain;}
.review_sect .reviewSwiper .swiper-slide .img img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; }
.review_sect .reviewSwiper .swiper-slide .txt_box { width: 47%; margin-left: 5rem; opacity: 0; transform: translateX(-10%); transition-delay: 1s; transition: opacity 0.7s, transform 0.7s; word-break: keep-all }
.review_sect .reviewSwiper .swiper-slide .txt_box .tit { font-size: 2rem; font-family: var(--NotoSerif); }
.review_sect .reviewSwiper .swiper-slide .txt_box .tit b { display: block; line-height: 1; font-size: 1em; }
.review_sect .reviewSwiper .swiper-slide .txt_box .tit b:last-of-type { margin-top: 12px; }

.review_sect .reviewSwiper .swiper-slide .txt_box .label { display: inline-block; width: auto; height: 30px; margin-top: 2.5rem; line-height: 30px; padding: 0 10px; border: 1px solid var(--blue); border-radius: 2rem; font-size: 1.6rem; color: var(--blue); font-weight: 400; }
.review_sect .reviewSwiper .swiper-slide .txt_box .name { margin-top: 1rem; font-size: 1.8rem; font-weight: 700; }
.review_sect .reviewSwiper .swiper-slide .txt_box .txt { margin-top: 2rem; padding: 5rem 1.5rem; background-color: #f5f6f8; font-size: 1.6rem; color: #6f6f6f; }

.review_sect .reviewSwiper .swiper-slide .txt_box .btn_wrap { margin-top: 5rem; }

.review_sect .reviewSwiper .swiper-slide[class$=-active] { filter: none; opacity: 1; transform: scale(1); transition: all 0.7s; transition-delay: 0s; }
.review_sect .reviewSwiper .swiper-slide[class$=-active] .txt_box { opacity: 1; transform: translateX(0); transition-delay: 0.3s; }

.review_sect .reviewSwiper .swiper-slide[class$=-next] { transform: scale(0.8) translateX(0); }

.review_sect .reviewSwiper .swiper-slide[class$=-next] + .swiper-slide + .swiper-slide { transform: scale(0.8) translateX(-156%); }

.review_sect .paging_bar.swiper-pagination-progressbar { position: absolute; left: 0; bottom: -12%; width: 100%; height: 4px; margin-left: calc((100% - 1640px)/2 + 20px); background-color: #e6e6e6; }
.review_sect .paging_bar.swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: #000; }


.notice_sect { margin: 8rem 0 0; padding: 8rem 0; background-color: #f4f6fa; }
.notice_sect .in { display: flex; align-items: flex-start; justify-content: space-between; }

.notice_sect .left { width: 48%; margin-top: 5.4rem}
.notice_sect .left .btn3 svg {width: 4rem; height: 4rem}
.notice_sect .left .top { display: flex; align-items: flex-end; justify-content: space-between; }

.notice_sect .left .notice { margin-top: 3rem; border-top: 1px solid var(--blue); }
.notice_sect .left .notice li a { display: flex; align-items: center; justify-content: flex-start; padding: 2.75rem 1rem 2.75rem 3rem; border-bottom: 1px solid #d3d8e1; }
.notice_sect .left .notice li .date_wrap { flex-shrink: 0; text-align: center; }
.notice_sect .left .notice li .date_wrap .date { font-size: 3rem; line-height: 1; font-weight: 500}
.notice_sect .left .notice li .date_wrap .month { margin-top: 0.2rem; font-size: 1.4rem; color: #8899a6; font-weight: 700; }
.notice_sect .left .notice li .tit { width: 100%; margin-left: 4rem; margin-right: 2rem; font-size: 2rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.notice_sect .left .notice li .tit span { position: relative; }
.notice_sect .left .notice li .tit span:before { content: ''; position: absolute; left: 0; bottom: -1px; width: 0; height: 1px; background-color: var(--blue); transition: width 0.5s; }
.notice_sect .left .notice li .arr {  height: 3rem; flex-shrink: 0; transform: translateX(-10px); opacity: 0; transition: transform 0.4s, opacity 0.4s; }
.notice_sect .left .notice li .arr svg {height: 100%}

.notice_sect .right { width: 48%; margin-left: 8rem;}

.notice_sect .right .cont { padding: 7.5rem 9rem; background-color: #d3dfee; }
.notice_sect .right .cont .form_wrap { margin-top: 3rem; }
.notice_sect .right .cont .form_wrap > * + * { margin-top: 1.5rem; }
.notice_sect .right .cont .form_wrap .nice-select { height: 55px; line-height: 55px; padding: 0 20px; font-size: 1.8rem; border-radius: 0; border: 1px solid #5a82a1; font-weight: 600; display: none}
.notice_sect .right .cont .form_wrap .nice-select .list { width: calc(100% + 2px); left: -1px; margin-top: 0; border-radius: 0; border: 1px solid var(--blue); }
.notice_sect .right .cont .form_wrap .nice-select:after { right: 22px; border-bottom: 2px solid #000; border-right: 2px solid #000; }

.notice_sect .right .cont .priv_chk_box {position: relative}
.notice_sect .right .cont .priv_chk { display: flex; align-items: center; justify-content: flex-start; margin-top: 3rem; margin-bottom: 2rem; line-height: 1}
.notice_sect .right .cont .priv_chk p { font-size: 1.6rem; font-weight: 600; }
.notice_sect .right .cont .priv_chk .all { margin-left: 1.7rem; padding-bottom: 1px; font-size: 1.2rem; color: #6d87a8; font-weight: 600; border-bottom: 1px solid #6d87a8; }
.notice_sect .right .cont .priv_chk_box .g-recaptcha {position: absolute; right: 0px; top: 50%; transform: scale(0.7) translate(0%,-50%) ;transform-origin: top right;}

.notice_sect .right .cont .priv_chk .chk_box { margin-left: 2rem; }
.notice_sect .right .cont .btn_wrap { margin-top: 8rem; }


.banner_sect { position: relative; }

.banner_sect .in {padding-top: 3rem}
.banner_sect .top_tit {}
.banner_sect .top_tit .tit { line-height: 1.3; }

.banner_sect .top { display: flex; align-items: flex-end; justify-content: space-between; }
.banner_sect .paging { position: absolute; left: 50%; bottom: 20%; width: 120rem; margin: 0 auto; z-index: 100; transform: translateX(-50%); }
.banner_sect .paging_in { position: relative; width: 150px; }
.banner_sect .paging .navi { position: absolute; cursor: pointer; }
.banner_sect .paging .navi.navi_prev { left: 0; top: 50%; transform: translate(0, -50%); }
.banner_sect .paging .navi.navi_next { right: 0; top: 50%; transform: translate(0, -50%); }
.banner_sect .paging .navi svg { display: flex; align-items: center; justify-content: center; width: 24px; height: 17px; fill: #757575; transition: all .3s}

.banner_sect .paging .num_wrap { width: 100%; font-size: 1.8rem; font-family: var(--NotoSerif); text-align: center; }
.banner_sect .paging .num_wrap .barSpace { margin: 0 5px; }
.banner_sect .paging .num_wrap .swiper-pagination-current { color: #177fbb; }

.banner_sect .swiper-wrapper { position: relative;}
.banner_sect .swiper-slide { flex-grow: 1;  height: auto}
.banner_sect .swiper-slide > .in { width: 124rem; height: 100%}
.banner_sect .swiper-slide[class$=-active] { }
.banner_sect .swiper-slide.banner1 { background-color: #eef0f4; }
.banner_sect .swiper-slide.banner2 { background-color: #eef4f1; }
.banner_sect .banner2 .img { width: 34%; margin-right: 0px}
.banner_sect .in { display: flex; align-items: flex-end; justify-content: space-between; }

.banner_sect .top_tit { flex: 1; align-self: flex-start; padding-top: 4rem; display: block}
.banner_sect .img { width: 38%; display: block}


.promo_sect { padding: var(--mainPd); overflow: hidden}
.promo_sect .top { display: flex; align-items: flex-end; justify-content: space-between; }

.promo_sect .cont { position: relative; display: flex; align-items: center; justify-content: center; margin-top: 5rem; }
.promo_sect .cont .box { position: relative; display: block; overflow: hidden; padding-top: 105% ;border: 1px solid transparent; opacity: 0; transition: opacity 0.5s; filter: brightness(0.98)}
.promo_sect .cont .box:after {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.promo_sect .cont .box img {position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; object-position: center}
.promo_sect .cont.active .box { opacity: 1; }
.promo_sect .cont .box + .box { margin-left: 6rem; }
.promo_sect .cont .box img { transform: scale(1.05); transition: transform 0.5s; }
.promo_sect .cont.active .box img { transform: unset; }
.promo_sect .paging { position: absolute; left: 50%; top: 42%; display: flex; align-items: center; justify-content: space-between; width: 108%; transform: translate(-50%, 0%); }
.promo_sect .paging .navi {  cursor: pointer; }
.promo_sect .paging svg { fill: var(--blue); height: 4.6rem}


.partner_sect { padding: var(--mainPd); }
.partner_sect .in { display: flex; align-items: flex-start; justify-content: space-between; }

.partner_sect .top_tit { width: 25%; }

.partner_sect .cont { display: flex; align-items: center; justify-content: flex-start; width: 80%; flex-wrap: wrap; }
.partner_sect .cont .box { position: relative; display: block; width: calc(100%/4); padding-top: 10%; overflow: hidden; transform: translateY(50%);opacity: 0; transition: transform 0.7s, opacity 1s; }
.partner_sect .cont .box img {position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%) ;width: 90% ;object-position: center}
.partner_sect .cont .box:nth-of-type(1){ transition-delay: 0.2s ;}
.partner_sect .cont .box:nth-of-type(2){ transition-delay: 0.3s }
.partner_sect .cont .box:nth-of-type(3){ transition-delay: 0.4s }
.partner_sect .cont .box:nth-of-type(4){ transition-delay: 0.5s }
.partner_sect .cont .box:nth-of-type(5){ transition-delay: 0.6s }
.partner_sect .cont .box:nth-of-type(6){ transition-delay: 0.7s }
.partner_sect .cont .box:nth-of-type(7){ transition-delay: 0.8s }
.partner_sect .cont .box:nth-of-type(8){ transition-delay: 0.9s }
.partner_sect.active .cont .box { transform: unset; opacity: 1; }



.info_sect { position: relative; padding: 6em 0; background-color: #f5f6f8; }
.info_sect .in { display: flex; align-items: center; justify-content: flex-start; }

.info_sect .info { width: 40%; overflow: hidden; }
.info_sect .info .logo { width: 180px; }
.info_sect .info .tit { font-size: 3.8rem; font-weight: 700; line-height: 1.3; }
.info_sect .info .desc { margin-top: 0.8rem; font-size: 1.7rem; font-weight: 500; word-break: keep-all; }

.info_sect .info .info_btn { display: flex; align-items: center; justify-content: center; width: 60%; margin-top: 5.5rem; flex-wrap: wrap; }
.info_sect .info .info_btn .btn5 { width: calc(100%/2 - 0.25rem ); }
.info_sect .info .info_btn .btn5:nth-of-type(2n) { margin-left: 0.5rem; }
.info_sect .info .info_btn .btn5:nth-of-type(n+3) { margin-top: 0.75rem; }

.info_sect .info .video_wrap { position: relative; width: 75%; padding-top: 42.25%; margin-top: 5rem; }
.info_sect .info .video_wrap video { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: none; outline: unset; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; filter:contrast(101%); -webkit-filter:contrast(101%); background-color:transparent;}

.info_sect .map { position: absolute; right: 0; top: 0; width: 50%; height: 100%; overflow: hidden}
.info_sect .map .cont {position: absolute; width: 100%; height: 100%; left: 0; top: 0; object-position: center; object-fit: cover}


/*호버스타일*/
@media screen and (min-width: 1200px){
    .youtube_sect .swiper-slide:hover .img .hover_box { opacity: 1; }
    .youtube_sect .swiper-slide:hover .img .hover_box svg { transform: translate(-50%, -50%) rotate(180deg); }

    .notice_sect .left .notice li a:hover .tit span:before { width: 100%; }

    .notice_sect .left .notice li a:hover .arr { transform: unset; opacity: 1; }

    .promo_sect .cont .box:hover img { transform: scale(1.05); }
    .banner_sect .paging .navi:hover svg {fill: var(--blue)}
}


/*반응형*/
@media screen and (max-width: 2000px){

    .notice_sect .right .cont .priv_chk_box .g-recaptcha {transform: scale(0.65) translate(0%,-50%)}

    .main .visual_sect .txt_box { top: 47%; }

    .since_sect .num_cont { width: 83%; }
    .since_sect .num_cont .num_wrap .num { font-size: 18rem; }
    .since_sect .line_wrap  { width: 90%; }

    .special_sect .top .paging { right: 20%; }
    .special_sect .cont .special_box .wrap .txt_wrap .txt br { display: none; }


    .staff_sect .cont {  margin: 13rem auto 0; }
    .staff_sect .cont .img .cir_txt { width: 25rem; height: 25rem; }

    .youtube_sect .swiper-slide .txt_box .txt br { display: none; }

    .philo_sect .left .txt .bg_tit { font-size: 13.5rem; transform: translate(0%, -100%); }
    .philo_sect .left .txt {margin-top: 21%}



}

@media screen and (max-width: 1640px){
    .review_sect .reviewSwiper .swiper-slide .txt_box { width: 57%; }
    .visual_sect {padding-top: 36%}
    .main .visual_sect .txt_box .txt {font-size: 2.4rem}
    .main .visual_sect .txt_box .tit {font-size: 6rem}
    .main .visual_sect .slide_move {bottom: 9%}
    .main .visual_sect .slide_move .swiper-pagination-bullet + .swiper-pagination-bullet {margin-left: 5rem}

    .since_sect .num_cont {width: 90%}
    .since_sect .num_cont .num_wrap .num {font-size: 16rem}

    .notice_sect .right .cont .priv_chk_box .g-recaptcha {position: static; transform: scale(0.6); transform-origin: top left}
    .notice_sect .right .cont .priv_chk {margin-top: 2rem}
    .notice_sect .right .cont .btn_wrap {margin-top: 2rem}


}

@media screen and (max-width: 1440px){

    .visual_sect .visualSwiper {width: calc(100% - 40px)}

    .main .visual_sect .txt_box {left: 7%}
    .main .visual_sect .slide_move {left: 9%}
    .main .visual_sect .txt_box .txt {font-size: 2.2rem}
    .main .visual_sect .txt_box .tit {font-size: 5.2rem}

    .main .visual_sect .slide_move .swiper-pagination-bullet > svg {width: 30px; height: 30px; stroke-dasharray: 95; stroke-dashoffset: 95}
    .main .visual_sect .slide_move .swiper-pagination-bullet:before {width: 29px; height: 29px}
    .main .visual_sect .slide_move .swiper-pagination-bullet .circle {cx: 15px;cy: 15px;r: 15px}
    .main .visual_sect .slide_move .swiper-pagination-bullet .btn span {width: 2px; height: 8px}
    .main .visual_sect .slide_move .swiper-pagination-bullet .btn span + span {margin-left: 3px}

    .main .visual_sect .slide_move .pagination {font-size: 1.4rem}
    .main .visual_sect .slide_move .pagination .active {font-size: 1.25em}



    .visual_sect .txt_box .btn {margin-top: 4.5rem}
    .since_sect .num_cont {width: 100%}
    .since_sect .num_cont .num_wrap .desc {font-size: 3.6rem; top: -5%}

    .staff_sect .cont {width: 90%}
    .staff_sect:before {padding-top: clamp(115rem,77%,213rem)}


    .info_sect .info .info_btn {width: 80%}
    .info_sect .info .video_wrap {width: 88%;padding-top: 48.25%;}


}
@media screen and (max-width: 1024px){
    .info_sect {padding-bottom: 0}
    .info_sect .info {width: 100%}
    .info_sect .map {position: relative;width: 100%; margin-top: 6rem; padding-top: 60%}
    .info_sect .info .info_btn {flex-wrap: nowrap}
    .info_sect .info .info_btn .btn5:nth-of-type(n+3) {margin-top: 0; margin-left:5px}
}



@media screen and (max-width: 1200px){
    /*.page_wrap.banner .container,*/
    /*.container { padding-top:var(--header_Height); }*/


    .page_wrap.basic .container.banner {padding-top: calc(var(--header_Height) + 13rem);}

    .inp_box input { height: 45px; line-height: 45px; }

    .visual_sect { padding: 61% 8rem 0; }

    .since_sect { padding: 15rem 0; }
    .since_sect .num_cont .num_wrap .num { font-size: 12rem; }
    .since_sect .num_cont .num_wrap .desc { font-size: 3.2rem }
    .since_sect .num_cont .cont { font-size: 2.6rem; text-align: center}
    .since_sect .line_wrap .bg { height: 400%; }
    .since_sect .line_wrap .txt_box .tit:before { min-width: 130px; }

    .special_sect .cont .specialSwiper { padding-bottom: 31rem; }
    .special_sect .cont .special_box .wrap .txt_wrap { bottom: 5rem; padding: 3rem; }
    .special_sect .cont .special_box .wrap .txt_wrap .tit { font-size: 4.3rem; }
    .special_sect .cont .special_box .wrap .txt_wrap .b_txt { font-size: 2.3rem; }
    .special_sect .cont .special_box .wrap .txt_wrap .txt { font-size: 1.9rem; }

    .staff_sect .cont { margin: 8rem auto 0; }
    .staff_sect .cont .tit { font-size: 5.5rem; }
    .staff_sect .cont .img .cir_txt { width: 22rem; height: 25rem; }

    .philo_sect .left .txt .bg_tit { font-size: 5.8rem; }
    .philo_sect .right { width: 65%; }
    .philo_sect .cont .box {padding: 3rem 0}
    .philo_sect .cont .box .tit {font-size: 2.4rem; min-width: 130px; width: auto}
    .philo_sect .cont .box .txt { margin-left: 3rem; font-size: 1.8rem}

    .guarantee_sect .txt_wrap { margin-left: 8%; }
    .guarantee_sect .cont {padding: 6rem 20px}
    .guarantee_sect .txt_wrap .top_tit .badge {width: 20%}

    .review_sect .reviewSwiper .swiper-slide { width: 60%; }
    .review_sect .reviewSwiper .swiper-slide .txt_box .label { margin-top: 1rem; }
    .review_sect .reviewSwiper .swiper-slide .txt_box .txt { padding: 3rem 1.5rem; }
    .review_sect .reviewSwiper .swiper-slide .txt_box .btn_wrap { margin-top: 3rem; }

    .notice_sect .left {margin-top: 3rem}
    .notice_sect .left .notice li .tit { margin-left: 2rem; margin-right: 1rem; }
    .notice_sect .right .cont { padding: 5rem 3rem; }
    .notice_sect .right .cont .form_wrap .nice-select { height: 45px; line-height: 45px; }

    .banner_sect .paging { left: 37%; bottom: 13%; }
    .banner_sect .paging .navi.navi_prev,
    .banner_sect .paging .navi.navi_next { transform: translate(0, -50%); }

    .banner_sect .top_tit { width: 75%; }

    .info_sect .info .info_btn { width: 100%; }
    .info_sect .info .video_wrap { width: 100%; padding-top: 56.25%}

    .special_sect .cont .slide_move {display: none}

    .move_text_box .text {font-size: 18rem}

    .special_sect .top .paging {right: 20px}

    .staff_sect {padding: 12rem 0}
    .staff_sect .cont {width: 100%}
    .staff_sect:before {padding-top: clamp(96rem,86%,120rem)}

    .youtube_sect .slide_box {margin-top: 6rem}
    .promo_sect .paging,
    .youtube_sect .paging {display: none}

    .review_sect .reviewSwiper .swiper-slide .txt_box {margin-left: 2.5rem}
    .notice_sect .right {margin-left: 4rem}
    .top_tit .tit.Kr {font-size: 3.6rem}


    .promo_sect .cont  {margin-right: -20px}


}

@media screen and ( max-width: 900px ) {
    .review_sect .cont { padding-left: 20px; }

    .banner_sect .paging { width: 100%; left: 50%; bottom: 13%; padding: 0 2rem; }
}


@media screen and ( max-width: 768px ) {

    


    .inp_box input { font-size: 1.8rem; height: 40px; line-height: 40px; padding: 0 15px}

    .top_tit .desc {font-size: 2.2rem}
    .top_tit .tit { font-size: 28px; }
    .info_sect .info .tit,
    .top_tit .tit.Kr { font-size: 18px; }
    .top_tit .txt { font-size: 10px; }

    .top_tit .desc + .tit {margin-top: 10px}

    .visual_sect { padding: 100% 8em 0; }
    .visual_sect .visualSwiper {width: 100%}

    #timer { width: 35px; height: 35px; }
    .main .visual_sect .slide_move .paging_btn { margin-left: 30px; }
    .main .visual_sect .slide_move .btn .pause { width :8px; height: 10px }
    .main .visual_sect .slide_move .btn .pause span { width: 2px; }


    .main .visual_sect .txt_box { left: var(--in_pd); top: auto; bottom: 20% ;transform: translateY(0)}
    .main .visual_sect .txt_box .txt { margin-bottom: 0rem; font-size: 3vw;}
    .main .visual_sect .txt_box .tit { font-size: 6vw;  margin-top: 10px}
    .main .visual_sect .bg_link  {position: absolute; width: 100%; height: 100%; left: 0; top: 0}

    .visual_sect .txt_box .btn1 {display: none}

    .main .visual_sect .slide_move { left: 30px; bottom: 20px; }
    .main .visual_sect .slide_move .pagination {margin-left: 0px; margin-top: 8px}
    .main .visual_sect .scroll-down { display: none; }

    .main .visual_sect .slide_move .pagination {font-size: 11px}
    .main .visual_sect .slide_move .pagination .active {font-size: 1.15em}
    .main .visual_sect .slide_move .swiper-pagination-bullet > svg {width: 20px; height: 20px; stroke-dasharray: 80; stroke-dashoffset: 80}
    .main .visual_sect .slide_move .swiper-pagination-bullet:before {width: 19px; height: 19px;}
    .main .visual_sect .slide_move .swiper-pagination-bullet .circle {cx: 10px;cy: 10px;r: 10px}
    .main .visual_sect .slide_move .swiper-pagination-bullet .btn span {width: 2px; height:6px}
    .main .visual_sect .slide_move .swiper-pagination-bullet .btn span + span {margin-left: 3px}
    .main .visual_sect .slide_move .swiper-pagination-bullet .btn svg {height: 8px}
    .main .visual_sect .slide_move .swiper-pagination-bullet {width: 3px; height: 3px;}
    .main .visual_sect .slide_move .swiper-pagination-bullet + .swiper-pagination-bullet {margin-left: 4rem}


    .since_sect { padding: 12rem 0 0rem; }
    .since_sect .num_cont { height: 10rem; margin-bottom: 10px}
    .since_sect .num_cont .cont { font-size: 13px; padding: 0 5px; text-align: center; width: 32%; word-break: keep-all}
    .since_sect .num_cont .num_wrap .num { font-size: 12vw }
    .since_sect .num_cont .num_wrap .desc { top: -12.5%; font-size: 14px; }
    .since_sect .num_cont .cont .line {bottom: -10px}
    .since_sect .txt_wrap { font-size: 15px; }
    .since_sect .txt_wrap br { display: none; }
    .since_sect .line_wrap { width: 100%; margin: 30px auto 10rem; }
    .since_sect .line_wrap:before,
    .since_sect .num_cont .cont .line,
    .since_sect .line_wrap .line {height: 0.5px}
    .since_sect .line_wrap .bg { top: 0; height: 250%; transform: unset; }
    .since_sect .line_wrap .txt_box .tit { font-size: 20px; }
    .since_sect .line_wrap .txt_box .txt {font-size: 14px}
    .since_sect .line_wrap .txt_box + .txt_box { margin-left: 10px; }
    .since_sect .line_wrap .txt_box .tit:before { min-width: 75px; }
    .since_sect .btn_wrap { margin-top: 75px; }

    .special_sect { padding: var(--main_mo_mt) 0 2rem; overflow: visible }
    .special_sect .top .paging { right: auto; left: 50% ;bottom: -30px; transform: translate(-50%,100%); }
    .special_sect .cont { margin-top: 75px; transform: none; opacity: 1}
    .special_sect .cont:after,
    .special_sect .cont:before {content: none}
    .special_sect .cont .specialSwiper { padding-bottom: 56%; overflow: hidden}
    .special_sect .cont .special_box .wrap { padding-top: 60%; }
    .special_sect .cont .special_box .wrap .txt_wrap { width: 95%; padding: 35px 15px; }
    .special_sect .cont .special_box .wrap .txt_wrap .tit { font-size: 22px; }
    .special_sect .cont .special_box .wrap .txt_wrap .b_txt { font-size: 15.5px; margin-top: 10px; word-break: keep-all}
    .special_sect .cont .special_box .wrap .txt_wrap .txt {font-size: 2.2rem; line-height: 1.6}




    .staff_sect { padding: 8rem 0 0; overflow: hidden; }
    .staff_sect:before { padding-top: 86%; }
    .staff_sect .top_tit {margin-bottom: 30px}
    .staff_sect .cont { width: 100%; margin: 2rem auto 0; }
    .staff_sect .cont .tit { margin-bottom: 10px; font-size: 32px; line-height: 1.2; }
    .staff_sect .cont .txt br {display: none}
    .staff_sect .cont .img .cir_txt { width: 80px; height: 80px; transform: translate(20%, -25%); }
    .staff_sect .img_wrap .cir_txt {width: 12rem ; height: 12rem}

    .move_text_box .text {font-size: 9rem}



    .philo_sect { padding: var(--main_mo_mt) 0 0; }
    .philo_sect .in { flex-direction: column; }
    .philo_sect .btn_wrap { margin-top: 10px; }
    .philo_sect .left { width: 100%; }
    .philo_sect .left .txt { margin-top: 21%; font-size: 15px; }
    .philo_sect .left .txt .bg_tit { font-size: 62px; z-index: -1}

    .philo_sect .right { width: 100%; margin-top: 25px; margin-left: 0}
    .philo_sect .cont .box:last-of-type {border-bottom: 0.5px solid var(--blue)}
    .philo_sect .cont .box { flex-direction: column;  align-items: flex-start; padding: 20px 0; border-top: 0.5px solid var(--blue); opacity: 1}
    .philo_sect .cont .box .tit { margin-bottom: 8px; transform: none; opacity: 1}
    .philo_sect .cont .box .txt { margin-left: 0; font-size: 15px; transform: none; opacity: 1}

    .guarantee_sect { padding: var(--main_mo_mt) 0 0; }
    .guarantee_sect .cont { padding: 30px 15px; flex-direction: column; align-items: flex-start; transform: unset; opacity: 1}
    .guarantee_sect .img {width: 70%; margin: 0 auto; opacity: 1}
    .guarantee_sect .txt_wrap { width: 100%; margin-left: 0; margin-top: 40px; opacity: 1}
    .guarantee_sect .txt_wrap .top_tit .tit.Kr{font-size: 21px}
    .guarantee_sect .txt_wrap .top_tit .tit span { margin-top: 0px; }
    .guarantee_sect .txt_wrap .top_tit .badge {width: 25%}
    .guarantee_sect .txt_wrap .txt { margin-top: 15px; font-size: 1.8rem; line-height: 1.5}
    .guarantee_sect .txt_wrap .txt br { display: none; }

    .youtube_sect { padding: var(--main_mo_mt) 0 0rem; }
    .youtube_sect .top .btn_wrap { margin-left: 15px; transform: translateY(-7px)}
    .youtube_sect .cont .paging { top: 18%; }
    .youtube_sect .swiper-slide .txt_box { width: 100%; }
    .youtube_sect .swiper-slide .txt_box .tit { font-size: 16px; line-height: 1.2; }
    .youtube_sect .swiper-slide .txt_box .txt { font-size: 12px; }
    .youtube_sect .swiper-slide .txt_box .txt br { display: none; }



    .review_sect { padding: var(--main_mo_mt) 0 0; }
    .review_sect .cont {margin-top: 4rem; padding: 0 var(--in_pd); opacity: 1}
    .review_sect .paging { min-width: 90px; margin-left: 15px; }
    .review_sect .paging .navi.navi_prev,
    .review_sect .paging .navi.navi_next { transform: translate(0, -50%); }



    .review_sect .reviewSwiper .swiper-slide { width: 100%; flex-wrap: wrap; }
    .review_sect .reviewSwiper .swiper-slide .img {width: 50%; padding-top: 68%}
    .review_sect .reviewSwiper .swiper-slide .txt_box { margin-left: 12px; width: calc(50% - 12px)}
    .review_sect .reviewSwiper .swiper-slide .txt_box .tit b:last-of-type {margin-top: 8px}
    .review_sect .reviewSwiper .swiper-slide .txt_box .tit {font-size: 14px}
    .review_sect .reviewSwiper .swiper-slide .txt_box .txt { padding: 10px; font-size: 10px}
    .review_sect .reviewSwiper .swiper-slide .txt_box .label { height: 25px; line-height: 25px; font-size: 10px}
    .review_sect .reviewSwiper .swiper-slide .txt_box .btn_wrap {margin-top: 2rem;}

    .review_sect .reviewSwiper .swiper-slide .phone_only.btn_wrap {width: 100%; margin-top: 30px; display: none!important;}

    .notice_sect .left .notice li a {padding: 2rem}
    .notice_sect .left .notice li .date_wrap .date {font-size: 2rem}

    .notice_sect { margin:var(--main_mo_mt) 0 0; padding: 8rem 0}
    .notice_sect .in { flex-direction: column; }
    .notice_sect .left { width: 100%; margin-top: 0}
    .notice_sect .left .notice li .tit { font-size: 13px; }
    .notice_sect .right { width: 100%; margin-left: 0; margin-top: 50px; }
    .notice_sect .right .cont .form_wrap .nice-select { font-size: 13px; }
    .notice_sect .right .cont .priv_chk p { font-size: 11px; }
    /*.notice_sect .right .cont .priv_chk_box .g-recaptcha {transform: scale(0.45)}*/
    .notice_sect .right .cont .priv_chk .all { font-size: 10px; }
    .notice_sect .right .cont .btn_wrap {margin-top: -1rem}






    .banner_sect {overflow: hidden}
    .banner_sect .in { padding-top: 25px}

    .banner_sect .paging { bottom: 15px; }
    .banner_sect .paging .navi svg {width: 12px}
    .banner_sect .paging_in {width: 100px}
    .banner_sect .top_tit { padding-top: 0; width: 58%; flex: none; padding-bottom: 60px; padding-right:0px; word-break: keep-all}

    .banner_sect .top_tit .tit br { display: none; }
    .banner_sect .img { position: absolute; right: 10px; bottom: 0; width: 38%;}
    .banner_sect .img img {max-width: none; width: 100%}

    .promo_sect { padding: var(--main_mo_mt) 0 0; }
    .youtube_sect .slide_box,
    .promo_sect .cont {margin-right: -15px; margin-top: 4rem}

    .partner_sect {padding: var(--main_mo_mt) 0}
    .partner_sect .in { flex-direction: column; }
    .partner_sect .cont { width: 100%; margin-top: 4rem}
    .partner_sect .cont .box {transform: unset; opacity: 1}
    /*.partner_sect .cont .box { padding: 8px 10px; display: flex; align-items: center}*/
    .partner_sect .cont .box:nth-of-type(1) img {width: 100%}

    .info_sect { display: flex; flex-direction: column; padding: 6rem 0 0; }
    .info_sect .info { width: 100%; }
    .info_sect .info .desc { font-size: 11px; }
    .info_sect .map { position: relative; width: 100%; margin-top: 40px; }
    .info_sect .info .info_btn {flex-wrap: wrap; margin-top: 4rem}
    .info_sect .info .info_btn .btn5:nth-of-type(n+3) {margin-top: 10px}
    .info_sect .info .info_btn .btn5:nth-of-type(2n-1) {margin-left: 0}
    .info_sect .info .info_btn .btn5 {width: calc(100%/2 - 2.5px )}




}

@media screen and (max-width: 600px){
    .staff_sect:before { padding-top: clamp(450px,110%,540px) }
}

@media screen and (max-width: 400px){
    .main .visual_sect .txt_box { width: 100%}

    .main .visual_sect .txt_box .txt { margin-bottom: 0rem; font-size: 15px; width: 80%; }
    .visual_sect .swiper-slide .txt_box span, .visual_sect .swiper-slide .txt_box span {word-break: keep-all}
    .main .visual_sect .txt_box .tit { font-size: 22px;  margin-top: 10px}
}

.ms-preloader{width: 100%;
    height: 100%;
    position: fixed;
    z-index: 9999999;
    top: 0;
    left: 0;
    opacity: 1;
    visibility: visible;
    background-color: #fff;}

.page_wrap .container {color:var(--blue)}

.header{opacity: 0; top: -200px; transition: top ease-out 1.5s, opacity ease-out 0.5s}
.page_wrap.active-start .header{opacity: 1; top: 0}