@charset 'utf-8';

/*
    CTM-608182 : ARA -- 리뉴얼 기본 스타일
 */


/* Global ---------------------------------------------------------------- */
html {margin:0; padding:0; background:#F7F8FA;}
body {margin:0; padding:0;}

body,p,pre,form,span,div,table,td,ul,ol,li,dl,dt,dd,input,textarea,label,button,select {color:#777; font-family:'Pretendard',Sans-serif; font-size:13px; font-weight:400; word-wrap:break-word; -webkit-text-size-adjust:none; text-decoration-skip-ink:none; word-wrap:break-word; word-break:keep-all; white-space:normal;}
b,strong {word-wrap:break-word; word-break:keep-all; font-size:inherit; font-family:inherit; }
p,form,span,h1,h2,h3,h4,h5,h6 {margin:0; padding:0; font-weight:normal;}
div,table {margin:0; padding:0; border-spacing:0; border-collapse:collapse; border:none; -webkit-overflow-scrolling:touch;}
table caption { width:0px; height:0px; font-size:0; visibility:hidden; }
ul,ol,li,td,dl,dt,dd {margin:0; padding:0; }
em,i {font-style:normal}
a,span {display:inline-block;}
div {-webkit-overflow-scrolling:touch;}
img {border:0;}
span,div,a,strong,em,label,dl,dt,dd,ul,li,p {color:inherit; font-size:inherit; font-weight:inherit; letter-spacing:inherit; line-height:inherit;}
a:link, a:visited {color:inherit; text-decoration:none; cursor:pointer;}
a:hover, a:active {text-decoration:none;}
u {text-decoration:none;}
* {font-size:inherit; -webkit-tap-highlight-color:transparent;}
.swiper-notification {display:none;}
li {list-style:none;}



/* Form ---------------------------------------------------------------- */
/* lable */
label {overflow:hidden; cursor:pointer;}
input[type=checkbox],input[type=radio] {float:left; -webkit-appearance:none; -webkit-gradient:none; -webkit-border-radius:0; border:none; margin-right:5px; box-sizing:border-box;}

/* input */
input[type=text],input[type=password],input[type=number],input[type=email],input[type=tel],input[type=date],input[type=file],input[type=search], input[type=submit],input[type=url], input[type=button], button
{-webkit-appearance:none; -webkit-gradient:none; -webkit-border-radius:0; border:none; background:none; box-sizing:border-box; padding:0;}
input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button {-webkit-appearance:none; margin:0;} /* 오른쪽에 나타나는 화살표 버튼없애기 */
input[type=date]::-webkit-outer-spin-button, input[type=date]::-webkit-inner-spin-button {-webkit-appearance:none; margin:0; border:0;} /* 오른쪽에 나타나는 화살표 버튼없애기 */
input::-ms-clear {display:none;} /* ie10 이상에서 input textbox 포커스시 생기는 삭제버튼 숨기기 */
input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {display:none;} /* 검색 기본 x버튼 없애기 */
input::placeholder {color:#ccc !important;}
input::-webkit-input-placeholder {color:#ccc !important;}
input:-ms-input-placeholder {color:#ccc !important;}
input:-moz-placeholder {color:#ccc !important;}
button {cursor:pointer;}

textarea {border:none; background:none; box-sizing:border-box; width:100%; -webkit-appearance:none; -webkit-border-radius:0; -webkit-overflow-scrolling:touch;}
textarea::placeholder {color:var(--black-50) !important;}
textarea::-webkit-input-placeholder {color:var(--black-50) !important;}
textarea:-ms-input-placeholder {color:var(--black-50) !important;}
textarea:-moz-placeholder {color:var(--black-50) !important;}

/* select 기본 화살표 없애기 */
select {-webkit-appearance:none; appearance:none; -moz-appearance:none; -webkit-user-select:none;}
select::-ms-expand {display:none;}

/* 크롬 자동완성 BG색 버림(아이디비번저장 시) */
input:-webkit-autofill {-webkit-box-shadow:0 0 0px 1000px #fff inset;}
input:-webkit-autofill:focus {-webkit-box-shadow:0 0 0px 1000px #fff inset;}

/* 인풋포커스 라인삭제 :웹접근성 작업 시 삭제 */
input,select,textarea,a {outline:none}

::selection {background:var(--color-primary); color:#fff; text-shadow:none;}
::-moz-selection {background:var(--color-primary); color:#fff; text-shadow:none;}
::-webkit-selection {background:var(--color-primary); color:#fff; text-shadow:none;}


:root {
    --color-primary:#FC7703;
    --color-secondary:#568BEE;

    --black:#111;
}


/* ********************************************** *
 * ESSENTIAL
 * ********************************************** */
 .wrap {width:100%; height:100%; position:relative;}
 .layout_fix {max-width:1200px; margin:0 auto; padding:0 20px;}
 .upper_link {position:absolute; left:0; top:0; width:100%; height:100%; z-index:9}



/* 기본버튼 ========================================================= */
.c_btnbox {overflow:hidden; text-align:center; margin:0 -5px; margin-top:15px;}
.c_btnbox ul {display:table; width:100%; table-layout:fixed; box-sizing:border-box; border-collapse:separate; border-spacing:5px 0;}
.c_btnbox ul+ ul {margin-top:5px;}
.c_btnbox li {display:table-cell; vertical-align:middle;}
.c_btnbox .c_btn {width:100% !important; margin-left:0}

.c_btn {border:1px solid #ccc; box-sizing:border-box; padding:0 20px; white-space:nowrap; color:#111; font-size:16px; display:flex; justify-content:center; align-items:center; flex-direction:row; height:48px; border-radius:8px; font-weight:500; gap:3px}
.c_btn img {height:24px;}

.c_btn.black {background:#111 !important; border-color:#111 !important; color:#fff !important;}
.c_btn.dark {background:#666 !important; border-color:#666 !important; color:#fff !important;}
.c_btn.light {background:#999 !important; border-color:#999 !important; color:#fff !important;}
.c_btn.color {background:var(--color-primary) !important; border-color:var(--color-primary) !important; color:#fff !important;}
.c_btn.red {background:#EA2222 !important; border-color:#EA2222 !important; color:#fff !important;}

.c_btn.black.line {color:#333 !important; background:#fff !important;}
.c_btn.dark.line {color:#666 !important; background:#fff !important;}
.c_btn.light.line {color:#999 !important; background:#fff !important;}
.c_btn.color.line {color:var(--color-primary) !important; background:#fff !important;}
.c_btn.red.line {color:#EA2222 !important; background:#fff !important;}




 /* 경고창/컨펌창 (공통) ======================================== */
.sy_Alert {position:fixed; left:0; top:0; width:100%; height:100%; z-index:10001; visibility:hidden; display:flex; justify-content:center; align-items:center; flex-direction:column; padding:25px; box-sizing:border-box;}
.sy_Alert .wrapping {background:#fff; border-radius:25px; z-index:2; box-sizing:border-box; padding:20px; width:100%; opacity:0; transform:translateY(100px); transition:all 900ms cubic-bezier(0.19, 1, 0.22, 1);; max-width:350px}
.sy_Alert .bg_close {position:fixed; left:0; top:0; width:100%; height:100%; z-index:1; background:rgba(0,0,0,0.6); opacity:0; transition:all 900ms cubic-bezier(0.19, 1, 0.22, 1);}
.sy_Alert .btn_close {height:40px; display:block; display:flex; justify-content:center; align-items:center; flex-direction:column;}
.sy_Alert .btn_close:before {content:""; width:50px; height:5px; background:#d3d3d3; display:inline-block; border-radius:100px;}

.sy_Alert .comment {text-align:center; color:#212121; font-size:16px; font-weight:500; line-height:1.4; margin-top:20px;}
.sy_Alert .comment .name {font-size:1.1em; font-weight:600; margin-bottom:5px;}
.sy_Alert .comment .highlight {color:var(--color-point); font-weight:600; display:inline}
.sy_Alert .comment div.highlight {display:block; margin-top:5px;}

.sy_Alert .bottom_ctrl {margin-top:40px;}
.sy_Alert .bottom_ctrl ul {display:flex; justify-content:center; align-items:center; flex-direction:row; gap:15px}
.sy_Alert .bottom_ctrl li {flex:1}
.sy_Alert .bottom_ctrl .btn {display:flex; justify-content:center; align-items:center; flex-direction:row; background:#f4f6fa; color:#888a93; border-radius:10px; height:50px; font-size:17px; font-weight:500; gap:2px}
.sy_Alert .bottom_ctrl .btn.type_ok {background:var(--color-primary); color:#fff;}
.sy_Alert .bottom_ctrl .btn.type_dark {background:var(--black); color:#fff;}
.sy_Alert .bottom_ctrl .btn strong {font-weight:700;}

.sy_Alert.type_bottom {justify-content:flex-end; padding:0px;}
.sy_Alert.type_bottom .wrapping {transform:translateY(100%); opacity:1; padding-bottom:30px;}
.sy_Alert.type_bottom .wrapping {border-bottom-left-radius:0; border-bottom-right-radius:0; padding-top:0px; transition:all 900ms cubic-bezier(0.19, 1, 0.22, 1);}

.sy_Alert.if_open {visibility:visible}
.sy_Alert.if_open .wrapping {transform:translateY(0); opacity:1;}
.sy_Alert.if_open .bg_close {opacity:1;}





 /* 팝업창 ======================================== */
.pop_payer {position:fixed; left:0; top:0; width:100%; height:100%; display:flex; justify-content: center; align-items: center; flex-direction:column; z-index:1000; box-sizing:border-box; visibility:hidden}
.pop_payer .wrapping {position:relative; z-index:2; background:#fff; width:500px; border-radius:10px; display:flex; justify-content: stretch; align-items: stretch; flex-direction:column; transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; opacity: 0; filter: alpha(opacity=0); -ms-filter:alpha(opacity=0); margin-bottom:-50px;}
.pop_payer .pop_tit {padding:20px; padding-bottom:15px; border-bottom:1px solid #f2f2f2; display:flex; justify-content: flex-start; align-items: center; flex-direction:row; gap:10}
.pop_payer .pop_tit strong {color:#111; font-size:17px; font-weight:700;}
.pop_payer .pop_tit .btn_close {width:25px; height:25px; margin-left:auto; background:transparent url('../images/todaypin/pop_close.svg') center center no-repeat; background-size:14px;}
.pop_payer .pop_conts {overflow-x:hidden; overflow-y:auto; padding:20px; font-size:13px; max-height:400px; box-sizing:border-box;}
.pop_payer .pop_confirm {display:flex; justify-content: center; align-items: center; flex-direction:row; gap:10px; padding:20px;}
.pop_payer .pop_confirm .btn_confirm {display:flex; justify-content: center; align-items: center; flex-direction:column; flex:1; border-radius:5px; box-sizing:border-box; border:1px solid #111; height:45px;}
.pop_payer .pop_confirm .btn_confirm {color:#111; font-size:13px; font-weight:500;}
.pop_payer .pop_confirm .btn_confirm.type_color {background:#111; color:#fff;}
.pop_payer .bg_close {position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:1; transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out;}
.pop_payer .bg_close {opacity: 0; filter: alpha(opacity=0); -ms-filter:alpha(opacity=0);}

.if_open_layer.pop_payer {visibility:visible}
.if_open_layer.pop_payer .bg_close {opacity: 1; filter: alpha(opacity=100); -ms-filter:alpha(opacity=100);}
.if_open_layer.pop_payer .wrapping {opacity: 1; filter: alpha(opacity=100); -ms-filter:alpha(opacity=100); margin-bottom:0px;}

@media screen and (max-width:900px) {
	.pop_payer {justify-content:flex-end}
	.pop_payer .wrapping {width:100%; border-radius:20px 20px 0 0;}
}






/* 슬라이드 ======================================== */
.AllMenu {overflow:hidden; position:fixed; left:0; top:0; z-index:101; width:100%; height:100%; visibility:hidden; display:flex; justify-content:stretch; align-items:flex-start; flex-direction:column;}
.AllMenu .wrapping {position:relative; z-index:2; background:#fff; overflow-y:auto; transform:translateX(-100%); height:100%; flex:1; box-sizing:border-box; padding:50px 0 100px; display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; transition:all 900ms cubic-bezier(0.19, 1, 0.22, 1); color:#111; width:100%; max-width:320px;}
.AllMenu .bg_close {position:fixed; left:0; top:0; transition:all 0.2s ease-out; -webkit-transition:all 0.2s ease-out; width:100%; height:100%; z-index:1; background:rgba(0,0,0,0.3); opacity:0; pointer-events:none;}

.AllMenu .my_info {padding:0 20px;}
.AllMenu .my_info .before {display:flex; justify-content:flex-start; align-items:center; flex-direction:row}
.AllMenu .my_info .btn_tx {font-size:16px; font-weight:600; line-height:1; padding:5px 0; position:relative;}
.AllMenu .my_info .btn_tx+ .btn_tx {padding-left:11px; margin-left:10px;}
.AllMenu .my_info .btn_tx+ .btn_tx:before {content:""; width:1px; height:14px; background:#ECECEC; position:absolute; left:0; top:50%; transform:translateY(-50%);}
.AllMenu .my_info .after {font-size:18px; line-height:1.5; font-weight:500;}
.AllMenu .my_info .after strong {font-weight:700;}
.AllMenu .my_info .after .order_today {color:#000; font-weight:700; text-transform:uppercase}

.AllMenu .my_menu {margin-top:15px; display:flex; justify-content:space-around; align-items:center; flex-direction:row; gap:15px}
.AllMenu .my_menu .link {display:flex; justify-content:center; align-items:center; flex-direction:column; padding:10px 0;}
.AllMenu .my_menu .link .tx {font-size:14px; font-weight:500; margin-top:10px; line-height:1;}
.AllMenu .my_menu .link .picto {border:0.8px solid #eee; border-radius:100px; display:flex; justify-content:center; align-items:center; flex-direction:column; width:55px; height:55px;}
.AllMenu .my_menu .link .picto img {height:28px; vertical-align:middle;}

.AllMenu .sitemap {border-top:0.8px solid #eee; padding:0 20px; padding-top:20px; margin-top:20px;}
.AllMenu .sitemap .menu {display:flex; justify-content:flex-start; align-items:center; flex-direction:row; padding:10px 0;}
.AllMenu .sitemap .menu .tx {font-size:16px; line-height:1; font-weight:500; flex:1; display:flex; justify-content:center; align-items:flex-start; flex-direction:column;}
.AllMenu .sitemap .menu .picto {width:26px; position:relative; margin-right:10px;}
.AllMenu .sitemap .menu .picto img {width:26px; vertical-align:middle}
.AllMenu .sitemap .menu .guide {font-size:0.82em; margin-top:5px; font-weight:300;}
.AllMenu .sitemap .menu .guide.newest {color:#9d9d9d;}
.AllMenu .sitemap .menu .guide.update {color:var(--color-point);}
.AllMenu .sitemap li.this_version .menu {align-items:flex-start;}
.AllMenu .sitemap li.this_version .menu .tx {margin-top:px;}
.AllMenu .sitemap .count_number {position:absolute; right:-5px; top:-3px; background:var(--color-point); color:#fff; z-index:10; font-weight:700; font-size:10px; min-width:15px; height:15px; border-radius:100px;}
.AllMenu .sitemap .count_number {display:flex; justify-content:center; align-items:center; flex-direction:column;}

.AllMenu .HomeQuick {padding:0 20px; margin-top:20px; gap:8px}

.AllMenu.if_open {visibility:visible}
.AllMenu.if_open .wrapping {transform:translateX(0);}
.AllMenu.if_open .bg_close {opacity:1; pointer-events:initial}



/* 앱세팅 ======================================== */
.p_Setting {overflow:hidden; position:fixed; left:0; top:0; z-index:101; width:100%; height:100%; visibility:hidden; display:flex; justify-content:stretch; align-items:flex-end; flex-direction:column;}
.p_Setting .wrapping {position:relative; z-index:2; background:#fff; overflow-y:auto; transform:translateX(100%); height:100%; flex:1; box-sizing:border-box; display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; transition:all 900ms cubic-bezier(0.19, 1, 0.22, 1); color:#111; width:100%; max-width:450px;}
.p_Setting .bg_close {position:fixed; left:0; top:0; transition:all 0.2s ease-out; -webkit-transition:all 0.2s ease-out; width:100%; height:100%; z-index:1; background:rgba(0,0,0,0.3); opacity:0; pointer-events:none;}

.p_Setting .set_list {overflow-y:auto; flex:1; padding-bottom:100px; box-sizing:border-box;}
.p_Setting .set_list li {border-bottom:0.8px solid #eee; display:flex; justify-content:flex-end; align-items:center; flex-direction:row; flex-wrap:wrap; min-height:75px; padding:0 20px; position:relative;}
.p_Setting .set_list .option {color:#000; font-size:16px; font-weight:500; margin-right:auto; height:75px; display:flex; justify-content:center; align-items:flex-start; flex-direction:column;}
.p_Setting .set_list .add_text {font-size:0.75em; margin-top:2px; color:#999;}
.p_Setting .set_list .add_text.newest {color:#9d9d9d;}
.p_Setting .set_list .add_text.update {color:var(--color-point);}
.p_Setting .set_list .btn_go {width:40px; height:40px; display:flex; justify-content:center; align-items:flex-end; flex-direction:column;}
.p_Setting .set_list .btn_go:before {content:""; width:15px; height:15px; background:transparent url('../images/main_renew/bundle_arrow_down.svg') center center no-repeat; background-size:15px;}
.p_Setting .set_list .btn_go:before {transition:all 0.2s ease-out; -webkit-transition:all 0.2s ease-out; transform:rotate(-90deg); -webkit-transform:rotate(-90deg);}
.p_Setting .set_list .btn_go.none {opacity:0.2;}
.p_Setting .set_list .upper_link {height:75px;}

.p_Setting label.reciev {padding-left:0px !important; flex-direction:row-reverse; margin-left:auto; height:30px;}
.p_Setting label.reciev input {position:absolute; left:0; top:0; opacity:0;}
.p_Setting label.reciev .checkbox {margin-left:auto; height:30px; width:70px; border-radius:100px; background:#F8F8F8; position:relative;}
.p_Setting label.reciev .bullet {position:absolute; left:5px; top:50%; transform:translateY(-50%); width:22px; height:22px; border-radius:100px; box-shadow:0px 2px 4px 0px rgba(0, 0, 0, 0.25); background:#959595;}
.p_Setting label.reciev .bullet {transition:all 0.2s ease-out; -webkit-transition:all 0.2s ease-out; z-index:2}
.p_Setting label.reciev em {font-size:13px; height:30px; display:flex; justify-content:center; align-items:center; flex-direction:column; position:absolute; top:0;}
.p_Setting label.reciev em {transition:all 0.2s ease-out; -webkit-transition:all 0.2s ease-out; color:#000; font-weight:500;}
.p_Setting label.reciev em.off {right:10px;}
.p_Setting label.reciev em.on {left:13px; color:var(--color-primary); opacity:0; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0);}
.p_Setting label.reciev input:checked+ .checkbox .bullet {background:var(--color-primary); left:42px}
.p_Setting label.reciev input:checked+ .checkbox em.off {opacity:0; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0);}
.p_Setting label.reciev input:checked+ .checkbox em.on {opacity:1; filter:alpha(opacity=100); -ms-filter:alpha(opacity=100);}

.p_Setting .open_info {background:#f5f5f5; width:100%; padding:15px; margin-bottom:15px; border-radius:5px; font-size:11px; display:none;}
.p_Setting .open_info dl {display:flex; justify-content:flex-start; align-items:center; flex-direction:row;}
.p_Setting .open_info dl+ dl {border-top:1px dashed #e5e5e5; margin-top:5px; padding-top:5px;}
.p_Setting .open_info dt {flex:none; width:100px; color:#888; font-size:0.95em;}
.p_Setting .open_info dd {flex:1; word-wrap:break-word; word-break:keep-all; white-space:normal; color:#000;}
.p_Setting .open_info dd * {display:inline}

.p_Setting .set_list li.this_company.if_open .open_info {display:block;}
.p_Setting .set_list li.this_company.if_open .btn_go:before {transform:rotate(-360deg); -webkit-transform:rotate(-360deg);}
.p_Setting.if_open {transform:translateX(0);}

.p_Setting.if_open {visibility:visible}
.p_Setting.if_open .wrapping {transform:translateX(0);}
.p_Setting.if_open .bg_close {opacity:1; pointer-events:initial}


/* 서브탑 ========================================= */
.p_Subtop {display:flex; justify-content:stretch; align-items:center; flex-direction:row; background:#fff; z-index:100; position:relative; flex:none; padding-top:var(--safe-top);}
.p_Subtop .side {width:60px; display:flex; justify-content:center; align-items:center; flex-direction:row}
.p_Subtop .title {color:#000; font-size:19px; font-weight:700; height:70px; display:flex; justify-content:center; align-items:flex-start; flex-direction:column; flex:1; padding-left:20px;}
.p_Subtop .btn {width:60px; height:60px; background-position:center center; background-size:20px auto !important; background-repeat:no-repeat;}
.p_Subtop .btn.btn_back {background-image:url('../images/main_renew/top_ic_back.svg?v=1');}
.p_Subtop .btn.btn_close {background-image:url('../images/main_renew/top_ic_close.svg'); background-size:15px !important;}
.p_Subtop.if_stick {position:sticky; top:0; }





/* 플라잉 버튼 =============================================================================  */
.FixFloat {position:fixed; right:15px; bottom:20px; z-index:98; display:flex; justify-content:center; align-items:center; flex-direction:column; gap:15px}
.FixFloat.if_hide {display:none;}
.FixFloat .btn_link {display:flex; justify-content:center; align-items:center; flex-direction:row; gap:5px; background:#fff; border-radius:100px; padding-right:10px; box-shadow:3px 3px 5px rgba(0,0,0,0.15); box-sizing:border-box;}
.FixFloat .btn_link img {height:36px; display:block;}
.FixFloat .btn_link strong {color:#222; font-weight:500; font-size:13px;}

@media (max-width:600px) {
	.FixFloat {bottom:75px}
}


/* 하단 고정메뉴 FixMenu =============================================================================  */
.FixMenu {display:none; position:fixed; left:0; right:0; bottom:0; z-index:100; background-color:#fff; border-top:1px solid #eee;}
.FixMenu .one_menu {flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; color:#999; text-decoration:none; border:none; background:none; padding:0; cursor:pointer; font-family:inherit; height:65px;}
.FixMenu .one_menu.hit {color:#000;}
.FixMenu .one_menu img {width:20px; height:20px; display:block; filter:invert(59%) sepia(0%) saturate(0%) brightness(95%);}
.FixMenu .one_menu.hit img {filter:none;}
.FixMenu .one_menu .label {font-size:13px; font-weight:600; line-height:1;}
.FixMenu.if_hide {display:none !important;}

@media (max-width:900px) {
	.FixMenu {display:flex;}
}





/* 카테고리 레이어 =============================================================================  */
.AllCategory {overflow:hidden; position:fixed; left:0; top:0; z-index:101; width:100%; height:100%; visibility:hidden; display:flex; justify-content:stretch; align-items:flex-end; flex-direction:column;}
.AllCategory .wrapping {position:relative; z-index:2; background:#fff; overflow-y:auto; transform:translateX(100%); height:100%; flex:1; box-sizing:border-box; display:flex; justify-content:flex-start; align-items:stretch; flex-direction:column; transition:all 900ms cubic-bezier(0.19, 1, 0.22, 1); color:#111; width:100%; max-width:300px;}
.AllCategory .bg_close {position:fixed; left:0; top:0; transition:all 0.2s ease-out; -webkit-transition:all 0.2s ease-out; width:100%; height:100%; z-index:1; background:rgba(0,0,0,0.3); opacity:0; pointer-events:none;}

.AllCategory .card_title {display:flex; align-items:center; gap:8px; height:24px; font-size:20px; font-weight:600; color:#111; flex:none; padding:20px;}
.AllCategory .card_title img {width:24px; height:24px; flex:none; display:block;}
.AllCategory .card_title strong {flex:1}
.AllCategory .card_title em {display:none;}
.AllCategory .btn_close {width:30px; aspect-ratio:1/1; background:url('../images/icon_close.svg') center center / 18px no-repeat; margin-left:auto;}

.AllCategory .card_list {display:flex; flex-direction:column; gap:24px; flex:1; padding:24px;  border-top:1px solid #eee; overflow-y:auto;}
.AllCategory .card_list::-webkit-scrollbar {width:4px;}
.AllCategory .card_list::-webkit-scrollbar-thumb {background-color:rgba(0,0,0,0.3);; border-radius:100px;}
.AllCategory .card_list::-webkit-scrollbar-track {background-color:transparent;}
.AllCategory .card_list li {position:relative; display:flex; align-items:center; gap:10px; height:40px; color:#333;}
.AllCategory .card_list .logo {flex:none; width:40px; height:40px; border:1px solid #EEE; border-radius:100px; overflow:hidden; box-sizing:border-box;}
.AllCategory .card_list .logo img {width:100%; height:100%; object-fit:cover; display:block;}
.AllCategory .card_list .name {flex:1; font-size:15px; font-weight:500; letter-spacing:-0.01em; color:#333; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:1; -webkit-box-orient:vertical; display:-webkit-box;}
.AllCategory .card_list .rate {flex:none; font-size:15px; font-weight:600; letter-spacing:-0.01em; color:var(--color-primary); max-width:60px}
.AllCategory .card_list .count {flex:none; font-size:14px; font-weight:500; letter-spacing:-0.01em; color:#999; }

.AllCategory.if_open {visibility:visible}
.AllCategory.if_open .wrapping {transform:translateX(0);}
.AllCategory.if_open .bg_close {opacity:1; pointer-events:initial}




/* 내용없음 */
.c_none {display:flex; justify-content:center; align-items:center; flex-direction:column; font-size:15px; color:#999; padding:30px 0; text-align:center; line-height:1.5;}
.c_none .sub_txt {font-size:13px; color:#999; margin-top:10px;}






/* 레이어 =============================================================================  */
.LayerSet {position:fixed; left:0; top:0; width:100%; height:100%; z-index:1000; display:flex; justify-content:flex-end; align-items:stretch; flex-direction:column; visibility:hidden; pointer-events:none;}
.LayerSet .bg_close {position:absolute; left:0; top:0; width:100%; height:100%; z-index:1; background:rgba(0,0,0,0.3); opacity:0; pointer-events:none; transition:all 0.3s ease-out;}
.LayerSet .wrapping {position:relative; z-index:2; width:100%; max-width:480px; margin:0 auto; background:#fff; border-radius:16px 16px 0 0; box-shadow:0 8px 20px 0 rgba(25,31,40,0.04); box-sizing:border-box; padding:16px; display:flex; flex-direction:column; gap:16px; transform:translateY(100%); transition:all 900ms cubic-bezier(0.19, 1, 0.22, 1);}

.LayerSet .layer_head {display:flex; align-items:center; gap:16px; height:23px;}
.LayerSet .layer_head .title {flex:1; font-size:16px; font-weight:600; color:#111;}
.LayerSet .layer_head .btn_close {flex:none; width:20px; height:20px; background:url('../images/icon_close.svg') center center / 20px no-repeat;}
.LayerSet .option_list {display:flex; flex-direction:column; gap:10px;}
.LayerSet .option_btn {display:flex; align-items:center; gap:8px; height:48px; padding:0 16px; border:1px solid #eee; border-radius:8px; background:#fff; box-sizing:border-box; font-size:15px; font-weight:500; color:#111;}
.LayerSet .option_btn .name {flex:1;}
.LayerSet .option_btn .state {flex:none; font-size:14px; font-weight:500; color:var(--color-primary);}
.LayerSet .option_btn.hit {border-color:var(--color-primary); background:color-mix(in srgb, var(--color-primary) 7%, transparent); color:var(--color-primary);}
.LayerSet .layer_foot {display:flex; align-items:center; gap:10px;}
.LayerSet .layer_foot .btn_reset {flex:1; display:flex; align-items:center; justify-content:center; height:48px; border:1px solid #eee; border-radius:8px; background:#fff; box-sizing:border-box; font-size:15px; font-weight:500; color:#777;}
.LayerSet .layer_foot .btn_apply {flex:1; display:flex; align-items:center; justify-content:center; height:48px; border-radius:8px; background:var(--color-primary); box-sizing:border-box; font-size:15px; font-weight:500; color:#fff;}
.LayerSet.if_open {visibility:visible; pointer-events:initial;}
.LayerSet.if_open .bg_close {opacity:1; pointer-events:initial;}
.LayerSet.if_open .wrapping {transform:translateY(0);}