@charset "utf-8";

@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');


.page_wrap { display: flex; flex-direction: column; min-height: 100svh;} /*min-height: calc(var(--vh, 1vh) * 100);*/
.page_wrap .container,
.main.page_container { flex: 1;}


:root {

    --hdH: 8rem;
    --hdIn:6rem;
    --fullInPd: 10rem;

    --inPd: 20px;
    --inpH: max(6rem, 50px);

    --inM: max(184rem, 1640px);
    --in:  max(164rem, 1440px);
    --in2: max(144rem, 1240px);
    --in3: max(124rem, 1080px);
    --in4: max(104rem, 940px);
    --in5: max(94rem, 840px);

    --gray5: #F5F7FA;
    --gray10: #E4E7EB;
    --gray20: #CBD2D9;
    --gray30: #9AA5B1;
    --gray40: #7B8794;
    --gray50: #616E7C;
    --gray60: #52606D;
    --gray70: #3E4C59;
    --gray80: #323F4B;
    --gray90: #1F2933;
    
    --bg:#F4F6F8;
    --grayBg1:#F4F5F6;
    --grayBg2:#F5F7FA;
    --grayBg3:#EFF4FE;

    --line: #CCCCCC; 

    --d1:10rem; 
    --h1:6rem; 
    --h2:5.4rem; 
    --h3:4.5rem; 
    --h4:4rem; 
    --h5:3.5rem; 
    --h6:max(3rem,26px);; 
    --h7:max(2.8rem,24px); 
    --h8:max(2.5rem,22px); 

    --p1:max(2.2rem,20px); 
    --p2:max(2rem,18px);
    --p3:max(1.8rem,16px);  /* 본문 */
    --p4:max(1.6rem,15px);
    --p5:max(1.5rem,14px);
    --p6:max(1.4rem,13px);
    --p7:max(1.3rem,12px);
    --p8:max(1.2rem,11px);

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

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

    --point01: #243ACA; 
    --point02 : #192EB4; 
    --point03 : #061A97; 
    --black:#1c1c1c; 

	--fixSideMenuW1:11.5rem;
	--fixSideMenuW2:36rem;

   
}

.wow {visibility: hidden}
html.scroll_none { overflow: hidden; }

/* common */
.in_f { position:relative; width:100%; max-width:100%; margin:0 auto; }
.in_w { position:relative; width:100%; max-width:100%; padding:0 var(--inPd); margin:0 auto; }
.in_m { position:relative; width:var(--inM); max-width:100%; padding:0 var(--inPd); margin:0 auto;}
.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; }
.in3  { position:relative; width:var(--in3); max-width:100%; padding:0 var(--inPd); margin:0 auto; }
.in4  { position:relative; width:var(--in4); max-width:100%; padding:0 var(--inPd); margin:0 auto; }
.in5  { position:relative; width:var(--in5); max-width:100%; padding:0 var(--inPd); margin:0 auto; }

.hidden { display:block; height: 0; width: 0; font-size: 0; line-height: 0; margin: 0; padding: 0; overflow:hidden; border: none; }
.clearfix::after{content: ''; display: block; clear: both;}

.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;}
.pc_only { display:block;}
.mo_only { display:none !important }
.phone_only { display:none !important;}
.mini_only {display: none !important; }
.lap_only{display: none !important;}

.swiper-wrapper.disabled { transform: translate3d(0px, 0, 0) !important; }
.swiper-pagination.disabled, .swiper-button-prev.disabled, .swiper-button-next.disabled, .swiper-button-pause.disabled { display: none; }
.swiper-button-next, .swiper-button-prev { outline:none; }

