
/*----------------------------------------------------------------------------------------------------------------------
[ WINNERSTEL ]

A. Default
B. Layout
C. Login
D. Main
E. Sub
F. Self
G. Components
H. etc
I. Media Query
-----------------------------------------------------------------------------------------------------------------------*/

:root {
    --n-primary: #E60012; /* WINNERS main color */
    --n-primary-hover: #AF0512;
    --n-primary-dark: #500006;
    --n-primary-light: #FFE6E8;
    
    --n-secondary: #03328D;
    --n-secondary-light: #F1F6FE;
    
    --n-orange: #FF9461;
    
    --n-lightGreen: rgba(1, 175, 2, 0.04);
    --n-lightPink: #FFF6FB;
    --n-lightPurple: #F3F6FB;
    
    /* color :: gray */
    --n-gray-50: #FAFAFA;
    --n-gray-100: #F4F4F5;
    --n-gray-200: #E4E4E7;
    --n-gray-300: #D4D4D8; /* disabled */
    --n-gray-400: #A1A1AA;
    --n-gray-500: #71717A; /* light */
    --n-gray-600: #52525B;
    --n-gray-700: #3F3F46; /* normal */
    --n-gray-800: #27272A;
    --n-gray-900: #18181B; /* dark */
	
	/* color :: filter */
    --n-filter-primary: brightness(0) saturate(100%) invert(20%) sepia(97%) saturate(5488%) hue-rotate(347deg) brightness(84%) contrast(120%);
    --n-filter-white: invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%);
    --n-filter-disabled: brightness(0) saturate(100%) invert(90%) sepia(4%) saturate(150%) hue-rotate(202deg) brightness(94%) contrast(94%);
    --n-filter-gray4: brightness(0) saturate(100%) invert(65%) sepia(11%) saturate(158%) hue-rotate(201deg) brightness(98%) contrast(92%);
    --n-filter-gray5: brightness(0) saturate(100%) invert(46%) sepia(1%) saturate(2386%) hue-rotate(202deg) brightness(95%) contrast(82%);
    --n-filter-gray6: brightness(0) saturate(100%) invert(32%) sepia(9%) saturate(398%) hue-rotate(201deg) brightness(93%) contrast(91%);
    --n-filter-gray7: brightness(0) saturate(100%) invert(24%) sepia(10%) saturate(379%) hue-rotate(201deg) brightness(93%) contrast(91%);
    --n-filter-gray9: brightness(0) saturate(100%) invert(6%) sepia(5%) saturate(1444%) hue-rotate(202deg) brightness(94%) contrast(91%);
    --n-filter-secondary: brightness(0) saturate(100%) invert(11%) sepia(96%) saturate(4338%) hue-rotate(220deg) brightness(74%) contrast(98%);
    --n-filter-orange: brightness(0) saturate(100%) invert(76%) sepia(17%) saturate(2975%) hue-rotate(317deg) brightness(101%) contrast(101%);
    
    --n-filter-red: brightness(0) saturate(100%) invert(26%) sepia(64%) saturate(5360%) hue-rotate(348deg) brightness(96%) contrast(97%);
    
    --n-primary-shadow: rgba(230, 0, 18, 0.3);
    
    /* border radius */
    --border-radius-s: ;
    --border-radius-d: ;
    --border-radius-lg: ;
}

/***********************************************************************************************************************
  A. Default
***********************************************************************************************************************/
* {line-height: 150%; letter-spacing: -.2px;}

html, body {height: 100%;}

html {font-size: 62.5%;}

body {font-family: 'Spoqa Han Sans Neo', 'Noto Sans KR', sans-serif; box-sizing: border-box; display: flex; flex-direction: column; justify-content: space-between;}

a {text-decoration: none;}
a:not([href]):hover {cursor: pointer;}

button {border: none; border-radius: .6rem;}
button:disabled, button:disabled:hover {background-color: var(--n-gray-400);}

/* input custom */
input[type="text"], input[type="password"], input[type="number"],input[type="date"], 
input[type="email"], textarea, select.form-select {width: 100%; height: 4.8rem; padding: 0 1.2rem; font-size: 1.4rem; color: var(--n-gray-700); border: 1px solid var(--n-gray-200); border-radius: .6rem;}
textarea {padding: 1.2rem;}
select.form-select {background-image: url(../svg/select-down.svg); background-position: right 1.2rem center; background-size: 1.6rem 1.6rem;}
input:focus, textarea:focus, select:focus,
.form-select:focus {border-color: var(--n-gray-900); box-shadow: none; outline: 0;}

input[type="text"]::placeholder, input[type="password"]::placeholder,input[type="number"]::placeholder,
input[type="date"]::placeholder, input[type="email"]::placeholder, textarea::placeholder {color: var(--n-gray-400)}

input[type="checkbox"], input[type="radio"] {position: relative; top: 0; width: 1.8rem; height: 1.8rem; margin-top: .1em; margin-right: .3rem; border: 1px solid var(--n-gray-300); border-radius: .6rem;}
input:checked[type="checkbox"], input:checked[type="radio"] {background-color: var(--n-gray-900); border-color: var(--n-gray-900);}
.form-check-input:checked[type=checkbox] {background-image: url(../svg/checkbox-check.svg);}
.form-check-input:checked[type=radio] {background-image: url(../svg/radio-check.svg);}
.form-check {padding-left: 2.6rem;}
.form-check .form-check-input {margin-left: -2.6rem;}
.form-check-input:focus {border-color: var(--n-gray-900); box-shadow: none;}

