:root {
  /* bg color */
  --color-main: #5e68ff;
  --color-lightpurple: #dfe1ff;
  --color-lightgray: #f1f3f6;
  --color-darkgray: #49494a;
  --color-disabled: #b4b5ca;
  --color-navy: #323f4e;

  /* text color */
  --text-main: #303038;
  --text-sub1: #686868;
  --text-sub2: #a5a5a5;

  /* font-weight */
  --font-light: 300;
  --font-regular: 400;
  --font-medium: 500;
  --font-semibold: 600;
  --font-bold: 700;

  /* shadow */
  --shadow-lightgray: 0 3px 10px 0 rgba(0, 0, 0, 0.15);

  /* line */
  --line-lightgray: #ebebeb;
}

body {
  background: #eee;
}
.page_wrap {
  max-width: 500px;
  min-height: 100vh;
  background: #fff;
  margin: 0 auto;
}
.page_bg_wrap {
  min-height: 100vh;
}

/***********************************/

/* 스크롤바 스타일 */
.scrollable-content {
  overflow-y: auto;
  max-height: 80vh;
  min-height: 120px;
}
.scrollable-content::-webkit-scrollbar {
  width: 10px; /* 스크롤바 너비 */
}
.scrollable-content::-webkit-scrollbar-thumb {
  background-color: var(--color-main); /* 스크롤바 색상 */
  border-radius: 5px; /* 둥근 모서리 */
}
.scrollable-content::-webkit-scrollbar-track {
  background: #f1f1f1; /* 스크롤바 배경 색상 */
}

/* 버튼 스타일 */
.button-h36,
a.button-h36 {
  display: inline-block;
  padding: 0 5px;
  height: 36px;
  line-height: 36px;
  border-radius: 12px;
  font-size: 16px;
  color: #fff;
  font-weight: var(--font-semibold);
  text-align: center;
}
.button-h40,
a.button-h40 {
  display: inline-block;
  padding: 0 5px;
  height: 40px;
  line-height: 40px;
  border-radius: 12px;
  font-size: 14px;
  color: #fff;
  font-weight: var(--font-medium);
  text-align: center;
}
.button-h48,
a.button-h48 {
  display: inline-block;
  padding: 0 5px;
  height: 48px;
  line-height: 48px;
  border-radius: 18px;
  font-size: 16px;
  color: #fff;
  font-weight: var(--font-semibold);
  text-align: center;
}
.button-h48.full {
  width: 100%;
  border-radius: 12px;
}
.button-h52,
a.button-h52 {
  display: inline-block;
  padding: 0 5px;
  height: 52px;
  line-height: 52px;
  border-radius: 12px;
  font-size: 16px;
  color: #fff;
  font-weight: var(--font-semibold);
  text-align: center;
}
.button-h52.full {
  width: 100%;
  border-radius: 12px;
}
.full {
  width: 100%;
}
.half {
  width: 50%;
}
.color_disabled {
  background: var(--color-disabled);
}
.color_navy {
  background: var(--color-navy);
}
.color_main {
  background: var(--color-main);
}
.color_lightgray {
  background: var(--color-lightgray);
}
.color_lightpurple {
  background: var(--color-lightpurple);
}
.text_point {
  color: var(--color-main);
}

/* input 스타일 */
div[data-role='input'] {
  position: relative;
  display: flex;
  align-items: center;
  /* padding: 0 8px; */
}

div[data-role='input'] input {
  flex: 1;
  min-width: 0;
  height: 48px;
  padding: 0 10px 0 20px;
  background: var(--color-lightgray);
  border-radius: 24px;
  font-size: 16px;
  color: var(--text-main);
  font-weight: var(--font-medium);
}
div[data-role='input'] input::placeholder {
  color: var(--text-sub2);
}
div[data-role='input'] textarea {
  width: 100%;
  height: auto;
  min-height: 100px;
  padding: 16px 20px;
  background: var(--color-lightgray);
  border-radius: 24px;
  font-size: 16px;
  color: var(--text-main);
  font-weight: var(--font-medium);
}
div[data-role='input'] textarea::placeholder {
  color: var(--text-sub2);
}
/* 한줄에 여러개 조합인 경우 */
div[data-role='inputset'] {
  display: flex;
  width: 100%;
  align-items: center;
}
div[data-role='inputset'].half > * {
  width: 50%;
}
div[data-role='inputset'] > div[data-role='input'] {
  flex: 1;
  min-width: 0;
}
div[data-role='inputset']
  div[data-role='input']
  + button[data-role='input_button'] {
  height: 48px;
  padding: 0 18px;
  margin-left: 12px;
  line-height: 48px;
  border-radius: 18px;
  font-weight: var(--font-medium);
}
div[data-role='inputset']
  div[data-role='input']
  + button[data-role='input_button'].default {
  background: var(--color-main);
  color: #fff;
}
div[data-role='inputset']
  div[data-role='input']
  + button[data-role='input_button'].disabled,
button:disabled {
  background: var(--color-disabled);
}
input[type='checkbox'] + label {
  position: relative;
  display: inline-block;
  padding-left: 27px;
  vertical-align: middle;
  font-size: 12px;
  color: var(--text-sub1);
  font-weight: var(--font-regular);
  line-height: 1.3;
  cursor: pointer;
}
/* 다중 선택형 체크박스 */
[data-role='checkbox_select'] input[type='checkbox'] + label {
  font-size: 16px;
  color: var(--text-main);
  font-weight: var(--font-medium);
}
input[type='checkbox'] + label .text_point {
  color: var(--color-main);
  text-decoration: underline;
}
input[type='checkbox'] + label::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  vertical-align: middle;
  width: 20px;
  height: 20px;
  margin-right: 7px;
  border-radius: 50%;
  border: 1px solid var(--line-lightgray);
}
input[type='checkbox']:checked + label:before {
  background: var(--color-main) url('../../assets/images/ico_check.png')
    no-repeat center;
  background-size: 12px auto;
  border-color: var(--color-main);
}
.input_help {
  padding: 5px 0;
  font-size: 12px;
  color: var(--color-main);
  font-weight: var(--font-medium);
  line-height: 1.3;
}
/* select 스타일 */
div[data-role='input'][data-type='select'] {
  position: relative;
  background: transparent;
}
div[data-role='input'][data-type='select']:after {
  content: '';
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  background: url('../../assets/images/ico_down.png') no-repeat center;
  background-size: 12px auto;
}
div[data-role='input'][data-type='select'] select {
  width: 100%;
  height: 48px;
  padding: 0 20px;
  background: var(--color-lightgray);
  border-radius: 24px;
  font-size: 16px;
  color: var(--text-main);
  font-weight: var(--font-medium);
  text-align: left;
  appearance: none;
}
/* 셀렉박스 커스텀 스타일 */
/* div[data-role=input][data-type=select] select {
  display: none;
  appearance: none;
}
[data-role=selectbox] {
  position: relative;
  width:100%;
}
[data-role=selectbox] button.select {
  position: relative;
  width: 100%;
  height: 48px;
  padding: 0 20px;
  background: var(--color-lightgray);
  border-radius:24px;
  font-size: 16px;
  color:var(--text-main);
  font-weight: var(--font-medium);
  text-align: left;
}
[data-role=selectbox] button.select:after {
  content:'';
  position: absolute;
  top:50%;
  right:12px;
  transform:translateY(-50%);
  width: 24px;
  height: 24px;
  background: url('../../assets/images/ico_down.png') no-repeat center;
  background-size:12px auto;
}
[data-role=selectbox] button.select + ul {
  position: absolute;
  left: 0;
  top:100%;
  width:100%;
  min-height:48px;
  border-radius:24px;
  border:1px solid var(--color-lightgray);
  background: #fff;
  z-index:1;
}
div[data-role=input][data-type=select] ul > li {
  height: 48px;
  padding: 0 20px;
  border-radius: 24px;
  line-height:48px;
}
div[data-role=input][data-type=select] ul > li:hover {
  background: var(--color-lightgray);
} */

/* 탭 스타일 */
[data-role='tab'].detault {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  padding-bottom: 12px;
}
[data-role='tab'].detault .tab_item {
}
[data-role='tab'].detault .tab_item.selected .tab_name {
  color: var(--color-main);
}
[data-role='tab'].detault .tab_item .tab_name {
  display: inline-block;
  font-size: 18px;
  color: var(--text-sub2);
  font-weight: var(--font-semibold);
}

/* 점 텍스트 스타일 */
.dot_text {
  position: relative;
  padding: 3px 0;
  padding-left: 18px;
  font-size: 14px;
  color: var(--text-sub1);
  font-weight: var(--font-medium);
  line-height: 1.4;
  word-break: keep-all;
}
.dot_text:before {
  content: '';
  position: absolute;
  left: 6px;
  top: 10px;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: var(--text-sub1);
}
.dot_text .bold {
  color: var(--text-main);
}

/* 서브페이지 공통 여백 */
.subpage_wrap {
  padding: 8px 16px;
}
.subpage_wrap.v8 {
  padding-top: 8px;
  padding-bottom: 8px;
}
/**********************************/

/* main  header*/
.main_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 56px;
  padding: 8px 16px;
}

.main_header .logo {
  width: 164px;
  height: 40px;
}

.main_header .logo > a {
  display: block;
  width: 100%;
  height: 100%;
  background: url('../../assets/images/logo.png') no-repeat center;
  background-size: contain;
}

.main_guide {
  height: 40px;
  line-height: 40px;
  padding: 0 12px 0 36px;
  background: var(--color-main) url('../../assets/images/ico_book.png') left
    12px center no-repeat;
  background-size: 20px auto;
  border-radius: 20px;
  font-size: 15px;
  color: #fff;
  font-weight: bold;
}

