@charset "UTF-8";
.bg-primary {
  background-color: #171c61;
}

.bg-white {
  background-color: #ffffff;
}

.bg-black {
  background-color: #000000;
}

.bg-neutral950 {
  background-color: #26262b;
}

.bg-neutral900 {
  background-color: #393941;
}

.bg-neutral800 {
  background-color: #41414b;
}

.bg-neutral700 {
  background-color: #4c4d58;
}

.bg-neutral600 {
  background-color: #5d5e6c;
}

.bg-neutral500 {
  background-color: #737584;
}

.bg-neutral400 {
  background-color: #91939f;
}

.bg-neutral300 {
  background-color: #b8b9c1;
}

.bg-neutral200 {
  background-color: #d9d9de;
}

.bg-neutral100 {
  background-color: #eeeef0;
}

.bg-neutral50 {
  background-color: #f7f7f8;
}

.txt-primary {
  color: #171c61;
}

.txt-white {
  color: #ffffff;
}

.txt-black {
  color: #000000;
}

.txt-neutral950 {
  color: #26262b;
}

.txt-neutral900 {
  color: #393941;
}

.txt-neutral800 {
  color: #41414b;
}

.txt-neutral700 {
  color: #4c4d58;
}

.txt-neutral600 {
  color: #5d5e6c;
}

.txt-neutral500 {
  color: #737584;
}

.txt-neutral400 {
  color: #91939f;
}

.txt-neutral300 {
  color: #b8b9c1;
}

.txt-neutral200 {
  color: #d9d9de;
}

.txt-neutral100 {
  color: #eeeef0;
}

.txt-neutral50 {
  color: #f7f7f8;
}

.btn.medium {
  padding: 0 0.8rem;
  height: 4.8rem;
  line-height: 4.6rem;
  border: 1px solid;
  border-radius: 4.8rem;
  box-sizing: border-box;
  font-size: 1.6rem;
  font-weight: 500;
}

.btn.large {
  padding: 0 2rem;
  height: 5.6rem;
  line-height: 5.4rem;
  border: 1px solid;
  border-radius: 5.6rem;
  box-sizing: border-box;
  font-size: 1.6rem;
  font-weight: 700;
}

.btn.white {
  background: #ffffff;
  border-color: #ffffff;
  color: #212b8e;
}

.btn.primary {
  background: #212b8e;
  border-color: #212b8e;
  color: #ffffff;
}

.btn.ra16 {
  border-radius: 1.6rem;
}

.btn.ra15 {
  border-radius: 1.5rem;
}

.btn.ra10 {
  border-radius: 1rem;
}

.btn.ra8 {
  border-radius: 0.8rem;
}

.btn.ra4 {
  border-radius: 0.4rem;
}