body .nice-select {font-size: var(--p3); border-radius: 0;}
body .nice-select:after { right: 1.5rem; width: 0.8em;; height: 0.7em; margin-top: -0.3em; font-size: 1em; border: 0; transform: rotate(0deg); transform-origin: center; transition: transform 0.3s; border: none; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="13" height="8" viewBox="0 0 13 8" fill="none"><path d="M11.4143 1.41406L6.41431 6.41406L1.41431 1.41406" stroke="black" stroke-width="2" stroke-linecap="square"/></svg>') no-repeat center / contain;}
body .nice-select.open:after { transform: rotate(180deg); }
body .nice-select .list {min-width: 100%; box-shadow: 0 0 0 1px var(--gray10); top: calc(100% + 2px); background-color: #fff; border-radius: 1rem; max-height: 250px; overflow-y: auto;} 
body .nice-select .list .option {height: 3em; line-height: 3em; min-height: 0; padding: 0 10px; position: relative;}
/* body .nice-select .list::-webkit-scrollbar{display: inherit; width: 10px;}
body .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;}
body .nice-select .list::-webkit-scrollbar-track{background: #fff;}
body .nice-select .list::-webkit-scrollbar-button:vertical:decrement{height: 5px;}
body .nice-select .list::-webkit-scrollbar-button:vertical:increment{height: 5px;} */
body .nice-select .list::-webkit-scrollbar { display: inherit; width: 7px; }
body .nice-select .list::-webkit-scrollbar-thumb { background: #b8b8b8; border-right: 4px solid #fff; border-radius: 3px; border-top-right-radius: 10px 3px; border-bottom-right-radius: 10px 3px; }
body .nice-select .list::-webkit-scrollbar-track { background: #fff; margin-block: 5px;}

input[type="checkbox"].round { position: absolute; height: 1px; width: 1px; overflow: hidden; clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px) }
input[type="checkbox"].round + label:before { display: none; }
input[type="checkbox"].round + label { display: inline-block; height: 23px; line-height: 22px; padding: 0 10px; font-size: 13px; border: 1px solid var(--blue); border-radius: 2em; color: var(--blue); cursor: pointer }
input[type="checkbox"].round:checked + label { background-color: var(--blue); color: #fff; }

.dot_list li{position: relative; padding-left: 0.5em;}
.dot_list li:before{content: '·'; position: absolute; left: 0;}


.main .page_container,
.page_wrap .container {padding-top: var(--hdH); padding-left: var(--fixSideMenuW1); transition: padding-left 0.5s ease-in-out 0s;}
.main .page_wrap.header_on .page_container,
.page_wrap.header_on .container {transition: padding-left 0.6s ease-in-out 0.1s;}

.main .page_wrap.header_on .page_container,
.page_wrap.header_on .container,
.page_wrap.header_on .header {padding-left: var(--fixSideMenuW2);}


/* ---------- header ---------- */
.header {position:fixed; top: 0; width: 100%; z-index: 100; padding-left: var(--fixSideMenuW1); border-bottom: 1px solid #CFCFCF; transition: padding-left 0.5s ease-in-out 0s;} 
.header_on .header {transition: padding-left 0.6s ease-in-out 0.1s;} 


.header .header_in {padding: 0 var(--hdIn); height: var(--hdH); display: flex; align-items: center; background-color: #fff;}
.header .nav {margin-right: 10rem;}
.header .nav .list {display: flex; align-items: center; gap: 7rem;}
.header .nav .list .depth1 {position: relative; height: var(--hdH); }
.header .nav .list .depth1 > a {display: flex; align-items: center; height: 100%; font-size: var(--p3); font-weight: 700; line-height: 1.5; text-align: center; }
.header .nav .list .depth1 .depth2 {font-size: var(--p4); opacity: 0; pointer-events: none; transition: opacity 0.3s ease;}
.header .nav .list .depth1:hover .depth2{opacity: 1; pointer-events: inherit;}
.header .nav .list .depth1 .depth2{ position: absolute; text-align: center; top: 100%; left: 50%; transform: translateX(-50%); width: 16rem; padding: 3.5rem 1rem; margin-top:-2px; border-top: 2px solid #142387; background-color: #fff; box-shadow: 0 5px 20px 0 rgba(20, 35, 135, 0.15);}
.header .nav .list .depth1 .depth2 li{color: var(--gray70); font-weight: 500; transition: color 0.3s ease;}
.header .nav .list .depth1 .depth2 li.active{color: var(--point02);}
.header .nav .list .depth1 .depth2 li:hover{color: var(--point02);}
.header .nav .list .depth1 .depth2 li + li{margin-top: 1.5rem;}

.header .util_wrap {margin-left: auto; display: flex; align-items: center;} 
.header .util_wrap .btn_wrap{display: flex; align-items: center;}
.header .util_wrap .txt_btn{font-size: var(--p6); margin-left: 1.5rem; height: auto; font-weight: 500; background-color: #fff; border: 1px solid var(--black); padding: 0.6em 1.3em; white-space: nowrap; border-radius: 99rem;}
.header .util_wrap .txt_btn.login{background-color: var(--point02); border-color: var(--point02); color: #fff;}

.header .util_wrap .btn_wrap > .txt_btn + .txt_btn {margin-left: 1.5rem;}

.header .util_wrap .ico_btn {display: flex; height:max(1.5em, 24px); margin-left: 2.5rem;}
.header .util_wrap .ico_btn.global {display: flex; margin-left: 0;} /*height: max(1.3em, 20px);*/
.header .util_wrap .ico_btn svg{display: block; width: auto; height: 100%;}
.header .util_wrap .ico_btn.bell{position: relative;}
.header .util_wrap .ico_btn.bell .new:before {content: ''; position: absolute; right: -1px;  top: -2px; width: 7px; height: 7px; background-color: #D20E0E; border:2px solid #fff; box-sizing: content-box; border-radius: 50%;}

.header .util_wrap .ham_btn svg{display: block; width: auto; height:max(1.5em, 24px);}
.site_map .top .close_btn svg{display:block; width: max(1.5em, 24px); height:max(1.5em, 24px); }

.header .util_wrap .lang_select{position: relative; display: flex; align-items: center; }
.header .util_wrap .lang_select .lang_list{position: absolute; right: 50%; top: calc(100% + 1.5rem); min-width: 7rem; padding: 0.5rem 0; border-radius: 0.8rem; background-color: #fff; border: 1px solid var(--gray10); opacity: 0; pointer-events: none; transform: translate(50%, 0.8rem); transition: opacity 0.2s ease, transform 0.2s ease; z-index: 20;}
/* .header .util_wrap .lang_select:hover .lang_list, */
.header .util_wrap .lang_select:focus-within .lang_list,
.header .util_wrap .lang_select.active .lang_list{opacity: 1; pointer-events: auto; transform: translate(50%, 0);}
.header .util_wrap .lang_select .lang_list a{display: block; padding: 1rem 1.5rem; color: var(--gray70); font-size: var(--p7); font-weight: 600; line-height: 1.2; white-space: nowrap;}
.header .util_wrap .lang_select .lang_list a:hover,
.header .util_wrap .lang_select .lang_list a.active{color: var(--point02); }

/* 로그인 후 */
.header .util_wrap .login {position: relative;}
.header .util_wrap .login .login_nav {position: absolute; right: 50%; top: calc(100% + 1.5rem); transform: translate(50%, 0.8rem); font-size: var(--p7); white-space: nowrap; background-color: #fff; border: 1px solid var(--gray10); padding: 1.5rem; border-radius: 0.8rem; z-index: 5; opacity:0; transition: opacity 0.2s ease, transform 0.2s ease; pointer-events: none; }
/* .header .util_wrap .login:hover .login_nav, */
.header .util_wrap .login .login_nav.active {opacity: 1; pointer-events: auto; transform: translate(50%, 0);}
.header .util_wrap .login .login_nav li + li {margin-top: max(0.4em, 8px)}
.header .util_wrap .login .login_nav a {display: flex; align-items: center;  font-weight: 500; margin-right: 0;}
.header .util_wrap .login .login_nav a .login_nav_ico {width: 1em; height: 1em; margin-right: 0.6em; transform: translateY(-1px)}
.header .util_wrap .login .login_nav a .login_nav_ico svg {display: block; width: 100%; height: 100%;}

.header .util_wrap .bell {position: relative;}
/* .header .util_wrap .bell .tooltip{position: absolute; right: 0; top: calc(100% + 1.5rem); transform: translate(0, 0.8rem); font-size: var(--p7); white-space: nowrap; background-color: #fff; border: 1px solid var(--gray10); padding: 1.5rem; border-radius: 0.8rem; z-index: 5; opacity:0; transition: opacity 0.2s ease, transform 0.2s ease; pointer-events: none; }
.header .util_wrap .bell:hover .tooltip{ opacity: 1; pointer-events: auto; transform: translate(0, 0); }
.header .util_wrap .bell:hover .tooltip .num{display: inline-flex; font-size: 0.8em; line-height: 1; margin-left: 0.3em; padding: 0 0.2em; align-items: center; justify-content: center; min-width: 1.5em; height: 1.5em; background-color: #101010; border-radius: 99rem; color: #fff;} */

.header .util_wrap .noti_panel{position: absolute; border-radius: 1.5rem; padding: 2rem 1rem 0 2rem; width: 37rem; right: 0; top: calc(100% + 1.5rem); transform: translate(0, 0.8rem); background-color: var(--black); color: #fff; opacity: 0; pointer-events: none; transition: opacity 0.2s ease, transform 0.2s ease; z-index: 20;} 
.header .util_wrap .bell.active .noti_panel{opacity: 1; pointer-events: auto; transform: translate(0, 0);}
.header .util_wrap .noti_panel .noti_box{display: flex; justify-content: space-between; gap: 2rem; padding-bottom: 2rem; padding-right: 1rem;}
.header .util_wrap .noti_panel .noti_box .tit_box{display: flex; align-items: center; font-weight: 500; font-size: var(--p5); text-align: left; }
.header .util_wrap .noti_panel .noti_box .tit_box .num{display: inline-flex; font-size: 10px; margin-left: 0.5em; padding: 0 0.2em; align-items: center; justify-content: center; min-width: 1.5em; height: 1.5em; background-color: #fff; border-radius: 99rem; color: #101010;}
.header .util_wrap .noti_panel .noti_box .cls_btn svg{display: block; width: 1.2em; height: 1.2em;}
.header .util_wrap .noti_panel .noti_box .tit_box .arr{margin-left: 0.5em; transition: transform 0.2s ease;}
.header .util_wrap .noti_panel .noti_box .tit_box.active .arr{transform: rotate(180deg);}
.header .util_wrap .noti_panel .noti_box .tit_box .arr svg{width: 0.9em; height: 1em; object-fit: cover;}

.header .util_wrap .noti_panel.non_alarm{ padding: 1.5rem; width: max-content !important; max-width: calc(100vw - 2rem); white-space: nowrap;}
.header .util_wrap .noti_panel.non_alarm .noti_box{padding: 0;}

.header .util_wrap .noti_panel .list_box{display: none; padding-top: 1rem; padding-bottom: 1.5rem; font-size: var(--p6); border-top: 1px solid rgba(255,255,255,0.3);}
.header .util_wrap .noti_panel .list_box .item .link{display: flex; align-items: center; justify-content: space-between; gap: 3rem; padding: 8px 0; }
.header .util_wrap .noti_panel .list_box .item .link .txt{flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.header .util_wrap .noti_panel .list_box .item .link .time{font-size: 0.8em; color: #FFF82A;}
.header .util_wrap .noti_panel .list_box{max-height: 150px; padding-right: 1rem; overflow-x: auto; }
.header .util_wrap .noti_panel .list_box::-webkit-scrollbar { display: inherit; width: 8px; }
.header .util_wrap .noti_panel .list_box::-webkit-scrollbar-thumb { background: #b8b8b8; border-right: 5px solid var(--black); border-radius: 3px; border-top-right-radius: 8px 3px; border-bottom-right-radius: 8px 3px; }
.header .util_wrap .noti_panel .list_box::-webkit-scrollbar-track { background: var(--black); margin-block: 15px;}
/* .header .util_wrap .noti_panel .list_box::-webkit-scrollbar {-webkit-appearance: none;}
.header .util_wrap .noti_panel .list_box::-webkit-scrollbar:vertical {width: 5px;}
.header .util_wrap .noti_panel .list_box::-webkit-scrollbar:horizontal {height: 5px;}
.header .util_wrap .noti_panel .list_box::-webkit-scrollbar-thumb {background-color: rgba(255, 255, 255, .2);border-radius: 5px;}
.header .util_wrap .noti_panel .list_box::-webkit-scrollbar-track {border-radius: 10px;background-color:transparent} */

/* ---------- SideBar ---------- */
.fixed_side_menu {position: fixed; width: var(--fixSideMenuW1); height: 100vh; padding-bottom: 4rem; left: 0; top: 0; z-index: 101; background: linear-gradient(180deg, #122189 0%, #192EB4 100%); transition : transform 0.5s ease-in-out, width 0.5s ease-in-out;}
.fixed_side_menu.on {width: var(--fixSideMenuW2); }
.fixed_side_menu.on .side_off{opacity: 0; pointer-events: none;}
.fixed_side_menu.on .side_on{opacity: 1; pointer-events: inherit;}

.fixed_side_menu .side_clip {position: relative; width: 100%; height: 100%; overflow: hidden;}

.fixed_side_menu .folding_btn {position: absolute; right: 0; top: 50%; transform: translate(98%,-50%); background: linear-gradient(0deg, #16289F 0%, #16289F 100%), #1628A2; width: 3.5rem; height: 6.2rem; display: flex; align-items: center; justify-content: center; border-radius: 0 0.5rem 0.5rem 0;}
.fixed_side_menu .folding_btn svg {width: 35%; height: auto; transform: scaleX(-1); transition: transform 0.5s ease;}
.fixed_side_menu.on .folding_btn svg { 	transform: scaleX(1);}


/* 사이드바 비활성화 */
.fixed_side_menu .side_off { width: var(--fixSideMenuW1); height: 100%; display: flex; flex-direction: column; opacity: 1; pointer-events: inherit; transition: opacity 0.3s ease-in-out;}
.fixed_side_menu .side_off .logo {width: 5rem; height: var(--hdH); display: flex; align-items: center; margin-left: 3rem;}
.fixed_side_menu .side_off .logo a {display: block; width: 100%;}
.fixed_side_menu .side_off .logo a img {width: 100%;}
.fixed_side_menu .side_off .top_btn_box {margin: 1rem 3rem 0; }
.fixed_side_menu .side_off .top_btn_box .chat_btn {text-align: center; display: flex; flex-direction: column; align-items: center; width: 5rem;} 
.fixed_side_menu .side_off .top_btn_box .chat_btn + .chat_btn  {margin-top: 4rem;}
.fixed_side_menu .side_off .top_btn_box .chat_btn .ico {width: 100%; height: 5rem; border-radius: 1rem; display: flex; align-items: center; justify-content: center;}
.fixed_side_menu .side_off .top_btn_box .chat_btn.new_chat .ico {background: linear-gradient(315deg, #1921BC 0%, #0089EB 100%);}
.fixed_side_menu .side_off .top_btn_box .chat_btn.new_chat .ico img{width: 85%;}
.fixed_side_menu .side_off .top_btn_box .chat_btn.history_chat .ico {background-color: #243ACA;}
.fixed_side_menu .side_off .top_btn_box .chat_btn.new_chat .ico svg {width: 46%; height: auto;}
.fixed_side_menu .side_off .top_btn_box .chat_btn.history_chat .ico svg {width: 51%; height: auto;}
.fixed_side_menu .side_off .top_btn_box .chat_btn .txt {font-size: var(--p5); font-weight: 500; margin-top: 1rem; color: #fff; white-space: nowrap;}

.fixed_side_menu .side_off .bot_btn_box {margin-top: auto;}
.fixed_side_menu .side_off .bot_btn_box .btn {display: flex; align-items: center; justify-content: center; flex-direction: column;}
.fixed_side_menu .side_off .bot_btn_box .btn + .btn {margin-top: 4rem;}
.fixed_side_menu .side_off .bot_btn_box .btn svg {width: 3rem; height: auto;}
.fixed_side_menu .side_off .bot_btn_box .btn .txt {font-size: var(--p6); font-weight: 500; margin-top: 1rem; color: #fff; text-align: center;}


/* 사이드바 활성화 */
.fixed_side_menu .side_on{position: absolute; top:0; left:0; width: var(--fixSideMenuW2); display: flex; flex-direction: column; height: 100%; opacity: 0; pointer-events: none; transition: opacity 0.3s ease-in-out;}
.fixed_side_menu .side_on .logo {height: var(--hdH); display: flex; align-items: center; padding: 0 3rem;}
.fixed_side_menu .side_on .service_box > *:not(.scroll_box) { padding: 0 3rem;}
.fixed_side_menu .side_on .service_box > *.scroll_box { padding-left: 3rem; padding-right: 1.5rem; margin-right: 1.5rem;}

.fixed_side_menu .side_on .logo a {display: block; width: 15rem }
.fixed_side_menu .side_on .logo img {width: 100%;}
.fixed_side_menu .side_on .service_box {margin-top: 1rem; flex: 1; display: flex; flex-direction: column; overflow-y:auto;}
.fixed_side_menu .side_on .service_box::-webkit-scrollbar{display: none;}
.fixed_side_menu .side_on .service_box .cont_top {display: none;}
.fixed_side_menu .side_on .service_box .cont_top .tit_box {display: flex; align-items: center;}
.fixed_side_menu .side_on .service_box .cont_top .tit_box .ico {flex-shrink: 0; display: flex; align-items: center; justify-content: center; width: 5rem; height: 5rem; border-radius: 1rem; background: linear-gradient(315deg, #1921BC 0%, #0089EB 100%);}
.fixed_side_menu .side_on .service_box .cont_top .tit_box .ico img {width: 85%;}
.fixed_side_menu .side_on .service_box .cont_top .tit_box .tit {display: flex; align-items: center; font-size: var(--p1); font-weight: 700; color: #fff; margin-left: 1.5rem; line-height: 1.4;}
.fixed_side_menu .side_on .service_box .cont_top .txt {display: none; font-size: var(--p6); color: #fff; opacity: 0.6; margin-top: 1rem;}

.fixed_side_menu .side_on .service_box .new_chat_btn_box {margin-top: 0; width: 100%; margin-bottom: 3rem;}
.fixed_side_menu .side_on .service_box .new_chat_btn_box .new_chat_btn {background-color: #fff; display: flex; align-items: center; padding: 1em 1.2em; font-size: var(--p4); font-weight: 700; border-radius: 1rem; width: 100%;}
.fixed_side_menu .side_on .service_box .new_chat_btn_box .new_chat_btn svg {width: var(--p3); height: auto; margin-right: 0.5em;}

.fixed_side_menu .side_on .service_box .new_chat_btn_box .non_login {border-radius: 1rem;border: 1px solid rgba(255, 255, 255, 0.15);background: var(--SM_2, #061A97); margin-top: 1rem; padding: 1em 1.2em; font-size: var(--p6); }
.fixed_side_menu .side_on .service_box .new_chat_btn_box .non_login .txt {color: rgba(255, 255, 255, 0.8);}
.fixed_side_menu .side_on .service_box .new_chat_btn_box .non_login .login_btn {width: 100%; background-color:var(--point01); color: #fff; font-weight: 500; font-size: var(--p6); height: 2.8em; margin-top: 1rem; border-radius: 1rem; transition: background-color 0.3s ease;}

.fixed_side_menu .side_on .scroll_box {overflow-y: auto; flex: 1; min-height: 0; display: flex; flex-direction: column; contain: size; margin-right: 1.5rem; margin-bottom: 4rem;}
.fixed_side_menu .side_on .scroll_box{ margin-right: 0;}
.fixed_side_menu .side_on .scroll_box::-webkit-scrollbar {-webkit-appearance: none;}
.fixed_side_menu .side_on .scroll_box::-webkit-scrollbar:vertical {width: 5px;}
.fixed_side_menu .side_on .scroll_box::-webkit-scrollbar:horizontal {height: 5px;}
.fixed_side_menu .side_on .scroll_box::-webkit-scrollbar-thumb {background-color: rgba(255, 255, 255, .2);border-radius: 5px;}
.fixed_side_menu .side_on .scroll_box::-webkit-scrollbar-track {border-radius: 10px;background-color:transparent}

.fixed_side_menu .side_on .service_box .inq_box {margin-top: auto; }
.fixed_side_menu .side_on .chat_list_tit {display: flex; align-items: center; justify-content: space-between; gap: 0.6rem; margin-bottom: 1rem;}
.fixed_side_menu .side_on .chat_list_tit .cont_tit {margin-bottom: 0;}
.fixed_side_menu .side_on .cont_tit {display: flex; align-items: center; gap: 1rem; font-size: var(--p4); font-weight: 500; color: #fff; margin-bottom: 1rem;}
.fixed_side_menu .side_on .open_btn {flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;}
.fixed_side_menu .side_on .open_btn svg{display:block; transition: transform 0.3s ease;}
.fixed_side_menu .side_on .chat_list .cont.is_folded .open_btn svg{transform: rotate(180deg);}
/* 
.fixed_side_menu .side_on .chat_list_tit .more_btn{display: flex; align-items: center; flex-shrink: 0; max-width: 2.6em; overflow: hidden; color: #fff; padding: 0.8em; font-size: var(--p8); border-radius: 99rem; transition: max-width 0.35s ease, padding 0.35s ease, background-color 0.3s ease;}
.fixed_side_menu .side_on .chat_list_tit .more_btn .ico{display: flex; align-items: center; justify-content: center; flex-shrink: 0;}
.fixed_side_menu .side_on .chat_list_tit .more_btn svg{display: block; height: 0.9em; width: auto;}
.fixed_side_menu .side_on .chat_list_tit .more_btn .txt{max-width: 0; margin-left: 0; overflow: hidden; white-space: nowrap; opacity: 0; line-height: 1; transition: max-width 0.6s ease, margin-left 0.6s ease, opacity 0.25s ease;}
.fixed_side_menu .side_on .chat_list_tit .more_btn:hover,
.fixed_side_menu .side_on .chat_list_tit .more_btn:focus-visible{max-width: 12em; padding: 0.8em 1em; background-color: #243ACA;}
.fixed_side_menu .side_on .chat_list_tit .more_btn:hover .txt,
.fixed_side_menu .side_on .chat_list_tit .more_btn:focus-visible .txt{max-width: 8em; margin-left: 0.4em; opacity: 1;} */
.fixed_side_menu .side_on .chat_list_tit .more_btn{display: flex; align-items: center; justify-content: center; flex-shrink: 0; transform: rotate(0); overflow: hidden; color: #fff; font-size: var(--p8); border-radius: 99rem; transition: 0.4s;}
.fixed_side_menu .side_on .chat_list_tit .more_btn .ico{display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 1.3em; height: 1.3em;}
.fixed_side_menu .side_on .chat_list_tit .more_btn .txt{display:none}
.fixed_side_menu .side_on .chat_list_tit .more_btn svg{display: block; height:100%; width: auto;}
.fixed_side_menu .side_on .chat_list_tit .more_btn:hover{transform: rotate(180deg);}

.fixed_side_menu .side_on .chat_list {margin-top: 3rem; margin-top: 0;}
.fixed_side_menu .side_on .chat_list .cont + .cont {padding-top: 2rem; margin-top: 2rem; border-top: 1px solid rgba(255, 255, 255, 0.2);}
/* .fixed_side_menu .side_on .chat_list .cont .list li {display: flex; align-items: center; position: relative; transition: background 0.3s ease-in-out; padding: var(--p6); border-radius: 0.5em;}
.fixed_side_menu .side_on .chat_list .cont .list li:hover {background-color: var(--point01); color: #fff;} */
.fixed_side_menu .side_on .chat_list .cont .list li {display: flex; align-items: center; position: relative; transition: background 0.3s ease-in-out; padding: 0.5em 0;}
.fixed_side_menu .side_on .chat_list .cont .list li .tit { flex: 1; font-size: var(--p5); color: rgba(255,255,255,0.4); padding-right: 0.5em; overflow: hidden;text-overflow: ellipsis;white-space: nowrap; transition: color 0.3s ease-in-out;}
.fixed_side_menu .side_on .chat_list .cont .list li .dot_btn {margin-left: auto; width: 1em; height: 1em; margin-left: auto; transition: opacity 0.3s ease-in-out; opacity: 0;}
.fixed_side_menu .side_on .chat_list .cont .list li .dot_btn svg {height: 100%; width: auto;}
.fixed_side_menu .side_on .chat_list .cont .list li .dot_btn.ai_chat_active{opacity: 1;}
/* .fixed_side_menu .side_on .chat_list .cont .list li:hover {background-color: var(--point01); color: #fff;} */
.fixed_side_menu .side_on .chat_list .cont .list li:hover { color: #fff;}
.fixed_side_menu .side_on .chat_list .cont .list li:hover .tit {color: #fff;}
.fixed_side_menu .side_on .chat_list .cont .list li:hover .dot_btn {opacity: 1;}
/* .fixed_side_menu .side_on .chat_list .cont .list li.ai_chat_active {background-color: var(--point01);} */
.fixed_side_menu .side_on .chat_list .cont .list li.ai_chat_active .tit {color: #fff;}
.fixed_side_menu .side_on .chat_list .cont .list li.ai_chat_empty .tit {color: rgba(255,255,255,0.45); padding-right: 0;}
.fixed_side_menu .side_on .chat_list .cont .list li.ai_chat_empty:hover {background-color: transparent;}
.fixed_side_menu .side_on .chat_list .cont .list li .modify_box {position: absolute; right: 0; top: 90%; opacity: 0; background-color: #fff; border-radius: 1rem; border: 1px solid var(--gray20); font-size: 12px; padding: 1.25em; display: flex; flex-direction: column; font-weight: 500; transition: opacity 0.3s ease-in-out; pointer-events: none; z-index: 9;}
.fixed_side_menu .side_on .chat_list .cont .list.modify_top_last_items li:nth-last-child(-n+2) .modify_box,
.fixed_side_menu .side_on .chat_list .cont .list li .modify_box.is_top {top: auto; bottom: 90%;}
.fixed_side_menu .side_on .chat_list .cont .list li .modify_box .btn {display: flex; align-items: center;}
.fixed_side_menu .side_on .chat_list .cont .list li .modify_box .btn + .btn {margin-top: 10px;}
.fixed_side_menu .side_on .chat_list .cont .list li .modify_box .btn.name::before {content: ""; width: 1em; height: 1em; margin-right: 5px; background: url('data:image/svg+xml,<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.66116 1.32411C8.49337 0.491898 9.8431 0.491898 10.6753 1.32411C11.5074 2.15626 11.5073 3.50557 10.6753 4.33778C10.6733 4.3398 10.671 4.34214 10.669 4.34413L4.5469 10.2597C4.48948 10.3151 4.41927 10.3559 4.3428 10.3788L1.3428 11.2792C1.16668 11.332 0.975753 11.2837 0.845728 11.1537C0.715718 11.0237 0.667493 10.8328 0.72024 10.6566L1.62014 7.65663L1.64065 7.60048C1.66444 7.54581 1.69812 7.49563 1.73977 7.45253L7.6553 1.33046L7.66116 1.32411ZM1.94485 10.0541L3.66018 9.53944L2.41848 8.47499L1.94485 10.0541ZM9.9678 2.03114C9.52616 1.58972 8.81032 1.58972 8.36868 2.03114L2.9634 7.62489L4.4844 8.9286L9.9678 3.63075C10.4095 3.18906 10.4095 2.47283 9.9678 2.03114Z" fill="%231F2933"/></svg>') no-repeat center / contain;}
.fixed_side_menu .side_on .chat_list .cont .list li .modify_box .btn.delete::before {content: ""; width: 1em; height: 1em; margin-right: 5px; background: url('data:image/svg+xml,<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.5 10C2.5 10.2652 2.60536 10.5196 2.79289 10.7071C2.98043 10.8946 3.23478 11 3.5 11H8.5C8.76522 11 9.01957 10.8946 9.20711 10.7071C9.39464 10.5196 9.5 10.2652 9.5 10V4H10.5V3H8.5V2C8.5 1.73478 8.39464 1.48043 8.20711 1.29289C8.01957 1.10536 7.76522 1 7.5 1H4.5C4.23478 1 3.98043 1.10536 3.79289 1.29289C3.60536 1.48043 3.5 1.73478 3.5 2V3H1.5V4H2.5V10ZM4.5 2H7.5V3H4.5V2ZM4 4H8.5V10H3.5V4H4Z" fill="%23D20E0E"/><path d="M4.5 5H5.5V9H4.5V5ZM6.5 5H7.5V9H6.5V5Z" fill="%23D20E0E"/></svg>') no-repeat center / contain;}
.fixed_side_menu .side_on .chat_list .cont .list li .modify_box .btn.name {color: #000;}
.fixed_side_menu .side_on .chat_list .cont .list li .modify_box .btn.delete {color: #D20E0E;}
.fixed_side_menu .side_on .chat_list .cont .list li .modify_box.on {opacity: 1; pointer-events: visible;}

.fixed_side_menu .side_on .chat_list .btn_box{width: 100%; margin-top: 2rem;}
.fixed_side_menu .side_on .chat_list .btn_box .btn_link{display: block; width: 100%; font-size: var(--p6); height: 2.85em; line-height: 2.85em; text-align: center; font-weight: 500; background-color: #07167D; color: #fff; border-radius: 1rem; transition: 0.3s ease;}

.fixed_side_menu .side_on .footer {margin-top: 1.2rem; color: #fff;}
.fixed_side_menu .side_on .footer .line{ display: block; width: 100%; padding-top: 1rem; width: 100%; height: 1px; border-top: 1px solid rgba(255,255,255,0.2);}
.fixed_side_menu .side_on .footer .terms_txt{display: flex; gap:2rem}
.fixed_side_menu .side_on .footer .terms_txt .btn {font-size: var(--p5); font-weight: 600; }
.fixed_side_menu .side_on .footer .terms_txt .btn + .btn {font-weight: 500; }
.fixed_side_menu .side_on .footer .txt {font-size: var(--p6); color: var(--gray50); line-height: 1.2; display: flex; flex-wrap: wrap; gap: 8px 0.4em;}
.fixed_side_menu .side_on .footer .txt span {display: flex; align-items: center;}
.fixed_side_menu .side_on .footer .txt span:first-child{width: 100%;}
.fixed_side_menu .side_on .footer .txt span:last-child{width: 100%;}
.fixed_side_menu .side_on .footer .txt span:nth-child(2)::after {content: ''; width: 1px; height: 1em; background-color: rgba(0, 0, 0, 0.2); margin-left: 0.3em; display: block;}
.fixed_side_menu .side_on .footer .copy_txt {font-size: var(--p7); color: rgba(255,255,255,0.5); margin-top: 1rem;}

.fixed_side_menu .side_on .service_box .inq_box .btn {background-color: var(--point01); display: flex; align-items: center; font-weight: 400; border-radius: 0.8rem; width: 100%; color: #fff; transition: background-color 0.3s ease;}
.fixed_side_menu .side_on .service_box .inq_box .btn + .btn {margin-top: 1rem;}
.fixed_side_menu .side_on .service_box .inq_box .btn svg {height: 1.1em; width: 1.1em; margin-right: 1rem;}

.fixed_side_menu .side_on .service_box .inq_box .btn,
.fixed_side_menu .side_on .footer .info_wrap .open_btn{font-size: var(--p5); height: 5rem; padding:  0 1.2em;}

.fixed_side_menu .side_on .footer .info_wrap{position: relative; background-color: #1124A8; border-radius: 0.8rem;}
.fixed_side_menu .side_on .footer .info_wrap .open_btn{display: flex; justify-content: flex-start; gap: 0.4em; width: 100%;}
.fixed_side_menu .side_on .footer .info_wrap .open_btn svg{transition: transform 0.3s ease; width: 0.8em; height: 1em; transform: rotate(180deg);}
.fixed_side_menu .side_on .footer .info_wrap .open_btn .ico{margin-left: auto;}
.fixed_side_menu .side_on .footer .info_wrap.on .open_btn svg{transform: rotate(0);}

.fixed_side_menu .side_on .footer .info_popup{ position: absolute; left: 0; bottom: calc(100% + 1rem); z-index: 1000; width: calc(var(--fixSideMenuW2) - 6rem); max-height: calc(100vh - 16rem); padding: 2.5rem 1.5rem 2rem; background-color: #fff; color: var(--black); border-radius: 0.8rem; opacity: 0; pointer-events: none; transition: opacity 0.3s ease;}
.fixed_side_menu .side_on .footer .info_wrap.on .info_popup{opacity: 1; pointer-events: visible;}
.fixed_side_menu .side_on .footer .info_popup .terms_txt{margin-bottom: 1.5rem;}

/* siteMap */
.site_map{ position: fixed; display: none; flex-direction: column; justify-content: flex-start; align-items: flex-end; inset: 0; width: 100%; height: 100dvh; z-index: 3000; opacity: 0; pointer-events: none; transition: opacity 0.5s;  justify-content: flex-start; overflow-y: auto; color: var(--black); padding: 0}
.site_map.active { opacity: 1; pointer-events: visible; }
.site_map .bg {position: absolute; inset: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.50); z-index: 1;}

.site_map .cont_box{display: flex; flex-direction: column; position: relative; width: 100%; max-width: 100%; height: 100%; padding-bottom: env(safe-area-inset-bottom);background-color: var(--point02); z-index: 2; opacity: 0; pointer-events: none; transition: transform 0.5s ease-in-out, opacity 0.5s ease-in-out;} /*transform: translateX(100%);*/
.site_map.active .cont_box{opacity: 1; pointer-events: inherit; transform: translateX(0);}
    
.site_map .top{position: relative; display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 0 var(--hdIn); height:var(--hdH); flex-shrink: 0;}
.site_map .top .logo{display: block; width: 20rem; }
.site_map .top .link_btn {font-size: var(--p5); padding: 0.7em 1.5em; background-color: var(--point01);}
.site_map .top .link_btn .ico {display: none;}
.site_map .top .close_btn {margin-left: 1.5rem;}
.site_map .top .close_btn {position: relative; top: 0; right: 0; display: flex; align-items: center; justify-content: center; 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.header .util_wrap .ico_btn.bell .new:before{border-color: var(--point02);}

.site_map .cont {display: flex; flex: 1; flex-direction: column; justify-content: center; align-items: center; margin-bottom: var(--hdH); position: relative; padding: 0 var(--hdIn); width: 100%; max-width: 100%; height: 100%; background-color: var(--grayBg1); background-color: var(--point02); border-top: none;}
.site_map .cont .list {flex-direction: column; max-width: 100%; padding: 0; margin-top: 0; width: 640px; }
.site_map .cont .list .depth1 {display: flex; align-items: center; padding: 0; width:100%; }
.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; min-width: 135px; margin-right: 20px; padding: 30px 0; white-space: nowrap; cursor: pointer; font-size:var(--h6); color: #fff; font-weight: 700; margin-bottom: 0;}
.site_map .cont .list .depth1.active > a,
.site_map .cont .list .depth1.on > a{background-color: transparent;}
.site_map .cont .list .depth1 + .depth1 { margin-left: 0; padding: 0; border-left: none}
.site_map .cont .list .depth1.no_depth.active > a{width: 100%;}
.site_map .cont .list .depth1 > a span{display: inline-block; transform: translateY(0);}
.site_map .cont .list .depth1{display: flex; border-bottom: 1px solid rgba(255,255,255,0.12); }
.site_map .cont .list .depth1 > a::after { content: ""; position: absolute; display: inline-block; left: 0; top: 50%; transform: translateY(-50%); width: 0.35em; height: 0.35em; border-radius: 50%; background-color: #fff; opacity: 0;}
.site_map .cont .list .depth1.active > a{padding-left: 1em;}
.site_map .cont .list .depth1.active > a:after{opacity: 1;}

.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{  position: absolute; top: 0; left: 24rem; width: calc(100% - 24rem); min-height: 100%; height: max-content; margin-top:0; padding-bottom: 80px; color: #101010; background-color: #fff;}
.site_map .cont .list .depth2{display: flex; gap: 20px; position: relative; width: 100%; left: 0; padding-bottom: 0; background: transparent; }
.site_map .cont .list .depth2.on{display: block; height: 100%;}
.site_map .cont .list .depth2 > li{ font-size:16px;}
.site_map .cont .list .depth2 > li + li {margin-top: 0;}
.site_map .cont .list .depth2 > li > a{position:relative; display: flex; align-items: center; cursor: pointer; font-weight: 700; line-height: 1; height:52px; transition: opacity 0.3s ease;}
.site_map .cont .list .depth2 > li > a:hover{opacity: 1;}
.site_map .cont .list .depth2 > li > a{height: auto; padding: 0.8em 0; font-weight: 500; color: #fff; opacity: 0.5;}
.site_map .cont .depth2 > li.active > a span{ padding-left: 0;}
.site_map .cont .list .depth2 > li.active > a{opacity: 1;}

.site_map .cont .list .depth1:not(.no_depth) > a:before {display: none; content: ''; position: absolute; right: 2px; top: 50%; transform: translateY(-50%); transform-origin: center; width: 1em; height: 1em; transition: transform 0.5s; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="21" height="12" viewBox="0 0 21 12" fill="none"><path d="M1.00093 1.04595L10.5469 10.5919L20.0928 1.04595" stroke="white" stroke-width="1.5"/></svg>') no-repeat center / contain; }
.site_map .cont .list .depth1.on > a:before{transform: translateY(-50%) rotate(180deg);}

.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(--point01);}

.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(--point01); 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;}


.footer.lap_only{background-color: var(--bg); padding: 5rem 0 4rem; margin-top: auto;}
.footer.lap_only .in_w{padding: 0 15px;}
.footer.lap_only .logo{width: 22rem;}
.footer.lap_only .terms_box{color: var(--gray70); font-size: var(--p4); font-weight: 500; margin-top: 3.4rem;}
.footer.lap_only .terms_box .btn + .btn{margin-left: 3rem;}
.footer.lap_only .terms_box .btn:first-child{font-weight: 600;}
.footer.lap_only .info_list{margin-top: 2rem; display: flex; flex-wrap: wrap;}
.footer.lap_only .info_list .txt{font-size: var(--p6); color: #9EA3A8; font-weight: 500;}
.footer.lap_only .info_list .txt + .txt{position: relative; margin-left: 1rem; padding-left: 1rem;}
.footer.lap_only .info_list .txt + .txt:before{content: ''; position: absolute; top: 20%; left: 0; width: 1px; height: 60%; background-color: #C9CCCF;}
.footer.lap_only .copy_txt{font-size: var(--p7); margin-top: 1.2rem; color: #9EA3A8; }


/*--------------공통스타일--------------*/

/* 모달 */
.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: 10rem 0; font-size: var(--p4); background: rgba(0,0,0,0.7); pointer-events: none;}
.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: max(50rem, 450px); max-width: 100%; margin: 0 auto; background-color: #fff; border-radius: 2rem;}

/* over modal */
.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(--p4); 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: max(50rem, 450px); max-width: 100%; margin: 0 auto; background-color: #fff; border-radius: 2rem;}

.modal_wrap .modal_cont .modal_close {position: absolute; top: 2rem; right: 2rem; width: 2.2em; height: 2.2em; cursor: pointer; z-index: 2; transition: transform 0.5s; 
 background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="46" height="46" viewBox="0 0 46 46" fill="none"><g opacity="0.5"><path d="M35 12.6186L32.4821 10L22.5 20.3814L12.5179 10L10 12.6186L19.9821 23L10 33.3814L12.5179 36L22.5 25.6186L32.4821 36L35 33.3814L25.0179 23L35 12.6186Z" fill="%235A5A5A"/></g></svg>') no-repeat center / contain; }
/* .modal_wrap .modal_cont .modal_close.wh {background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="46" height="46" viewBox="0 0 46 46" fill="none"><g opacity="1"><path d="M35 12.6186L32.4821 10L22.5 20.3814L12.5179 10L10 12.6186L19.9821 23L10 33.3814L12.5179 36L22.5 25.6186L32.4821 36L35 33.3814L25.0179 23L35 12.6186Z" fill="%23FFF"/></g></svg>') no-repeat center / contain; } */
.modal_wrap .modal_cont .modal_close.wh {width: 1.6em; height: 1.6em; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><rect x="2.06055" y="20.3848" width="26" height="1.5" transform="rotate(-45 2.06055 20.3848)" fill="white"></rect><rect x="3.06055" y="2" width="26" height="1.5" transform="rotate(45 3.06055 2)" fill="white"></rect></svg>') no-repeat center / contain; }


.modal_wrap .modal_cont .modal_close.out { top: -3rem; right: 0; transform: translateY(-100%);}

.modal_wrap .modal_cont .head{position: relative; display: flex; align-items: center; justify-content: space-between; padding: 2.4rem; border-radius: 2rem 2rem 0 0; background:var(--point03); color: #fff;}
.modal_wrap .modal_cont .head .tit{margin-right: 1.5em; font-size:var(--p1); font-weight: 700;}
.modal_wrap .modal_cont .head .modal_close {position: static; flex-shrink: 0;}
.modal_wrap .modal_cont .head + .cont{border-radius: 0 0 2rem 2rem; background-color: #fff;}

.modal_cont > .cont{padding: 5rem;}
.modal_wrap .modal_cont .head + .cont {padding: 3rem 2.4rem;}
/* .modal_cont .cont::-webkit-scrollbar{width: 10px;}
.modal_cont .cont::-webkit-scrollbar-thumb{background: #d7d7d7; border-right: 5px solid #fff; border-radius: 3px; border-top-right-radius: 8px 3px; border-bottom-right-radius: 8px 3px;}
.modal_cont .cont::-webkit-scrollbar-track{background: #fff;}
.modal_cont .cont::-webkit-scrollbar-button:vertical:decrement{height: 15px;}
.modal_cont .cont::-webkit-scrollbar-button:vertical:increment{height: 15px;} */
.modal_cont .cont::-webkit-scrollbar { display: inherit; width: 10px; }
.modal_cont .cont::-webkit-scrollbar-thumb { background: #b8b8b8; border-right: 5px solid #fff; border-radius: 3px; border-top-right-radius: 8px 3px; border-bottom-right-radius: 8px 3px; }
.modal_cont .cont::-webkit-scrollbar-track { background: #fff; margin-block: 15px;}
.modal_cont .nice-select .list { max-height: 200px;} 

.modal_wrap .modal_cont .txt_box{text-align: center;}
.modal_wrap .txt_box .tit{font-size: var(--h8); font-weight: 700; line-height: 1.5;}
.modal_wrap .txt_box .txt{font-size: var(--p4); margin-top: 1.5rem; }
.modal_wrap .txt_box > .ico{width: auto; height: 4.7em; margin: 2rem auto 3rem; }
.modal_wrap .txt_box > .ico img{width: auto; height: 100%;}

.modal_wrap .modal_cont .btn_wrap { display: flex; align-items: center; justify-content: center; width: 100%; margin-top: 4rem; }
.modal_wrap .modal_cont .btn_wrap a,
.modal_wrap .modal_cont .btn_wrap .btn { cursor:pointer; display: flex; align-items: center; justify-content: center; font-size: var(--p3); max-width: 24rem; height: var(--inpH); flex: 1; padding: 0 1.5em; font-weight: 600; border-radius: 1rem; background-color: #000; border: 1px solid #000; color: #fff; box-shadow: 0 0 0 transparent; transition: all 0.3s; white-space: nowrap; }
.modal_wrap .modal_cont .btn_wrap .line{background-color: #fff; color: var(--black); border-color: var(--line);}
.modal_wrap .modal_cont .btn_wrap > * + * { margin-left: 1rem; }
.modal_wrap .modal_cont .btn_wrap a.disabled {pointer-events: none; border-color: #D3D3D3; background-color: #D3D3D3; cursor: not-allowed;}

/* 비디오 모달 */
.modal .modal_wrap .modal_cont.video_modal {width: 100rem; }
.modal .modal_wrap .modal_cont.video_modal .video {position: relative; border-radius: 2rem; overflow: hidden; padding-top:56.25%;}
.modal .modal_wrap .modal_cont.video_modal img,
.modal .modal_wrap .modal_cont.video_modal video,
.modal .modal_wrap .modal_cont.video_modal iframe {position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain;}

/* 로그인 모달 */
.modal .modal_wrap .modal_cont.member{}
.modal .modal_wrap .member.modal_cont .btn_wrap a,
.modal .modal_wrap .member.modal_cont .btn_wrap .btn{max-width: 100%;}

.modal .member .login_wrap {padding: 8rem 6rem; border-radius: 2rem;}
.modal .member .login_wrap .logo {width: auto; height: 6.5rem; max-width: 80%; margin: 0 auto;}
.modal .member .login_wrap .logo img {width: 100%; height: 100%;}
.modal .member .login_wrap .input_wrap{margin-top: 5rem;}
.modal .member .login_wrap .input_wrap .inp {position: relative; margin-bottom: 1rem;}
.modal .member .login_wrap .input_wrap input{width: 100%; height: var(--inpH); padding-left: 1.2em; background-color: var(--grayBg1); font-size: var(--p4); border-radius: 1rem; line-height: var(--inpH); transition: background 0.25s, border 0.25s;}
.modal .member .login_wrap .input_wrap input::placeholder{color: rgba(0,0,0,0.3); font-weight: 600;}
.modal .member .login_wrap .input_wrap button {width: 100%; height: var(--inpH); /*padding: 1.25em 0;*/ background: #000; color: #fff; font-size: var(--p3); font-weight: 700; text-align: center; border-radius: 1rem; transition: background 0.25s;}
.modal .member .login_wrap .input_wrap button:hover {background-color: var(--point01);}

.modal .member .login_wrap .util_wrap{display: flex; justify-content: center; margin-top: 2rem;}
.modal .member .login_wrap .util_wrap a{position: relative; color: rgba(0,0,0,0.5); font-size: var(--p5); text-align: center; 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 .util_wrap a:hover {color: #000;}

.modal .member .login_wrap .sns_wrap {margin-top: 5rem;}
.modal .member .login_wrap .sns_wrap .btn {display: flex; align-items: center; justify-content: center; font-size: var(--p5); height: var(--inpH); border-radius: 0.8rem; border: 1px solid #DFDFDF; font-weight: 600; transition: 0.3s ease-in-out;}
.modal .member .login_wrap .sns_wrap .btn + .btn {margin-top: 1.25rem;}
.modal .member .login_wrap .sns_wrap .btn .icon-sns {display: flex; align-items: center; margin-right: 10px; font-size: 10px}
.modal .member .login_wrap .sns_wrap .btn .icon-sns img,
.modal .member .login_wrap .sns_wrap .btn .icon-sns svg {width: 100%;}
.modal .member .login_wrap .sns_wrap .btn svg path {transition: 0.3s ease-in-out;}
.modal .member .login_wrap .sns_wrap .btn .icon-sns.icon-naver {width: 2.4em;}
.modal .member .login_wrap .sns_wrap .btn .icon-sns.icon-kakao {width: 2.4em;}
.modal .member .login_wrap .sns_wrap .btn .icon-sns.icon-google {width: 2em;}

.modal .member .login_wrap .sns_wrap .btn.naver:hover {background-color: #2EB400; border-color: #2EB400; color: #fff;}
.modal .member .login_wrap .sns_wrap .btn.naver:hover svg path {fill: #fff;}
.modal .member .login_wrap .sns_wrap .btn.kakao:hover {background-color: #FFE812; border-color: #FFE812 ;}
.modal .member .login_wrap .sns_wrap .btn.google:hover {background-color: #000; border-color: #000; color: #fff;}

/* 회원가입 모달 */
.modal .member .join_wrap{padding: 9rem 5rem 5rem; background: #fff; border-radius: 2rem;}
.modal .member .join_wrap .txt_box{ text-align: left; margin-bottom: 3.5rem;}
.modal .member .join_wrap .txt_box .step{margin-bottom: 0.5em; color: var(--point01); font-size: var(--p4); font-weight: 700; line-height: 1em;}
.modal .member.join.step2 .join_wrap .txt_box{margin-bottom: 3rem;}

.modal .member .join_wrap .inp_wrap{margin-top: 2.5rem;}
.modal .member .join_wrap .inp_wrap .flex_wrap{display: flex;}
.modal .member .join_wrap .inp_wrap .dot_list {margin-top: 1rem; color: var(--gray40); font-size: var(--p8);}

.modal .member .join_wrap .inp_wrap .inp_tit{display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem; font-weight: 600;}
.modal .member .join_wrap .inp_wrap .inp_tit p .ess{margin-left: 3px; color: var(--point01);}
.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: 1em; 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); font-size: var(--p5) ;padding: 0 1.2em; background-color: var(--grayBg1); border: 1px solid var(--grayBg1); border-radius: 0.8rem; line-height: var(--inpH); transition: background 0.25s, border 0.25s;}
.modal .member .join_wrap .inp_wrap input:focus{border-color: #232323; background-color: #fff;}
.modal .member .join_wrap .inp_wrap input::placeholder{color: var(--gray40);}
.modal .member .join_wrap .inp_wrap .inp {position: relative}
.modal .member .join_wrap .inp_wrap .inp:has(.ico) input{padding-right: max(6rem, 50px);}
.modal .member .join_wrap .inp_wrap .inp input + .ico {position: absolute; right: 15px; top: 50%; transform: translateY(-50%); width: max(2rem, 20px); height: max(2rem, 20px); 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" width="20" height="20" viewBox="0 0 20 20" fill="none"><circle cx="10" cy="10" r="10" fill="%23192EB4"/><path d="M7 10L9.5 12.5L13.5 8" stroke="white" stroke-width="1.5" stroke-linecap="round"/></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" width="20" height="20" viewBox="0 0 20 20" fill="none"><circle cx="10" cy="10" r="10" fill="black" fill-opacity="0.2"/><path d="M12.5 8L8 12.5M8 8L12.5 12.5" stroke="white" stroke-width="1.5" stroke-linecap="round"/><path d="M12.5 8L8 12.5M8 8L12.5 12.5" stroke="white" stroke-width="1.5" stroke-linecap="round"/></svg>') no-repeat center / contain;}

/* 비밀번호 표시/숨김 토글 (login_1, join_2) */
.modal .member .inp button.pw_toggle {position: absolute; top: 50%; right: max(1rem, 8px); transform: translateY(-50%); z-index: 3; display: flex; align-items: center; justify-content: center; width: max(3.2rem, 28px); height: max(3.2rem, 28px); padding: 0; border: none; border-radius: 0; background: none; color: #9aa3bd; cursor: pointer; transition: color 0.2s;}
.modal .member .inp button.pw_toggle:hover, .modal .member .inp button.pw_toggle.on {background: none; color: var(--point01);}
.modal .member .inp button.pw_toggle svg {display: block; width: max(2rem, 20px); height: max(2rem, 20px); pointer-events: none;}
.modal .member .inp input[type="password"]::-ms-reveal, .modal .member .inp input[type="password"]::-ms-clear {display: none;}
.modal .member .login_wrap .input_wrap .inp:has(.pw_toggle) input {padding-right: max(5rem, 44px);}
.modal .member .join_wrap .inp_wrap .inp:has(.pw_toggle) input {padding-right: max(5rem, 44px);}
/* 검증 아이콘(.ico) 공존: 토글이 오른쪽 끝, .ico 는 그 왼쪽 */
.modal .member .join_wrap .inp_wrap .inp:has(.ico):has(.pw_toggle) input {padding-right: max(9rem, 78px);}
.modal .member .join_wrap .inp_wrap .inp:has(.pw_toggle) input + .ico {right: max(4.7rem, 42px);}
.modal .member .join_wrap .inp_wrap .flex_wrap{display: flex;}
.modal .member .join_wrap .inp_wrap .flex_wrap button{flex-shrink: 0; height: var(--inpH); padding: 0 1.5em;  font-size: var(--p5); border-radius: 0.8rem ; color: var(--gray50); background-color: #fff; border:1px solid var(--gray20); max-width: 35%; transition: background 0.25s, color 0.25s;}
.modal .member .join_wrap .inp_wrap .flex_wrap button.full_btn{font-size: var(--p6); margin-top: 0.7rem; background-color: #fff; width: 100%; height: auto; padding: 0.8em; font-weight: 600; color: var(--gray50); border-radius: 0.5rem; border: 1px solid var(--gray20); margin-left: 0;}

.modal .member .join_wrap .nice-select {width: 100%; font-size: var(--p5);height: var(--inpH);line-height: var(--inpH);padding: 0 1.3em;border: 0;border-radius: 0.8rem;font-weight: 500;background-color: var(--grayBg1);}
.modal .member .join_wrap .agree { margin-top:1.2rem;}
.modal .member .join_wrap .inp_wrap .agree em {width: 1.3em;height: 1.3em;border-radius: 3px;background-color: #fff;border: 1px solid var(--line);display: flex;align-items: center;justify-content: center;transition: all 0.3s ease;}
.modal .member .join_wrap .inp_wrap .agree em svg {width: 0.8em; height: auto;}
.modal .member .join_wrap .inp_wrap .agree .checkbox + div {display: flex;align-items: center;font-size: var(--p5);cursor: pointer;}
.modal .member .join_wrap .inp_wrap .agree .checkbox + div p {margin-left: 1rem;}
.modal .member .join_wrap .inp_wrap .agree .checkbox:checked + div em {background-color: var(--point01);border-color: var(--point01);}
.modal .member .join_wrap .inp_wrap .agree .checkbox:checked + div em svg path {stroke: #fff; opacity: 0.8;}
.modal .member .join_wrap .inp_wrap .agree .nice-select { width:14em; margin-right:1.2rem;}

.modal .member .join_wrap .inp_wrap .email_box { align-items: center; gap: 0.8rem;}
.modal .member .join_wrap .inp_wrap .email_box input { flex:1; }
.modal .member .join_wrap .inp_wrap .email_box .nice-select { flex:1;; }
.modal .member .join_wrap .inp_wrap .email_box em { margin:0rem; color:var(--black5);  }
.modal .member .join_wrap .inp_wrap .email_box .join_email_input {position: relative; flex: 1 1 auto; min-width: 0;}
.modal .member .join_wrap .inp_wrap .email_box .join_email_input input {width: 100%;}
.modal .member .join_wrap .inp_wrap .email_box .join_email_suggest {position: absolute; left: 0; right: 0; top: calc(100% + 0.4rem); z-index: 20; max-height: 24rem; overflow-y: auto; padding: 0.6rem 0; background: #fff; border: 1px solid var(--gray20); border-radius: 0.8rem; box-shadow: 0 1rem 2.4rem rgba(0,0,0,0.12);}
.modal .member .join_wrap .inp_wrap .email_box .join_email_suggest li {display: block; padding: 0.8rem 1.2rem; color: var(--black); font-size: var(--p6); line-height: 1.4; cursor: pointer; overflow-wrap: anywhere;}
.modal .member .join_wrap .inp_wrap .email_box .join_email_suggest li.active,
.modal .member .join_wrap .inp_wrap .email_box .join_email_suggest li:hover {background: var(--grayBg1);}
.modal .member .join_wrap .inp_wrap .email_box .join_email_suggest::-webkit-scrollbar { display: inherit; width: 7px; }
.modal .member .join_wrap .inp_wrap .email_box .join_email_suggest::-webkit-scrollbar-thumb { background: #b8b8b8; border-right: 4px solid #fff; border-radius: 3px; border-top-right-radius: 10px 3px; border-bottom-right-radius: 10px 3px; }
.modal .member .join_wrap .inp_wrap .email_box .join_email_suggest::-webkit-scrollbar-track { background: #fff; margin-block: 5px;}

.consult3_sect .contact_email_input {position: relative;}
.consult3_sect .contact_email_input input {width: 100%;}
.consult3_sect .contact_email_suggest {position: absolute; left: 0; right: 0; top: calc(100% + 0.4rem); z-index: 30; max-height: 24rem; overflow-y: auto; padding: 0.6rem 0; background: #fff; border: 1px solid var(--gray20); border-radius: 0.8rem; box-shadow: 0 1rem 2.4rem rgba(0,0,0,0.12);}
.consult3_sect .contact_email_suggest li {display: block; padding: 0.8rem 1.2rem; color: var(--black); font-size: var(--p6); line-height: 1.4; cursor: pointer; overflow-wrap: anywhere;}
.consult3_sect .contact_email_suggest li.active,
.consult3_sect .contact_email_suggest li:hover {background: var(--grayBg1);}
.consult3_sect .contact_email_suggest::-webkit-scrollbar { display: inherit; width: 7px; }
.consult3_sect .contact_email_suggest::-webkit-scrollbar-thumb { background: #b8b8b8; border-right: 4px solid #fff; border-radius: 3px; border-top-right-radius: 10px 3px; border-bottom-right-radius: 10px 3px; }
.consult3_sect .contact_email_suggest::-webkit-scrollbar-track { background: #fff; margin-block: 5px;}


.modal .member .join_wrap .inp_wrap .tel_box .nice-select {width: 10em; margin-right: 0.8rem;}

.modal .member .join_wrap .inp_wrap .country_box .nice-select:after{transform: rotate(180deg);}
.modal .member .join_wrap .inp_wrap .country_box .nice-select.open:after{transform: rotate(0);}

.modal .member .join_wrap .inp_wrap .country_box .nice-select .current,
.my_write_form .form_list li.lang .nice-select .current{overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: inline-block;}
.modal .member .join_wrap .inp_wrap .country_box .nice-select .list,
.my_write_form .form_list li.lang .nice-select .list{ max-width: 100%;} 
.modal .member .join_wrap .inp_wrap .country_box .nice-select .list .option,
.my_write_form .form_list li.lang .nice-select .list .option {height: auto; min-height: 3em; padding: 0.75em 10px; line-height: 1.5; white-space: normal; overflow-wrap: anywhere;}

.modal .member .join_wrap .inp_wrap .country_box .nice-select .list{ top: auto; bottom: 100%; -webkit-transform-origin: 50% 100%; -ms-transform-origin: 50% 100%; transform-origin: 50% 100%; -webkit-transform: scaleY(.75) translateY(21px); -ms-transform: scaleY(.75) translateY(21px); transform: scaleY(.75) translateY(21px);} 
.modal .member .join_wrap .inp_wrap .country_box .nice-select.open .list{ -webkit-transform: scaleY(1) translateY(0); -ms-transform: scaleY(1) translateY(0); transform: scaleY(1) translateY(0);} 


.modal .member .join_wrap .chk_wrap {display: flex; align-items: center; gap: 2rem;}
.modal .member .join_wrap .chk_wrap svg {width: max(2rem, 20px); height: auto; margin-top: 0.1em;}
.modal .member .join_wrap .chk_wrap label {display: flex; align-items: flex-start; cursor: pointer;}
.modal .member .join_wrap .chk_wrap input:checked + label svg circle {fill-opacity:1; fill: var(--point01);}
.modal .member .join_wrap .chk_wrap .txt {font-size: var(--p4); font-weight: 500; margin-left: 1rem;}
.modal .member .join_wrap .chk_wrap .txt span {color: var(--point01);}
.modal .member .join_wrap .chk_wrap .txt span.no_ess {color: var(--black);}
.modal .member .join_wrap .chk_wrap .view {margin-left: auto; font-size: var(--p6); color: rgba(0,0,0,0.3); white-space: nowrap;}

.modal .member .join_wrap .chk_all_wrap label {display: flex; align-items: center; justify-content: space-between; background-color: var(--grayBg1); border-radius: 1rem; font-size: var(--p3); height: 3.3em; padding: 0 1.1em; font-weight: 600; cursor: pointer;}
.modal .member .join_wrap .chk_all_wrap label svg {width: max(2rem, 20px); height: auto;}
.modal .member .join_wrap .chk_all_wrap input:checked + label svg circle {fill-opacity:1; fill: var(--point02);}

.modal .member .join_wrap .tab_box{display: flex; gap: 0.8rem; font-size: var(--p3);}
.modal .member .join_wrap .tab_box .tab{flex: 1; text-align: center; border: 1px solid #ccc; color: var(--gray30); border-radius:0.8rem; height: var(--inpH);}
.modal .member .join_wrap .tab_box .tab.active{background-color: var(--point02); border-color: var(--point02); color: #fff;}

.modal .member .join_wrap.join_complete{display: flex; flex-direction: column; align-items: center; padding-top: 5rem;}
.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(--point01);}
.modal .member .join_wrap.join_complete .logo{margin-bottom: 3rem;}
.modal .member .join_wrap.join_complete .logo img{height: 8rem; width: auto;}
.modal .member .join_wrap.join_complete .txt_box{margin-bottom: 0;}
.modal .member .join_wrap.join_complete p{margin-top: 1em; font-size: 2rem; font-weight: 700;}

.modal .member .find_id .chk_id { display: flex; justify-content: center; align-items: center; margin-top: 4rem; padding: 1em; border-radius: 1rem; background-color: var(--grayBg1); gap: 1.5rem; }
.modal .member .find_id .chk_id .ico svg{display: block;}
.modal .member .find_id .chk_id .txt{font-weight: 700; font-size: var(--p3);}


/*비밀번호 팝업*/
.modal .modal_wrap .modal_cont.password { position: relative; width: 500px; margin: 0 auto; }
.modal .modal_cont.password .modal_top { display: flex; align-items: center; justify-content: right; background-color: transparent; }
.modal_wrap .modal_cont.password .close_btn { position: absolute; right: 0; top: -5px; transform: translate(0, -100%); color: #fff; font-size: 28px; }
.modal_cont.password .password_box { padding: 2rem 5rem 4rem; background: #fff; text-align: center; }
.modal_cont.password .password_box .tit { font-size: 2.5rem; font-weight: 600; }
.modal_cont.password .password_box .tip { margin-top: 1.5rem; font-size: 1.5rem; color: #555; line-height: 1.8; }
.modal_cont.password .password_box .tip span { font-weight: 600; }
.modal_cont.password .btn_wrap { margin: 6rem auto 0; }
.modal_cont.password .btn_wrap .btn5 { width: 100%; }
.modal_cont.password .btn_wrap .btn5 + .btn5 { margin-left: 1rem; }

/* 아이디 찾기 결과 */
.id_find_result.none {text-align: center; margin-top: 4rem}
.id_find_result.none i {font-size: 4rem}
.id_find_result.none p {font-size: var(--deps3_tit); margin-top: 1rem; font-weight:600 }

.modal_cont.join.find_id .id_find_result.ok .find_info {margin-top: 4rem}
.id_find_result.ok .find_info .inp_wrap p.id {background-color: rgba(0,0,0,0.05); padding: 3rem; font-size: var(--deps3_tit); font-weight: 600; text-align: center; width: 100%}

/* 탈퇴 */
.modal .modal_wrap .modal_cont.member_out{width: 50rem;}

/* 모달_정책 */
.modal .modal_wrap .modal_cont.terms,
.over_modal .modal_wrap .modal_cont.terms{width: 80rem; overflow: hidden; border-radius: 2rem; background-color: transparent;}
.modal_cont.terms .cont{overflow-y: auto; max-height: 65vh; padding: 2.4rem; background-color: #f6f6f6; border-radius: 0 0 2rem 2rem; font-size: var(--p4);}
/* .modal_cont.terms section {margin-top: 4rem;} */
.modal_cont.terms h2{font-size: var(--p1);}
.modal_cont.terms h3{font-size: var(--p3); margin-top: 1.5rem; margin-bottom: 0.3rem;}
.modal_cont.terms ul li{ position: relative; padding-left: 0.5em;}
.modal_cont.terms ul li:before{content: '·'; position: absolute; left: 0;}
.modal_cont.terms ol{padding-left: 1.2em;}
.modal_cont.terms ol > li{list-style: auto;}
.modal_cont.terms .cont figure.table {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; width: 100%; margin-bottom: 1rem; font-size: var(--p5);}
.modal_cont.terms .cont table th {border: 1px solid var(--gray20) !important; padding: 1rem; background-color: var(--gray5);}
.modal_cont.terms .cont table td {border: 1px solid var(--gray20) !important; padding: 1rem;}

/* msg_layer */
.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%; 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: 350px; max-width: 100%; margin: 0 auto; background-color: #fff; border-radius: 2rem;}
.msg_layer .modal_wrap .modal_cont .cont {padding: 4rem 5rem 3rem; }
.msg_layer .modal_wrap .modal_cont .cont p {font-size: var(--p4); font-weight: 500; 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: 2rem; }
.msg_layer .btn_wrap .btm_btn { display: flex; align-items: center; justify-content: center; flex: 1; max-width: 50%; height: 3em; white-space: nowrap; line-height: 3em; padding: 0 2.2rem; font-size: var(--p4); font-weight: 600; border-radius: 0.8rem; background-color: var(--point01); border: 1px solid var(--point01); color: #fff; box-shadow: 0 0 0 transparent; transition: box-shadow 0.3s, background-color 0.3s, color 0.3s; }
.msg_layer .btn_wrap .btm_btn.wh{background-color: #fff; color: var(--point01);}
.msg_layer .btn_wrap .btm_btn .txt { font-weight: 600; }
.msg_layer .btn_wrap > * + * { margin-left: 1rem; }
.msg_layer .modal_wrap .modal_cont .btn_wrap{margin-top: 3rem;}


/* 모달_나의 채팅 */
.modal .modal_wrap .modal_cont.my_chat{background-color: transparent;}
.modal_cont.my_chat .head .tit {display: flex; align-items: center; justify-content: center; text-align: center; flex: 1;}
.modal_cont.my_chat .head .modal_close { position: absolute; top: 50%; transform: translateY(-50%);}

.modal_cont.my_chat .new_chat_btn_box .new_chat_btn{display:flex; align-items: center; width: 100%; padding: 1.3em 1em; gap: 0.3em; font-size: var(--p3); font-weight: 700; color: var(--point02); border-radius: 1.5rem; border:1px solid var(--point02) }
.modal_cont.my_chat .new_chat_btn_box .new_chat_btn .ico svg{width: 1.1em; height: 1.1em; margin-right: 0.2em;}
.modal_cont.my_chat .new_chat_btn_box .new_chat_btn .plus{margin-left: auto;}
.modal_cont.my_chat .new_chat_btn_box .new_chat_btn .plus svg{display: block; width: 2em; height: 2em;}

.modal_cont.my_chat .chat_list {margin-top: 4rem; }
.modal_cont.my_chat .chat_list .tit_wrap{ display: flex; align-items: center; justify-content: space-between;}
.modal_cont.my_chat .chat_list .cont_tit{font-size: var(--p3);}
.modal_cont.my_chat .chat_list .more_btn svg{display: block; height: 1.1em; width: auto;}
.modal_cont.my_chat .chat_list .list{background-color: var(--grayBg1); font-size: var(--p4); border-radius: 1.5rem; margin-top: 1.2rem; padding: 0.5em 0.4em 0.5em 0; overflow: hidden;}
.modal_cont.my_chat .chat_list .list_scroll{max-height: 11em; overflow-y: auto; }
.modal_cont.my_chat .chat_list .list_scroll::-webkit-scrollbar {-webkit-appearance: none;}
.modal_cont.my_chat .chat_list .list_scroll::-webkit-scrollbar:vertical {width: 3px;}
.modal_cont.my_chat .chat_list .list_scroll::-webkit-scrollbar:horizontal {height: 3px;}
.modal_cont.my_chat .chat_list .list_scroll::-webkit-scrollbar-thumb {background-color: #E5E5E5;border-radius: 3px;}
.modal_cont.my_chat .chat_list .list_scroll::-webkit-scrollbar-track {border-radius: 10px; background-color: transparent;}

.modal_cont.my_chat .chat_list .list .history_btn{display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 0 1em 0 1.5em; height: 3.5em; font-size: var(--p4); color: var(--gray50); font-weight: 500; }
.modal_cont.my_chat .chat_list .list .history_btn .txt{flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.modal_cont.my_chat .chat_list .list .history_btn .arr svg{display: block; width: auto; height: 0.9em;}
.modal_cont.my_chat .chat_list .empty_txt{padding: 1.2em; border-radius: 1.5rem; background-color: var(--grayBg1); color: var(--gray50); font-size: var(--p4); text-align: center;}

.modal_cont.my_chat .chat_list .cont + .cont{margin-top: 3rem;}

/* 모달_채팅 히스토리 */
.modal .modal_wrap .modal_cont.chat,
.over_modal .modal_wrap .modal_cont.chat{width: 110rem; font-size: var(--p3); background-color: transparent;}
.modal_wrap .modal_cont.chat .head{ align-items: flex-start; word-break: break-all; padding-top: 3rem; padding-bottom: 3rem;}
.modal_wrap .modal_cont.chat .head .tit{ line-height: 1.5;} /*font-size: var(--h8);*/
.modal_wrap .modal_cont.chat .head .date{font-size: var(--p4); margin-top: 0.3rem;}
.modal_wrap .modal_cont.chat .cont{max-height: 70svh; overflow: auto; padding: 7rem 5rem;}
.modal_wrap .modal_cont.chat .chat_type .content_conversation{padding-top: 0;}
.modal_wrap .modal_cont.chat .chat_type .content_conversation .ai_flow_choice_bubble:first-child{margin-top: 0;}

.modal_wrap .modal_cont.chat .chat_type .content_conversation .result_wrap .result .markdown_body li + li{margin-top: 0.2em}

/* 모달_채팅이름변경 */
.modal_wrap .modal_cont.chat_rename .tit{margin-bottom: 1.5rem;}
.modal_wrap .modal_cont.chat_rename .inp input{width: 100%; height: var(--inpH); font-size: var(--p4) ;padding: 0 1.2em; background-color: var(--grayBg1); border: 1px solid var(--grayBg1); border-radius: 0.8rem; line-height: var(--inpH); transition: background 0.25s, border 0.25s;}
.modal_wrap .modal_cont.chat_rename .inp input:focus{border-color: #232323; background-color: #fff;}
.modal_wrap .modal_cont.chat_rename .inp input::placeholder{color: #BCBFC7;}
.modal_wrap .modal_cont.chat_rename .btn_wrap{margin-top: 3rem;}




/* Hover */
@media screen and (min-width: 1241px) {
    .modal .member .join_wrap .inp_wrap .flex_wrap button:hover{background-color: var(--point02); border-color: var(--point02); color: #fff;}
    .modal .member .join_wrap .inp_wrap .flex_wrap button.full_btn:hover{background-color: var(--point02); border-color: var(--point02); color: #fff;}
    .modal_wrap .modal_cont .btn_wrap a:hover,
    .modal_wrap .modal_cont .btn_wrap .btn:hover{background-color: var(--point01); border-color: var(--point01); color: #fff;}

    .fixed_side_menu .side_on .chat_list .btn_box .btn_link:hover{background-color: #000;}

    .fixed_side_menu .side_on .service_box .new_chat_btn_box .non_login .login_btn:hover{background-color: var(--point02);}
    .fixed_side_menu .side_on .service_box .inq_box .btn:hover{background-color: var(--point03);}

}



/* 반응형 */
/* 3201 ~  */
@media screen and (min-width: 3201px) {
    html { font-size: 13px;}
}

/* 2561 ~ 3200 */
@media screen and (min-width: 2561px) and (max-width: 3200px) {
    html { font-size: clamp(0.625rem, 0.125rem + 0.3125vw, 0.75rem);}
}

/* 2560px 이하 */
@media screen and (max-width: 2560px) {
    html { font-size: clamp(0.53125rem, 0.1964rem + 0.2679vw, 0.625rem);}
}


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

    :root {
        
        --pd:25rem;
        --pd1:20rem;
        --pd2:15rem;
        --pd3:12rem;
        --pd4:8rem;
    }
    

    .fixed_side_menu{padding-bottom: 2rem;}
    .fixed_side_menu .side_off .top_btn_box,
    .fixed_side_menu .side_on .service_box{margin-top: 1rem;}

    .fixed_side_menu .side_on .cont_tit{font-size: var(--p6); margin-bottom: 0.5rem;}

    .modal .member .join_wrap .inp_wrap .dot_list { font-size: var(--p7);}

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

    :root {
        --hdIn: 3rem;
        --inPd: 60px;
    }
    
    .header .nav .list{gap: 5rem;}

    .fixed_side_menu .side_on .cont_tit{font-size: var(--p6); margin-bottom: 0.5rem;}
    .fixed_side_menu .side_on .service_box .inq_box .btn,
    .fixed_side_menu .side_on .footer .info_wrap .open_btn{font-size: var(--p6); height: 4.5rem; }
    .fixed_side_menu .side_on .chat_list .cont + .cont{margin-top: 1.2rem; padding-top: 1.5rem;}
}


@media screen and (max-width: 1440px){
    :root {
        --inPd: 20px;
    }


    .lap_only{display: block !important;}
    .lap_only.flex{display: flex !important;}
    .pc_only{display: none !important;}

    .header .nav .list{gap: 4rem;}

    .header{border-bottom: none;}
    .header .header_in{background-color: var(--point02);}
    
    .header, 
    .page_wrap.header_on .header,
    .main .page_container,
    .page_wrap .container,
    .main .page_wrap.header_on .page_container,
    .page_wrap.header_on .container{padding-left: 0;}

    .nav{display: none;}
    .fixed_side_menu,
    .fixed_side_menu.big_type,
    .fixed_side_menu .side_off{display: none;}

    .site_map{ display: flex; }

    .header .logo,
    .site_map .top .logo{width: 19rem;}

    .header .util_wrap .btn_wrap > .txt_btn + .txt_btn,
    .header .util_wrap .txt_btn{margin-left: 12px;}
    /* .header .util_wrap .my_chat{margin-left: 20px;} */
    .header .util_wrap .lang_select,
    .header .util_wrap .ham_btn,
    .header .util_wrap .ico_btn,
    .site_map .top .close_btn{margin-left: 18px;}
    

    .header .util_wrap .txt_btn{color: #fff; background: transparent; border-color: #fff; padding: 0.6em 1em;} 

    .header .util_wrap .txt_btn.login{border-color: #fff; }
    .header .util_wrap .ico_btn > svg path{fill: #fff;}
    .header .util_wrap .bell.ico_btn button > svg path{fill: #fff;}
    .header .util_wrap .ico_btn.bell svg path{stroke: #fff;}

}


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

    :root {
        --hdH: 70px;
        --hdIn: 20px;

        --h1:42px; 
        --h2:36px; 
        --h3:32px; 
        --h4:26px; 
        --h5:24px;
        --h6:20px;
        --h7:18px; 

        --p1:18px; 
        --p2:15px;
        --p3:14px; 
        --p4:13px; 
        --p5:13px; 
        --p6:12px; 
    }


	/* .pc_only { display: none !important} */
	.mo_only { display: block !important}
	.mo_only.flex {display: flex !important}


    .modal .modal_wrap .modal_cont,
    .over_modal .modal_wrap .modal_cont {width: 65rem;}
    .modal .member .login_wrap{padding: 10rem 5rem;}

    .header .util_wrap .noti_panel{width: 44rem;}

}



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

    :root {
        --hdH: 60px;
        --hdIn:15px;
        --inpH: 42px;
        --inPd: 15px;

        --h1: 32px;
        --h2: 26px;
        --h3: 24px;
        --h4: 22px;
        --h5: 20px;
        --h6: 18px;
        --h7: 18px;
        --h8: 17px;

        --p1: 16px;
        --p2: 15px;
        --p3: 14px;
        --p4: 13px;
        --p5: 13px;
        --p6: 12px;
        --p7: 11px;
        --p8: 11px;

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

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


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

    .header:not(.site_map) .util_wrap{padding-right: 5px;}
    .header .util_wrap .lang_select .lang_list a{font-size: var(--p4); padding: 1.5rem 2rem;}
    .header .util_wrap .login .login_nav{font-size: var(--p4);}

    .footer.lap_only .info_list .txt:last-child{width: 100%; padding-left: 0; margin-left: 0;}
    .footer.lap_only .info_list .txt:last-child:before{display: none; }

    .modal_wrap .modal_cont .head + .cont{padding: 25px 20px;}
    /* .modal .member .join_wrap .inp_wrap .email_box{flex-wrap: wrap;} */
    .modal .member .join_wrap .inp_wrap .email_box .join_email_input{width: 100%; flex: unset;}
    .modal .member .join_wrap .inp_wrap .email_box .nice-select{width: 100%; flex: unset;}


    
    .site_map .bg{display: none;}
    .site_map .cont_box{width: 100%;}

    .site_map .cont{justify-content: flex-start; margin-bottom: 0;}
    .site_map .cont .list .depth1 > a{width: 100%; font-size: 17px; padding: 15px 0;}
    .lang-si .site_map .cont .list{width: 100% !important;}
    .site_map .cont .list .depth2 > li{font-size: 15px;}
    .site_map .cont .list .depth1:not(.no_depth) > a:before {display: block;}
    .site_map .cont .list .depth1{display: block;}
    .site_map .cont .list .depth2{display: block; padding-bottom: 20px; padding-left: 18px;}

    .header .util_wrap .ico_btn.bell .new:before {right: -1px;  top: -2px; width: 6px; height: 6px; border:1.5px solid #fff;}

    

}


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

    :root{

        /* --pd: 100px;
        --pd1: 80px;
        --pd2: 60px;
        --pd3: 40px;
        --pd4: 30px; */

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

    }


    .mini_only {display: block !important;}
    .mini_only.flex {display: flex !important;}
    .mini_over {display: none !important;}
/* 
    .site_map .bg{display: none;}
    .site_map .cont_box{width: 100%;}

    .site_map .cont{justify-content: flex-start;}
    .site_map .cont .list .depth1 > a{width: 100%; font-size: 17px; padding: 15px 0;}
    .site_map .cont .list .depth2 > li{font-size: 15px;}
    .site_map .cont .list .depth1:not(.no_depth) > a:before {display: block;}
    .site_map .cont .list .depth1{display: block;}
    .site_map .cont .list .depth2{display: block; padding-bottom: 20px; padding-left: 18px;} */

    .modal_cont > .cont,
    .modal_wrap .modal_cont .head + .cont{padding: 25px 20px 30px;}
    .modal .member .join_wrap{padding-left: 20px; padding-right: 20px;}

    .footer.lap_only .info_list .txt:first-child,
    .footer.lap_only .info_list .txt:last-child{width: 100%;}
    .footer.lap_only .info_list .txt:not(:nth-child(3)){padding-left: 0; margin-left: 0;}
    .footer.lap_only .info_list .txt:not(:nth-child(3)):before{display: none;}

    
}