/* 섹션 하단 회색영역 */
.section_bottom_border {
  border-bottom: 12px solid var(--color-lightgray);
}

/* 광고영역 */
.main_section_slide {
  height: 100px;
  background: #eee;
}
.main_section_slide .main_ad_slide,
.main_section_slide .slide_wrap,
.main_section_slide .slide_item {
  height: 100%;
}
.main_section_slide img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* 나라 리스트 영역 */
.main_section_nation_list .search_wrap {
  padding: 26px 16px 20px;
}
.main_section_nation_list .search_wrap .search,
.main_section_nation_list .search_wrap .search input {
  cursor: pointer;
}

/* input 스타일 - 메인 검색 영역 버튼 추가 */
div[data-role='input'].input_search {
  background: var(--color-lightgray);
  border-radius: 24px;
}
div[data-role='input'].input_search input + button {
  width: 32px;
  height: 32px;
  margin-right: 8px;
  /* margin: 0 12px 0 5px; */
  border-radius: 50%;
  background: var(--color-main) url('../../assets/images/ico_search.png')
    no-repeat center;
  background-size: 16px auto;
}

/* main_section_nation_list */
.nation_list_wrap {
  display: flex;
  flex-wrap: wrap;
  text-align: center;
}
.nation_list_wrap .item_wrap {
  width: 25%;
  margin-bottom: 28px;
}
.nation_list_wrap .item_wrap .item {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  color: var(--text-main);
  font-weight: var(--font-medium);
}

