﻿@import url(SpoqaHanSansNeo.css);
@import url('css2.css');

/*----------------------------------------------------------------------------------------------------------------------
[ HANPASS MOBILE ]

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

:root {
    --n-primary: #286BD3;
    --n-primary-hover: #1E509E;
    --n-primary-dark: #0F284F;
    --n-primary-light: rgba(88, 127, 187, 0.08);
    --n-lightGreen: rgba(36, 150, 181, 0.04);
    --n-lightPink: #FFF6FB;
    --n-lightPurple: #f3f4fb;
    --n-gray-100: #f8f8f8;
    --n-gray-200: #f2f2f2;
    --n-gray-300: #d4d4d4;
    --n-gray-400: #bfbfbf;
    --n-gray-500: #a6a6a6;
    --n-gray-600: #737371;
    --n-gray-700: #8c8c8c;
    --n-gray-800: #4f4f4f;
    --n-gray-900: #222;
    
    --n-filter-primary: invert(43%) sepia(71%) saturate(4983%) hue-rotate(206deg) brightness(88%) contrast(87%);
    
    --n-primary-shadow: rgba(88, 127, 187, 0.3);
}

/***********************************************************************************************************************
  A. Default
***********************************************************************************************************************/
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: .5rem;}
button:disabled, button:disabled:hover {background-color: var(--n-gray-400);}

