@charset "utf-8";

@import url('https://use.typekit.net/bvd0vmo.css');
/* @import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600;700&display=block');
@import url('https://fonts.googleapis.com/css2?family=Nanum+Myeongjo:wght@400;700;800&display=block');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@200;300;400;500;600;700;900&display=block'); */

 

:root {
    --inPd: 20px;
    --headerH: 9.6rem;
    --mainInWid: clamp(1800px, 95vw, 195rem);
    --subInWid: clamp(1240px, 70vw, 154rem);
    --inpH: 6rem;  /* 70 */
    --inpH: 3.3em;
    

    --gold: #BFA072;
    --brown: #322D25;
    --navy: #1B1C66;
    --black:#1c1c1c;
    --bg: #F6F6F6;
    --bg2: #F5F1EC;
    --blue: #002575;
    --gray: #AAAAAA;
    --lineColor: #DDDDDD;

    --en:"Poppins", sans-serif;
    --en2: "kudryashev-d-contrast-sans", sans-serif;

    

    --tit: max(5.4rem, 50px);     /* 65 */
    --tit55: max(4.6rem, 48px);  /* 55 임시 추가 */
    --tit50: max(4.2rem, 45px);   /* 50 추가 */
    --tit45: max(3.8rem, 40px);   /* 45 임시 추가 */
    --tit40: max(3.3rem, 35px);    /* 40  임시 추가*/
    --tit35: max(2.9rem, 30px);   /* 35 임시 추가 */
    --smTit: max(2.5rem, 26px);   /* 30 */


    --lgTxt2: max(2.5rem, 25px); /* 30 */
    --lgTxt: max(2rem, 22px); /* 25 */
    --txt1: max(1.8rem, 20px); /* 22 */
    --txt2: max(1.6rem, 19px); /* 20 */
    --txt: max(1.5rem, 18px); /* 18 */
    --subTxt: max(1.5rem, 18px); /* 18 */
    --smTxt: max(1.3rem, 15px); /* 16 */
    --tinyTxt: max(1.2rem, 14px); /* 15 */
    
    --subSectPd: 16rem; /* 200 */
    --subSectPd2: 20rem; /* 260 */

    --subContMt2: 20rem; /* 260 */
    --subContMt1: 16rem; /* 200 */
    --subContMt: max(6.4rem, 70px); /* 80 */



    --radius: 3.2rem;
    --radius3: 2.5rem; /* 30 */

}