.nation_list_wrap .item_wrap .item .nation_flag {
  display: block;
  width: 48px;
  height: 48px;
  margin: 0 auto;
  background: url('../../assets/images/nation_usa.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.nation_list_wrap .item_wrap .item .nation_name {
  display: block;
  margin-top: 8px;
  font-weight: var(--font-medium);
}
.nation_list_wrap .item_wrap .item.more .nation_flag {
  background-image: url('../../assets/images/nation_more.png');
}

/* 메인 타이틀 공통 */
.main_section_title {
  display: block;
  margin-bottom: 16px;
  font-size: 20px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}

/* main_section_esim_howto */
.main_section_esim_howto {
  padding: 20px 16px;
}
.main_section_esim_howto .esim_howto_wrap {
  display: flex;
  gap: 12px;
}
.esim_howto_wrap .esim_howto_item {
  position: relative;
  display: block;
  flex: 1;
  height: 200px;
  padding: 18px 20px;
  border-radius: 20px;
  background-size: 100% auto;
}
.esim_howto_wrap .esim_howto_item.guide {
  background-color: #2b323a;
  background-image: url('../../assets/images/img_method1_bg_left.png'),
    url('../../assets/images/img_method1_bg_right.png');
  background-repeat: no-repeat, no-repeat;
  background-position: left top, right top;
  background-size: auto 100%, auto 100%;
}
.esim_howto_wrap .esim_howto_item.shopping {
  display: flex;
  justify-content: center;
  align-items: end;
  background: var(--color-main) url('../../assets/images/img_method2.png')
    center top 20px no-repeat;
  background-size: 148px auto;
}
.esim_howto_wrap .esim_howto_item.shopping:before {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: calc(100% - 6px);
  height: calc(100% - 6px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 20px;
}
.esim_howto_wrap .esim_howto_item.guide:after {
  content: '';
  position: absolute;
  right: 29px;
  bottom: 20px;
  width: 56px;
  height: 65px;
  background: url('../../assets/images/img_method1_search.png') no-repeat center;
  background-size: contain;
}
.esim_howto_wrap .esim_howto_item.guide > em {
  position: relative;
  display: block;
  margin-bottom: 8px;
  font-weight: var(--font-medium);
  color: rgba(255, 255, 255, 0.5);
}
.esim_howto_wrap .esim_howto_item.guide > em:after {
  content: '';
  position: absolute;
  left: 45px;
  top: 50%;
  transform: translateY(-50%);
  width: calc(100% - 50px);
  height: 1px;
  background: rgba(255, 255, 255, 0.4);
}
.esim_howto_wrap .esim_howto_item .text {
  font-size: 18px;
  color: #fff;
  font-weight: var(--font-semibold);
  line-height: 1.4;
  word-break: keep-all;
}
.esim_howto_wrap .esim_howto_item .text .point {
  color: #65d8ff;
}

/* main_section_customer */
.main_section_customer {
  padding: 20px 16px;
}
.main_section_customer .customer_wrap {
  display: flex;
  gap: 12px;
}
.main_section_customer .customer_wrap .customer_item {
  display: block;
  flex: 1;
  height: 200px;
  padding: 18px 20px;
  border-radius: 20px;
  text-align: center;
  border: 2px solid #a4abfc;
}
.main_section_customer .customer_wrap .customer_item.faq {
  background-color: #eaeef9;
  background-image: url('../../assets/images/img_contact1.png');
  background-repeat: no-repeat;
  background-position: center bottom 20px;
  background-size: 74px auto;
}
.main_section_customer .customer_wrap .customer_item.chat {
  background: #e6f5fd;
  background-image: url('../../assets/images/img_contact2.png');
  background-repeat: no-repeat;
  background-position: center bottom 10px;
  background-size: 107px auto;
  border-color: #82d0ec;
}
.main_section_customer .customer_wrap .customer_item .caption {
  display: inline-block;
  height: 28px;
  padding: 0 12px;
  margin-bottom: 8px;
  line-height: 28px;
  background: #5e68ff;
  border-radius: 14px;
  color: #fff;
  font-weight: var(--font-bold);
}
.main_section_customer .customer_wrap .customer_item.chat .caption {
  background: #1fabda;
}
.main_section_customer .customer_wrap .customer_item .text {
  font-size: 18px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
  line-height: 1.3;
  word-break: keep-all;
}
.main_section_customer .customer_wrap .customer_item .text .point {
  color: #5e68ff;
}
.main_section_customer .customer_wrap .customer_item.chat .text .point {
  color: #1fabda;
}

/* main_section_review */
.main_section_review {
  padding: 20px 0 20px 16px;
}
.review_slide_wrap {
}
.review_slide_content {
  display: flex;
  /* gap: 12px; */
  flex-wrap: nowrap;
}
/* 리뷰 공통 스타일 -- 리뷰 페이지에서도 공통으로 사용 */
.review_item_wrap {
  display: block;
  width: 248px;
  padding: 16px;
  background: var(--color-lightgray);
  border-radius: 22px;
}
.review_item_wrap.full {
  width: 100%;
}
.review_item_wrap .nation_info {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
.review_item_wrap .nation_info .nation_thumb {
  display: block;
  width: 28px;
  height: 28px;
  margin-right: 6px;
  background: url('../../assets/images/nation_aust.png') no-repeat center;
  background-size: contain;
}
.review_item_wrap .nation_info .nation_name {
  font-size: 18px;
  font-weight: var(--font-semibold);
}
.review_item_wrap .user_info {
  display: flex;
  align-items: center;
  margin-bottom: 5px;
}
.review_item_wrap .user_info .name {
  position: relative;
  display: inline-block;
  padding-right: 6px;
  margin-right: 6px;
  font-size: 14px;
  color: var(--text-sub1);
  font-weight: var(--font-semibold);
}
.review_item_wrap .user_info .name:after {
  content: '';
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 12px;
  background: #bac6d8;
}
.review_item_wrap .user_info .score {
  display: inline-block;
  font-size: 15px;
  color: var(--color-main);
  font-weight: var(--font-semibold);
}
.review_item_wrap .user_info .score:before {
  content: '';
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 3px;
  vertical-align: -2px;
  background: url('../../assets/images/ico_star_full.png') no-repeat center;
  background-size: 16px auto;
}
.review_item_wrap .review {
  font-size: 15px;
  color: var(--text-main);
  font-weight: var(--font-medium);
  line-height: 1.4;
}

/* main_info_footer */
.main_info_footer {
  padding: 20px 20px 90px;
  background: #4c545e;
  font-size: 12px;
  color: #fff;
  font-weight: var(--font-medium);
}
.footer_logo {
  width: 164px;
  height: 40px;
  background: url('../../assets/images/logo.png') no-repeat center;
  background-size: contain;
}
.main_info_footer .address {
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.3;
}
.main_info_footer .links_wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  margin: 8px 0 10px;
  text-align: center;
}
.main_info_footer .links_wrap .item {
  display: block;
  width: 100%;
  height: 25px;
  padding: 0 10px;
  line-height: 25px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 13px;
  color: rgba(255, 255, 255, 0.8);
}
.main_info_footer .text {
  color: rgba(255, 255, 255, 0.5);
  line-height: 1.5;
}
.main_info_footer .text > span + span {
  margin-left: 8px;
  padding-left: 8px;
  border-left: 1px solid rgba(255, 255, 255, 0.3);
}

/* footer_navigation */
.footer_navigation {
  position: fixed;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 100%;
  max-width: 500px;
  height: 76px;
  padding: 14px 36px 18px;
  background: #fff;
  border-top: 1px solid #ebebeb;
  border-radius: 20px 20px 0 0;
  z-index: 9999;
}
.footer_navigation .menu_wrap {
  display: flex;
  justify-content: space-between;
}
.footer_navigation .menu_wrap .menu {
  display: block;
  text-align: center;
  font-size: 11px;
  color: var(--text-sub1);
  font-weight: var(--font-medium);
}
.footer_navigation .menu_wrap .active .menu {
  color: var(--color-main);
}

.footer_navigation .menu_wrap .menu:before {
  content: '';
  display: block;
  width: 28px;
  height: 28px;
  margin: 0 auto;
  margin-bottom: 4px;
  background: url('../../assets/images/ico_footer_home_active.png') no-repeat
    center;
  background-size: contain;
}
.footer_navigation .menu_wrap .menu.home:before {
  background-image: url('../../assets/images/ico_footer_home.png');
}
.footer_navigation .menu_wrap .menu.esim:before {
  background-image: url('../../assets/images/ico_footer_esim.png');
}
.footer_navigation .menu_wrap .menu.partner:before {
  background-image: url('../../assets/images/ico_footer_partner.png');
  background-size: 24px;
}
.footer_navigation .menu_wrap .menu.mypage:before {
  background-image: url('../../assets/images/ico_footer_mypage.png');
}
.footer_navigation .menu_wrap .menu.all:before {
  background-image: url('../../assets/images/ico_footer_all.png');
}
.footer_navigation .menu_wrap .active .menu.home:before {
  background-image: url('../../assets/images/ico_footer_home_active.png');
}
.footer_navigation .menu_wrap .active .menu.esim:before {
  background-image: url('../../assets/images/ico_footer_esim_active.png');
}
.footer_navigation .menu_wrap .active .menu.partner:before {
  background-image: url('../../assets/images/ico_footer_partner_active.png');
  background-size: 24px;
}
.footer_navigation .menu_wrap .active .menu.mypage:before {
  background-image: url('../../assets/images/ico_footer_mypage_active.png');
}
.footer_navigation .menu_wrap .active .menu.all:before {
  background-image: url('../../assets/images/ico_footer_all_active.png');
}

/* main media query */
@media (max-width: 360px) {
  .esim_howto_wrap .esim_howto_item .text {
    font-size: 16px;
  }
  .main_section_customer .customer_wrap .customer_item .text {
    font-size: 16px;
  }
  /* .main_section_customer .customer_wrap .customer_item .text br {display:none;} */
  .main_info_footer .links_wrap .links_top {
    width: 100%;
  }
}

@media (max-width: 310px) {
  .main_header {
    padding: 8px;
  }
  .main_header .logo {
    width: 140px;
  }
  .main_guide {
    font-size: 14px;
  }
}

/* 서브 페이지 헤더 영역 */
.sub_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 48px;
  padding: 8px 16px;
}
.sub_header button {
  width: 32px;
  height: 32px;
}
.sub_header .btn_back {
  background: url('../../assets/images/ico_back.png') no-repeat center;
  background-size: 10px auto;
}
.sub_header .btn_share {
  background: url('../../assets/images/ico_share.png') no-repeat center;
  background-size: 20px auto;
}
.sub_header .title_wrap {
  display: flex;
  align-items: center;
  flex: 1;
  min-height: 0;
}
.sub_header .sub_header_title {
  padding-left: 4px;
  font-size: 20px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}

/* 검색 페이지 */
.search_page_wrap {
  padding: 8px 16px;
}
/* 검색영역 공통 */
.search_wrap[data-role='search_form'].active {
  position: relative;
}
/* 검색어 팝업 */
.search_wrap[data-role='search_form'] .search_popup {
  position: absolute;
  left: 0;
  top: calc(100% + 4px);
  width: 100%;
  padding: 10px 8px;
  background: #fff;
  box-shadow: var(--shadow-lightgray);
  border: 1px solid #eee;
  border-radius: 10px;
  /* display: none; */
}
.search_wrap[data-role='search_form'].active .search_popup {
  display: block;
}
.search_wrap[data-role='search_form'] .search_popup .keyword {
  display: flex;
  align-items: center;
  padding: 8px 10px;
  border-radius: 5px;
  font-size: 15px;
  line-height: 1.4;
  cursor: pointer;
  transition: all 0.3s;
}
.search_wrap[data-role='search_form'] .search_popup .keyword + .keyword {
  margin-top: 5px;
}
.search_wrap[data-role='search_form'] .search_popup .keyword:hover {
  background: var(--color-lightgray);
}
.search_wrap[data-role='search_form'] .search_popup .keyword .thumb {
  content: '';
  display: block;
  width: 25px;
  height: 25px;
  border-radius: 5px;
  margin-right: 5px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

/* 최근 검색 영역 */
.search_view_wrap {
  padding: 8px 16px;
}
.search_view_wrap .recent_wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.search_view_wrap .recent_wrap .content_title {
  color: var(--text-sub1);
  font-weight: var(--font-medium);
}
.search_view_wrap .recent_wrap .keyword_delete_all {
  background: transparent;
  color: var(--text-sub2);
  font-weight: var(--font-medium);
}
/* 검색 리스트 */
.search_view_wrap .search_nation_wrap {
  padding: 8px 0;
}
.search_view_wrap .search_nation_wrap .item_wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 16px;
  color: var(--text-main);
  font-weight: var(--font-medium);
}
.search_view_wrap .search_nation_wrap .item_wrap + .item_wrap {
  margin-top: 12px;
}
.search_view_wrap .search_nation_wrap .item_wrap .nation {
  display: flex;
  align-items: center;
  flex: 1;
  min-width: 0;
  min-height: 48px;
}
.search_view_wrap .search_nation_wrap .item_wrap .nation .thumb {
  content: '';
  display: inline-flex;
  margin-right: 10px;
  width: 40px;
  height: 40px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.search_view_wrap .search_nation_wrap .item_wrap .btn_keyword_delete {
  width: 24px;
  height: 24px;
  margin-left: 15px;
  background: transparent url('../../assets/images/ico_delete.png') no-repeat
    center;
  background-size: 10px auto;
}
/* 결과 페이지인 경우 */
.search_view_wrap.result .recent_wrap {
  display: none;
}
.search_view_wrap.result .search_nation_wrap .item_wrap .nation {
  background: url('../../assets/images/ico_go_link.png') no-repeat center right
    8px;
  background-size: 7px auto;
}
.search_view_wrap.result .search_nation_wrap .item_wrap .btn_keyword_delete {
  display: none;
}

/* 국가리스트 페이지 */
.subpage_nations {
  padding: 8px 16px;
}

/* 로그인 페이지 */
.login_page_wrap {
  padding: 20% 58px 0;
}
.login_page_wrap .login_info_wrap {
  display: flex;
  justify-content: center;
}
@keyframes login_caption_ani {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-3px);
  }
  100% {
    transform: translateY(0);
  }
}
.login_page_wrap .login_info_wrap .login_caption {
  position: relative;
  display: block;
  padding: 9px 18px;
  margin-bottom: 16px;
  background: var(--color-main);
  border-radius: 30px;
  color: #fff;
  font-weight: var(--font-medium);
  box-shadow: var(--shadow-lightgray);
  animation: login_caption_ani 0.8s infinite ease;
}
.login_page_wrap .login_info_wrap .login_caption:after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -6px;
  width: 12px;
  height: 12px;
  transform: rotate(-45deg);
  background: var(--color-main);
}
.login_page_wrap .sns_login_wrap {
}
.login_page_wrap .sns_login_wrap .login_item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 52px;
  border-radius: 12px;
  font-size: 16px;
  color: #3a2929;
  font-weight: var(--font-semibold);
  background: #fff;
}
.login_page_wrap .sns_login_wrap .login_item:before {
  content: '';
  position: absolute;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  background: url('../../assets/images/ico_sns_kakao.png') no-repeat center;
  background-size: 16px auto;
}
.login_page_wrap .sns_login_wrap .login_item.kakao {
  background-color: #fddc3f;
}
.login_page_wrap .sns_login_wrap .login_item.kakao:before {
  background-image: url('../../assets/images/ico_sns_kakao.png');
  background-size: 26px auto;
}
.login_page_wrap .sns_login_wrap .login_item.naver {
  background-color: #03c75a;
}
.login_page_wrap .sns_login_wrap .login_item.naver > a,
.login_page_wrap .sns_login_wrap .login_item.apple > a {
  color: #fff;
}
.login_page_wrap .sns_login_wrap .login_item.naver:before {
  background-image: url('../../assets/images/ico_sns_naver.png');
}
.login_page_wrap .sns_login_wrap .login_item.apple {
  background-color: #000000;
}
.login_page_wrap .sns_login_wrap .login_item.apple:before {
  background-image: url('../../assets/images/ico_sns_apple.png');
}
.login_page_wrap .sns_login_wrap .login_item.google {
  border: 1px solid var(--line-lightgray);
}
.login_page_wrap .sns_login_wrap .login_item.google:before {
  background-image: url('../../assets/images/ico_sns_google.png');
}
.login_page_wrap .sns_login_wrap .login_item + .login_item {
  margin-top: 8px;
}
/* login media query */
@media (max-width: 360px) {
  .login_page_wrap {
    padding-left: 8%;
    padding-right: 8%;
  }
}

