﻿@charset "utf-8";



:root {

    --hdH: 12rem;
    --hdIn:7rem;
    --fullInPd: 10rem;


    --inPd: 20px;
    --inpH: 3.5em;
    --mainIn: max(184rem, 1640px);
    --in: max(154rem, 1340px);
    --in2: max(134rem, 1140px);
    --in3: max(124rem, 1040px);
    --subVisPd: 12rem;
    --subPd: 20rem;
    --subMt: 6rem;

    /* 而щ윭 */
    --black:#000; 
    --green: #1EAC4B; 

    --alertColor :#1EAC4B;

    --gray: #9F9F9F; 
    --gray2: #696969; 


    --bg:#F4F6F8;
    --line:#CBCBCB;
    

    --radius: 2.4rem; /* 30 */ 

    --en: "Poppins", sans-serif;
    --serif: "Noto Serif KR", serif; 

    --h1:7.5rem; 
    --h2:6rem; 
    --h3:5rem; 
    --h4:4rem; 
    --h5:max(3.5rem,30px);; 
    --h6:max(3rem,28px);; 
    --h7:max(2.8rem,26px); 
    --h8:max(2.5rem,24px); 

    --p1:max(2.2rem,22px); 
    --p2:max(2rem,20px);
    --p3:max(1.8rem,18px);  /* 蹂몃Ц */  
    --p4:max(1.6rem,16px);
    --p5:max(1.5rem,15px);
    --p6:max(1.4rem,14px);

    --pd:30rem;
    --pd1:25rem;
    --pd2:20rem;
    --pd3:15rem;
    --pd4:10rem;

    --contMt: 10rem;
    --contMt1: 10rem;
    --contMt2: 8rem;
    --contMt3: 6rem;
    --contMt4: 4rem;

}

img {    image-rendering: -webkit-optimize-contrast;}