input[type="text"], input[type="password"], input[type="number"],input[type="date"], 
input[type="email"], textarea, select.form-select {width: 100%; height: 5rem; padding: 0 1.2rem; font-size: 1.4rem; color: var(--n-gray-800); border: 1px solid var(--n-gray-300); border-radius: 1rem;}
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"] {position: relative; top: 0.15rem; width: 1.5rem; height: 1.5rem; border: 1px solid var(--n-gray-300); border-radius: .5rem;}
input[type="radio"] {position: relative; top: 0.2rem; width: 1.5rem; height: 1.5rem; border: 1px solid var(--n-gray-300); border-radius: .5rem;}
input:read-only, input:disabled, select:disabled,
.form-control:disabled, .form-select:disabled {background-color: #EAEAEA; pointer-events: none;}
input[type="radio"]:disabled + label, input[type="checkbox"]:disabled + label {color: #a6a6a6;}
input[type="checkbox"]:read-only, input[type="radio"]:read-only {background-color: #fff; pointer-events: inherit;}
input:checked:read-only {background-color: #0d6efd !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: #EAEAEA !important; box-shadow: inset 0 0 0 1000px #eaeaea; -webkit-box-shadow: 0 0 0 1000px #eaeaea 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: Pretendard Variable; white-space: pre-wrap;}



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

/*-------------------------------------------
  -- header
-------------------------------------------*/
.header {top: unset;}
.header_wrap {background-color: #fff; border-bottom: 1px solid #e0e0e0;}
.header_wrap > .container {position: relative;}
.header_top {display: none; padding-top: 1.6rem;}
.header .header_content, .header_popup .header_content {position: relative; height: 6rem;}

.header .logo, .header .icons_item, .header_popup .logo, .header_popup .icons_item {display: inline-block;}
.header .logo img {max-height: 2.8rem;}
/* .header .logo img {max-height: 25px;} */
.header_content #headerPcBtn {margin-left: 7.6rem;}
.header_content .icons {display: flex; gap: .8rem;}
.header_content .icons_item {padding: 0; margin: 0; background-color: transparent;}
.header_content .icons_item_btn {height: 3rem; padding: 0 1.5rem; margin-left: 1rem; font-size: 1.2rem; vertical-align: middle;}
.header_content .icons_item img {width: 2.4rem; height: auto;}

.header_popup .head {font-size: 2rem; font-weight: 500; color: var(--n-gray-900);}

.header_content .moblie_wrap {display: flex; height: 100%; align-items: center; justify-content: space-between;}
.header_content .pc_wrap {display: none; align-items: center; justify-content: space-between; gap: 4rem;}

/*-------------------------------------------
  -- sub header(셀프개통 단계)
-------------------------------------------*/
.sub_header {display: flex; justify-content: space-between; flex-direction: column-reverse; gap: 1.5rem; top: 6rem; padding-top: 1.6rem; padding-bottom: 1rem; margin-bottom: 3rem; background-color: #fff;}
.body_wrap_agent .sub_header {top: 0;}
.sub_header_step {display: flex; justify-content: center; width: 100%; padding: 1.6rem 0; border-radius: .5rem; border: 1px solid #c9daf3; background-color: rgba(88, 127, 187, 0.08);}
.sub_header_step li {display: flex; align-items: center; gap: .3rem; font-size: 1.4rem; font-weight: 500; color: var(--n-primary); }
.sub_header_step li + li {padding-left: 1rem;}
.sub_header_step li img {width: 2rem; height: 2rem; filter: invert(83%) sepia(9%) saturate(202%) hue-rotate(182deg) brightness(92%) contrast(82%);}
.sub_header_step li img.on {filter: invert(31%) sepia(66%) saturate(1448%) hue-rotate(195deg) brightness(98%) contrast(93%);}

/*-------------------------------------------
  -- 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 {background-color: #fff;}
.full_menu_header .icons {display: flex; justify-content: space-between; height: 100%;}
.full_menu_body {height: 100%; padding-top: 60px;}

/* fullmenu - top */
.full_menu_sign {padding: 1.6rem 0 2.4rem 0; border-bottom: 10px solid #F2F2F2;}
.full_menu_sign .pc_wrap {display: none;}
.full_menu_sign .title {font-size: 1.5rem; color: var(--n-gray-800); margin-bottom: 1rem;}
.menu_service_card {display: inline-block; width: 100%; padding: 2.4rem 2rem; background-color: var(--n-primary); border-radius: 5px;}
.menu_service_card a {font-size: 1.8rem; font-weight: 700; color: #fff;}
.menu_service_card a:hover {color: #fff;}
.menu_service_card img {width: 2rem; filter: invert(100%) sepia(0%) saturate(7484%) hue-rotate(184deg) brightness(101%) contrast(107%);}
.menu_service_card li + li {padding-top: 1rem;}
.menu_service_card p, .menu_service_card .service_link {font-size: 1.4rem; color: #fff;}
.menu_service_card .service_link::after {background: url(../image/chevron-right.svg) no-repeat center/100%; content: ""; display: inline-block; width: .8rem; height: .8rem; margin-left: .4rem; filter: invert(100%) sepia(9%) saturate(0%) hue-rotate(331deg) brightness(105%) contrast(101%);}

/* fullmenu - submenu(tab) */
.full_menu_sign .submenu_list {margin-top: 1.2rem;}
.full_menu_sign .sub_tab_list {border-bottom: 0;}
.full_menu_sign .sub_tab_list li {margin-right: 0;}
.full_menu_sign .sub_tab_link {display: inline-block; width: 100%; padding: .5rem; font-size: 1.2rem; background-color: transparent; color: var(--n-gray-500); text-align: center;}
.full_menu_sign .sub_tab_link:hover {background-color: transparent;}

/* fullmenu - body */
.full_menu_content {padding: 2.4rem 0;}
.full_menu_content .menu_list li {padding: 1.6rem 0 ;}
.full_menu_content .menu_list li + li {border-top: 1px solid #E0E0E0;}
.full_menu_content .menu_list li:last-child {border-bottom: 0;}
.full_menu_content .menu_list li a {font-size: 1.6rem; font-weight: 700; color: var(--n-gray-900);}
.full_menu_content .menu_list li .sub_list {padding: 1rem 2rem; margin-top: 1rem; border-radius: 1rem; background-color: #f9f9f9;}
.full_menu_content .menu_list li .sub_list li {padding: .8rem 0; border-bottom: none;}
.full_menu_content .menu_list li .sub_list li + li {border-top: 0;}
.full_menu_content .menu_list li .sub_list li a {font-size: 1.4rem; font-weight: 400; color: var(--n-gray-800);}
.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}

/*-------------------------------------------
  -- body
-------------------------------------------*/
.body_wrap, .body_wrap_popup, .body_wrap_popup_t2 {height: auto; padding-top: 90px;}
.body_wrap_popup_t2 {padding-bottom: 80px;}
.body_wrap_agent {padding-top: 30px;}

/*-------------------------------------------
  -- nav
-------------------------------------------*/
.gnb_wrap {display: none; height: 6.4rem;}
.gnb {align-items: center; gap: 0 3.2rem; height: 100%;}
.gnb > li {position: relative; display: flex; align-items: center; height: 100%; padding-bottom: 1.6rem; font-size: 1.6rem; font-weight: 500; text-align: right;}
.gnb li a {color: var(--n-gray-800);}
.gnb li a:hover {color: var(--n-primary);}
.gnb li.on a {border-bottom: 2px solid var(--n-primary); font-weight: 500; color: var(--n-primary);}

/* snb */
.snb {position: fixed; left: 0; transform: translateY(8.1rem); justify-content: center; gap: 4rem; width: 100%; padding: 2.8rem 3.2rem; background-color: #fff; border-top: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0; display: none;}
.snb li{margin-left: 0; text-align: center; line-height: 1.5;}
.gnb li.on .snb li a {font-weight: 400; color: var(--n-gray-900); }
.gnb li.on .snb li a:hover {color: var(--n-primary);}
.snb li a{font-size: 1.5rem; font-weight: 400; color: var(--n-gray-900); border-bottom: 0 !important;}
.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: flex;}

/* submenu (top util) */
/* 11rem */
.submenu {align-items: center; justify-content: right; padding-right: calc(11rem + 2rem); text-align: right;}
.submenu a {font-size: 1.3rem; font-weight: 400; color: var(--n-gray-600); text-decoration: none;}
.submenu a + a {margin-left: 2rem;}
.submenu a + select {margin-left: 2rem;}

/* util wrap (right) */
.util_wrap { display: none; align-items: center; gap: 1.6rem;}
.util_my {position: relative;}
.util_info_box {position: absolute; top: 35px; right: 0; width: 180px; padding: 2rem; border: 1px solid #e6e6e6; border-radius: 2rem; background-color: #fff; text-align: center; display: none;}
.util_info_box li + li {margin-top: 1rem;}
.util_info_box li a {font-size: 1.4rem; font-weight: 400; color: var(--n-gray-800);}
.btn_sign {display: inline-block; height: 3.5rem; line-height: 3.5rem; padding: 0 2rem; border-radius: 1rem; font-size: 1.6rem;}

/*-------------------------------------------
  -- footer
-------------------------------------------*/
footer {background-color: #f9f9f9; margin-top: 4rem;}
.footer_top {padding: 3.2rem 0 1rem;}
.footer_top .logo {height: 3rem;}
.footer_top .policy_list {font-size: 1.2rem; gap: .8rem;}
.footer_top .policy_list li a {color: #707070; font-weight: 500;}
.footer_top .policy_list li a.indv {color: var(--n-primary);}
.footer_bottom {padding-top: .5rem; padding-bottom: 3.2rem;}
.footer_bottom .company_info {display: flex; flex-wrap: wrap; font-size: 1.2rem; color: #999; gap: .4rem 0;}
.footer_bottom .company_info li {width: 100%;}
.footer_bottom .company_info li:first-child {width: 100%;}

/*-------------------------------------------
  -- preview bottom
-------------------------------------------*/
.preview_wrap {width: 100%; background: #343740; border-top: 1px solid #343740; box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;}
.preview_header { padding: 2.8rem 0;}
.preview_header .head {font-size: 1.4rem; font-weight: 700; color: #fff;}
.preview_header .n_btn_icon {width: 1.4rem; height: 1.4rem;}
.preview_header .n_btn_icon.open {background: url(../image/chevron-up-solid.svg) no-repeat center center; background-size: contain; filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(340deg) brightness(103%) contrast(104%);}
.preview_header .n_btn_icon.close {background: url(../image/chevron-down-solid.svg) no-repeat center center; background-size: contain; filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(340deg) brightness(103%) contrast(104%);}
.preview_body {padding: 1.6rem 0 4rem 0;}
.preview_body .box_green  {padding: 2.4rem; background-color: #F6FBFC;}
.preview_body .box_light  {padding: 2.4rem; background-color: var(--n-lightPink);}
.preview_body .price_info {display: flex; flex-direction: column; justify-content: center; padding: 2rem; border-radius: 1rem; background-color: #fff;}
.preview_body .price_info .badge_wrap {margin-bottom: 0;}
.preview_body .price_info .title {font-size: 1.6rem; font-weight: 700;}
.preview_body .price_info .title + .title {margin-top: .5rem; font-size: 2rem;}
.preview_body .price_info .ref {padding-left: .5rem; font-size: 1.3rem; font-weight: 400; color: var(--n-gray-600);}
.preview_body .order_list {height: 100%; padding: 1.6rem; margin: 16px -7.5px 0 -7.5px; border-radius: 1rem; background-color: #fff;}
.preview_body .order_list .title {font-weight: 400; color: var(--n-gray-800);}
.preview_body .order_list .text {font-weight: 500; color: var(--n-gray-900);}
.preview_body .order_list li {padding: .8rem 0; margin-bottom: 0;}
.preview_body .order_list li + li {margin-top: 0;}

/* 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(../image/chevron-up-solid.svg) no-repeat center center; background-size: contain; filter: invert(29%) sepia(21%) saturate(0%) hue-rotate(213deg) brightness(102%) contrast(99%);}
.product_bottom_preview .preview_header .n_btn_icon.close {background: url(../image/chevron-down-solid.svg) no-repeat center center; background-size: contain; filter: invert(29%) sepia(21%) saturate(0%) hue-rotate(213deg) brightness(102%) contrast(99%);}
.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_content {padding: 2rem; padding-bottom: 0; overflow-y: auto;}
.board .board_content img {width: 100%; height: auto;}

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

.modal_board {}
.modal_board .board_content {padding-bottom: 3rem;}
.modal_board .title {font-size: 1.6rem; font-weight: 500; color: var(--n-gray-900);}
.modal_board .content {margin-top: 1rem; font-size: 1.4rem; color: var(--n-gray-800); line-height: 1.65; word-break: keep-all;}

/*-------------------------------------------
  -- popup (main layer popup)
-------------------------------------------*/
.ui-dialog { z-index: 1040 !important ; filter: drop-shadow(0 3px 8px rgba(0,0,0,.15));}
.ui-dialog-titlebar {background-color: #fff; padding: 1rem 2rem;}
.ui-dialog-titlebar span {color: var(--n-gray-900); font-size: 1.6rem;}
.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;}
.main_pop_layer .pop_content img {width: 100%; height: auto;}
.main_pop_layer .pop_footer {display: flex; align-items: center; padding: 1rem 2rem; background-color: var(--n-gray-900);}
.main_pop_layer .pop_footer label {color: #fff;}
.main_pop_layer .pop_footer .n_btn_icon {background: url(../image/x-lg.svg) no-repeat center center; width: 16px; height: 16px; background-size: contain; filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(340deg) brightness(103%) contrast(104%); font-size: 0;}

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

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



/***********************************************************************************************************************
  C. Login
***********************************************************************************************************************/
.login_wrap {max-width: 550px; padding: 4rem 0;}
.login_either_wrap {max-width: 960px;}
.login_wrap h1 {margin-bottom: 5.6rem;}
/* .login_wrap form {padding-bottom: 5rem;}
.login_wrap .form_wrap {padding-bottom: 0;} */



/***********************************************************************************************************************
  D. Main
***********************************************************************************************************************/
.main_content {padding-top: 8rem;}
.main_title_area {position: relative;}
.main_title_area .btn_link_ico {position: absolute; top: 0; right: 0; font-size: 1.3rem; color: var(--n-gray-700);}
.main_title_area .btn_link_ico::after {filter:  invert(31%) sepia(0%) saturate(1%) hue-rotate(139deg) brightness(96%) contrast(94%);}
.main_title_area .btn_link_ico:hover {color: var(--n-gray-700);}
.sec_title {margin-bottom: 1.6rem; font-size: 1.8rem; font-weight: 700; text-align: center; color: var(--n-gray-900);}

/*-------------------------------------------
  -- main banner(carousel)
-------------------------------------------*/
.carousel_tablet, .carousel_pc, .for_tablet, .for_pc {display: none;}

.main_banner .swiper-container {position: relative; padding-bottom: 2.5rem; overflow: hidden;}

.main_banner .swiper-slide {position: relative; width: 100%; height: auto; border-radius: 2rem; overflow: hidden; padding-top: 60%;}
.main_banner .swiper-slide img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover;}

.main_banner .swiper-button-next, .main_banner .swiper-button-prev {width: 4.8rem; height: 4.8rem; background-color: rgba(255, 255, 255, .8); border-radius: 100%; border: 1px solid #e6e6e6; backdrop-filter: blur(4px); color: var(--n-gray-800);}
.main_banner .swiper-button-next::after, .main_banner .swiper-button-prev::after {font-size: 2rem;}
.main_banner .swiper-button-prev {left: 0;}
.main_banner .swiper-button-next {right: 0;}

.main_banner .swiper-pagination-bullets {bottom: 0;}
.main_banner .swiper-pagination-bullet:only-child {display: inline-block !important;}
.swiper-pagination-bullet-active {background-color: var(--n-primary);}


/*-------------------------------------------
  -- main service area
-------------------------------------------*/
.main_service_area {padding: 2rem 0;}
.main_service_area .service_group {gap: 1.2rem 0;}
.service_link {display: flex; flex-direction: column; align-items: center; width: 100%; padding: 1.6rem 0; border-radius: 2rem; background-color: #f9f9f9;}
.service_link .img_wrap {position: relative; flex-basis: 6.4rem; flex-shrink: 0; min-width: 6.4rem; height: 6.4rem; border-radius: 10rem; background-color: #fff;}
.service_link .img_wrap img {position: absolute; width: 3.6rem; height: auto; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.service_link .text {margin-top: 1rem; font-size: 1.1rem; color: var(--n-gray-800); text-align: center;}
.service_link .text .title {font-size: 1.4rem; font-weight: 500; color: var(--n-gray-900);}
.service_link .text .desc {display: none;}

/*-------------------------------------------
  -- main product list
-------------------------------------------*/
.main_product_list {padding: 4rem 0;}
.main_product_list .rate_area {padding: 1rem; border: 1px solid var(--n-primary); border-top: 0; border-radius: 0 0 1rem 1rem;}

/**
  rate tab
*/
.rate_tab {}
.rate_tab_list {position: relative; display: flex; flex-wrap: nowrap; width: 100%; border-radius: .5rem .5rem 0 0; text-align: center; background-color: var(--n-gray-200); overflow: hidden;}
.rate_tab_list li {flex: 1 0 auto;}
.rate_tab_list .tab_link {display: inline-block; width: 100%; padding: 1.2rem 0; border-bottom: 1px solid var(--n-primary); border-radius: 0; font-size: 1.4rem; color: var(--n-gray-500);}
.rate_tab_list .tab_link.on {border: 1px solid var(--n-primary); border-bottom: 0; border-radius: .5rem .5rem 0 0; font-weight: 500; color: var(--n-primary); background-color: #fff;}

/* rate card */
.rate_card_list {display: flex; flex-wrap: wrap; align-items: stretch; gap: 1.6rem 0;}
.rate_card_item {width: 100%;}
.rate_card {display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; height: 100%; padding: 2rem; border-radius: 1rem; background-color:#f9f9f9;}
.rate_card_title {width: 100%; margin-bottom: 2.4rem; font-size: 1.8rem; font-weight: 700; color: var(--n-gray-800);}
.rate_card_title p {text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.rate_card_title .title_label {gap: .4rem; margin-bottom: .8rem; font-size: 1.6rem; -webkit-line-clamp: 1;}
.rate_card_title .title_label span {display: inline-block; padding: 2px 8px; border-radius: .5rem; font-size: 1.1rem; font-weight: 500; -webkit-line-clamp: 1;}
/* .rate_card_title .title_label span + span {margin-left: .4rem} */
.rate_card_info {width: 100%; margin-bottom: 2rem; }
.rate_card_info li {display: inline-block; font-size: 1.2rem; color: var(--n-gray-800);}
.rate_card_info li:first-child {width: 100%;}
.rate_card_info li:last-child {width: 100%; margin-right: 0;}
.rate_card_info li + li {margin-right: .8rem; margin-top: .5rem;}
.rate_info_ico::before {content: ""; display: inline-block; width: 1.4rem; height: 1.4rem; margin-right: .5rem; transform: translateY(2px); filter: invert(48%) sepia(5%) saturate(114%) hue-rotate(21deg) brightness(92%) contrast(89%);}
.rate_info_ico.ico_data::before {background: url(../image/reception-4.svg)no-repeat center/100%;}
.rate_info_ico.ico_voice::before {background: url(../image/telephone-fill.svg)no-repeat center/100%;}
.rate_info_ico.ico_mms::before {background: url(../image/chat-fill.svg)no-repeat center/100%;}
.rate_card_box {padding: 1rem; border-radius: 1rem; background-color: rgba(88, 127, 187, 0.08); }
.rate_card_box .content {height: 65px; font-size: 1.1rem; color: #587FBB; overflow-y: scroll;}
.rate_card_bottom {width: 100%; margin-top: auto;}
.rate_bottom_price {display: flex; justify-content: end; align-items: baseline; text-align: right;}
.rate_bottom_price .origin {font-size: 1.6rem; color: var(--n-gray-400); text-decoration: line-through;}
.rate_bottom_price .discount {margin-left: 1rem; font-size: 2.4rem; font-weight: 700; color: var(--n-primary);}
.rate_bottom_price .ref {font-size: 1.3rem; font-weight: 400; color: #BF2673;}
.rate_card_bottom .rate_btn {width: 100%; height: 5rem; font-size: 1.4rem; font-weight: 500; border-radius: 5px;}

/*-------------------------------------------
  -- main event area
-------------------------------------------*/
.main_event_area {padding: 4rem 0; overflow: hidden;}
/* .main_event_area .thumb_card_img.event {min-height: 180px; height: calc(100vw - 320px);} */
.event_banner {position: relative; display: inline-block; width: 100%; height: 0; padding-top: calc(780 / 1000 * 100%); border-radius: 1rem; overflow: hidden;}
.event_banner img {position: absolute; top: 50%; left: 50%; width: auto; height: 100%; transform: translate(-50%,-50%);}

/*-------------------------------------------
  -- main review area
-------------------------------------------*/
.main_review_area {padding: 4rem 0; background-color: #F8F4FF;}
.review_card {display: block; width: 100%; border-radius: .5rem; background-color: #fff;}
.review_card_img {position: relative; width: 100%; height: 0; padding-top: calc(670 / 1000 * 100%); border-top-left-radius: .5rem; border-top-right-radius: .5rem; background-color: #ddd; overflow: hidden;}
.review_card_img img {position: absolute; top: 50%; left: 50%; width: 100%; height: auto; transform: translate(-50%,-50%);}
.review_card_content {width: 100%; padding: 2rem;}
.review_content_text {width: 100%; margin-bottom: 2.4rem; text-align: left;}
.review_content_text .title {width: 100%; margin-bottom: .8rem; font-size: 1.4rem; font-weight: 500; color: var(--n-gray-900); text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.review_content_text .desc {display: -webkit-box; width: 100%; min-height: 6rem; font-size: 1.3rem; color: var(--n-gray-800); text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3;}
.review_content_info {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;}
.review_content_info .grade {display: flex; align-items: center; gap: 0 .4rem;}
.review_content_info .grade_icon {background: url(../image/star-fill.svg) no-repeat center/100%; content: ""; display: inline-block; width: 1rem; height: 1rem; filter: invert(99%) sepia(22%) saturate(313%) hue-rotate(332deg) brightness(112%) contrast(76%);}
.review_content_info .grade_icon.active {filter: invert(39%) sepia(97%) saturate(3726%) hue-rotate(310deg) brightness(101%) contrast(101%);}
.review_content_info .info {font-size: 1.1rem; color: var(--n-gray-800);}
.review_content_info .info .date {margin-left: .4rem; color: var(--n-gray-400);}

.review_more_pc {display: none; margin-bottom: 2rem; text-align: end;}
.review_more_pc .link_all {position: relative; padding-right: 2rem; font-size: 1.8rem; color: var(--n-gray-800);}
.review_more_pc .link_all::after {background: url(../image/chevron-right.svg) no-repeat center/100%; content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 0; display: inline-block; width: 1.5rem; height: 1.5rem; filter: invert(25%) sepia(98%) saturate(9%) hue-rotate(329deg) brightness(100%) contrast(95%);}
.review_more_mobile {margin-top: 2.4rem; text-align: center;}
.review_more_mobile .link_all {position: relative; padding-right: 1.5rem; font-size: 1.4rem; color: var(--n-gray-800);}
.review_more_mobile .link_all::after {background: url(../image/plus-lg.svg) no-repeat center/100%; content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 0; display: inline-block; width: 1.2rem; height: 1.2rem; filter: invert(25%) sepia(98%) saturate(9%) hue-rotate(329deg) brightness(100%) contrast(95%);}

/*-------------------------------------------
  -- main point area
-------------------------------------------*/
.main_point_area {padding: 4rem 0;}
.keyword_box {width: 100%; padding: 2rem 1.5rem; border-radius: .5rem; background: linear-gradient(92.59deg, rgba(167, 112, 239, 0.5) 0%, rgba(207, 139, 243, 0.5) 29.48%, rgba(253, 185, 155, 0.5) 100%);}
.keyword_content {display: flex; flex-wrap: wrap; justify-content: center; align-items: center; padding: 0px; gap: 1.6rem .8rem;}
.keyword {display: inline-block; padding: 1.2rem; font-size: 1.3rem; border-radius: 10rem;}
.keyword_normal {background-color: rgba(255,255,255,.8); color: var(--n-primary); box-shadow: 0px 2px 5px rgba(255, 255, 255, 0.25);}
.keyword_primary {background-color: var(--n-primary); color: #fff; box-shadow: 0px 2px 5px rgba(255, 51, 153, 0.25);}

/*-------------------------------------------
  -- main cs area
-------------------------------------------*/
.main_cs_area {margin-bottom: -4rem; padding: 4rem 0; padding-top: 0;}
.main_cs_group {display: flex; gap: 2.4rem; flex-direction: column;}

/* notice box */
.notice_box {width: 100%;}
.notice_box .title {display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.6rem; padding-bottom: .8rem; border-bottom: 1px solid var(--n-gray-900); font-size: 1.8rem; font-weight: 700; color: #222;}
.notice_box .title a {position: relative; background: url(../image/plus-lg.svg) no-repeat center/100%; width: 2rem; height: 2rem;}
/* .notice_box .title a img {width: 100%; height: 100%; object-fit: cover;} */
.notice_content {font-size: 1.4rem; color: var(--n-gray-800);}
.notice_content li {display: flex; justify-content: space-between; }
.notice_content li + li {margin-top: 1rem;}
.notice_content li a:first-child {flex: 1; font-size: 1.4rem; color: var(--n-gray-800); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; word-break: break-all;}
.notice_content li .date {padding-left: 1rem; color: var(--n-gray-700);}

/* call cs box */
.call_cs_box {width: 100%; display: inline-block; padding: 2rem; border-radius: 1rem; background-color: #fff;}
.call_cs_content {display: inline-block;}
.call_cs_content p {font-size: 1.3rem; color: var(--n-gray-600);}
.call_cs_content .cs_desc {display: flex; gap: .8rem; margin-bottom: 1rem;}
.call_cs_content .cs_desc > * {font-size: 1.8rem; font-weight: 700; color: var(--n-primary);}
.call_cs_content .cs_desc .title {font-size: 1.6rem; font-weight: 500; color: var(--n-gray-900);}

/* more con card - 더 알아보기 */
.more_con_area {display: flex; flex-direction: column; gap: 1rem;}
.more_con_area li {list-style: none;}
.more_con_card {width: 100%; font-size: 1.8rem; font-weight: 700; border-radius: 1rem; background-color: rgba(88, 127, 187, 0.10); color: var(--n-gray-900);}
.more_con_card .inner {display: flex; flex-direction: row; align-items: center; gap: 0; padding: 1.2rem 2rem;}
.more_con_card.type2 .inner {align-items: start;}
.more_con_card .more_con_card_ico {position: relative; flex-basis: 4rem; width: 4rem; min-width: 4rem; height: 4rem; margin-right: 1rem; border-radius: 100px; background-color: #fff;}
.more_con_card .more_con_card_ico img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 2.4rem; filter: invert(43%) sepia(71%) saturate(4983%) hue-rotate(206deg) brightness(88%) contrast(87%);}
.more_con_card .more_con_card_desc {width: 100%;}
.more_con_card .more_con_card_desc .head {display: flex; width: 100%; line-height: 40px;}
.more_con_card .more_con_card_desc .ref {width: 100%; font-size: 1.2rem; font-weight: 400; color: var(--n-gray-600); word-break: keep-all;}


/*-------------------------------------------
  -- main swiper area(plugin style)
-------------------------------------------*/
.main_swiper_area {width: 100%;}
.main_swiper_area .swiper-container {position: relative; width: 100%; margin: 0 auto;}
.main_swiper_area .swiper-slide {position: relative; margin: 0 .8rem; text-align: center; font-size: 20px;}
.main_swiper_area .swiper-pagination {bottom: 0;}
.main_swiper_area .swiper-pagination-bullet {width: .8rem; height: .8rem; border-radius: 10px; background-color: #000; opacity: 20%; margin: 0 1rem;}
.main_swiper_area .swiper-pagination-bullet-active {background-color: var(--n-primary); opacity: 100%;}
.main_swiper_area .swiper-button-next, .main_swiper_area .swiper-button-prev {width: 2.4rem; height: 2.4rem; color: var(--n-gray-700);}
.main_swiper_area .swiper-button-next:after, .main_swiper_area .swiper-button-prev:after {font-size: 2.4rem;}
.main_swiper_area .swiper-button-prev, .main_swiper_area .swiper-rtl .swiper-button-next {left: 2rem;}
.main_swiper_area .swiper-button-next, .main_swiper_area .swiper-rtl .swiper-button-prev {right: 2rem;}
.main_swiper_area .swiper-pagination-bullet:only-child {display: inline-block !important; }

/* rate swiper */
.main_product_list .main_swiper_area {position: relative; padding: 0; overflow: hidden;}
.main_product_list .swiper-container {padding-bottom: 3rem;}
.main_product_list .main_swiper_area .swiper-slide {height: auto; margin: 0; text-align: left;}
.main_product_list .swiper-pagination-bullet {background-color: #fff; opacity: 80%;}
.main_product_list .swiper-pagination-bullet-active {background-color: var(--n-primary); opacity: 100%;}

/* event swiper */
.main_event_area .swiper-container {padding-bottom: 2.5rem; overflow: visible;}
.main_event_area .swiper-slide {opacity:0; transition:opacity 0.4s; margin: 0;}
.main_event_area .swiper-slide-active {opacity:1}



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

/* -- common */
.page_title {padding: .5rem 0; margin-bottom: 2.4rem; font-weight: 500;}
.data_none, .event_none {display: flex; justify-content: center; align-items: center; width: 100%; 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: url(../image/exclamation-circle-fill.svg) no-repeat center/100%; display: inline-block; width: 3.2rem; height: 3.2rem;}

/* document */
.onlyPrintArea {display: none;}
.doc_wrap {position: relative; padding-bottom: 20px;}
.doc_head {text-align: center; margin-bottom: 32px; padding-top: 40px;}
.doc_head h2 {font-size: 16pt; margin-bottom: 0;}
.doc_head_logo {position: absolute; top: 0; right: 0; height: 35px;}
.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-primary-light)}
.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: 40px; height: auto; margin-left: 5px;
}

/*-------------------------------------------
  -- accordion style
-------------------------------------------*/
.acc_wrap .acc_item {width: 100%; padding: 1rem 0;}
.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%; background-color: transparent; text-align: left;}
.acc_wrap .acc_header .acc_header_link::after {background: url(../image/chevron-down.svg) no-repeat center/100%; content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 1rem; display: inline-block; width: 1.2rem; height: 1.2rem; filter: invert(25%) sepia(98%) saturate(9%) hue-rotate(329deg) brightness(100%) contrast(95%);}
.acc_wrap .acc_header.active .acc_header_link::after {background: url(../image/chevron-up.svg) no-repeat center/100%; content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 1rem; display: inline-block; width: 1.2rem; height: 1.2rem; filter: invert(25%) sepia(98%) saturate(9%) hue-rotate(329deg) brightness(100%) contrast(95%);}
.acc_wrap .acc_content {display: none; padding-top: 1rem;}
.acc_wrap .acc_content_inner {padding: 1.5rem 2rem; border-radius: .5rem; background-color: var(--n-gray-100);}

/* 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(../image/chevron-down.svg) no-repeat center/100%; width: 1.2rem; height: 1.2rem; filter: invert(25%) sepia(98%) saturate(9%) hue-rotate(329deg) brightness(100%) contrast(95%);}
.acc_wrap.type2 .acc_header.active .acc_header_link {background: url(../image/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;} 

/*-------------------------------------------
  -- board list
-------------------------------------------*/
/* default */
.list_title {display: flex; justify-content: space-between; width: 100%; margin-bottom: 1.6rem;}

/* .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;}

.board_list {margin-top: 1.6rem; border-top: 2px solid var(--n-primary);}
.board_list li {padding: 2rem 1.6rem; border-bottom: 1px solid #e6e6e6;}
.board_list li .title, .board_list li .title a {position: relative; margin-bottom: .5rem; font-size: 1.6rem; font-weight: 500; color: var(--n-gray-900);}
.board_list li .title.ico {padding-right: 2rem;}
.board_list li .title.ico::after {background: url(../image/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;}

.board_list li.tb {display: flex; flex-direction: column;}

/*-------------------------------------------
  -- card list
-------------------------------------------*/
.card_list_wrap {padding-top: 2.4rem;}
.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 1.6rem; border-radius: 1rem; border: 1px solid #e6e6e6; font-size: 1.4rem;}
/* .card_link.type2 {background-color: transparent; border: 1px solid #e6e6e6;} */
.card_link .title {font-size: 1.6rem; font-weight: 500;}

.service_desc {display: flex; flex-direction: column; justify-content: space-between; align-items: baseline;}
.service_desc .badge {display: inline;}
.addType.badge_pps {background-color: #e7718f; } /* 선불 */
.addType.badge_post {background-color: #936ee5; } /* 후불 */
.addType.badge_all {background-color: var(--n-gray-900);} /* 선후불 */
.service_desc .title_wrap { flex: 1; min-width: 0;}
.service_desc .title {padding-top: .5rem; padding-right: 1rem; color: var(--n-gray-900);}
.service_desc .price {width: 100%; font-size: 1.6rem; font-weight: 700; color: var(--n-primary); text-align: right;}
.service_desc .price .ref {font-size: 1.3rem; font-weight: 400; color: var(--n-gray-600);}

.addon_content + .card_list_wrap .rate_info_wrap {padding-top: 1rem;}

/*-------------------------------------------
  -- 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: .5rem; font-size: 1.3rem; font-weight: 400; color: var(--n-gray-600);}
.price_list li.total {color: var(--n-primary);}
.price_list li .title, .price_list li .text {font-weight: inherit; font-size: inherit; color: inherit; padding-bottom: 0;}

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

/*-------------------------------------------
  -- thumb card
-------------------------------------------*/
.thumb_card_link {display: inline-block; width: 100%; margin-bottom: 3rem;}
.thumb_card_img {width: 100%; height: 200px; margin-bottom: 1rem; border-radius: 1rem; overflow: hidden; background-color: #f9f9f9;}
.thumb_card_img.event {height: 100%;}
/* .thumb_card_img.event_end img {opacity: .45;} */
.thumb_card_img img {width: 100%; object-fit: cover;}
.thumb_card_desc {font-size: 1.4rem;}
.thumb_card_desc .title {margin-bottom: .5rem; font-size: 1.6rem; font-weight: 500; color: var(--n-gray-800);}
.thumb_card_desc .date {color: var(--n-gray-700);}

/*-------------------------------------------
  -- tab
-------------------------------------------*/
.tab_box {margin: 0 auto;}
.tab_box_list {display: flex; flex-wrap: wrap; gap: 5px; width: 100%;}
.tab_box_list li {flex: 1; display: inline-block;}
.tab_box_link {display: block; width: 100%; height: 100%; padding: 1.5rem 1rem; font-size: 1.4rem; border: 1px solid #e6e6e6; border-radius: 5px; background-color: transparent; color: var(--n-gray-700); text-align: center;}
.tab_box_link:hover {color: var(--n-gray-700);}
.tab_box_link.on, .tab_box_link.active {background-color: var(--n-primary); color: #fff; border: 1px solid var(--n-primary);}

.tab_box_list_t2 {display: flex; flex-wrap: wrap; gap: 5px 0; margin: 0 -2px;}
.tab_box_list_t2 li {flex: 0 0 auto; display: inline-block; padding: 0 2px;}

.tab_box_list_t3 {display: flex; flex-wrap: nowrap; border-radius: 5px; background-color: var(--n-gray-200);}
.tab_box_list_t3 li {flex: 1 0 auto;}
.tab_box_list_t3 .tab_box_link {border: 0;}

.sub_tab {border-bottom: 1px solid #e6e6e6;}
.sub_tab_list {display: flex; width: 100%;}
.sub_tab_link {display:inline-block; padding: .5rem 1.2rem; font-size: 1.3rem; color: var(--n-gray-500); background-color: transparent; border-radius: 0;}
.sub_tab_link.on {border-bottom: 2px solid var(--n-primary); font-weight: 500; color: var(--n-primary);}

.tab_line_wrap {margin-bottom: 2.4rem; border-bottom: 1px solid #e6e6e6;}
.tab_line {display: flex; justify-content: center; gap: 0 2rem;}
.tab_line_link {padding: 1rem 2rem; border-radius: 0; font-size: 1.3rem; font-weight: 500; background-color: transparent; color: var(--n-gray-700);}
.tab_line_link.on {border-bottom: 2px solid var(--n-primary); color: var(--n-gray-900);}

.tab_line_list {position: relative; display: flex; flex-wrap: wrap; width: 100%; padding-top: 1.75rem; margin: 0 auto; text-align: center; background: #fff; border-bottom: 1px solid #e6e6e6;}
.tab_line_list li {flex: 1 1;}
.tab_line_link {display:inline-block; width: 100%; padding: 1rem .5rem; border-radius: 0; font-size: 1.4em; background-color: transparent; color: var(--n-gray-500);}
.tab_line_link:hover {color: var(--n-gray-500);}
.tab_line_link.on {border-bottom: 2px solid var(--n-primary); font-weight: 700; color: var(--n-primary);}

.tab_content {width: 100%; margin-top: 4rem;}
.tab_content img {width: 100%;}
.tab_content .review_list {border-top: none}

.tab_box_oval {margin-bottom: 1.6rem;}
.tab_box_oval .tab_list {position: relative; display: flex; flex-wrap: wrap; gap: .8rem; width: 100%;}
.tab_box_oval .tab_list li {display: inline-block;}
.tab_box_oval .tab_link {display:inline-block; padding: .8rem 1.6rem; border: 1px solid #e6e6e6; border-radius: 10rem; font-size: 1.4rem; background-color: transparent; color: var(--n-gray-700); }
.tab_box_oval .tab_link.on {border: 1px solid var(--n-primary); background-color: rgba(40, 107, 211, .15); color: var(--n-primary);}

.tab_login {margin-bottom: 2.4rem;}
.tab_login_list {position: relative; display: flex; flex-wrap: wrap; width: 100%; margin: 0 auto; text-align: center; background-color: var(--n-gray-200);}
.tab_login_list li {flex: 1 1 auto;}
.tab_login_link {display:inline-block; width: 100%; padding: 1.2rem .5rem; border-radius: 0; border-bottom: 1px solid var(--n-primary); font-size: 1.4em; color: var(--n-gray-500);}
.tab_login_link:hover {color: var(--n-gray-500);}
.tab_login_link.on {border: 1px solid var(--n-primary); border-bottom: 0; font-weight: 500; color: var(--n-primary); background-color: #fff;}

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

/*-------------------------------------------
  -- product layout(휴대폰)
-------------------------------------------*/
/* phone list */
.card_list.phone_list {display: flex; flex-wrap: wrap;}
.card_list.phone_list .card_list_item {flex: 0 0 auto; width: 100%; border-radius: 1rem;}
.card_list.phone_list .card_rate_link {display: flex;}
.card_list.phone_list .img_wrap {width: 45%; min-width: 45%; max-height: 16rem;}
.card_list.phone_list .img_wrap img {width: 100%; height: 100%; object-fit: contain;}
.card_list.phone_list .content_group {justify-content: center; flex-direction: column; margin-left: 1rem;}
.card_list.phone_list .badge {font-size: 1.1rem;}
.card_list.phone_list .title {margin-bottom: 1rem; font-size: 1.6rem; font-weight: 700; color: var(--n-gray-900); text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.card_list.phone_list .title::after {content: ""; width: 0; height: 0;}
.card_list.phone_list .detail {width: 100%; font-size: 1.3rem; color: var(--n-gray-600);}
.card_list.phone_list .price {margin-top: 0.8rem; font-size: 2.2rem; font-weight: 700; color: var(--n-primary);}
.card_list.phone_list .price .ref {font-size: 1.3rem; font-weight: 400; color: var(--n-gray-800);}

/* product banner */
.product_banner_area {width: auto; overflow: hidden; padding-bottom: 3rem;}
.product_banner_area .swiper-container {position: relative; width: 100%; margin: 0 auto;}
.product_banner_area .swiper-pagination {bottom: 2rem;}
.product_banner_area .swiper-pagination-bullet {width: .6rem; height: .6rem; background-color: #000; opacity: 20%; margin: 0 .8rem;}
.product_banner_area .swiper-pagination-bullet-active {background-color: var(--n-gray-800); opacity: 100%;}
.product_banner_area .thumb_card_img {height: calc(100vw - 30vw); max-height: 360px; margin-bottom: 0; border-radius: 1rem; background-color: #eaeaea;}
.product_banner_area .thumb_card_img img {object-fit: cover; width: 100%; height: 100%;}

/* product select */
.product_select {display: flex; justify-content: end; align-items: center; padding-top: 3rem;}
.product_select p {display: block; font-size: 1.4rem; font-weight: 400; color: var(--n-gray-700);}
.product_select select {position: relative; width: auto; height: auto; padding: .8rem 2.4rem .8rem .8rem; border: 0; border-radius: 1rem; color: var(--n-gray-800); background-position: right 5% center;}
.product_select select:focus {border: 0;}

/* product search */
.product_search_acc .acc_item {width: 100%; height: 100%; padding: 2rem; border: 1px solid var(--n-primary); border-radius: 1rem; background-color: transparent;}
.product_search_acc .acc_header .acc_header_link {position: relative; font-size: 1.6rem; font-weight: 700; color: var(--n-primary);}
.product_search_acc .acc_header .acc_header_link::after {background: url(../image/chevron-down.svg) no-repeat center/100%; content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 0; display: inline-block; width: 1.6rem; height: 1.6rem; filter: invert(44%) sepia(98%) saturate(2308%) hue-rotate(304deg) brightness(100%) contrast(102%);}
.product_search_acc .acc_header.active .acc_header_link::after {background: url(../image/chevron-up.svg) no-repeat center/100%; content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 0; display: inline-block; width: 1.6rem; height: 1.6rem; filter: invert(44%) sepia(98%) saturate(2308%) hue-rotate(304deg) brightness(100%) contrast(102%);}
.product_search_acc .acc_content {padding-top: 0; margin-top: 3.2rem;}
.items_search {padding: 0 1rem;}
.items_search .items {display: flex; flex-direction: column; align-items: start; gap: .5rem; padding-bottom: 1.5rem; margin-bottom: 1.5rem; border-bottom: 1px solid #e6e6e6;}
.items_search .items .title {font-size: 1.4rem; font-weight: 500; color: var(--n-gray-800);}
.items_search .items .input_group {margin-right: 1rem;}
.items_search .select_btn, .items_search .btn-check + .select_btn:hover  {border: 1px solid #efefef; border-radius: 100px; background-color: #efefef; color: var(--n-gray-700);}
.items_search .btn-check:checked + .select_btn:hover {border: 1px solid var(--n-primary); background-color: #fff; color: var(--n-primary);}
.items_search .btn_wrap {padding-top: 1rem; margin-top: 0; text-align: center;}

/* product detail view */
.product_title {font-weight: 700;}
.product_title_desc { margin-top: .5rem; font-size: 1.2rem; font-weight: 400; color: var(--n-gray-700);}
.product_info_wrap {margin-bottom: 3rem;}
.product_tab {margin: 0 -2rem;}

.product_photo_thumbs {display: none; margin-top: 2rem;}
.product_photo_thumbs .swiper-wrapper {justify-content: center;}
.product_photo_thumbs .box_outline {width: 9rem; height: 9rem; padding: .5rem; cursor: pointer;}
.product_photo_thumbs .box_outline img {width: 100%; height: 100%; object-fit: contain;}
.product_photo_thumbs .box_outline.active {border: 1px solid var(--n-primary);}

.product_color_select {display: flex; gap: 0 .5rem;}
.product_color_select  li {position: relative; width: 3.6rem; height: 3.6rem; border-radius: 50%;}
.product_color_select input[type="radio"] + label {display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 2.4rem; height: 2.4rem; border-radius: 50%; border: 1px solid #efefef; cursor: pointer;}
.product_color_select input[type="radio"]:checked + label::before {content: ""; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 3.6rem; height: 3.6rem; border: 1px solid #000; border-radius: 50%; }
.product_color_select input[type="radio"] + label span {display: none;}

.product_rate_select {margin-bottom: 4rem;}
.rate_select_box {padding: 2rem 2.4rem; border-radius: .5rem; border: 1px solid var(--n-primary);}
.rate_select_box .title {padding: 0; font-size: 1.6rem; font-weight: 700; color: var(--n-gray-900); text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.rate_select_box .content_group {display: flex; flex-direction: column;}
.rate_select_box .desc {flex: 1 1 auto; width: 100%; font-size: 1.2rem; color: var(--n-gray-600);}
.rate_select_box .desc li {display: inline-block; padding-right: 2rem;}
.rate_select_box .desc li:not(:last-child)::after {content: '|'; position: absolute; display: inline-block;  margin: 0 0.8rem; color: var(--n-gray-300);}
.rate_select_box .price {flex: none; font-size: 1.8rem; font-weight: 700; text-align: right; color: var(--n-primary);}
.rate_select_box .price .ref {display: block; font-size: 1.3rem; font-weight: 400; color: #BF2673;}

/* photo - swiper */
.product_photo {padding-bottom: 2rem;}
.product_photo .swiper-horizontal>.swiper-pagination-bullets, .product_photo .swiper-pagination-bullets.swiper-pagination-horizontal, .product_photo .swiper-pagination-custom, .swiper-pagination-fraction {bottom: 0;}
.product_photo .swiper-slide {text-align: center; height: 25rem;}
.product_photo .swiper-slide img {width: 80%; height: 100%; object-fit: contain;}

.product_photo .swiper-pagination-bullet {width: .8rem; height: .8rem; background-color: #000; opacity: 20%; margin: 0 .8rem;}
.product_photo .swiper-pagination-bullet-active {background-color: var(--n-gray-800); opacity: 100%;}
.product_photo .swiper-button-next, .product_photo .swiper-button-prev {width: 2.4rem; height: 2.4rem; color: var(--n-gray-700);}
.product_photo .swiper-button-next:after, .product_photo .swiper-button-prev:after {font-size: 2.4rem;}
.product_photo .swiper-button-prev, .product_photo .swiper-rtl .swiper-button-next {left: 2rem;}
.product_photo .swiper-button-next, .product_photo .swiper-rtl .swiper-button-prev {right: 2rem;}

/* .product_photo_thumbs .swiper-wrapper {justify-content: center;} */
.product_photo_thumbs .swiper-wrapper .swiper-slide:last-child {margin-right: 0 !important;}

/*-------------------------------------------
  -- rate layout(요금제)
-------------------------------------------*/
.rate_list_wrap {padding-top: 2.4rem;}
.product_select + .rate_list_wrap {padding-top: 1rem;}
.card_list .badge_wrap {display: flex; flex-wrap: wrap; gap: .5rem;}

/* rate list */
.card_rate_link {padding: 2rem 1.6rem; border: 1px solid #e6e6e6; border-radius: 1rem;}
.card_list.rate_list .title {position: relative; padding-right: 2rem; font-weight: 500; color: var(--n-gray-900);}
.card_list.rate_list .content_group {flex-direction: column; margin-top: 1.6rem;}
.card_list.rate_list .detail {width: 100%; font-size: 1.3rem; color: var(--n-gray-800);}
.card_list.rate_list .desc li {display: inline-block; padding-right: 2rem;}
.card_list.rate_list .desc li:first-child {width: 100%; font-size: 1.8rem; font-weight: 700; color: var(--n-gray-900);}
.card_list.rate_list .desc li:not(:first-child,:last-child)::after {content: '|'; position: absolute; display: inline-block;  margin: 0 0.8rem; color: var(--n-gray-300);}
.card_list.rate_list .detail .ref {padding-top: .5rem; font-size: 1.3rem; font-weight: 500; color: #999;}
.card_list.rate_list .price {margin-top: 1rem; font-size: 2.4rem; font-weight: 700; text-align: right; color: var(--n-primary);}
.card_list.rate_list .price .ref {font-size: 1.3rem; font-weight: 400; color: var(--n-gray-600);}

/* rate detail view */
.rate_info_wrap {margin-bottom: 2rem;}
.rate_info .header_sub {display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: .5rem;}
.rate_info .header_sub .badge {padding: .5rem; font-size: 1.2rem; font-weight: 700; border-radius: .3rem;}
/* .rate_info .header_sub .badge + .badge {margin-left: .5rem;} */
.rate_info .telco {line-height: 1; display: inline-block; padding: .5rem; border: 1px solid var(--n-gray-600); border-radius: .3rem; font-size: 1.2rem; color: var(--n-gray-600);}
.rate_info .header {margin-bottom: 2rem; font-size: 2rem; font-weight: 500;}
.rate_info .content {display: flex; flex-direction: column; padding: 2.4rem; border-radius: 1rem; background-color: rgba(88, 127, 187, 0.08);}
.rate_info .content .detail {padding: 1rem; margin-bottom: 1rem; border-bottom: 1px solid #e6e6e6; font-size: 1.4rem; color: #6F7685;}
.rate_info .detail .desc li {display: flex; align-items: center; margin-bottom: .8rem;}
.rate_info .detail .desc li:first-child {flex-direction: column; align-items: baseline; width: 100%; margin-bottom: .8rem; font-size: 1.8rem; font-weight: 700; color: var(--n-gray-900);}
.rate_info .detail .desc .icon {width: 1.4rem; height: 1.4rem; margin-right: .8rem; filter: invert(45%) sepia(9%) saturate(625%) hue-rotate(183deg) brightness(98%) contrast(83%);}
.rate_info .detail .ref {font-size: 1.4rem; margin-top: 1rem; color: #6F7685;}
.rate_info .price {flex: 0 0 auto;}
.rate_info .price p {font-size: 2.4rem; font-weight: 700; text-align: right; color: var(--n-primary);}
.rate_info .price .vat {font-size: 1.4rem; font-weight: 400; color: var(--n-gray-900);} 
.rate_info .price .ref {font-size: 1.4rem; font-weight: 400; color: #6F7685;}
.rate_info .price .ref_stop {padding: 2rem 0 1rem 0; font-size: 1.8rem; font-weight: 500; text-align: center; color: var(--n-gray-900);}

.rate_info .price button {margin-top: 1rem; font-size: 1.8rem;}

.rate_caption {padding: 1rem; margin-top: 1rem; border-radius: 1rem; border: 1px solid #e6e6e6;}
.rate_caption_list {padding-left: 1rem; font-size: 1.2rem; color: #5A6273;}
.rate_caption_list li {list-style: "\00B7 "; padding-left: .5rem;}
.rate_caption_list li:not(:last-child) {margin-bottom: .5rem;}

.rate_detail {padding-top: 1rem;}
.rate_detail.type2 {padding: 2.4rem; margin-top: 0; border: 0; border-radius: 1rem; background-color: rgba(88, 127, 187, 0.08);}
.rate_detail img {width: 100%;}
.rate_detail_depth {margin-bottom: 2rem;}
.rate_detail_depth .title {margin-bottom: 1rem; font-size: 1.6rem; font-weight: 700; color: var(--n-gray-900); }
.rate_detail_depth .desc_list {padding-left: 2rem; font-size: 1.3rem; color: var(--n-gray-800);}
.rate_detail_depth .desc {padding-left: 1.5rem; font-size: 1.4rem; color: var(--n-gray-800); line-height: 1.8; overflow-x: auto;}
.rate_detail_depth p.desc_list>* {font-size: 1.3rem !important;}
.rate_detail_depth img {width: 100%; height: auto;}
.rate_detail_depth .desc_list li {list-style: "\00B7 "; padding-left: .5rem; margin-bottom: 0.5rem;}
.rate_detail_depth .desc_list_depth {padding: .5rem 0 0 1rem; font-size: 1.2rem;}
.rate_detail_depth .desc_list_depth li {list-style: "- ";}

/*-------------------------------------------
  -- event(이벤트)
-------------------------------------------*/
/* 이벤트 종료 뱃지 */
.event_end .event_badge {position: absolute; top: 0; right: 2rem; z-index: 1;}
.event_end .event_badge .badge {padding: .8rem 2rem; border-radius: 0 0 1rem 1rem; font-size: 1.6rem; background-color: #555;}

.event_board {border-top: 2px solid var(--n-primary); border-bottom: 1px solid #e6e6e6; font-size: 1.5rem; color: var(--n-gray-800);}
.event_board .board_head {padding: 2rem 1.6rem; border-bottom: 1px solid #e6e6e6; background-color: rgba(88, 127, 187, 0.10);}
.event_board .board_head .title {font-size: 1.8rem; font-weight: 500; color: var(--n-gray-900);}
.event_board .board_content {padding: 2rem 1.6rem 4rem 1.6rem; overflow-y: auto;}
.event_board .board_content img {width: 100%;}

/* event > win */
.table_list {width: 100%; border-top: 1px solid var(--n-primary); border-bottom: 1px solid var(--n-primary); font-size: 1.4rem;}
.table_list th, .table_list tr {border-bottom: 1px solid #e6e6e6;}
.table_list th {padding: 1.6rem 0; font-size: 1.6rem; font-weight: 500; color: var(--n-gray-900); text-align: center;}
.table_list td {padding: 1.6rem 0; font-size: 1.6rem; color: var(--n-gray-600); text-align: center;}
.table_list td .link {color: var(--n-gray-800);}
.table_list td .link:hover {color: var(--n-gray-800);}
.table_list tr:last-child {border-bottom: none;}
.table_board td { padding: 2rem 0; padding-left: 1rem;}

/*-------------------------------------------
  -- review(리뷰)
-------------------------------------------*/
/* review list */
.review_list_item {display: flex; flex-direction: column; padding: 2rem 1.6rem; margin-bottom: 1rem; border-radius: 1rem; border: 1px solid #e6e6e6; font-size: 1.4rem;}
.review_list_header {display: flex; flex-direction: column; align-items: flex-start; width: 100%; gap: .5rem; margin-bottom: 1rem;}
.review_list_header .title {width: 100%; font-weight: 500; color: var(--n-gray-900); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.review_list_header .review_info {display: flex; flex-direction: row; flex-shrink: 0; justify-content: space-between; gap: 1rem; font-size: 1.2rem; font-weight: 300; color: var(--n-gray-500);}
.review_list_header .grade {display: flex; align-items: center; gap: 0 .4rem;}
.review_list_header .grade_icon {background: url(../image/star-fill.svg) no-repeat center/100%; content: ""; display: inline-block; width: 1rem; height: 1rem; filter: invert(99%) sepia(22%) saturate(313%) hue-rotate(332deg) brightness(112%) contrast(76%);}
.review_list_header .grade_icon.active {filter: var(--n-filter-primary);}
.review_list_content .desc {margin-bottom: 1rem; font-size: 1.3rem; color: var(--n-gray-800);}
.review_list_content .img_wrap {position: relative; width: 100%; max-width: 20rem; height: 15rem; border-radius: 1rem; 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;}

/* review write */
.grade_btn_wrap {display: flex; align-items: center; gap: 0 .4rem;}
.grade_btn_wrap .grade_btn {background: url(../image/star-fill.svg) no-repeat center/100%; content: ""; display: inline-block; width: 2.4rem; height: 2.4rem; filter: invert(99%) sepia(22%) saturate(313%) hue-rotate(332deg) brightness(112%) contrast(76%);}
.grade_btn_wrap .grade_btn.active {filter: var(--n-filter-primary);}
.review_photo_wrap {position: relative; width: calc(100vw * .35); height: calc(100vw * .35); max-width: 250px; max-height: 250px; border-radius: 1rem; border: 1px solid #e6e6e6; overflow: hidden;}
.review_photo_wrap label {width: 100%; height: 100%; background: url(../image/plus-lg.svg) no-repeat center/30%; filter: invert(70%) sepia(82%) saturate(14%) hue-rotate(355deg) brightness(95%) contrast(89%);}
.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(../image/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: invert(100%) sepia(0%) saturate(0%) hue-rotate(188deg) brightness(100%) contrast(100%);}

/*-------------------------------------------
  -- qna(자주묻는질문)
-------------------------------------------*/
/* qna tab */
.qna_tab_wrap {padding-top: 3.6rem;}
.qna_tab {display: flex; flex-wrap: wrap; gap: .5rem 0;}
.qna_tab_item {margin-right: 1rem;}
.qna_tab_link {display:inline-block; padding: .8rem 1.6rem; border: 1px solid #e6e6e6; border-radius: 10rem; font-size: 1.4rem; background-color: transparent; color: var(--n-gray-700); }
.qna_tab_link.on {border: 1px solid var(--n-primary); background-color: rgba(40, 107, 211, .15); color: var(--n-primary);}

/* qna accordion */
.qna_acc_wrap {margin-top: 1.6rem; border-top: 2px solid var(--n-primary);}
.qna_acc_wrap .acc_item {width: 100%; border-bottom: 1px solid #e6e6e6;}
.qna_acc_wrap .acc_header {font-size: 1.4rem; font-weight: 500; text-align: left; color: var(--n-gray-900);}
.qna_acc_wrap .acc_header_link {position: relative; display: flex; align-items: center; width: 100%; padding: 2rem 4rem 2rem 1.6rem; background-color: transparent; font-weight: 500; text-align: left;}
.qna_acc_wrap .acc_header .acc_header_link::after {background: url(../image/chevron-down.svg) no-repeat center/100%; content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 1rem; display: inline-block; width: 1.2rem; height: 1.2rem; filter: invert(25%) sepia(98%) saturate(9%) hue-rotate(329deg) brightness(100%) contrast(95%);}
.qna_acc_wrap .acc_header.active .acc_header_link::after {background: url(../image/chevron-up.svg) no-repeat center/100%; content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 1rem; display: inline-block; width: 1.2rem; height: 1.2rem; filter: invert(25%) sepia(98%) saturate(9%) hue-rotate(329deg) brightness(100%) contrast(95%);}
.qna_acc_wrap .acc_content {display: none; background-color: #f9f9f9; padding: 2rem 1.6rem;}
.qna_acc_wrap .acc_content_inner {display: flex; font-size: 1.4rem; color: var(--n-gray-800);}

.qna_acc_wrap .q_mark {flex-basis: 2.5rem; flex-shrink: 0; display: inline-block; width: 2.5rem; height: 2.5rem; line-height: 2.5rem; margin-right: 1rem; border-radius: 100px; background-color: var(--n-gray-600); color: #fff; text-align: center;}
.qna_acc_wrap .acc_content .q_mark {background-color: var(--n-gray-700); }

/* 부가서비스 항목*/
.qna_acc_wrap .addType {flex-shrink: 0; display: inline-block; width:4.5rem; height: auto; line-height: 2; margin-right: .5rem; border-radius: 100px; background-color: var(--n-primary); color: #fff; text-align: center; font-size: 1.2rem;}
/* .qna_acc_wrap .addType {flex-shrink: 0; display: inline-block; width:7rem; height: 2.8rem; line-height: 2.8rem; margin-right: 1rem; border-radius: 100px; background-color: var(--n-primary); color: #fff; text-align: center;} */
.qna_acc_wrap .pt_1 {background-color: #e7718f; } /* 유료*/
.qna_acc_wrap .pt_2 {background-color: #565455; } /* 무료 */
.qna_acc_wrap .st_pps {background-color: #7ab3bd; } /* 선불 */
.qna_acc_wrap .st_post {background-color: #6ea2e5; } /* 후불 */
.qna_acc_wrap .st_all {background-color: #936ee5; } /* 선/후불 */

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

/* notice list */
.notice_list {border-top: 2px solid var(--n-primary);}
.notice_list_item {display: flex; flex-direction: column; padding: 2rem 1.6rem; border-bottom: 1px solid #e6e6e6; font-size: 1.4rem;}
.notice_list_item.no_list {padding-right: 0;}
.notice_list_item.no_list::after {display: none;}
.notice_list_item.order_item {display: block;}
.notice_list_item .title {margin-bottom: .5rem; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.notice_list_item.order_item .inner_flex {display: flex; flex-direction: column; justify-content: space-between;}
.notice_list_item.order_item .title {position: relative; margin-bottom: 1rem; font-size: 1.6rem; font-weight: 500;}
.notice_list_item.order_item .title_status {font-size: 1.3rem; color: var(--n-gray-600);}
.notice_list_item.order_item .text {font-size: 1.3rem; color: var(--n-gray-900);}
.notice_list_item.order_item .btn_group {display: flex; flex-direction: row; justify-content: center; gap: 1rem; min-width: 9rem; padding: 0; margin-top: 1rem;}
.notice_list_item.order_item .btn_group > * {width: 100%; max-width: none; padding-left: .5rem; padding-right: .5rem; font-size: 1.3rem;}
/* .notice_list_item.order_item .btn_group > * + * {margin-left: 1rem;} */
.notice_list_item .date, .notice_list_item .event_date {font-size: 1.3rem; color: var(--n-gray-600);}
.notice_list_link {color: var(--n-gray-800);}
.notice_list_link:hover {color: var(--n-gray-800);}

.notice_list_item .no {display: none;}
.notice_list_item .event_date {display: flex; flex-direction: column;}

/* notice detail view */
.notice_board {border-top: 2px solid var(--n-primary); border-bottom: 1px solid #e6e6e6; font-size: 1.5rem; color: var(--n-gray-800);}
.notice_board .board_head {padding: 2rem 1.6rem; border-bottom: 1px solid #e6e6e6; background-color: rgba(88, 127, 187, 0.10);}
.notice_board .board_head .title {font-size: 1.8rem;}
.board_head .title {font-weight: 500; color: var(--n-gray-900);}
.board_head .date {font-size: 1.2rem; color: var(--n-gray-700);}
.notice_board .board_content { padding: 2rem 1.6rem 4rem 1.6rem; overflow-y: auto;}
.notice_board .board_content img {width: 100%;}
.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: 1rem 1.6rem; border-top: 1px solid #e6e6e6;}
.board_page .page_item:first-child {border-top: 0;}
.board_page .page_link {padding-left: 1rem; font-weight: 500; color: var(--n-gray-900);}
.board_page .page_link:hover {color: var(--n-gray-900); background-color: transparent;}

/*-------------------------------------------
  -- 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%;}

/* content */
.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 box */
.agree_group {margin-top: 2rem;}
.agree_box {border-radius: 1rem; font-size: 1.3rem; background-color: #f9f9f9;}
.agree_box .inner {padding: 2rem;}
.agree_check {margin-top: 1rem;}

/* pagination */
.pagination {align-items: center; justify-content: center; margin-top: 2rem;}
.page_icon { display: inline-block; vertical-align: middle; width: 1.4rem; height: 1.4rem; filter: invert(46%) sepia(6%) saturate(73%) hue-rotate(22deg) brightness(96%) contrast(94%);}
.page_first {background: url(../image/chevron-double-left.svg) no-repeat center/100%;}
.page_last {background: url(../image/chevron-double-right.svg) no-repeat center/100%;}
.page_prev {background: url(../image/chevron-left.svg) no-repeat center/100%; margin: 0 .5rem;}
.page_next {background: url(../image/chevron-right.svg) no-repeat center/100%; margin: 0 .5rem;}
.page_link {width: 2.4rem; height: 2.4rem; line-height: 2.4rem; margin: 0 .5rem; border-radius: 100px; font-size: 1.4rem; color: var(--n-gray-800); text-align: center;}
.page_link:hover {background-color: var(--n-lightPink); color: var(--n-primary);}
.page_link.on {background-color: var(--n-primary); color: #fff;}

/*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(../image/plus-lg.svg) no-repeat center/30%; filter: invert(70%) sepia(82%) saturate(14%) hue-rotate(355deg) brightness(95%) contrast(89%);}
.cs_photo_wrap img {position:absolute; top:50%; transform:translateY(-50%); width: 100%; height: auto;}

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

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

/*-------------------------------------------
  -- mypage
-------------------------------------------*/
/* join info */
.my_info.joinInfo .header {margin-bottom: 4.8rem; padding-top: 1.6rem; border-top: 2px solid var(--n-primary);}
.my_info.joinInfo .header_top {display: flex; flex-direction: column; justify-content: space-between; height: unset; margin-bottom: 1rem; border-bottom: 0; font-size: 1.6rem;}
.my_info.joinInfo .header_top .name {font-size: 1.8rem;}
.my_info.joinInfo .header_top .apply_no {display: flex; justify-content: space-between; padding-top: 1rem; margin-top: 1rem; border-top: 1px solid #e6e6e6;}
.my_info.joinInfo .header_top .apply_no b {color: var(--n-primary);}
.my_info.joinInfo .header_bottom {font-size: 1.3rem; background-color: #f9f9f9; border-radius: 1rem;}
.my_info.joinInfo .header_bottom ul {display: flex; flex-direction: column;}
.my_info.joinInfo .header_bottom ul li {display: flex; width: 100%; justify-content: space-between; padding: 1rem;}
.my_info.joinInfo .header_bottom ul li + li {border-top: 1px solid #e9e9e9;}
.my_info.joinInfo .header_bottom ul li span {position: relative; padding-right: 1rem; font-weight: 500;}

.my_info.joinInfo .order_box {height: 100%; padding: 1.5rem; border-radius: 1rem; border: 1px solid #e6e6e6;} 

.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; 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; width: 100%; 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 li.btn_wrap {}
.my_info.joinInfo .content_box ul .title {width: 40%;}
.my_info.joinInfo .content_box ul .title, .my_info.joinInfo .content_box ul .text {font-size: 1.3rem; word-break: keep-all;} 
.my_info.joinInfo .content_box ul .rateplan {font-size: 1.6rem; font-weight: 700; color: var(--n-primary); text-align: center;}

.my_info.joinInfo .content_box .order_list li + li {margin-top: 1rem; padding-top: 1rem; border-top: 0;}

.my_info.joinInfo .content_box .btn_group {border-radius: .5rem; background-color: rgba(40, 107, 211, .15); 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: 50%; background-color: var(--n-primary); opacity: .5; position: absolute; top: 50%; transform: translateY(-50%);} 
.my_info.joinInfo .content_box .btn_group .btn {display: flex; align-items: center; justify-content: center; width: 100%; min-height: 3.5rem; padding: .5rem 1rem; border: 0; font-size: 1.3rem; font-weight: 500; background-color: transparent; color: var(--n-primary);}

.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 > * {padding: 0 .4rem;}
.my_info.joinInfo .content_box .amount_info .amount {width: 100%; 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 .content_box .amount_info {font-size: 1.4rem; color: var(--n-gray-800); word-break: keep-all;}
.my_info.joinInfo .content_box .amount_info .acc {margin-top: .8rem; font-size: 1.8rem; font-weight: 700; color: var(--n-primary);}
.my_info.joinInfo .content_box .amount_info .ref {font-size: 1.2rem; font-weight: 400; color: var(--n-gray-400);} */
.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 {display: flex; flex-direction: column; justify-content: center; width: 100%; padding-bottom: 1.2rem; margin-bottom: 1.2rem; border-bottom: 1px solid #e6e6e6; font-size: 1.6rem; color: var(--n-gray-900); text-align: center;}
.my_info.joinInfo .charge_area .total_info .amount {font-size: 2.8rem; color: var(--n-primary);}
.my_info.joinInfo .charge_area .total_info .period {margin-top: .5rem; font-size: 1.3rem; color: var(--n-gray-400);}
.my_info.joinInfo .charge_area .charge_info {width: 100%; margin-top: 1.2rem;}

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


/***********************************************************************************************************************
  F. Self
***********************************************************************************************************************/
.self_wrap .form_wrap {max-width: 720px; margin: 0 auto;}
.self_wrap .select_btn {color: var(--n-gray-800); border: 1px solid var(--n-gray-200); background-color: var(--n-gray-200);}
.self_wrap .btn-check + .select_btn:hover {color: var(--n-gray-800); border: 1px solid var(--n-gray-200); background-color: var(--n-gray-200);}
.self_wrap .btn-check:checked + .select_btn, .self_wrap .btn-check:checked + .select_btn:hover,
.self_wrap .select_btn.on {color: var(--n-primary); border: 1px solid var(--n-primary); box-shadow: rgb(15, 40, 79, .5) 0px 10px 24px -15px; background-color: var(--n-primary-light);}

.self_wrap .form_wrap h2 {margin-bottom: 1.6rem; font-size: 1.6rem; font-weight: 500; color: var(--n-gray-900);}
.self_wrap .form_wrap h2.type_flex {display: flex; flex-wrap: wrap; justify-content: space-between;}

.self_wrap .order_list_wrap h2 {border-bottom: 0;}
.self_wrap .order_list {padding: 0; border: 0; line-height: 2;}
.self_wrap .order_list .title {max-width: 120px;}
.self_wrap .order_list .text {text-align: right;}

#hopeNumList {margin: 1rem 0;}
#hopeNumListArea button {max-width: 340px;}
#areaTerms {padding: 1rem 1.5rem !important; border-radius: 1rem; background-color: #f9f9f9;}
#areaTerms > div {padding-top: 1rem;}
#areaTerms .btn_underline, #personAgree .btn_underline {min-width: 25px; margin-left: 1rem;}

#inisisAuth .modal-body {height: 65vh;}
#inisisAuth .acc_group {padding: 1rem; border: 1px solid #e6e6e6; border-radius: 1rem;}
#inisisAuth .acc_content {font-size: 1.4rem;}
#inisisAuth .step {flex-direction: row;}
#inisisAuth .step_item + .step_item::before {top: 50%; left: -2.5rem; transform: translateY(-50%); background: url(../image/chevron-right.svg) center / 100% no-repeat; }
#inisisAuth .step_item .img_wrap {width: 6rem; height: 6rem;}
#inisisAuth .step_item .img_wrap img {width: 3rem; height: 3rem;}

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

/*-------------------------------------------
  -- step1
-------------------------------------------*/
/* 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 info (셀프개통 안내) */
.self_info .box_outline .title {margin-bottom: 1rem; font-size: 1.6rem; font-weight: 500;}
.self_info .box_outline .content {font-size: 1.4rem; color: var(--n-gray-800); word-break: keep-all;}
.self_info .box_outline .ref {padding-top: 1rem; font-size: 1.2rem; color: var(--n-gray-600);}

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

/* 보유 유심 인증 */
#usimInfo .box_form {padding: 1.6rem 0; text-align: center;}

.step1-activeInfo button {font-size: 1.4rem;}
/* .step1-usimInfo .advice_item {flex-direction: column;} */
.step1-usimInfo .advice_item .img_wrap {flex-basis: 8rem; min-width: 8rem; height: 8rem; background-color: var(--n-primary-light);}
.step1-usimInfo .advice_item .img_wrap img {width: auto; height: 5rem;}
.step1-usimInfo .advice_item .box_outline {padding: 1rem;}

#selfInfoTabContent {margin-top: 1.6rem;}

/*-------------------------------------------
  -- price select(요금제 선택 - step_price)
-------------------------------------------*/
/* price filter */
.price_filter .swiper {padding-right: 2rem;}
.price_filter, .price_filter_popup {top: 6rem; padding: 1rem 0; margin-top: -10px; margin-bottom: 1.4rem; background-color: #fff; overflow-x: visible;}
.price_filter button, .price_filter_popup button {padding: .8rem 1.6rem; font-size: 1.4rem; color: var(--n-gray-700); background-color: transparent; border: 1px solid #e6e6e6; border-radius: 100px;}
.price_filter button.on, .price_filter_popup button.on {color: var(--n-primary); background-color: rgba(40, 107, 211, .15); border-color: var(--n-primary);}

.self_wrap .price_sticky_wrap {top: 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; padding-bottom: 2.4rem; margin-bottom: 0;}
.self_wrap .price_sticky_wrap .price_filter {top: 0; margin-top: 0;}

/* price list */
.card_price_list {border: none;}
.card_price_list + .card_price_list {margin-top: 2rem;}
.card_price_list label {padding: 2rem 1.6rem; border: 1px solid #e6e6e6; border-radius: 1rem; font-size: 1.4rem;}
.card_price_list input[type="radio"] {display: none;}
.card_price_list input[type="radio"]:checked + label {border: 1px solid var(--n-primary); box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;}

.card_price_list .content_group {flex-direction: column; margin-top: 1.6rem;}
.card_price_list .head {font-weight: 500;}
.card_price_list .detail {width: 100%; font-size: 1.3rem; color: var(--n-gray-800);}
.card_price_list .text {margin-top: .5rem;}
.card_price_list .text li {position: relative; display: inline-block; padding-right: 1rem; margin-right: 0.8rem;}
.card_price_list .text li:first-child {width: 100%; font-size: 1.8rem; font-weight: 700; color: var(--n-gray-900);}
.card_price_list .text li:not(:first-child, :last-child)::after {content: ''; position: absolute; top: 50%; right: 0; transform: translateY(-50%); display: inline-block; width: 1px; height: 10px; background-color: var(--n-gray-300);}
.card_price_list .detail .ref {padding-top: .5rem; font-size: 1.3rem; font-weight: 500; color: #999;}
.card_price_list .price {margin-top: 1rem; font-size: 2.4rem; font-weight: 700; text-align: right; color: var(--n-primary);}
.card_price_list .price .ref {font-size: 1.3rem; font-weight: 400; color: var(--n-gray-600);}

/*-------------------------------------------
  -- order list(가입정보 확인 - step_6)
-------------------------------------------*/
.order_list_wrap h1 {margin-bottom: 3.2rem;}
.order_list_wrap h2 {margin-bottom: 1.2rem;}
.order_list_wrap .order_list, .order_box {padding: 1.6rem 0; border-radius: 1rem; border: 1px solid #e6e6e6;}
.order_list_wrap .order_list.type_flex, .order_box.type_flex {display: flex; flex-direction: column;}
.order_list_wrap .order_list li {padding: 0 1.6rem;}
.order_list_wrap .order_list li + li {margin-top: 1.6rem; padding-top: 1.6rem; border-top: 1px solid #e6e6e6;}
.order_list_wrap .order_list .text_flex {justify-content: end;}
.order_list_wrap .order_list .text {text-align: right;}
.order_list_wrap .order_list .text .ref {display: inline-block; width: 100%;}

.order_list li +  li {margin-top: 1.6rem;}
.order_list .title {font-size: 1.4rem; color: var(--n-gray-700);}
.order_list .text {font-size: 1.4rem; color: var(--n-gray-800);}
.order_list .text_flex {display: flex; flex-direction: column; align-items: end;}

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

/*-------------------------------------------
  -- applyComplArea(접수완료 - step_7)
-------------------------------------------*/
.applyComplArea .img_wrap {margin-bottom: 1rem;}
.applyComplArea .img_wrap img {width: 8rem; filter: invert(43%) sepia(71%) saturate(4983%) hue-rotate(206deg) brightness(88%) contrast(87%);}
.applyComplArea h2 {margin-bottom: 1.6rem; font-size: 1.8rem;}
.applyComplArea .box_guide {padding: 2rem 1rem; background-color: #f9f9f9; color: var(--n-gray-800);}



/***********************************************************************************************************************
  G. Components
***********************************************************************************************************************/

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

.form_notice {width: 100%; margin-top: 1rem; font-size: 1.3rem; color: var(--n-gray-800);}

/* input group */
.input_flex {display: flex; align-items: center; gap: .8rem;}
.input_flex input, .input_flex .form_file_inp {flex: 1;}
.input_flex button, .input_flex .form_file_btn {height: 5rem; padding: 0 1rem;}


/* label */
.n_form_label {font-size: 1.4rem; padding-top: .5rem; padding-bottom: .5rem; margin: 0; color: var(--n-gray-800);}
.n_check_label {font-size: 1.4rem; padding-left: 1rem; color: var(--n-gray-800);}

/* checkbox - terms */
.form_check_icon {padding-left: 0; margin-bottom: 0;}
.form_check_icon .n_check_label {position: relative; padding-left: 2.8rem;}
.form_check_icon input[type="checkbox"] + label span {position: absolute; top: 50%; left: 0; display: inline-block; width: 20px; height: 20px; vertical-align: top; cursor: pointer; transform: translateY(-50%); border-radius: 10rem; border: 1px solid #000; background: url(../image/check-lg.svg) no-repeat center center; background-size: 90%; filter: invert(92%) sepia(0%) saturate(1214%) hue-rotate(153deg) brightness(88%) contrast(75%);}
.form_check_icon input[type="checkbox"]:checked + label span {filter: invert(31%) sepia(66%) saturate(1448%) hue-rotate(195deg) brightness(98%) contrast(93%);}

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

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

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

.select_list_area {}
.select_list {gap: 1.6rem 0;}
.select_list li {position: relative; text-align: center;}
.select_list li a {display: inline-block; width: 100%; height: 100%; font-size: 1.2rem; color: var(--n-gray-800);}
.select_list li a.on {font-weight: 500; color: var(--n-gray-900);}
.select_list li a.on .img_wrap {border: 2px solid var(--n-primary); box-shadow: var(--n-primary-shadow) 0px 0px 0px 3px;}
.select_list li a .img_wrap {width: 5rem; height: 5rem; margin: 0 auto; border: 1px solid #e6e6e6; border-radius: 1rem; overflow: hidden;}
.select_list li a .img_wrap img {width: 100%; height: 100%; object-fit: cover;}
.select_list li a span {display: inline-block; margin-top: .5rem;}

/*-------------------------------------------
  -- table
-------------------------------------------*/
.table_board {display: block; width: 100%; border-top: 2px solid var(--n-primary); font-size: 1.4rem;}
.table_board tbody {display: inline-block; width: 100%;}
.table_board tr {display: grid; grid-template-columns: auto; align-items: start; width: 100%; padding-bottom: 1rem; border-bottom: 1px solid #e6e6e6;}
.table_board th {width: 100%; padding: 2rem 0 0 0; font-weight: 500;}
.table_board td {width: 100%; padding: 1rem 0;}

.table_board.type2 {display: table; width: 100%; border-top: 2px solid var(--n-primary); font-size: 1.4rem;}
.table_board.type2 tbody {display: table-row-group;}
.table_board.type2 tr {display: table-row; border-bottom: 1px solid #e6e6e6;}
.table_board.type2 th {display: table-cell; 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;}

/* gray */
.table_board.table_board_gray {border-top: 1px solid var(--n-gray-300); border-bottom: 1px solid var(--n-gray-300);}
.table_board.table_board_gray th {background-color: var(--n-gray-100);}

/* align */
.table_board td.td_left {padding-left: 2rem;}

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

.box_title {font-size: 1.4rem; font-weight: 500; color: var(--n-gray-900); margin-bottom: 1rem;}

.box_outline {padding: 2rem; border: 1px solid var(--n-gray-300);}
.box_outline_title {padding-top: .8rem; font-size: 1.4rem; color: var(--n-gray-800);}
.box_outline_text {padding-top: .8rem; font-size: 1.1rem; color: var(--n-gray-400);}
.box_outline_icon img {width: 4rem;}

.box_form .img_wrap {padding: 1rem; margin-bottom: 1rem; border-radius: 1rem; background-color: #f9f9f9;}
.box_form img {width: 100%; max-width: 420px; height: auto;}
.box_form .title {padding-bottom: 1.6rem; font-size: 1.4rem; font-weight: 700; color: var(--n-primary);}
.box_guide + .form_wrap {margin-top: 3.2rem;}
.box_form .btn_group {background-color: transparent;}

.box_cardlist {overflow-y: auto;}
.box_cardlist .inner {padding-bottom: 10.4rem;}

.box_list {padding: 1.2rem 1.6rem; background-color: var(--n-gray-100);}
.box_list .form-check {padding: .8rem 1.5rem;}

.box_guide {padding: 2rem; background-color: var(--n-gray-100);}
.box_guide .title {padding-bottom: 1rem; font-size: 1.4rem; font-weight: 700; color: var(--n-primary);}
.box_guide .text {padding: .8rem 0 ; margin-top: .8rem; font-size: 1.4rem; color: var(--n-gray-800);}
.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(../image/IMEI_guide01.jpeg);}
.img_box#imgPhoneInfo { background: no-repeat bottom/100% url(../image/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: 1.6rem; background-color: rgba(36, 150, 181, .04);}
.box_green .title {font-size: 1.4rem; font-weight: 700;}

.box_light {height: 100%; padding: 1.6rem; background-color: rgba(88, 127, 187, .08);}
.box_light_title {padding-top: .8rem; font-size: 1.4rem; color: var(--n-gray-800);}
.box_light_text {padding-top: .8rem; font-size: 1.1rem; color: #A4A9B2;}
.box_light_icon {position: relative; width: 8rem; height: 8rem; margin: 0 auto; border-radius: 10rem; background-color: #fff;}
.box_light_icon img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 4rem;}



/* modal */
.modal-header, .modal-body, .modal-footer {padding: 2rem 2rem;}
.modal-body, .modal-footer {border: none;}
.modal-header {border-color: #ebebeb;}
.modal-body .inner {max-height: 410px; overflow-y: auto;}
.modal-title {font-size: 1.8rem; font-weight: 700; color: var(--n-gray-900);}

.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;}

/*-------------------------------------------
  -- button
-------------------------------------------*/
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: #ccc; background-color: #ccc; color: var(--n-gray-700); 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: #aaa;}

.btn_wrap {margin-top: 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;}

/* button color */
.n_btn_primary {background-color: var(--n-primary); color: #fff;}
.n_btn_primary:hover {background-color: var(--n-primary-hover); color: #fff;}
.n_btn_lightgray {background-color: var(--n-gray-200); color: var(--n-gray-700);}
.n_btn_lightgray:hover {background-color: #eaeaea;  color: var(--n-gray-700);}
.n_btn_darkgray {background-color: var(--n-gray-700); 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);}
.n_btn_outline_gray {background-color: transparent; border: 1px solid var(--n-gray-600); color: var(--n-gray-800);}
.n_btn_outline_gray:hover {color: var(--n-gray-800);}
.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);}
.n_btn_info {background-color: var(--n-gray-200); color: var(--n-gray-800);}
.n_btn_info:hover {background-color: #eaeaea; color: var(--n-gray-800); border: none;}
.n_btn_img#thePay {background: url(../image/thePay_white.png) no-repeat center center; background-size: contain; background-color: #061E4F;}
.btn_underline {padding: 0; font-size: 1.3rem; color: var(--n-gray-500); text-decoration: underline; vertical-align: middle; background-color: transparent;}
.btn_underline:hover {color: var(--n-gray-500);}
.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);}

.btn_down {position: relative; height: 3rem; padding: 0 1rem 0 3rem; font-size: 1.4rem; background-color: transparent; border: 1px solid var(--n-gray-300); border-radius: 1rem; color: var(--n-gray-600);}
a.btn_down {display: inline-block; line-height: 3rem;}
.btn_down::before {content: ''; background: url(../image/download.svg) no-repeat center/100%; position: absolute; top: 50%; left: 1rem; transform: translateY(-50%); display: inline-block; width: 1.5rem; height: 1.5rem; filter: invert(45%) sepia(8%) saturate(80%) hue-rotate(21deg) brightness(96%) contrast(87%);}
.btn_down:hover {color: var(--n-gray-600);}

/* button company */
.btn_kakao {display: inline-block; padding: 1rem 1.6rem; font-size: 1.4rem; font-weight: 700; background-color: #FAE700; border-radius: 1rem; color: #452120;}
.btn_kakao:hover {color: #452120;}

/* button size */
.n_btn_lg {display: inline-block; width: 100%; height: 6rem; font-size: 1.6rem; font-weight: 500; border-radius: 1rem; text-align: center;}
a.n_btn_lg {line-height: 6rem;}
.n_btn_lg.w340 {max-width: 340px;}
.n_btn_lg.w260 {max-width: 260px;}
.n_btn_m {display: inline-block; width: 100%; height: 5rem; max-width: 340px; font-size: 1.6rem; font-weight: 500; border-radius: 1rem; text-align: center;}
a.n_btn_m {line-height: 5rem;}
.n_btn_s {display: inline-block; width: 100%; height: 5rem; font-size: 1.5rem; border-radius: 1rem; text-align: center;}
a.n_btn_s {line-height: 5rem;}
.n_btn_xs {display: inline-block; max-width: 120px; height: 3.5rem; font-size: 1.4rem; border-radius: 1rem; text-align: center;}
a.n_btn_xs {line-height: 3.5rem;}
.n_btn_auto {height: 3rem; padding: 0 1rem; font-size: 1.3rem; border-radius: 5px; text-align: center;}
a.n_btn_auto {display: inline-block; line-height: 3rem;}
.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(../image/chevron-right.svg) no-repeat center/100%; content: ""; display: inline-block; width: 1.2rem; height: 1.2rem; margin-left: .4rem; transform: translateY(1px);}
.btn_link_ico:hover {color: var(--n-gray-900);}

/* icon */
.icon_help {width: 14px; height: 14px; margin-left: .4rem; background: url(../image/question-circle-fill.svg) no-repeat center center; background-size: 100%; background-position: 0 0; filter: invert(88%) sepia(18%) saturate(18%) hue-rotate(17deg) brightness(93%) contrast(84%);}

/* select button */
input[type="radio"].btn-check, input[type="checkbox"].btn-check  {display: none;}
.select_btn, .select_btn_t2 {display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; padding: 1.6rem 1rem; font-size: 1.4rem; color: var(--n-gray-700); border: 1px solid #e6e6e6; border-radius: 1rem; background-color: transparent; word-break: keep-all;}
.select_btn_t2 {display: flex; justify-content: space-between;}
.select_btn_lg {padding: 2.4rem 2rem;}
.btn-check + .select_btn:hover, .btn-check + .select_btn_t2:hover {color: var(--n-gray-700); border: 1px solid #e6e6e6; background-color: transparent;}
.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: var(--n-primary-light);}

/* 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(../image/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 {padding: .5rem; font-size: 1.2rem; font-weight: 700; border-radius: 0.3rem;}
/* .badge_wrap .badge + .badge {margin-left: .5rem;} */

.badge_primary {background-color: var(--n-primary); border: 1px solid var(--n-primary); color: #fff;}
.badge_red {background-color: #ef4f41; border: 1px solid #ef4f41; color: #fff;}
.badge_purple {background-color: #ba66cb; border: 1px solid #ba66cb; color: #fff;}
.badge_green {background-color: #26c196; border: 1px solid #26c196; color: #fff;}
.badge_yellow {background-color: #ffc361; border: 1px solid #ffc361; color: #fff;}
.badge_blue {background-color: #00a3f1; border: 1px solid #00a3f1; color: #fff;}
.badge_primary-line {background-color: transparent; border: 1px solid var(--n-primary); color: var(--n-primary);}
.badge_black-line {background-color: transparent; border: 1px solid var(--n-gray-900); color: var(--n-gray-900);}
.badge_red-line {background-color: transparent; border: 1px solid #ef4f41; color: #ef4f41;}
.badge_purple-line {background-color: transparent; border: 1px solid #ba66cb; color: #ba66cb;}
.badge_green-line {background-color: transparent; border: 1px solid #26c196; color: #26c196;}
.badge_yellow-line {background-color: transparent; border: 1px solid #ffc361; color: #ffc361;}
.badge_blue-line {background-color: transparent; border: 1px solid #00a3f1; color: #00a3f1;}

/*-------------------------------------------
  -- text
-------------------------------------------*/
h1 {font-size: 2.2rem; font-weight: 500; color: var(--n-gray-900);}
h2 {font-size: 1.5rem; font-weight: 500; color: var(--n-gray-900); margin-bottom: 1.2rem;}
.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-800);}
.text_dark_color {color: var(--n-gray-900);}
.text_light_color {color: var(--n-gray-500);}
.text_primary_color {color: var(--n-primary);}
.text_bold {font-weight: 700;}
.text_light {font-weight: 400;}
.text_info {margin-top: .5rem; font-size: 1.3rem;}

.ellipsis {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

/*-------------------------------------------
  -- step
-------------------------------------------*/
.step {display: flex; flex-direction: column; justify-content: space-between; gap: 3rem;}
.step_item {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.5rem; left: 50%; transform: translateX(-50%); display: block; width: 1.2rem; height: 1.2rem; background: url(../image/chevron-down.svg) center/100% no-repeat; filter: invert(83%) sepia(0%) saturate(30%) hue-rotate(177deg) brightness(83%) contrast(81%);} 
.step_item .img_wrap {position: relative; width: 8rem; height: 8rem; background-color: var(--n-primary-light); border-radius: 100%; }
.step_item .img_wrap img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 3rem; height: 3rem;}
.step_item .title {margin-top: 1rem; font-size: 1.4rem;}

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

.advice.type2 .advice_item {flex-direction: column; gap: 1.2rem;}
.advice.type2 .advice_item .img_wrap {flex-basis: auto; width: 4rem; height: 4rem;}

/*-------------------------------------------
  -- 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-header, .modal-body, .modal-footer {padding: 2rem 2rem;}
.modal-body, .modal-footer {border: none;}
.modal-header {border: 0;}
.modal-body .inner {max-height: 70vh; } /* overflow-y: auto; */
.modal-title {font-size: 1.8rem; font-weight: 700; color: var(--n-gray-900);}

.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;}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {opacity: .45;}

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

.byte_check {font-size: 1.3rem; color: var(--n-gray-800);}
.now_byte {color: var(--n-primary);}


/***********************************************************************************************************************
  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: 640px; padding: 5rem 0; word-break: keep-all;}
.error_wrap img {width: 100%;}
.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;}

/* -- google translate custom */
#langSelect {position: absolute; top: 50%; right: calc(2.4rem + 2.8rem); transform: translateY(-50%); width: auto; height: 3rem; background-color: transparent; border: 1px solid var(--n-primary); border-radius: 0.5rem; font-size: 1.3rem; color: var(--n-primary); padding: 0 2rem 0 .8rem; background: url(../image/chevron-down-solid.svg) no-repeat right .5rem center/1rem; filter: var(--n-filter-primary); z-index: 50; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
#langSelect::-ms-expand, #langSelect::expand { 
	display: none;
}
#google_translate_element {position: absolute; top: 50%; right: calc(2.4rem + 2.8rem); transform: translateY(-50%); min-width: 8rem; height: 30px !important; background-color: transparent; z-index: 50;}
#google_translate_element img {display: none !important;}
#google_translate_element > div {height: 100%;}
#google_translate_element > div > div {position: relative; width: 100%; height: 100%; padding: 0; border: 1px solid var(--n-primary); border-radius: 0.5rem;}
#google_translate_element > div > div > select::-ms-expand {display: none;}
#google_translate_element > div > div:after {content: ""; position: absolute; right: .5rem; top: 50%; transform: translateY(-50%); display: inline-block; width: 1rem; height: 1rem; background: url(../image/chevron-down-solid.svg) no-repeat center/100%; filter: var(--n-filter-primary); pointer-events: none;}
#google_translate_element > div > div > span {line-height: 3rem;}
#google_translate_element > div > div > span > a {display: inline-block;margin: 0; padding: 0 2rem 0 .8rem; color: var(--n-primary); font-weight: 500;}
#google_translate_element > div > div > span > a > img {display: none !important;}
#google_translate_element > div > div > span > a > span:nth-child(n+3) {display: none;}
#google_translate_element > div > div > select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: block;
  width: 100%;
  max-width: 320px;
  height: 50px;
  float: right;
  margin: 5px 0px;
  padding: 0px 24px;
  font-size: 16px;
  line-height: 1.75;
  color: #333;
  border: 1px solid #cccccc;
  -ms-word-break: normal;
  word-break: normal;
  border-radius: 10px;
}



/***********************************************************************************************************************
  I. Media Query
***********************************************************************************************************************/
@media screen and (min-width: 576px) {
  /*-------------------------------------------
    -- mobile (576px~)
  -------------------------------------------*/
	
  /***
    E. Sub
  ***/
  /* -- event */
  /* .thumb_card_img.event {height: calc(100vw - 320px); max-height: 280px;} */
	
  /* ?? */
	.product_tab {margin: 0;}
	.product_photo .swiper-slide {height: 30rem;}
	
	.product_banner_area {margin: 0;}
}
@media screen and (min-width: 768px) {
    /*-------------------------------------------
      -- tablet (768px~)
    -------------------------------------------*/

    /***
      B. Layout
    ***/
    /* -- container*/
    .container {
        max-width: 720px;
    }
    

    /***
      D. Main
    ***/
    /* -- main banner(carousel) */
    /* .main_banner_carousel .carousel-inner {border-radius: 2rem;} */
    
    .carousel_mobile, .for_mobile {display: none;}
	.carousel_tablet, .for_tablet {display: inline-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_card_img.event {height: calc(100vw - 600px); max-height: 160px;} */
    .thumb_list_item {width: 50%;}
    
    /* -- ?? */
    .store_list_item {flex-direction: row; align-items: center; padding: 2rem 1.6rem;}
    .store_desc {padding-top: 0; padding-left: 2rem;}
	
	  /* -- ?? */
	  .card_list.phone_list {display: flex; gap: 0 1.6rem;}
	  .card_list.phone_list .card_list_item {flex: 0 0 auto; width: calc(50% - 0.8rem);}
    
    .product_banner_area .thumb_card_img {max-height: 280px; height: calc(100vw - 60vw);}
}

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

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

    
    /***
      B. Layout
    ***/
    /* -- container*/
    .container, .container-lg, .container-md, .container-sm {
        max-width: 960px;
    }

    /* -- body */
    .body_wrap {padding-top: calc(10rem + 5rem);}
    .body_wrap_agent {padding-top: 40px;}

    /* -- header */
    .header .header_content {height: auto;}
    .header .logo img {max-height: 4rem; margin-bottom: 2.4rem;}
    .header_top {display: block;}
    .header_content .icons_item_btn {height: 3.5rem; padding: 0 2rem; margin-left: 1rem; font-size: 1.6rem;}
    
    .header_content .moblie_wrap {display: none;}
	  .header_content .pc_wrap {display: flex;}

    /* -- sub header */
    .sub_header {align-items: normal; gap: 2.4rem; top: 10rem; padding-top: 2rem; padding-bottom: 1.6rem; margin-bottom: 4rem;}
    .body_wrap_agent .sub_header {top: 0;}
    .sub_header_step {justify-content: center; padding: 2.4rem 0; border-radius: 1rem;}
    .sub_header_step li {gap: .5rem; font-size: 2rem;}
    .sub_header_step li + li {padding-left: 2.4rem;}
    .sub_header_step li img {width: 3rem; height: 3rem;}
	
	  /* -- fullmenu */
	  .full_menu_wrap {display: none !important;}
	
    /* .full_menu_body {padding-top: 81px;}
    
    .full_menu_sign .pc_wrap {display: block;}
    .full_menu_sign .mob_wrap {display: none;}
    
    .full_menu_content {padding: 3.6rem 0;}
    .full_menu_content .submenu_list {margin-bottom: 4rem;}
    .full_menu_content .sub_tab_list li {flex: none;}
    .full_menu_content .sub_tab_link {padding: 1rem 1.6rem; font-size: 1.4rem;}
    
    .full_menu_content .menu_list {display: flex; flex-wrap: wrap; gap: 6rem 0; margin: 0 -1.8rem 0 -1.8rem;}
    .full_menu_content .menu_list li {width: 33.33333%; padding: 0 1.8rem 0 1.8rem;}
    .full_menu_content .menu_list li a {display: inline-block; width: 100%; font-size: 2rem; border-bottom: 2px solid var(--n-gray-900); text-decoration: none;}
    .full_menu_content .menu_list li a:hover {border-color: var(--n-primary);}
    .full_menu_content .menu_list li .sub_list li {width: 100%; padding: .8rem 0;} 
    .full_menu_content .menu_list li .sub_list li a {font-size: 1.6rem; border-bottom: 0; text-decoration: none;} */
    
    /* -- nav */
    .gnb_wrap {display: block;}
    .util_wrap {display: flex; justify-content: end; min-width: 180px;}

    /* -- footer */
    footer {margin-top: 8rem;}
    .footer_top {padding: 6rem 0 3rem 0;}
    .footer_top .logo {height: 4rem;}
    .footer_top .policy_list {font-size: 1.6rem; gap: 0 2.4rem;}
    .footer_top .policy_list a {font-weight: 400;}
    .footer_bottom {padding: 1rem 0 6rem 0;}
    .footer_bottom .company_info {width: 65%; max-width: 650px; font-size: 1.4rem; gap: .5rem 0;}
    .footer_bottom .company_info li {width: auto;}
    .footer_bottom .company_info li:not(:first-child)::before {content: '\007C'; padding: 0 .5rem; font-size: 1.3rem;}
    .footer_bottom .company_info li:nth-child(even)::before, .compa ny_info li:first-child::before {content: ''; padding: 0;}

    /* -- preview bottom */
    .preview_header { padding: 3.2rem 0;}
    .preview_header .head {font-size: 2rem;}
    .preview_header .n_btn_icon {width: 1.8rem; height: 1.8rem;}
    .preview_body {padding: 2.4rem 0 6rem 0;}
    .preview_body .price_info {margin-left: 1rem;}
    .preview_body .price_info .title {font-size: 2rem;}
    .preview_body .price_info .title + .title {font-size: 2.4rem;}
    .preview_body .order_list { padding: 1rem 2rem; margin: 0 0 0 1rem;}
    
    .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;}

    /***
      C. login
    ***/
	  .login_form {padding: 0 5rem;}

    
    /***
      D. Main
    ***/
    .main_content {padding-top: calc(10rem + 3.2rem);}
    .main_title_area .btn_link_ico {top: 7px; font-size: 1.5rem;}
    .sec_title {font-size: 3.2rem; margin-bottom: 4rem;}

    /* -- main banner */
    /* .main_banner .carousel-indicators [data-bs-target] {width: 10px; height: 10px;}
    .main_banner .carousel-indicators .active {width: 1rem; height: 1rem;}
    .carousel-control-next-icon, .carousel-control-prev-icon {width: 5.6rem; height: 5.6rem;} */
    
    .carousel_mobile, .carousel_tablet, .for_mobile, .for_tablet {display: none;}
	.carousel_pc, .for_pc {display: inline-block;}
	  
	.main_banner .swiper-container {padding: 0 2.4rem; padding-bottom: 0; margin: 0 -2.4rem;}
	.main_banner .swiper-slide {padding-top: 29.8%;}


    /* -- main service area */
    .main_service_area {padding: 5rem 0;}
    .main_service_area .service_group {gap: 0;}
    .service_link {padding: 2.4rem 0;}
    .service_link .img_wrap {flex-basis: 8rem; height: 8rem; min-width: 8rem;}
    .service_link .img_wrap img {width: 4.8rem;}
    .service_link .text {font-size: 1.4rem;}
    .service_link .text .title {font-size: 1.8rem;}
    .service_link .text .desc {display: block;}

    /* -- main product list */
    .main_product_list {padding: 8rem 0;}
    .main_product_list .rate_area {padding: 2.4rem; border-radius: 0 0 2rem 2rem;}

	.rate_tab_list {border-radius: 1rem 1rem 0 0;}
	.rate_tab_list .tab_link {padding: 1.6rem 0; font-size: 1.6rem;}
	.rate_tab_list .tab_link.on {border-radius: 1rem 1rem 0 0;}
    
    .tab_line_wrap {margin-bottom: 3.2rem}
    .tab_line {gap: 0 4rem;}
    .tab_line_link {padding: 1.4rem 0; border-radius: 0; font-size: 1.8rem;}

    /* rate list card */
    .rate_card_list {flex-wrap: wrap; gap: 2.4rem 0; margin: 0 -1.2rem 0 -1.2rem;}
    .rate_card_item {width: 33.33333%; padding: 0 1.2rem 0 1.2rem;}
    .rate_card {padding: 3.2rem; border-radius: 2rem;}
    .rate_card_title {font-size: 2rem; margin-bottom: 3.2rem;}
    .rate_card_title .title_label span {font-size: 1.2rem;}
    /* .rate_card_title .title_label span + span {margin-left: .4rem} */	
    .rate_card_info {margin-bottom: 2.4rem; }
    .rate_card_info li {width: 100%; font-size: 1.4rem;}
    .rate_card_info li + li {margin-top: .8rem;}
    .rate_card_info li:not(:last-child)::after {padding-left: 1.2rem; font-size: 1.6rem;}
    .rate_info_ico::before {width: 2rem; height: 2rem; margin-right: .8rem;}
    .rate_bottom_price .discount {font-size: 2.8rem;}
    .rate_bottom_price .ref {font-size: 1.4rem;}
    .rate_card_bottom .rate_btn {height: 6rem; font-size: 2rem; border-radius: 1rem;}
    
    /* -- main event area */
	  .main_event_area {padding: 8rem 0;}
	  /* .main_event_area .thumb_card_img.event {max-height: 250px;} */
	
    /* -- main review area */
    .main_review_area {padding: 6rem 0;}
    .review_card {border-radius: 1rem;}
    .review_card_img {border-top-left-radius: 1rem; border-top-right-radius: 1rem;}
    .review_card_content {padding: 2.4rem;}
    .review_content_text .title {margin-bottom: .8rem; font-size: 1.6rem;}
    .review_content_text .desc {font-size: 1.4rem;}
	
    .review_more_mobile {display: none;}
    .review_more_pc {display: block;}
	
    /* -- main point area */
    .main_point_area {padding: 6rem 0;}
    .keyword_box {padding: 4rem 2rem; border-radius: 1rem;}
    .keyword_content {max-width: 725px; margin: 0 auto; gap: 2.4rem 1.6rem;}
    .keyword {padding: 1.4rem 2.4rem; font-size: 1.8rem;}

    /* -- main cs area */
    .main_cs_area {margin-bottom: -8rem; padding: 8rem 0; padding-top: 0;}
    .main_cs_group {display: flex; gap: 2.4rem; flex-direction: row;}
    
    .notice_box {width: 50%;}
    .notice_box .title {margin-bottom: 2rem; padding-bottom: .8rem; font-size: 2.4rem;}
    .notice_box .title a {width: 2.4rem; height: 2.4rem;}
    .notice_content {font-size: 1.6rem;}
    .notice_content li {margin-top: 1.2rem;}
    .notice_content li + li {margin-top: 1.2rem;}
    .notice_content li a:first-child {font-size: 1.6rem;}
    .notice_content li .date {display: inline;}
	
    .call_cs_box {width: 35%; padding: 3.2rem; border-radius: 2rem;}
    .call_cs_content p {font-size: 1.4rem;}
    .call_cs_content .cs_desc {flex-direction: column; margin-bottom: 2rem;}
    .call_cs_content .cs_desc > * {font-size: 2.6rem;}
    .call_cs_content .cs_desc .title {font-size: 1.8rem;}
    
    .more_con_area {gap: 1.6rem; width: 50%;}
    .more_con_card {font-size: 2.4rem;}
    .more_con_card .inner {padding: 2.4rem;}
    .more_con_card .more_con_card_ico {flex-basis: 6rem; width: 6rem; min-width: 6rem; height: 6rem; margin-right: 2rem;}
    .more_con_card .more_con_card_ico img {width: 3.2rem;}
    .more_con_card span {flex: 0 0 auto;}
    .more_con_card .more_con_card_desc .head {line-height: 60px;}
    .more_con_card .more_con_card_desc .ref {font-size: 1.3rem;}

    /* -- main swiper area */
    .main_swiper_area {max-width: 960px; margin: 0 auto; padding: 0 2rem;}
    .main_swiper_area .swiper-slide {position: relative; margin:0; text-align: center; font-size: 20px;}
    .main_swiper_area .swiper-pagination-bullet {width: 1rem; height: 1rem; margin: 0 1rem;}
    .main_swiper_area .swiper-button-next, .main_swiper_area .swiper-button-prev {width: auto; height: 2.4rem;}
    .main_swiper_area .swiper-button-next:after, .main_swiper_area .swiper-button-prev:after {font-size: 2.4rem;}
    .main_swiper_area .swiper-button-prev, .main_swiper_area .swiper-rtl .swiper-button-next {left: 0;}
    .main_swiper_area .swiper-button-next, .main_swiper_area .swiper-rtl .swiper-button-prev {right: 0;}

    .main_product_list .swiper-container {padding-bottom: 0;}
    .main_product_list .main_swiper_area .swiper-slide {width: 50%; padding: 0 1.2rem; margin: 0; text-align: left;}
    .main_product_list .swiper-pagination {display: none;}

    .main_event_area .swiper-container {padding-bottom: 3.5rem; overflow: hidden;}
    .main_event_area .swiper-slide {width: 33.3333333333%; opacity: 1;}
    .main_event_area .swiper-pagination-bullet:only-child {display: inline-block !important; }
    
    .main_review_area .swiper-slide {width: 25%;}

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

    .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: 50px;}
    .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: 45px;}
    /* #docBottom .btn_group {padding: 1rem 0;}
    #docBottom .n_btn_lg {height: 6rem;}
    #docBottom a.n_btn_lg {line-height: 6rem;} */
    
    /* -- accordion style */
    .acc_wrap .acc_header {font-size: 1.6rem;}
    .acc_wrap .acc_header .acc_header_link::after {right: 2.4rem; width: 1.5rem; height: 1.5rem;}
    .acc_wrap .acc_header.active .acc_header_link::after {right: 2.4rem; width: 1.5rem; height: 1.5rem;}
    
    /* type2 */
	.acc_wrap.type2 .acc_header .acc_header_link {width: 1.5rem; height: 1.5rem;}

    /* -- board list */
    .board_list {margin-top: 2.4rem;}
    .board_list li {padding: 2rem 2.4rem;}
    .board_list li .title, .board_list li .title a {font-size: 1.8rem;}
    .board_list li .title.ico {padding-right: 2rem;}
    .board_list li .title.ico::after {width: 1.6rem; height: 1.6rem;}
    .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;}
    
    .board_list li.tb {flex-direction: row; align-items: center;}
    
    /* -- card list */
    .card_list_wrap {padding-top: 3.2rem;}
    .card_list_item {margin-bottom: 1.5rem; font-size: 1.6rem;}
    .card_link {padding: 2rem 2.4rem; font-size: 1.6rem;}
	.card_link .title {font-size: 1.8rem;}

	.service_desc .title {padding-right: 2rem;}
	.service_desc .price {font-size: 2rem;}
    
    /* -- thumb card */
    .thumb_list_item {width: 33.33333333%;}
    .thumb_card_link {padding: 0 1rem; margin-bottom: 3.2rem;}
	  .thumb_card_img {height: 200px; margin-bottom: 1.6rem; border-radius: 2rem;}
	  .thumb_card_desc {font-size: 1.6rem;}
	  .thumb_card_desc .title {margin-bottom: .5rem; font-size: 2rem;}
	
    /* -- tab */
    .tab_box_link {padding: 2rem 0; font-size: 1.6rem;}
    
    .tab_box_list_t2 {margin: 0 -5px;}
    .tab_box_list_t2 li {padding: 0 5px;}
    
    .tab_box_oval {margin-bottom: 4rem;}
    .tab_box_oval .tab_link {padding: 1rem 2rem; font-size: 1.8rem;}
    
    .sub_tab_link {padding: .8rem 2.4rem; font-size: 1.6rem;}
    
    .tab_login {margin-bottom: 4rem;}
    .tab_login_link {font-size: 1.8em;}
	
	  /* -- search */
	  .search_wrap {padding: 2rem 0;}
	
	  /* -- product layout */
    .card_list.phone_list .card_list_item {padding: 2.4rem 2rem; border-radius: 2rem;}
    .card_list.phone_list .img_wrap {width: 40%; min-width: 40%; max-height: 20rem;}
    .card_list.phone_list .content_group {margin-left: 2rem;}
    .card_list.phone_list .badge {font-size: 1.2rem;}
    .card_list.phone_list .title {font-size: 1.8rem;}
    .card_list.phone_list .price {margin-top: 0; font-size: 2.4rem;}
    .card_list.phone_list .detail {margin-bottom: 1rem; font-size: 1.4rem;}

    .product_select {padding-top: 4rem;}
    .product_select p {font-size: 1.6rem;}
    .product_select select {width: auto; height: auto; padding: .8rem 2.4rem .8rem .8rem;}

    .product_banner_area {padding-bottom: 5rem;}
    .product_banner_area .thumb_card_img {max-height: 380px; border-radius: 2rem;}
    .product_banner_area .swiper-pagination-bullet {width: .8rem; height: .8rem;}

    .product_search_acc .acc_item {padding: 2.4rem; border-radius: 1rem;}
    .product_search_acc .acc_header .acc_header_link {font-size: 2rem;}
    .product_search_acc .acc_header .acc_header_link::after { width: 2rem; height: 2rem;}
    .product_search_acc .acc_header.active .acc_header_link::after { width: 2rem; height: 2rem;}
    .product_search_acc .acc_content {margin-top: 3.2rem;}
    .items_search {padding: 0 2rem;}
    .items_search .items {flex-direction: row; align-items: center; gap: .5rem; padding-bottom: 2rem; margin-bottom: 2rem;}
    .items_search .items .title {min-width: 12rem; font-size: 1.6rem;}
    .items_search .items .input_group {margin-top: 0;}
    .items_search .btn_wrap { padding-top: 1rem;}
    
    .product_title_desc {font-size: 1.4rem; margin-top: 1rem;}
    .product_title .badge {font-size: 1.5rem;}
    .product_info_wrap {display: flex; flex-direction: row; margin-bottom: 6rem;}
    .product_img {width: 50%;}
    .product_detail {flex: 1 1 auto; padding-left: 4rem;}
	
	  .product_photo_thumbs {display: block;}
    .product_photo .swiper-slide {height: 35rem;}
    .product_photo .swiper-slide img {width: 100%;}
	
    .product_color_select {gap: 0 1rem;}
    .product_color_select li {width: 4rem; height: 4rem;}
    .product_color_select input[type="radio"] + label {width: 3rem; height: 3rem;}
    .product_color_select input[type="radio"]:checked + label::before {width: 4rem; height: 4rem;}
	
	  .product_rate_select {margin-bottom: 6rem;}
    .rate_select_box {padding: 2rem 2.4rem; border-radius: 1rem;}
    .rate_select_box .title {font-size: 1.6rem; -webkit-line-clamp: 1;}
    .rate_select_box .desc {font-size: 1.4rem;}
    .rate_select_box .price {font-size: 1.8rem;}

    /* -- rate layout */
    .rate_list_wrap {padding-top: 3.2rem;}
    .product_select + .rate_list_wrap {padding-top: 1.6rem;}
    
    .card_list.rate_list .content_group {flex-direction: row; margin-top: 1rem;}
    /* align-items: center */
    .card_list.rate_list .detail {flex: 1; font-size: 1.5rem;}
    .card_rate_link {padding: 2rem 2.4rem;}
    .card_rate_link .desc {margin-top: .5rem;}
    .card_list.rate_list .desc li {padding-right: 2.4rem;}
    .card_list.rate_list .desc li:first-child {font-size: 2rem;}
    .card_list.rate_list .desc li:not(:first-child,:last-child)::after { margin: 0 1rem;}
    .card_list.rate_list .price {margin-top: 0; font-size: 2.6rem;}
    .card_list.rate_list .price .ref {font-size: 1.6rem;}
    
    .rate_info_wrap {margin-bottom: 3.6rem;}
    .rate_info .header_sub .badge {font-size: 1.5rem;}
    .rate_info .telco {font-size: 1.5rem;}
    .rate_info .header {margin-bottom: 2.4rem; font-size: 3rem; }
    .rate_info .content {flex-direction: row; justify-content: space-between; align-items: baseline; padding: 3.6rem 4.8rem; border-radius: 2rem; }
    .rate_info .content .detail {margin-bottom: 0; font-size: 1.6rem; border-bottom: 0;}
    .rate_info .detail .desc {display: flex; flex-direction: row; flex-wrap: wrap;}
    .rate_info .detail .desc li {flex-direction: row; margin-bottom: 1rem; padding-right: 2rem;}
    .rate_info .detail .desc li:first-child {margin-bottom: 1.2rem; font-size: 2.4rem;}
    .rate_info .detail .desc .icon {width: 1.8rem; height: 1.8rem; margin-right: 1rem; margin-bottom: 0;}
    .rate_info .detail .ref {font-size: 1.4rem;}
    .rate_info .price p {font-size: 2.8rem;}
    .rate_info .price .vat {font-size: 1.8rem; font-weight: 400;}
    .rate_info .price .ref {font-size: 1.6rem;}
    
    .rate_caption {padding: 2rem 3.6rem; margin-top: 2rem;}
    .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 {padding-top: 2rem;}
    .rate_detail_depth {margin-bottom: 4rem;}
    .rate_detail_depth .title {margin-bottom: 1rem; font-size: 1.8rem;}
    .rate_detail_depth .desc {padding-left: 2rem; font-size: 1.5rem;}
    .rate_detail_depth .desc_list {padding-left: 3rem; font-size: 1.5rem;}
    .rate_detail_depth .desc_list li {margin-bottom: 1rem;}
    .rate_detail_depth .desc_list_depth {padding: 1rem 0 0 2rem; font-size: 1.3rem;}
	
    /* -- event */
    .event_board {font-size: 1.6rem;}
    .event_board .board_head {padding: 3rem 2rem;}
    .event_board .board_head .title {font-size: 2rem;}
    .event_board .board_content {padding: 3rem 2rem;}
    /* .thumb_card_img.event {height: calc(100vw - 750px); max-height: 240px;} */
    
    /* -- review */
    .review_list_item {padding: 2.4rem 2rem; margin-bottom: 1.5rem;}
    .review_list_header {flex-direction: row; justify-content: space-between; gap: 4rem; margin-bottom: 1rem;}
    .review_list_header .title {font-size: 1.6rem;}
    .review_list_header .review_info {flex-shrink: 0; gap: 1.5rem; font-size: 1.3rem;}
    .review_list_header .grade {gap: 0 .6rem;}
    .review_list_header .grade_icon {width: 1.3rem; height: 1.3rem;}
    .review_list_content {display: flex; flex-direction: row-reverse; gap: 2rem;}
    .review_list_content .desc {width: 100%; margin-bottom: 0; font-size: 1.5rem;}
    .review_list_content .img_wrap {width: 25%;}
	
    .grade_btn_wrap {gap: 0 .6rem;}
    .grade_btn_wrap .grade_btn {width: 3.2rem; height: 3.2rem;}
    
    /* -- qna */
    .qna_tab_wrap {padding-top: 5.6rem;}
	  .qna_tab {display: flex;}
    .qna_tab_item {margin-right: 1rem;}
    .qna_tab_link {padding: 1rem 2.4rem; font-size: 1.6rem;}
    
    .qna_acc_wrap {margin-top: 2.4rem;}
    .qna_acc_wrap .acc_header {font-size: 1.6rem;}
    .qna_acc_wrap .acc_header_link {padding: 2.4rem; padding-right: 5.6rem;}
    .qna_acc_wrap .acc_header .acc_header_link::after {background: url(../image/chevron-down.svg) no-repeat center/100%; content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 2.4rem; display: inline-block; width: 1.5rem; height: 1.5rem;}
    .qna_acc_wrap .acc_header.active .acc_header_link::after {background: url(../image/chevron-up.svg) no-repeat center/100%; content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 2.4rem; display: inline-block; width: 1.5rem; height: 1.5rem;}
    .qna_acc_wrap .acc_content {padding: 2.4rem;}
    .qna_acc_wrap .acc_content_inner {font-size: 1.6rem;}
    
	  .qna_acc_wrap .q_mark {flex-basis: 3rem; width: 3rem; height: 3rem; line-height: 3rem; margin-right: 1.6rem;}

    /* 부가서비스 항목*/
	  .qna_acc_wrap .addType {width:6rem; line-height: 2; margin-right: .8rem; font-size: 1.3rem;}
	
    /* -- notice */
    .notice_wrap {padding-top: 5.6rem;}
    .notice_list_item {flex-direction: row; align-items: center; padding: 2rem 2.4rem; font-size: 1.6rem;}
    .notice_list_item .title {margin-bottom: 0; padding-right: 2rem; flex: 1;}
    .notice_list_item .date, .notice_list_item .event_date {font-size: 1.4rem;}
    .notice_list_item .no {display: block; padding-right: 2rem; color: var(--n-gray-600);}
    .notice_list_item .event_date {flex-direction: row; gap: 1.6rem;}
    
    .notice_board {font-size: 1.6rem;}
    .notice_board .board_head {padding: 3rem 2.4rem;}
    .notice_board .board_head .title {font-size: 2rem;}
    .board_head .date {font-size: 1.4rem;}
    .notice_board .board_content { padding: 3rem 2.4rem 6rem 2.4rem;}
    .board_page .page_item {padding: 1.6rem 2.4rem;}
    .board_page .page_link {padding-left: 1.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;}
    
    /* .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: 3.2rem;}
    .agree_box {font-size: 1.5rem;}
    .agree_box .inner {padding: 2.4rem;}
    .agree_check {margin-top: 1rem;}
	
    /* -- pagination */
    .pagination {margin-top: 3.6rem;}
    .page_icon {width: 1.6rem; height: 1.6rem;}
    .page_prev {margin: 0 1rem;}
    .page_next {margin: 0 1rem;}
    .page_link {width: 2.8rem; height: 2.8rem; line-height: 2.8rem; margin: 0 .5rem; font-size: 1.6rem;}
	
    /* -- contact */
	  .company_img_wrap {height: 25rem; margin-top: -50px;}

    /* -- prepaid */
    .charge_wrap .guide_area {font-size: 1.6rem;}
    .charge_wrap .guide_area .guide_cardlist > * {margin-bottom: 2.4rem;}

    /* -- mypage */
    .my_info.joinInfo .header {padding-top: 2rem;}
    .my_info.joinInfo .header_top {flex-direction: row; align-items: center; margin-bottom: 2rem; font-size: 2rem;}
    .my_info.joinInfo .header_top .name {font-size: 2.4rem; color: var(--n-gray-900);}
    .my_info.joinInfo .header_top .apply_no {display: block; padding-top: 0; margin-top: 0; border-top: 0;}
    .my_info.joinInfo .header_bottom {font-size: 1.6rem;}
    .my_info.joinInfo .header_bottom ul {flex-direction: row;}
    .my_info.joinInfo .header_bottom ul li {display: list-item; width: 33.33333%; padding: 2.4rem; text-align: center; border-right: 1px solid #e9e9e9;}
    .my_info.joinInfo .header_bottom ul li + li {border-top: 0;}
    /* .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; border-radius: 2rem;} 
    
    .my_info.joinInfo .content_box {padding: 0 1.2rem; margin-bottom: 4.8rem;}
    .my_info.joinInfo .content_box .title_wrap {margin-bottom: 1.5rem;}
    .my_info.joinInfo .content_box .title_wrap h2 {margin-bottom: 0;}
    .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 li.btn_wrap {margin-top: auto; padding-top: 2rem;}
    .my_info.joinInfo .content_box ul .title, .my_info.joinInfo .content_box ul .text {font-size: 1.5rem;} 
    .my_info.joinInfo .content_box ul .rateplan {font-size: 1.6rem;}
    
    .my_info.joinInfo .content_box ul .btn_group .btn {min-height: 4rem; font-size: 1.4rem;}
    
    .my_info.joinInfo .content_box .box_guide .text {padding: 0; margin: 0;}
    
    /* .my_info.joinInfo .content_box .amount_info {font-size: 1.5rem; padding: 2rem;}
    .my_info.joinInfo .content_box .amount_info .acc {font-size: 2rem;}
    .my_info.joinInfo .content_box .amount_info .ref {font-size: 1.3rem;} */
    
    .my_info.joinInfo .charge_area {flex-direction: row;}
    .my_info.joinInfo .charge_area .total_info {height: 100%; padding-bottom: 0; margin-bottom: 0; padding-right: 1.2rem; margin-right: 1.2rem; border-bottom: 0; border-right: 1px solid #e6e6e6; font-size: 1.8rem;}
    .my_info.joinInfo .charge_area .total_info .amount {font-size: 3.2rem;}
    .my_info.joinInfo .charge_area .total_info .period {margin-top: 1rem; font-size: 1.4rem;}
    .my_info.joinInfo .charge_area .charge_info {margin-top: 0;}
    
    
    /***
      F. Self
    ***/
    .self_wrap .modal-body .form_wrap {padding: 0;}
    .self_wrap .form_wrap h2 {margin-bottom: 1.6rem; font-size: 2rem;}
    .self_wrap .order_list .title {max-width: 180px;}

    .self_form_inner {padding: 0 2rem;}

    .self_wrap .form_group .n_form_label.w_auto {width: auto;}
    #esimPop .form_group input {width: 100%;}
    
    #areaTerms {padding: 1rem 2rem !important;}
    .form_group#areaTerms > div {padding: 1.6rem;}
    #hopeNumList {margin: 2rem 0;}
    
    #inisisAuth .acc_group {padding: 1rem 1.6rem;}
	#inisisAuth .step_item .title {font-size: 1.4rem;}
	#inisisAuth .step_item .img_wrap img {width: 3rem; height: 3rem;}
    
    /* -- self copyright */
    .self_copy_wrap {padding: 3rem 0 5rem 0;}
    .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.5rem; font-size: 1.6rem;}
    
    .step1-activeInfo button {font-size: 1.6rem;}
    
    .form_wrap .step1-usimInfo .advice_item {align-items: normal;}
    .form_wrap .step1-usimInfo .advice_item .img_wrap {flex-basis: 10rem; min-width: 10rem; height: 10rem;}
    .form_wrap .step1-usimInfo .advice_item .img_wrap img {width: auto; height: 6rem;}
    
    /* .step1-usimInfo .advice_item {flex-direction: row;} */
    .step1-usimInfo .advice_item .img_wrap {flex-basis: 16rem; min-width: 16rem; height: 16rem;}
    .step1-usimInfo .advice_item .img_wrap img {width: auto; height: 10rem;}
    .step1-usimInfo .advice_item .flex_row {margin: 0 -.4rem;}
    .step1-usimInfo .advice_item .flex_row > * {padding: 0 .4rem;}
    .step1-usimInfo .advice_item .box_outline {padding: 1.2rem;}

    /* -- price select */
    .price_filter {top: 8.1rem; padding: 2rem 0; border-bottom-width: 4rem;}
    .price_filter .swiper {padding: 0 5rem;}
    .price_filter button, .price_filter_popup button {padding: 1rem 2rem; font-size: 1.8rem;}
    
    .self_wrap .price_sticky_wrap {top: 10rem;}
    .body_wrap_agent.self_wrap .price_sticky_wrap {top: 0;}
    .self_wrap .price_sticky_wrap .sub_header {top: 0; padding-bottom: 1rem; margin-bottom: 0;}

    .card_price_list label {padding: 2rem 2.4rem; font-size: 1.6rem;}
	  .card_price_list .content_group {flex-direction: row; align-items: center; margin-top: 1rem;}
	  .card_price_list .detail {flex: 1; font-size: 1.5rem;}
    .card_price_list .head {margin-bottom: 0; font-size: 1.6rem;}
    .card_price_list .text li {padding-right: 1.2rem; margin-right: 1rem;}
    .card_price_list .text li:first-child {font-size: 2rem;}
    .card_price_list .text li:not(:first-child, :last-child)::after {height: 12px;}
    .card_price_list .price {margin-top: 0; font-size: 2.6rem;}
    .card_price_list .price .ref {font-size: 1.6rem;}

    /* -- order list */
    .order_list_wrap h1 {margin-bottom: 5.6rem;}
    .order_list_wrap h2 {margin-bottom: 1.5rem;}
    .order_list_wrap .order_list {padding: 2.4rem 0; border-radius: 2rem;}
    .order_list_wrap .order_list li {padding: 0 2.4rem}
    .order_list_wrap .order_list li + li {margin-top: 2rem; padding-top: 2rem; border-top: 1px solid #e6e6e6;}
    
    .order_list li + li {margin-top: 2rem;}
    .order_list .title {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;}

    /* 접수내역 리스트 */
    .notice_list_item.order_item .title {font-size: 1.8rem;}
    .notice_list_item.order_item .title_status {font-size: 1.4rem;}
    .notice_list_item.order_item .text {font-size: 1.4rem;}
    .notice_list_item.order_item .inner_flex {flex-direction: row;}
    .notice_list_item.order_item .btn_group {margin-top: 0;}
    .notice_list_item.order_item .btn_group > * {width: auto; max-width: 120px; min-width: 100px; height: 3.5rem; line-height: 3.5rem; }

    /* -- applyComplArea */
    .applyComplArea .img_wrap {margin-bottom: 1.6rem;}	
    .applyComplArea .img_wrap img {width: 12rem;}
    .applyComplArea h2 {margin-bottom: 2rem; font-size: 2.2rem;}
    

    /***
      G. Components
    ***/

    /* -- form */
    .form_wrap + .form_wrap {margin-top: 6.4rem;}
    .form_group {margin-bottom: 2.4rem;}
    .input_group input[type="email"] {padding-right: 8rem;}
    
    .form_notice {margin-top: 1.5rem; font-size: 1.4rem;}

    .n_form_label {font-size: 1.6rem;}
    .n_check_label {font-size: 1.6rem;}

    /* -- list */
    .list_dot li + li {margin-top: 1rem;}
    
    .select_list li {font-size: 1.4rem;}
    .select_list li a {font-size: 1.3rem;}
	.select_list li a .img_wrap {width: 6rem; height: 6rem;}
	.select_list li a span {margin-top: .8rem;}

    /* -- table */
    .table_board {font-size: 1.6rem;}
    .table_board tr {grid-template-columns: 240px 1fr; padding-bottom: 0;}
    .table_board th {display: flex; align-items: center; height: 100%; padding: 2rem; background-color: #f9f9f9;}
    .table_board td { padding: 2rem 1.6rem;}

    /* -- box */
    .box {border-radius: 2rem;}
    
    .box_title {font-size: 1.6rem;}
    
    .box_outline {padding: 2.4rem;}
    .box_outline_title {padding-top: 1rem; font-size: 1.6rem;}
    .box_outline_text {padding-top: 1rem; font-size: 1.4rem;}
    .box_outline_icon img {width: 6rem;}
    
    .box_form {max-width: 480px; margin: 0 auto;}
    .box_form .title {padding-bottom: 1.6rem; font-size: 1.4rem; font-weight: 700; color: var(--n-primary);}
    .box_guide + .form_wrap {margin-top: 3.2rem;}
    .box_form .btn_group {background-color: transparent;}

    .self_wrap .box_form .form_group + .form_group {margin-top: 0;}
  
    .box_cardlist .inner {padding: 0 5rem; padding-bottom: 15rem;}

    .box_list {padding: 1.4rem 2.4rem; background-color: var(--n-gray-100);}
    .box_list .form-check {padding: 1rem 1.5rem;}

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

    .box_green {padding: 2.4rem;}
    .box_green .title {font-size: 1.8rem;}
    
    .box_light {padding: 2.4rem;}
    .box_light_title {padding-top: 1rem; font-size: 1.6rem;}
    .box_light_text {padding-top: 1rem; font-size: 1.4rem;}
    .box_light_icon {width: 10rem; height: 10rem;}
    .box_light_icon img {width: 6rem;}

    /* -- button */
    .btn_wrap {margin-top: 6rem;}
    .btn_group {padding: 2rem 0;}
    .n_btn_lg {height: 7rem;}
    a.n_btn_lg {line-height: 7rem;}
    .n_btn_m {height: 6.4rem;}
    a.n_btn_m {line-height: 6.4rem;}
    .n_btn_s {height: 5rem;}
    a.n_btn_s {line-height: 5rem;}
    .n_btn_xs {height: 4.5rem;}
    a.n_btn_xs {line-height: 4.5rem;}
    .n_btn_auto {font-size: 1.4rem; height: 3.5rem;}
    a.n_btn_auto {line-height: 3.5rem;}
    .n_btn_lg.w340 {max-width: 340px;}f
    .n_btn_lg.w260 {max-width: 260px;}
    .btn_underline {font-size: 1.5rem;}
    .btn_text_primary {right: 16px; font-size: 1.6rem;}
    .btn_kakao {padding: 1.6rem 2.4rem; font-size: 1.6rem;}
    
    .btn_down {height: 3.5rem; font-size: 1.6rem;}
	a.btn_down {line-height: 3.5rem;}

    .btn_link_ico {font-size: 1.6rem;}
	  .btn_link_ico::after {width: 1.4rem; height: 1.4rem;}

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

    .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;}

    .modal_board .board_content {padding-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-title {font-size: 2.2rem;}
    .modal_text li {font-size: 1.6rem;}

    /* -- text */
    h1 {font-size: 3rem;}
    h2 {font-size: 2rem; 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.5rem;}
    .text_sm_size {font-size: 1.3rem;}
    .text_info {font-size: 1.5rem;}

    /* -- 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(../image/chevron-right.svg) center/100% no-repeat;}
    .step_item .img_wrap img {width: 4rem; height: 4rem;}
    .step_item .title {font-size: 1.6rem;}
    
    /* -- advice */
    .advice {gap: 4rem;}
    .advice_item {align-items: center; gap: 2.4rem; font-size: 1.6rem;}
    .advice_item .img_wrap {flex-basis: 6rem; min-width: 6rem; height: 6rem;}
    .advice_item .img_wrap img {width: 6rem; height: 6rem;}
    .advice_item .title {font-size: 1.6rem;}
    .advice_item .desc {margin-top: .5rem;}

    /* -- swiper */
    .filter input[type="text"], .filter input[type="date"], .filter select.form-select {height: auto; padding: .5rem .8rem; font-size: 1.4rem;}
    
    .byte_check {font-size: 1.4rem;}
    
    /* -- google translate custom */
    #langSelect {right: 2rem; top: 1.6rem; transform: unset; height: auto; padding: 0 2rem 0 0; border: 0; border-radius: 0; background: url(../image/caret-down-fill.svg) no-repeat right center/1rem; color: var(--n-gray-600); filter: invert(46%) sepia(5%) saturate(107%) hue-rotate(22deg) brightness(94%) contrast(84%);}
	#google_translate_element {right: 2rem; top: 1.6rem; transform: unset; height: auto !important;}
	#google_translate_element > div > div {border: 0; border-radius: 0;}
	#google_translate_element > div > div:after {background: url(../image/caret-down-fill.svg) no-repeat center/100%; filter: invert(46%) sepia(5%) saturate(107%) hue-rotate(22deg) brightness(94%) contrast(84%);}
	#google_translate_element > div > div > span {line-height: normal;}
	#google_translate_element > div > div > span > a {padding: 0 2.4rem 0 0; color: var(--n-gray-600);}
    
}

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

    /***
      B. Layout
    ***/
    /* -- container*/
    .container {
        max-width: 1180px;
    }
    
    /***
      D. Main
    ***/
    /* -- main swiper area */
    .main_swiper_area {max-width: 1080px;}
    .main_swiper_area .swiper-button-next, .main_swiper_area .swiper-button-prev {width: auto; height: 3rem;}
	  .main_swiper_area .swiper-button-next:after, .main_swiper_area .swiper-button-prev:after {font-size: 3rem;}

	  /* -- main evnet area */
    /* .main_event_area .thumb_card_img.event {max-height: 250px;} */
    

    /***
      E. Sub
    ***/
    /* -- event */
    /* .thumb_card_img.event {height: calc(100vw - 950px); max-height: 280px;} */
}

@media screen and (min-width: 1440px) {
  /*-------------------------------------------
    -- xLarge desktop (1440px~)
  -------------------------------------------*/
  /***
    B. Layout
  ***/
  /* -- container*/
	.container {
		max-width: 1280px;
	}
	
  /* -- footer */
	.company_info {
    	width: 50%;
    }
	

  /***
    D. Main
  ***/
  /* -- main swiper area */
	.main_swiper_area {
		max-width: 1200px;
		padding: 0;
	}
}


/***********************************************************************************************************************
  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: 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-top: 2rem; padding-bottom: 2rem;} */
	.body_wrap_popup, .body_wrap_popup_t2 {padding: 0;}
	
	.container {max-width: unset; padding: 0;}
	
	.doc_wrap {
		width: 210mm;
		min-height: 297mm;
		padding: 20mm;
		/* margin: 10mm auto; */
		
	}
	.doc_head {padding-top: 0;}
	.doc_head_logo {height: 30px; top: 40px; right: 20mm;}
	.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: 20mm;} */
	#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;}
	
	
	  
}