.payment_check_agree_wrap {
  margin-bottom: 32px;
}
/* 회원가입 페이지 */
.subpage_join {
  padding: 20px 16px;
}
.subpage_join .join_top_info {
  margin-bottom: 20px;
  font-size: 20px;
  color: var(--text-main);
  font-weight: var(--font-bold);
  line-height: 1.2;
}
.subpage_join .join_form .item + .item {
  margin-top: 8px;
}
.subpage_join .join_form .item .input_help {
  margin-top: 8px;
}
.subpage_join .join_form .check_agree {
  padding: 16px 0;
}
.subpage_join .join_form .button_wrap {
  margin-top: 16px;
}
/* 회원가입 완료 */
.join_complete_content_wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100vh;
  padding: 10%;
}
.join_content_wrap {
  width: 80%;
}
.join_complete_content_wrap .text_wrap {
  position: relative;
  padding: 50px 30px 24px;
  border-radius: 20px;
  background: url('../../assets/images/bg_join_complete.png') no-repeat center;
  background-size: cover;
}
.join_complete_content_wrap .text_wrap:after {
  content: '';
  position: absolute;
  right: 18px;
  top: -76px;
  width: 210px;
  padding-top: 59%;
  background: url('../../assets/images/img_join_complete.png') no-repeat center;
  background-size: contain;
  /* height:140px; */
}
.join_complete_content_wrap .text_wrap .title {
  font-size: 20px;
  color: var(--text-main);
  font-weight: var(--font-bold);
  line-height: 1.2;
}
.join_complete_content_wrap .text_wrap .desc {
  padding-top: 12px;
  font-size: 15px;
  color: var(--text-sub1);
  font-weight: var(--font-medium);
  line-height: 1.4;
}
.join_complete_content_wrap .button_wrap {
  width: 100%;
  margin-top: 16px;
}

/* 상품카테고리 및 리스트 */
.subpage_product_category {
  padding: 4px 16px 20px;
}
.subpage_product_category .product_info {
  padding-bottom: 8px;
  font-size: 20px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
  line-height: 1.25;
}
/* 별점ui 공통 */
div[data-role='star_score'] .star {
  display: inline-block;
  width: 108px;
  height: 20px;
  background-image: url('../../assets/images/img_star_back.png');
  background-repeat: no-repeat;
  background-position: left center;
  background-size: auto 20px;
  vertical-align: middle;
}
div[data-role='star_score'] .star.color {
  background-image: url('../../assets/images/img_star_color.png');
}
div[data-role='star_score'] .count_wrap {
  display: inline-block;
  padding: 0 7px;
  margin-left: 4px;
  height: 24px;
  line-height: 24px;
  border-radius: 8px;
  background: #e8eafb;
  font-size: 13px;
  color: var(--color-main);
  font-weight: var(--font-medium);
  vertical-align: middle;
}
.subpage_product_category .period_wrap {
  padding-top: 16px;
  display: flex;
  overflow-x: auto;
  white-space: nowrap;
}
.subpage_product_category .period_wrap .day {
  display: inline-flex;
  align-items: center;
  height: 40px;
  padding: 0 16px;
  border-radius: 40px;
  background: var(--line-lightgray);
  font-size: 16px;
  color: var(--text-main);
  font-weight: var(--font-medium);
  line-height: 40px;
  cursor: pointer;
}
.subpage_product_category .period_wrap .day.selected {
  background: var(--color-main);
  color: #fff;
}
.subpage_product_category .period_wrap .day + .day {
  margin-left: 8px;
}
.subpage_product_category .period_wrap .day .reselect {
  position: relative;
  /* display: inline-flex; */
  display: none;
  align-items: center;
  margin-left: 6px;
  font-size: 14px;
}
.subpage_product_category

  .period_wrap
  .period.selected
  .reselect {
  display: inline-flex;
}
.subpage_product_category .period_wrap .day .reselect:before {
  content: '';
  display: inline-block;
  width: 16px;
  height: 16px;
  margin: 0 2px 0 6px;
  background: url('../../assets/images/ico_refresh.png') no-repeat center;
  background-size: 12px auto;
}
.subpage_product_category .period_wrap .day .reselect:after {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 12px;
  background: rgba(255, 255, 255, 0.3);
}
.subpage_product_category .data_list_wrap {
  padding-top: 20px;
}
[data-item="product_list_item"] {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  padding: 14px 16px;
  border-radius: 18px;
  background: var(--color-lightgray);
}
[data-item="product_list_item"] + .item {
  margin-top: 8px;
}
[data-item="product_list_item"] .info_wrap {
  flex:1;
  min-width: 0;
}
[data-item="product_list_item"] .info_wrap .data_name {
  font-size: 20px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}
[data-item="product_list_item"] .info_wrap .etc {
  padding-top: 6px;
  font-size: 13px;
  color: var(--text-sub2);
  font-weight: var(--font-medium);
  line-height: 1.4;
}
[data-item="product_list_item"] .price_wrap {
  display: flex;
  align-items: flex-end;
  justify-content: end;
  width:auto;
}
[data-item="product_list_item"] .price_wrap .prev_price {
  font-size: 16px;
  color: var(--text-sub2);
  font-weight: var(--font-medium);
  text-decoration: line-through;
}
[data-item="product_list_item"] .price_wrap .final_price {
  position: relative;
  margin-left: 5px;
  font-size: 24px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}
[data-item="product_list_item"] .price_wrap.partners .final_price .tags {
  position: absolute;
  right: 0;
  top: -23px;
}
[data-item="product_list_item"] .price_wrap.partners .final_price .tags .tag {
  display: inline-block;
  width: 58px;
  height: 20px;
  margin-left: 3px;
  vertical-align: middle;
}
[data-item="product_list_item"] .price_wrap.partners .final_price .tags .tag.partners {
  background: url('../../assets/images/img_product_price_tag1.png') no-repeat
    center;
  background-size: contain;
}
@media (max-width: 380px) {
  [data-item="product_list_item"] {
    flex-direction: column;
  }
  [data-item="product_list_item"] .info_wrap {
    margin-bottom: 20px;
  }
  [data-item="product_list_item"] .price_wrap {
    justify-content: end;
  }
}

/* 상품카테고리 및 리스트 상세 */
.subpage_product_detail {
  padding: 12px 16px;
}
.subpage_product_detail .product_title {
  margin-bottom: 5px;
  font-size: 36px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}
.subpage_product_detail .box_rounded {
  padding: 20px 16px;
  margin-top: 15px;
  background: #fff;
  border-radius: 22px;
}
.subpage_product_detail .article_title {
  display: block;
  padding-bottom: 8px;
  font-size: 20px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
  word-break: keep-all;
}
.subpage_product_detail .info_list_wrap {
  margin-top: 12px;
  padding-top: 16px;
  border-top: 1px solid var(--line-lightgray);
}
.subpage_product_detail .info_list_wrap .info_list {
}
.subpage_product_detail .info_list_wrap .info_list .item {
  /* display: flex; */
  align-items: flex-start;
  gap: 12px;
}
.subpage_product_detail .info_list_wrap .info_list .item + .item {
  margin-top: 12px;
}
.subpage_product_detail .info_list_wrap .info_list .item .title {
  display: inline-flex;
  align-items: center;
  width: 80px;
  /* margin-top: 1px; */
  font-size: 14px;
  color: var(--color-main);
  font-weight: var(--font-medium);
  line-height: 1.4;
}
/* .subpage_product_detail .info_list_wrap .info_list .item .title:before {
  content: '';
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-right: 5px;
  background: url('../../assets/images/ico_detail_telecom.png') no-repeat center;
  background-size: contain;
} */
/* .subpage_product_detail .info_list_wrap .info_list .item.network .title:before {
  background: url('../../assets/images/ico_detail_network.png') no-repeat center;
  background-size: contain;
}
.subpage_product_detail .info_list_wrap .info_list .item.network .title:before {
  background: url('../../assets/images/ico_detail_network.png') no-repeat center;
  background-size: contain;
}
.subpage_product_detail .info_list_wrap .info_list .item.call .title:before {
  background: url('../../assets/images/ico_detail_call.png') no-repeat center;
  background-size: contain;
}
.subpage_product_detail .info_list_wrap .info_list .item.message .title:before {
  background: url('../../assets/images/ico_detail_message.png') no-repeat center;
  background-size: contain;
}
.subpage_product_detail .info_list_wrap .info_list .item.regist .title:before {
  background: url('../../assets/images/ico_detail_regist.png') no-repeat center;
  background-size: contain;
}
.subpage_product_detail .info_list_wrap .info_list .item.policy .title:before {
  background: url('../../assets/images/ico_detail_policy.png') no-repeat center;
  background-size: contain;
} */
.subpage_product_detail .info_list_wrap .info_list .item .text {
  /* flex: 1; */
  /* min-width: 0; */
  font-size: 15px;
  color: var(--text-sub1);
  font-weight: var(--font-medium);
  line-height: 1.4;
}
.subpage_product_detail .info_list_wrap .info_list .item .text .red {
  color: #ea4335;
}
.subpage_product_detail .available_wrap {
  display: flex;
  gap: 12px;
}
.subpage_product_detail .available_wrap > * {
  padding-top: 85px;
  width: 50%;
  background: #fff url('../../assets/images/img_detail_earth.png') no-repeat
    left 17px top 18px;
  background-size: auto 42px;
  cursor: pointer;
}
.subpage_product_detail .available_wrap .available_esim {
  background: #fff url('../../assets/images/img_detail_phone.png') no-repeat
    left 17px top 18px;
  background-size: auto 50px;
}
.subpage_product_detail .available_wrap .article_title {
  padding-bottom: 0;
}
.subpage_product_detail .available_wrap .article_title .text_point {
  display: flex;
  align-items: center;
  padding-top: 5px;
}
.subpage_product_detail .available_wrap .article_title .text_point:after {
  content: '';
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-left: 8px;
  border-radius: 50%;
  background: var(--color-lightgray) url('../../assets/images/ico_go_link.png')
    no-repeat center;
  background-size: 4px auto;
}
.subpage_product_detail .purchase_wrap {
  padding: 16px 0;
}
.subpage_product_detail .purchase_wrap .btn_purchase {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 10px 18px;
  border-radius: 12px;
  background: var(--color-main);
  font-size: 20px;
  color: #fff;
  font-weight: var(--font-semibold);
}
.subpage_product_detail .purchase_wrap .btn_purchase .text {
}
.subpage_product_detail .purchase_wrap .btn_purchase .price {
  display: inline-flex;
  align-items: center;
  height: 32px;
  padding: 0 12px;
  line-height: 32px;
  background: #fff;
  border-radius: 16px;
  font-size: 16px;
  color: var(--color-main);
  font-weight: var(--font-medium);
}
@media (max-width: 350px) {
  .subpage_product_detail .available_wrap {
    gap: 8px;
  }
  .subpage_product_detail .article_title {
    padding-top: 2px;
    font-size: 16px;
    line-height: 1.4;
  }
}