html {font-size: clamp(8.5px, calc(0.3125vw - 0px), 10px);} 
html.scroll_none { overflow: hidden; }
body::-webkit-scrollbar { width: 5px; height: 5px; }
body::-webkit-scrollbar-thumb { height: 5px; background: #A9A9A9; border-radius: 5px; }
body::-webkit-scrollbar-track { background-color: #fff; }

.in {position: relative; width: var(--in); max-width: 100%; padding: 0 var(--inPd); margin: 0 auto;}
.in2 {position: relative; width: var(--in2); max-width: 100%; padding: 0 var(--inPd); margin: 0 auto;}

.sr_only {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;}
.mo_over { display: block !important; }
.mo_only { display: none !important; }
.tab_only { display: none !important; }
.phone_only {display: none !important;}
.mini_only {display: none !important;}

.ms_preloader { width: 100%; height: 100%; position: fixed; top: 0; left: 0; opacity: 1; visibility: visible; background-color: #fff; z-index: 9999999; }
.page_wrap {display: flex; flex-direction: column; min-height: 100vh;}
.pin-spacer {max-width: 100%;}






/* ??됲듃 */
.nice-select {font-size: var(--p3); border-radius: 0;}
.nice-select:after { right: 2.5rem; width: 0.6em;; height: 0.6em; margin-top: -0.3em; font-size: 1em; border: 0; transform: rotate(0deg); transform-origin: center; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="9" viewBox="0 0 14 9" fill="none"><path d="M13 1L7 7L1 1" stroke="%231C1C1C" stroke-width="2" stroke-linecap="round"/></svg>') center/contain no-repeat; transition: transform 0.3s; }
.nice-select.open:after { transform: rotate(180deg); }

.nice-select .list {min-width: 100%; box-shadow: 0 0 0 1px var(--line); top: calc(100% + 2px); background-color: #fff; border-radius: 1rem; max-height: 400px; overflow-y: auto;} 
.nice-select .list .option {height: 3em; line-height: 3em; min-height: 0; padding: 0 10px; position: relative;}

.nice-select .list::-webkit-scrollbar{display: inherit; width: 10px;}
.nice-select .list::-webkit-scrollbar-thumb{background: #BFBFBF; border-right: 5px solid #fff; border-radius: 3px; border-top-right-radius: 8px 3px; border-bottom-right-radius: 8px 3px;}
.nice-select .list::-webkit-scrollbar-track{background: #fff;}
.nice-select .list::-webkit-scrollbar-button:vertical:decrement{height: 5px;}
.nice-select .list::-webkit-scrollbar-button:vertical:increment{height: 5px;}

/* ?ㅼ??댄띁 而⑦듃濡ㅻ윭 */

.swiper_controls {display: flex; align-items: center;}
.swiper_controls .num {text-align: center; width: 1.5em; font-weight: 700;}
.swiper_controls .pagination {position: relative; width: 10rem; height: max(0.4rem,2px); background-color:#E8E8E8; margin: 0 0.5em;}
.swiper_controls .pagination .swiper-pagination-progressbar-fill {background-color: #1c1c1c;}
.swiper_controls .swiper_btn {display: flex; align-items: center; cursor: pointer; opacity: 0.3; transition: 0.3s ease-in-out;}
.swiper_controls .swiper_btn.swiper-button-disabled svg {opacity: 0.3;}
.swiper_controls .swiper_btn svg {width: 1em; height: auto;; transition: 0.3s ease-in-out;}
.swiper_controls .swiper_next {margin-left: 1em;}
.swiper_controls .swiper_prev {margin-right: 1em;}

.swiper_controls.none {display: none !important;}





/* pointer */
.pointer {position:fixed; left: 0; top: 0;  z-index: 10;  pointer-events: none; ;}
.pointer .pointer_box {    background: rgba(0, 13, 171, 0.4);backdrop-filter: blur(10px); border-radius: 50%; transition:all .3s ease-out;display: flex; flex-direction: column; align-items: center; justify-content: center;  color: #fff; width: 16rem; height: 16rem; opacity:0; transform: scale(0);}
.pointer svg {width: 15%; height: auto;}
.pointer .eng {font-weight: 600; font-size: var(--p4); margin-top: 1rem;}
.pointer.on .pointer_box {opacity: 1; transform: scale(1);}



/* ---------- header ---------- */



.main .header {background-color: transparent; color: #fff;}

.main .header .logo polygon,
.main .header .logo path {fill: #fff; transition: 0.3s ease-in-out;}

.main .header .util_wrap .ico.search svg path {stroke: #fff; }
.main .header .util_wrap .ico.ham svg path {fill: #fff;}

.header .util_wrap .ico svg {width: 2.2em;}

.header { position: fixed; left: 0; top: 0; width: 100%; font-size: var(--p3); background-color: #fff; z-index: 100; border-bottom: 1px solid transparent; transition: 0.3s ease-in-out }

.header.search,
.header.hover {background-color:#fff;}


.header .logo polygon,
.header .logo path {fill: var(--navy); transition: 0.3s ease-in-out;}


.header.search .nav .list .depth1 > a,
.header.hover .nav .list .depth1 > a {color: #1c1c1c;}

.header.header_down {background-color:#fff; color: #1c1c1c; box-shadow: 0 0 5px 0 rgba(0,0,0,0.1);}


.header.search .logo polygon,
.header.search .logo path,
.header.hover .logo polygon,
.header.hover .logo path,
.header.header_down .logo polygon,
.header.header_down .logo path {fill: var(--navy);transition: 0.3s ease-in-out;}

.header.hover .util_wrap .ico.search svg path,
.header.search .util_wrap .ico.search svg path,
.header.header_down .util_wrap .ico.search svg path {stroke: #1c1c1c; }

.header.search .util_wrap .ico.ham svg path,
.header.hover .util_wrap .ico.ham svg path,
.header.header_down .util_wrap .ico.ham svg path {fill: #1c1c1c;}

.header.down {transform: translateY(-100%)}
.header.down .nav .list .depth1 .depth2 {opacity: 0 !important; pointer-events: none;}
.header .header_in { position: relative; display: flex; gap: 0; width: 100%; max-width: 100%; height: var(--hdH); padding: 0 var(--hdIn); align-items: center; z-index: 3;}

.header .logo { width: 25rem }
.header .logo svg{ display: block; width: 100%; height: auto; overflow: visible;}

.header.fix_up {transform: translateY(-100%) !important;}




.header nav {position: absolute; left: 50%; top: 0; height: 100%; transform: translate(-50%,0%); z-index: 1}
.header nav .list {display: flex; align-items: center; height: 100%;}
.header nav .depth1 { height: 100%;}
.header nav .list > li { position: relative; height: 100%; display: flex; align-items: center; font-size: var(--p2); transition: color 0.3s ease-in-out;}
.header nav .list > li:before {content: "";position: absolute; left: 50%; top: 0px; transform: translate(-50%,0) ;width: 100%; height: 0px; background-color: var(--green); }
.header.on nav .list > li::after {content: "";position: absolute; left: 50%; top: 0px; transform: translate(-50%,0) ;width: 100%; height: 22em;}
.header nav .list > li > a {display: flex; align-items: center; justify-content: center ;position: relative; padding: 0 3em; width: 100%; height: 100%;  font-weight: 500; white-space: nowrap ;transition: padding .3s}
.header nav .list > .depth1.active > a {color: var(--green);}
.header nav .list > li > a:before {content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 0; height: 1px; background-color: rgba(255,255,255,0.5); transition: width 0.3s ease-out}
.header nav .list > li > a > span {position: relative;}
.header nav .list > li > a > span::before {content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 0%; height: 1px; background-color: #000; transition: width 0.3s ease-out}
.header nav .depth1 {text-align: center;}
.header.on nav .depth1 {border-bottom: 1px solid rgba(255,255,255,0.3);}
.header nav .depth1 .depth2 {display: flex; flex-direction: column; align-items: flex-start; position: absolute; bottom: 0rem; left: 50%; padding-top: 3rem; transform: translate(-50%,100%); width: auto; height: 21em; white-space: nowrap; text-align: center; opacity: 0; pointer-events: none ; border-top: 1px solid transparent; text-align: left; z-index: 3;}
.header nav .depth1 .depth2 > li + li {margin-top: 1.1em}
.header nav .depth1 .depth2 > li > a {position: relative; display: inline-block; width: 100%; font-size: 0.9em; font-weight: 400; opacity: 1; transition: opacity 0.3s ease-out}
.header nav .depth1 .depth2 > li > a span {position: relative}
.header nav .depth1 .depth2 > li > a span:before {content: ""; position: absolute; left: -1.5rem; top: 0.5rem; transform: translate(100%,0%); width:0.4rem; height: 0.4rem; border-radius: 50%; background-color: #fff; opacity: 0; transition: opacity 0.3s ease-out , left 0.3s ease-out}

.header nav .depth1 .depth2 > li.out_link > a span:after {content: ""; position: absolute; right: -10px; top: 50%; transform: translate(100%,-50%) ;display: block; width:0.8em; height: 0.8em; transition: 0.3s ease-in-out ;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="%23" viewBox="0 0 512 512"><path d="M304 24c0 13.3 10.7 24 24 24l102.1 0L207 271c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l223-223L464 184c0 13.3 10.7 24 24 24s24-10.7 24-24l0-160c0-13.3-10.7-24-24-24L328 0c-13.3 0-24 10.7-24 24zM72 32C32.2 32 0 64.2 0 104L0 440c0 39.8 32.2 72 72 72l336 0c39.8 0 72-32.2 72-72l0-128c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 128c0 13.3-10.7 24-24 24L72 464c-13.3 0-24-10.7-24-24l0-336c0-13.3 10.7-24 24-24l128 0c13.3 0 24-10.7 24-24s-10.7-24-24-24L72 32z"/></svg>') no-repeat center / contain;}


.header nav .depth1 .depth3 {margin-top: 0.25em;}
.header nav .depth1 .depth3 > li {}
.header nav .depth1 .depth3 > li > a {font-size: 0.8em; opacity: 0.7; transition: opacity 0.3s ease-out}
.header nav .depth1 .depth3 > li > a:hover {opacity: 1;}
.header nav .depth1 .depth3 > li.active > a {opacity: 1}
.header nav .depth1 .depth3 > li + li {margin-top: 5px}


.header nav .depth1 .depth2 > li > a:hover span:before { opacity: 1; right: -1rem}

.header nav .depth1 .depth2 > li.active > a > span:before {opacity: 1; right: -1rem}
.header nav .list > li.active > a:before {opacity: 1}


.header .gnb_bg {position: absolute; left: 0; top: 0; width: 100%; height: 0; background-color: #fff; z-index: -1; overflow: hidden; opacity: 0;  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.03);}

.header .util_wrap { display: flex; align-items: center; justify-content: flex-end; margin-left: auto; height: 100%; position: relative; }
.header .util_wrap .link_btn {font-size: var(--p4); color: #fff; padding: 0.75em 2em; border-radius: 10em;}
.header .util_wrap .link_btn.green {background: rgba(30, 172, 75, 0.80);;}
.header .util_wrap .link_btn.black {background-color: rgba(0,0,0, 1);}
.header .util_wrap .link_btn.green:hover {background-color: var(--green);} 
.header .util_wrap .link_btn.black:hover {background-color: rgba(0,0,0,0.8)} 

.header .util_wrap .link_btn .link_ico {width: 0.9em; height: auto; margin-left:0.5em; fill: #fff;}
.header .util_wrap .link_btn .down_ico {width: 1.2em; height: auto; margin-left:0.5em; }

.header .util_wrap .link_btn + .link_btn {margin-left: 1em;}
.header .util_wrap .ham_btn {margin-left: 1.5em; width: var(--h7); display: none;}
.header .util_wrap .ham_btn svg {width: 100%; height: auto; }
.main .header.header_down .util_wrap .ham_btn svg path {fill: #000;}
.header .util_wrap .ham_btn svg path {fill: #000;}
.main .header .util_wrap .ham_btn svg path {fill: #fff;}

.main .header.on .util_wrap .ham_btn svg path {fill: #000;}

.header .util_wrap .ham_btn svg path {transition: 0.3s ease-in-out;}


.header.on {background-color: #fff; color: #000;}
.header.on nav .list > li > a{padding: 0 4em}
.header.on .gnb_bg{height: calc(var(--hdH) + 21em); opacity: 1; transition: height 0.3s ease-in-out, opacity 0.2s ease-in-out; font-size: var(--p2);}
.header.on nav .list > li .depth2 {opacity: 1;;pointer-events: visible; transition: opacity 0.3s; transition-delay: .1s}
.header.on nav .depth1 a svg {fill: #fff}
.header.on .logo svg path{fill: #fff !important;}
.header.on .right_wrap .btn svg {fill: #fff !important;}

.header.on nav .list > li:hover:before {height: calc(var(--hdH) + 21em);transition: height ease-in-out.5s, opacity ease-in-out .5s }
.header.on nav .list > li:hover {color: #fff;}
.header.on nav .list > li:hover > a:before {width: 100%;}
.header.on nav .list > li:hover > a > span::before {background-color: #fff;}


.header.on nav .list > .depth1.on > a {color: #fff;}
.header.on nav .depth1.on .depth2 > li.out_link > a > span:after {background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="%23fff" viewBox="0 0 512 512"><path d="M304 24c0 13.3 10.7 24 24 24l102.1 0L207 271c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l223-223L464 184c0 13.3 10.7 24 24 24s24-10.7 24-24l0-160c0-13.3-10.7-24-24-24L328 0c-13.3 0-24 10.7-24 24zM72 32C32.2 32 0 64.2 0 104L0 440c0 39.8 32.2 72 72 72l336 0c39.8 0 72-32.2 72-72l0-128c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 128c0 13.3-10.7 24-24 24L72 464c-13.3 0-24-10.7-24-24l0-336c0-13.3 10.7-24 24-24l128 0c13.3 0 24-10.7 24-24s-10.7-24-24-24L72 32z"/></svg>') no-repeat center / contain;}















/* ---------- site map ---------- */
.site_map { display: flex; flex-direction: column; align-items: center; justify-content: center; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: #1EAC4B;  z-index: 3000; opacity: 0; pointer-events: none; transition: opacity 0.5s; }
.site_map.active { opacity: 1; pointer-events: visible; }

.site_map .top {display: flex; align-items: center; width: max(164rem, 1240px); padding: 0 6rem 5rem; max-width: 100%;}
.site_map .top .logo {width: 40rem; }
.site_map .top .logo a {display: flex; align-items: center;  }
.site_map .top .link_btn {display: flex; align-items: center; gap: 1rem; font-weight: 700; margin-left: auto; font-size: var(--p4); color: #fff; padding: 1em 1.8em; border-radius: 10em; background-color: #000;}
.site_map .top .link_btn svg {width: 1em; height: auto; margin-left: 1em; ;}
.site_map .top .close_btn {width: var(--h5); height: var(--h5); transition: 0.3s ease-in-out; margin-left: 5rem;}
.site_map .top .close_btn svg {width: 100%; height: auto;}

.site_map .list { display: flex; align-items: flex-start; justify-content: space-between; color: #fff; padding: 0 6rem;}
.site_map .cont {border-top: 1px solid rgba(255,255,255,0.4); width: 100%;}
.site_map .cont .list {width: max(164rem, 1240px); margin: 10rem auto 0; max-width: 100%;}
.site_map .cont .list > .depth1 > a { position: relative; margin-bottom: 1.6em; font-size: var(--h5); font-weight: 700; }
.site_map .cont .list > .depth1 > a:before { content: ''; position: absolute; left: 0; top: -0.6em; width: 0.4em; height: 0.4em; border-radius: 100%; background-color: var(--blue3); transform: translateY(-300%); opacity: 0; transition: opacity 0.5s, transform 0.5s; }
.site_map .cont .box.active .depth1:before { transform: translateY(0); opacity: 1; }
.site_map .cont .depth2 { margin-top: 5rem;  }
.site_map .cont .depth2 > li {  transition: color 0.6s; font-size: var(--h8);}
.site_map .cont .depth2 > li + li {margin-top: 0.9em;}
.site_map .cont .depth2 > li > a { position: relative; display: inline-block;}
.site_map .cont .depth2 > li > a::before { content: ""; position: absolute; right: -0.5em; top: 50%; transform: translate(100%, -50%);display: block; width: 0.35em; height: 0.35em; border-radius: 50%; background-color: #fff; opacity: 0;}
.site_map .cont .depth2 > li > a span { position: relative; }
.site_map .cont .depth2 > li > a span:before { content: ''; position: absolute; left: 0; bottom: -0.2em; width: 0; border-bottom: 1px solid #fff; transition: width 0.6s; }
.site_map .cont .list .depth3 {margin-top: 0.5em;}
.site_map .cont .list .depth3 li a {font-size: 0.85em; position: relative;  padding-left: 1em;  opacity: 0.6; transition: 0.3s ease-in-out;}
.site_map .cont .list .depth3 li + li {margin-top: 0.65em;}
.site_map .cont .list .depth3 li a::before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 0.45em; height: 2px; background-color: #fff; }


 .site_map .cont .depth2 > li.out_link > a span:after {content: ""; position: absolute; right: -10px; top: 50%; transform: translate(100%,-50%) ;display: block; width:0.8em; height: 0.8em; transition: 0.3s ease-in-out ;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="%23fff" viewBox="0 0 512 512"><path d="M304 24c0 13.3 10.7 24 24 24l102.1 0L207 271c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l223-223L464 184c0 13.3 10.7 24 24 24s24-10.7 24-24l0-160c0-13.3-10.7-24-24-24L328 0c-13.3 0-24 10.7-24 24zM72 32C32.2 32 0 64.2 0 104L0 440c0 39.8 32.2 72 72 72l336 0c39.8 0 72-32.2 72-72l0-128c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 128c0 13.3-10.7 24-24 24L72 464c-13.3 0-24-10.7-24-24l0-336c0-13.3 10.7-24 24-24l128 0c13.3 0 24-10.7 24-24s-10.7-24-24-24L72 32z"/></svg>') no-repeat center / contain;}


.site_map .cont .depth2 li.active { font-weight: 700;}
.site_map .cont .depth2 li.active a:before {opacity: 1;}

.site_map .cont .depth2 > li > a:hover span:before {width: 100%;}
.site_map .cont .depth2 > li .depth3 li a:hover {opacity: 1;}




.site_map .bg_logo {position: absolute; right: 0; bottom: 0; width: 20%;}
.site_map .bg_logo svg {width: 100%; height: auto;}






/* ---------- footer ---------- */

.footer .in {display: flex; align-items: flex-end;}
.footer .left_box .logo {width: 23rem;}
.footer .left_box .logo svg {width: 100%; height: auto;}
.footer .left_box .terms_txt {display: flex; margin-top: 5rem;}
.footer .left_box .terms_txt a + a {margin-left: 3rem;}
.footer .left_box .terms_txt a {position: relative;}
.footer .left_box .terms_txt a::before {content: ""; position: absolute; left: 0; bottom: -1px; width: 0%; height: 1px; background-color: #fff; transition: width 0.3s ease-in-out;}
.footer .left_box .terms_txt a[target="_blank"] {padding-right: 1.2em; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><path fill="%23fff" d="M304 24c0 13.3 10.7 24 24 24l102.1 0L207 271c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l223-223L464 184c0 13.3 10.7 24 24 24s24-10.7 24-24l0-160c0-13.3-10.7-24-24-24L328 0c-13.3 0-24 10.7-24 24zM72 32C32.2 32 0 64.2 0 104L0 440c0 39.8 32.2 72 72 72l336 0c39.8 0 72-32.2 72-72l0-128c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 128c0 13.3-10.7 24-24 24L72 464c-13.3 0-24-10.7-24-24l0-336c0-13.3 10.7-24 24-24l128 0c13.3 0 24-10.7 24-24s-10.7-24-24-24L72 32z"/></svg>') no-repeat right center / 0.8em;}

.footer .info_txt {margin-top: 1.5rem; color:rgba( 255, 255, 255, 0.6 ); font-size: var(--p3);}
.footer .copy_txt {margin-top: 5rem; font-size: var(--p4); opacity: 0.6; width: 100%;}

.footer .right_box {margin-left: auto;}
.footer .right_box .ico_box {display: flex; }
.footer .right_box .ico_box .ico {display: flex; align-items: center; justify-content: center; width: max(6rem, 50px); height: max(6rem, 50px); border-radius: 1rem; background: rgba(255, 255, 255, 0.10); transition: background 0.3s ease-in-out;}
.footer .right_box .ico_box .ico svg {width: 45%; height: auto; fill: #fff;} 
.footer .right_box .ico_box .ico svg path {fill: #fff;}
.footer .right_box .ico_box .ico.blog svg {width: 40%;}
.footer .right_box .ico_box .ico.cafe svg {width: 40%;}
.footer .right_box .ico_box .ico.kakao svg {width: 45%;}
.footer .right_box .ico_box .ico.insta svg {width: 45%; fill: transparent}
.footer .right_box .ico_box .ico.insta svg path {fill: transparent;}
.footer .right_box .ico_box .ico.shop svg {width: 42%; }

.footer .right_box .btn_wrap {display: flex; }
.footer .right_box .ico_box .ico + .ico,
.footer .right_box .btn_wrap .family_site {margin-left: 1.5rem; }

/* ?⑤?由ъ궗?댄듃 ???異붽? */
.footer .right_box .btn_wrap .family_site .nice-select{ width: max(20rem, 200px); height: max(6rem, 50px); line-height: 1; border-radius: 1rem; min-width: max-content;}
.footer .right_box .btn_wrap .family_site .nice-select .current{font-size: var(--p3); font-weight: 700; color: #101010; line-height: 1.2; }
.footer .right_box .btn_wrap .family_site .nice-select .nice-select .list{color: #000;}
.footer .right_box .btn_wrap .family_site .nice-select .list { top: auto !important; bottom: 100%; color:#101010; transform: scaleY(0) translateY(0); transform-origin: bottom center; transition:all 0.2s ease-out, opacity 0.15s ease-out}
.footer .right_box .btn_wrap .family_site .nice-select.open .list{transform: scaleY(1);}
.footer .right_box .btn_wrap .family_site .nice-select .option{font-weight: 500;}
.footer .right_box .btn_wrap .family_site .nice-select .option:first-child{display: none;}
.footer .right_box .btn_wrap .family_site .nice-select .option.focus{background-color: #fff; font-weight: 400}
.footer .right_box .btn_wrap .family_site .nice-select:after { display: block; right: 1em; width: 0.8em; height: 0.8em; margin-top: -0.4em; font-size: 1em; border: 0; transform: rotate(180deg); transform-origin: center; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none"><path d="M15 7.5H0M7.5 15V0" stroke="%231C1C1C" stroke-width="1.8" stroke-linejoin="round"/></svg>') center/contain no-repeat; transition: transform 0.3s; }
.footer .right_box .btn_wrap .family_site .nice-select.open:after { transform: rotate(0); background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="2" viewBox="0 0 15 2" fill="none"><path d="M15 0.900391H0" stroke="%231C1C1C" stroke-width="1.8" stroke-linejoin="round"/></svg>') no-repeat center / contain;}

/* New Footer */
.footer {padding: 12rem 0; background-color: #fff; color: #000; border-top: 1px solid var(--line);}
.sub .footer {background-color: #ECECEC; border-top: none;}
.footer .in {display: block; width: var(--in); max-width: 100%; margin: 0 auto;}
.main .footer .in {width: var(--in);}
.footer .footer_top {display: grid;grid-template-columns: minmax(0, 40%) minmax(0, 1fr);gap: 0 5.6rem;align-items: start;grid-template-areas:"way map""tel map";}
.footer_way { grid-area: way; }
.footer_map { grid-area: map; }
.footer_tel_box { grid-area: tel; }

.footer .footer_way .sub_tit {font-size: var(--p3); font-weight: 600;  color: rgba(0,0,0,0.7);}
.footer .footer_way .addr {margin-top: 3rem; font-size: var(--h6); font-weight: 700;}
.footer .footer_way .btn_box {display: flex; flex-wrap: wrap; gap: 1.5rem; margin-top: 3rem;}
.footer .footer_way .map_btn {display: inline-flex; align-items: center; justify-content: center; min-height: 5.5rem; padding: 0.8em 1.5em; border: 1px solid #000; border-radius: 999px; font-size: var(--p4); font-weight: 500; line-height: 1.5; transition: 0.3s ease-in-out;}
.footer .footer_way .map_btn svg {width: 1.5em; height: auto; margin-right: 0.5em;}


.footer .footer_tel_box {margin-top: 14rem;}
.footer .footer_tel_box .main_tel {display: flex; align-items: center;}
.footer .footer_tel_box .main_tel .ico {display: flex; align-items: center; flex-shrink: 0; width: 4rem; margin-right: 2rem;}
.footer .footer_tel_box .main_tel .ico svg {width: 100%; height: auto;}
.footer .footer_tel_box .main_tel .num {font-size: var(--h3); font-weight: 700; line-height: 1;}
.footer .footer_tel_box .sub_tel_box {display: flex; flex-direction: column; gap: 2rem; margin-top: 7rem;}
.footer .footer_tel_box .sub_tel_box .item {display: flex; align-items: center; gap: 4rem;  line-height: 1;}
.footer .footer_tel_box .sub_tel_box .label {min-width: 4.5em; color: rgba(0,0,0,0.7); font-size: var(--p3); font-weight: 700;}
.footer .footer_tel_box .sub_tel_box .value {font-size: var(--p2); font-weight: 500;}
.footer .footer_map {position: relative; overflow: hidden; padding-top: 58%; border-radius: 3rem; background: #0c0c0c;}
.footer .footer_map .map_cont {position: absolute; left: 0; top: 0; }
.footer .footer_map .map_cont .map {position: absolute; left: 0; top: 0;width: 100%; height: 100%; pointer-events: none;}
.footer .footer_map .img {position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover;}

.footer .footer_bottom {display: flex; align-items: flex-start; justify-content: space-between; gap: 4rem; margin-top: 6rem; padding-top: 5rem; border-top: 1px solid var(--line);}
.footer .footer_bottom_left {flex: 1; min-width: 0;}
.footer .terms_txt {display: flex; flex-wrap: wrap; gap: 3rem; margin-top: 0;}
.footer .terms_txt a {font-size: var(--p3); font-weight: 500; line-height: 1; color: #000;}
.footer .terms_txt a strong {font-weight: 600;}
.footer .info_txt {display: flex; flex-wrap: wrap; align-items: center; gap: 1.5rem; margin-top: 3rem; color: #000; font-size: 0; opacity: 0.5;}
.footer .info_txt span {position: relative; font-size: var(--p4); font-weight: 500; line-height: 1;}
.footer .info_txt span + span {padding-left: 1.6rem;}
.footer .info_txt span + span::before {content: ""; position: absolute; left: 0; top: 50%; width: 1px; height: 1.6rem; background-color: #000; transform: translateY(-50%);}
.footer .copy_txt {margin-top: 1.5rem; font-size: var(--p4); font-weight: 500; line-height: 1; }
.footer .footer_family {flex-shrink: 0; width: 10em;}
.footer .footer_family .nice-select {width: 100%; height: 3.2em; padding: 0 1.25em 0 1.25em; border: 1px solid #000; border-radius: 1rem; line-height: 3.1em; font-size: var(--p3); transition: 0.3s ease-in-out;}
.footer .footer_family .nice-select .current {font-size: var(--p3); font-weight: 700; color: #000; transition: 0.3s ease-in-out;}
.footer .footer_family .nice-select .list {top: auto !important; bottom: calc(100% + 1rem); min-width: 100%; border-radius: 1rem; color: #000; transform: scaleY(0.75) translateY(21px);transform-origin: bottom;}

.footer .footer_family .nice-select.open .list {transform: scaleY(1) translateY(0);}
.footer .footer_family .nice-select .option {font-size: var(--p4); font-weight: 500;}
.footer .footer_family .nice-select .option:first-child {display: none;}
.footer .footer_family .nice-select:after {right:1em; width: 0.8em; height: 0.8em; margin-top: -0.5em; border: 0; transform: rotate(0deg); background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none"><path d="M15 7.5H0M7.5 15V0" stroke="%23000" stroke-width="1.8" stroke-linejoin="round"/></svg>') no-repeat center / contain;}
.footer .footer_family .nice-select.open:after {transform: rotate(0); background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="2" viewBox="0 0 15 2" fill="none"><path d="M15 0.900391H0" stroke="%23000" stroke-width="1.8" stroke-linejoin="round"/></svg>') no-repeat center / contain;}



.footer .top_btn{position: fixed; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 9rem; height:9rem; border-radius: 1.5rem; bottom: var(--inPd); right: var(--inPd); transition:transform 0.3s ease; background-color: #fff; border: 1px solid var(--line); transition: 0.3s ease-in-out; z-index: 5;}
.footer .top_btn .ico{width: 35%;}
.footer .top_btn .ico svg{display: block; width: 100%; height: auto;}
.footer .top_btn svg path {transition:  0.3s ease-in-out;}
.footer .top_btn:hover {background-color: #000; ;}
.footer .top_btn:hover svg path {stroke: #fff;}


.sub .footer .footer_way .map_btn {border-color: transparent; background-color: #fff;}
.sub .footer .footer_family .nice-select {background-color: #000; color: #fff;}
.sub .footer .footer_family .nice-select .current {color: #fff;}
.sub .footer .footer_family .nice-select:after {transform: rotate(0);background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none"><path d="M15 7.5H0M7.5 15V0" stroke="%23fff" stroke-width="1.8" stroke-linejoin="round"/></svg>') no-repeat center / contain;}



/* DatePicker */
body .ui-widget{font-size:16px;}
body .ui-datepicker {position: relative; border:1px solid var(--lineColor); z-index: 101 !important; width: 17em; min-width:250px; display: none; border-radius: 10px; border:1px solid var(--lineColor); background-color: #fff; padding:0; font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;}
body .ui-datepicker-trigger { display: none; }
body .ui-datepicker .ui-datepicker-header { position:relative; border-radius: 10px 10px 0 0; overflow:hidden; padding: 10px; background-color: var(--blue); border-color: var(--blue);}
body .ui-datepicker table {font-size:1em; margin-bottom: 0;}
body .ui-state-default,
body .ui-widget-content .ui-state-default,
body .ui-widget-header .ui-state-default { background: none; border: 0; border-radius: 10px; transition:all 0.3s ease; }
body .ui-state-default:hover { background: #f5f5f5; }
body .ui-state-active { background: var(--blue) !important; color: #fff; }

body .ui-datepicker-today a { font-weight: 600; color: var(--blue); }
body .ui-datepicker .ui-datepicker-prev { left: 2px; cursor: pointer; }
body .ui-datepicker .ui-datepicker-next { right: 2px; cursor: pointer; }
body .ui-datepicker td span,
body .ui-datepicker td a { text-align: center; }
body .ui-datepicker .ui-datepicker-prev span,
body .ui-datepicker .ui-datepicker-next span { display:none; }

body .ui-datepicker .ui-datepicker-prev,
body .ui-datepicker .ui-datepicker-next { position:absolute; top:18px; top: 50%; margin-top: -10px;}
body .ui-datepicker .ui-datepicker-prev-hover,
body .ui-datepicker .ui-datepicker-next-hover {background-color: unset; border:none;}
body .ui-datepicker .ui-datepicker-prev { left:12px;}
body .ui-datepicker .ui-datepicker-prev:before {content: "";display: block;width: 20px;height: 20px;background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" fill="%23fff"><path d="M52.7 267.3c-6.2-6.2-6.2-16.4 0-22.6l160-160c6.2-6.2 16.4-6.2 22.6 0s6.2 16.4 0 22.6L86.6 256 235.3 404.7c6.2 6.2 6.2 16.4 0 22.6s-16.4 6.2-22.6 0l-160-160z"/></svg>') no-repeat center / contain;}
body .ui-datepicker .ui-datepicker-next { right:12px; }
body .ui-datepicker .ui-datepicker-next:before { content: "";display:block ; width:20px; height:20px; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" fill="%23fff" ><path d="M267.3 244.7c6.2 6.2 6.2 16.4 0 22.6l-160 160c-6.2 6.2-16.4 6.2-22.6 0s-6.2-16.4 0-22.6L233.4 256 84.7 107.3c-6.2-6.2-6.2-16.4 0-22.6s16.4-6.2 22.6 0l160 160z"/></svg>') no-repeat center / contain;}
body .ui-datepicker .ui-datepicker-prev-hover { left:12px; }
body .ui-datepicker .ui-datepicker-next-hover { right:12px; }
body .ui-datepicker .ui-datepicker-prev span,
body .ui-datepicker .ui-datepicker-next span { position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; }
body .ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; color: #fff; }
body .ui-datepicker .ui-datepicker-title select { font-size:1em; margin:1px 0; }
body .ui-datepicker select.ui-datepicker-month-year { width: 100%; }
body .ui-datepicker select.ui-datepicker-month,
body .ui-datepicker select.ui-datepicker-year { width: 49%; }
body .ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: 400; border: 0; }
body .ui-datepicker td { border: 0; padding: 1px; }
body .ui-datepicker td span,
body .ui-datepicker td a { display: block; padding: .4em .2em; text-align: center; text-decoration: none; }
body .ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; }
body .ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; }
body .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; }



/* ?묐쾭??*/
.fix_btn { position: fixed; bottom: 4rem; right:4rem; z-index:200; opacity: 0; transition: opacity 0.8s ease;}
.fix_btn.show{opacity: 1;}
.fix_btn .top_btn { display: flex; font-size:var(--p3); justify-content: center; align-items: center; width:10rem; height: 10rem; border-radius:100%; background-color: #fff;  box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.05); }
.fix_btn .top_btn svg { width:2.4rem; width:25%; height: auto; fill:#1c1c1c; }




/* 紐⑤떖 */
.modal {display: block; overflow: auto; position: fixed; top:0; left:0; right:0; bottom:0; z-index: 9999; opacity: 0; width:100%; height: 100%; padding: 8rem 0; font-size: var(--p4); background: rgba(0,0,0,0.7); pointer-events: none; transition: 0.3s ease-in-out;}
.modal.open {opacity: 1; pointer-events: inherit; }
.modal .modal_wrap {display: table; table-layout: fixed; vertical-align: middle; margin: 0 auto; width: 100%; height: 100%; position: relative; padding: 0 2rem;}
.modal .modal_wrap .scroll_box {display: table-cell; vertical-align: middle}
.modal .modal_wrap .modal_cont {position: relative; width: 100rem; max-width: 100%; margin: 0 auto; background-color: #fff;}
.modal .modal_wrap .modal_cont .modal_close {position: absolute; top: 3rem; right: 3rem; width: 3rem; height: 3rem; cursor: pointer; z-index: 2;background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="%23000" d="M420.7 36.7c6.2-6.2 16.4-6.2 22.6 0s6.2 16.4 0 22.6L246.6 256 443.3 452.7c6.2 6.2 6.2 16.4 0 22.6s-16.4 6.2-22.6 0L224 278.6 27.3 475.3c-6.2 6.2-16.4 6.2-22.6 0s-6.2-16.4 0-22.6L201.4 256 4.7 59.3c-6.2-6.2-6.2-16.4 0-22.6s16.4-6.2 22.6 0L224 233.4 420.7 36.7z"/></svg>') no-repeat center; background-size: 1.2em; transition: transform 0.5s; }
.modal .modal_wrap .modal_cont .modal_close.wh {background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="%23fff" d="M420.7 36.7c6.2-6.2 16.4-6.2 22.6 0s6.2 16.4 0 22.6L246.6 256 443.3 452.7c6.2 6.2 6.2 16.4 0 22.6s-16.4 6.2-22.6 0L224 278.6 27.3 475.3c-6.2 6.2-16.4 6.2-22.6 0s-6.2-16.4 0-22.6L201.4 256 4.7 59.3c-6.2-6.2-6.2-16.4 0-22.6s16.4-6.2 22.6 0L224 233.4 420.7 36.7z"/></svg>') no-repeat center/cover;}
.modal .modal_wrap .modal_cont.member{width: 60rem; background: none;}
.modal .member .btn_wrap{display: flex; justify-content: center; margin-top: 5.6rem;}
.modal .member .btn_wrap a{flex: 1; max-width: 50%; padding: 1.2em 0; background: var(--green); border: 1px solid var(--green); color: #fff; font-size: var(--p4); font-weight: 700; text-align: center; border-radius: 2em; line-height: 1em; transition: background 0.25s, color 0.25s;}
.modal .member .btn_wrap a + a{margin-left: 0.8rem;}
.modal .member .btn_wrap a.line{background: #fff; border-color: #232323; color: #232323; font-weight: 400;}
.modal .member .btn_wrap a:hover{background:#000; color:#fff;}

.over_modal {display: block; overflow: auto; position: fixed; top:0; left:0; right:0; bottom:0; z-index: 9999; opacity: 0; width:100%; height: 100%; padding: 8rem 0; background: rgba(0,0,0,0.7); font-size: var(--p3); pointer-events: none; transition: 0.3s ease-in-out;}
.over_modal.open {opacity: 1; pointer-events: inherit; }
.over_modal .modal_wrap {display: table; table-layout: fixed; vertical-align: middle; margin: 0 auto; width: 100%; height: 100%; position: relative; padding: 0 2rem;}
.over_modal .modal_wrap .scroll_box {display: table-cell; vertical-align: middle}
.over_modal .modal_wrap .modal_cont {position: relative; width: 80rem; max-width: 100%; margin: 0 auto; background-color: #fff;}
.over_modal .modal_wrap .modal_cont .modal_close {position: absolute; top: 3rem; right: 3rem; width: 3rem; height: 3rem; cursor: pointer; z-index: 2;background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="%23fff" d="M420.7 36.7c6.2-6.2 16.4-6.2 22.6 0s6.2 16.4 0 22.6L246.6 256 443.3 452.7c6.2 6.2 6.2 16.4 0 22.6s-16.4 6.2-22.6 0L224 278.6 27.3 475.3c-6.2 6.2-16.4 6.2-22.6 0s-6.2-16.4 0-22.6L201.4 256 4.7 59.3c-6.2-6.2-6.2-16.4 0-22.6s16.4-6.2 22.6 0L224 233.4 420.7 36.7z"/></svg>') no-repeat center; background-size: 1.2em;}
.over_modal .modal_wrap .modal_cont .modal_close.wh {background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="%23fff" d="M420.7 36.7c6.2-6.2 16.4-6.2 22.6 0s6.2 16.4 0 22.6L246.6 256 443.3 452.7c6.2 6.2 6.2 16.4 0 22.6s-16.4 6.2-22.6 0L224 278.6 27.3 475.3c-6.2 6.2-16.4 6.2-22.6 0s-6.2-16.4 0-22.6L201.4 256 4.7 59.3c-6.2-6.2-6.2-16.4 0-22.6s16.4-6.2 22.6 0L224 233.4 420.7 36.7z"/></svg>') no-repeat center/cover;}
.over_modal .modal_wrap .modal_cont .modal_close.bk {background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="%23000" d="M420.7 36.7c6.2-6.2 16.4-6.2 22.6 0s6.2 16.4 0 22.6L246.6 256 443.3 452.7c6.2 6.2 6.2 16.4 0 22.6s-16.4 6.2-22.6 0L224 278.6 27.3 475.3c-6.2 6.2-16.4 6.2-22.6 0s-6.2-16.4 0-22.6L201.4 256 4.7 59.3c-6.2-6.2-6.2-16.4 0-22.6s16.4-6.2 22.6 0L224 233.4 420.7 36.7z"/></svg>') no-repeat center; background-size: 1.2em;}
.over_modal .modal_wrap .modal_cont.member{width: 60rem; background: none;}

.over_modal .modal_wrap .modal_cont.terms {background:transparent;}
.modal_cont.terms {overflow: hidden; border-radius: 1.5rem;}
.modal_cont.terms .head{display: flex; align-items: flex-start; justify-content: space-between; padding: 2.4rem; background:var(--green); color:#fff;}
.modal_cont.terms .head p{margin-right: 1.5em; font-size:var(--p1); font-weight: 700;}
.modal_cont.terms .head .term_modal_close {width: 3rem; height: 3rem; cursor: pointer; z-index: 2;background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="%23000" d="M420.7 36.7c6.2-6.2 16.4-6.2 22.6 0s6.2 16.4 0 22.6L246.6 256 443.3 452.7c6.2 6.2 6.2 16.4 0 22.6s-16.4 6.2-22.6 0L224 278.6 27.3 475.3c-6.2 6.2-16.4 6.2-22.6 0s-6.2-16.4 0-22.6L201.4 256 4.7 59.3c-6.2-6.2-6.2-16.4 0-22.6s16.4-6.2 22.6 0L224 233.4 420.7 36.7z"/></svg>') no-repeat center; background-size: 1.2em; }
.modal_cont.terms .cont {overflow-y: auto; max-height: 66vh; padding: 2.4rem; background-color: #f6f6f6; border-radius: 0 0 2.4rem 2.4rem; font-size: var(--p3);}
.modal_cont.terms .cont figure  {margin: 0; overflow-x: auto; max-width: 100%;}
.modal_cont.terms .cont figure::-webkit-scrollbar {display: none;}
.modal_cont.terms .cont table {margin-top: 1rem;}
.modal_cont.terms .cont table td {border: 1px solid var(--gray) !important; padding: 1rem;}
.modal_cont.terms .cont p + p {margin-top: 1rem;}
.modal_cont.terms .cont .h3 {font-weight: 700; font-size: var(--p3); margin-bottom: 5px;}
.modal_cont.terms .cont .sect + .sect {margin-top: 20px;}
.modal_cont.terms .cont::-webkit-scrollbar{width: 10px;}
.modal_cont.terms .cont::-webkit-scrollbar-thumb{background: #d7d7d7; border-right: 5px solid #f6f6f6; border-radius: 3px; border-top-right-radius: 8px 3px; border-bottom-right-radius: 8px 3px;}
.modal_cont.terms .cont::-webkit-scrollbar-track{background: #f6f6f6;}
.modal_cont.terms .cont::-webkit-scrollbar-button:vertical:decrement{height: 15px;}
.modal_cont.terms .cont::-webkit-scrollbar-button:vertical:increment{height: 15px;}
.modal_cont.terms .item {display: flex}
.modal_cont.terms .item .number {margin-right: 0.3em}



/* ?뚮옃?덉씠??*/
.msg_layer{display: block; justify-content: center; align-items: center; overflow: auto; position: fixed; top:0; bottom:0; left:0; right:0; z-index: 9999; opacity: 0; width:100%; height: 100%; padding: 50px 20px 80px; background: rgba(0, 0, 0, 0.5); pointer-events: none; transition: 0.2s ease-in-out}
.msg_layer.open{opacity: 1; pointer-events: inherit}
.msg_layer .modal_wrap{display: table; position: relative; width: 100%; height: 100%; padding: 0 3rem; margin: 0 auto; table-layout: fixed; vertical-align: middle}
.msg_layer .modal_wrap .scroll_box{display: table-cell; vertical-align: middle}
.msg_layer .modal_wrap .modal_cont {position: relative; width:55rem; max-width: 100%; margin: 0 auto; background-color: #fff; border-radius: 12px;}
.msg_layer .modal_wrap .modal_cont .cont {padding: 4rem 3rem}
.msg_layer .modal_wrap .modal_cont .cont p {font-size: var(--p3); text-align: center}
.msg_layer .modal_bot_box {display: flex; justify-content: center}
.msg_layer .modal_bot_box .btn {display: inline-block; width: 12rem; height: 4rem; line-height: 3.9rem; background-color: #000; color: #fff}
.msg_layer .modal_bot_box .btn:first-child:nth-last-child(2),
.msg_layer .modal_bot_box .btn:first-child:nth-last-child(2) ~ .btn {width: 12rem;}
.msg_layer .modal_top { display: flex; align-items: center; justify-content: space-between; padding: 4rem 4rem 2rem; display: none}
.msg_layer .modal_top.step { align-items: flex-start; }
.msg_layer .modal_top .tit_wrap {  }
.msg_layer .modal_top .step { font-size: 16px; font-weight: 600; }
.msg_layer .modal_top .step + .tit { margin-top: 10px; }
.msg_layer .modal_top .tit { font-size: 24px; font-weight: 700; }
.msg_layer .btn_wrap { display: flex; align-items: center; justify-content: center; width: 100%; margin-top: 3rem; }
.msg_layer .btn_wrap .btm_btn { cursor:pointer;display: flex; align-items: center; justify-content: center; flex: 1; max-width: 50%; height: 3em; padding: 0 1.5em; line-height: 3.1rem; font-size: var(--p4); font-weight: 600; border-radius: 2em; background-color: var(--green); border: 1px solid var(--green); color: #fff; box-shadow: 0 0 0 transparent; transition: 0.3s ease-in-out; white-space: nowrap; }
.msg_layer .btn_wrap .btm_btn.wh{background-color: #fff; color: var(--green);}
.msg_layer .btn_wrap .btm_btn:hover,
.msg_layer .btn_wrap .btm_btn.wh:hover{background: #000; color:#fff; border-color: #000;}
.msg_layer .btn_wrap .btm_btn .txt { font-weight: 600; }
.msg_layer .btn_wrap > * + * { margin-left: 1rem; }






/* Hover */
@media screen and (min-width: 1241px) {

    .swiper_controls .swiper_btn:hover {opacity: 1;}
    .site_map .top .close_btn:hover {transform: rotate(180deg);}



    .round_btn .btn:hover{background-color: var(--black); border-color:var(--black); color:#fff;}
    .round_btn .btn:hover:after {background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="%23FFFFFF" d="M429.8 273l17-17-17-17L276.2 85.4l-17-17-33.9 33.9 17 17L354.9 232 24 232 0 232l0 48 24 0 330.9 0L242.2 392.6l-17 17 33.9 33.9 17-17L429.8 273z"/></svg>') no-repeat center / contain;}
    .round_btn.wht .btn:hover{background-color: #fff; border-color:#fff; color:var(--black);}
    .round_btn.wht .btn:hover:after {background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="%23000000" d="M429.8 273l17-17-17-17L276.2 85.4l-17-17-33.9 33.9 17 17L354.9 232 24 232 0 232l0 48 24 0 330.9 0L242.2 392.6l-17 17 33.9 33.9 17-17L429.8 273z"/></svg>') no-repeat center / contain;}
    .round_btn.out .btn:hover:after{background: url('data:image/svg+xml,<svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.5312 0.75H17.1562H18V1.59375V7.21875V8.0625H16.3125V7.21875V3.63281L8.47266 11.4727L7.875 12.0703L6.67969 10.875L7.27734 10.2773L15.1172 2.4375H11.5312H10.6875V0.75H11.5312H10.6875H11.5312ZM0.84375 1.875H7.03125H7.875V3.5625H7.03125H1.6875V17.0625H15.1875V11.7188V10.875H16.875V11.7188V17.9062V18.75H0.84375H0V17.9062V2.71875V1.875H0.84375H0H0.84375Z" fill="white"/></svg>') no-repeat center / contain;}


    .header .util_wrap .util_btn:not(.ico_btn):hover{ background-color: var(--black); color: #fff; border-color:var(--black);}
    .header.top .util_wrap .util_btn:not(.ico_btn):hover{ background-color: rgba(255,255,255,0.4); color: #fff; border-color:transparent;}

    .header nav .depth1 .depth2 > li > a:hover{opacity: 1;}

    /* .main .header.top { background-color: rgba(0,0,0,.1); box-shadow: none;}
    .main .header.top .logo{filter: brightness(0) saturate(0) invert(1);}
    .main .header.top .nav .gnb_bg {background-color: rgba(0,0,0,.1);}
    .main .header.top .nav .list > li > a {color:#fff; transition: padding 0.5s ease, color 0s ease;}
    .main .header.top .util_wrap .util_btn.join { border-color: #fff; color: #fff;}
    .main .header.top .util_wrap .util_btn.login { background-color: #fff; border:1px solid #fff; color:var(--black);}
    .main .header.top .util_wrap .util_btn:hover { background-color: var(--black); color: #fff; border-color:var(--black);} */


    .footer .terms_txt a:hover {text-decoration: underline;}
    .footer .footer_way .map_btn:hover,
    .footer .footer_family .nice-select:hover {background-color: #000; color: #fff;}
    .footer .footer_family .nice-select:hover .current {color: #fff;}
    .footer .footer_family .nice-select:hover:after {transform: rotate(0); background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none"><path d="M15 7.5H0M7.5 15V0" stroke="%23fff" stroke-width="1.8" stroke-linejoin="round"/></svg>') no-repeat center / contain;}

    .footer .footer_way .map_btn svg path {transition: 0.3s ease-in-out;}
    .footer .footer_way .map_btn:hover svg path {fill: #fff;}


  
}




/* 諛섏쓳??*/

@media screen and (max-width: 2000px) {
    html { font-size: 7.5px; }

    :root {
        --hdH : 80px;


        --in:1240px;
       
        --h1:56px; 
        --h2:44px; 
        --h3:36px; 
        --h4:34px; 
        --h5:28px; 
        --h6:25px; 
        --h7:23px; 
        --h8:21px; 

    
        --p1:19px; 
        --p2:17px;
        --p3:16px;  /* 蹂몃Ц */  
        --p4:15px;
        --p5:14px;
        --p6:13px;





    }


}



@media screen and (max-width: 1640px){
    html { font-size: 7px; }

    :root {
        --hdIn: var(--inPd) 
    }


    
    .header nav .list > li > a {padding: 0 2.5em;}
    .header.on nav .list > li > a{padding: 0 3em}

    .header .util_wrap .link_btn {padding: 0.7em 1.5em; font-size: var(--p4);}



}

@media screen and (max-width: 1440px){
    .header nav {left: 48%;}

    .header nav .list > li > a {padding: 0 2.3em;}
    .header.on nav .list > li > a{padding: 0 2.8em}

    .header nav .depth1 .depth2 > li.out_link > a span:after {right: -5px;}
}




@media screen and (max-width: 1240px) {
    html { font-size: 6px; }

    :root {
        --hdH: 70px;

        --fullInPd: 10rem;


    --h1:40px; 
    --h2:34px; 
    --h3:30px; 
    --h4:26px; 
    --h5:24px;; 
    --h6:22px;; 
    --h7:20px; 
    --h8:18px; 

    --p1:18px; 
    --p2:16px;
    --p3:14px;  /* 蹂몃Ц */  
    --p4:13px;
    --p5:12px;
    --p6:11px;


    --pd:25rem;
    --pd1:25rem;
    --pd2:20rem;
    --pd3:15rem;


    --contMt:6rem

    }

    .mo_over { display: none !important; }
    .mo_only { display: block !important; }
    .tab_only{ display: block !important;}
    /*.ms_preloader{display:none;}*/

    .pointer{display: none;}

    .header nav {display: none;}
    .header .logo {width: 20rem;}

    .site_map .top .logo {width: 30rem;}
    .site_map .cont .list > li > a {font-size: var(--h7);}
    .site_map .cont .depth2 {margin-top: 3rem;}
    .site_map .cont .depth2 li {font-size: var(--p2);}

    .site_map .top .link_btn {font-size: var(--p4);}

    .header .util_wrap .ham_btn {display: block;}

}






@media screen and (max-width: 768px) {
    html {font-size: 6px;}


    :root {
        --hdH: 60px;
        --inPd:15px;

        --h1:34px; 
        --h2:28px; 
        --h3:26px; 
        --h4:24px; 
        --h5:20px;; 
        --h6:18px;; 
        --h7:18px; 
        --h8:18px; 

        --p1:16px; 
        --p2:14px;
        --p3:14px;  /* 蹂몃Ц */  
        --p4:13px;
        --p5:12px;
        --p6:11px;

        --pd:120px;
        --pd1:100px;
        --pd2:100px;
        --pd3:80px;
        --pd4:60px;

        --contMt1: 50px;
        --contMt2: 50px;
        --contMt3: 30px;
        --contMt4: 20px;
        



        --sectPd: 100px;
        --contMt: 35px;
    
        --contSmMt: 25px;

        --radius: 22px;
        --smRadius: 18px;
    }

    .header .nav .list > li > a{font-size:18px;}
    .header .nav .list > li > .depth2 > li > a{font-size:16px;}


    .fix_btn_box{top:unset; bottom: 0; left: 0; transform:unset;}
    .fix_btn_box.open{transform: unset;}
    .fix_btn_box .menu_box {border-radius: 0; padding: 15px 0; background:var(--blue)}
    .fix_btn_box .menu_box ul{display: flex; border-radius: 0;}
    .fix_btn_box .menu_box ul li{flex:1;}
    .fix_btn_box .menu_box ul li + li a{padding-top: 0;}

    .fix_btn_box .menu_box ul li.tel{display: block;}
    .fix_btn_box .menu_box ul li.resev a{padding-top: 0}

    .fix_btn_box .menu_box ul li.tel a .ico mask + path,
    .fix_btn_box .menu_box ul li.doc a .ico svg path{fill: #fff;}
    .fix_btn_box .menu_box ul li.resev a .ico svg path,
    .fix_btn_box .menu_box ul li.quick_map a .ico svg path,
    .fix_btn_box .menu_box ul li.info a .ico svg path,
    .fix_btn_box .menu_box ul li.test a .ico svg path{stroke: #fff;}
    .fix_btn_box .menu_box ul li a .txt{color:#fff;}

    .fix_btn_box .menu_box ul li.doc,
    .fix_btn_box .menu_box ul li.test{display:none;}

    .fix_btn{bottom: 90px; right: 15px;}
    .fix_btn .top_btn{width: 60px; height: 60px;}

    .footer {padding: 9rem 0;}
    .footer .footer_way .map_btn {padding: 0.7em 1.5em;}
    .footer .footer_tel_box {margin-top: 10rem;}


    .modal .modal_wrap .modal_cont.member.join{width: 75rem;}



    .site_map{justify-content: flex-start; overflow-y: auto; background-color: var(--bg); color: #101010; padding: 0}
    .site_map .top{position: relative; display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 0 var(--inPd); height:var(--hdH); flex-shrink: 0; background-color: var(--brown);}
    .site_map .top .logo{display: block; width: 20rem; }
    .site_map .top .link_btn {background-color: var(--green);}
    .site_map .top .link_btn .ico {display: none;}
    .site_map .top .close_btn {margin-left: 1.5em;}

    .site_map .top .close_btn {position: relative; top: 0; right: 0; display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; cursor: pointer; border:none; border-radius: 0;}
    .site_map .top .close_btn .ico{width: 100%; height: 100%;}
    .site_map .top .right_wrap{display: flex; align-items: center;}
    .site_map .top .right_wrap .util_btn{position: relative; display: inline-block; font-size: var(--smTxt); height: 2.4em; line-height: 2.4em; margin-right: 2rem; padding: 0 1em; border-radius: 10rem;background-color: transparent; color: #fff; font-weight: 500; }
    .site_map .top .right_wrap .util_btn:before{content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 10rem; background-color: rgba(255,255,255,.2);}

    .site_map .cont {position: relative; padding: 0; width: 100%; height: 100%; background-color: var(--bg); border-top: none;}
    .site_map .cont .list {flex-direction: column; max-width: 100%; padding: 0; margin-top: 0}
    .site_map .cont .list .depth1 {display: flex; padding: 0; width:100%; background-color: var(--bg);}
    .site_map .cont .list .depth1 + .depth1 {margin-top: 0; border-top: none;}
    .site_map .cont .list .depth1 > a{position:relative; display: flex; align-items: center; width: 24rem; padding: 0 1em; height: 3em; background-color: var(--bg); cursor: pointer; font-size:18px; color: #101010; font-weight: 700; margin-bottom: 0;}
    .site_map .cont .list .depth1.active > a,
    .site_map .cont .list .depth1.on > a{background-color: #fff;}
    .site_map .cont .list .depth1 + .depth1 { margin-left: 0; padding: 0; border-left: none}

    .site_map .cont .list .depth1 > a:before{display: none;}
    .site_map .cont .list .depth1 > a span{display: inline-block; transform: translateY(0);}
    .site_map .cont .list .depth1.active > a{color: #101010;}

    .site_map .cont .depth2 > li.out_link > a span:after {background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 512 512'%3E%3Cpath d='M320 0h160v160h-32V54.6L246.6 256 224 233.4 425.4 32H320V0zM64 64h160v32H96v320h320V288h32v160H64V64z'/%3E%3C/svg%3E") no-repeat center / contain;}

    .site_map .cont .list .depth2{display: none; position: absolute; top: 0; left: 24rem; width: calc(100% - 24rem); min-height: 100%; height: max-content; margin-top:0; padding: 0 1em; padding-bottom: 80px; color: #101010; background-color: #fff;}
    .site_map .cont .list .depth2.on{display: block; height: 100%;}
    .site_map .cont .list .depth1.active .depth2 { display: block;}
    .site_map .cont .list .depth1.on .depth2 { display: block;}
    .site_map .cont .list .depth2 > li{ font-size:18px;}
    .site_map .cont .list .depth2 > li + li {margin-top: 0; border-top: 1px solid rgba(0, 0, 0, 0.1);}
    .site_map .cont .list .depth2 > li > a{position:relative; display: flex; align-items: center; cursor: pointer; font-size: 16px; font-weight: 700; line-height: 1; height:calc(18px * 3)}
    .site_map .cont .list .depth2 > li:not(.no-depth3) > a:after{content:""; display: block; width: 0.8em; height: 1em; transform: translateX(0); margin-left: auto; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 26 25" fill="none"><path d="M22.8286 7.5L12.8286 17.5L2.82861 7.5" stroke="black" stroke-width="4" stroke-linecap="square"/></svg>') no-repeat center/ contain; transition: 0.3s ease-in-out}
    .site_map .cont .list .depth2 > li.on > a:after,
    .site_map .cont .list .depth2 > li.active > a:after{transform: rotate(180deg); opacity: 1;}

    .site_map .cont .list .depth2 > li.active > a{color: var(--green);}
    .site_map .cont .list .depth2 > li.on > a{padding-left: 0.8em;}
    .site_map .cont .list .depth2 > li.on > a:before { opacity: 1; left: 0 }

    .site_map .cont .list .depth3{display: none; margin-top: 0; padding-bottom:1em; padding-left: 0.7em;}
    .site_map .cont .list .depth2 > li.active .depth3 {display: block}
    .site_map .cont .list .depth3 > li > a{opacity: 0.5; font-size: var(--subTxt); font-weight: 500; padding-left: 0;}
    .site_map .cont .list .depth3 li a::before {display: none;}
    .site_map .cont .list .depth3 li + li {margin-top: 0.9em;}
    .site_map .cont .list .depth3 li.active a{opacity: 1; color: var(--green);}

    .site_map .cont .links{display: block; margin-top: auto; padding: 60px var(--inPd) 2em;}
    .site_map .cont .link a{display: flex; align-items: center; justify-content: space-between; background-color: var(--blue); border-radius: 8px; color:#fff; height: 3.7em; font-size:20px; font-weight: 600; padding: 0 1.2em}
    .site_map .cont .link a .ico svg{display: block; width: 1.2em; height:1.2em;}

    .site_map .top .link_btn {font-size: var(--p5); padding: 0.7em 1.5em;}
    .site_map .top .close_btn svg path {fill: #000;}

    .site_map .bg_logo {width: 30%;}

    .phone_over{display: none !important;}
    .phone_only{display: block !important;}

    .header .util_wrap .link_btn.green {display: none;}
    .header .util_wrap .link_btn {font-size: var(--p5); }


}


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

    .mini_only {display: block !important;}
    .mini_over {display: none !important;}

    :root {
        --hdH: 60px;

        
        --mainTit: 26px;
        --tit: 26px;
        --smTit: 20px;

        --lgTxt2: 17px;
        --lgTxt: 16px;
        --txt1: 16px;
        --txt2: 15px;
        --txt: 14px;
        --subTxt: 14px;
        --smTxt: 12px;
        --tinyTxt: 11px;

        --sectPd: 80px;
        --mainContMt: 35px;
        --contMt: 30px;
        --contSmMt: 20px;
        --subVisPd: 60px;

        --radius: 20px;
        --smRadius: 15px;
    }



    .site_map .top .logo,
    .header .logo{width:140px;}
    .header .nav .list > li > a{font-size:18px;}
    .header .nav .list > li > .depth2 > li > a{font-size:16px;}
    .header .ham_btn{width:22px; height:22px;}

    .header .nav .mo_top_box .logo{width: 135px;}
    .header .nav .util_wrap .util_btn{padding:0.7em 1em}
    .header .nav .util_wrap .util_btn + .util_btn{margin-left: 0.5em;}


    .footer .footer_top {display: flex; flex-direction: column; gap: 0;}
    .footer .footer_map {width: 100%;}
    .footer .footer_way .addr {margin-top: 10px;}
    .footer .footer_way .btn_box {margin-top: 15px;}
    .footer .footer_map {margin-top: 30px;}
    .footer .footer_tel_box {margin-top: 30px;}
    .footer .footer_tel_box .main_tel .num {font-size: var(--h4);}
    .footer .footer_tel_box .main_tel .ico {width: 3.2rem;}
    .footer .footer_tel_box .sub_tel_box {margin-top: 20px;}

    .footer .footer_bottom {margin-top: 30px; padding-top: 30px; flex-direction: column;}
    .footer .footer_bottom_left {flex: none; width: 100%;}
    
    .footer .terms_txt {gap: 20px;flex-wrap: nowrap;overflow-x: auto;width: calc(100% + var(--inPd) * 2);margin-left: calc(var(--inPd) * -1);padding: 0 var(--inPd);}
    .footer .terms_txt::-webkit-scrollbar {display: none;}

    .footer .terms_txt a {font-size: var(--p5)}
    .footer .info_txt span {font-size: var(--p5);}
    .footer .info_txt span + span {padding-left: 0;}
    .footer .info_txt span + span::before {display: none;}

    .footer .copy_txt {margin-top: 2.5rem;}


    .fix_btn .top_btn{width: 40px; height: 40px;}

    body .ui-widget{font-size:13px;}

    .site_map .top .close_btn {margin-left: 20px;}
    .site_map .top .link_btn {background-color: var(--green);}
    .site_map .top .link_btn svg {display: none;}


    .footer .top_btn {width: 7rem; height: 7rem;}


}










@keyframes textLoop {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    100% {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}