input[readonly], textarea[readonly], input:disabled, textarea:disabled,
.form-control:disabled, .form-select:disabled {color: var(--n-gray-700); background-color: var(--n-gray-200); pointer-events: none;}
input[type="radio"]:disabled + label, input[type="checkbox"]:disabled + label {color: var(--n-gray-300);}
input[type="checkbox"]:read-only, input[type="radio"]:read-only {background-color: #fff; pointer-events: inherit;}
input:checked:read-only {background-color: var(--n-gray-900) !important; pointer-events: inherit;}

input:-webkit-autofill, input:-webkit-autofill:hover {transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out; -webkit-transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out; background-color: #fff !important; box-shadow: inset 0 0 0 1000px white; -webkit-box-shadow: 0 0 0 1000px white inset;}
input:-webkit-autofill:focus, input:-webkit-autofill:active {transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out; -webkit-transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out; background-color: #fff !important; box-shadow: inset 0 0 0 1000px white, 0 0 0 0.25rem rgba(13, 110, 253, 0.25); -webkit-box-shadow: 0 0 0 1000px white inset, 0 0 0 0.25rem rgba(13, 110, 253, 0.25);}
input:-internal-autofill-selected {background-color: #fff}
input:-webkit-autofill:read-only {background-color: var(--n-gray-200) !important; box-shadow: inset 0 0 0 1000px #eaeaea; -webkit-box-shadow: 0 0 0 1000px var(--n-gray-200) inset; pointer-events: none;}

ul {list-style: none; padding: 0; margin: 0;}

h1, h2, h3, h4, h5, p, span {margin: 0;}

hr {border-color: var(--n-gray-500);}

pre {font-family: 'Noto Sans KR', sans-serif; white-space: pre-wrap;}



/***********************************************************************************************************************
  B. Layout
***********************************************************************************************************************/
/* -- container */
.container {min-width: 320px; max-width: unset; margin: 0 auto; padding: 0 2rem;}
.container_filter {min-width: 320px; padding: 0 2rem; margin-bottom: 1.6rem; overflow: hidden;}

/*-------------------------------------------
  -- header
-------------------------------------------*/
.header_wrap {border-bottom: 1px solid var(--n-gray-200); background-color: #fff; transition: All 0.2s ease;}
.header_wrap.transparent {border-bottom: 0;}
.header_content {display: flex; align-items: center; justify-content: space-between; padding: 1.2rem 0;}

.header .logo img {max-height: 3.2rem;}
.header .icons, .header .icons {text-align: right;}
.header .icons_item {padding: 0; margin: 0; margin-left: .8rem; background-color: transparent;}
.header .icons_item img {width: 2.8rem; height: auto;}

.header .pc_wrap {display: none;}

/* popup */
.header_popup .header_content {height: 5.6rem;}
.header_popup .head {font-size: 2rem;}
.header_popup .icons_item {padding: 0; margin: 0; margin-left: .8rem; background-color: transparent;}
.header_popup .icons_item img {width: 2.8rem; height: auto;}


/*-------------------------------------------
  -- sub header(셀프개통 단계)
-------------------------------------------*/
.sub_header {top: 5.6rem; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; width: calc(100% + 4rem); padding: 1.2rem 2rem; margin: 0 -2rem; margin-bottom: 2.4rem; background-color: #fff;}
.body_wrap_agent.self_wrap .sub_header {top: 0;}
.sub_header .title {font-size: 1.5rem; font-weight: 600; color: var(--n-gray-500);}
.sub_header_step {display: flex; justify-content: end; align-items: center; gap: .8rem; font-size: 1.3rem; font-weight: 500;}
.sub_header_step li {display: inline-flex; align-items: center; gap: .4rem; color: var(--n-gray-900);}
.sub_header_step li img {width: 1.4rem; height: 1.4rem; filter: var(--n-filter-disabled);}
.sub_header_step li img.on {width: 1.8rem; height: 1.8rem; filter: var(--n-filter-secondary);}

/*-------------------------------------------
  -- fullmenu (모바일 전체메뉴)
-------------------------------------------*/
.full_menu_wrap {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #fff; overflow: auto; z-index: 9999; display: none;}
.full_menu_header {height: 5.6rem; background-color: #fff;}
.full_menu_header .icons {display: flex; justify-content: end; height: 100%; margin-left: auto;}
.full_menu_body {height: 100%; padding-top: 5.6rem;}

/* fullmenu - top */
.full_menu_sign {padding: 2rem 0;}
.full_menu_sign .title {position: relative; font-size: 1.8rem; font-weight: 500; color: var(--n-gray-900);}
.full_menu_sign .title::after {content: ''; position: absolute; top: 50%; right: -2rem; transform: translateY(-50%); width: 1.6rem; height: 1.6rem; background: url(../svg/chevron-right.svg) no-repeat center/100%;}

.full_menu_sign .service_list {margin-top: 1.6rem;}
.full_menu_sign .service_list ul {display: inline-flex; width: 100%; padding: 1.2rem; border: 1px solid var(--n-gray-200); border-radius: .8rem;}
.full_menu_sign .service_list ul li {flex: 1; text-align: center;}
.full_menu_sign .service_list ul li + li {border-left: 1px solid var(--n-gray-200);}
.full_menu_sign .service_list ul li a {display: inline-block; width: 100%; font-size: 1.4rem; color: var(--n-gray-500);}

/* fullmenu - body */
.full_menu_content {padding: 2.4rem 0; background-color: var(--n-gray-100);}
.full_menu_content .menu_list li {padding: 1.6rem 0 ;}
.full_menu_content .menu_list li:last-child {border-bottom: 0;}
.full_menu_content .menu_list li a {font-size: 1.5rem; font-weight: 700; color: var(--n-gray-900);}
.full_menu_content .sub_list {display: flex; flex-wrap: wrap; margin-top: .8rem;}
.full_menu_content .sub_list li {width: 50%; padding: .4rem 0; border-bottom: none;}
.full_menu_content .sub_list li a {font-weight: 400; color: var(--n-gray-500);}
.full_menu_content .menu_list li a:hover, .full_menu_content .sub_list li a:hover {color: var(--n-primary);} 
.full_menu_content .menu_list li a:not([href]):hover, .full_menu_content .sub_list li a:not([href]):hover {color: Inherit}

.full_menu_logout {padding-top: 2.4rem; margin-top: .8rem; border-top: 1px solid var(--n-gray-200);}


/*-------------------------------------------
  -- body
-------------------------------------------*/
.body_wrap, .body_wrap_popup, .body_wrap_popup_t2 {height: auto; padding-top: calc(5.6rem + 2.4rem);}
.body_wrap_popup_t2 {padding-bottom: 80px;}
.body_wrap_agent {padding-top: 2.4rem;}

.sub_wrap {max-width: 802px; margin: 0 auto;}

/*-------------------------------------------
  -- nav
-------------------------------------------*/
.gnb_wrap {line-height: 8rem; display: none;}
.gnb {justify-content: end; gap: 4rem;}
.gnb li {position: relative; padding: 1.6rem 0; font-size: 1.8rem; font-weight: 500; text-align: right;}
.gnb li a {display: block; color: var(--n-gray-700);}
.gnb li a:hover {color: var(--n-primary);}

/* snb */
.snb {position: absolute; top: 90%; left: 0; width: 180px; padding: 1.6rem 2.4rem; border: 1px solid var(--n-gray-300); border-radius: 1.2rem; background-color: #fff; display: none;}
.snb li{padding: .8rem 0; margin-left: 0; text-align: left; line-height: 1.5;}
.snb li + li {padding-top: 1rem;}
.snb li a{font-size: 1.5rem; font-weight: 400; color: var(--n-gray-500);}
.snb li a:hover{color: var(--n-primary);}
.gnb li a:not([href]):hover, .snb li a:not([href]):hover {color: Inherit}
.gnb > li:hover > .snb {display: block;}

/* submenu (top util) */
.submenu {align-items: center; justify-content: right; text-align: right; gap: 2.4rem; display: none;}
.submenu a {position: relative; font-size: 1.4rem; color: var(--n-gray-500); text-decoration: none;}

/*-------------------------------------------
  -- footer
-------------------------------------------*/
footer {background-color: #F8F9FC; margin-top: 4rem;}

.footer_top {padding-top: 3.2rem;}
.footer_top .policy_list {display: flex; gap: 1.2rem 0; font-size: 1.3rem; font-weight: 500; }
.footer_top .policy_list li {position: relative; padding-right: 1.2rem; margin-right: 1.2rem;}
.footer_top .policy_list li::after {content: ''; position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: .1rem; height: 1rem; background-color: var(--n-gray-300);}
.footer_top .policy_list li:last-child {padding-right: 0; margin-right: 0;}
.footer_top .policy_list li:last-child::after {display: none;}
.footer_top .policy_list li a {color: var(--n-gray-700);}

.footer_bottom {position: relative; padding-bottom: 4rem; margin-top: 2.4rem;}
.footer_bottom img {height: 2rem;}
.footer_bottom .company_info {width: 100%; margin-top: 1.6rem; font-size: 1.3rem; color: var(--n-gray-500);}
.footer_bottom .company_info ul + ul {margin-top: 1.6rem;}
.footer_bottom .company_info ul li {position: relative; line-height: 137.5%;}
.footer_bottom .company_info ul li + li {margin-top: .8rem;}
.footer_bottom .company_info ul li span {font-weight: 700;}

.emblem_list {font-size: 1.2rem; color: var(--n-gray-400);}
.emblem_list li {position: relative; display: flex; gap: .8rem; align-items: center;}
.emblem_list .img_wrap {display: inline-flex; align-items: center; justify-content: center; width: 5rem; height: 5rem;}
.emblem_list .img_wrap img {width: 100%; height: auto;}
.emblem_list li > a {position: absolute; display: inline-block; width: 100%; height: 100%;}

.copyright {margin-top: 2.4rem; font-size: 1.3rem; color: var(--n-gray-500);}

/*-------------------------------------------
  -- preview bottom
-------------------------------------------*/
.preview_wrap {width: 100%; background-color: #fff;}
.preview_header {padding: 2rem 0; border-radius: 1.2rem 1.2rem 0 0; background-color: var(--n-gray-900); box-shadow: 0px -2px 16px rgba(0,0,0,.15);}
.preview_header .inner {max-width: 1200px; display: flex; justify-content: space-between; align-items: center; padding: 0 2rem; margin: 0 auto;}
.preview_header .head {font-size: 1.5rem; font-weight: 700; color: #fff;}
.preview_header .n_btn_icon {width: 2rem; height: 2rem; padding: 0; background-repeat: no-repeat; background-position: center; background-size: 100%; background-color: transparent; filter: var(--n-filter-gray4);}
.preview_header .n_btn_icon.open {background-image: url(../svg/chevron-up.svg);}
.preview_header .n_btn_icon.close {background-image: url(../svg/chevron-down.svg);}
.preview_body {padding: 1.6rem 0 4rem 0; background-color: #fff;}
.preview_body .inner {max-width: 1200px; padding: 0 2rem; margin: 0 auto;}
.preview_body .price_info {padding: 2rem; border-radius: .8rem; background-color: var(--n-secondary-light);}
.preview_body .price_info .title {font-size: 1.3rem; font-weight: 500; color: var(--n-gray-700);}
.preview_body .price_info .price {margin-top: 1.6rem; font-size: 1.6rem; font-weight: 700; color: var(--n-primary); text-align: right;}
.preview_body .price_info .price .ref {font-size: 1.3rem; font-weight: 400; color: var(--n-gray-500);}
.preview_body .order_info {margin-top: 1.2rem;}

/* preview bottom - product */
.product_bottom_preview {padding-top: 2rem; margin-bottom: -4rem;}
.product_bottom_preview .preview_wrap {max-width: 1080px; width: 100%; background: #fff; border-radius: 2rem 2rem 0 0; box-shadow: 0px -2px 16px rgba(0,0,0,.2);}
.product_bottom_preview .preview_header .content {display: flex; flex-direction: column;}
.product_bottom_preview .preview_header .head {margin-bottom: 1rem; font-size: 1.4rem; font-weight: 700; color: var(--n-gray-900);}
.product_bottom_preview .preview_header .head span {font-size: 1.8rem;}
.product_bottom_preview .preview_header .n_btn_icon {width: 1.8rem; height: 1.8rem; transform: translateY(-50%);}
.product_bottom_preview .preview_header .n_btn_icon.open {background: url(../svg/chevron-up-solid.svg) no-repeat center center; background-size: contain; filter: var(--n-filter-white);}
.product_bottom_preview .preview_header .n_btn_icon.close {background: url(../svg/chevron-down-solid.svg) no-repeat center center; background-size: contain; filter: var(--n-filter-white);}
.product_bottom_preview .preview_body {padding: 0 0 4rem 0;}
.product_bottom_preview .preview_body .order_list {margin-top: 0; padding-top: 0; border-top: none; }
.product_bottom_preview .preview_body .order_list + .order_list {margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid #e6e6e6;}
.product_bottom_preview .preview_body .order_list li {display: flex;}
.product_bottom_preview .preview_body .order_list li:first-child {font-weight: 700; color: var(--n-gray-900);}
.product_bottom_preview .preview_body .order_list .title {font-weight: 400;}
.product_bottom_preview .preview_body .order_list li + li {padding-top: 1rem;}

/*-------------------------------------------
  -- board
-------------------------------------------*/
.board {font-size: 1.4rem; color: var(--n-gray-800);}
.board .board_head {padding: 2rem 0;}
.board .board_head .title {font-size: 2rem; font-weight: 700; color: var(--n-gray-900);}
.board .board_head .date {font-size: 1.4rem; color: var(--n-gray-500);}
.board .board_head .date span {margin-right: .4rem; font-weight: 500;}
.board .board_content {padding: 2rem 0; overflow-x: auto;}
.board .board_content > pre {font-size: 1.4rem;}
.board .board_content img {width: 100%; max-width: 100%; height: auto;}
.board_page {border-top: 1px solid var(--n-gray-900); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.board_page .page_item {display: flex; align-items: center; padding: 1.6rem 1rem; border-bottom: 1px solid var(--n-gray-200); }
.board_page .page_item .head {color: var(--n-gray-500);}
.board_page .page_link {display: inline; padding-left: 1.6rem; color: var(--n-gray-900);}
.board_page .page_link:hover {color: var(--n-gray-900);}

.modal-body .board .board_content {padding: 0;}

.modal_board {}
.modal_board .board_content {margin-bottom: 2.4rem;}
.modal_board .title {font-size: 1.6rem; font-weight: 500; color: var(--n-gray-900);}
.modal_board .content {margin-top: .8rem; font-size: 1.4rem; color: var(--n-gray-700); line-height: 175%; word-break: keep-all;}

/*-------------------------------------------
  -- popup (main layer popup)
-------------------------------------------*/
.ui-dialog {border-radius: 1.2rem; z-index: 1040 !important ; filter: drop-shadow(0px 8px 8px rgba(0,0,0,.35));}
.ui-dialog-titlebar {padding: 2rem; border-radius: 1.2rem 1.2rem 0 0; background-color: #fff;}
.ui-dialog-titlebar span {font-size: 1.6rem; font-weight: 500; color: var(--n-gray-900);}
.ui-dialog-titlebar button {display: none;}
.hide-title-bar .ui-dialog-titlebar { display: none;}
.main_pop_layer .pop_content {padding: 0; overflow: auto; background-color: #fff; -ms-overflow-style: none;}
.main_pop_layer .pop_content::-webkit-scrollbar {display: none;}
.main_pop_layer .pop_content img {width: 100%; height: auto;}
.main_pop_layer .pop_footer {display: flex; align-items: center; padding: 2rem; border-radius: 0 0 1.2rem 1.2rem; background-color: var(--n-gray-900);}
.main_pop_layer .pop_footer input[type="checkbox"] {margin-right: .4rem;}
.main_pop_layer .pop_footer input:checked[type="checkbox"] {background-color: var(--n-primary); border-color: var(--n-primary);}
.main_pop_layer .pop_footer .form-check-input:checked[type=checkbox], .main_pop_layer .pop_footer input:checked:read-only {background-color: var(--n-primary) !important;}
.main_pop_layer .pop_footer label {color: #fff;}
.main_pop_layer .pop_footer .n_btn_icon {background: url(../svg/x.svg) no-repeat center center; width: 16px; height: 16px; background-size: contain; filter: var(--n-filter-white); font-size: 0;}

/*-------------------------------------------
  -- flex
-------------------------------------------*/
.flex_row {display: flex; flex-wrap: wrap; margin: 0 -.4rem; gap: 1.2rem 0;}
.flex_row > * {padding: 0 .4rem;}

.flex_between {display: flex; justify-content: space-between; align-items: center;}
.flex_between .n_form_label {padding-bottom: 0;}



/***********************************************************************************************************************
  C. Login
***********************************************************************************************************************/
.login_wrap {max-width: 400px; padding: 3.2rem 0;}
.login_either_wrap {max-width: 850px;}
.login_wrap h1 {margin-bottom: 4rem;}
.login_wrap .form_wrap {padding-bottom: 0;}



/***********************************************************************************************************************
  D. Main
***********************************************************************************************************************/
.main_content {padding-top: 5.6rem;}
.sec_title {margin-bottom: 2.4rem; color: var(--n-gray-900); line-height: 137.5%;}

/*-------------------------------------------
  -- main layout wrap
-------------------------------------------*/
.main_layout_wrap:first-child {margin-top: 1rem;}
.main_layout_wrap .inner {display: flex; flex-direction: column; gap: 1.6rem; padding: 0 2rem;}

/*-------------------------------------------
  -- main banner
-------------------------------------------*/
.main_banner {position: relative; border-radius: 1.2rem; overflow-x: hidden;}
.main_banner img {width: 100%; height: auto;}

.main_banner .swiper_controller {position: absolute; left: 50%; bottom: 2rem; transform: translateX(-50%); display: flex; align-items: center; gap: .4rem; width: auto; padding: .4rem .8rem; border-radius: 10rem; background-color: rgba(0, 0, 0, .55); z-index: 1;}
.main_banner .swiper_controller .swiper-button-prev, .main_banner .swiper_controller .swiper-button-next {position: static; width: 1.6rem; min-width: 1.6rem; height: 1.6rem; margin-top: unset; font-size: 0; filter: var(--n-filter-white); background-repeat: no-repeat; background-position: center; background-size: 100%;}
.main_banner .swiper_controller .swiper-button-prev::after, .main_banner .swiper_controller .swiper-button-next::after {content: '';}
.main_banner .swiper_controller .swiper-button-prev {background-image: url(../svg/chevron-left.svg);}
.main_banner .swiper_controller .swiper-button-next {background-image: url(../svg/chevron-right.svg);}
.main_banner .swiper_controller .swiper-pagination {position: static; font-size: 1.3rem; color: #fff;}

/* -- sub banner */
.sub_banner * {line-height: 137.5%;}
.sub_banner ul {display: flex; gap: 1rem;}
.sub_banner ul li {flex: 1;}
.sub_banner ul li a {position: relative; display: inline-block; width: 100%; padding: 2rem; padding-bottom: calc(2rem + 5rem); border-radius: 1.2rem;}
.sub_banner ul li:first-child a {background-color: #FF7962; color: #fff;}
.sub_banner ul li:last-child a {background-color: #FFE5E1; color: var(--n-gray-900);}
.sub_banner ul li a .title {font-size: 1.4rem; font-weight: 700;}
.sub_banner ul li a .desc {display: none; margin-top: .4rem; font-size: 1.6rem;}
.sub_banner ul li a img {position: absolute; right: 2rem; bottom: 2rem; width: 4.8rem;}

.carousel_tablet, .carousel_pc {display: none;}

/*-------------------------------------------
  -- main product list
-------------------------------------------*/
.main_product_list {margin-top: 4rem;}

/* .main_product_list {padding-bottom: 4rem;} */
.product_list_header {position: relative;}
.product_list_header h2 {margin-bottom: 2.4rem; font-size: 1.8rem; font-weight: 700; color: var(--n-gray-900);}
.product_list_header .link_all {display: none; position: absolute; top: 50%; right: 0; transform: translateY(-50%); font-size: 1.6rem; color: var(--n-gray-800);}
.product_list_header .link_all::after {background: url(../svg/chevron-right.svg) no-repeat center/100%; content: ""; display: inline-block; width: 1.4rem; height: 1.4rem; margin-left: .4rem; filter: var(--n-filter-gray8);}
.product_list_footer .link_all {display: inline-block; padding: .5rem 1rem; font-size: 1.1rem;}
.product_list_footer .link_all::after {background: url(../svg/chevron-right.svg) no-repeat center/100%; content: ""; display: inline-block; width: .8rem; height: .8rem; margin-left: .4rem; filter: var(--n-filter-gray8);}
/* .rate_area, .phone_area {margin-bottom: 2rem;} */

/* rate card */
.rate_area {position: relative; padding-bottom: 2.2rem; overflow: hidden;}
.rate_area .card_title {display: flex; justify-content: center; align-items: center; gap: .8rem; padding: 1.2rem 0; border-radius: 1.2rem; font-size: 1.8rem; font-weight: 500; color: var(--n-gary-900); line-height: 137.5%;}
.rate_area .rate_group:first-child .card_title {background: linear-gradient(180deg, #B8FFC3 0%, #8CEB9B 100%);}
.rate_area .rate_group:last-child .card_title {background: linear-gradient(180deg, #FFE6FB 0%, #E6B8FF 100%);}
.rate_area .card_title img {width: 2.8rem;}

.rate_card_list {padding: 0 2rem; margin-top: 1.2rem; border: 1px solid var(--n-gray-300); border-radius: 1.2rem;}
.rate_card_item {width: 100%;}
.rate_card_item + .rate_card_item {border-top: 1px solid var(--n-gray-200);}

.rate_card {display: flex; flex-direction: column; padding: 2rem 0;}
.rate_card .badge_wrap {margin-bottom: 1.6rem;}
.rate_card_title {margin-bottom: .4rem; font-size: 1.3rem; font-weight: 500; color: var(--n-gray-500);}
.rate_card_info {font-size: 1.6rem; font-weight: 700; color: var(--n-gray-900);}
.rate_card_bottom {margin-top: auto;}
.rate_card_price {display: flex; align-items: baseline; justify-content: end; gap: .4rem; margin-top: 1.6rem; font-size: 1.6rem; font-weight: 700; text-align: right; color: var(--n-primary);}
.rate_card_price .rate_origin {font-size: 1.4rem; font-weight: 400; color: var(--n-gray-300); text-decoration: line-through;}

/* phone card */
.phone_card_list {margin-bottom: 1rem;}
.phone_card {position: relative;}
.phone_card_img {float: left; width: 140px; height: 140px; padding: 2rem 0; text-align: center;}
.phone_card_img img {object-fit: contain; width: 100%; height: 100%;}
.phone_card_box {width: 100%; height: 140px; padding: 2rem 2.4rem; border-radius: 1.6rem; background: var(--n-lightPurple);}
.phone_card_box .inner {height: 100%;}
.phone_card_title {margin-bottom: .5rem; font-size: 1.5rem; font-weight: 700; color: var(--n-gray-900);}
.phone_card_txt {font-size: 1.2rem; color: var(--n-gray-900);}
.phone_card_price {font-size: 1.8rem; font-weight: 700; color: var(--n-primary);}
.phone_card_price span {margin-right: .4rem; font-size: 1.4rem;}
.phone_card_ref {font-size: 1rem; color: var(--n-gray-700);}

/*-------------------------------------------
  -- main event area
-------------------------------------------*/
.main_event_area {margin-top: 4rem;}
.main_event_area .thumb_card_img.event {margin-bottom: 0;}
.main_event_area .thumb_card_desc {padding: 0 1rem; margin-top: 1.2rem; text-overflow: ellipsis; overflow: hidden; word-break: break-all; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
/* .main_event_area .thumb_card_img.event {height: calc(100vw - 48vw);} */
.event_banner {position: relative; display: inline-block; width: 100%; height: 0; padding-top: 62.5%; border-radius: 1.6rem; overflow: hidden;}
.event_banner img {position: absolute; top: 50%; left: 50%; width: auto; height: 100%; transform: translate(-50%,-50%);}

/*-------------------------------------------
  -- main cs area
-------------------------------------------*/
.main_cs_box {padding: 2.4rem; border: 1px solid var(--n-gray-200); border-radius: 1.2rem;}
.main_cs_box .title {margin-bottom: 1rem; font-size: 1.8rem; font-weight: 700; color: var(--n-gray-900);}

/*-------------------------------------------
  -- main service area
-------------------------------------------*/
.main_service_area {margin-top: 2.4rem;}
.service_group li {padding: 1.6rem 0;}
.service_group li:last-child {padding-bottom: 0;}
.service_group li + li {border-top: 1px solid var(--n-gray-200);}
.service_group .service_link {position: relative; display: flex; align-items: center; gap: 1.2rem; padding-right: 2.8rem; font-size: 1.6rem; font-weight: 500; color: var(--n-gray-900); line-height: 137.5%;}
.service_group .service_link img {width: 3.2rem;}
.service_group .service_link::after {content: ''; position: absolute; top: 50%; right: 0; transform: translateY(-50%); display: block; width: 1.6rem; height: 1.6rem; background: url(../svg/chevron-right.svg) no-repeat center/100%; filter: var(--n-filter-gray5);}


/*-------------------------------------------
  -- main_call_area
-------------------------------------------*/
/* call cs area */
.main_call_area {margin-top: 2.4rem;}
.call_cs_content li {display: flex; align-items: center; gap: .8rem; font-size: 1.6rem; font-weight: 500;}
.call_cs_content li .cs_num {font-size: 1.8rem; font-weight: 700; color: var(--n-primary);}
.call_cs_content li + li {margin-top: .8rem;}
.call_cs_content li .list_dot li {font-size: 1.3rem; font-weight: 400; color: var(--n-gray-500);}
.call_cs_content li .list_dot li::before {color: var(--n-gray-500);}

/* notice box */
.notice_box {display: inline-flex; align-items: center; gap: 1.2rem; width: 100%; padding: 1.6rem 2rem; margin-top: 2.4rem; border: 1px solid #EAECF5; border-radius: 1.2rem; background-color: #F8F9FC;}
.notice_box .icon {flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; width: 2.8rem; height: 2.8rem; border-radius: 999px; background-color: #363F72;}
.notice_box .icon img {width: 2rem;}
.notice_box .notice_title {font-size: 1.4rem; font-weight: 500; color: var(--n-gray-700); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.notice_title:hover {color: var(--n-gray-700);}    

/* main prop */
.main_prop {margin-top: 4rem; margin-bottom: -4rem; padding: 4rem 0; background-color: #e8e8e8;}
.main_prop_header {margin-bottom: 1rem; text-align: center;}
.main_prop_header h2 {font-size: 1.8rem;}
.main_prop_header .txt {font-size: 1.2rem; color: var(--n-gray-800);}
.main_prop_acc {text-align: center; font-size: 1.3rem; font-weight: 700; color: var(--n-gray-800);} 
/* .main_prop .title {font-size: 1.6rem; font-weight: 700; color: var(--n-gray-900);} */
/* .prop_btn {margin-top: 1rem; padding: .5rem 1rem; font-size: 1.4rem; border: 1px solid var(--n-gray-600); background-color: transparent; color: var(--n-gray-600);} */

/*-------------------------------------------
  -- main swiper area(plugin style)
-------------------------------------------*/
.main_swiper_area {width: 100%; overflow: hidden;}
.main_swiper_area .swiper-container {position: relative; width: 100%; margin: 0 auto;}
.main_swiper_area .swiper-pagination {bottom: 0; top: unset;}
.main_swiper_area .swiper-pagination-bullet {width: 8px; height: 8px; margin: 0 3px; border: 0; border-radius: 100%; background-color: #000; opacity: .25;}
.main_swiper_area .swiper-pagination-bullet-active {width: 16px; border-radius: 10rem; background-color: var(--n-gray-800); opacity: 100%;}

/* main banner */
.main_banner .swiper-slide {width: 100%;}

/* rate swiper */
.rate_area .swiper-pagination {bottom: 0; top: unset;}
.rate_area .swiper-pagination-bullet {width: .6rem; height: .6rem; margin: 0 .25rem; background-color: rgba(0, 0, 0, 0.15); opacity: 1;}
.rate_area .swiper-pagination-bullet-active {background-color: var(--n-gray-900);}

/* event swiper */
.main_event_area .main_swiper_area {width: calc(100% + 4rem); margin: 0 -2rem;}
.main_event_area .swiper-container {padding: 0 2rem;}
.main_event_area .swiper-slide {width: 85%;}



/***********************************************************************************************************************
  E. Sub
***********************************************************************************************************************/

/* -- common */
.page_title {padding: .5rem 0; margin-bottom: 2.8rem; font-weight: 700;}
.data_none, .event_none {display: flex; justify-content: center; align-items: center; min-height: 20vh; text-align: center;}

.alert_wrap {padding: 2.4rem 0 3.2rem 0; text-align: center;}
.alert_wrap > * {font-size: 1.4rem; color: var(--n-gray-900); line-height: 1.75;}
.alert_img { width: 100%; padding: 1rem 0; text-align: center;}
.alert_img span {
	background-image: url(../svg/exclamation-triangle-fill.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
	display: inline-block;
	width: 3.2rem;
	height: 3.2rem;
	filter: var(--n-filter-gray9);
}
.alert_img span.success {background-image: url(../svg/check2-circle.svg); filter: var(--n-filter-secondary);}
.alert_img span.fail {background-image: url(../svg/x-circle.svg); filter: var(--n-filter-red);}
.alert_img span.success, .alert_img span.fail {width: 5.6rem; height: 5.6rem;}

/* document */
.onlyPrintArea {display: none;}
.doc_wrap {position: relative; padding-bottom: 20px;}
.doc_head {text-align: center; margin-bottom: 32px; padding-top: 50px;}
.doc_head h2 {font-size: 16pt; margin-bottom: 0;}
.doc_head_logo {position: absolute; top: 0; right: 0; height: 40px;}
.doc_info {padding-top: 16px; line-height: 1.75;}
.doc_content {font-size: 9.25pt; word-break: keep-all;}
.doc_content + .doc_content {margin-top: 24px;}
.doc_content .title {padding-bottom: 5px; font-size: 11pt; font-weight: 500; color: #000;}
.doc_content .table_board.type2 {font-size: 9.25pt;}
.doc_content .table_board.type2 th {width: 20%; min-width: 70px;}
.doc_content .table_board.type2 th, .doc_content .table_board.type2 td {padding: 6.5px;}
.doc_content .flex_row {margin: 0 -12px;}
.doc_content .flex_row > * {padding: 0 12px;}
.doc_content .price_list {font-size: 9.25pt;}
.doc_content .price_list + .price_list{border-left: 1px solid #e6e6e6;}
.doc_content .price_list li + li {padding-top: 5px;}
.doc_content .price_list li.depth {padding-top: 2px; font-size: 8.25pt;}
.doc_content .doc_price_area.total {background-color: var(--n-lightPurple)}
.doc_content .doc_price_area.total .price_list {font-size: 11pt;}
.doc_notice {font-size: 7.5pt; padding-top: 5px; color: var(--n-gray-600);}
.doc_notice .box {padding: 10px;}
.doc_notice .box .title {padding-bottom: 5px; font-size: 7.5pt; font-weight: 600; color: var(--n-gray-600);}
.doc_notice .list li {letter-spacing: -.25px;}
.doc_notice .list li + li {margin-top: 5px;}
.doc_seal {padding-top: 20px; line-height: 1.75; text-align: center; color: var(--n-gray-800);}
.doc_seal p {font-size: 9.25pt; font-weight: 500;}
.doc_seal .seal {position: relative; margin-top: 20px; font-size: 11.5pt; color: #000;}
/* .doc_seal .seal img {
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
	-webkit-user-drag: none;
	-khtml-user-drag: none;
	-moz-user-drag: none;
	-o-user-drag: none;
	user-drag: none;
	
	position: absolute; top: 50%; transform: translateY(-50%); width: 30px; height: auto; margin-left: 5px;
} */
.doc_seal .seal img {display: none;}
.doc_seal .cs {padding-top: 8px; font-size: 9.25pt; color: var(--n-gray-400);}

/*-------------------------------------------
  -- accordion style
-------------------------------------------*/
.acc_wrap .acc_item {width: 100%; padding: 2rem 0; border-bottom: 1px solid var(--n-gray-200);}
.acc_wrap .acc_header {font-size: 1.4rem; font-weight: 700; color: var(--n-gray-900);}
.acc_wrap .acc_header .acc_header_link {position: relative; display: flex; flex-direction: column; width: 100%; padding: 0; padding-right: 3rem; background-color: transparent; text-align: left;}
.acc_wrap .acc_header .acc_header_link::after {content: ""; background-image: url(../svg/chevron-down.svg); background-repeat: no-repeat; background-position: center; background-size: 100%; position: absolute; top: 50%; transform: translateY(-50%); right: 0; display: inline-block; width: 2rem; height: 2rem; filter: var(--n-filter-gray5);}
.acc_wrap .acc_header.active .acc_header_link::after {background-image: url(../svg/chevron-up.svg);}
.acc_wrap .acc_content {display: none; padding-top: 1.2rem;}
.acc_wrap .acc_content_inner {padding: 1.6rem; border-radius: .8rem; font-size: 1.4rem; color: var(--n-gray-700); background-color: var(--n-secondary-light); line-height: 1.75;}

/* type2 */
.acc_wrap.type2 .acc_header {display: flex; justify-content: space-between; align-items: center; font-weight: 400;}
.acc_wrap.type2 .acc_header .acc_header_link {flex-shrink: 1; position: relative; padding: 0; background-color: transparent; background: url(../svg/chevron-down.svg) no-repeat center/100%; width: 2rem; height: 2rem; filter: var(--n-filter-gray5);}
.acc_wrap.type2 .acc_header.active .acc_header_link {background: url(../svg/chevron-up.svg) no-repeat center/100%;}
.acc_wrap.type2 .acc_header .acc_header_link::after, .acc_wrap.type2 .acc_header.active .acc_header_link::after {display: none;}

/* type3 */
.acc_wrap.type3 {padding: 2rem; border: 1px solid var(--n-gray-300); border-radius: 1.2rem;}
.acc_wrap.type3 .acc_header .acc_header_link {position: relative; padding-right: 3rem;}

/*-------------------------------------------
  -- board list
-------------------------------------------*/
/* default */
.board_list {border-top: 1px solid var(--n-gray-900); margin-top: 2rem;}
.board_list_item {display: flex; flex-direction: column; padding: 2rem 0; font-size: 1.4rem;}
.board_list > li {padding: 2rem 0; border-bottom: 1px solid var(--n-gray-200);}
.board_list > li .title, .board_list li .title a {position: relative; margin-bottom: .8rem; font-size: 1.5rem; font-weight: 500; color: var(--n-gray-900);}
.board_list > li .title.ico {padding-right: 2rem;}
.board_list > li .title.ico::after {background: url(../svg/chevron-right.svg) no-repeat center/100%; content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 0; display: inline-block; width: 1.4rem; height: 1.4rem;}
.board_list > li .detail_list {display: flex; flex-wrap: wrap;}
.board_list > li .detail_list li {position: relative; padding: 0; border-bottom: 0; font-size: 1.3rem; color: var(--n-gray-600);}
.board_list > li .detail_list li + li {padding-left: 1rem; margin-left: 1rem;}
.board_list > li .detail_list li + li::before {content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); display: block; width: 1px; height: 50%; background-color: var(--n-gray-600);}
.board_list > li .detail_list li span {font-weight: 500;}

/* type2 - 적립내역 형식 */
.board_list.type2 li .date {font-size: 1.3rem; color: var(--n-gray-400);}
.board_list.type2 li .info_area {display: flex; justify-content: space-between; width: 100%;}
.board_list.type2 li .info_area .info {flex: 1 1; padding-right: 1rem; overflow: hidden;}
.board_list.type2 li .title, .board_list.type2 li .text {font-size: 1.4rem; margin-bottom: 0;}
.board_list.type2 li .amount {flex-shrink: 0; font-size: 1.4rem; font-weight: 700;}

/* .board_list {border-top: 1px solid var(--n-primary);}
.board_list_item {display: flex; flex-direction: column; padding: 2rem 1.6rem; border-bottom: 1px solid #e6e6e6; font-size: 1.4rem;} */

/*-------------------------------------------
  -- card list
-------------------------------------------*/
.card_list .badge_wrap {display: flex; flex-wrap: wrap; gap: .5rem;}

.card_list_item {display: flex; flex-direction: column; margin-bottom: 1rem; font-size: 1.4rem; overflow: hidden;}
.card_list_item.no_list {width: 100% !important; flex: 1 !important;}
.no_list {padding: 5rem 1.6rem !important;}

.card_link {padding: 2rem; border-radius: 1.2rem; border: 1px solid #e6e6e6;}
.card_link .title {}

/*-------------------------------------------
  -- price list(요금 소계)
-------------------------------------------*/
.price_list {font-size: 1.4rem; font-weight: 500; color: var(--n-gray-900);}
.price_list li {display: flex; justify-content: space-between;}
.price_list li + li {padding-top: 1.6rem;}
.price_list li.depth {padding-top: .4rem; font-size: 1.3rem; font-weight: 400; color: var(--n-gray-500);}
.price_list li.total {color: var(--n-primary);}
.price_list li .title, .price_list li .text {width: auto; font-weight: inherit; font-size: inherit; color: inherit; padding-bottom: 0;}

.price_list.type2 {font-weight: 400; color: var(--n-gray-700);}
.price_list.type2 li {flex-wrap: wrap;}
.price_list.type2 li + li {padding-top: 1.6rem; margin-top: 1.6rem; border-top: 1px solid var(--n-gray-200);} 

/*-------------------------------------------
  -- thumb card
-------------------------------------------*/
.thumb_list .thumb_card_link {margin-bottom: 1.2rem;} 
.thumb_card_link {display: inline-block; width: 100%;}
.thumb_card_img {width: 100%; margin-bottom: 1rem; border-radius: 1rem; overflow: hidden;}
.thumb_card_img.event {border-radius: 1.2rem;}
.thumb_card_img img {width: 100%;}
.thumb_card_desc {font-size: 1.4rem; font-weight: 500; color: var(--n-gray-500); line-height: 137.5%;}
.thumb_card_desc .title {font-size: 1.5rem; font-weight: 700; color: var(--n-gray-700);}
.thumb_card_desc .date {font-weight: 400; color: var(--n-gray-500);}

/*-------------------------------------------
  -- tab
-------------------------------------------*/
.tab_box {margin-bottom: 2rem}
.tab_box_list {display: flex; flex-wrap: wrap; width: 100%; border: 1px solid var(--n-gray-300); border-radius: .6rem; overflow: hidden;}
.tab_box_list li {flex: 0 0 auto; width: 33.3333%; display: inline-block;}
.tab_box_list li:first-child {border-left: 1px solid transparent;}
.tab_box_link {position: relative; display: inline-flex; justify-content: center; align-items: center; width: calc(100% + 1px); height: calc(5.2rem + 1px); padding: 0 1.2rem; margin: -1px; border-right: 1px solid var(--n-gray-300); border-bottom: 1px solid var(--n-gray-300); border-radius: 0; font-size: 1.4rem; color: var(--n-gray-500); background-color: transparent; text-align: center; word-break: keep-all;}
.tab_box_link:hover {color: var(--n-gray-700);}
.tab_box_link.on, .tab_box_link.active {background-color: var(--n-secondary); color: #fff;}
/* .tab_box_list li:first-child .tab_box_link {border-radius: .6rem 0 0 .6rem;}
.tab_box_list li:last-child .tab_box_link {border-radius: 0 .6rem .6rem 0;} */
.tab_box_list li:nth-child(3n) .tab_box_link {border-right-color: transparent;}

.tab_box_list_t2 {display: flex; flex-wrap: wrap; gap: .8rem; width: 100%;}
.tab_box_list_t2 li {flex: 0 0 auto; display: inline-block;}
.tab_box_list_t2 .tab_box_link {width: 100%; height: 5.2rem; margin: unset; border: 1px solid var(--n-gray-300); border-radius: .6rem;}
.tab_box_list_t2 .tab_box_link.on, .tab_box_list_t2 .tab_box_link.active {border-width: 2px; border-color: var(--n-secondary); font-weight: 700; background-color: transparent; color: var(--n-secondary);}
/* .tab_box_list_t2 .tab_box_link.on, .tab_box_list_t2 .tab_box_link.active {border-width: 2px; background-color: transparent; color: var(--n-secondary);} */

.tab_box_list_t3 {position: relative; display: flex; flex-wrap: wrap; width: 100%; margin: 0 auto;}
.tab_box_list_t3::after {content: ''; position: absolute; bottom: 0; width: 100%; height: 2px; background-color: var(--n-gray-900);}
.tab_box_list_t3 li {display: inline-block;}
.tab_box_list_t3 .tab_box_link {height: 4.8rem; margin: unset; border: 1px solid var(--n-gray-300); border-bottom: 0; border-radius: .8rem .8rem 0 0;}
.tab_box_list_t3 .tab_box_link:hover {color: var(--n-gray-900);}
.tab_box_list_t3 .tab_box_link.on, .tab_box_list_t3 .tab_box_link.active {border-width: 2px; border-color: var(--n-gray-900); font-weight: 500; color: var(--n-gray-900); background-color: #fff; z-index: 1;}
.tab_box_list_t3 .tab_box_link.on::after, .tab_box_list_t3 .tab_box_link.active::after {content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; background-color: #fff; z-index: 1;}

.tab_box_list.type_fill li {flex: 1; width: auto;}
.tab_box_list.type_fill li:nth-child(3n) .tab_box_link {border-right-color: var(--n-gray-300);}
.tab_box_list.type_fill li:last-child .tab_box_link {border-right-color: transparent;}
.tab_box_list_t3.type_fill li {flex: 1;}

.tab_box_oval {margin-bottom: 1.6rem;}
.tab_box_oval .tab_list {position: relative; display: flex; flex-wrap: wrap; gap: .8rem; width: 100%; margin: 0 auto; text-align: center;}
.tab_box_oval .tab_link {display:inline-flex; justify-content: center; align-items: center; height: 3.6rem; line-height: 3.6rem; padding: 0 1.6rem; font-size: 1.4rem; font-weight: 500; border-radius: 10rem; background-color: var(--n-gray-100); color: var(--n-gray-500); }
.tab_box_oval .tab_link.on {background-color: var(--n-gray-700); color: #fff;}

.tab_icon .tab_box_link {padding: 3.8rem 1rem 1.5rem 1rem;}
.tab_icon .tab_box_link::before {content: ''; position: absolute; top: 1.5rem; left: 50%; transform: translateX(-50%); display: block; width: 1.8rem; height: 1.8rem; filter: var(--n-filter-gray4);}
.tab_icon .tab_box_link.on::before {filter: var(--n-filter-white);}

.tab_line_wrap {position: relative; margin-bottom: 2rem;}
.tab_line_wrap::after {content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background-color: var(--n-gray-300); z-index: 1;}
.tab_line_list {position: relative; display: flex; flex-wrap: wrap; width: 100%; padding-top: 1.75rem; margin: 0 auto; text-align: center; background: #fff;}
/* .tab_line_list::after {content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background-color: var(--n-gray-300);} */
.tab_line_list li {flex: 1 1 auto;}
.tab_line_link {position: relative; display:inline-flex; justify-content: center; align-items: center; width: 100%; height: 4.8rem; padding: 0 1.2rem; border-radius: 0; font-size: 1.4rem; background-color: transparent; color: var(--n-gray-400);}
.tab_line_link:hover {color: var(--n-gray-500);}
.tab_line_link.on, .tab_line_link.active {font-weight: 700; color: var(--n-secondary); z-index: 1;}
.tab_line_link.on::after, .tab_line_link.active::after {content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; background-color: var(--n-secondary);}

.tab_line_list_t2 {position: relative; display: flex; width: 100%; margin: 0 auto; text-align: center; background: #fff;}
/* .tab_line_list_t2::after {content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background-color: var(--n-gray-300);} */
.tab_line_list_t2 li {position: relative;}
.tab_line_list_t2 li + li {padding-left: 1.2rem; margin-left: 1.2rem;}
.tab_line_list_t2 li + li::before {content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); display: block; width: 1px; height: .8rem; background-color: var(--n-gray-200);}
.tab_line_list_t2 .tab_line_link {padding: 0;}
.tab_line_list_t2 .tab_line_link.on, .tab_line_list_t2 .tab_line_link.active {color: var(--n-secondary);}
.tab_line_list_t2 .tab_line_link.on::after, .tab_line_list_t2 .tab_line_link.active::after {display: none;}

.tab_line_list_t3 {position: relative; display: flex; flex-wrap: wrap; gap: 1.6rem; width: 100%; padding-top: 1.75rem; margin: 0 auto; text-align: center; background: #fff;}
.tab_line_list_t3 .tab_line_link {padding: 0; border-bottom: 2px solid transparent;}
.tab_line_list_t3 .tab_line_link.on, .tab_line_list_t3 .tab_line_link.active {color: var(--n-secondary); border-color: var(--n-secondary);}
.tab_line_list_t3 .tab_line_link.on::after, .tab_line_list_t3 .tab_line_link.active::after {display: none;}

.sub_tab {margin-bottom: 1.6rem;}
.sub_tab_list {display: flex; flex-wrap: wrap; gap: .8rem; width: 100%;}
.sub_tab_link {display:inline-flex; justify-content: center; align-items: center; height: 3.6rem; padding: 0 1.6rem; font-size: 1.3rem; background-color: var(--n-gray-100); border-radius:100px; color: var(--n-gray-500);}
.sub_tab_link:hover {color: var(--n-gray-500);}
.sub_tab_link.on {font-weight: 500; color: #fff; background-color: var(--n-gray-700);}

.tab_login {margin-bottom: 2.4rem;}
.tab_login_list {position: relative; display: flex; flex-wrap: wrap; width: 100%; margin: 0 auto; text-align: center;}
.tab_login_list::after {content: ''; position: absolute; bottom: 0; width: 100%; height: 2px; background-color: var(--n-gray-900);}
.tab_login_list li {flex: 1; display: inline-block;}
.tab_login_link {position: relative; display: block; width: 100%; height: 100%; padding: 1.6rem 1.2rem; border: 1px solid var(--n-gray-300); border-bottom: 0; border-radius: .8rem .8rem 0 0; font-size: 1.4rem; background-color: transparent; color: var(--n-gray-400); text-align: center;}
.tab_login_link:hover {color: var(--n-gray-900);}
.tab_login_link.on {border-width: 2px; border-color: var(--n-gray-900); font-weight: 500; color: var(--n-gray-900); background-color: #fff;}
.tab_login_link.on::after {content: ''; position: absolute; left: 0; bottom: -1px; width: 100%; height: 4px; background-color: #fff; z-index: 1;}

/*-------------------------------------------
  -- search
-------------------------------------------*/
.search_wrap {padding: 1rem 0;}

.search_box {display: flex; max-width: 802px; margin: 0 auto; border-radius: 999px; background-color: #fff; overflow: hidden;}
.search_box input {padding: 0; padding-left: 1.6rem; border: 0;}
.search_box .search_btn {position: relative; flex-shrink: 0; width: 4.8rem; height: 4.8rem; padding: 0; font-size: 0; background-color: transparent;}
.search_box .search_btn:before {content: ''; display: block; width: 100%; height: 100%; background: url(../svg/search.svg) center/2rem no-repeat transparent; filter: var(--n-filter-gray5);}

/*-------------------------------------------
  -- order layout
-------------------------------------------*/
.order_wrap {}
.order_container {min-width: 320px; margin: 0 auto;}
.order_content {padding: 0 2rem;}

.order_group + .order_group {margin-top: 4.8rem;}

.order_payment {width: calc(100% - 4rem); padding: 2rem; margin: 0 auto; border-radius: 1.2rem; background-color: var(--n-gray-100);}
.order_content + .order_payment {margin-top: 4.8rem;}
.order_payment .price_list {margin-bottom: 1.6rem; padding-bottom: 1.6rem; border-bottom: 1px dashed var(--n-gray-300);}


/*-------------------------------------------
  -- product layout(휴대폰)
-------------------------------------------*/

/*-------------------------------------------
  -- rate layout(요금제)
-------------------------------------------*/
/* rate list */
.board_list.rate_list {border-color: var(--n-gray-300);}
.rate_link {font-size: 1.4rem;}
.rate_link .badge_wrap {margin-bottom: 1.6rem;}
.rate_link .title {margin-bottom: .4rem; font-size: 1.3rem !important; color: var(--n-gray-500) !important;}
.rate_link .content_group {flex-direction: column; gap: 1.6rem;}
.rate_link .desc {color: var(--n-gray-900);}
.rate_link .desc li {position: relative; display: inline-block;}
.rate_link .desc li + li {padding-left: .6rem; margin-left: .6rem;}
.rate_link .desc li + li::before {content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); display: block; width: 1px; height: 1rem; background-color: var(--n-gray-300);}
.rate_link .desc li.data {font-weight: 700;}
.rate_link .detail .ref {color: var(--n-gray-500);}
.rate_link .price {display: flex; flex-direction: column; font-size: 1.6rem; font-weight: 700; color: var(--n-primary); text-align: end;}
.rate_link .price .ref {font-size: 1.3rem; font-weight: 400; color: var(--n-gray-500);}
.rate_link .price .origin {font-size: 1.4rem; font-weight: 400; color: var(--n-gray-300); text-decoration: line-through;}

/* rate detail view */
/* .rate_info_wrap {margin-top: -2.4rem; margin-bottom: 2.4rem; background-color: var(--n-secondary-light);}
.rate_info_wrap .inner {padding: 2.4rem 2rem;}
.rate_info {} */
/* ## rate detail view - new ## */
.rate_info_wrap {margin-bottom: 2rem;}
.rate_info_wrap > .inner {display: flex; flex-direction: column; gap: 1.6rem;}
.rate_info {height: fit-content; padding: 2rem; border-radius: 1rem; background-color: var(--n-lightPurple);}

.rate_info .badge_wrap {margin-bottom: 1.6rem;}
.rate_info .header {margin-bottom: 1.6rem; font-size: 1.5rem; font-weight: 500; color: var(--n-gray-500);}
.rate_info .content {display: flex; flex-direction: column;}
.rate_info .content .detail .ref {margin-bottom: 1rem; font-size: 1.3rem; font-weight: 500; color: var(--n-gray-800);}
.rate_info .content .desc {display: flex; flex-wrap: wrap; gap: .4rem 1.6rem; margin-bottom: 2rem; font-size: 1.4rem; color: var(--n-gray-700);}
.rate_info .content .desc li {display: flex; align-items: center;}
.rate_info .content .desc .icon {width: 1.4rem; height: 1.4rem; margin-right: .4rem; filter: var(--n-filter-gray5);}
.rate_info .content .desc li.data {width: 100%; font-size: 1.8rem; font-weight: 700;}

.rate_info .price {display: flex; align-items: center; gap: 2rem;}
.rate_info .price_area {flex: 1;}
.rate_info .price_area p {display: flex; align-items: baseline; gap: .4rem; font-size: 2.4rem; font-weight: 700; color: var(--n-primary);}
.rate_info .price_area p .vat {font-size: 1.3rem; font-weight: 400; color: var(--n-gray-900);}
.rate_info .price_area .ref {font-size: 1.4rem; font-weight: 400; color: var(--n-gray-500);}
.rate_info .price_area .origin {font-size: 1.4rem; font-weight: 400; color: var(--n-gray-400); text-decoration: line-through;}
.rate_info .btn_area {flex-shrink: 0;}

.rate_caption {padding: 2rem; margin-top: 1.2rem; border-radius: .8rem; background-color: #fff;}
.rate_caption_list {padding-left: 1rem; font-size: 1.2rem; color: var(--n-gray-500);}
/* .rate_caption_list li {list-style: "· ";} */
.rate_caption_list li {position: relative;}
.rate_caption_list li::before {content: ''; position: absolute; left: -8px; top: 50%; transform: translateY(-50%); display: inline-block; width: 2px; height: 2px; background-color: var(--n-gray-500);}
.rate_caption_list li:not(:last-child) {margin-bottom: .5rem;}

.rate_detail {}
.rate_detail_depth {margin-bottom: 2.4rem;}
.rate_detail_depth img {width: 100%;}
.rate_detail_depth .title {margin-bottom: .8rem; font-size: 1.5rem; font-weight: 700; color: var(--n-gray-900);}
.rate_detail_depth .desc {font-size: 1.4rem; color: var(--n-gray-500); line-height: 1.75; overflow-x: auto;}
.rate_detail_depth .desc pre {font-size: 1.4rem;}
.rate_detail_depth .desc_list {padding-left: 2rem; font-size: 1.3rem; color: var(--n-gray-800);}
.rate_detail_depth p.desc_list>* {font-size: 1.3rem !important;}
.rate_detail_depth .desc_list li {position: relative; margin-bottom: 0.5rem;}
.rate_detail_depth .desc_list li::before {content: ''; position: absolute; left: -1rem; top: .8rem; display: inline-block; width: 2px; height: 2px; background-color: var(--n-gray-800);}
.rate_detail_depth .desc_list_depth {padding: .5rem 0 0 1rem; font-size: 1.2rem;}
.rate_detail_depth .desc_list_depth li {position: relative; }
.rate_detail_depth .desc_list_depth li::before {content: ''; position: absolute; left: -1rem; top: .8rem; display: inline-block; width: 4px; height: 1px; background-color: var(--n-gray-800);}

.rate_detail.type2 {padding: 0; margin-top: 0; border: 0; overflow-x: auto;}
.rate_detail.type2 img {width: 100%;}

.rate_detail_depth .table {border-top: 1px solid var(--n-gray-900); font-size: 1.3rem; text-align: center; white-space: nowrap;}
.rate_detail_depth .table th {padding: .8rem 1.6rem; border-bottom-color: var(--n-gray-300); vertical-align: middle;}
.rate_detail_depth .table td {padding: .8rem 1.6rem; border-bottom-color: var(--n-gray-300);}

.rate_select_area {width: 100%;}
.rate_select_box {padding: 2rem; border-radius: 1rem; border: 1px solid var(--n-primary);}
.rate_select_box.ref_stop {border-color: var(--n-gray-200); font-size: 1.6rem; font-weight: 500; color: var(--n-gray-900); background-color: var(--n-gray-200); text-align: center;}
.rate_select_box .form_group {margin-bottom: 1.6rem;}
.rate_select_box .n_form_label {padding: .4rem 0;}
.rate_select_box .title + form {margin-top: 1.6rem;}


/* 부가서비스 */
.addon_content .acc_wrap {border-top: 1px solid var(--n-gray-300);}
.service_desc {display: flex; flex-direction: column; gap: .8rem;}
.service_desc .badge {display: inline;}
.addType.badge_pps {background-color: #F22727; } /* 선불 */
.addType.badge_post {background-color: #04BF33; } /* 후불 */
.addType.badge_all {background-color: #FF9461;} /* 선후불 */
.service_desc .title_wrap {flex: 1; min-width: 0; display: inline-flex; align-items: center; gap: .8rem;}
.service_desc .badge_wrap {flex-shrink: 0; width: auto; margin-bottom: 0;}
.service_desc .badge_wrap .badge {height: fit-content;}
.service_desc .title {display: inline; padding-right: 1rem; font-weight: 700; color: var(--n-gray-900);}
.service_desc .price {flex: 0 0 auto; font-size: 1.8rem; font-weight: 700; color: var(--n-primary);}
.service_desc .price .ref {font-size: 1.3rem; font-weight: 400; color: var(--n-gray-600);}

/*-------------------------------------------
  -- event(이벤트)
-------------------------------------------*/
.event_none {height: 20vh; line-height: 20vh; text-align: center;}
/* .event_board {border-bottom: 1px solid #e6e6e6; font-size: 1.4rem; color: var(--n-gray-800);}
.event_board .board_head {padding: 2rem 0; border-bottom: 1px solid #e6e6e6;}
.event_board .board_head .title {font-size: 1.8rem; font-weight: 700; color: var(--n-gray-900);}
.event_board .board_content { padding: 2rem 0; overflow-x: auto;}
.event_board .board_content img {width: 100%;} */

/*-------------------------------------------
  -- review(리뷰)
-------------------------------------------*/
.review_list {}
.tab_line_wrap + .review_list {margin-top: -2rem;}
.review_list_item {display: flex; flex-direction: column; padding: 2rem 0; border-bottom: 1px solid var(--n-gray-200); font-size: 1.4rem;}
.review_list_header .review_info {display: flex; flex-direction: row; align-items: center; gap: 1.2rem; margin-bottom: 1.2rem; font-size: 1.3rem; font-weight: 400; color: var(--n-gray-500);}
/* .review_list_header .grade {display: flex; align-items: center; gap: 0 .4rem;}
.review_list_header .grade_icon {background: url(../svg/star-fill.svg) no-repeat center/100%; content: ""; display: inline-block; width: 1rem; height: 1rem; filter: var(--n-filter-gray2);}
.review_list_header .grade_icon.active {filter: var(--n-filter-primary);} */
.review_list_header .grade_num {position: relative; padding-left: calc(1.6rem + .4rem); font-size: 1.6rem; font-weight: 600; color: var(--n-orange); line-height: 137.5%;}
.review_list_header .grade_num::before {background: url(../svg/star-fill.svg) no-repeat center/100%; content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); display: block; width: 1.6rem; height: 1.6rem; filter: var(--n-filter-orange);}
.review_list_header .title {font-size: 1.5rem; font-weight: 500; color: var(--n-gray-900); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.review_list_content {display: flex; flex-wrap: nowrap; gap: 1.6rem;}
.review_list_content .desc {flex: 1; font-size: 1.3rem; color: var(--n-gray-700);}
.review_list_content .desc > pre {font-size: 1.3rem; color: var(--n-gray-700);}
.review_list_content .img_wrap {position: relative; width: 8.8rem; min-width: 8.8rem; height: 8.8rem; border-radius: .8rem; background-color: var(--n-gray-100); text-align: center; overflow: hidden;}
.review_list_content .img_wrap img {position:absolute; top:50%; left: 0; transform:translateY(-50%); width: 100%; height: auto;}

.grade_btn_wrap {display: flex; align-items: center; gap: 0 .4rem;}
.grade_btn_wrap .grade_btn {background: url(../svg/star-fill.svg) no-repeat center/100%; content: ""; display: inline-block; width: 2.4rem; height: 2.4rem; filter: var(--n-filter-disabled);}
.grade_btn_wrap .grade_btn.active {filter: var(--n-filter-orange);}
.review_photo_wrap {position: relative; width: calc(100vw * .35); height: calc(100vw * .35); max-width: 180px; max-height: 180px; border-radius: .8rem; border: 1px solid var(--n-gray-200); overflow: hidden;}
.review_photo_wrap label {width: 100%; height: 100%; background: url(../svg/plus-lg.svg) no-repeat center/30%; filter: var(--n-filter-gray4);}
.review_photo_wrap img {position:absolute; top:50%; transform:translateY(-50%); width: 100%; height: auto;}
.btn_photo_remove {position: absolute; top: 1rem; right: 1rem; width: 2.5rem; height: 2.5rem; border-radius: 10rem; background-color: #000; opacity: 50%;}
.btn_photo_remove:hover {opacity: 70%;}
.btn_photo_remove::before {background: url(../svg/x-lg.svg) no-repeat center/100%; content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: inline-block; width: 12px; height: 12px; filter: var(--n-filter-white);}

/*-------------------------------------------
  -- qna(자주묻는질문)
-------------------------------------------*/
.qna_wrap {padding-top: 2rem;}

/* qna tab */
.qna_tab_wrap {margin-bottom: 1.6rem;}
.qna_tab {display: flex; flex-wrap: wrap; gap: .8rem; width: 100%;}
.qna_tab_link {display:inline-flex; justify-content: center; align-items: center; height: 3.6rem; padding: 0 1.6rem; font-size: 1.3rem; background-color: var(--n-gray-100); border-radius:100px; color: var(--n-gray-500);}
.qna_tab_link:hover {color: var(--n-gray-500);}
.qna_tab_link.on {font-weight: 500; color: #fff; background-color: var(--n-gray-700);}

/* qna accordion */
.qna_acc_wrap {border-top: 1px solid var(--n-gray-900);}
.qna_acc_wrap .acc_item {width: 100%; padding: 2rem 0; border-bottom: 1px solid var(--n-gray-200);}
.qna_acc_wrap .acc_header {font-size: 1.5rem; font-weight: 500; text-align: left; color: var(--n-gray-900);}
.qna_acc_wrap .acc_header_link {position: relative; display: flex; width: 100%; padding: 0; background-color: transparent; text-align: left;}
.qna_acc_wrap .acc_header .acc_header_link::after {content: ""; background-image: url(../svg/chevron-down.svg); background-repeat: no-repeat; background-position: center; background-size: 100%; position: absolute; top: 50%; transform: translateY(-50%); right: 0; display: inline-block; width: 2rem; height: 2rem; filter: var(--n-filter-gray5);}
.qna_acc_wrap .acc_header.active .acc_header_link::after {background-image: url(../svg/chevron-up.svg);}
.qna_acc_wrap .acc_content {display: none; padding-top: 1.2rem;}
.qna_acc_wrap .acc_content_inner {padding: 1.6rem; border-radius: .8rem; font-size: 1.4rem; color: var(--n-gray-700); background-color: var(--n-gray-100); line-height: 1.75;}
.qna_acc_wrap .acc_content_inner pre {font-size: 1.4rem; margin-bottom: 0;}

.qna_acc_wrap .q_mark {margin-right: .8rem; font-weight: 600; color: var(--n-gray-900);}

/*-------------------------------------------
  -- notice(공지사항)
-------------------------------------------*/
.notice_wrap {padding-top: 2rem;}

/* notice list */
.notice_list {border-top: 1px solid var(--n-gray-900);}
.notice_list_item {display: flex; flex-direction: column; padding: 2rem 0; border-bottom: 1px solid var(--n-gray-200); font-size: 1.5rem;}
.notice_list_item .title {margin-bottom: .8rem; font-weight: 500;}
.notice_list_item .date {font-size: 1.3rem; color: var(--n-gray-500);}
.notice_list_link {color: var(--n-gray-900);}
.notice_list_link:hover {color: var(--n-gray-900);}

/* 접수내역 */
.notice_list_item.order_item {display: block; padding: 2rem 1rem; border-color: var(--n-gray-300);}
.notice_list_item.order_item + .order_item {border-top: 1px solid var(--n-gray-900);} 
.notice_list_item.order_item .order_info {padding-bottom: 1.6rem; margin-bottom: 1.6rem; border-bottom: 1px solid var(--n-gray-200);}
.notice_list_item.order_item .order_info .info_link {position: relative; display: flex; flex-direction: column; font-size: 1.6rem; font-weight: 700; color: var(--n-gray-900);}
.notice_list_item.order_item .order_info .info_link .ref {font-size: 1.3rem; font-weight: 400; color: var(--n-gray-500);}
.notice_list_item.order_item .order_info .info_link::after {content: ''; position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 2rem; height: 2rem; background: url(../svg/chevron-right.svg) no-repeat center/100%; filter: var(--n-filter-gray7); }

.notice_list_item.order_item .inner_flex {display: flex; flex-direction: column; justify-content: space-between;}
.notice_list_item.order_item .title {margin-bottom: 0; font-size: 1.4rem; font-weight: 500; color: var(--n-gray-900);}
.notice_list_item.order_item .text {font-size: 1.3rem; color: var(--n-gray-500);}
.notice_list_item.order_item .status {font-weight: 700; color: var(--n-secondary);}
.notice_list_item.order_item .btn_group {display: flex; flex-direction: row; justify-content: center; gap: .5rem; min-width: 9rem; padding: 0; margin-top: 1.2rem;}
.notice_list_item.order_item .btn_group > * {flex: 1 0 auto;}

/*-------------------------------------------
  -- store list(매장안내)
-------------------------------------------*/
.store_list {border-top: 1px solid var(--n-primary);}
.store_list_item {display: flex; flex-direction: column; padding: 2rem 1.6rem; border-bottom: 1px solid #e6e6e6; font-size: 1.4rem;}
.store_list_item .title {margin-bottom: .5rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.store_list_item .date {font-size: 1.3rem; color: var(--n-gray-500);}

/* map */
.store_map {width: 100%; height: 15rem;}
.store_map iframe {width: 100%; height: 100%;}

/* desc */
.store_desc {padding-top: 1rem;}
.store_desc .title {margin-bottom: 0; color: var(--n-gray-900); font-weight: 700;}
.store_desc .ref {margin-top: .5rem; color: var(--n-gray-600);}
.store_link {color: var(--n-gray-800);}
.store_link:hover {color: var(--n-gray-800);}
.store_link .title {margin-bottom: 0; color: var(--n-gray-900); font-weight: 700;}
.store_link .ref {margin-top: .5rem; color: var(--n-gray-600);}

/* old */
.store_card_link {display: block; padding: 1.6rem; font-size: 1.4rem; background-color: #fff; color: var(--n-gray-800); border: 1px solid #e6e6e6; border-radius: 10px; margin-bottom: 1rem; cursor: default;}
.store_card_link:hover {color: var(--n-gray-800);}
.store_card_link .title {margin-bottom: 0; color: var(--n-gray-900); font-weight: 700;}
.store_card_link .ref {margin-top: .5rem; font-size: 1.3rem; color: var(--n-gray-700);}

/*-------------------------------------------
  -- online cs(1:1문의)
-------------------------------------------*/
.agree_group {padding: 2rem; margin-top: 2rem; border-radius: 1.2rem; background-color: var(--n-gray-100);}
.agree_box {padding: 1.2rem; border-radius: .8rem; font-size: 1.3rem; background-color: #fff;}
.agree_check {margin-top: 1.2rem;}

/*img upload*/
.cs_photo_wrap {position: relative; width: calc(100vw * .35); height: calc(100vw * .35); max-width: 250px; max-height: 250px; border-radius: .5rem; border: 1px solid #e6e6e6; overflow: hidden;}
.cs_photo_wrap label {width: 100%; height: 100%; background: url(../svg/plus-lg.svg) no-repeat center/30%; filter: var(--n-filter-gray4);}
.cs_photo_wrap img {position:absolute; top:50%; transform:translateY(-50%); width: 100%; height: auto;}

/* pagination */
.pagination {align-items: center; justify-content: center; gap: .8rem; margin-top: 2.4rem;}
.page_icon {display: inline-flex; justify-content: center; align-items: center; width: 2.4rem; height: 2.4rem; border: 1px solid var(--n-gray-200); border-radius: 999px;}
.page_icon::after {content: ''; width: 1.6rem; height: 1.6rem; filter: var(--n-filter-gray5);}
.page_first::after {background: url(../svg/chevron-double-left.svg) no-repeat center/100%;}
.page_last::after {background: url(../svg/chevron-double-right.svg) no-repeat center/100%;}
.page_prev::after {background: url(../svg/chevron-left.svg) no-repeat center/100%;}
.page_next::after {background: url(../svg/chevron-right.svg) no-repeat center/100%;}
.page_link {display: inline-flex; justify-content: center; align-items: center; width: 2.4rem; height: 2.4rem; border-radius: 999px; font-size: 1.4rem; color: var(--n-gray-700);}
.page_link:hover {color: var(--n-gray-700);}
.page_link.on {color: #fff; background-color: var(--n-gray-500);}

/*-------------------------------------------
  -- apply change(가입정보변경)
-------------------------------------------*/
.applychg_tab {margin-bottom: 2rem;}
.applychg_tab li {width: calc(33.33333% - .8rem);}
.applychg_tab .tab_box_link.check_self::before {content: ''; position: absolute; top: .6rem; left: .6rem; display: block; width: 1.6rem; height: 1.6rem; background: url(../svg/asterisk.svg) no-repeat center/100%; filter: var(--n-filter-gray5);}
.applychg_tab .tab_box_link.on::before {filter: var(--n-filter-secondary);}

/*-------------------------------------------
  -- contact
-------------------------------------------*/
.company_img_wrap {background: url(../img/img-about-company_v3.jpg)no-repeat center/cover; width: 100%; height: 15rem; margin-top: -39px;}

/*-------------------------------------------
  -- prepaid
-------------------------------------------*/
/* guide */
.charge_wrap .guide_area {font-size: 1.4rem; color: var(--n-gray-700); word-break: keep-all;}
.charge_wrap .guide_area h2 {font-size: 1.6rem;}
.charge_wrap .guide_area h4 {margin-bottom: 1rem;}
.charge_wrap .guide_con + .guide_con {margin-top: 3.2rem;}
.charge_wrap .guide_area .guide_cardlist > * {display: flex; flex-direction: column; margin-bottom: 1.6rem;}
.charge_wrap .guide_area .guide_cardlist .box {height: 100%;}

/* custom */
.charge_wrap .step button {max-width: 180px;}

/*-------------------------------------------
  -- mypage
-------------------------------------------*/
/* join info */
.my_info.joinInfo .header {padding: 2rem; margin-bottom: 2.4rem; border-radius: 1.2rem; background-color: var(--n-secondary-light);}
.my_info.joinInfo .header_top {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; font-size: 1.5rem;}
.my_info.joinInfo .header_top .name {font-size: 1.6rem; font-weight: 700; color: var(--n-gray-900);}
.my_info.joinInfo .header_top .apply_no b {color: var(--n-secondary);}
.my_info.joinInfo .header_bottom {padding: 1.2rem; margin-top: 1.2rem; border-radius: .8rem; font-size: 1.3rem; background-color: #fff;}
.my_info.joinInfo .header_bottom ul {display: flex; flex-direction: column; gap: .8rem;}
.my_info.joinInfo .header_bottom ul li {display: flex; width: 100%; justify-content: space-between;}
.my_info.joinInfo .header_bottom ul li span {position: relative; padding-right: .8rem; font-weight: 500;}

.my_info.joinInfo .order_box {height: 100%; padding: 1.5rem; border-radius: .5rem; border: 1px solid var(--n-gray-300);}  

.my_info.joinInfo .content_box {display: flex; flex-direction: column; padding: 0 .8rem; margin-bottom: 3.2rem;}
.my_info.joinInfo .content_box .title_wrap {margin-bottom: 1.2rem;}
.my_info.joinInfo .content_box .title_wrap h2 {margin-bottom: 0; padding-bottom: 0; border-bottom: 0; line-height: 1.75;}
.my_info.joinInfo .content_box .title_wrap.type2 {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;}
.my_info.joinInfo .content_box .title_wrap.type3 {display: flex; flex-direction: column; justify-content: space-between;}
.my_info.joinInfo .content_box .title_wrap .ref {font-size: 1.2rem; font-weight: 400; color: var(--n-gray-400);}
.my_info.joinInfo .content_box .title_wrap .amount_refresh {display: flex; justify-content: end; align-items: center; gap: .8rem; font-size: 1.2rem; font-weight: 400; color: var(--n-gray-400);}
.my_info.joinInfo .content_box .title_wrap .amount_refresh button {height: 3rem;}

.my_info.joinInfo .content_box ul {position: relative; flex-grow: 1; height: 100%;}
.my_info.joinInfo .content_box ul li.data_none {height: 100%; min-height: unset;}
.my_info.joinInfo .content_box ul li.btn_wrap {margin-top: auto;} 
.my_info.joinInfo .content_box ul .rateplan {padding: 1.2rem; border-radius: .6rem; font-size: 1.5rem; font-weight: 500; color: var(--n-secondary); background-color: var(--n-secondary-light); text-align: center;}
.my_info.joinInfo .content_box ul .btn_underline {font-size: unset;}

.my_info.joinInfo .content_box .btn_group {border-radius: .6rem; background-color: var(--n-gray-500); word-break: keep-all;}
.my_info.joinInfo .content_box .btn_group .btn_item {position: relative;}
.my_info.joinInfo .content_box .btn_group .btn_item:not(:first-child)::before {content: ''; display: block; width: 1px; height: 1.6rem; background-color: var(--n-gray-400); position: absolute; top: 50%; transform: translateY(-50%);} 
.my_info.joinInfo .content_box .btn_group .btn {width: 100%; min-height: 4rem; padding: 0 1.2rem; font-size: 1.4rem; font-weight: 500; color: #fff; background-color: transparent;}

.my_info.joinInfo .content_box .box_guide .text {padding: 0; margin: 0;}

.my_info.joinInfo .content_box .amount_info {display: flex; flex-wrap: wrap; gap: .8rem 0;}
.my_info.joinInfo .content_box .amount_info ul {flex-grow: 1;}
.my_info.joinInfo .content_box .amount_info > * {padding: 0 .4rem;}
.my_info.joinInfo .content_box .amount_info .amount {color: var(--n-gray-500); flex-shrink: 0;}
.my_info.joinInfo .content_box .amount_info .amount .acc {font-weight: 700; color: var(--n-primary);}
.my_info.joinInfo .amount_area + .form_notice {font-size: 1.3rem;}

.my_info.joinInfo .charge_area {flex-direction: column;}
.my_info.joinInfo .charge_area .total_info {padding: 2rem; border-radius: 1.2rem; font-size: 1.6rem; color: var(--n-gray-900); background-color: var(--n-secondary-light);}
.my_info.joinInfo .charge_area .total_info .amount {display: flex; justify-content: space-between; font-weight: 500;}
.my_info.joinInfo .charge_area .total_info .amount span {color: var(--n-primary);}
.my_info.joinInfo .charge_area .total_info .period {font-size: 1.3rem; color: var(--n-gray-500);}
.my_info.joinInfo .charge_area .charge_info {width: 100%; margin-top: 1.2rem;}

/* pay history */
.select_month_area {text-align: center;}
.select_month_area + .bg_space10 {margin: 2.4rem 0;}
.select_month_area .select_box {}
.select_month_area .period {padding-top: 1rem; font-size: 1.3rem; color: var(--n-gray-500);}



/***********************************************************************************************************************
  F. Self
***********************************************************************************************************************/
.self_wrap h2 {margin-bottom: 2.4rem;}
.self_wrap .form_wrap + .form_wrap {margin-top: 4.8rem;}
.self_wrap .btn_group {background-color: transparent;}
.self_wrap .fixed-bottom .btn_group {backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); box-shadow: none;}

.self_wrap .box_outline_icon {filter: none;}
.self_wrap .n_btn_outline_gray {background-color: #fff;}
.self_wrap #harmAgree .box {background-color: transparent; border: 1px solid var(--n-gray-300);}
.self_wrap #areaTerms {padding-top: 1.6rem; margin-top: 1.6rem; border-top: 1px dashed var(--n-gray-200);}

#inisisAuth .modal-body {height: 65vh;}
#inisisAuth .acc_group {border-top: 1px solid var(--n-gray-900);}
#inisisAuth .step {gap: 2rem;}
#inisisAuth .step_item {display: grid; grid-template-columns: 5.6rem 1fr; grid-gap: 0 1.6rem; text-align: start;}
#inisisAuth .step_item + .step_item::before {display: none;}
#inisisAuth .step_item .img_wrap {grid-row: 1 / span 2; width: 5.6rem; height: 5.6rem; margin-bottom: 0;}
#inisisAuth .step_item .img_wrap img {width: 3.2rem; height: 3.2rem;}
#inisisAuth .step_item .title {position: relative; flex-direction: unset; justify-content: normal; font-size: 1.6rem;}
#inisisAuth .step_item .title::before {content: counter(section); display: inline-flex; justify-content: center; align-items: center; width: 1.8rem; height: 1.8rem; border-radius: .6rem; font-size: 1.1rem; font-weight: 600; color: #fff; background-color: var(--n-gray-900);}

.self_wrap #hopeNumListArea {margin: 1rem 0;}
.self_wrap #hopeNumList {padding: 1.2rem 0; gap: 1.6rem 0;}
.self_wrap #hopeNumListArea button {max-width: 180px;}

.self_copy_wrap {padding-top: 2rem; padding-bottom: 4rem;}
.self_copy {font-size: 1rem; color: var(--n-gray-400); text-align: center;}

/*-------------------------------------------
  -- step1
-------------------------------------------*/
.step1-activeInfo {margin-bottom: 4rem;}

.step1-authInfo .box {height: 100%; padding: 2rem; background-color: var(--n-secondary-light);}
.step1-authInfo .box_outline_icon {margin-bottom: .8rem;}
.step1-authInfo .box_outline_icon img {filter: var(--n-filter-secondary);}
.step1-authInfo .box_outline_text {padding-top: 0;}

/* self call (가입 가능시간 안내) */
.self_call {font-size: 1.4rem; color: var(--n-gray-800);}
.self_call .title {margin-bottom: .5rem; font-weight: 700;}
.self_call .content {padding-left: 1.2rem; margin-bottom: 1.6rem; list-style: "- ";}
.self_call .content li {word-break: keep-all;}
.self_call .ref {font-size: 1.1rem; color: var(--n-gray-500);}

/* self modal & swiper */
.self-simtype-img {width: 100%; max-width: 360px;}

/* self info (셀프개통 안내) */
.self_info .step.type2.arrow_none .step_item {flex: 1 1 auto;}

/* 유심/esim 안내 버튼(임시) */
.self_wrap .guide_btn {text-align: right;}
.self_wrap .guide_btn button {height: 3rem; font-size: 1.3rem;}

/*-------------------------------------------
  -- price select(요금제 선택 - step_price)
-------------------------------------------*/
/* price filter */
.price_filter, .price_filter_popup {top: 5.6rem; padding-bottom: 1.2rem; background-color: #fff; overflow-x: visible;}
.price_filter .swiper {padding-right: 1rem;}
.price_filter button, .price_filter_popup button {display: inline-flex; justify-content: center; align-items: center; height: 3.6rem; padding: 0 1.6rem; font-size: 1.3rem; background-color: var(--n-gray-100); border-radius: 100px; color: var(--n-gray-500);}
.price_filter button.on, .price_filter_popup button.on {font-weight: 500; color: #fff; background-color: var(--n-gray-700);}

.self_wrap .price_sticky_wrap {top: 5.6rem; background-color: #fff;}
.body_wrap_agent.self_wrap .price_sticky_wrap {top: 0;}
.self_wrap .price_sticky_wrap .sub_header {position: relative; top: 0; margin-bottom: 1.6rem;}
.self_wrap .price_sticky_wrap .price_filter {top: 0; margin-top: 0; border-bottom: 0;}
.self_wrap .box_cardlist {padding-top: 2.4rem; border-radius: 0;}

/* price list */
.card_price_list {border: none; background-color: transparent;}
.card_price_list + .card_price_list {margin-top: 1.6rem;}
.card_price_list label {padding: 2rem; border: 1px solid var(--n-gray-200); border-radius: 1.2rem; background-color: #fff;}
.card_price_list input[type="radio"] {display: none;}
.card_price_list input[type="radio"]:checked + label {border: 2px solid var(--n-primary);}

.card_price_list .badge_wrap {margin-bottom: 1.6rem;}
.card_price_list .head {font-size: 1.3rem; font-weight: 500; color: var(--n-gray-500);}
.card_price_list .content_group {flex-direction: column; gap: 1.6rem;}
.card_price_list .text {color: var(--n-gray-900);}
.card_price_list .text li {position: relative; display: inline-block;}
.card_price_list .text li.data {font-weight: 700;}
.card_price_list .text li + li {padding-left: .6rem; margin-left: .6rem;}
.card_price_list .text li + li::before {content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); display: block; width: 1px; height: 1rem; background-color: var(--n-gray-300);}
.card_price_list .detail {font-size: 1.4rem;}
.card_price_list .detail .ref {color: var(--n-gray-500);}
.card_price_list .price {display: flex; flex-direction: column; font-size: 1.6rem; font-weight: 700; color: var(--n-primary); text-align: end;}
.card_price_list .price .ref {font-size: 1.3rem; font-weight: 400; color: var(--n-gray-500);}

/*-------------------------------------------
  -- order list(가입정보 확인 - step_6)
-------------------------------------------*/
.order_list_wrap h1 {margin-bottom: 3.2rem;}
.order_list_wrap h2 {font-size: 1.6rem; margin-bottom: 1.2rem;}
.order_list_wrap .order_list.type_flex, .order_box.type_flex {display: flex; flex-direction: column;}
.order_list_wrap .title_wrap {}
.order_list_wrap .title_wrap.type2 {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;}
.order_list {padding: 1.2rem 0; border-top: 1px solid var(--n-gray-900); border-bottom: 1px solid var(--n-gray-200);}
.order_list > li {padding: .8rem 0;}
.order_list .title {flex: 0 0 auto; width: 33.33333%; font-size: 1.4rem; font-weight: 500; color: var(--n-gray-700);}
.order_list .text {font-size: 1.4rem; color: var(--n-gray-700);}
.order_list .text_flex {display: flex; flex-direction: column; align-items: start;}

/* .order_list .box_guide {margin-top: 1rem;}	
.order_list .box_guide .row + .row {padding-top: 1rem;} */

/*-------------------------------------------
  -- applyComplArea(접수완료 - step_7)
-------------------------------------------*/
.applyComplArea .img_wrap {margin-bottom: .8rem;}
.applyComplArea .img_wrap img {width: 4.8rem; filter: var(--n-filter-primary);}
.applyComplArea .box {color: var(--n-gray-700); background-color: var(--n-secondary-light); word-break: keep-all;}



/***********************************************************************************************************************
  G. Components
***********************************************************************************************************************/
/*-------------------------------------------
  -- form
-------------------------------------------*/
.form_wrap + .form_wrap {margin-top: 4rem;}
.form_group {margin-bottom: 2.4rem;}
.form_group:last-child {margin-bottom: 0;}
.input_group {position: relative;}
.input_group input[type="email"] {padding-right: 7rem;}

.input_flex {display: flex; align-items: center; gap: .4rem;}
.input_flex input {flex: 1;}
.input_flex button {height: 4.8rem; padding: 0 1.2rem; font-size: 1.4rem;}

.form_notice {width: 100%; margin-top: 1.2rem; font-size: 1.3rem; color: var(--n-gray-500);}
/* .form_group#areaTerms > div + div {padding: .5rem 0} */

/* label */
.n_form_label {font-size: 1.4rem; padding-bottom: .8rem; margin: 0; color: var(--n-gray-700); word-break: keep-all;}
.n_check_label {font-size: 1.4rem; color: var(--n-gray-700); word-break: keep-all;}

/* checkbox - terms */
.form_check_group {display: flex; gap: .8rem 1.6rem;}
.terms_area {display: flex; flex-direction: column; gap: 1.6rem;}
.form_check_icon {display: flex; align-items: center; gap: 1.6rem;}
.form_check_icon.form-check {padding-left: 0;}
.form_check_icon .form-check {flex: 1 1 auto; padding-left: 0; margin-bottom: 0;}
.form_check_icon .n_check_label {position: relative; padding-left: calc(1.8rem + .8rem);}
.form_check_icon input[type="checkbox"] + label span {position: absolute; top: 50%; left: 0; display: inline-block; width: 1.8rem; height: 1.8rem; vertical-align: top; cursor: pointer; transform: translateY(-50%); background: url(../svg/checkbox-check.svg) no-repeat center/100%; background-size: 100%; background-position: 0 0; filter: var(--n-filter-gray4);}
.form_check_icon input[type="checkbox"]:checked + label span {filter: var(--n-filter-gray9);}
.form_check_icon .form_check_btn {flex: 0 0 auto; position: relative; display: inline-flex; align-items: center; padding: 0; font-size: 1.3rem; color: var(--n-gray-500); background-color: transparent;}
.form_check_icon .form_check_btn::after {content: ''; display: block; width: 1.4rem; height: 1.4rem; background: url(../svg/chevron-right.svg) no-repeat center/100%; filter: var(--n-filter-gray5);}

/* form number */
.form_number {display: flex; flex-wrap: wrap; width: fit-content; border: 1px solid var(--n-gray-200); border-radius: .6rem;}

.form_number .form_number_btn {position: relative; width: 4.8rem; height: 4.8rem; background-color: #fff;}
.form_number .form_number_btn:hover {background-color: rgba(15, 23, 42, .04);}
.form_number .form_number_btn::before {content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; width: 2.4rem; height: 2.4rem; filter: var(--n-filter-gray5); background-position: center; background-size: 100%; background-repeat: no-repeat;}
.form_number .form_number_btn.decrement::before {background-image: url(../svg/minus.svg);}
.form_number .form_number_btn.increment::before {background-image: url(../svg/plus.svg);}

.form_number .form_number_btn:disabled, .form_number .form_number_btn.disabled {cursor: default; pointer-events: none; opacity: 1;}
.form_number .form_number_btn:disabled::before, .form_number .form_number_btn.disabled::before {filter: var(--n-filter-disabled);}

.form_number .form_number_inp {
	flex: 1 0 auto;
	display: inline-block;
	width: 1%;
	min-width: 4.8rem;
	max-width: 5.6rem;
	padding: 0;
	border: 0;
	border-radius: 0;
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--n-gray-700);
	text-align: center;
	
	-moz-appearance: textfield;
}
.form_number_inp::-webkit-outer-spin-button,
.form_number_inp::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.form_number_inp:read-only {background-color: #fff;}

/*-------------------------------------------
  -- list
-------------------------------------------*/
.list li {position: relative;}
.list li + li {margin-top: .6rem;}
.list li.ref {margin-top: .25rem; padding-left: 1rem;}

.list_dash li {position: relative; padding-left: 1rem;}
.list_dash li + li {margin-top: .6rem;}
.list_dash li:before {content: ""; position: absolute; top: 10px; left: 0; display: block; width: 5px; height: 1px; background-color: var(--n-gray-700);}
.list_dash li.ref:before {display: none;}

.list_dot li {position: relative; padding-left: 1rem;}
.list_dot li + li {margin-top: .6rem;}
.list_dot li.ref {margin-top: .25rem;}
.list_dot li:before {content: ""; position: absolute; top: 8px; left: 0; display: block; width: 2px; height: 2px; border-radius: 100%; background-color: var(--n-gray-500);}
.list_dot li.ref:before {display: none;}

.list_ico li {position: relative; display: flex; gap: .3rem; padding-left: 0; word-break: keep-all;}
.list_ico li:before {content: ""; display: none;}
.list_ico li + li {margin-top: .6rem;}
.list_ico li.ref {margin-top: .25rem;}
.list_ico li.ref ul li+li {margin-top: .25rem;}

.select_list_area {}
.select_list.flex_row {margin: 0;}
.select_list {gap: 1.2rem .8rem; margin: 0;}
.select_list li {position: relative; width: calc(33.33333% - .8rem); padding: 0; text-align: center;}
.select_list li a {display: inline-block; width: 100%; height: 100%; padding: 1.6rem .8rem; border: 1px solid var(--n-gray-300); border-radius: 1.2rem; font-size: 1.3rem; color: var(--n-gray-700);}
.select_list li a.on {border-width: 2px; border-color: var(--n-primary); font-weight: 500; color: var(--n-gray-900);}
.select_list li a .img_wrap {width: 4rem; height: 4rem; margin: 0 auto; border-radius: .6rem; overflow: hidden; box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;}
.select_list li a .img_wrap img {width: 100%; height: 100%; object-fit: cover;}
.select_list li a span {display: inline-block; margin-top: .4rem;}

/*-------------------------------------------
  -- table
-------------------------------------------*/
.table_board {width: 100%; border-top: 1px solid var(--n-gray-900); border-bottom: 1px solid var(--n-gray-300); font-size: 1.4rem;}
.table_board tr {display: flex; flex-direction: column; padding: 1.2rem 0;}
.table_board th {margin-bottom: .4rem; font-weight: 500; color: var(--n-gray-900); word-break: keep-all;}
.table_board td {}

.table_board.type2 {width: 100%; border-top: 2px solid var(--n-primary); font-size: 1.4rem;}
.table_board.type2 tr {display: table-row; border-bottom: 1px solid #e6e6e6;}
.table_board.type2 th {width: auto; min-width: unset; padding: 1rem; border: 1px solid #e6e6e6; background-color: var(--n-gray-100); color: var(--n-gray-900); text-align: center;}
.table_board.type2 th:first-child {border-left: 0;}
.table_board.type2 th.be_0 {border-right: 0;}
.table_board.type2 td {width: auto; padding: 1.6rem 1rem; color: var(--n-gray-800); line-height: 1.5}
.table_board.type2 td ~ td {border-left: 1px solid #e6e6e6;}

/*-------------------------------------------
  -- box
-------------------------------------------*/
.box {border-radius: 1.2rem;}

.box_title {font-size: 1.5rem; font-weight: 600; color: var(--n-gray-900); margin-bottom: 1rem;}
.box_icon {margin-bottom: 1.2rem;}
.box_icon img, .board .box_icon img {width: 4rem;}

.box_outline {padding: 2rem; border: 1px solid var(--n-gray-300);}
.box_outline_title {font-size: 1.6rem; font-weight: 500; color: var(--n-gray-900);}
.box_outline_text {padding-top: .8rem; font-size: 1.3rem; color: var(--n-gray-500);}
.box_outline_icon img {width: 4rem; filter: var(--n-filter-gray4);}

.box_form {padding: 2rem; background-color: var(--n-secondary-light);}
.box_form .inner {max-width: 430px;}
.box_form .img_wrap {margin-bottom: 1.6rem;}
.box_form img {width: 200px; height: auto; box-shadow: 0, 1, 10, rgba(0, 0, 0, .5);}
.box_form .title {margin-bottom: 1.6rem; font-size: 1.5rem; font-weight: 700; color: var(--n-gray-900);}
.box_guide + .form_wrap {margin-top: 3.2rem;}
.box_form .btn_group {background-color: transparent;}

.box_cardlist {background-color: #F8F9FC; overflow-y: auto;}
.box_cardlist .inner {padding-bottom: 10.4rem;}

.box_list {padding: 2rem; background-color: var(--n-secondary-light);}

.box_guide {padding: 2rem; background-color: var(--n-gray-100);}
.box_guide .title {font-size: 1.5rem; font-weight: 700; color: var(--n-gray-900);}
.box_guide .text {padding: .8rem 0 ; margin-top: .8rem; font-size: 1.4rem; color: var(--n-gray-700);}
.box_guide .img_box {width: 180px; height: 230px; border: 1px solid var(--n-gray-300); border-radius: 5px 5px 0 0;}
.img_box#imgKeypad { background: no-repeat center/100% url(../img/IMEI_guide01.jpeg);}
.img_box#imgPhoneInfo { background: no-repeat bottom/100% url(../img/IMEI_guide02.jpeg);}
.box_guide .text_group_title {font-size: 1.5rem; font-weight: 700; margin-bottom: 1.6rem;}
.box_guide .text_group_ref {font-size: 1.4rem;}

.box_green {height: 100%; padding: 2rem; background-color: #EEFAED;}
.box_green .title {font-size: 1.5rem; font-weight: 700; color: var(--n-gray-900);}

.box_light {height: 100%; padding: 2rem; background-color: var(--n-secondary-light);}
.box_light .title {font-size: 1.4rem; font-weight: 700;}
.box_light .desc {font-size: 1.3rem;}

/*-------------------------------------------
  -- button
-------------------------------------------*/

/* disabled */
button:disabled, .btn:disabled, a:disabled, button.disabled, .btn.disabled, a.disabled {pointer-events: none; opacity: .45;}

/* .btn-check[disabled] + .select_btn, .btn-check[disabled] + .select_btn_t2,
.btn-check:checked[disabled] + .select_btn, .btn-check:checked[disabled] + .select_btn_t2,
.select_btn.disabled, .select_btn_t2.disabled,
.btn-check:checked + .select_btn.disabled, .btn-check:checked + .select_btn_t2.disabled {pointer-events: none; border-color: #d0d0d0; background-color: #d0d0d0; color: #a6a6a6; opacity: 1;}
.btn-check:checked[disabled] + .select_btn, .btn-check:checked[disabled] + .select_btn_t2,
.btn-check:checked + .select_btn.disabled, .btn-check:checked + .select_btn_t2.disabled {border-color: #bababa;} */

.btn-check[disabled] + .select_btn, .btn-check[disabled] + .select_btn_t2,
.select_btn.disabled, .select_btn_t2.disabled  {pointer-events: none; opacity: 1; }
.btn-check:checked[disabled] + .select_btn, .btn-check:checked[disabled] + .select_btn_t2,
.btn-check:checked + .select_btn.disabled, .btn-check:checked + .select_btn_t2.disabled,
.btn-check:checked[disabled] + .select_btn, .btn-check:checked[disabled] + .select_btn_t2,
.btn-check:checked + .select_btn.disabled, .btn-check:checked + .select_btn_t2.disabled {pointer-events: none; opacity: .45;}

.btn_wrap {margin-top: 2.4rem;}
.btn_group {padding: 1rem 0; background-color: #fff;}
.btn_group.type_flex {display: flex; padding: 0;}
.btn_group.type_flex > * {flex: 1;}
.fixed-bottom {z-index: 1029;}
.fixed-bottom .btn_group {box-shadow: 0 -2px 16px #00000014;}

.n_btn_primary {background-color: var(--n-primary); color: #fff;}
.n_btn_primary:hover {background-color: var(--n-primary-hover); color: #fff;}
.n_btn_lightprimary {background-color: var(--n-primary-light); color: var(--n-primary);}
.n_btn_lightprimary:hover {background-color: #FFC1C6; color: var(--n-primary);}
.n_btn_lightgray {background-color: var(--n-gray-200); color: var(--n-gray-700);}
.n_btn_lightgray:hover {background-color: var(--n-gray-300);  color: var(--n-gray-700);}
.n_btn_darkgray {background-color: var(--n-gray-500); color: #fff;}
.n_btn_darkgray:hover {background-color: var(--n-gray-600); color: #fff;}
.n_btn_dark {background-color: var(--n-gray-900); color: #fff;}
.n_btn_dark:hover {background-color: var(--n-gray-800); color: #fff;}
.n_btn_outline_primary {background-color: transparent; border: 1px solid var(--n-primary); color: var(--n-primary);}
.n_btn_outline_primary:hover {color: var(--n-primary); background-color: var(--n-gray-50);}
.n_btn_outline_gray {background-color: transparent; border: 1px solid var(--n-gray-300); color: var(--n-gray-500);}
.n_btn_outline_gray:hover {color: var(--n-gray-500); background-color: var(--n-gray-50);}
.n_btn_outline_dark {background-color: transparent; border: 1px solid var(--n-gray-900); color: var(--n-gray-900);}
.n_btn_outline_dark:hover {color: var(--n-gray-900); background-color: var(--n-gray-50);}
.n_btn_info {background-color: var(--n-gray-200); color: var(--n-gray-700);}
.n_btn_info:hover {background-color: var(--n-gray-300);  color: var(--n-gray-700); border: none;}
.btn_underline {padding: 0; font-size: inherit; color: var(--n-gray-500); text-decoration: underline; vertical-align: middle; background-color: transparent;}
.btn_underline:hover {color: var(--n-gray-500);}
.btn_underline_primary {padding: 0; font-size: 1.5rem; color: var(--n-primary); text-decoration: underline; vertical-align: middle; background-color: transparent;}
.btn_underline_primary:hover {color: var(--n-primary);}
.btn_text_primary {position: absolute; top: 50%; transform: translateY(-50%); right: 10px; font-size: 1.4rem; font-weight: 500; background-color: transparent; color: var(--n-primary);}

.n_btn_pop {background-color: var(--n-gray-500); color: #fff;}
.n_btn_pop:hover {background-color: var(--n-gray-600); color: #fff;}

.btn_down {position: relative; width: 4rem; height: 4rem; font-size: 0; background-color: transparent; border-radius: .6rem; color: var(--n-gray-700);}
a.btn_down {display: inline-block; line-height: 4rem;}
.btn_down::before {content: ''; background: url(../svg/download.svg) no-repeat center/100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: inline-block; width: 2.4rem; height: 2.4rem; filter: var(--n-filter-gray7);}
.btn_down:hover {background-color: var(--n-gray-50);}
.btn_down:hover::before {filter: var(--n-filter-primary);}

/* button company */
.n_btn_img#thePay {background: url(../img/thePay_white.png) no-repeat center center; background-size: contain; background-color: #061E4F;}

/* button size */
.n_btn_lg {width: 100%; height: 4.8rem; padding: 0 1.2rem; font-size: 1.5rem; font-weight: 500; border-radius: .6rem;}
a.n_btn_lg {display: inline-block; line-height: 4.8rem; text-align: center;}
.n_btn_lg.w340 {max-width: 340px;}
.n_btn_lg.w260 {max-width: 260px;}
.n_btn_m {width: 100%; height: 4.4rem; padding: 0 1.2rem; font-size: 1.5rem; font-weight: 500; border-radius: .6rem;}
a.n_btn_m {display: inline-block; line-height: 4.4rem; text-align: center;}
.n_btn_s {width: 100%; height: 4rem; padding: 0 1.2rem; font-size: 1.4rem; border-radius: .6rem;}
a.n_btn_s {display: inline-block; line-height: 4rem; text-align: center;}
.n_btn_xs {max-width: 120px; height: 3.6rem; padding: 0 1.2rem; font-size: 1.3rem; border-radius: .6rem;}
a.n_btn_xs {display: inline-block; line-height: 3.6rem; text-align: center;}
.n_btn_auto {height: 3rem; padding: 0 1.2rem; font-size: 1.3rem; border-radius: .6rem; text-align: center;}
a.n_btn_auto {display: inline-block; line-height: 3rem; text-align: center;}
.oval {border-radius: 100px;}

/* btn style */
.btn_link_ico {position: relative; padding: 0; font-size: 1.4rem; font-weight: 500; color: var(--n-gray-900); background-color: transparent; vertical-align: middle;}
.btn_link_ico::after {background: url(../svg/chevron-right.svg) no-repeat center/100%; content: ""; display: inline-block; width: 1.4rem; height: 1.4rem; transform: translateY(3px);}
.btn_link_ico:hover {color: var(--n-gray-900);}

/* icon */
.icon_help {width: 2rem; height: 2rem; padding: 0; background: url(../svg/question-circle-fill.svg) no-repeat center center; background-size: 100%; background-position: 0 0; filter: var(--n-filter-gray4);}
.icon_help2 {width: 2rem; height: 2rem; padding: 0; background: url(../svg/question-circle.svg) no-repeat center center; background-size: 100%; background-position: 0 0; filter: var(--n-filter-gray9);}

/* select button */
input[type="radio"].btn-check  {display: none;}
.select_btn, .select_btn_t2 {display: flex; align-items: center; width: 100%; height: 100%; padding: 1.2rem; font-size: 1.4rem; color: var(--n-gray-700); border: 1px solid var(--n-gray-200); border-radius: .6rem; word-break: keep-all;}
.select_btn {justify-content: center;}
.select_btn_t2 {justify-content: space-between;}
.select_btn_lg {padding: 2.4rem 2rem;}
.btn-check + .select_btn:hover {border: 1px solid var(--n-gray-200); background-color: var(--n-gray-50);}
.btn-check:checked + .select_btn {color: var(--n-primary); border-color: var(--n-primary);}
.btn-check:checked + .select_btn, .btn-check:checked + .select_btn_t2, .select_btn.on {color: var(--n-primary); border-color: var(--n-primary); background-color: rgba(230, 0, 18, .08);}

/* selector */
select.select_box::-ms-expand {display: none;}
.select_box {
	position: relative;
	width: auto;
	padding: 1rem 2.4rem 1rem 1rem;
	font-size: 1.4rem;
	font-weight: 500;
	border: 1px solid #e6e6e6;
	border-radius: 1rem;
	color: var(--n-gray-900);
	background: url(../svg/chevron-down.svg) no-repeat;
	background-position: 95% 50%;
	background-size: 10px;

	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
.select_box + .select_box {margin-left: .5rem;}

/*-------------------------------------------
  -- badge
-------------------------------------------*/
.badge_wrap {display: flex; flex-wrap: wrap; gap: .5rem; width: 100%; margin-bottom: .5rem; border-radius: .3rem; overflow: hidden;}
.badge_wrap .badge, .badge {padding: .2rem .6rem; font-size: 1.1rem; font-weight: 500; border-radius: 0.4rem; line-height: 125%;}
/* .badge_wrap .badge + .badge {margin-left: .5rem;} */

.badge_primary {background-color: var(--n-primary); border: 1px solid var(--n-primary); color: #fff;}
.badge_light {background-color: var(--n-primary-light); border: 1px solid var(--n-primary-light); color: var(--n-primary);}
.badge_red {background-color: #F22727; border: 1px solid #F22727; color: #fff;}
.badge_purple {background-color: #9361FF; border: 1px solid #9361FF; color: #fff;}
.badge_green {background-color: #04BF33; border: 1px solid #04BF33; color: #fff;}
.badge_yellow {background-color: #FFE261; border: 1px solid #FFE261; color: #555140;}
.badge_blue {background-color: #617EFF; border: 1px solid #617EFF; color: #fff;}
.badge_orange {background-color: #FF9461; border: 1px solid #FF9461; color: #fff;}
.badge_black {background-color: var(--n-gray-900); border: 1px solid var(--n-gray-900); color: #fff;}
.badge_primary-line {background-color: transparent; border: 1px solid var(--n-primary); color: var(--n-primary);}
.badge_red-line {background-color: transparent; border: 1px solid #F22727; color: #F22727;}
.badge_purple-line {background-color: transparent; border: 1px solid #9361FF; color: #9361FF;}
.badge_green-line {background-color: transparent; border: 1px solid #04BF33; color: #04BF33;}
.badge_yellow-line {background-color: transparent; border: 1px solid #FFD000; color: #FFD000;}
.badge_blue-line {background-color: transparent; border: 1px solid #FF9461; color: #FF9461;}
.badge_black-line {background-color: transparent; border: 1px solid var(--n-gray-900); color: var(--n-gray-900);}

.badge_LGT {background-color: #E6007E; border: 1px solid #E6007E; color: #fff;}
.badge_KTF, .badge_KT {background-color: #5DDFDE; border: 1px solid #5DDFDE; color: var(--n-gray-700);}
.badge_SKT {background-color: #3617CE; border: 1px solid #3617CE; color: #fff;}

/*-------------------------------------------
  -- text
-------------------------------------------*/
h1 {font-size: 2.4rem; font-weight: 700; color: var(--n-gray-900); word-break: keep-all;}
h2 {margin-bottom: 1.2rem; font-size: 2rem; font-weight: 700; color: var(--n-gray-900); line-height: 150%; word-break: keep-all;}
.breadcrumb {font-size: 1.1rem; color: var(--n-gray-500); margin-bottom: 0;}
.text_lg_size {font-size: 1.6rem;}
.text_default_size {font-size: 1.4rem;}
.text_md_size {font-size: 1.3rem;}
.text_sm_size {font-size: 1.1rem;}
.text_default_color {color: var(--n-gray-700);}
.text_dark_color {color: var(--n-gray-900);}
.text_light_color {color: var(--n-gray-500);}
.text_primary_color {color: var(--n-primary);}
.text_secondary_color {color: var(--n-secondary);}
.text_bold {font-weight: 700;}
.text_semibold {font-weight: 500;}
.text_light {font-weight: 400;}
.text_info {margin-top: .5rem; font-size: 1.3rem;}

.ellipsis {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.ellipsis2 {overflow: hidden; text-overflow: ellipsis; word-break: break-all; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}

/*-------------------------------------------
  -- step
-------------------------------------------*/
.step {counter-reset: section; display: flex; flex-direction: column; justify-content: space-between; gap: 3.2rem;}
.step_icon {text-align: center; line-height: normal;}
.step_icon::before {content: counter(section);}

.step_item {counter-increment: section; position: relative; display: flex; flex-direction: column; align-items: center; flex: 1; text-align: center;}
.step_item + .step_item::before {content: ""; position: absolute; top: -2.6rem; left: 50%; transform: translateX(-50%); display: block; width: 1.6rem; height: 1.6rem; background: url(../svg/chevron-down.svg) center/100% no-repeat; filter: var(--n-filter-gray4);}
.step_item .img_wrap {position: relative; width: 8rem; height: 8rem; margin-bottom: .8rem; border-radius: 100%; background-color: var(--n-gray-100);}
.step_item .img_wrap img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 3.2rem; height: 3.2rem;}
.step_item .title {display: flex; flex-direction: column; justify-content: center; align-items: center; gap: .4rem; font-size: 1.5rem; font-weight: 700;}
.step_item .desc {margin-top: .4rem; font-size: 1.4rem; color: var(--n-gray-700);}
.step_item .step_icon {}
.step_item .step_icon::before {content: "STEP" counter(section); font-size: 1.5rem; font-weight: 500; color: var(--n-secondary);}
 
.step.type2 {}
.step.type2 .step_item {align-items: normal; text-align: start;}
.step.type2 .step_item .title {flex-direction: row; justify-content: normal; gap: .8rem;}
.step.type2 .step_item .step_icon {flex-shrink: 0; display: inline-flex; justify-content: center; align-items: center; width: 1.8rem; height: 1.8rem; border-radius: .6rem; background-color: var(--n-gray-900);}
.step.type2 .step_item .step_icon::before {content: counter(section); font-size: 1.1rem; font-weight: 600; color: #fff;}

.step.arrow_none {flex-direction: unset; flex-wrap: wrap; gap: 2rem;}
.step.arrow_none .step_item {flex: 1; width: calc(50% - 1rem);}
.step.type2.arrow_none .step_item {flex: 1 1 auto; width: 100%;}
.step.arrow_none .step_item + .step_item::before {display: none;}
/* .step.type2 .step_item .desc {padding-left: 2.5rem;} */

/*-------------------------------------------
  -- advice
-------------------------------------------*/
.advice {display: flex; flex-direction: column; gap: 2rem;}
.advice_item {display: flex; gap: 1.6rem; font-size: 1.4rem; color: var(--n-gray-700); line-height: 1.75; word-break: keep-all;}
.advice_item .img_wrap {position: relative; flex-basis: 5.6rem; min-width: 5.6rem; height: 5.6rem; border-radius: 100%; background-color: var(--n-gray-100);}
.advice_item .img_wrap img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: auto; height: 3.2rem;}
.advice_item .title {font-size: 1.6rem; font-weight: 500; color: var(--n-gray-900); line-height: 175%;}

.advice.type2 .advice_item {flex-direction: column; gap: 1.2rem;}
.advice.type2 .advice_item .img_wrap {width: 5.6rem;}

/*-------------------------------------------
  -- space
-------------------------------------------*/
.pt16 {padding-top: 1.6rem;}
.pt24 {padding-top: 2.4rem;}
.pb16 {padding-bottom: 1.6rem;}
.pb24 {padding-bottom: 2.4rem;}
.pb_fixbtn {padding-bottom: 8rem;}

/*-------------------------------------------
  -- modal
-------------------------------------------*/
.modal-content {border-radius: 1.2rem;}
.modal-header {padding: 2rem 2rem 1.6rem 2rem;}
.modal-header {border-color: transparent; border-top-left-radius: 1.2rem; border-top-right-radius: 1.2rem;}
.modal-title {font-size: 2rem; font-weight: 700; color: var(--n-gray-900);}
.modal-header .btn-close {width: 1.2rem; height: 1.2rem; background: url(../svg/close.svg) center/100% no-repeat transparent;}
.modal-header + .modal-body {padding: 0 2rem;}
.modal-body {padding: 2rem 2rem 0 2rem;}
.modal-body .inner {max-height: 70vh; word-break: keep-all; overflow-y: auto;}
.modal-body, .modal-footer {border: none;}
.modal-footer {padding: 1.6rem 2rem 2rem 2rem; border-bottom-left-radius: 1.2rem; border-bottom-right-radius: 1.2rem;}
.modal-footer button {flex: 1 1 auto; width: 100%; height: auto; min-height: 4.4rem; border-radius: .6rem; font-size: 1.5rem; letter-spacing: -.25px;}

.modal_text {list-style: "\00B7 "; padding-left: 2rem;}
.modal_text li {font-size: 1.4rem; color: var(--n-gray-800);}
.modal_text li + li {padding-top: 1rem;}
.modal_text_depth {padding: 1rem 0 0 1rem;}
.modal_text_depth li + li {padding-top: .8rem;}

.table_terms {min-width: 600px; vertical-align: middle; font-size: 1.1rem;}
.modal .table-responsive {padding-bottom: 1.25rem;}

/*-------------------------------------------
  -- swiper
-------------------------------------------*/
.swiper {position: relative;} /* overflow: visible; */
.swiper .swiper-wrapper, .swiper-slide {width: auto;}

.filter input[type="text"], .filter input[type="date"], .filter select.form-select {height: auto; padding: .5rem .8rem; font-size: 1.4rem;}	
.filter input[type="date"]::before {content: attr(data-placeholder); width: 100%; color: var(--n-gray-400);}	
.filter input[type="date"]:focus::before, .filter input[type="date"]:valid::before {display: none;}
.viewlist_wrap {width: 100%; white-space: nowrap; font-size: 1.4rem;}	
.viewlist_wrap thead td {padding: .8rem .5rem; color: var(--n-gray-900);}
.viewlist_wrap tbody td {padding: .8rem .5rem; color: var(--n-gray-800);}



/***********************************************************************************************************************
  H. etc
***********************************************************************************************************************/

/* bg space */
.bg_space10 {width: 100%; height: 1rem; background-color: var(--n-gray-100); font-size: 0;}

/*responsive */
.for_tablet, .for_pc {display: none;}

/* error */
.error_wrap {max-width: 550px; padding: 5rem 0; text-align: center; word-break: keep-all;}
.error_wrap img {width: 100%; max-width: 20rem;}
.error_wrap h1 {margin-bottom: 2.2rem; font-size: 2.2rem;}
.error_wrap p {font-size: 1.6rem; color: var(--n-gray-800);}

/* scroll */
.scroll_y {overflow-y: scroll;}
.scroll_y::-webkit-scrollbar {width: 5px;}
.scroll_y::-webkit-scrollbar-thumb {height: 40%; border-radius: 10px; background: rgba(0,0,0,.5);}

/* loading */
.loading img {width: 8rem; height: 8rem;}

.edit_reset {font-size: 1.4rem; color: var(--n-gray-600);}



/***********************************************************************************************************************
  I. Media Query
***********************************************************************************************************************/
@media screen and (min-width: 576px) {
  /*-------------------------------------------
    -- mobile (576px~)
  -------------------------------------------*/
}
@media screen and (min-width: 768px) {
  /*-------------------------------------------
    -- tablet (768px~)
  -------------------------------------------*/

    /***
      D. Main
    ***/
    .carousel_mobile {display: none;}
	.carousel_tablet {display: block;}
    
    /** 
      E. Sub
    ***/
    /* -- mypage */
    .my_info.joinInfo .content_box .amount_info {flex-wrap: nowrap;}
    .my_info.joinInfo .content_box .amount_info .box_title {margin-bottom: 0;}
	.my_info.joinInfo .content_box .amount_info .price_list.type2 li {flex-wrap: nowrap;}
	.my_info.joinInfo .content_box .amount_info .amount {flex-wrap: nowrap; width: auto; padding-left: 1rem;}
	
	/* -- thumb card */
    .thumb_list_item {width: 50%;}
    
    /* -- store list */
	  .store_list_item {flex-direction: row; align-items: center; padding: 2rem 1.6rem;}
	  .store_desc {padding-top: 0; padding-left: 2rem;}
}

@media screen and (min-width: 992px) {
    .container, .container-lg, .container-md, .container-sm {
    	max-width: unset;
    }
}

@media screen and (min-width: 1080px) {
    /*-------------------------------------------
      -- desktop (1080px~)
    -------------------------------------------*/

    /***
      A. Default
    ***/
    input[type="text"], input[type="password"], input[type="number"], input[type="date"],
    input[type="email"], textarea, select.form-select {width: 100%; height: 5.2rem; padding: 0 1.6rem; font-size: 1.5rem;}
    textarea {padding: 1.6rem;}
    
    .filter input[type="text"], .filter input[type="date"], .filter select.form-select {height: auto; padding: .5rem .8rem; font-size: 1.4rem;}

    .container, .container-lg, .container-md, .container-sm {
        max-width: 1200px;
    }

    /* -- header */
    .header .container {max-width: 1280px;}
    
    .header_content {padding: 1.6rem 0;}
    .header_top {}
    
    .header .logo img {max-height: 5.6rem;}
    
    .header .mobile_wrap {display: none;}
    .header .pc_wrap {display: block;}

    /* -- sub header */
    .sub_header {top: 11.3rem; width: 100%; padding: 1.6rem 0; margin: 0; margin-bottom: 4rem; background-color: #F8F9FC;}
    .body_wrap_agent.self_wrap .sub_header {top: 0;}
    .sub_header .title {font-size: 1.7rem;}
    .sub_header_step {font-size: 1.4rem;}
    .sub_header_step li img {width: 1.8rem; height: 1.8rem;}
    .sub_header_step li img.on {width:2rem; height: 2rem;}

    /* -- body */
    .body_wrap {padding-top: calc(11.3rem + 4rem);}
    .body_wrap_agent {padding-top: 4rem;}

    /* -- nav */
    .submenu {display: block;}
    .gnb_wrap {display: block;}

    /* -- footer */
    footer {margin-top: 8rem; font-size: 1.3rem;}
    footer .container {max-width: 1280px;}
    
    .footer_top {padding-top: 3.6rem;}
    .footer_top .policy_list {font-size: 1.4rem;}
    .footer_top .policy_list li {padding-right: 1.6rem; margin-right: 1.6rem;}
    
    .footer_bottom {margin-top: 2.8rem; padding-bottom: 3.6rem;}
    .footer_bottom .company_info ul + ul {margin-top: .8rem;}
    .footer_bottom .company_info ul li {display: inline-block;}
    .footer_bottom .company_info ul li + li {padding-left: 1.2rem; margin-left: 1.2rem; margin-top: 0;}
    .footer_bottom .company_info ul li + li::before {content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: .1rem; height: 1rem; background-color: var(--n-gray-300);}
    
    .emblem_list {position: absolute; bottom: 4rem; right: 2rem;}
    
    .copyright {margin-top: 2.8rem;}
    
    .footer_bottom .call_info li:first-child {font-size: 1.5rem;}

    /* -- preview bottom */
    /* .preview_wrap {margin-top: 2rem;} */
    .preview_wrap {background-color: #F8F9FC;}
    .preview_header { padding: 2.4rem 0;}
    .preview_header .head {font-size: 1.7rem;}
    .preview_body {padding: 2.4rem 0 6rem 0; }
    .preview_body .inner {display: flex; gap: 4rem;}
    .preview_body .price_info {flex: 1 1 auto; height: fit-content; padding: 2.4rem;}
    .preview_body .price_info .title {font-size: 1.5rem;}
    .preview_body .price_info .price {font-size: 2rem;}
    .preview_body .order_info {flex: 1 1 auto; margin-top: 0;}

    .product_bottom_preview {padding-top: 4rem; margin-bottom: -8rem;}
    .product_bottom_preview .preview_header .content {flex-direction: row;}
    .product_bottom_preview .preview_header .preview_btn {min-width: 280px;}
    .product_bottom_preview .preview_header .head {font-size: 1.6rem; margin-bottom: 0;}
    .product_bottom_preview .preview_header .head span {font-size: 2rem;}
    .product_bottom_preview .preview_body {padding: 0 0 6rem 0;}
    .product_bottom_preview .preview_body .order_list {margin-left: 0; padding: 0 2rem;}
    .product_bottom_preview .preview_body .order_list + .order_list {margin-top: 0; margin-left: 0; padding-top: 0; border-top: none; border-left: 1px solid #e6e6e6;}

    /* -- flex */
    .flex_row {margin: 0 -1.2rem;}
    .flex_row > * {padding: 0 1.2rem;}

    
    /***
      D. Main
    ***/
    .main_content {padding-top: 11.2rem;}
    .main_content .container {max-width: 1280px;}
    .sec_title {margin-bottom: 2.4rem;}
    
    /* -- main layout wrap */
    .main_layout_wrap:first-child {margin-top: 3.2rem;}
    .main_layout_wrap .inner {flex-direction: row; gap: 4rem; max-width: 1280px; margin: 0 auto;}
    
    .main_layout_left {width: calc(100% - 41.2rem);}
    .main_layout_right {flex-shrink: 0; width: 37.2rem;}

    /* -- main banner */
    .main_banner {max-height: 37.2rem;}
    .main_banner img {width: auto; height: 100%;}
    .main_banner .swiper-container {height: 100%;}
    .main_banner .swiper_controller {left: 4rem; bottom: 2.4rem; transform: unset;}
    
    .carousel_mobile, .carousel_tablet {display: none;}
    .carousel_pc {display: block;}
    
    .sub_banner ul {flex-direction: column; gap: 2.4rem;}
    .sub_banner ul li a {padding: 2.4rem 3.2rem; padding-bottom: calc(3.2rem + 6.4rem);}
    .sub_banner ul li a .title {font-size: 2rem;}
    .sub_banner ul li a .desc {display: block;}
    .sub_banner ul li a img {right: 2.4rem; bottom: 3.2rem; width: 9.6rem;}

    /* -- main product list */
    .main_product_list {margin-top: 4.8rem;}
    
    /* rate */
    .rate_area {padding-bottom: 0;}
    .rate_area .card_title {padding: 2rem 0; font-size: 2rem;}
    .rate_area .card_title img {width: 3.2rem;}

    .rate_card_list {padding: 0 2.4rem;}
    .rate_card {padding: 2.4rem 0;}
    .rate_card_title {font-size: 1.4rem;}
    .rate_card_info {font-size: 1.8rem;}
    .rate_card_price {font-size: 1.8rem;}
    .rate_card_price .rate_origin {font-size: 1.6rem;}

    .phone_card_list {margin-bottom: 0;}
    .phone_card_box {height: auto; margin-top: -40%;}
    .phone_card_img {width: 200px; height: 200px; float: none; margin: 0 auto;}
    .phone_card_box .inner {padding-top: 80px; text-align: center;}
    .phone_card_title {font-size: 2rem;}
    .phone_card_txt {margin-bottom: 2.4rem; font-size: 1.6rem;}
    .phone_card_price {font-size: 2.8rem;}
    .phone_card_price span {margin-right: .8rem; font-size: 2rem;}
    .phone_card_ref {font-size: 1.3rem;}
    
    /* -- main event area */
    .main_event_area {margin-top: 6.4rem;}
    .main_event_area .thumb_card_desc {padding: 0 .4rem; }

    /* -- main cs area */
    .main_cs_box {padding: 3.2rem 2.4rem;}
    .main_cs_box .title {font-size: 2rem;}
    
    .service_group li {padding: 2.4rem 0;}
    .service_group .service_link {gap: 1.6rem; padding-right: 3.6rem; font-size: 1.8rem;}
    .service_group .service_link img {width: 4rem;}
    .service_group .service_link::after {width: 2rem; height: 2rem;}
    
    .main_call_area .main_cs_box .title {margin-bottom: 1.6rem;}
    .call_cs_content li .list_dot li {font-size: 1.4rem;}
    
    .notice_box {padding: 1.6rem 2.4rem;}
    .notice_box .icon {width: 3.2rem; height: 3.2rem;}
    .notice_box .notice_title {font-size: 1.6rem;}
    
    /* -- main swiper area */
    .main_swiper_area .swiper-slide {position: relative;}
    
    .main_product_list .swiper-slide {width: calc(50% - 1.6rem);}
	
	.main_event_area .main_swiper_area {width: 100%; margin: 0;}
	.main_event_area .swiper-container {padding: 0;}

    /***
      E. Sub
    ***/
    /* -- common */
    .page_title {padding: 1rem 0; margin-bottom: 4rem;}

    .alert_wrap > * {font-size: 1.6rem;}
    .alert_img {padding: 1.6rem 0 1rem 0;}
	  .alert_img span {width: 3.6rem; height: 3.6rem;}

    /* document */
    .doc_wrap {}
    .doc_head {margin-bottom: 48px; padding-top: 64px;}
    .doc_head h2 {font-size: 20pt; margin-bottom: 0;}
    .doc_head_logo {height: 45px;}
    .doc_content {font-size: 11pt;}
    .doc_content + .doc_content {margin-top: 40px;}
    .doc_content .title {padding-bottom: 10px; font-size: 13pt;}
    .doc_content .table_board.type2 {font-size: 11pt;}
    .doc_content .table_board.type2 th, .doc_content .table_board.type2 td {padding: 10px;}
    .doc_content .flex_row {margin: 0 -20px;}
    .doc_content .flex_row > * {padding: 0 20px;}
    .doc_content .price_list {font-size: 11pt;}
    .doc_content .price_list li + li {padding-top: 10px;}
    .doc_content .price_list li.depth {font-size: 10.5pt;}
    .doc_content .doc_price_area.total .price_list {font-size: 13pt;}
    .doc_notice {font-size: 9.75pt; padding-top: 8px;}
    .doc_notice .box {padding: 14px ;}
    .doc_notice .box .title {font-size: 9.75pt;}
    .doc_seal {padding-top: 24px;}
    .doc_seal p {font-size: 11pt;}
    .doc_seal .seal {margin-top: 24px; font-size: 16pt;}
    /* .doc_seal .seal img {width: 35px;} */

    /* -- accordion style */
    .acc_wrap .acc_item {padding: 2.4rem 0;}
    .acc_wrap .acc_header {font-size: 1.6rem;}
    .acc_wrap .acc_header .acc_header_link {padding-right: 4rem;}
    .acc_wrap .acc_content_inner {padding: 2rem; font-size: 1.5rem;}

    /* -- board list */
    .board_list {margin-top: 2.4rem;}
    .board_list > li {padding: 2.4rem 1rem;}
    .board_list > li .title, .board_list li .title a {flex: 1; margin-bottom: 0; font-size: 1.6rem;}
    .board_list > li .title.ico {padding-right: 2rem;}
    .board_list > li .detail_list li {font-size: 1.5rem;}
    .board_list > li .detail_list li + li {padding-left: 1.2rem; margin-left: 1.2rem;}

    /* type2 - 적립내역 형식 */
    .board_list.type2 li .date {font-size: 1.4rem;}
    .board_list.type2 li .title, .board_list.type2 li .text {font-size: 1.6rem; margin-bottom: 0;}
    .board_list.type2 li .amount {flex-shrink: 0; font-size: 1.6rem;}

    /* -- card list */
    .card_list_item {margin-bottom: 1.5rem; font-size: 1.6rem;}
    
    .card_link {padding: 2rem 2.4rem;}
    
    /* -- price list */
    .price_list {font-size: 1.6rem;}
    .price_list li.depth {font-size: 1.4rem;}
    .price_list li + li {padding-top: 2rem;}
    
    /* -- thumb card */
    .thumb_list .thumb_card_link {margin-bottom: 1.2rem;}
    .thumb_list_item {width: 33.33333333%;}
    .thumb_card_img {margin-bottom: 1rem;}
    .thumb_card_desc .title {font-size: 1.6rem;}
	
    /* -- tab */
	.tab_box {margin-bottom: 2.4rem;}
	.tab_box_link {height: 5.6rem; font-size: 1.6rem;}
	.tab_box_list li {width: 16.66667%;}
	.tab_box_list li:nth-child(3n) .tab_box_link {border-right-color: var(--n-gray-300);}
	.tab_box_list li:nth-child(6n) .tab_box_link {border-right-color: transparent;}
	
	.tab_box_list_t2 .tab_box_link {padding: 0 1.6rem;}
	
	.tab_box_list_t3 .tab_box_link {padding: 0 1.6rem;}
	
	.tab_icon .tab_box_link {padding: 4.4rem 0 1.6rem 0;}
	.tab_icon .tab_box_link::before {top: 1.6rem; width: 2rem; height: 2rem;}
	
	.tab_line_wrap {margin-bottom: 2.4rem;}
	.tab_line_link {font-size: 1.6rem;}
	
	.tab_line_list_t2 li + li {padding-left: 2rem; margin-left: 2rem;}
	
	.tab_line_list_t3 .tab_line_link {padding: 0;}
	
	.sub_tab {margin-bottom: 2.4rem;}
	.sub_tab_link {font-size: 1.4rem;}
	
	.tab_login {margin-bottom: 3.2rem;}
    .tab_login_link {font-size: 1.6rem;}

    /* -- search */
	.search_wrap {padding: 2rem 0;}
	
	.search_box {}
	.search_box input {padding: 0; padding-left: 2rem;}
	.search_box .search_btn {width: 5.2rem; height: 5.2rem;}
	.search_box .search_btn:before {background-size: 2.4rem;}
	
	/* -- order layout */
	.order_container {display: flex; gap: 2rem; max-width: 1200px; padding: 0 2rem;}
	.order_content {flex: 1; padding: 0;}
	
	.order_group {padding: 4rem; border: 1px solid var(--n-gray-300); border-radius: 1.2rem;}
	.order_group + .order_group {margin-top: 4rem;}
	
	.order_payment {position: sticky; position: -webkit-sticky; top: calc(11.3rem + 2rem); flex: 0 0 auto; width: 100%; max-width: 300px; height: fit-content; padding: 3.2rem; margin: 0;}
	.order_content + .order_payment {margin-top: 0;}

    /* -- product layout */

    /* -- rate layout */
    .rate_link {font-size: 1.6rem;}
	.rate_link .title {font-size: 1.5rem !important;}
	.rate_link .desc li + li {padding-left: 1.2rem; margin-left: 1.2rem;}
	.rate_link .detail .ref {font-size: 1.4rem;}
	.rate_link .price {font-size: 2.4rem;}
	.rate_link .price .ref {font-size: 1.5rem;}
	.rate_link .price .origin {font-size: 1.6rem;}
    
    /* .rate_info_wrap {margin-top: -4rem; margin-bottom: 4rem;}
    .rate_info_wrap .inner {max-width: 1200px; padding: 4rem 2rem; margin: 0 auto;}
    .rate_info {} */
    /* ## rate detail - new ## */
	.rate_info_wrap {margin-bottom: 3.6rem;}
	.rate_info_wrap > .inner {flex-direction: row; gap: 4rem;}
	.rate_info {flex: 1; padding: 3.2rem; border-radius: 1.6rem;}
	.rate_info > .inner {display: flex; flex-direction: column; height: 100%;}
    
    .rate_info .badge_wrap .badge {font-size: 1.2rem;}
    .rate_info .header {font-size: 1.8rem;}
    .rate_info .content .detail .ref {margin-top: 1.2rem; margin-bottom: 0; font-size: 1.4rem;}
    .rate_info .content .desc {margin-bottom: 0; font-size: 1.6rem;}
    .rate_info .content .desc li.data {font-size: 2.4rem;}
    .rate_info .content .desc .icon {width: 1.6rem; height: 1.6rem; margin-right: .8rem;}
    .rate_info .price {flex-direction: column; align-items: end;}
    .rate_info .price_area p {flex-direction: row-reverse; font-size: 2.8rem; text-align: end; white-space: nowrap;}
    .rate_info .price_area .origin {font-size: 1.6rem;}
    .rate_info .btn_area {width: 100%;}
    
    .rate_caption {margin-top: 2.4rem;}
    .rate_caption_list {display: flex; font-size: 1.4rem;}
    .rate_caption_list li {margin-bottom: 0;}
    .rate_caption_list li:not(:last-child) {margin-bottom: 0; padding-right: 4rem;}
    
    .rate_detail {}
    .rate_detail_depth {margin-bottom: 3.2rem;}
    .rate_detail_depth .title {font-size: 2rem;}
    .rate_detail_depth .desc, .rate_detail_depth .desc pre {font-size: 1.6rem;}
    .rate_detail_depth .desc_list {padding-left: 3rem; font-size: 1.4rem;}
    .rate_detail_depth .desc_list li {margin-bottom: 1rem;}
    .rate_detail_depth .desc_list li::before {top: 1rem;}
    .rate_detail_depth .desc_list_depth {padding: 1rem 0 0 2rem; font-size: 1.3rem;}
    .rate_detail_depth .desc_list_depth li::before {top: 1rem;}
    .rate_detail_depth .table {font-size: 1.4rem;}
    
    .service_desc {flex-direction: row; justify-content: space-between;}
	.service_desc .price {display: flex; flex-direction: column; align-items: end; font-size: 2.4rem;}
	
	.rate_select_area {max-width: 360px; min-width: 360px;}
	.rate_select_box {padding: 2rem 2.4rem; border-radius: 1.6rem;}
	.rate_select_box.ref_stop {font-size: 1.8rem;}
	.rate_select_box .form_group {margin-bottom: 2rem;}
	.rate_select_box .n_form_label, .rate_select_box .select_btn,
	.rate_select_box .select_btn_t2 {font-size: 1.5rem;}
	.rate_select_box .guide_btn button {height: 3rem;}
	/* ## rate detail - new ## */
	
	
	/* -- event */
    .event_board {font-size: 1.6rem;}
    .event_board .board_head .title {font-size: 2.4rem;}
    /* .thumb_card_img.event {max-height : 180px;} */
    
    /* -- review */
    .tab_line_wrap + .review_list {margin-top: -2.4rem;}
    .review_list_item {padding: 2.4rem 0;}
	.review_list_header .title {font-size: 1.7rem;}
	.review_list_header .review_info {margin-bottom: 1.6rem; font-size: 1.4rem;}
	/* .review_list_header .grade {gap: 0 .6rem;}
	.review_list_header .grade_icon {width: 1.5rem; height: 1.5rem;} */
	.review_list_content {display: flex;}
	.review_list_content .desc {font-size: 1.6rem;}
	.review_list_content .desc > pre {font-size: 1.6rem;}
	.review_list_content .img_wrap {width: 12rem; min-width: 12rem; height: 12rem;}
	
	.grade_btn_wrap {gap: 0 .6rem;}
	.grade_btn_wrap .grade_btn {width: 3.2rem; height: 3.2rem;}
    
    /* -- qna */
    .qna_wrap {padding-top: 4rem;}
    
    .qna_tab_link {font-size: 1.4rem;}
    
	.qna_acc_wrap .acc_item {padding: 2.4rem 0;}
	.qna_acc_wrap .acc_header {font-size: 1.6rem;}
	.qna_acc_wrap .acc_content_inner {padding: 2rem; font-size: 1.5rem;}
	.qna_acc_wrap .acc_content_inner pre {font-size: 1.5rem;}
	
    /* -- notice */
    .notice_wrap {padding-top: 4.8rem;}
    .notice_list_item {flex-direction: row; align-items: center; padding: 2.4rem 1rem; font-size: 1.6rem;}
    .notice_list_item .title {margin-bottom: 0; padding-right: 2rem; flex: 1;}
    .notice_list_item .date {font-size: 1.4rem;}
    
    .notice_list_item.order_item {padding: 2.4rem 1rem;}
    .notice_list_item.order_item .order_info .info_link {font-size: 1.8rem;}
    .notice_list_item.order_item .order_info .info_link .ref {font-size: 1.4rem;}
    
    .notice_list_item.order_item .inner_flex {flex-direction: row; align-items: center;}
    .notice_list_item.order_item .title {font-size: 1.5rem;}
    .notice_list_item.order_item .text {font-size: 1.5rem;}
	.notice_list_item.order_item .btn_group {flex-direction: column; justify-content: normal; height: fit-content; margin-top: 0;}
	.notice_list_item.order_item .btn_group > * {width: auto; min-width: 8rem; height: 3.6rem; line-height: 3.6rem; }

    /* -- store list */
    .store_list_item {padding: 2rem 2.4rem; font-size: 1.6rem;}
    .store_list_item .title {margin-bottom: 0; padding-right: 2rem; flex: 1;}
    .store_list_item .date {font-size: 1.4rem;}
    
    .store_map {height: 20rem; margin-bottom: 0;}
    
    .store_list {margin-top: 0;}
    .store_desc .ref {margin-top: .8rem;}
    .store_link .ref {margin-top: .8rem;}
    
    /* old */
    .store_card_link {padding: 2.4rem; min-height: 148px; font-size: 1.6rem; margin-bottom: 1.6rem;}
    .store_card_link .ref {font-size: 1.4rem;}
	
	/* -- online cs */
    .agree_group {margin-top: 2.4rem;}
    .agree_box {font-size: 1.4rem;}
	
    /* -- pagination */
    .pagination {margin-top: 3.2rem;}
    
    /* -- apply change */
    .applychg_tab li {width: calc(16.66667% - .8rem);}
    
    /* -- contact */
	  .company_img_wrap {height: 25rem; margin-top: -49px;}
	  
	/* -- prepaid */
	.charge_wrap .guide_area {font-size: 1.6rem;}
	.charge_wrap .guide_area h2 {font-size: 2rem;}
	.charge_wrap .guide_con + .guide_con {margin-top: 4.8rem;}

    /* -- mypage */
    .my_info.joinInfo .header {padding: 2.4rem; margin-bottom: 4.8rem;}
    .my_info.joinInfo .header_top {font-size: 1.8rem;}
    .my_info.joinInfo .header_top .name {font-size: 2rem;}
    .my_info.joinInfo .header_bottom {padding: 2rem 0; font-size: 1.6rem;}
    .my_info.joinInfo .header_bottom ul {flex-direction: row; gap: 0;}
    .my_info.joinInfo .header_bottom ul li {width: 33.33333%; padding: 0 2rem; border-right: 1px solid var(--n-gray-200);}
    /* .my_info.joinInfo .content_box ul li.btn_wrap {margin-top: auto;} */
    .my_info.joinInfo .header_bottom ul li:last-child {border-right: 0;}
    
    .my_info.joinInfo .order_box {padding: 2.4rem;} 
    
    .my_info.joinInfo .content_box {padding: 0 1.2rem; margin-bottom: 4.8rem;}
    .my_info.joinInfo .content_box .title_wrap h2 {}
    .my_info.joinInfo .content_box .title_wrap.type3 {flex-direction: row;}
    .my_info.joinInfo .content_box .title_wrap .ref {font-size: 1.4rem;}
    .my_info.joinInfo .content_box .title_wrap .amount_refresh {width: auto; font-size: 1.4rem;}
    
    .my_info.joinInfo .content_box ul .title, .my_info.joinInfo .content_box ul .text {font-size: 1.6rem;} 
    .my_info.joinInfo .content_box ul .rateplan {font-size: 1.6rem;}
    
    .my_info.joinInfo .content_box ul .btn_group .btn {min-height: 4.8rem; font-size: 1.5rem;}
    
    .my_info.joinInfo .content_box .box_guide .text {padding: 0; margin: 0;}
  
    .my_info.joinInfo .charge_area {flex-direction: row;}
    .my_info.joinInfo .charge_area .total_info .amount {font-size: 2rem;}
    .my_info.joinInfo .charge_area .total_info .period {font-size: 1.4rem;}
    .my_info.joinInfo .charge_area .charge_info {padding: 0 1.6rem; margin-top: 1.6rem;}


    /***
      F. Self
    ***/
    .self_wrap {background-color: #F8F9FC;}
    .self_wrap .order_list_wrap, .self_wrap .sub_wrap > .form_wrap,
    .self_wrap form.form_wrap > .form_wrap {padding: 4rem; border: 1px solid #EAECF5; border-radius: 1.2rem; background-color: #fff;}
    .self_wrap .form_wrap + .form_wrap {margin-top: 4rem;}
    .self_wrap .form_wrap:last-child {margin-bottom: 4rem;}
    
    #inisisAuth .step {flex-direction: column;}
    #inisisAuth .step_item .img_wrap {grid-gap: 0 2rem; width: 6rem; height: 6rem;}
    #inisisAuth .step_item .img_wrap img {width: 3.6rem; height: 3.6rem;}
    
    .self_copy_wrap {padding-bottom: 2rem;}
    .self_copy {font-size: 1.15rem;}

    /* -- step1 */
    /* self call (가입 가능시간 안내) */
    .self_call {font-size: 1.6rem;}
    .self_call .content {padding-left: 1.4rem;}
    .self_call .ref {font-size: 1.3rem;}

    /* 유심/esim 안내 버튼(임시) */
    .self_wrap .guide_btn button {height: 3.6rem;}
    .step1-activeInfo button {font-size: 1.6rem;}

    /* -- price select */
    .price_filter {top: 8.1rem; padding-bottom: 1.6rem;}
    .price_filter button, .price_filter_popup button {font-size: 1.4rem;}

    .self_wrap .price_sticky_wrap {top: 11.3rem; margin-top: -4rem;}
    .body_wrap_agent.self_wrap .price_sticky_wrap {top: 0;}
    .self_wrap .price_sticky_wrap .sub_header {top: 0; background-color: #fff;}
    .self_wrap .price_sticky_wrap .price_filter {border-bottom: 0;}
    .self_wrap .box_cardlist {padding-top: 4rem;}

    .card_price_list + .card_price_list {margin-top: 1.6rem;}
    .card_price_list label {padding: 2.4rem;}

    .card_price_list .head {font-size: 1.5rem;}
    .card_price_list .text li + li {padding-left: 1.2rem; margin-left: 1.2rem;}
    .card_price_list .detail {font-size: 1.6rem;}
    .card_price_list .detail .ref {font-size: 1.4rem;}
    .card_price_list .price {font-size: 2.4rem;}
    .card_price_list .price .ref {font-size: 1.5rem;}

    /* -- order list */
    .order_list_wrap h1 {margin-bottom: 5.6rem;}
    .order_list_wrap h2 {font-size: 2rem;}
    .order_list {padding: 1.6rem 0;}
    .order_list > li {padding: 1.2rem 0;}
    .order_list .title {width: 25%; font-size: 1.6rem;}
    .order_list .text {font-size: 1.6rem;}
    .order_list .text_flex {flex-direction: row; align-items: center; gap: 1rem;}
    .order_list .text button {height: 3.5rem; line-height: 3.5rem;}
    
    .order_list_wrap .form_wrap + .form_wrap {margin-top: 4.8rem;}

    /* -- applyComplArea */
    .applyComplArea .img_wrap {margin-bottom: 1.6rem;}	
    .applyComplArea .img_wrap img {width: 8rem;}
    

    /***
      G. Components
    ***/
	  /* -- form */
    .form_wrap + .form_wrap {}
    .form_group {}
    .input_group input[type="email"] {padding-right: 8rem;}
    
    .input_flex {gap: .8rem;}
    .input_flex button {height: 5.2rem; padding: 0 2rem;}

    .form_notice {font-size: 1.4rem;}
    
    .form_number .form_number_btn {width: 5.2rem; height: 5.2rem;}
    .form_number .form_number_inp {max-width: 6.4rem; font-size: 1.7rem;}

    /* label */
    .n_form_label {font-size: 1.5rem; padding-bottom: 1rem;}
    .n_check_label {font-size: 1.5rem;}

    /* -- list */
    .list_dot li + li {margin-top: .8rem;}
    
    .select_list.flex_row {margin: 0;}
    .select_list li {width: calc(25% - .8rem);}
    .select_list li a {font-size: 1.2rem;}
    /* .select_list li a .img_wrap {width: 4.8rem; height: 4.8rem;} */
    .select_list li a span {margin-top: .8rem;}

    /* -- table */
    .table_board {font-size: 1.6rem;}
    .table_board tr {flex-direction: row; padding: 2rem 0;}
    .table_board th {width: 24rem;}
    .table_board td {flex: 1;}

    /* -- box */
    .box_title {font-size: 1.7rem;}
    .box_icon img, .board .box_icon img {width: 4.8rem;}
    
    .box_outline {padding: 2.4rem;}
    .box_outline_title {padding-top: 1rem; font-size: 1.7rem;}
    .box_outline_text {padding-top: 1rem; font-size: 1.4rem;}
    .box_outline_icon img {width: 4.8rem;}

    .box_form {padding: 2.4rem;}
    /* .box_form .inner {max-width: 410px;} */
    .box_form .img_wrap {margin-bottom: 2.4rem;}
    .box_form img {width: 380px;}
    .box_form .title {padding-bottom: 2.4rem; font-size: 1.7rem;}
 
    .box_cardlist .inner {padding-bottom: 15rem;}

    .box_list {padding: 2.4rem;}

	.box_guide {padding: 2.4rem;}
    .box_guide .title {font-size: 1.7rem;}
    .box_guide .text {padding-bottom: 1.6rem; font-size: 1.5rem;}
    .box_guide .text_group_title {font-size: 2rem; margin-bottom: 2rem;}
    .box_guide .text_group_ref {font-size: 1.5rem;}

    .box_green {padding: 2.4rem;}
    .box_green .title {font-size: 1.7rem;}
    .box_light {padding: 2.4rem;}
    .box_light .title {font-size: 1.7rem;}

    /* -- button */
    .btn_wrap {margin-top: 3.2rem;}
    .btn_group {padding: 2rem 0;}

    .n_btn_lg {height: 5.2rem;}
    a.n_btn_lg {line-height: 5.2rem;}
    .n_btn_m {height: 4.8rem;}
    a.n_btn_m {line-height: 4.8rem;}
    .n_btn_s {height: 4.4rem;}
    a.n_btn_s {line-height: 4.4rem;}
    .n_btn_xs {height: 4rem;}
    a.n_btn_xs {line-height: 4rem;}
    .n_btn_lg.w340 {max-width: 340px;}
    .n_btn_lg.w260 {max-width: 260px;}
    /* .btn_underline {font-size: 1.5rem;} */
    .btn_text_primary {right: 16px; font-size: 1.5rem;}

    /* select button */
    .select_btn, .select_btn_t2 {font-size: 1.5rem;}

    .body_wrap_popup .fixed-bottom .btn_group, .body_wrap_popup_t2 .fixed-bottom .btn_group {padding: 1rem 0;}
    .body_wrap_popup .fixed-bottom .n_btn_lg, .body_wrap_popup_t2 .fixed-bottom .n_btn_lg {height: 6rem;}
    .body_wrap_popup .fixed-bottom a.n_btn_lg, .body_wrap_popup_t2 .fixed-bottom a.n_btn_lg {line-height: 6rem;}
    
    /* -- board */
    .board {font-size: 1.6rem;}
    .board .board_head {padding: 2.4rem 0;}
    .board .board_head .title {font-size: 2.4rem;}
    .board .board_head .date {font-size: 1.5rem;}
    .board_head .date {font-size: 1.4rem;}
    .board .board_content {padding: 3.2rem 0;}
    .board .board_content > pre {font-size: 1.6rem;}
    .board_page {font-size: 1.4rem;}
    .board_page .page_item {padding: 2rem;}
    .board_page .page_link {padding-left: 2.4rem; font-size: 1.4rem;}
    
    .modal_board .board_content {margin-bottom: 4rem;}
    .modal_board .title {font-size: 1.8rem;}
    .modal_board .content {margin-top: 1.5rem; font-size: 1.6rem;}
    
    /* -- space  */
	  .pb_fixbtn {padding-bottom: 11rem;}

    /* -- modal */
    .modal-header {padding: 2rem 2.8rem 1.6rem 2.8rem;}
	.modal-header + .modal-body {padding: 0 2.8rem;}
	.modal-body {padding: 2.8rem 2.8rem 0 2.8rem;}
	/* .modal-body .inner {padding-bottom: 2.8rem;} */
	.modal-footer {padding: 1.6rem 2.8rem 2rem 2.8rem;}
    .modal-footer button {min-height: 5.2rem; font-size: 1.5rem; padding: 1rem;}
    .modal-title {font-size: 2.2rem;}
    .modal_text li {font-size: 1.6rem;}

    /* -- text */
    h1 {font-size: 3.2rem;}
    h2 {font-size: 2.4rem; margin-bottom: 1.6rem;}
    .breadcrumb {font-size: 1.6rem;}
    .text_lg_size {font-size: 1.8rem;}
    .text_default_size {font-size: 1.6rem;}
    .text_md_size {font-size: 1.4rem;}
    .text_sm_size {font-size: 1.3rem;}
    
    /* -- step */
	.step {flex-direction: row;}
	.step_item + .step_item::before {top: 50%; left: -2.5rem; transform: translateY(-50%); width: 1.4rem; height: 1.4rem; background: url(../svg/chevron-right.svg) center/100% no-repeat;}
	.step_item .img_wrap img {width: 4rem; height: 4rem;}
	.step_item .title {font-size: 1.7rem;}
	.step_item .desc {font-size: 1.6rem;}
	
	.step.type2 {flex-direction: column;}
	
	.step.arrow_none .step_item {width: auto;}
	
	/* -- advice */
	.advice {gap: 4rem;}
	.advice_item {gap: 2rem; font-size: 1.6rem;}
	.advice_item .img_wrap {flex-basis: 6rem; min-width: 6rem; height: 6rem;}
	.advice_item .img_wrap img {width: auto; height: 3.6rem;}
	.advice_item .title {font-size: 1.8rem;}
	
	.edit_reset {font-size: 1.5rem;}
}


@media screen and (min-width: 1200px) {
    /*-------------------------------------------
    -- large desktop (1200px~)
    -------------------------------------------*/
}



/***********************************************************************************************************************
  J. Print
***********************************************************************************************************************/
@media print {
	@page { margin: 0; size: A4; }
	
	/* -- print default */
	* {
		box-sizing: border-box;
		-moz-box-sizing: border-box;
	}
	html, body {
        width: 210mm;
        height: 297mm;
        background: #fff;
    }
	body {
		width: 100%;
	    height: 100%;
		background: #fff;
	    color: #000;
	    font-size: 8pt;
	    line-height: 150%;
	    margin: 0px;
	    margin: 0;
	    padding: 0
	}
	hr {
		color: #ccc;
	    background-color: #ccc;
	}
	h1, h2, h3, h4, h5, h6, code, pre {
	    color: #000;
	    text-transform: none; /* because sometimes I set all-caps */
	}
	h1 {
	    font-size: 11pt;
	    margin-top: 1em;
	}
	h2 {
	    font-size: 10pt;
	}
	h3 {
	    font-size: 9pt;
	}
	h4, h5, h6 {
	    font-size: 8pt;
	}
	code, pre {
	    font-size: 8pt;
	    background-color: transparent;
	    /* just in case the user configured browser to print backgrounds */
	}
	a {
	    text-decoration: underline;
	    color: #000;
	}

	/* -- print document */
	header, .fixed-bottom, .noPrintArea {display: none;}
	.onlyPrintArea {display: block;}
	.body_wrap_popup, .body_wrap_popup_t2 {padding: 0;}

	.container {max-width: unset; padding: 0;}

	.doc_wrap {
		width: 210mm;
		min-height: 297mm;
		padding: 15mm;
		/* margin: 10mm auto; */

	}
	.doc_head {padding-top: 0;}
	.doc_head_logo {height: 35px; top: 10mm; right: 15mm;}
	.doc_info {padding-top: 0;}
	.doc_content .price_list li.depth {color: var(--n-gray-800);}
	.doc_notice {color: var(--n-gray-500); line-height: 150%;}
	.doc_notice > * {font-weight: 300;}
	.doc_notice .box .title {padding-bottom: 2px; font-weight: 500; color: var(--n-gray-500);}
	.doc_notice .list li + li {margin-top: 0;}

	/* #confirmDoc {padding: 60px;}
	#confirmDoc .doc_head_logo {top: 60px; right: 60px;} */
	#confirmDoc .doc_info {padding-top: 40px;}
	#confirmDoc .doc_content:last-child {padding-bottom: 40px;}
	#confirmDoc .doc_content .table_board.type2 th, #confirmDoc .doc_content .table_board.type2 td {padding: 20px;}
	#confirmDoc .doc_notice {padding-top: 24px; font-size: 9.25pt;}
	#confirmDoc .doc_notice .box .title {font-size: 9.25pt;}
	#confirmDoc .doc_seal {padding-top: 80px;}
	#confirmDoc .doc_seal .seal {margin-top: 40px;}

	#contractDoc .doc_head {margin-bottom: 20px;}
	#contractDoc .doc_info {padding-top: 3px;}
	#contractDoc .doc_content + .doc_content {margin-top: 20px;}
	#contractDoc .doc_content:nth-child(3) {margin-top: 10px;}
	#contractDoc .doc_content .title {font-size: 11pt;}
	#contractDoc .doc_content .table_board.type2 {font-size: 9pt;}
	#contractDoc .doc_content .price_list,
	#contractDoc .doc_content .price_list li .title,
	#contractDoc .doc_content .price_list li .text,
	#contractDoc .doc_price_area.total {font-size: 9pt;}
	#contractDoc .doc_content .table_board.type2 th, #contractDoc .doc_content .table_board.type2 td {padding: 5px;}
	#contractDoc .doc_notice {font-size: 7.5pt;}
	#contractDoc .doc_notice .box .title {font-size: 7.5pt;}

}