/* 결제하기 페이지 */
.subpage_payment .sub_section {
  padding: 20px 16px 0;
}
.subpage_payment .sub_section .section_title {
  font-size: 20px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}
.subpage_payment .point_input_wrap {
  padding: 12px 0 20px;
}
.subpage_payment .save_point_wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 16px;
  color: var(--text-main);
  font-weight: var(--font-medium);
}
.subpage_payment .save_point_wrap .point {
  font-weight: var(--font-semibold);
}
.subpage_payment .save_point_wrap .point .number {
  margin-right: 3px;
  font-size: 26px;
}
.subpage_payment .payment_means_wrap .button_wrap {
  margin-top: 16px;
}
/* .subpage_payment .payment_means_wrap .payment_means {
  padding: 20px 0;
  display: flex;
  gap: 7px;
}
.subpage_payment .payment_means_wrap .payment_means .item {
  display: flex;
  justify-content: center;
  align-items: end;
  width: 25%;
  height: 100px;
  padding: 16px 5px;
  border-radius: 18px;
  border: 1px solid var(--line-lightgray);
}
.subpage_payment .payment_means_wrap .payment_means .item.selected {
  border: 1px solid var(--color-main);
  box-shadow: var(--shadow-lightgray);
}
.subpage_payment .payment_means_wrap .payment_means .item strong {
  display: block;
  font-size: 14px;
  color: var(--text-main);
  font-weight: var(--font-medium);
  text-align: center;
}
.subpage_payment .payment_means_wrap .payment_means .item strong:before {
  content: '';
  display: block;
  margin-bottom: 12px;
  width: 68px;
  height: 36px;
  background: url('../../assets/images/img_pay_naver.png') no-repeat center;
  background-size: contain;
}
.subpage_payment .payment_means_wrap .payment_means .item.kakao strong:before {
  background: url('../../assets/images/img_pay_kakao.png') no-repeat center;
  background-size: contain;
}
.subpage_payment .payment_means_wrap .payment_means .item.toss strong:before {
  background: url('../../assets/images/img_pay_toss.png') no-repeat center;
  background-size: contain;
}
.subpage_payment .payment_means_wrap .payment_means .item.card strong:before {
  background: url('../../assets/images/img_pay_card.png') no-repeat center;
  background-size: contain;
} */

/* 결제수단 스타일 추가 */
[data-role="payment_means"] {
  padding: 16px 0;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
[data-role="payment_means"] .item {
  width: calc(33.3333% - 5px);
  height: 100px;
}
[data-role="payment_means"] .item > input + label {
  display: block;
  width: 100%;
  height: 100%;
  padding: 16px 5px;
  border-radius: 18px;
  border: 1px solid var(--line-lightgray);
  font-size: 14px;
  color: var(--text-main);
  font-weight: var(--font-medium);
  text-align: center;
}
[data-role="payment_means"] .item > input:checked + label {
  border: 1px solid var(--color-main);
  box-shadow: var(--shadow-lightgray);
}
[data-role="payment_means"] .item > label > strong {
  display: block;
  font-size: 14px;
  color: var(--text-main);
  font-weight: var(--font-medium);
  line-height: 1.3;
  text-align: center;
  word-break: keep-all;
}
[data-role="payment_means"] .item > label > strong:before {
  content: '';
  display: block;
  margin: 0 auto 12px;
  width: 68px;
  height: 36px;
  background: url('../../assets/images/img_pay_naver.png') no-repeat center;
  background-size: contain;
}
[data-role="payment_means"] .item.payment_method_inicis_kakaopay > label > strong:before {
  background: url('../../assets/images/img_pay_kakao.png') no-repeat center;
  background-size: contain;
}
[data-role="payment_means"] .item.payment_method_inicis_stdcard > label > strong:before {
  background: url('../../assets/images/img_pay_card.png') no-repeat center;
  background-size: contain;
}
@media (max-width: 310px) {
  [data-role="payment_means"] .item > label > strong:before {
    width: 50px;
  }
}


/* 결제 완료 페이지 */  
.subpage_payment_complete {
  display: flex;
  align-items: center;
  min-height: 100vh;
  padding: 16px;
}
.subpage_payment_complete .payment_complete_wrap {
  flex: 1;
  text-align: center;
}
.subpage_payment_complete .payment_complete_wrap .section_title {
  margin-bottom: 10px;
  font-size: 24px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}
.subpage_payment_complete .payment_complete_wrap .desc {
  font-size: 16px;
  color: var(--text-sub1);
  font-weight: var(--font-medium);
}
.subpage_payment_complete .payment_complete_wrap .image_wrap {
  margin: 0 auto;
  max-width: 210px;
  padding: 42px 0 72px;
}
.subpage_payment_complete .payment_complete_wrap .image_wrap img {
  width: 100%;
}
.subpage_payment_complete .payment_complete_wrap .button_wrap .btn_mydata {
  width: 100%;
}


/* 내 데이터 페이지 */
.sub_header.mydata .btn_guide {
  width: auto;
  height: 28px;
  padding: 0 10px;
  line-height: 28px;
  background: var(--color-lightpurple);
  border-radius: 24px;
  font-size: 14px;
  color: var(--color-main);
  font-weight: bold;
}
.subpage_mydata {
  padding: 0 16px;
}
/* 내 데이터 박스 스타일 공통 */
[data-type='esim_data'] {
  padding: 16px;
  background: var(--color-lightgray);
  border-radius: 22px;
}
[data-type='esim_data'] + [data-type='esim_data'] {
  margin-top: 10px;
}
[data-type='esim_data'] .info_wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}
[data-type='esim_data'] .info_wrap .tag {
  display: inline-block;
  padding: 0 12px;
  height: 28px;
  background: var(--color-lightpurple);
  border-radius: 24px;
  line-height: 28px;
  font-size: 14px;
  color: var(--color-main);
  /* font-weight: bold; */
}
[data-type='esim_data'] .info_wrap .date {
  font-size: 13px;
  color: var(--text-sub2);
  font-weight: var(--font-medium);
}
[data-type='esim_data'] .nation_wrap {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
[data-type='esim_data'] .nation_wrap .nation_thumb {
  display: block;
  width: 32px;
  height: 32px;
  margin-right: 8px;
  background: url('../../assets/images/nation_aust.png') no-repeat center;
  background-size: contain;
}
[data-type='esim_data'] .nation_wrap .nation_name {
  font-size: 18px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}
[data-type='esim_data'] .nation_wrap .code {
  padding: 2px 0;
  font-size: 13px;
  color: var(--text-sub1);
  font-weight: var(--font-medium);
}
[data-type='esim_data'] .data_info_wrap {
  padding: 16px 19px;
  background: #fff;
  border-radius: 12px;
}
[data-type='esim_data'] .data_info_wrap .info {
  position: relative;
  padding: 3px 0 3px 20px;
  line-height: 1.3;
  font-size: 14px;
  color: var(--text-main);
  font-weight: var(--font-medium);
}
[data-type='esim_data'] .data_info_wrap .info:before {
  content: '';
  position: absolute;
  left: 0;
  top: 4px;
  width: 16px;
  height: 16px;
  background: url('../../assets/images/ico_detail_tag.png') no-repeat center;
  background-size: 80% auto;
}
[data-type='esim_data'] .data_info_wrap .info.data_info:before {
  background: url('../../assets/images/ico_detail_network.png') no-repeat center;
  background-size: 90% auto;
}
[data-type='esim_data'] .install_before_info {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 10px;
  margin: 8px 0;
  background: #49494a;
  border-radius: 12px;
  font-size: 14px;
  color: #fff;
  font-weight: var(--font-medium);
  text-align: center;
}
[data-type='esim_data'] .install_before_info:before {
  content: '';
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 6px;
  background: url('../../assets/images/ico_korea.png') no-repeat center;
  background-size: contain;
}
[data-type='esim_data'] .button_wrap {
  padding-top: 8px;
}
[data-type='esim_data'] .button_wrap.horizontal {
  display: flex;
  gap: 8px;
}
[data-type='esim_data'] .button_wrap > button {
  margin-top: 8px;
  width: 100%;
}
[data-type='esim_data'] .button_wrap.horizontal > button {
  width: 50%;
}

/* 설치 및 활성화 페이지 */
.subpage_install_activation {
  padding: 0 12px;
}
.subpage_install_activation .box_step {
  margin-top: 12px;
  padding: 20px;
  background: #fff;
  border-radius: 22px;
}
.subpage_install_activation .box_step .step {
  display: inline-block;
  height: 28px;
  padding: 0 12px;
  margin-bottom: 10px;
  background: var(--color-lightpurple);
  border-radius: 14px;
  line-height: 28px;
  font-size: 14px;
  color: var(--color-main);
  font-weight: bold;
}
.subpage_install_activation .box_step .box_title {
  font-size: 22px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}
.subpage_install_activation .box_step .box_image {
  padding: 20px;
  max-width: 200px;
  margin: 0 auto;
}
.subpage_install_activation .box_step .box_image img {
  width: 100%;
}
/* esim 설치하기 */
.subpage_install_code {
  padding: 0 16px 90px 16px;
}
.subpage_install_code .model_type_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  margin-bottom: 8px;
  font-size: 18px;
  color: var(--text-sub2);
  font-weight: bold;
}
.subpage_install_code .model_type_wrap .selected {
  color: var(--color-main);
}
.subpage_install_code .install_type_wrap {
  display: flex;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-bottom: 25px;
}
.subpage_install_code .install_type_wrap > span {
  display: block;
  height: 40px;
  padding: 0 16px;
  background: var(--color-lightgray);
  border-radius: 20px;
  line-height: 40px;
  font-size: 16px;
  color: var(--text-main);
  font-weight: var(--font-medium);
  cursor: pointer;
}
.subpage_install_code .install_type_wrap .selected {
  background: var(--color-main);
  color: #fff;
}
.subpage_install_code .code_title {
  display: block;
  text-align: center;
  font-size: 20px;
  color: var(--text-main);
  font-weight: var(--font-bold);
}
.subpage_install_code .box_qr {
  position: relative;
  margin: 20px auto;
  width: 100%;
  max-width: 248px;
  background: #fff;
  border: 1px solid var(--color-main);
  border-radius: 22px;
  text-align: center;
  box-shadow: var(--shadow-lightgray);
}
.subpage_install_code .box_qr:after {
  content: '';
  display: block;
  padding-bottom: 100%;
}
.subpage_install_code .box_qr .box_qr_inner {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  left: 0;
  top: 0;
  padding: 5px;
  width: 100%;
  height: 100%;
  flex-direction: column;
}
.subpage_install_code .box_qr .box_qr_inner .download_button{
  color: var(--color-main);
  padding:0 12px;
}
.subpage_install_code .box_qr img {
  max-width: 100%;
  width: 70%;
}
.subpage_install_code .activation_code {
  margin-top: 36px;
  border-top: 1px solid var(--line-lightgray);
  padding-top: 32px;
  position: relative;
}
.subpage_install_code .activation_code:before {
  content: '또는';
  display: block;
  position: absolute;
  left: 50%;
  top: -8px;
  transform: translateX(-50%);
  background-color: #fff;
  padding: 0 12px;
}
.subpage_install_code .box_code {
  padding: 16px 0 0;
}
.subpage_install_code .box_code .code_item {
  margin-bottom: 12px;
  padding: 16px 20px;
  background: var(--color-lightgray);
  border-radius: 22px;
}
.subpage_install_code .box_code .code_item .code_item_title {
  display: block;
  margin-bottom: 3px;
  font-size: 16px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}