html.scroll_none { overflow: hidden; }
.en { font-family: var(--en); }
.in {width: var(--subInWid); max-width: 100%; padding: 0 var(--inPd); margin: 0 auto;}
/* .in2 {width: var(--subInWid); padding: 0 var(--inPd); margin: 0 auto;} */
.ms_preloader { width: 100%; height: 100%; position: fixed; top: 0; left: 0; opacity: 1; visibility: visible; background-color: #fff; z-index: 9999; }
.hidden {clip: rect(0, 0, 0, 0); height: 1px; margin: -1px; overflow: hidden; position: absolute; width: 1px}
.mo_over { display: block !important; }
.mo_only { display: none !important; }
.tb_only { display: none !important; }
.phone_only { display: none !important; }



/* ---------- header ---------- */
.header { position: fixed; left:0; top:0; right:0; z-index:400; font-size: max(1.8rem, 19px); color:#000; transition: all 0.5s ease; background-color: #fff; font-weight: 500; border-bottom: 1px solid #ededed;}
.header.down { transform: translateY(-100%);}

.header > .inner { max-width: var(--mainInWid); padding:0 var(--inPd); height: var(--headerH); display: flex; justify-content: space-between; align-items: center; margin: 0 auto}
.header .inner .logo { position: absolute; left: 50%; transform: translateX(-50%);}
.header .inner .logo a { display: flex; align-items: center }
.header .inner .logo a img { width:31rem; max-width:31rem; }

.header .inner .nav{height: 100%; }
.header .inner .nav .depth1 { display: flex; align-items: center; height: 100%;}
.header .inner .nav .depth1 > li{position: relative; height: 100%; display: flex; align-items: center;}
.header .inner .nav .depth1 > li > a { display: block; padding:0 2rem; color:#1c1c1c; transition: color 0.3s ease; font-weight: 600;}
.header .inner .nav .depth1 > li:first-child a{padding-left: 0}

.header .inner .nav .depth1 > li > .depth2{border-radius: 15px; position: absolute; top: calc(100% + 1px); font-size:0.9em; font-weight: 400; background-color: var(--brown); border:1px solid rgba(255,255,255,.2); padding: 1.5em 1em; clip-path: inset(0 0 100% 0); overflow: hidden; transition: clip-path 0.5s ease;}
.header .inner .nav .depth1 > li > .depth2 > li + li{margin-top: 0.5em;}
.header .inner .nav .depth1 > li > .depth2 > li a{position: relative; display: block; width: 100%; padding: 0.2em 1em; font-weight: 500; white-space: nowrap; border-radius: 5px; color:rgba(255,255,255,.7); transition: background-color 0.3s ease, color 0.3s ease;}
.header .inner .nav .depth1 > li > .depth2 > li a:before{content: ""; display: block; position: absolute; left: 0.3em; top: 50%; transform: translate(0,-50%); width: 0.25em; height: 0.25em; border-radius: 100%; background-color: #fff; opacity: 0; transition: opacity 0.3s ease-in-out; }

.header .inner .nav .depth1 > li > .depth2 > li a.active{color: rgba(255,255,255,1);}
.header .inner .nav .depth1 > li > .depth2 > li a.active:before{opacity: 1;}


/* header_right */
.header .right-wrap { display: flex; align-items: center; position: relative; height: 3em; font-size: max(1.6rem, 15px);}
.header .right-wrap > * + * {margin-left: 1em;}

.header .right-wrap .links { display: flex; align-items: center; height: 100%; background-color: #F6F6F6; border-radius:5em; }
.header .right-wrap .links a { display: block; padding:0 1.25em; line-height: 3em; border-radius:4.3em; font-weight:600; background-color: var(--gold); border-color:var(--gold); color: #fff; transition: all 0.3s ease;}
.header .right-wrap .links a + a {background-color:#F6F6F6; border-color: #F6F6F6; color: #000;}
.header .right-wrap .links a.active{ background-color: #000; border-color: #000; color: #fff}



.header .right-wrap .lang_select { height: 100%;}
.header .right-wrap .lang_select .nice-select{display: flex; align-items: center; font-size: max(1.4rem, 15px); background-color: transparent; padding:0 3.2em 0 1.4em; height: 100%; line-height: 1; border:2px solid #000; border-radius: 5rem;}
.header .right-wrap .lang_select .nice-select:after { width: 1em; height: 1em; right: 1.25em; top: 50%; margin-top: 0; transform: translateY(-50%); border: none; transform-origin: center; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" fill="%231c1c1c"><path d="M224 397.3l22.6-22.6 160-160L429.3 192 384 146.7l-22.6 22.6L224 306.7 86.6 169.4 64 146.7 18.7 192l22.6 22.6 160 160L224 397.3z"/></svg>') no-repeat center / contain;}
.header .right-wrap .lang_select .nice-select.open:after{transform: translateY(-50%) rotate(180deg);}
.header .right-wrap .lang_select .nice-select .current{color: #1c1c1c; font-weight: 600; transition: color .3s;}
.header .right-wrap .lang_select .nice-select .list{width: 100%; margin-top: 10px; border:2px solid #000; border-radius: 2rem; box-shadow:none; transform: translate(-50%); left: 50%;}
.header .right-wrap .lang_select .nice-select .list .option{line-height: 3em; padding:0; font-size: 1em; text-align: center; font-weight: 600;}
 
.header .right-wrap .lang_select .nice-select .list.option.focus, 
.header .right-wrap .lang_select .nice-select .list.option.selected.focus{background-color: #f2f2f2; font-weight: 600;}



.header .right-wrap .login-box {position: relative; fill: #000; height: 100%; border:2px solid #000; border-radius: 5rem;}
.header .right-wrap .login-box .login{display: flex; height: 100%; align-items: center; padding:0 1.4em;}
.header .right-wrap .login-box .login img,
.header .right-wrap .login-box .login svg{height: 1.8em;}
.header .right-wrap svg { display: inline-block; vertical-align: middle; width:auto;}
.header .right-wrap .login-box .login .txt{margin-left: 0.5em; font-weight: 600;}

/* 로그인 후 추가 */
.header .right-wrap .member_wrap{display: flex; height: 100%; margin-left: 0;}
.header .right-wrap .member_wrap > *{margin-left: 1em;}
.header .right-wrap .member_wrap .login_tool_box{position: relative; display: flex; align-items: center; height: calc(100% + 1rem);}
.header .right-wrap .member_wrap .login_tool_box .ico svg{display: block; width: auto; height: 3.5rem;}
.header .right-wrap .member_wrap .login_tool_box .ico{cursor: pointer; padding-bottom: 1rem}
.header .right-wrap .member_wrap .login_tool_box .tool_box{position: absolute; top: 100%; left:50%; transform: translateX(-50%); border: 2px solid #000; border-radius: 2rem; overflow: hidden; background: #fff; opacity: 0; visibility: hidden; transition: opacity 0.3s ease}
.header .right-wrap .member_wrap .login_tool_box .tool_box a{display: block; width: 100%; padding: 0 1em; line-height: 3em; font-size: 1em; text-align: center; font-weight: 600; transition: background 0.3s ease}
.header .right-wrap .member_wrap .login_tool_box .tool_box a:hover{background: #f6f6f6;}
.header .right-wrap .member_wrap .login_tool_box:hover .tool_box{opacity: 1; visibility:visible;}


.header .right-wrap .menu { stroke: #1c1c1c;}
.header .right-wrap .menu .ham{ height: 100%; display: flex; align-items: center;}
.header .right-wrap .menu .ham svg{height: 1.5em;}
.header .right-wrap .btn_search svg { width:3rem; height: auto;}


/* ---------- Site map ---------- */
.site_map { position: fixed; display: flex; flex-direction: column; justify-content: center; right: 0; top: 0; font-size: var(--txt);/*17*/ width: 100%; height: 100%; background-color: rgba(50,45,37,0.9); backdrop-filter: blur(20px); z-index: 3000; pointer-events: none; transform: translateX(100%); transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out; }
.site_map.on { opacity: 1; transform: translateX(0); pointer-events: visible;}

.site_map > .inner{display: flex; flex-direction: column; align-items: center; justify-content: center; max-width: 80%; width: 100%; height: 100%; padding: 8rem 2rem; margin: 0 auto;}
.site_map .logo,
.site_map .member_wrap,
.site_map .links {display: none;}
.site_map .lang_select {display: none !important;}
.site_map .right-wrap{height: auto;}
.site_map .cls_btn{position: absolute; right: 4vw; top: 3vw; top:0; display: flex; align-items: center; justify-content: center; width: 7rem; height: 7rem; border-radius: 100%; border: 1px solid #fff; background-color: #fff; fill: #000; cursor: pointer; opacity: 0; transition: opacity 0.8s ease 0.5s, background-color 0.5s, fill 0.5s;}
.site_map .cls_btn svg { width: 35%; transition: transform 0.3s ease;}
.site_map.on .tit span{ transform: translateY(0);}
.site_map.on .cls_btn{opacity: 1;}


.site_map .cont {display: flex; justify-content: space-between; align-items: stretch; margin: 0 auto; max-width: 80%; width: 100%; padding: 8rem 2rem;} /* align-items: stretch; height:100% */
.site_map .cont .box { position: relative; padding:0 2% 1em;}
.site_map .cont .box::before { content: ""; position: absolute; left: 0; top: 0;  bottom: 0;  width: 1px; background: rgba(255,255,255,.1);}
.site_map .cont .box .depth1 { position: relative; padding-top:1em; margin-bottom: 0; font-size: 1.6em; font-weight: 600; overflow: hidden; color:#fff;}
.site_map .cont .box .depth1 span {position: relative; display: inline-block; transform: translateY(130%); overflow: hidden; transition: transform 1s ease 0.5s;}
.site_map .cont .box .depth1:before { content: ''; position: absolute; left: 0; top: 0.2em; width: 0.2em; height: 0.2em; border-radius: 100%; transform: translateY(-200%); background-color:var(--gold); opacity: 0; transition: opacity 0.5s, transform 0.5s; }
.site_map .cont .box.active .depth1:before { transform: translateY(0); opacity: 1; }
.site_map.on .cont .box .depth1 span{transform: translateY(0);}

.site_map .cont .box .depth2 li { color: rgba(255,255,255,.6); transition: color 0.6s;}
.site_map .cont .box .depth2 li a{display: block; overflow: hidden; margin:0.3em 0;}
.site_map .cont .box .depth2 li a span{position: relative; display: inline-block; transform: translateY(150%); overflow: hidden;  transition: transform 1s ease 0.5s;}
.site_map .cont .box .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 .box .depth2 li.active { color: #fff; }
.site_map .cont .box .depth2 li.active a:before { width: 100%; }
.site_map .cont .box .depth2 li a.active{color:var(--gold);}
.site_map.on .cont .box .depth2 li a span{transform: translateY(0);}
.site_map .btn_search { display: none;}


/* ---------- Footer ---------- */
.footer { padding:8rem 0; border-top: 1px solid #ddd; position: relative;}
.footer .in{width: 100%;  padding: 0 7rem;}
.footer .cont_box { display: flex; justify-content: space-between; margin-bottom: 4.8rem;}
.footer .qrs { display: flex;  margin-bottom: 3.8rem; }
.footer .qrs div { width:12rem; border-radius:10px; overflow: hidden; background-color: #F2F2F2; margin-right:4rem; }
.footer .qrs div:last-child { margin-right:0; }
.footer .qrs div i { display: block; padding: 0.8rem;}
.footer .qrs div p { text-align: center; line-height: 2.4rem; background-color: #666666; font-size:var(--tinyTxt); color:#fff; font-weight:600;}
.footer .copy { font-size:3.36rem; font-weight:700; line-height: 1.6;}
.footer .right { display: flex; align-items: flex-end; flex-direction: column;}
.footer .sns { display: flex;  font-size: var(--smTxt)}
.footer .sns > a { width:4em; height: 4em; border-radius:100%; display: flex; align-items: center; justify-content: center; overflow: hidden; margin-right:1.6rem; }
.footer .sns .btn-kakao { background-color: #FFE200;}
.footer .sns .btn-kakao img { height: 2.2em;;}
.footer .sns .btn-blog { background-color: #42D31A;}
.footer .sns .btn-blog img { height: 1.6em;}
.footer .nice-select { padding:0 9em 0 1.5em; line-height: 4em; height: 4em; border-radius:6rem; background-color: var(--gold); font-size:var(--smTxt); font-weight:500; color:#fff;; }
.footer .nice-select:after {border-color: #fff;width: 0.6em;height: 0.6em;right: 3.4rem; margin-top: -0.4em}
.footer .nice-select .list { display: flex; flex-direction: column; align-items: flex-start; background-color: var(--gold); border-radius:1.2rem; width:100%; box-shadow:none; border:1px solid var(--gold); padding: 1em 1.5em; margin-top: 10px;}
.footer .nice-select .current{ width:11rem; display: block; }

.footer .nice-select .option {padding: 0; display: inline-block; position: relative; line-height: 1.6; padding-bottom: 2px;; min-height: inherit;}
.footer .nice-select .option { color:rgba(255,255,255,0.6);;}
.footer .nice-select .option:hover { color:#fff; }
.footer .nice-select .option.focus, 
.footer .nice-select .option.selected.focus { background-color: var(--gold);}

.footer .nice-select {background-color: var(--gold); border:0;}
.footer .nice-select .list {background-color: var(--gold);; border-color: var(--gold); bottom:calc(100% + 5px); top:inherit; z-index:200; box-shadow:0 0 15px rgba(0,0,0,0.1); border-radius:3rem; max-height: 50rem; overflow-y: auto;}
.footer .nice-select .list::-webkit-scrollbar { width: 2px; height:2px; }
.footer .nice-select .list::-webkit-scrollbar-track {background-color: transparent; margin: 8px;}
.footer .nice-select .list::-webkit-scrollbar-thumb {border-radius: 5px; background-color: #fff;}
.footer .nice-select .list::-webkit-scrollbar-button:vertical:start:decrement,
.footer .nice-select .list::-webkit-scrollbar-button:vertical:end:increment {  height: 8px;  display: block;  background: transparent;}
.footer .nice-select .list::-webkit-scrollbar-button:horizontal:start:decrement,
.footer .nice-select .list::-webkit-scrollbar-button:horizontal:end:increment { width: 8px; display: block; background: transparent;}

.footer .nice-select .option.focus,
.footer .nice-select .option.selected.focus {background-color: var(--gold);;}
.footer .nice-select .option { background: none;;}
.footer .nice-select .option:before {content: ""; position: absolute; left: 0; bottom: 3px;  width: 0%; height: 1px; background-color: #fff; transition: width 0.3s ease-in-out}
.footer .nice-select .option[data-value="familysite"] { display: none; }
.footer .nice-select .option[data-value="title"] { margin:1.5rem 0  0.3rem; color:#fff;}
.footer .nice-select .option.disabled { font-size:var(--subTxt); font-weight:700; pointer-events: none;}
.footer .nice-select .option.selected { font-weight:400;}

.footer .calls { display: flex;  margin-top:4rem }
.footer .calls .cs { display: flex; justify-content: center; align-items: center; flex-direction: column; width:48.8rem; height: 20.8rem; background:#F7F7F7; border-radius:1.6rem; text-align: center;}
.footer .calls .cs + .cs { margin-left:2.4rem; }
.footer .calls .cs p { display: flex; align-items: center; justify-content: center; font-size:2.4rem; font-weight:600; margin-bottom: 1.6rem; }
.footer .calls .cs p svg {width: 0.9em; height: auto}
.footer .calls .cs p span { margin-left: 0.8rem;}
.footer .calls .cs strong { font-size:4.86rem; font-weight:600; line-height: 1; }
.footer .foot { padding-top:4.4rem; border-top:1px solid #ddd; display: flex; align-items: flex-end; justify-content: space-between}
.footer .foot .in {display: flex; justify-content: space-between; align-items: flex-end;}
.footer .foot .logo img { height: 4.8rem;}
.footer .foot .logo span { font-size:14px; color:#666; margin-top: 1.6rem; vertical-align: bottom; display: block}
.footer .foot .etc { display:flex; align-items: flex-end; flex-direction: column;}
.footer .foot .etc ul { display: flex; flex-wrap: wrap;  margin-bottom: 1.6rem; align-items: flex-end;}
.footer .foot .etc ul li { margin-right:1.6rem; margin-bottom: 0.8rem; }
.footer .foot .etc ul li:last-child { margin-right:0; }
.footer .foot .etc ul li a { font-size:var(--txt); font-weight: 500; }
.footer .foot .etc ul li a svg { width:0.9em; height: auto;}
.footer .foot .etc ul li:first-child a { font-weight:700; }
.footer .foot .copy { display: flex; font-size:var(--smTxt); color:rgba(28,28,28,0.8); font-weight: 400;}
.footer .foot .copy p + p:before {content: ''; display: inline-block; vertical-align: middle; width:1px; height: 1.5rem; background-color: #aaa; margin:0 1.2rem;}

.footer .fix-top { position: fixed; bottom: 60px; right:8rem; z-index:100;  font-size: max(1.6rem,19px); transition: opacity 0.5s ease;}
.footer .fix-top.scroll_down{opacity: 0;}
.footer .fix-top button,
.footer .fix-top a { width:4em; height: 4em; border-radius:100%; background-color: #fff;box-shadow: 0 3px 30px rgba(139,139,139,0.2); display: flex;  justify-content: center; align-items: center; }
.footer .fix-top svg { width:1em; height: auto; fill:#1c1c1c; }
.footer .fix-top.abs {position: absolute; bottom: auto; top: -60px; transform: translateY(-100%)}





/* 모달 */
.modal{ position: fixed; display: flex; align-items: center; justify-content: center; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; pointer-events: none; z-index: 2000; backdrop-filter: blur(10px); background:rgba(0,0,0,0.2); transition: opacity 0.3s ease-in-out;}
.modal.open{opacity: 1; pointer-events: inherit;}
.modal .modal_wrap{position:relative; width: 100%; height:100%; font-size:var(--smTit); display: flex; align-items: center; justify-content: center; padding:0 2rem;}
.modal .modal_wrap .scroll_box {display: table-cell; vertical-align: middle; width:100%; }
.modal .modal_wrap .close_btn {position: absolute; top: 3rem; right: 3rem; width: 3rem; height: 3rem; font-size:3rem; cursor: pointer; z-index: 2;background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><path fill="%23666666" d="M183.1 137.4C170.6 124.9 150.3 124.9 137.8 137.4C125.3 149.9 125.3 170.2 137.8 182.7L275.2 320L137.9 457.4C125.4 469.9 125.4 490.2 137.9 502.7C150.4 515.2 170.7 515.2 183.2 502.7L320.5 365.3L457.9 502.6C470.4 515.1 490.7 515.1 503.2 502.6C515.7 490.1 515.7 469.8 503.2 457.3L365.8 320L503.1 182.6C515.6 170.1 515.6 149.8 503.1 137.3C490.6 124.8 470.3 124.8 457.8 137.3L320.5 274.7L183.1 137.4z"/></svg>') no-repeat center; background-size: 1.2em; transition: transform 0.5s; }
.modal .modal_wrap .close_btn.wh {background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><path fill="%23FFFFFF" d="M183.1 137.4C170.6 124.9 150.3 124.9 137.8 137.4C125.3 149.9 125.3 170.2 137.8 182.7L275.2 320L137.9 457.4C125.4 469.9 125.4 490.2 137.9 502.7C150.4 515.2 170.7 515.2 183.2 502.7L320.5 365.3L457.9 502.6C470.4 515.1 490.7 515.1 503.2 502.6C515.7 490.1 515.7 469.8 503.2 457.3L365.8 320L503.1 182.6C515.6 170.1 515.6 149.8 503.1 137.3C490.6 124.8 470.3 124.8 457.8 137.3L320.5 274.7L183.1 137.4z"/></svg>') no-repeat center/cover;}
.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_wrap .modal_cont.basic .close_btn {position: absolute; top: 50%; margin-top:-1.5rem; 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: 0.8em;}
.modal_wrap .modal_cont.basic .close_btn.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; cursor: pointer;}
.modal_wrap .modal_cont.basic .close_btn.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;}

.map_sect .modal .modal_cont .close_btn {position: absolute; top: 50%; margin-top:-1.5rem; 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: 0.8em;}



.modal .modal_cont{position: relative; background-color: #fff; width: 65rem; max-width: 100%; border-radius: 2.4rem; overflow: hidden; margin:0 auto; }
.modal .modal_cont .top_box{display: flex; font-size:var(--smTit); background:var(--blue); color:#fff; justify-content: space-between; padding: 1em; position: relative;}
.modal .modal_cont .top_box .tit{line-height: 1; font-weight: 700; position: relative;}
/* .modal .modal_cont .top_box .close_btn svg{display: block; width: 100%; height: 100%;} */
.modal .modal_cont .cont_box{overflow-x: auto; max-height: 60vh; font-size:var(--txt);}
.modal .modal_cont .cont_box::-webkit-scrollbar { width: 4px; height: 4px;}
.modal .modal_cont .cont_box::-webkit-scrollbar-track {background-color: #ddd;}
.modal .modal_cont .cont_box::-webkit-scrollbar-thumb {border-radius: 3px; background-color: var(--gold);}

.modal .btn_wrap{display: flex; justify-content: center; margin-top: 5.6rem;}
.modal .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(--smTxt); font-weight: 700; text-align: center; border-radius: 2em; line-height: 1em; transition: background 0.25s, color 0.25s;}
.modal .btn_wrap a + a{margin-left: 0.8rem;}
.modal .btn_wrap a.line{background: #fff; border-color: var(--black); color: var(--black); font-weight: 400;}



.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(--txt); 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: 60rem; max-width: 100%; margin: 0 auto; background-color: #fff;}
.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;}
.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_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.basic {overflow: hidden; border-radius: 0 0 var(--radius) var(--radius); max-width:90rem; width:100%; margin:0 auto;; background: none;}
.modal_cont.basic .head{display: flex; align-items: flex-start; justify-content: space-between; padding: 2.4rem 3.2rem; background:var(--navy); color:#fff; border-radius:2.4rem 2.4rem 0 0; position: relative;}
.modal_cont.basic .head p{margin-right: 1.5em; font-size:var(--lgTxt); font-weight: 700;}
.modal_cont.basic .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.basic .cont{overflow-y: auto; max-height: 66vh; padding:4.4rem 3.2rem; background-color: #fff;  font-size: var(--txt);}
.modal_cont.basic .cont .h3 {font-weight: 700; font-size: var(--Txt); margin-bottom: 5px;}
.modal_cont.basic .cont .sect + .sect {margin-top: 20px;}
.modal_cont.basic .cont::-webkit-scrollbar{width: 10px;}
.modal_cont.basic .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.basic .cont::-webkit-scrollbar-track{background: #f6f6f6;}
.modal_cont.basic .cont::-webkit-scrollbar-button:vertical:decrement{height: 15px;}
.modal_cont.basic .cont::-webkit-scrollbar-button:vertical:increment{height: 15px;}
.modal_cont.basic .item {display: flex}
.modal_cont.basic .item .number {margin-right: 0.3em}
.modal_cont .tit_modal { font-size:var(--txt2); font-weight:700; margin-bottom: 1.2rem; ;}
.modal_cont.basic .cont > div + .tit_modal { margin-top:3.2rem; }

.modal .member .login_wrap{padding: 8rem 6rem; background: #fff; border-radius: var(--smRadius);}
.modal .member .login_wrap .tit{font-size: var(--lgTxt2); font-weight: 700; text-align: center;}
.modal .member .login_wrap .tit + .msg2 { margin-top:2rem; }
.modal .member .login_wrap .input_wrap{margin-top: 2.5rem;}
.modal .member .login_wrap .input_wrap .inp{position: relative;}
.modal .member .login_wrap .input_wrap .inp + .msg2 { margin-bottom: 3rem; ;}
.modal .member .login_wrap .input_wrap .inp .ico{position: absolute; top: calc(50% - 1em); left: 1.2em; height: 1em; font-size: var(--smTxt);}
.modal .member .login_wrap .input_wrap .inp .ico svg{fill: #BCBFC7; transition: fill 0.25s; fill: var(--black);}
.modal .member .login_wrap .input_wrap .inp input[type="text"]:focus + .ico svg{fill: var(--black);}
.modal .member .login_wrap .input_wrap .inp input[type="password"]:focus + .ico svg{fill: var(--black);}
.modal .member .login_wrap .input_wrap .inp input { padding-left: 1em;}
.modal .member .login_wrap .input_wrap .inp .ico + input { padding-left: 2.5em;}
.modal .member .login_wrap .input_wrap input{width: 100%; height: var(--inpH); padding-left: 2.5em; margin-bottom: 1.2rem; border: 1px solid #BCBFC7; font-size: var(--subTxt); border-radius: 0.8rem; line-height: var(--inpH); transition: background 0.25s, border 0.25s;}
.modal .member .login_wrap .input_wrap input::placeholder{color: var(--black);}
.modal .member .login_wrap .input_wrap button,
.modal .member .login_wrap .input_wrap a{ display: flex; align-items: center; justify-content: center; width: 100%; height:var(--inpH); margin-top: 1em; background: var(--navy); color: #fff; font-size: var(--subTxt); font-weight: 700; text-align: center; border-radius: 0.8rem; line-height: 1em; transition: background 0.25s;}

.modal .member .login_wrap .util_wrap{display: flex; justify-content: center; margin-top: 2.4rem;}
.modal .member .login_wrap .util_wrap a{position: relative; color: #666; font-size: var(--smTxt); font-weight: 500; line-height: 1em; transition: color 0.3s;}
.modal .member .login_wrap .util_wrap a + a{padding-left: 1.2em; margin-left: 1.2em; border-left: 1px solid rgba(188, 191, 199, 0.5);}
.modal .member .login_wrap .msg { font-size:var(--tinyTxt); font-weight:500; color:#CA0B0B; }
.modal .member .login_wrap .msg svg { width:1em; height: auto; vertical-align: middle; margin:-3px 0.5rem 0 0;;}

.modal .member .login_wrap .sns-bar-box{position: relative; width:100%; margin-top: 8rem;}
.modal .member .login_wrap .sns-bar-box .sns-bar{position: absolute;top: 6px;display: block; width: 33%;border-bottom: 1px solid rgba(165,165,165,.6); }
.modal .member .login_wrap .sns-bar-box .sns-bar-left{left:0;}
.modal .member .login_wrap .sns-bar-box .sns-bar-right{right:0;}
.modal .member .login_wrap .sns-bar-box .sns-box-hd{text-align: center;font-size:var(--smTxt);line-height: 1em;color: #9A9EA7; font-weight:500;}
.modal .member .login_wrap .sns_login{display: flex; margin-top: 3rem; justify-content: center;}
.modal .member .login_wrap .sns_login a{display: flex; margin-left:1.5em; flex-direction: column; justify-content: center; text-align: center; }
.modal .member .login_wrap .sns_login a .sns-txt{margin-top:0.4em;font-size: var(--smTxt);color: #9A9EA7; font-weight:500; transition: color 0.3s ease-in-out}
.modal .member .login_wrap .sns_login a .icon{display:flex; width:50px; height:50px; align-items: center; justify-content: center; border-radius:50%; overflow:hidden; }
.modal .member .login_wrap .sns_login a .icon-sns{display:flex; width:100%; height:100%; }
.modal .member .login_wrap .sns_login a .sns-naver{background-color: #00c73c;}
.modal .member .login_wrap .sns_login a .sns-naver .icon-naver{background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAIKADAAQAAAABAAAAIAAAAACshmLzAAABIElEQVRYCWNgGAWjITAaAoM1BP7jBr+BUmbY3A0Uv4RLGzb1IDEmXBJ4xFmAcouBFnHhUUO0FDkOABmuBsS9RNuCRyG5DgAZmQEMBS88ZhMlRYkDQBbMBTpChCibcCii1AESQHNn4TCbKGFKHQCyJBAYCglE2YZFETUcADJ2EtARCljMJyhELQfwAm1aDMTMBG1EU8CIxodzgT76D+egMq4BuW+B2BZVGD+PEQiwqSAnBP4CDYoD4s/YDCRVjBwHMAA98wBoUR6plmFTT5YDQAYBHbEASK0DsSkBZDsAamk6kH4xYA4AhsIboOVJA+YAkMVAR2wHUtPJdQSlUQCztwTIuAXjkEJTxQHAUPgGtDQGiP+QYvmo2tEQGA2BQRECAL7YYewVRr/jAAAAAElFTkSuQmCC) center no-repeat; background-size: 32px 32px;}
.modal .member .login_wrap .sns_login a .sns-kakao{background-color: #ffeb3b;}
.modal .member .login_wrap .sns_login a .sns-kakao .icon-kakao{background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAIKADAAQAAAABAAAAIAAAAACshmLzAAACTklEQVRYCe1WTUsbURR9d2bQKC6SUihESEjc9C+kVRsoBfciIrgSP3Br+zdcFIQuWlxU6EZpt1ahjIkfuFAQSZBAHBMxWhpECqVQTF7PC1rwvTeZMR0olDyYDPfOOeeeufM+wlh7tDvwjztAfuun02nr+vh4iBGlQXrCGetlnD9s8ImqyJ0ht42cbSWTq7ZtX/vR9jQwkkp1fa1UXtY5n4Vg1I8oMBWD6M2jaHR+eWfnZzNOUwODicRgvVZbhEBfM5Emz4qGaU5kHCfjhnE1MBCPD6OlH9DSDjeyrzzRL4OxsUyp9FGH1xoYiMWeArwBA6aOdN8citTAeZYtl7dkLszdHeKbY6ItBVVcqAstXO8b2nfLMcXAxfn5KOc8IeGCCJNCWxZSDOCbj8ugwGKNtmIAb/84sIKSkE5bMYAJE5Z4QYYPZDHFACZgQQYFFRPRqaylGuD8QAYFGO/KWooBLJcFGRRUbBjGW1lLMbBZLu+hVSsy8K9jok8bjpOVdRQDAtDd0zODyXgog1uN8UKO1dk5reNrDXzO5S47TPMFCDkd6T45FM+HQqF+u1Co6niue71zdfUjGYksYu2a6EYKZK1ZnehNrg7e665weGw9n790wwHjPXAyzsPInDcSCKLv+F2yiBbsk5MjL47lBbh5Lk7HPwNt/YLgANu22Fg4ilZxneHaNuPxfb//hoSgZwf6Y7EIQN8apyPejjh/hWNVWU5CrJXh2QEUfy6K475GljWZKRaV3ayVwrccTwMARtDyqWyp9O6W1L63O/BfdeA3G6OjNkWwE8gAAAAASUVORK5CYII=) center no-repeat; background-size: 32px 32px;}
.modal .member .login_wrap .sns_login a .sns-face{background-color: #3a589b;}
.modal .member .login_wrap .sns_login a .sns-face .icon-face{background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAIKADAAQAAAABAAAAIAAAAACshmLzAAABFElEQVRYCWNgGAWjIUBmCPz//58RiCOB+BAQvwJidNBHjNEsxChCVwO0iREoNhuIk9HlSOUzkaoBqj4MSFNsOcgsch1QCHUI/Slg8PMC8T/0CAfy64BYAYjFoZiXJq4DGq4LxOjgCrmWkRMFbFgsu4VFjCghchxAlMHEKhpwB4DyM0EAjPB3SIpAZQd6AvsNFPuCpAbENGBkZHyEJobBJdYB/zF04hf4DpTmATrgH35l5JcDhMy9QYzlIENolQauE3IhSfLANCCGhF3RCwEgfxWSPEgtD7EWEFUZAYPzFcxAoOHICRIm/ANZDUyQGJpWUUCM3WA1ow4YDYHREBgNAaJKQrRS5SGQn44mdhuNP8odOiEAAEOuqjiSqWt+AAAAAElFTkSuQmCC) center no-repeat; background-size: 32px 32px;}
.modal .member .login_wrap .sns_login a:first-child{margin-left:0;}

.modal .modal_wrap .modal_cont.member.join{width: 60rem;}
.modal .member .join_wrap{padding: 9rem 6.4rem 6.4rem; background: #fff; border-radius: var(--smRadius);}
.modal .member .join_wrap .txt_box{margin-bottom: 5.6rem;}
.modal .member .join_wrap .txt_box .step{margin-bottom: 1em; color: var(--green); font-size: var(--tinyTxt); font-weight: 700; line-height: 1em;}
.modal .member .join_wrap .txt_box .tit{font-size: var(--lgTxt2); font-weight: 700;}
.modal .member .join_wrap .inp_wrap{margin-top: 2.4rem;}
.modal .member .join_wrap .inp_wrap .inp_tit{display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.2rem;}
.modal .member .join_wrap .inp_wrap .inp_tit p{font-size: var(--subTxt);}
.modal .member .join_wrap .inp_wrap .inp_tit a{display: flex; align-items: center; color: #9A9EA7; font-size: var(--tinyTxt); transition: color 0.25s;}
.modal .member .join_wrap .inp_wrap .inp_tit a svg{margin-left: 0.5em; fill: #9A9EA7; transition: fill 0.25s;}

.modal .member .join_wrap .inp_wrap .refer{display: block; position: relative; padding-left: 1em; margin-top: 0.8em; color: #9A9EA7; font-size: var(--tinyTxt); font-weight: 500;}
.modal .member .join_wrap .inp_wrap .refer::before{content: '※'; position: absolute; top: 0; left: 0;}
.modal .member .join_wrap .inp_wrap input{width: 100%; height: var(--inpH); padding: 0 1.2em; border: 1px solid #BCBFC7;  border-radius: 0.8rem; line-height: var(--inpH); transition: background 0.25s, border 0.25s; font-size: var(--subTxt);}
.modal .member .join_wrap .inp_wrap input.with_btn{border-radius: 0.8rem 0 0 0.8rem;}
.modal .member .join_wrap .inp_wrap input:focus{border-color: var(--black);}
.modal .member .join_wrap .inp_wrap input::placeholder{color: #BCBFC7;}
.modal .member .join_wrap .inp_wrap .inp {position: relative}
.modal .member .join_wrap .inp_wrap .inp input + .ico {position: absolute; right: 15px; top: 50%; transform: translateY(-50%); width: var(--subTxt); height: var(--subTxt) ;display: none}
.modal .member .join_wrap .inp_wrap .inp input + .ico.checked {display: block}
.modal .member .join_wrap .inp_wrap .inp input + .ico.checked.enable {display: block; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" fill="%23797355"><path d="M441 103c9.4 9.4 9.4 24.6 0 33.9L177 401c-9.4 9.4-24.6 9.4-33.9 0L7 265c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l119 119L407 103c9.4-9.4 24.6-9.4 33.9 0z"/></svg>') no-repeat center / contain}
.modal .member .join_wrap .inp_wrap .inp input + .ico.checked.unable {display: block; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><path d="M345 137c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-119 119L73 103c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9l119 119L39 375c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l119-119L311 409c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-119-119L345 137z"/></svg>') no-repeat center / contain}
.modal .member .join_wrap .inp_wrap .flex_wrap{display: flex;}
.modal .member .join_wrap .inp_wrap .flex_wrap button,
.modal .member .join_wrap .inp_wrap .flex_wrap a{flex-shrink: 0; height: var(--inpH); padding: 0 1.5em; border: 1px solid #BCBFC7; border-left: none; font-size: var(--subTxt); border-radius: 0 0.8rem 0.8rem 0; color: var(--black); transition: background 0.25s, color 0.25s;}
.modal .site_guide { padding: 4rem 2rem; border-top:1px solid var(--lineColor); text-align: center; font-size:var(--smTxt); font-weight:500; line-height: 1.5;}
.modal .site_guide .txt1 { margin-bottom: 1.2rem;;}
.modal .site_guide .txt2 { display: flex; align-items: center; justify-content: center;}
.modal .site_guide .txt2 strong { padding:0.2em 0.6em; border-radius:4rem; background-color: #E9E0D1; font-size:var(--tinyTxt); color:#AC987F; font-weight:600; margin-right:1rem;}

.modal .member .join_wrap .chk_wrap{}
.modal .member .join_wrap .chk_wrap input{}
.modal .member .join_wrap .chk_wrap input + label{display: flex; align-items: center; justify-content: center; width: 100%; height: var(--inpH); border: 1px solid #BCBFC7; color: #BCBFC7; font-size: var(--subTxt); font-weight: 600; border-radius: 0.8rem; line-height: var(--inpH); cursor: pointer; transition: border 0.25s, color 0.25s;}
.modal .member .join_wrap .chk_wrap input + label svg{margin-right: 0.5em; fill: #BCBFC7; transition: fill 0.25s;}
.modal .member .join_wrap .chk_wrap input:checked + label{border-color: var(--black); color: var(--black);}
.modal .member .join_wrap .chk_wrap input:checked + label svg{fill: var(--black);}
.modal .member .join_wrap .chk_all_wrap{display: flex; margin-top: 1.6rem;}
.modal .member .join_wrap .chk_all_wrap input{}
.modal .member .join_wrap .chk_all_wrap input + label{display: flex; padding: 0.75em 1em; margin-left: auto; border: 1px solid #9A9EA7; color: #9A9EA7; font-size: var(--tinyTxt); border-radius: 2em; line-height: 1em; cursor: pointer; transition: background 0.25s, border 0.25s, color 0.25s;}
.modal .member .join_wrap .chk_all_wrap input + label svg{margin-right: 0.5em; fill: #9A9EA7; transition: fill 0.25s;}
.modal .member .join_wrap .chk_all_wrap input:checked + label{background: var(--black); border-color: var(--black); color: #fff;}
.modal .member .join_wrap .chk_all_wrap input:checked + label svg{fill: #fff;}
.modal .modal_wrap .modal_cont.member.join_cmp{width: 50rem;}
.modal .member .join_wrap .join_complete{display: flex; flex-direction: column; align-items: center;}
.modal .member .join_wrap .join_complete .ico{display: flex; align-items: center; justify-content: center; width: 2em; height: 2em; background: #f0f0f0; font-size: 3.6rem; border-radius: 50%;}
.modal .member .join_wrap .join_complete .ico svg{fill: var(--green);}
.modal .member .join_wrap .join_complete p{margin-top: 1em; font-size: 2rem; font-weight: 700;}

.modal .member .join_wrap.find_id .tit { margin-bottom: 1em; font-weight: 600; }
.modal .member .join_wrap.find_id .chk_id { padding: 1em; border-radius: 2rem; background-color: #f6f7f9; }


/* 비밀번호체크 모달 */
.modal .modal_wrap .modal_cont.password { overflow: hidden; position: relative; width: 50rem; max-width: 100%; padding: 5rem; margin: 0 auto; background-color: #fff; border-radius: var(--radius); }
.modal .modal_wrap .modal_cont.password.mypage_type { width:60rem; }
.modal .modal_wrap .modal_cont.password .close_btn { display: flex; align-items: center; justify-content: center; position: absolute; top: 3rem; right: 3rem; width: 1em; height: 1.2em; font-size: 3rem; cursor: pointer; }
.modal .modal_wrap .modal_cont.password .close_btn svg { display: none;}
.modal .modal_wrap .modal_cont.password .tit { display: block; margin: 1.5em 0; font-size: var(--lgTxt2); font-weight: 700; text-align: center; line-height: 1em; }
.modal .modal_wrap .modal_cont.password .txt { text-align: center; font-size:var(--smTxt); font-weight:500; margin:-2rem 0 4rem;}
.modal .modal_wrap .modal_cont.password .password_reset { text-align: right; ;}
.modal .modal_wrap .modal_cont.password .password_reset a { font-size:var(--smTxt); color:var(--gray); }
.modal .modal_wrap .modal_cont.password .password_reset a svg { width:0.8em; height: auto; margin:-0.2rem 0.4rem 0 0; vertical-align: middle;;}
.modal .modal_wrap .modal_cont.password .modal_inp .inp input { width: 100%; height: var(--inpH); background-color: var(--bg); font-size: var(--txt); font-weight: 700; text-align: center; border-radius: 0.8rem; }
.modal .modal_wrap .modal_cont.password .tip { margin-top: 1.1em; }
.modal .modal_wrap .modal_cont.password .tip {display: flex; align-items: center; font-size:var(--smTxt); color:var(--gray); padding-left: 0.8em; text-indent: -0.8em;}
.modal .modal_wrap .modal_cont.password .tip .ico{width: 1em; height: 1em; margin-right: 0.3em;}
.modal .modal_wrap .modal_cont.password .tip .ico svg{display: block; width: 100%; height: 100%;}
.modal .modal_wrap .modal_cont .btn_wrap { display: flex; margin-top: 4.2rem; }
.modal .modal_wrap .modal_cont .btn_wrap > * { max-width:22rem; flex: 1; padding: 1em 0; border: 1px solid #000; font-size: var(--txt); text-align: center; border-radius: 2em; line-height: 1em; transition: background-color 0.25s, fill 0.25s, color 0.25s; background-color: #fff; color:var(--black); }
.modal .modal_wrap .modal_cont .btn_wrap > *.v2 { background: var(--blue); border-color: var(--blue); color: #fff; font-weight: 700; }
.modal .modal_wrap .modal_cont .btn_wrap > * + * { margin-left: 0.8rem; }
.modal.terms_modal .modal_cont { width:120rem; }
.modal .terms .textSec.double.bookmark { display: none;}

.scroll_wrap { max-height: 80vh; overflow: auto;}
.scroll_wrap::-webkit-scrollbar{width: 6px;}
.scroll_wrap::-webkit-scrollbar-thumb{background: #d7d7d7;   border-radius: 3px; border-top-right-radius: 8px 3px; border-bottom-right-radius: 8px 3px;}
.scroll_wrap::-webkit-scrollbar-track{background: #f6f6f6;}
.scroll_wrap::-webkit-scrollbar-button:vertical:decrement{height: 15px;}
.scroll_wrap::-webkit-scrollbar-button:vertical:increment{height: 15px;}

.modal_lost.modal_cont { width:110rem; }
.modal .tit3 { text-align: center; font-size:var(--txt2); margin:2rem 0 4rem; font-weight:600; }
.modal .tit4 { font-size:var(--subTxt); font-weight:700; margin:3rem 0 1.2rem; }
.modal .lost_wrap .tit{font-size: var(--lgTxt2); font-weight: 700; text-align: center;}
.modal .lost_wrap {padding: 8rem 6rem;background: #fff;border-radius: var(--smRadius);}
.lost_wrap .agree_box { display: flex; justify-content: center; margin-top:2rem; font-size:var(--txt);;}
.lost_wrap .doc_sect ul { margin-top:0; padding:2rem; }

/* 알랏레이어 */
.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 var(--resp_wrap_pd); 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:70rem; max-width: 100%; padding: 40px var(--modal_row_pd) 40px; margin: 0 auto; background-color: #fff; border-radius: 12px;}
.msg_layer .modal_wrap .modal_cont .cont {padding: 12rem 6rem}
.msg_layer .modal_wrap .modal_cont .cont p {font-size: var(--lgTxt2); font-weight:700; line-height: 1.5; 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.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; margin-top: 4rem; justify-content: center; }
.msg_layer .btn_wrap > * { flex: 1; max-width:20rem; padding: 1em 0; border: 1px solid #000; font-size: var(--txt); text-align: center; border-radius: 2em; line-height: 1em; transition: background-color 0.25s, fill 0.25s, color 0.25s; }
.msg_layer .btn_wrap > *.wh { background: var(--blue); border-color: var(--blue); color: #fff; font-weight: 700; }
.msg_layer .btn_wrap > * + * { margin-left:1rem; }

.msg_layer .close_btn { display: flex; align-items: center; justify-content: center; position: absolute; top: 3rem; right: 3rem; width: 1em; height: 1.2em; font-size: 3rem; cursor: pointer; }



/* DatePicker */
.ui-widget{font-size:16px;}
.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;}
.ui-datepicker-trigger { display: none; }
.ui-datepicker .ui-datepicker-header { position:relative; border-radius: 10px 10px 0 0; overflow:hidden; padding: 10px; background-color: var(--navy); border-color: var(--navy);}
.ui-datepicker table {font-size:1em; margin-bottom: 0;}
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default { background: none; border: 0; border-radius: 10px; transition:all 0.3s ease; }

.ui-state-active { background: var(--navy) !important; color: #fff; }
.ui-datepicker-today a { font-weight: 600; color: var(--navy); }
.ui-datepicker .ui-datepicker-prev { left: 2px; cursor: pointer; }
.ui-datepicker .ui-datepicker-next { right: 2px; cursor: pointer; }
.ui-datepicker td span,
.ui-datepicker td a { text-align: center; }
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span { display:none; }
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next { position:absolute; top:18px; top: 50%; margin-top: -10px;}
.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {background-color: unset; border:none;}
.ui-datepicker .ui-datepicker-prev { left:12px;}
.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;}
.ui-datepicker .ui-datepicker-next { right:12px; }
.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;}
.ui-datepicker .ui-datepicker-prev-hover { left:12px; }
.ui-datepicker .ui-datepicker-next-hover { right:12px; }
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span { position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; }
.ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; color: #fff; }
.ui-datepicker .ui-datepicker-title select { font-size:1em; margin:1px 0; }
.ui-datepicker select.ui-datepicker-month-year { width: 100%; }
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year { width: 49%; }
.ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: 400; border: 0; }
.ui-datepicker td { border: 0; padding: 1px; }
.ui-datepicker td span,
.ui-datepicker td a { display: block; padding: .4em .2em; text-align: center; text-decoration: none; }
.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; }
.ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; }
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; }
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover { color:#fff; }
.ui-datepicker table { width:100%; }

.fix_btn_box { display: none; position: fixed; font-size:var(--smTxt); color:#fff; left: 0; right:0; bottom:0; z-index:300; }
.fix_btn_box .menu_box ul { display: flex; background-color: var(--gold); padding:15px 0; box-shadow:0 0 20px 10px rgba(0, 0, 0, 0.1); }
.fix_btn_box .menu_box ul li { flex:1; }
.fix_btn_box .menu_box ul li a { display: block; text-align: center;}
.fix_btn_box .menu_box ul li a .img { margin-bottom: 5px; ;}
.fix_btn_box .menu_box ul li a .img img { width:24px; height: auto; }


/* Hover */
@media screen and (min-width: 1241px) {
    .footer .nice-select .option:hover:before { width:100%; }
    .header .inner .nav .depth1 > li > a:hover { color:var(--gold);}
    .header .inner .nav .depth1 > li:hover > .depth2 {clip-path: inset(0 0 0 0);}
    .site_map .cont .box:hover .depth1:before{opacity: 1; transform: translateY(0.5em);}
    .site_map .cls_btn:hover svg{transform: rotate(90deg);}
    .header .inner .nav .depth1 > li > .depth2 > li a:hover{color: rgba(255,255,255,1);}
    .header .inner .nav .depth1 > li > .depth2 > li a:hover:before {opacity: 1;}
    .header .right-wrap .links a:hover { background-color: #000; border-color: #000; color: #fff}
    .header .right-wrap .lang_select .nice-select .list .option:hover{background-color: #f2f2f2; font-weight: 600;}
    .footer .nice-select .option:hover { background-color: var(--gold);}
    .footer .nice-select .option:hover{background-color: var(--gold);;}
    .ui-state-default:hover { background: #f5f5f5; }
    .msg_layer .btn_wrap > *:hover{background-color: var(--black); color:#fff;}
    .modal .modal_wrap .modal_cont .btn_wrap > *:hover{background-color: var(--black); color:#fff;}
    .modal .member .login_wrap .input_wrap button:hover,
    .modal .member .login_wrap .input_wrap a:hover { background-color: var(--black); ;}
    .modal .btn_wrap a:hover{background:#000; color:#fff;}
    .footer .nice-select .option:hover:before {width: 100%}
}






/* 반응형 */
@media screen and (min-width: 2560px) {
    html {font-size: clamp(10px, 0.625vw + 4px, 12px);}
    .header > .inner{max-width: 92%;}
}


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

    html { font-size: clamp(8.5px, 0.15625vw + 5.5px, 10px); }

}


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

    html { font-size: 8.5px; }

    :root {

        --lgTxt2: max(2.1rem, 21px);
        /* --lgTxt: max(2rem, 20px); */
        --txt: max(1.7rem, 17px);

        
        --subContMt: max(6rem, 60px);
    }


    .header > .inner{max-width: 98%;}
    .header .right-wrap .lang_select .nice-select,
    .header .right-wrap .login-box,
    .header .right-wrap .lang_select .nice-select .list,
    .header .right-wrap .mypage-box,
    .header .right-wrap .member_wrap .login_tool_box .tool_box{border-width: 1.5px;}


}

@media screen and (max-width: 1800px) {
    .header{font-size: 17px;}
    .header .inner .nav .depth1 > li > a{padding: 0 1.5rem;}
}



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

    :root{
        /*--headerH: 8rem;*/
        --mainInWid: clamp(1400px, 85vw, 160rem);

        --tit: max(4.2rem, 42px);
        --tit55: max(4.0em, 40px);
        --tit50: max(3.8rem, 38px);
        --tit45: max(3.4rem, 36px);
        --tit40: max(2.9rem, 31px);
        --tit35: max(2.5rem, 26px);
        --smTit: max(2.2rem, 22px);

        --lgTxt2: max(2.0rem, 20px);
        --lgTxt: max(1.9rem, 19px);
        --txt1: max(1.8rem, 18px);
        --txt2: max(1.7rem, 17px);
        --txt: max(1.6rem, 16px);
        --subTxt: max(1.6rem, 16px);
        /*--smTxt: max(1.4rem, 14px);*/
        /*--tinyTxt: max(1.3rem, 13px);*/

        --subSectPd: 14rem;
        --subSectPd2: 18rem;
        --subContMt: max(4rem, 40px);
        --subContMt1: 14rem;
        --subContMt2: 16rem;
    }


    .modal .modal_cont { width:95rem; }
    .modal .modal_wrap .modal_cont.password { width:80rem; }

    .header > .inner{max-width: 100%;}
    /*.header .inner .nav .depth1 > li > a{padding: 0 1.5rem;}*/
    .header .right-wrap,
    .header .right-wrap .lang_select .nice-select{font-size: 14px;}

    .main-intro .navs dl dd p br {display: none}

}


@media screen and (max-width: 1440px) {
    .header{font-size: 15px;}
    .header .inner .nav .depth1 > li > a {padding: 0 1.3rem;}
    .header .right-wrap,
    .header .right-wrap .lang_select .nice-select{font-size: 13px;}

}



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

    :root {
        /*--headerH: 7rem;*/
        --mainInWid: clamp(1200px, 80vw, 140rem);

        --tit: max(4.8rem, 42px);
        --tit55: max(3.8rem, 40px);
        --tit50: max(3.4rem, 36px);
        --tit45: max(3rem, 32px);
        --tit40: max(2.6rem, 28px);
        --tit35: max(2.2rem, 24px);
        --smTit: max(2rem, 20px);

        --lgTxt2: max(1.9rem, 19px);
        --lgTxt: max(1.8rem, 18px);
        --txt1: max(1.8rem, 18px);
        --txt2: max(1.6rem, 16px);
        --txt: max(1.5rem, 15px);
        --subTxt: max(1.5rem, 15px);
        --smTxt: max(1.4rem, 14px);
        --tinyTxt: max(1.3rem, 13px);

        /*--subSectPd: 10rem;*/
        /*--subSectPd2: 12rem;*/
        --subContMt: max(3.5rem, 35px);
        /*--subContMt1: 10rem;*/
        /*--subContMt2: 12rem;*/

        --radius: 2.8rem;
        --radius3: 2rem;
    }

    .header .inner .nav{display: none;}
    .header .inner .logo{position: relative; left:0; transform: unset;}
    .header.down.open { transform: translateY(0);}


    .header .inner .right-wrap .links { display: none; }
    .header .inner .right-wrap .lang_select { display: none !important;}
    /*.header .inner .right-wrap .login-box {display: none; }*/
    .header .inner .right-wrap .member_wrap{display: none;}
    .header .right-wrap .menu .ham svg{height: 18px;}
    .header .right-wrap, .header .right-wrap .lang_select .nice-select{font-size:15px;}

    .site_map{background-color: #fff; justify-content: flex-start; overflow-y: auto;}
    .site_map .top{position: relative; display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 3rem var(--inPd); border-bottom: 1px solid var(--lineColor)}
    .site_map .top .logo{display: block; width: 200px; display: none;}

    .site_map .top .right-wrap{display: flex; height: 2.6em; justify-content: flex-end; position: relative; width:100%; }
    .site_map .top .right-wrap .lang_select .nice-select{padding:0 2.6em 0 1.2em; display: flex !important;}
    .site_map .top .right-wrap .lang_select .nice-select:after{right: 1em}
    .site_map .top .right-wrap .cls_btn{position: relative; background-color: transparent; width: 20px; height: 20px; border-radius: 0; top: 0; left: 0;}
    .site_map .top .right-wrap .cls_btn svg{width: 100%; height: 100%;}
    .site_map .top .right-wrap .nice-select { position: absolute; left: 0; top:0; margin-left: 0;}
    .site_map .btn_search { display: block;}
    .site_map .lang_select { display: block !important;}
    .header .right-wrap .btn_search svg { width:4rem; }
    .header .site_map .btn_search svg { width:5rem;}

    .site_map .member_wrap{display: block; padding: var(--inPd);}
    .site_map .member_box{display: flex; font-size:16px;}
    .site_map .member_box a{display: flex; align-items: center; justify-content: center; height: 3.3em; background:var(--bg); width: 100%; border-radius: 8px;}
    .site_map .member_box a.ico img{height: 25px; margin-right: 0.4em;}
    .site_map .member_box a.logout{margin-right: 0.3em;}
    .site_map .member_box a.mypage{margin-left: 0.3em;}

    .site_map .cont{flex-direction: column; max-width: 100%; padding: 0 var(--inPd);}
    .site_map .cont .box{border-bottom: 1px solid var(--lineColor); padding: 0;}
    .site_map .cont .box::before{display: none;}
    .site_map .cont .box .depth1{position:relative; display: flex; align-items: center; cursor: pointer; color:#1c1c1c; padding:0.8em 0; font-size:20px;}
    .site_map .cont .box .depth1:before{display: none;}
    .site_map .cont .box .depth1:after {content: "\f078";display: inline-block;position: static;width: auto;height:auto;font-size: 1em;transform: translateX(0);vertical-align: middle;line-height: 1;margin-left: auto;font-weight: 500;transition: transform .3s;opacity: 1;background-color: transparent;font-family: "Font Awesome 6 Pro";z-index: 2;}
    .site_map .cont .box .depth1:after{content:""; width: 1.2em; height: 1.2em; transform: translateX(0); background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><path d="M320.3 461.3L502.9 278.7L525.5 256.1L480.2 210.8L457.6 233.4L320.2 370.8L182.8 233.4L160.2 210.8L114.9 256.1L137.5 278.7L297.5 438.7L320.1 461.3z"/></svg>') no-repeat center / contain;}
    .site_map .cont .box .depth1 span{display: inline-block; transform: translateY(0);}
    .site_map .cont .box .depth2{display: none; padding-bottom: 2em;}
    .site_map .cont .box .depth2 li{color: #1c1c1c; font-size:18px;}
    .site_map .cont .box .depth2 li a{opacity: 0.6;}
    .site_map .cont .box .depth2 li a.active{opacity: 1}

    .site_map .links{display: block; margin-top: auto; padding: 60px var(--inPd) 2em;}
    .site_map .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 .link a .ico svg{display: block; width: 1.2em; height:1.2em;}


    .footer .in { padding:0 var(--inPd); position:relative; padding-bottom: 8rem;}
    .footer .cont_box { display: block;}
    .footer .left { display: none;}
    .footer .right { display: block;}
    .footer .calls .cs { flex:1; }
    .footer .foot { display: block;}
    .footer .foot .etc { flex-direction: column; align-items: flex-start; margin-top:5rem; }
    .footer .copy { flex-wrap: wrap; }
    .footer .foot .copy p { margin-right:2rem; }
    .footer .foot .copy p + p:before { display: none;}
    .footer .foot .etc ul li{margin-bottom: 0;}
    .footer .foot .logo span{position: absolute; bottom: 0;}
    .footer .sns > a {width:3.2em; height: 3.2em;}
    .footer .sns .btn-kakao img{height: 50%;}
    .footer .nice-select{height: 3.2em; line-height: 3.2em; padding:0 9em 0 1.5em;}
    .footer .nice-select .list{padding:1em 1.5em;}
    .site_map .cont .box .depth2 li a { margin:0.7em 0;}


    }

@media screen and (max-width: 1024px) {
    .header { transform: unset !important;}

}



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

    html { font-size: 5px; }

    :root {
        --headerH: 60px;

        --tit: 30px;
        --tit55: 28px;
        --tit50: 26px;
        --tit45: 24px;
        --tit40: 22px;
        --tit35: 20px;
        --smTit: 18px;

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

        --subSectPd: 80px;
        --subSectPd2: 100px;
        --subContMt: 30px;
        --subContMt1: 80px;
        --subContMt2: 100px;

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


    .mo_over { display: none !important; }
    .mo_only { display: block !important; }
    .tb_only { display: block !important; }

    
    .footer .fix-top { display: none;}
    .footer .calls .cs{height: 18rem;}
    .footer .calls .cs strong{font-size:24px;}
    .lost_wrap .doc_sect ul { padding-left:0; padding-right:0;}
    .modal .lost_wrap .tit { font-size:18px; }
    .modal .modal_wrap .close_btn,
    .modal .modal_wrap .modal_cont.password .close_btn { font-size:4rem;   }
    .fix_btn_box { display: block;}
    .footer .foot .logo span { bottom:55px; }
    .footer .foot { padding-bottom: 9rem;;}
    .header.open { z-index:500;}
    .modal .tblArea table,
    .modal .com_tbl table { font-size:var(--smTxt);}

}



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

        --tit: 26px;
        --tit55: 25px;
        --tit50: 24px;
        --tit45: 22px;
        --tit40: 20px;
        --tit35: 18px;
        --smTit: 16px;

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

        --subSectPd: 50px;
        --subSectPd2: 60px;
        --subContMt: 20px;
        --subContMt1: 50px;
        --subContMt2: 60px;

        --radius: 15px;
        --radius3: 10px;

    }

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

    .site_map .cont .box .depth1,
    .site_map .link a{font-size:18px;}
    .site_map .cont .box .depth2 li,
    .site_map .link a{font-size:16px;}
    .site_map .member_box{font-size: 15px;}

    .footer .foot .etc ul{overflow-x:auto; flex-wrap: nowrap; width: calc(100% + var(--inPd) * 2);margin-left: calc(var(--inPd) * -1);padding: 0 var(--inPd); flex-wrap: wrap;overflow: visible;}
    .footer .foot .etc ul::-webkit-scrollbar{display: none;}
    .footer .foot .etc ul li{margin-right: 0;}
    .footer .foot .etc ul li{ flex-shrink: 0; margin-right:15px; margin-bottom: 10px;}
    .footer .foot .etc ul li:nth-child(4):before { content: '';  flex-basis: 100%;}
    .footer .foot .copy{font-size:var(--txt);}
    .footer .calls .cs strong{font-size:20px;}
    .footer .calls .cs p{margin-bottom: 5px;}
    .footer .foot{padding-top: 6rem;}
    .modal .modal_wrap .modal_cont.password .tit,
    .modal .member .login_wrap .tit,
    .modal .find_box1 .tit  { font-size:18px;}
    .modal .member .login_wrap .util_wrap { margin-top:3.5rem; }
    .modal .member .login_wrap .util_wrap a { font-size:var(--txt);}
    .modal .find_box1 .btns a { font-size:var(--txt); }
    .modal .lost_wrap { padding-left: 15px; padding-right:15px;;}
    .modal .lost_wrap .com_tbl table tr > * { padding-left: 2px; padding-right:2px;;}
}