.icon.icon0::before {
  background: url(../images/ico24_arrow_back.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon.icon1::before {
  background: url(../images/btn_arrow-gray.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 3rem;
  height: 3rem;
}

.icon.icon2::before {
  background: url(../images/btn_arrow-white.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 3rem;
  height: 3rem;
}

.icon.icon3::before {
  background: url(../images/ico_system.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 3rem;
  height: 3rem;
}

.icon-nav.nav1::before {
  background: url(../images/icon-nav-1.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav2::before {
  background: url(../images/icon-nav-2.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav3::before {
  background: url(../images/icon-nav-3.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav4::before {
  background: url(../images/icon-nav-4.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav5::before {
  background: url(../images/icon-nav-5.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav6::before {
  background: url(../images/icon-nav-6.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav7::before {
  background: url(../images/icon-nav-7.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav8::before {
  background: url(../images/icon-nav-8.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav9::before {
  background: url(../images/icon-nav-9.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav10::before {
  background: url(../images/icon-nav-10.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav11::before {
  background: url(../images/icon-nav-11.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav12::before {
  background: url(../images/icon-nav-12.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav13::before {
  background: url(../images/icon-nav-13.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav14::before {
  background: url(../images/icon-nav-14.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav15::before {
  background: url(../images/icon-nav-15.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav16::before {
  background: url(../images/icon-nav-16.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav17::before {
  background: url(../images/icon-nav-17.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav18::before {
  background: url(../images/icon-nav-18.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav19::before {
  background: url(../images/icon-nav-19.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav20::before {
  background: url(../images/icon-nav-20.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav21::before {
  background: url(../images/icon-nav-21.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav22::before {
  background: url(../images/icon-nav-22.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav23::before {
  background: url(../images/icon-nav-23.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.icon-nav.nav24::before {
  background: url(../images/icon-nav-24.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
}

.btn.icol1::before {
  background: url(../images/btn_arrow.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
  margin-right: 0rem;
}

.btn.icol2::before {
  background: url(../images/circle_del_gray.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2rem;
  height: 2rem;
  margin-right: 0rem;
}

.btn.icol3::before {
  background: url(../images/btn_search.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2rem;
  height: 2rem;
  margin-right: 0rem;
}

.btn.icol4::before {
  background: url(../images/btn_del_bk.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 0.8rem;
  height: 0.8rem;
  margin-right: 0rem;
}

.btn.icor1::after {
  background: url(../images/btn_arrow.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2.4rem;
  height: 2.4rem;
  margin-left: 0rem;
}

.btn.icor2::after {
  background: url(../images/circle_del_gray.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2rem;
  height: 2rem;
  margin-left: 0rem;
}

.btn.icor3::after {
  background: url(../images/btn_search.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 2rem;
  height: 2rem;
  margin-left: 0rem;
}

.btn.icor4::after {
  background: url(../images/btn_del_bk.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 0.8rem;
  height: 0.8rem;
  margin-left: 0rem;
}

.cicon.cico0::after {
  background: url(../images/card/card_none.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 4rem;
  height: 4rem;
}

.cicon.cico1::after {
  background: url(../images/card/card_bc.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 4rem;
  height: 4rem;
}

.cicon.cico2::after {
  background: url(../images/card/card_citi.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 4rem;
  height: 4rem;
}

.cicon.cico3::after {
  background: url(../images/card/card_gwangju.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 4rem;
  height: 4rem;
}

.cicon.cico4::after {
  background: url(../images/card/card_hana.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 4rem;
  height: 4rem;
}

.cicon.cico5::after {
  background: url(../images/card/card_hyundai.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 4rem;
  height: 4rem;
}

.cicon.cico6::after {
  background: url(../images/card/card_jeju.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 4rem;
  height: 4rem;
}

.cicon.cico7::after {
  background: url(../images/card/card_jeonbuk.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 4rem;
  height: 4rem;
}

.cicon.cico8::after {
  background: url(../images/card/card_kb.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 4rem;
  height: 4rem;
}

.cicon.cico9::after {
  background: url(../images/card/card_lotte.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 4rem;
  height: 4rem;
}

.cicon.cico10::after {
  background: url(../images/card/card_master.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 4rem;
  height: 4rem;
}

.cicon.cico11::after {
  background: url(../images/card/card_nh.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 4rem;
  height: 4rem;
}

.cicon.cico12::after {
  background: url(../images/card/card_samsung.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 4rem;
  height: 4rem;
}

.cicon.cico13::after {
  background: url(../images/card/card_sinhan.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 4rem;
  height: 4rem;
}

.cicon.cico14::after {
  background: url(../images/card/card_suhyup.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 4rem;
  height: 4rem;
}

.cicon.cico15::after {
  background: url(../images/card/card_visa.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 4rem;
  height: 4rem;
}

.cicon.cico16::after {
  background: url(../images/card/card_woori.svg) no-repeat;
  background-size: cover;
  content: "";
  width: 4rem;
  height: 4rem;
}

/* 반응형 처리 */
/* 플렉스박스 */
/* Reset */
html, body, h1, h2, h3, h4, h5, h6, div, p, blockquote, pre, code, address, ul, ol, li, nav, section, article, header, footer, main, aside, dl, dt, dd, table, thead, tbody, tfoot, label, caption, th, td, form, fieldset, legend, hr, input, button, textarea, object, figure, figcaption {
  margin: 0;
  padding: 0;
}

body, input, select, textarea, button, img, fieldset {
  border: none;
}

ul, ol, li {
  list-style: none;
}

table {
  width: 100%;
  border-spacing: 0;
  border-collapse: collapse;
  table-layout: fixed;
}

address, cite, code, em, i {
  font-style: normal; /*font-weight:normal;*/
}

label, img, input, select, textarea, button, a {
  vertical-align: middle;
}

u, ins, a {
  text-decoration: none;
  color: unset;
}

button {
  cursor: pointer;
  background-color: transparent;
  color: unset;
}

caption > div, legend, .hide {
  overflow: hidden;
  display: block;
  position: absolute;
  border: 0;
  width: 1px;
  height: 1px;
  clip: rect(1px, 1px, 1px, 1px);
}

/* Normalize */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
}

input[type=number] {
  -moz-appearance: textfield;
  -webkit-appearance: textfield;
          appearance: textfield;
}

input[type=number],
input[type=text],
input[type=password],
input[type=url],
input[type=email],
input[type=tel],
input[type=date],
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0;
}

input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {
  -webkit-appearance: none;
}

img {
  width: 100%;
  height: auto;
  display: block;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

@font-face {
  font-family: "Pretendard";
  font-weight: 900;
  font-display: swap;
  src: local("Pretendard Black"), url("../fonts/pretendard/Pretendard-Black.woff2") format("woff2"), url("../fonts/pretendard/Pretendard-Black.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 800;
  font-display: swap;
  src: local("Pretendard ExtraBold"), url("../fonts/pretendard/Pretendard-ExtraBold.woff2") format("woff2"), url("../fonts/pretendard/Pretendard-ExtraBold.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 700;
  font-display: swap;
  src: local("Pretendard Bold"), url("../fonts/pretendard/Pretendard-Bold.woff2") format("woff2"), url("../fonts/pretendard/Pretendard-Bold.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 600;
  font-display: swap;
  src: local("Pretendard SemiBold"), url("../fonts/pretendard/Pretendard-SemiBold.woff2") format("woff2"), url("../fonts/pretendard/Pretendard-SemiBold.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 500;
  font-display: swap;
  src: local("Pretendard Medium"), url("../fonts/pretendard/Pretendard-Medium.woff2") format("woff2"), url("../fonts/pretendard/Pretendard-Medium.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 400;
  font-display: swap;
  src: local("Pretendard Regular"), url("../fonts/pretendard/Pretendard-Regular.woff2") format("woff2"), url("../fonts/pretendard/Pretendard-Regular.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 300;
  font-display: swap;
  src: local("Pretendard Light"), url("../fonts/pretendard/Pretendard-Light.woff2") format("woff2"), url("../fonts/pretendard/Pretendard-Light.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 200;
  font-display: swap;
  src: local("Pretendard ExtraLight"), url("../fonts/pretendard/Pretendard-ExtraLight.woff2") format("woff2"), url("../fonts/pretendard/Pretendard-ExtraLight.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 100;
  font-display: swap;
  src: local("Pretendard Thin"), url("../fonts/pretendard/Pretendard-Thin.woff2") format("woff2"), url("../fonts/pretendard/Pretendard-Thin.woff") format("woff");
}
html {
  font-size: 10px;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
  color: #000000;
  line-height: 1.4;
  word-break: keep-all;
}

body {
  font-size: 1rem;
}

* {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
}

.header {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0rem;
  background: #ffffff;
  width: 100%;
  height: 4.4rem;
  padding: 0 1.6rem;
  position: fixed;
  top: 0;
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.02));
  z-index: 999999;
}
.header .logo {
  margin: 0 auto;
}
.header .title {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 0.8rem;
}
.header .title p {
  font-size: 1.6rem;
  font-weight: 500;
  line-height: initial;
  color: #393941;
}

.bottom {
  position: fixed;
  bottom: 0.8rem;
  width: 100%;
}
.bottom_floating {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  gap: 0rem;
  margin-bottom: 0.8rem;
  filter: drop-shadow(0px 4px 16px rgba(23, 28, 97, 0.24));
}
.bottom_floating button {
  width: 5.6rem;
  height: 5.6rem;
  border-radius: 100rem;
  background: url(../images/ico_logo_coupang.png) no-repeat center center;
}
.bottom_navi {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 2.4rem;
  padding: 1.2rem;
  background: rgba(255, 255, 255, 0.8);
  -webkit-backdrop-filter: blur(1rem);
          backdrop-filter: blur(1rem);
  border-radius: 0.4rem;
  filter: drop-shadow(0px 4px 12px rgba(23, 28, 97, 0.12));
}
.bottom_navi li {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.4rem;
  flex: 1;
}
.bottom_navi li a {
  display: block;
  width: 100%;
  text-align: center;
  padding-top: 2.8rem;
  font-size: 1.2rem;
  color: #5d5e6c;
}
.bottom_navi li.on a {
  color: #212b8e;
}
.bottom_shortplay {
  background: url(../images/ico24_shortplay.svg) no-repeat top center;
  background-size: 2.4rem;
}
.bottom_shortplay.on {
  background: url(../images/ico24_shortplay_on.svg) no-repeat top center;
}
.bottom_gift {
  background: url(../images/ico24_gift.svg) no-repeat top center;
  background-size: 2.4rem;
}
.bottom_gift.on {
  background: url(../images/ico24_gift_on.svg) no-repeat top center;
}
.bottom_ticket {
  background: url(../images/ico24_ticket.svg) no-repeat top center;
  background-size: 2.4rem;
}
.bottom_ticket.on {
  background: url(../images/ico24_ticket_on.svg) no-repeat top center;
}
.bottom_wallet {
  background: url(../images/ico24_wallet.svg) no-repeat top center;
  background-size: 2.4rem;
}
.bottom_wallet.on {
  background: url(../images/ico24_wallet_on.svg) no-repeat top center;
}

.login_wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0rem;
}
.login_wrap .onboarding_img {
  width: 27.2rem;
}
.login_title {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1.6rem;
}
.login_desc {
  font-size: 1.6rem;
  color: #393941;
  line-height: 1;
}
.login_sns {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 1.2rem;
}
.login_sns strong {
  font-size: 1.4rem;
  font-weight: 400;
  color: #737584;
  line-height: 1;
}
.login_sns ul {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 1.6rem;
}
.login_sns ul li {
  width: 4.8rem;
  height: 4.8rem;
  outline: 1px solid #f7f7f8;
  border-radius: 100rem;
}
.login_sns ul li button {
  width: 100%;
  height: 100%;
}
.login_sns_kakao {
  background: url(../images/ico20_kakao.svg) no-repeat center center #ffe400;
}
.login_sns_naver {
  background: url(../images/ico20_naver.svg) no-repeat center center #00c300;
}
.login_sns_google {
  background: url(../images/ico20_google.svg) no-repeat center center #f7f7f8;
}
.login_sns_apple {
  background: url(../images/ico20_apple.svg) no-repeat center center #26262b;
}

.container {
  width: 100%;
  padding: 0 1.6rem;
  margin: 0 auto;
}

section {
  padding-top: 4.4rem;
}

.border_bottom {
  border-bottom: 0.8rem solid #eeeef0;
}

.info_box {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.6rem;
  padding: 2.4rem 1.6rem;
}
.info_box p {
  font-size: 1.6rem;
  font-weight: 700;
  color: #393941;
}

.dimmed-white, .dimmed {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 200;
  opacity: 50%;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

.dimmed {
  display: block;
  background: #000000;
}
.dimmed-white {
  display: block;
  background: #000000;
}

input {
  background-color: #f7f7f8;
  box-sizing: border-box;
  font-size: 1.4rem;
  color: #393941;
  outline: none;
  border-radius: 0.8rem !important;
  width: 100%;
  padding: 1.6rem;
}
input::-moz-placeholder {
  color: #b8b9c1;
}
input::placeholder {
  color: #b8b9c1;
}
input:disabled {
  color: #91939f;
}
input:focus {
  outline: 1px solid #1e29b5;
}

input {
  -o-appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.input_list {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  gap: 2.4rem;
  width: 100%;
}
.input_wrap label {
  font-size: 1.3rem;
  font-weight: 600;
  line-height: 1;
  color: #737584;
}
.input_wrap .warning {
  display: none;
  font-size: 1.2rem;
  line-height: 1;
  color: #db0c00;
  padding-left: 1.6rem;
  margin-top: 0.6rem;
}
.input_area {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 1.6rem;
  position: relative;
  margin-top: 0.8rem;
}
.input_area button {
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1;
  padding: 1.6rem;
}
.input_inner_text {
  position: absolute;
  top: 50%;
  right: 1.6rem;
  transform: translateY(-50%);
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1;
  color: #212b8e;
}

button:disabled {
  border-color: #ffffff !important;
  background-color: #ffffff !important;
  color: #ffffff !important;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.btn.full {
  width: 100%;
}

.icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.icon-nav {
  display: inline-flex;
  align-items: flex-start;
  justify-content: center;
}

.swiper-slide {
  width: 20.8rem;
}

.banner {
  overflow: visible;
}
.banner .swiper-slide {
  border-radius: 0.8rem;
  overflow: hidden;
}
.banner .swiper-pagination {
  position: relative;
  bottom: 0;
  margin-top: 1.2rem;
}
.banner .swiper-pagination .swiper-pagination-bullet {
  background: #eeeef0;
  opacity: 1;
  width: 0.8rem;
  height: 0.8rem;
}
.banner .swiper-pagination .swiper-pagination-bullet-active {
  background: #212b8e;
}

@media all and (max-width: 767px) {
  .break_lg {
    display: none;
  }
}

@media all and (max-width: 767px) and (min-width: 1024px) {
  .break_md {
    display: none;
  }
}

@media all and (min-width: 1023px) {
  .break_mo {
    display: none;
  }
}

.tabs {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 1.6rem;
  padding: 0 1.6rem;
  border-bottom: 1px solid #eeeef0;
  overflow-x: auto;
}
.tabs_menu a {
  display: block;
  padding: 1.6rem 0;
  font-size: 1.4rem;
  font-weight: 700;
  color: #b8b9c1;
  text-wrap: nowrap;
  line-height: 1;
}
.tabs_menu.on a {
  color: #171c61;
  border-bottom: 2px solid #171c61;
}

.category {
  /* 공연정보 필터 */
}
.category_grid {
  display: grid;
  padding: 2rem 1.6rem 15rem 1.6rem;
}
.category_grid.grid2 {
  grid-template-columns: repeat(2, 1fr);
  gap: 3rem 0.8rem;
}
.category_grid.grid2 .category_item {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.2rem;
  min-width: 0;
}
.category_grid.grid2 .category_item span {
  font-size: 1.2rem;
  color: #b8b9c1;
  display: block;
}
.category_grid.grid2 .category_item p {
  font-size: 1.5rem;
  font-weight: 500;
  color: #393941;
  max-width: -moz-fit-content;
  max-width: fit-content;
}
.category_grid.grid2 .category_item strong {
  display: block;
  font-size: 1.6rem;
  font-weight: 700;
  color: #393941;
}
.category_grid.grid2 .category_item_desc {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
}
.category_grid.grid3 {
  grid-template-columns: repeat(3, 1fr);
  gap: 2.4rem 1.4rem;
}
.category_item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.category_item img {
  border-radius: 1.2rem;
  aspect-ratio: 1;
}
.category_item p {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 1.4rem;
  color: #393941;
  line-height: 1;
  max-width: 100%;
}
.category_item .ticket_img {
  position: relative;
  width: 100%;
}
.category_item .ticket_img img {
  aspect-ratio: unset;
  height: 21.4rem;
  -o-object-fit: cover;
     object-fit: cover;
}
.category_item .ticket_badge {
  position: absolute;
  top: 0.8rem;
  left: 0.8rem;
  font-size: 1.2rem;
  font-weight: 600;
  line-height: 1;
  color: #ffffff;
  padding: 0.3rem 0.7rem;
  border-radius: 100rem;
}
.category_item .ticket_badge.ing {
  background: #171c61;
}
.category_item .ticket_badge.tobe {
  background: #6267b2;
}
.category_item .ticket_badge.end {
  background: #868686;
}
.category_item .ticket_title {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  white-space: break-spaces;
  word-break: break-all;
  line-height: 1.2;
}
.category_item .ticket_place {
  color: #171c61 !important;
}
.category_filter {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0rem;
  padding: 1rem 1.6rem;
  background: rgba(23, 28, 97, 0.02);
  border-bottom: 1px solid #eeeef0;
}
.category_filter li select {
  height: 2.6rem;
  padding: 0 1.2rem;
  border-radius: 100rem;
  border: 1px solid #b8b9c1;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-size: 1.2rem;
  font-weight: 600;
  color: #b8b9c1;
  background: url(../images/ico10_arrow_down_gray.svg) no-repeat calc(100% - 1.2rem) center #ffffff;
}
.category_filter li select option {
  color: #393941;
}
.category_filter_place {
  width: 6rem;
}
.category_filter_date {
  position: relative;
  /*  span {
      font-size: 1.2rem;
      font-weight: 600;
      color: $neutral300;
      position: absolute;
      top: 0.6rem;
      left: 1.2rem;
  } */
}
.category_filter_date input[type=date] {
  position: relative;
  padding: 0.7rem 0.8rem 0.7rem 1.2rem;
  width: 7.6rem;
  height: 2.6rem;
  background: url(../images/ico10_arrow_down_gray.svg) no-repeat calc(100% - 0.8rem) center #ffffff;
  border: 1px solid #b8b9c1;
  border-radius: 100rem !important;
}
.category_filter_date input[type=date]::before {
  content: "공연날짜";
  position: absolute;
  top: 0.6rem;
  left: 1.2rem;
  font-size: 1.2rem;
  font-weight: 600;
  color: #b8b9c1;
}
.category_filter_date input[type=date]::-webkit-calendar-picker-indicator {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  color: transparent;
  cursor: pointer;
  padding: 0;
}
.category_filter_date input[type=date]::-webkit-datetime-edit-text {
  -webkit-appearance: none;
  display: none;
}
.category_filter_date input[type=date]::-webkit-datetime-edit-month-field {
  -webkit-appearance: none;
  display: none;
}
.category_filter_date input[type=date]::-webkit-datetime-edit-day-field {
  -webkit-appearance: none;
  display: none;
}
.category_filter_date input[type=date]::-webkit-datetime-edit-year-field {
  -webkit-appearance: none;
  display: none;
}
.category_filter_performance {
  width: 9.6rem;
}
.category_filter_booking {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  padding: 0.7rem 1.2rem;
  background: #ffffff;
  height: 2.6rem;
  border: 1px solid #b8b9c1;
  border-radius: 100rem;
  font-size: 1.2rem;
  font-weight: 600;
  color: #b8b9c1;
}

.video {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0rem;
  position: absolute;
  width: 100%;
  height: 100%;
  scroll-snap-type: x mandatory;
}
.video_wrap {
  height: 100dvh;
}
.video_item {
  aspect-ratio: 9/16;
  scroll-snap-align: start;
}
.video_item video {
  display: block;
  -o-object-fit: contain;
     object-fit: contain;
  width: 100%;
  height: 100%;
}
.video_btn {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
  width: 100vw;
  position: fixed;
  top: 0.8rem;
  padding: 0 1.6rem;
  z-index: 1000;
}
.video_btn button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.4rem;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1;
  flex: 1;
  padding: 1.6rem 0.8rem;
}
.video_btn button img {
  width: -moz-fit-content;
  width: fit-content;
}

.balance {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-end;
  gap: 0.2rem;
}
.balance strong {
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1;
}
.balance .unit {
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1;
  color: #ffffff;
}
.balance_wrap {
  position: relative;
  padding: 2rem;
  background: #212b8e;
  border-radius: 0.8rem;
  color: #ffffff;
}
.balance_later {
  padding-top: 1.6rem;
  border-top: 1px solid rgba(238, 238, 240, 0.2);
}
.balance_later_item {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0rem;
}
.balance_later_amount {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-end;
  gap: 0.2rem;
}
.balance_later_amount p {
  font-size: 1.6rem;
  font-weight: 500;
  color: #ffffff;
}
.balance_history_btn {
  position: absolute;
  top: 2rem;
  right: 2rem;
}
.balance_history_btn button {
  padding: 0.8rem;
  border: 1px solid #ffffff;
  border-radius: 0.4rem;
  color: #ffffff;
  font-size: 1.4rem;
}
.balance_history_list_item {
  padding: 1.6rem 0;
  border-bottom: 1px solid #f7f7f8;
}
.balance_history_list_item > p {
  font-size: 1.4rem;
  font-weight: 700;
  color: #737584;
}

.datepicker {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
  padding: 1.2rem 1.6rem;
  background: #212b8e;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  border-radius: 100rem;
}
.datepicker button {
  width: 2rem;
  min-width: 2rem;
  height: 2rem;
}
.datepicker_prev {
  background: url(../images/ico20_solid_left.svg) no-repeat center center;
}
.datepicker_next {
  background: url(../images/ico20_solid_right.svg) no-repeat center center;
}
.datepicker input[type=month] {
  font-size: 1.6rem;
  color: #ffffff;
  background-color: transparent;
  padding: 0;
  position: relative;
}
.datepicker input[type=month]::-webkit-datetime-edit {
  display: contents;
}
.datepicker input[type=month]::-webkit-datetime-edit-fields-wrapper {
  margin: 0 auto;
}
.datepicker input[type=month]::-webkit-calendar-picker-indicator {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  color: transparent;
  cursor: pointer;
  padding: 0;
}

/* 적립 내역 텍스트 */
.reward_history {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 1.2rem;
  padding: 1.6rem 0;
}
.reward_history_list {
  margin-top: 1.2rem;
}
.reward_percent {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0rem;
  width: 4.8rem;
  min-width: 4.8rem;
  height: 4.8rem;
  border: 1px solid #eeeef0;
  border-radius: 0.4rem;
}
.reward_percent p {
  font-size: 1.3rem;
  font-weight: 700;
  color: #212b8e;
}
.reward_detail {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.2rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
}
.reward_detail_text {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0.6rem;
  width: 100%;
  line-height: 1;
}
.reward_detail_text > p {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 1.4rem;
  font-weight: 500;
}
.reward_detail_text span {
  font-size: 1.3rem;
  color: #b8b9c1;
}
.reward_detail_text strong:has(.reward_plus) span {
  color: #1e29b5;
}
.reward_detail_text strong span {
  font-size: 1.7rem;
  font-weight: 700;
  color: #393941;
}

.brand {
  padding: 2rem 1.6rem;
  border-bottom: 1px solid #f7f7f8;
}
.brand_title {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 1.2rem;
}
.brand_title_desc p,
.brand_title_desc span {
  line-height: 1;
  display: block;
}
.brand_img {
  width: 7.2rem;
  height: 7.2rem;
  border-radius: 0.8rem;
  overflow: hidden;
  border: 1px solid #d9d9de;
}
.brand_sort {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
  gap: 0rem;
}
.brand_sort_total span,
.brand_sort_total strong {
  line-height: 1;
}
.brand_sort_total span {
  font-size: 1.4rem;
  color: #737584;
}
.brand_sort_total strong {
  font-size: 1.6rem;
  font-weight: 700;
  color: #212b8e;
}

.product_detail_img {
  aspect-ratio: 1;
}
.product_detail_title {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  gap: 0rem;
  padding: 2.4rem 1.6rem;
  border-bottom: 0.8rem solid #eeeef0;
}
.product_detail_title span,
.product_detail_title p,
.product_detail_title strong {
  line-height: 1;
}
.product_detail_title .price {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: baseline;
  gap: 0.2rem;
}
.product_detail_title .price strong {
  font-size: 2.8rem;
  font-weight: 700;
  color: #393941;
}
.product_detail_title .info span {
  font-size: 1.4rem;
  color: #b8b9c1;
}
.product_detail_desc {
  padding: 2.4rem 1.6rem;
  border-bottom: 0.8rem solid #eeeef0;
}
.product_detail_desc_text pre {
  word-wrap: break-word;
  white-space: pre-wrap;
  font-size: 1.4rem;
  color: #393941;
  width: 100%;
}
.product_recommend_scroll {
  width: 100%;
}
.product_recommend_scroll:has(.category_grid) .category_grid {
  padding: 0;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  grid-auto-flow: column;
  grid-auto-columns: 160px;
  grid-template-columns: unset;
}
.product_recommend_scroll:has(.category_grid) .category_grid .category_item {
  scroll-snap-align: start;
  scroll-padding: 0 1.6rem;
}
.product_none {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1.6rem;
  width: 100%;
  height: 20.5rem;
}
.product_none span {
  font-size: 1.4rem;
  color: #91939f;
  text-align: center;
}

.unit {
  font-size: 1.4rem;
  font-weight: 500;
  color: #4c4d58;
}

.draw {
  height: 34.6rem;
}
.draw.none {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2rem;
}
.draw.none .none_card {
  width: 10.5rem;
}
.draw.none .none_card img {
  width: 100%;
  height: auto;
}
.draw.none p {
  text-align: center;
}
.draw_wrap {
  position: relative;
}
.draw_wrap:has(.draw_inner)::after {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 34.6rem;
  background: rgba(33, 43, 225, 0.6);
  border-radius: 100rem;
  filter: blur(4rem);
}
.draw img {
  width: auto;
  height: 100%;
}

.flip {
  width: 100%;
  height: 100%;
}
.flip .panel {
  width: 20.8rem;
  height: 34.6rem;
  position: relative;
  transform-style: preserve-3d;
  transform: perspective(60rem);
}
.flip .panel.on {
  transform: perspective(60rem) rotateY(180deg);
}
.flip .panel .front,
.flip .panel .random,
.flip .panel .back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}
.flip .panel .front {
  opacity: 0;
  visibility: hidden;
}
.flip .panel .back {
  transform: rotateY(180deg);
}

.open_effect {
  width: 100vw;
  height: 100dvh;
  position: absolute;
  top: 0;
  left: 0;
}
.open_effect_anim {
  position: absolute;
  top: 0;
  left: 0;
  width: -moz-fit-content;
  width: fit-content;
  height: 35rem;
}

.table {
  /* 지갑 페이지 로그인 기록 */
}
.table01 th,
.table01 td {
  padding: 1.2rem 0.8rem;
  text-align: center;
  line-height: 1;
}
.table01 th {
  background: #f7f7f8;
  font-size: 1.4rem;
  font-weight: 600;
  color: #393941;
}
.table01 td {
  font-size: 1.3rem;
  color: #737584;
}

.popup {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -46%);
  background: #ffffff;
  filter: drop-shadow(0px 4px 16px rgba(0, 0, 0, 0.24));
  border-radius: 1.2rem;
  overflow: hidden;
  width: 100%;
  max-width: 34.2rem;
  transition: 0.3s all;
  transition-timing-function: ease-out;
}
.popup_wrap {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  visibility: hidden;
  opacity: 0;
  transition: 0.3s all;
  transition-timing-function: ease-out;
}
.popup_wrap.on {
  visibility: visible;
  opacity: 1;
}
.popup_wrap.on .popup {
  transform: translate(-50%, -50%);
}
.popup_body .warning {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 1.2rem;
  max-height: 12.6rem;
}
.popup_body .warning p {
  color: #91939f;
}
.popup_body p {
  font-size: 1.6rem;
  font-weight: 500;
  color: #393941;
  text-align: center;
}
.popup_footer {
  width: 100%;
}
.popup_footer .full_btn {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0rem;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
.popup_footer .full_btn button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.6rem;
  flex: 1;
  padding: 1.6rem 0;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1;
  color: #ffffff;
}
.popup_footer .full_btn button img {
  width: 1.8rem;
  height: 1.8rem;
}
.popup_footer .full_btn button:last-child {
  border-left: 1px solid #737584;
}
.popup_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  z-index: -1;
}

.onboarding {
  display: none;
}
.onboarding[data-onboarding=first] {
  display: block;
}
.onboarding:has(.onboarding_etc) .onboarding_header {
  padding-top: 50%;
}
.onboarding_wrap {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  background: #000000;
  overflow-y: auto;
}
.onboarding_wrap:has(.onboarding_img) {
  background: rgba(0, 0, 0, 0.9);
}
.onboarding_close {
  background: url(../images/ico24_close_wt.svg) no-repeat center center;
  padding: 1rem;
  position: absolute;
  top: 0;
  right: 0;
  width: 4rem;
  height: 4rem;
}
.onboarding_line {
  width: 16rem;
  height: 0.1rem;
  background: rgba(255, 255, 255, 0.2);
}
.onboarding .app_icon_lg {
  width: 6.3rem;
  height: 6.3rem;
  border-radius: 0.8rem;
  overflow: hidden;
}
.onboarding .app_icon_sm {
  width: 4.3rem;
  height: 4.3rem;
  border-radius: 0.4rem;
  overflow: hidden;
}
.onboarding_header {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0rem;
  gap: 1.8rem;
  position: relative;
}
.onboarding_header:has(.app_icon_lg) {
  gap: 3rem;
}
.onboarding_header:has(.app_icon_lg) .onboarding_close,
.onboarding_header:has(.app_icon_lg) .onboarding_line,
.onboarding_header:has(.app_icon_lg) .onboarding_footer {
  display: none;
}
.onboarding_header strong {
  font-size: 2.2rem;
  font-weight: 700;
  color: #ffffff;
  text-align: center;
}
.onboarding_contents {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0rem;
}
.onboarding_contents:has(.onboarding_order) {
  padding-bottom: 15rem;
}
.onboarding_contents b {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1;
  color: #ffffff;
  align-self: flex-start;
  padding-left: 1.4rem;
  padding-bottom: 1.8rem;
}
.onboarding_img {
  border-top-left-radius: 2rem;
  border-top-right-radius: 2rem;
  overflow: hidden;
  position: relative;
  width: 20rem;
  filter: drop-shadow(0px 0px 10px rgba(255, 255, 255, 0.25));
}
.onboarding_img::after {
  content: "";
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 6.8rem;
  background: linear-gradient(to top, #000000 0%, rgba(0, 0, 0, 0) 100%);
}
.onboarding_btn {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 1rem;
}
.onboarding_btn .cta {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0rem;
  background: #ff5257;
  font-weight: 700;
  line-height: 1;
  color: #ffffff;
}
.onboarding_btn .cta.lg {
  font-size: 1.7rem;
  border-radius: 10rem;
  padding: 2rem 0;
  width: 28rem;
}
.onboarding_btn .cta.sm {
  font-size: 1.5rem;
  border-radius: 1.6rem;
  padding: 1.2rem;
}
.onboarding_btn .cta02 {
  font-size: 1.2rem;
  line-height: 1;
  color: rgba(255, 255, 255, 0.8);
  padding: 1.2rem 0;
}
.onboarding_order {
  scroll-margin-top: 6rem;
}
.onboarding_order li {
  font-size: 1.3rem;
  line-height: 1;
  color: #ffffff;
}
.onboarding_order li:nth-child(n+2) {
  margin-top: 3.5rem;
}
.onboarding_order_img {
  border-radius: 2rem;
  overflow: clip;
  margin-top: 1.8rem;
}
.onboarding_etc ~ p {
  font-size: 1.4rem;
  color: #ffffff;
  text-align: center;
}
.onboarding_etc ~ p em {
  font-weight: 800;
}
.onboarding_etc ~ span {
  font-size: 1.3rem;
  color: #ffffff;
}
.onboarding_footer {
  position: fixed;
  bottom: 0;
  width: 100%;
  background: #171c61;
  padding: 2.4rem 0;
}
.onboarding_footer_inner {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0rem;
}
.onboarding_footer_inner p {
  font-size: 1.6rem;
  font-weight: 600;
  color: #ffffff;
}
.onboarding_footer_inner span {
  font-size: 1.2rem;
  color: rgba(255, 255, 255, 0.9);
}

.agent {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 3.2rem;
}
.agent_item {
  width: 4.8rem;
  height: 4.8rem;
  border: 1px solid #f7f7f8;
  border-radius: 100rem;
}
.agent_item.ios {
  background: url(../images/ico20_apple.svg) no-repeat center center #26262b;
}
.agent_item.android {
  background: url(../images/ico20_android.svg) no-repeat center center #f7f7f8;
}

.ticket_detail_thumb {
  position: relative;
  width: 100%;
  height: 48rem;
}
.ticket_detail_thumb img {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.ticket_detail_thumb::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(105, 105, 105, 0) 100%);
}
.ticket_detail_title {
  position: absolute;
  bottom: 3.5rem;
  z-index: 1;
}
.ticket_detail_title strong {
  font-size: 2.4rem;
  font-weight: 600;
  color: #ffffff;
  line-height: 1.2;
}
.ticket_detail_desc {
  padding: 2.4rem 1.6rem 3rem 1.6rem;
  border-bottom: 0.8rem solid #eeeef0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.ticket_detail_desc dl {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 1.4rem;
  font-size: 1.4rem;
  color: #393941;
}
.ticket_detail_desc dl dt {
  font-weight: 600;
  width: 5.2rem;
  min-width: 5.2rem;
  height: 1.8rem;
  text-align: justify;
}
.ticket_detail_desc dl dt::after {
  content: "";
  display: inline-block;
  width: 100%;
}
.ticket_detail_desc dl dd ul li:nth-child(n+2) {
  margin-top: 0.2rem;
}
.ticket_detail_content {
  font-size: 1.4rem;
}
.ticket_detail_content .ticket_detail_desc {
  border-bottom: 0;
}
/* text */
.word {
  word-break: break-all;
}

h2 {
  font-size: 7rem;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 1.2;
  color: #ffffff;
  transform-origin: left;
}
@media all and (max-width: 1023px) {
  h2 {
    font-size: 3.6rem;
  }
}
@media all and (max-width: 767px) {
  h2 {
    font-size: 3rem;
  }
}

h3 {
  font-size: 4rem;
  font-weight: 700;
  color: #ffffff;
  transform-origin: left;
}
@media all and (max-width: 1023px) {
  h3 {
    font-size: 3rem;
  }
}
@media all and (max-width: 767px) {
  h3 {
    font-size: 2rem;
  }
}

h4 {
  font-size: 2.4rem;
  font-weight: 600;
  color: #ffffff;
  transform-origin: left;
}
@media all and (max-width: 1023px) {
  h4 {
    font-size: 2rem;
  }
}
@media all and (max-width: 767px) {
  h4 {
    font-size: 1.6rem;
  }
}

h5 {
  font-size: 1.8rem;
  font-weight: 700;
  color: #ffffff;
  transform-origin: left;
}
@media all and (max-width: 1023px) {
  h5 {
    font-size: 1.6rem;
  }
}
@media all and (max-width: 767px) {
  h5 {
    font-size: 1.4rem;
  }
}

.txt {
  display: inline-block;
}
.txt-24 {
  font-size: 2.4rem;
}
.txt-18 {
  font-size: 1.8rem;
}
.txt-16 {
  font-size: 1.6rem;
}
.txt-15 {
  font-size: 1.5rem;
}
.txt-14 {
  font-size: 1.4rem;
}
.txt-13 {
  font-size: 1.3rem;
}
.txt-12 {
  font-size: 1.2rem;
}
.txt-underline {
  text-decoration: underline;
}

.fs-24 {
  font-size: 2.4rem;
}

.black {
  font-weight: 900;
}

.bold {
  font-weight: 700;
}

.smbold {
  font-weight: 600;
}

.medium {
  font-weight: 500;
}

.ellipsis1 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 140%;
}

.ellipsis2 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-height: 140%;
}

.ellipsis3 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-height: 140%;
}

.ellipsis1 {
  display: block;
}

/* align */
.align {
  display: flex;
}
.align.inline {
  display: inline-flex;
}
.align.right {
  justify-content: flex-end;
}
.align.center {
  justify-content: center;
}
.align.both {
  justify-content: space-between;
}
.align.bottom {
  position: fixed;
  left: 2rem;
  right: 2rem;
  bottom: 3rem;
}
.align.f-wrap {
  flex-wrap: wrap;
}
.align.col {
  flex-direction: column;
}
.align.vt {
  align-items: flex-start;
}
.align.vm {
  align-items: center;
}
.align.vb {
  align-items: flex-end;
}
.align.triple {
  display: block;
  position: relative;
}
.align.triple::after {
  content: "";
  display: block;
  clear: both;
}
.align.triple .left {
  float: left;
}
.align.triple .right {
  float: right;
}
.align.triple .center {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
}
.align.triple .bottom {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
}
.align-btn {
  display: flex;
  gap: 1rem;
}
.align-btn .btn {
  flex: 1;
}

.gap4 {
  gap: 0.4rem;
}
.gap5 {
  gap: 0.5rem;
}
.gap8 {
  gap: 0.8rem;
}
.gap10 {
  gap: 1rem;
}
.gap12 {
  gap: 1.2rem;
}
.gap15 {
  gap: 1.5rem;
}
.gap20 {
  gap: 2rem;
}

.txt_left {
  text-align: left !important;
}
.txt_center {
  text-align: center !important;
}
.txt_right {
  text-align: right !important;
}

.flex {
  display: flex;
}
.flex > * {
  flex: 1;
}
.flex.none {
  flex: none;
}

.mt0 {
  margin-top: 0rem;
}
.mt2 {
  margin-top: 0.2rem;
}
.mt3 {
  margin-top: 0.3rem;
}
.mt4 {
  margin-top: 0.4rem;
}
.mt5 {
  margin-top: 0.5rem;
}
.mt6 {
  margin-top: 0.6rem;
}
.mt8 {
  margin-top: 0.8rem;
}
.mt10 {
  margin-top: 1rem;
}
.mt12 {
  margin-top: 1.2rem;
}
.mt14 {
  margin-top: 1.4rem;
}
.mt15 {
  margin-top: 1.5rem;
}
.mt16 {
  margin-top: 1.6rem;
}
.mt18 {
  margin-top: 1.8rem;
}
.mt20 {
  margin-top: 2rem;
}
.mt22 {
  margin-top: 2.2rem;
}
.mt24 {
  margin-top: 2.4rem;
}
.mt25 {
  margin-top: 2.5rem;
}
.mt26 {
  margin-top: 2.6rem;
}
.mt28 {
  margin-top: 2.8rem;
}
.mt30 {
  margin-top: 3rem;
}
.mt32 {
  margin-top: 3.2rem;
}
.mt34 {
  margin-top: 3.4rem;
}
.mt36 {
  margin-top: 3.6rem;
}
.mt38 {
  margin-top: 3.8rem;
}
.mt40 {
  margin-top: 4rem;
}
.mt46 {
  margin-top: 4.6rem;
}
.mt48 {
  margin-top: 4.8rem;
}
.mt50 {
  margin-top: 5rem;
}
.mt60 {
  margin-top: 6rem;
}
.mt70 {
  margin-top: 7rem;
}
.mt80 {
  margin-top: 8rem;
}
.mt90 {
  margin-top: 9rem;
}
.mt100 {
  margin-top: 10rem;
}
.mt120 {
  margin-top: 12rem;
}
.mt140 {
  margin-top: 14rem;
}
.mt160 {
  margin-top: 16rem;
}
.mt180 {
  margin-top: 18rem;
}
.mt200 {
  margin-top: 20rem;
}
.mt_responsive_sm {
  margin-top: 2rem;
}
@media all and (max-width: 767px) {
  .mt_responsive_sm {
    margin-top: 1rem;
  }
}
.mt_responsive_lg {
  margin-top: 8rem;
}
@media all and (max-width: 1023px) {
  .mt_responsive_lg {
    margin-top: 4rem;
  }
}
@media all and (max-width: 767px) {
  .mt_responsive_lg {
    margin-top: 3rem;
  }
}

.mb0 {
  margin-bottom: 0rem;
}
.mb2 {
  margin-bottom: 0.2rem;
}
.mb3 {
  margin-bottom: 0.3rem;
}
.mb4 {
  margin-bottom: 0.4rem;
}
.mb5 {
  margin-bottom: 0.5rem;
}
.mb6 {
  margin-bottom: 0.6rem;
}
.mb8 {
  margin-bottom: 0.8rem;
}
.mb10 {
  margin-bottom: 1rem;
}
.mb12 {
  margin-bottom: 1.2rem;
}
.mb14 {
  margin-bottom: 1.4rem;
}
.mb15 {
  margin-bottom: 1.5rem;
}
.mb16 {
  margin-bottom: 1.6rem;
}
.mb18 {
  margin-bottom: 1.8rem;
}
.mb20 {
  margin-bottom: 2rem;
}
.mb22 {
  margin-bottom: 2.2rem;
}
.mb24 {
  margin-bottom: 2.4rem;
}
.mb25 {
  margin-bottom: 2.5rem;
}
.mb26 {
  margin-bottom: 2.6rem;
}
.mb28 {
  margin-bottom: 2.8rem;
}
.mb30 {
  margin-bottom: 3rem;
}
.mb32 {
  margin-bottom: 3.2rem;
}
.mb34 {
  margin-bottom: 3.4rem;
}
.mb36 {
  margin-bottom: 3.6rem;
}
.mb38 {
  margin-bottom: 3.8rem;
}
.mb40 {
  margin-bottom: 4rem;
}
.mb46 {
  margin-bottom: 4.6rem;
}
.mb48 {
  margin-bottom: 4.8rem;
}
.mb50 {
  margin-bottom: 5rem;
}
.mb60 {
  margin-bottom: 6rem;
}
.mb70 {
  margin-bottom: 7rem;
}
.mb80 {
  margin-bottom: 8rem;
}
.mb90 {
  margin-bottom: 9rem;
}
.mb100 {
  margin-bottom: 10rem;
}
.mb120 {
  margin-bottom: 12rem;
}
.mb140 {
  margin-bottom: 14rem;
}
.mb160 {
  margin-bottom: 16rem;
}
.mb180 {
  margin-bottom: 18rem;
}
.mb200 {
  margin-bottom: 20rem;
}

.ml0 {
  margin-left: 0rem;
}
.ml2 {
  margin-left: 0.2rem;
}
.ml3 {
  margin-left: 0.3rem;
}
.ml4 {
  margin-left: 0.4rem;
}
.ml5 {
  margin-left: 0.5rem;
}
.ml6 {
  margin-left: 0.6rem;
}
.ml8 {
  margin-left: 0.8rem;
}
.ml10 {
  margin-left: 1rem;
}
.ml12 {
  margin-left: 1.2rem;
}
.ml14 {
  margin-left: 1.4rem;
}
.ml15 {
  margin-left: 1.5rem;
}
.ml16 {
  margin-left: 1.6rem;
}
.ml18 {
  margin-left: 1.8rem;
}
.ml20 {
  margin-left: 2rem;
}
.ml22 {
  margin-left: 2.2rem;
}
.ml24 {
  margin-left: 2.4rem;
}
.ml25 {
  margin-left: 2.5rem;
}
.ml26 {
  margin-left: 2.6rem;
}
.ml28 {
  margin-left: 2.8rem;
}
.ml30 {
  margin-left: 3rem;
}
.ml32 {
  margin-left: 3.2rem;
}
.ml34 {
  margin-left: 3.4rem;
}
.ml36 {
  margin-left: 3.6rem;
}
.ml38 {
  margin-left: 3.8rem;
}
.ml40 {
  margin-left: 4rem;
}
.ml46 {
  margin-left: 4.6rem;
}
.ml48 {
  margin-left: 4.8rem;
}
.ml50 {
  margin-left: 5rem;
}
.ml60 {
  margin-left: 6rem;
}
.ml70 {
  margin-left: 7rem;
}
.ml80 {
  margin-left: 8rem;
}
.ml90 {
  margin-left: 9rem;
}
.ml100 {
  margin-left: 10rem;
}
.ml120 {
  margin-left: 12rem;
}
.ml140 {
  margin-left: 14rem;
}
.ml160 {
  margin-left: 16rem;
}
.ml180 {
  margin-left: 18rem;
}
.ml200 {
  margin-left: 20rem;
}

.mr0 {
  margin-right: 0rem;
}
.mr2 {
  margin-right: 0.2rem;
}
.mr3 {
  margin-right: 0.3rem;
}
.mr4 {
  margin-right: 0.4rem;
}
.mr5 {
  margin-right: 0.5rem;
}
.mr6 {
  margin-right: 0.6rem;
}
.mr7 {
  margin-right: 0.7rem;
}
.mr8 {
  margin-right: 0.8rem;
}
.mr10 {
  margin-right: 1rem;
}
.mr12 {
  margin-right: 1.2rem;
}
.mr14 {
  margin-right: 1.4rem;
}
.mr15 {
  margin-right: 1.5rem;
}
.mr16 {
  margin-right: 1.6rem;
}
.mr18 {
  margin-right: 1.8rem;
}
.mr20 {
  margin-right: 2rem;
}
.mr22 {
  margin-right: 2.2rem;
}
.mr24 {
  margin-right: 2.4rem;
}
.mr25 {
  margin-right: 2.5rem;
}
.mr26 {
  margin-right: 2.6rem;
}
.mr28 {
  margin-right: 2.8rem;
}
.mr30 {
  margin-right: 3rem;
}
.mr32 {
  margin-right: 3.2rem;
}
.mr34 {
  margin-right: 3.4rem;
}
.mr36 {
  margin-right: 3.6rem;
}
.mr38 {
  margin-right: 3.8rem;
}
.mr40 {
  margin-right: 4rem;
}
.mr46 {
  margin-right: 4.6rem;
}
.mr48 {
  margin-right: 4.8rem;
}
.mr50 {
  margin-right: 5rem;
}
.mr60 {
  margin-right: 6rem;
}
.mr70 {
  margin-right: 7rem;
}
.mr80 {
  margin-right: 8rem;
}
.mr90 {
  margin-right: 9rem;
}
.mr100 {
  margin-right: 10rem;
}
.mr120 {
  margin-right: 12rem;
}
.mr140 {
  margin-right: 14rem;
}
.mr160 {
  margin-right: 16rem;
}
.mr180 {
  margin-right: 18rem;
}
.mr200 {
  margin-right: 20rem;
}

.pt0 {
  padding-top: 0rem;
}
.pt2 {
  padding-top: 0.2rem;
}
.pt3 {
  padding-top: 0.3rem;
}
.pt4 {
  padding-top: 0.4rem;
}
.pt5 {
  padding-top: 0.5rem;
}
.pt6 {
  padding-top: 0.6rem;
}
.pt8 {
  padding-top: 0.8rem;
}
.pt10 {
  padding-top: 1rem;
}
.pt12 {
  padding-top: 1.2rem;
}
.pt14 {
  padding-top: 1.4rem;
}
.pt15 {
  padding-top: 1.5rem;
}
.pt16 {
  padding-top: 1.6rem;
}
.pt18 {
  padding-top: 1.8rem;
}
.pt20 {
  padding-top: 2rem;
}
.pt22 {
  padding-top: 2.2rem;
}
.pt24 {
  padding-top: 2.4rem;
}
.pt25 {
  padding-top: 2.5rem;
}
.pt26 {
  padding-top: 2.6rem;
}
.pt28 {
  padding-top: 2.8rem;
}
.pt30 {
  padding-top: 3rem;
}
.pt32 {
  padding-top: 3.2rem;
}
.pt34 {
  padding-top: 3.4rem;
}
.pt36 {
  padding-top: 3.6rem;
}
.pt38 {
  padding-top: 3.8rem;
}
.pt40 {
  padding-top: 4rem;
}
.pt46 {
  padding-top: 4.6rem;
}
.pt48 {
  padding-top: 4.8rem;
}
.pt50 {
  padding-top: 5rem;
}
.pt60 {
  padding-top: 6rem;
}
.pt70 {
  padding-top: 7rem;
}
.pt80 {
  padding-top: 8rem;
}
.pt90 {
  padding-top: 9rem;
}
.pt100 {
  padding-top: 10rem;
}
.pt120 {
  padding-top: 12rem;
}
.pt140 {
  padding-top: 14rem;
}
.pt160 {
  padding-top: 16rem;
}
.pt180 {
  padding-top: 18rem;
}
.pt200 {
  padding-top: 20rem;
}

.pl0 {
  padding-left: 0rem;
}
.pl2 {
  padding-left: 0.2rem;
}
.pl3 {
  padding-left: 0.3rem;
}
.pl4 {
  padding-left: 0.4rem;
}
.pl5 {
  padding-left: 0.5rem;
}
.pl6 {
  padding-left: 0.6rem;
}
.pl8 {
  padding-left: 0.8rem;
}
.pl10 {
  padding-left: 1rem;
}
.pl12 {
  padding-left: 1.2rem;
}
.pl14 {
  padding-left: 1.4rem;
}
.pl15 {
  padding-left: 1.5rem;
}
.pl16 {
  padding-left: 1.6rem;
}
.pl18 {
  padding-left: 1.8rem;
}
.pl20 {
  padding-left: 2rem;
}
.pl22 {
  padding-left: 2.2rem;
}
.pl24 {
  padding-left: 2.4rem;
}
.pl25 {
  padding-left: 2.5rem;
}
.pl26 {
  padding-left: 2.6rem;
}
.pl28 {
  padding-left: 2.8rem;
}
.pl30 {
  padding-left: 3rem;
}
.pl32 {
  padding-left: 3.2rem;
}
.pl34 {
  padding-left: 3.4rem;
}
.pl36 {
  padding-left: 3.6rem;
}
.pl38 {
  padding-left: 3.8rem;
}
.pl40 {
  padding-left: 4rem;
}
.pl46 {
  padding-left: 4.6rem;
}
.pl48 {
  padding-left: 4.8rem;
}
.pl50 {
  padding-left: 5rem;
}
.pl60 {
  padding-left: 6rem;
}
.pl70 {
  padding-left: 7rem;
}
.pl80 {
  padding-left: 8rem;
}
.pl90 {
  padding-left: 9rem;
}
.pl100 {
  padding-left: 10rem;
}
.pl120 {
  padding-left: 12rem;
}
.pl140 {
  padding-left: 14rem;
}
.pl160 {
  padding-left: 16rem;
}
.pl180 {
  padding-left: 18rem;
}
.pl200 {
  padding-left: 20rem;
}

.pr0 {
  padding-right: 0rem;
}
.pr2 {
  padding-right: 0.2rem;
}
.pr3 {
  padding-right: 0.3rem;
}
.pr4 {
  padding-right: 0.4rem;
}
.pr5 {
  padding-right: 0.5rem;
}
.pr6 {
  padding-right: 0.6rem;
}
.pr8 {
  padding-right: 0.8rem;
}
.pr10 {
  padding-right: 1rem;
}
.pr12 {
  padding-right: 1.2rem;
}
.pr14 {
  padding-right: 1.4rem;
}
.pr15 {
  padding-right: 1.5rem;
}
.pr16 {
  padding-right: 1.6rem;
}
.pr18 {
  padding-right: 1.8rem;
}
.pr20 {
  padding-right: 2rem;
}
.pr22 {
  padding-right: 2.2rem;
}
.pr24 {
  padding-right: 2.4rem;
}
.pr25 {
  padding-right: 2.5rem;
}
.pr26 {
  padding-right: 2.6rem;
}
.pr28 {
  padding-right: 2.8rem;
}
.pr30 {
  padding-right: 3rem;
}
.pr32 {
  padding-right: 3.2rem;
}
.pr34 {
  padding-right: 3.4rem;
}
.pr36 {
  padding-right: 3.6rem;
}
.pr38 {
  padding-right: 3.8rem;
}
.pr40 {
  padding-right: 4rem;
}
.pr46 {
  padding-right: 4.6rem;
}
.pr48 {
  padding-right: 4.8rem;
}
.pr50 {
  padding-right: 5rem;
}
.pr60 {
  padding-right: 6rem;
}
.pr70 {
  padding-right: 7rem;
}
.pr80 {
  padding-right: 8rem;
}
.pr90 {
  padding-right: 9rem;
}
.pr100 {
  padding-right: 10rem;
}
.pr120 {
  padding-right: 12rem;
}
.pr140 {
  padding-right: 14rem;
}
.pr160 {
  padding-right: 16rem;
}
.pr180 {
  padding-right: 18rem;
}
.pr200 {
  padding-right: 20rem;
}

.pb0 {
  padding-bottom: 0rem;
}
.pb2 {
  padding-bottom: 0.2rem;
}
.pb3 {
  padding-bottom: 0.3rem;
}
.pb4 {
  padding-bottom: 0.4rem;
}
.pb5 {
  padding-bottom: 0.5rem;
}
.pb6 {
  padding-bottom: 0.6rem;
}
.pb8 {
  padding-bottom: 0.8rem;
}
.pb10 {
  padding-bottom: 1rem;
}
.pb12 {
  padding-bottom: 1.2rem;
}
.pb14 {
  padding-bottom: 1.4rem;
}
.pb15 {
  padding-bottom: 1.5rem;
}
.pb16 {
  padding-bottom: 1.6rem;
}
.pb18 {
  padding-bottom: 1.8rem;
}
.pb20 {
  padding-bottom: 2rem;
}
.pb22 {
  padding-bottom: 2.2rem;
}
.pb24 {
  padding-bottom: 2.4rem;
}
.pb25 {
  padding-bottom: 2.5rem;
}
.pb26 {
  padding-bottom: 2.6rem;
}
.pb28 {
  padding-bottom: 2.8rem;
}
.pb30 {
  padding-bottom: 3rem;
}
.pb32 {
  padding-bottom: 3.2rem;
}
.pb34 {
  padding-bottom: 3.4rem;
}
.pb36 {
  padding-bottom: 3.6rem;
}
.pb38 {
  padding-bottom: 3.8rem;
}
.pb40 {
  padding-bottom: 4rem;
}
.pb46 {
  padding-bottom: 4.6rem;
}
.pb48 {
  padding-bottom: 4.8rem;
}
.pb50 {
  padding-bottom: 5rem;
}
.pb60 {
  padding-bottom: 6rem;
}
.pb70 {
  padding-bottom: 7rem;
}
.pb80 {
  padding-bottom: 8rem;
}
.pb90 {
  padding-bottom: 9rem;
}
.pb100 {
  padding-bottom: 10rem;
}
.pb120 {
  padding-bottom: 12rem;
}
.pb140 {
  padding-bottom: 14rem;
}
.pb160 {
  padding-bottom: 16rem;
}
.pb180 {
  padding-bottom: 18rem;
}
.pb200 {
  padding-bottom: 20rem;
}