.subpage_install_code .box_code .code_item .code {
  font-size: 14px;
  color: var(--text-sub1);
  font-weight: var(--font-medium);
  line-height: 1.3;
}
.subpage_install_code .box_code .code_item .code_button_wrap {
  text-align: right;
}
.subpage_install_code .box_code .code_item .code_button_wrap button {
  padding: 0 20px;
  font-size: 16px;
}
.subpage_install_code .code_wrap .info_wrap {
  text-align: center;
}
.subpage_install_code .code_wrap .info_text {
  font-size: 14px;
  color: var(--text-sub1);
  font-weight: var(--font-medium);
  text-align: center;
  line-height: 1.4;
  word-break: keep-all;
}
.subpage_install_code .code_wrap .info_box {
  display: inline-block;
  padding: 10px 20px;
  margin: 12px 0;
  background: var(--color-darkgray);
  border-radius: 12px;
  font-size: 14px;
  color: #fff;
  font-weight: var(--font-medium);
}
/* .subpage_install_code .guide_button_wrap {
  position: fixed;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 100%;
  max-width: 500px;
  padding: 16px;
  padding-bottom: 36px;
} */
.subpage_install_code .guide_button_wrap {
  padding-top: 8px;
}
@media (max-width: 320px) {
  .subpage_install_code .install_type_wrap {
    gap: 4px;
  }
  .subpage_install_code .install_type_wrap > span {
    font-size: 14px;
  }
}

/* 사용량 조회 페이지 */
.subpage_data_usage {
  padding: 20px 16px;
}
.subpage_data_usage .box_rounded {
  display: block;
  margin-bottom: 12px;
  padding: 20px;
  background: #fff;
  border-radius: 22px;
}
.subpage_data_usage .box_wrap {
  display: flex;
  gap: 10px;
}
.subpage_data_usage .box_wrap .box_rounded {
  width: 50%;
}
.subpage_data_usage .remain_data_wrap {
}
.subpage_data_usage .remain_data_wrap .tag {
  display: inline-block;
  height: 28px;
  padding: 0 12px;
  margin-bottom: 10px;
  background: var(--color-lightpurple);
  border-radius: 14px;
  line-height: 28px;
  font-size: 14px;
  color: var(--color-main);
  font-weight: bold;
}
.subpage_data_usage .remain_data_wrap .data {
  display: block;
  font-size: 32px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}
.subpage_data_usage .remain_data_wrap .data_info {
  padding: 3px 0 8px;
  font-size: 14px;
  color: var(--color-main);
  font-weight: var(--font-medium);
  text-align: right;
}
.subpage_data_usage .remain_data_wrap .amount {
  height: 30px;
  border-radius: 15px;
  background: var(--color-lightgray);
  border: 1px solid rgba(0, 0, 0, 0.06);
}
.subpage_data_usage .remain_data_wrap .full_amount {
  position: relative;
}
.subpage_data_usage .remain_data_wrap .current_amount {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to right, #5e68ff, #8990ff);
}
.subpage_data_usage .time_wrap .box_rounded {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  /* min-height:155px; */
}
.subpage_data_usage .time_wrap .title_wrap .box_title {
  font-size: 16px;
  font-weight: var(--font-semibold);
}
.subpage_data_usage .time_wrap .title_wrap .desc {
  padding-top: 3px;
  font-size: 13px;
  color: var(--text-sub2);
  font-weight: var(--font-medium);
}
.subpage_data_usage .time_wrap .time {
  display: block;
  padding-top: 30px;
  font-size: 30px;
  font-weight: var(--font-semibold);
}
.subpage_data_usage .time_wrap .expiration_date_wrap .time {
  font-size: 22px;
  line-height: 1.2;
}
.subpage_data_usage .problem_wrap {
  background: #fff url('../../assets/images/ico_go_link.png') no-repeat right
    25px center;
  background-size: 7px auto;
}
.subpage_data_usage .problem_wrap .text {
  padding-right: 30px;
  font-size: 16px;
  font-weight: var(--font-semibold);
  word-break: keep-all;
  line-height: 1.4;
}
@media (max-width: 370px) {
  .subpage_data_usage .time_wrap .expiration_date_wrap .time {
    font-size: 18px;
  }
}
@media (max-width: 325px) {
  .subpage_data_usage .box_wrap {
    display: block;
  }
  .subpage_data_usage .box_wrap .box_rounded {
    width: 100%;
  }
}

/* 전체보기, 공지사항 리스트 */
.subpage_list_wrap {
  padding: 0 16px;
}
.subpage_list_wrap .list_wrap {
}
.subpage_list_wrap .list_wrap .item_wrap {
  display: block;
  margin: 8px 0;
  padding: 14px 0;
  background: url('../../assets/images/ico_go_link.png') no-repeat center right
    7px;
  background-size: 7px auto;
}
.subpage_list_wrap .list_wrap .item_wrap .title {
  display: block;
  padding-right: 50px;
  margin-bottom: 3px;
  font-size: 16px;
  color: var(--text-main);
  font-weight: var(--font-medium);
  line-height: 1.4;
}
.subpage_list_wrap .list_wrap .item_wrap .date {
  font-size: 12px;
  color: var(--text-sub2);
  font-weight: var(--font-medium);
}
/* 공지사항 상세 */
.subpage_notice_detail {
  padding: 8px 16px;
}
.subpage_notice_detail .title {
  font-size: 18px;
  color: var(--text-main);
  font-weight: var(--font-medium);
  line-height: 1.4;
}
.subpage_notice_detail .date {
  padding-top: 8px;
  font-size: 13px;
  color: var(--text-sub2);
  font-weight: var(--font-regular);
}
.subpage_notice_detail .content {
  padding-top: 30px;
  font-size: 14px;
  color: var(--text-sub1);
  font-weight: var(--font-regular);
  line-height: 1.5;
}

/* 파트너 신청 페이지 */
.subpage_partner_apply {
  padding: 8px 16px;
}
.subpage_partner_apply .apply_step_wrap + .apply_step_wrap {
  margin-top: 30px;
}
.subpage_partner_apply .article_title {
  display: block;
  margin-bottom: 12px;
  font-size: 20px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
  word-break: keep-all;
}
.subpage_partner_apply .desc {
  margin-top: -8px;
  margin-bottom: 14px;
  font-size: 13px;
  color: var(--text-sub2);
  font-weight: var(--font-medium);
}
.subpage_partner_apply .marketings + .marketings {
  margin-top: 14px;
}
.subpage_partner_apply
  .marketing_address_wrap
  [data-role='input']
  + [data-role='input'] {
  margin-top: 8px;
}
.subpage_partner_apply .info_wrap .box_info {
  padding: 20px 16px;
  background: var(--color-lightgray);
  border-radius: 22px;
}
.subpage_partner_apply .button_wrap {
  margin-top: 16px;
}

/* 리뷰 페이지 작성 */
.subpage_review_write .button_wrap {
  padding-top: 16px;
}
.subpage_review_write .form_wrap .item{
  margin-top: 8px;
}

/* 리뷰 페이지 */
.subpage_review {
  padding: 8px 16px;
}
.subpage_review .review_wrap {
  padding-top: 20px;
}
.subpage_review .review_item_wrap + .review_item_wrap {
  margin-top: 8px;
}

/* eSim 사용방법, 이벤트 페이지 */
.subpage_esim_guide,
.subpage_event {
  padding: 8px 16px;
}
/* 갤러리형 리스트 공통 스타일 */
.gallery_list_wrap .gallery_item + .gallery_item {
  margin-top: 16px;
}
.gallery_list_wrap .gallery_item .thumb {
  display: block;
  max-height: 200px;
  background: var(--color-lightgray);
  border-radius: 22px;
  overflow: hidden;
}
.gallery_list_wrap .gallery_item .thumb img {
  width: 100%;
}
.gallery_list_wrap .gallery_item .title {
  display: block;
  margin-top: 8px;
  font-size: 18px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
  text-align: center;
}

/* 제휴 문의 */
.subpage_associate {
  padding: 8px 16px;
}
.subpage_associate .form_wrap .item + .item {
  margin-top: 8px;
}
.subpage_associate .check_agree {
  margin-top: 16px;
}
.subpage_associate .button_wrap {
  padding-top: 32px;
}

/* 마이페이지 */
.subpage_mypage .user {
  font-size: 20px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
  line-height: 1.2;
}
.subpage_mypage .user_mail {
  padding-top: 6px;
  font-size: 13px;
  color: var(--text-sub2);
  font-weight: var(--font-medium);
}
.subpage_mypage .button_wrap {
  padding-top: 20px;
}
.subpage_mypage .button_wrap > a + a {
  margin-top: 8px;
}
.subpage_mypage .etc_wrap {
  padding: 16px 0;
  text-align: center;
}
.subpage_mypage .etc_wrap > a {
  margin: 0 4px;
  font-size: 13px;
  color:var(--text-sub2);
  text-decoration: underline;
}

/* 주문리스트 */
[data-type='esim_data'] .order_wrap {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px dashed #fff;
}
[data-type='esim_data'] .order_wrap > * {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
[data-type='esim_data'] .order_wrap .top {
  min-height: 24px;
  margin-bottom: 6px;
}
[data-type='esim_data'] .order_wrap .order_number_wrap {
  font-size: 13px;
  color: var(--text-sub1);
  font-weight: var(--font-medium);
}
[data-type='esim_data'] .order_wrap .order_number_wrap .number {
  margin-left: 3px;
  color: var(--text-main);
}
[data-type='esim_data'] .order_wrap .receipt_wrap a {
  height: 24px;
  padding: 0 12px;
  background: #fff;
  border-radius: 6px;
  border: 1px solid var(--line-lightgray);
  font-size: 11px;
  color: var(--text-sub2);
  font-weight: var(--font-regular);
  line-height: 24px;
}
[data-type='esim_data'] .order_wrap .receipt_wrap a.review_write {
  color: var(--text-main);
  font-weight: var(--font-regular);
  line-height: 24px;
}

[data-type='esim_data'] .order_wrap .btn_refund {
  height: 24px;
  padding: 0 12px;
  background: #fff;
  border-radius: 6px;
  border: 1px solid var(--line-lightgray);
  font-size: 11px;
  color: var(--text-sub2);
  font-weight: var(--font-regular);
  line-height: 24px;
}
[data-type='esim_data'] .order_wrap .btn_refund {
  height: 24px;
  padding: 0 12px;
  background: #fff;
  border-radius: 6px;
  border: 1px solid var(--line-lightgray);
  font-size: 11px;
  color: var(--text-sub2);
  font-weight: var(--font-regular);
  line-height: 24px;
}
[data-type='esim_data'] .order_wrap .status {
  font-size: 16px;
  color: var(--color-main);
  font-weight: var(--font-semibold);
}
[data-type='esim_data'] .order_wrap .price_wrap {
  font-size: 13px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}
[data-type='esim_data'] .order_wrap .price_wrap .price {
  font-size: 18px;
}



/* 회원정보 수정 */
.subpage_user_modify .modify_form .item + .item {
  margin-top: 8px;
}
.subpage_user_modify .modify_form .item .input_help {
  margin-top: 8px;
}
.subpage_user_modify .modify_form .button_wrap {
  margin-top: 16px;
}

/* 파트너-메인 */
/* 파트너-계좌 등록하기 */
.subpage_partner_main .account_register_wrap {
  padding: 48px 10px 26px;
  background: var(--color-lightgray);
  border-radius: 22px;
  text-align: center;
}
.subpage_partner_main .account_register_wrap .btn_account_register {
  display: inline-block;
  width: 32px;
  height: 32px;
  background: var(--color-main) url('../../assets/images/ico_plus.png')
    no-repeat center;
  background-size: 16px;
  border-radius: 50%;
}
.subpage_partner_main .account_register_wrap .title {
  display: block;
  padding: 20px 0 8px;
  font-size: 18px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}
.subpage_partner_main .account_register_wrap .desc {
  font-size: 13px;
  color: var(--text-sub1);
  font-weight: var(--font-medium);
  line-height: 1.4;
}
/* 파트너-계좌등록 후 메인 */
.subpage_partner_main .account_wrap {
  padding: 16px;
  background: var(--color-lightgray);
  border-radius: 22px;
}
.subpage_partner_main .account_wrap .account_name {
  font-size: 14px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}
.subpage_partner_main .account_wrap .account_number {
  padding-top: 6px;
  font-size: 13px;
  color: var(--text-sub1);
  font-weight: var(--font-regular);
}
.subpage_partner_main .account_price_wrap {
  padding: 18px 0;
}
.subpage_partner_main .account_price_wrap .price_title {
  font-size: 12px;
  color: var(--text-sub1);
  font-weight: var(--font-regular);
}
.subpage_partner_main .account_price_wrap .price {
  padding-top: 4px;
  font-size: 13px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}
.subpage_partner_main .account_price_wrap .price .num {
  font-size: 20px;
}
.subpage_partner_main .button_wrap {
  display: flex;
  gap: 8px;
}
/* 파트너 리스트 공통 스타일 */
.partner_list_wrap {
  padding-top: 12px;
}
.partner_list_wrap .article_title {
  padding-top: 24px;
  padding-bottom: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 20px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}
.partner_list_wrap .article_title .btn_register {
  display: inline-block;
  height: 26px;
  line-height: 26px;
  padding: 0 12px;
  border-radius: 13px;
  background: var(--color-navy);
  font-size: 13px;
  color: #fff;
  font-weight: var(--font-regular);
}
.partner_list_wrap .button_wrap {
  margin-top: 16px;
}
/* 파트너 링크 리스트 아이템 스타일 */
.item[data-item=partner_list_item] {
  padding: 12px 16px 20px;
  border-radius: 22px;
  border: 1px solid var(--line-lightgray);
}
.item[data-item=partner_list_item] + .item[data-item=partner_list_item] {
  margin-top: 8px;
}
.item[data-item=partner_list_item] .date_wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.item[data-item=partner_list_item] .date {
  font-size: 12px;
  color: var(--text-sub2);
  font-weight: var(--font-medium);
}
.item[data-item=partner_list_item] .date_wrap .tag {
  display: inline-block;
  height: 28px;
  padding: 0 12px;
  line-height: 28px;
  background: var(--color-lightpurple);
  border-radius: 14px;
  font-size: 14px;
  color: var(--color-main);
  font-weight: bold;
}
.item[data-item=partner_list_item] .title {
  display: block;
  padding-top: 12px;
  font-size: 16px;
  color: var(--text-main);
  font-weight: var(--font-medium);
  line-height: 1.3;
}
.item[data-item=partner_list_item] .price_wrap {
  text-align: right;
}
.item[data-item=partner_list_item] .price_wrap .price {
  font-size: 16px;
  color: var(--text-main);
  font-weight: var(--font-medium);
}
.item[data-item=partner_list_item] .price_wrap .price > span {
  margin-left: 2px;
  font-size: 13px;
}
.item[data-item=partner_list_item] .link {
  display: block;
  margin-top: 4px;
  font-size: 13px;
  color: var(--text-sub2);
  font-weight: var(--font-regular);
  text-decoration: underline;
  line-height: 1.2;
}
/* 링크 공유 팝업 스타일 추가 */
.item[data-item=partner_list_item].selected {
  border: 1px solid var(--color-main);
  box-shadow:var(--shadow-lightgray);
}
[data-role=popup_container_partner_link].scrollable-content {
  max-height: calc(80vh - 200px);
}
[data-role=popup_container_partner_link] .item[data-item=partner_list_item] {
  cursor: pointer;
}
[data-role=popup_container_partner_link] + .button_wrap {
  margin-top: 16px;
}
[data-search=partner_link_search] {
  margin-bottom: 12px;
}
/* 파트너-계좌 등록 */
.subpage_partner_account .form_wrap .item + .item {
  margin-top: 8px;
}
.subpage_partner_account .button_wrap {
  margin-top: 16px;
}
/* 파트너-판매 링크 등록 */
.subpage_market_register .form_wrap .item + .item {
  margin-top: 8px;
}

.subpage_market_register .dot_text {
  margin: 4px 0;
}
.subpage_market_register .dot_text:first-of-type {
  margin-top: 16px;
}
.subpage_market_register .button_wrap {
  margin-top: 16px;
}

/* 팝업 스타일  공통 */
[data-role='dim'] {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.6);
  transition: all 0.3s;
  pointer-events: auto;
  z-index: 99999;
}
/* 중앙팝업(기본) */
div[data-role='popup'] {
  display: none;
}
div[data-role='popup'].active {
  display: block;
}
div[data-role='popup'] .popup_wrap {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  max-width: 500px;
  max-height: 100vh;
  padding: 12px 16px;
  background: #fff;
  border-radius: 20px;
  z-index: 100000;
}
/* 중앙팝업 */
div[data-role='popup'][data-type='center_round'] .popup_wrap {
  max-width: calc(500px - 10%);
  width: 80vw;
  box-shadow: var(--shadow-lightgray);
}
/* 하단팝업 */
div[data-role='popup'][data-type='bottom_round'] .popup_wrap {
  left: 50%;
  top: initial;
  bottom: 0;
  transform: translate(-50%, 0);
  border-radius: 20px 20px 0 0;
}
div[data-role='popup'] .popup_wrap .popup_title {
  display: block;
  padding: 26px 0 14px;
  font-size: 20px;
  font-weight: var(--font-bold);
  color: var(--text-main);
}
div[data-role='popup'] .popup_wrap .popup_detail {
  font-size: 13px;
  color: var(--text-sub1);
  font-weight: var(--font-regular);
  line-height: 1.4;
}
div[data-role='popup'] .popup_wrap .popup_title .point {
  color: var(--color-main);
}
div[data-role='popup'] .popup_wrap .popup_content {
  margin-top: 14px;
  min-height: 120px;
  max-height: 80vh;
  /* overflow-y: auto; */
}
div[data-role='popup'] .popup_wrap .popup_content.center {
  display: flex;
  align-items: center;
  justify-content: center;
}
div[data-role='popup'] .popup_wrap .popup_content > * {
  font-size: 16px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
  line-height: 1.3;
}
div[data-role='popup'] .popup_wrap .popup_content .center {
  text-align: center;
}
div[data-role='popup'] .popup_wrap .btn_close_popup {
  position: absolute;
  right: 16px;
  top: 12px;
  width: 32px;
  height: 32px;
  background: url('../../assets/images/ico_close.png') no-repeat center;
  background-size: 18px auto;
  cursor: pointer;
}
/* 페이지 별 팝업 추가 스타일은 하단에 */

/* 개인정보 처리방침, 이용약관 팝업 */
div[data-role='popup'][data-popup='privacy_policy'] .popup_content h3,
div[data-role='popup'][data-popup='privacy_policy'] .popup_content h4,
div[data-role='popup'][data-popup='terms'] .popup_content h3,
div[data-role='popup'][data-popup='terms'] .popup_content h4 {
  padding: 8px 0 6px;
  font-size: 13px;
  font-weight: var(--font-semibold);
}
div[data-role='popup'][data-popup='privacy_policy'] .popup_content > p,
div[data-role='popup'][data-popup='terms'] .popup_content > p {
  font-size: 12px;
  color: var(--text-sub1);
  font-weight: var(--font-medium);
  line-height: 1.5;
}

/* 상품카테고리 리스트 선택 팝업(template-product-category.php) */
div[data-role='popup'] [data-role=popup_content] .select_list_wrap {
  width: 100%;
}
div[data-role='popup'] [data-role=popup_content] .select_list_wrap .item {
  padding: 10px;
  border-radius: 14px;
  border: 1px solid var(--line-lightgray);
  font-size: 16px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
  text-align: center;
  cursor: pointer;
}
div[data-role='popup'] [data-role=popup_content] .select_list_wrap .item + .item {
  margin-top: 8px;
}
div[data-role='popup'] [data-role=popup_content] .select_list_wrap .item.selected {
  border: 1px solid var(--color-main);
  color: var(--color-main);
}

/* 상품카테고리 리스트 선택 팝업(template-product-detail.php) */
div[data-role='popup'] [data-role=popup_content]
  .models_wrap
  .item {
  padding: 20px 16px;
  margin-bottom: 12px;
  background: var(--color-lightgray);
  border-radius: 22px;
}
div[data-role='popup'] [data-role=popup_content]
  .models_wrap
  .item
  .title {
  display: block;
  padding-bottom: 12px;
  font-size: 20px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}
div[data-role='popup'] [data-role=popup_content]
  .models_wrap
  .item
  .models {
  font-size: 15px;
  color: var(--text-sub1);
  font-weight: var(--font-medium);
  line-height: 1.4;
}

/* 사용가능한 국가 검색 팝업 */
div[data-role='popup'] [data-role=popup_content] .search_wrap {
  width: 100%;
}
div[data-role='popup'] [data-role=popup_content] .search_wrap .nation_item_wrap {
  padding: 20px 0 10px;
}
div[data-role='popup'] [data-role=popup_content] .search_wrap .nation_item_wrap .nation_item {
  display: inline-block;
  padding: 10px;
  margin-right: 10px;
  margin-bottom: 10px;
  border-radius: 10px;
  background: var(--color-lightgray);
  font-size: 16px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}

/* 설치 중 팝업 */
div[data-role='popup'][data-popup='data_installation'] .info_text {
  display: block;
  margin-bottom: 16px;
  text-align: center;
  font-size: 24px;
  color: var(--text-main);
  font-weight: var(--font-semibold);
}
div[data-role='popup'][data-popup='data_installation'] .installation_wrap {
  padding: 50px 10px;
}
div[data-role='popup'][data-popup='data_installation']
  .installation_wrap
  .logo {
  display: block;
  max-width: 164px;
  margin: 0 auto;
}
div[data-role='popup'][data-popup='data_installation']
  .installation_wrap
  .logo
  img {
  width: 100%;
}
div[data-role='popup'][data-popup='data_installation']
  .installation_wrap
  .box_image {
  max-width: 170px;
}
div[data-role='popup'][data-popup='data_installation']
  .installation_wrap
  .box_image
  img {
  width: 100%;
}

/* cosmosfarm추가 스타일 */
/* 비밀번호 찾기, 회원가입 입력폼 스타일 */
.cosmosfarm-members-form.pwdreset-form,
.cosmosfarm-members-form.signup-form {
  width: 100%;
  padding: 8px 16px;
}
.cosmosfarm-members-form.pwdreset-form fieldset label.text,
.cosmosfarm-members-form.signup-form fieldset label.text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.cosmosfarm-members-form.pwdreset-form fieldset .div_text,
.cosmosfarm-members-form.signup-form fieldset .div_text {
  position: relative;
  display: flex;
  align-items: center;
  margin-bottom: 8px;
}
.cosmosfarm-members-form.pwdreset-form fieldset input,
.cosmosfarm-members-form.signup-form fieldset input {
  flex: 1;
  min-width: 0;
  height: 48px;
  padding: 0 10px 0 20px;
  background: var(--color-lightgray);
  border-color: transparent;
  border-radius: 24px;
  font-size: 16px;
  color: var(--text-main);
  font-weight: var(--font-medium);
}
.cosmosfarm-members-form.pwdreset-form fieldset .button_div,
.cosmosfarm-members-form.signup-form fieldset .button_div {
  margin-top: 16px;
}
.cosmosfarm-members-form.pwdreset-form fieldset .buttons,
.cosmosfarm-members-form.signup-form fieldset .buttons {
  background: var(--color-main) !important;
  color: #fff;
}
.cosmosfarm-members-form.signup-form fieldset .req-text {
  display: none;
}
.cosmosfarm-members-form.signup-form fieldset .div_checkbox {
  display: flex;
  align-items: center;
  overflow: initial;
  margin-top: 16px;
}
.cosmosfarm-members-form.signup-form fieldset .div_checkbox input[name='top'] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.cosmosfarm-members-form.signup-form fieldset .div_checkbox label.checkbox {
  display: none;
}
.cosmosfarm-members-form.signup-form fieldset .div_checkbox label {
  display: inline-block;
  padding-left: 27px;
  padding-right: 0;
}
.cosmosfarm-members-form.signup-form fieldset .div_checkbox .check_agree {
  display: inline-block;
  font-size: 13px;
  color: var(--text-sub1);
  line-height: 1.3;
}


/* 로딩중 */
[data-role='es_loading'] {
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0);
  z-index: 9999999;
  opacity: .5;
  transition: 0.5s ease;
}
[data-role='es_loading'].active {
  display: flex;
}
[data-role='es_loading'] > span{
  display: block;
  padding-top: 10px;
  color: rgba(255, 255, 255, 0.6);
  letter-spacing: 1px;
}

/* default notice */
/* 공통 알림 스타일 */
.default_notice {
  padding: 15px;
  margin: 15px 0;
  border-left: 4px solid;
  background-color: #f1f1f1;
  position: relative;
  border-radius: 4px;
  font-family: Arial, sans-serif;
}

.default_notice p {
  margin: 0;
}

/* 성공 알림 */
.default_notice_success {
  border-color: #46b450;
  background-color: #e7f7e5;
  color: #155724;
}

/* 에러 알림 */
.default_notice_error {
  border-color: #dc3232;
  background-color: #f8d7da;
  color: #721c24;
}

/* 경고 알림 */
.default_notice_warning {
  border-color: #ffb900;
  background-color: #fff3cd;
  color: #856404;
}

/* 정보 알림 */
.default_notice_info {
  border-color: #007cba;
  background-color: #e6f0fa;
  color: #004085;
}

/* 닫기 버튼 스타일 */
.is-dismissible::before {
  content: "\f153";
  font-family: dashicons;
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%);
  cursor: pointer;
  color: #555;
}

.is-dismissible:hover::before {
  color: #333;
}