@charset "UTF-8";
.theme_1 {
  --primary: #358DFF;
}

.theme_2 {
  --primary: #25552E;
}

.theme_3 {
  --primary: #F17551;
}

.menu {
  margin-top: 54px;
  padding-bottom: 54px;
  border-top: 0.33px solid rgba(0, 0, 0, 0.3);
  font-size: 14px;
  overflow: auto;
}
.header_container:has(.gnb) + .menu {
  margin-bottom: 85px;
}
.header_container:has(.gnb) + .menu .fixed_bottom {
  bottom: 85px;
}
.menu:has(.fixed_bottom) {
  padding-bottom: 40px;
}

.menu .tab {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0 10px;
  border-bottom: 1px solid #E2E2E2;
  background-color: #fff;
}
.menu .tab li a {
  border-bottom: 4px solid transparent;
  display: block;
  width: 86px;
  box-sizing: border-box;
  padding: 12px 0 10px;
  text-align: center;
  font-size: 14px;
  line-height: 1;
}
.menu .tab li a.active {
  font-weight: 700;
  border-color: var(--primary);
}

.menu .fixed_bottom {
  display: flex;
  position: fixed;
  bottom: 0;
  width: 100%;
  max-width: 768px;
  margin: 0 auto;
}
.menu .fixed_bottom button {
  flex: 1;
  border: 0 none;
  height: 40px;
  color: #fff;
  background-color: var(--primary);
  font-size: 14px;
  font-weight: 700;
}
.fixed_bottom button {
  height: 52px !important;
}

@font-face {
  font-family: "NanumSquare";
  font-weight: 400;
  src: url(../fonts/NanumSquare/NanumSquareR.eot);
  src: local("☺"), url(../fonts/NanumSquare/NanumSquareR.eot?#iefix) format("embedded-opentype"), url(../fonts/NanumSquare/NanumSquareR.woff2) format("woff2"), url(../fonts/NanumSquare/NanumSquareR.woff) format("woff"), url(../fonts/NanumSquare/NanumSquareR.ttf) format("truetype");
}
@font-face {
  font-family: "NanumSquare";
  font-weight: 700;
  src: url(../fonts/NanumSquare/NanumSquareB.eot);
  src: local("☺"), url(../fonts/NanumSquare/NanumSquareB.eot?#iefix) format("embedded-opentype"), url(../fonts/NanumSquare/NanumSquareB.woff2) format("woff2"), url(../fonts/NanumSquare/NanumSquareB.woff) format("woff"), url(../fonts/NanumSquare/NanumSquareB.ttf) format("truetype");
}
@font-face {
  font-family: "NanumSquare";
  font-weight: 800;
  src: url(../fonts/NanumSquare/NanumSquareEB.eot);
  src: local("☺"), url(../fonts/NanumSquare/NanumSquareEB.eot?#iefix) format("embedded-opentype"), url(../fonts/NanumSquare/NanumSquareEB.woff2) format("woff2"), url(../fonts/NanumSquare/NanumSquareEB.woff) format("woff"), url(../fonts/NanumSquare/NanumSquareEB.ttf) format("truetype");
}
@font-face {
  font-family: "NanumSquare";
  font-weight: 300;
  src: url(../fonts/NanumSquare/NanumSquareL.eot);
  src: local("☺"), url(../fonts/NanumSquare/NanumSquareL.eot?#iefix) format("embedded-opentype"), url(../fonts/NanumSquare/NanumSquareL.woff2) format("woff2"), url(../fonts/NanumSquare/NanumSquareL.woff) format("woff"), url(../fonts/NanumSquare/NanumSquareL.ttf) format("truetype");
}
/* reset
--------------------------*/

* {
  -webkit-text-size-adjust: 100% !important;
  -moz-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
}

html, body {
  margin: 0;
  padding: 0;
  font-family: "NanumSquare", "Malgun Gothic", "Segoe UI", AppleSDGothicNeo, "Apple SD Gothic Neo", "Apple SD 산돌고딕 Neo", "Microsoft NeoGothic", "Droid sans", Verdana, arial, sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.43;
  color: #1F1F1F;
}

dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote {
  margin: 0;
  padding: 0;
}

th, td, input, textarea, select, button {
  font-size: inherit;
  color: inherit;
  font-family: inherit;
  padding: 0;
}

th, td {
  word-break: break-all;
  word-wrap: break-word;
}

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

address, caption, cite, code, dfn, em, var {
  font-style: normal;
  font-weight: normal;
}

em {
  font-weight: inherit;
}

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

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
}

abbr, acronym {
  border: 0;
}

hr {
  clear: both;
  display: none;
}

legend {
  visibility: hidden;
  overflow: hidden;
  line-height: 0;
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
  text-indent: -99999px;
  font-size: 0;
}

img, fieldset {
  border: 0 none;
}

label {
  cursor: pointer;
}

a {
  text-decoration: none;
  color: #1F1F1F;
}

a:active {
  text-decoration: none;
}

input, img {
  vertical-align: middle;
}

input, button {
  border: 1px solid #151515;
  border-radius: 0;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  outline: 0;
  color: #1D1D1D;
}

input:disabled {
  color: #9b9b9b;
  background-color: #f4f4f4;
}

input[type='date'] {
  position: relative;
  appearance: none;
}

input[type="date"]::-webkit-clear-button,
input[type="date"]::-webkit-inner-spin-button {
  display: none;
}

input[type='date']::-webkit-calendar-picker-indicator {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  color: transparent;
}

input[type=date]::before {
  display: flex;
  align-items: center;
  width: 100%;
  color: #444444;
  content: attr(placeholder);
}

input::-internal-datetime-container {
  display: none;
}

input[type=date]:focus::before,
input[type=date]:valid::before {
  display: none;
}

input:focus::-internal-datetime-container {
  display: block;
}

button {
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  outline: 0;
}

textarea {
  resize: none;
  border: 0;
  -webkit-appearance: none;
}

td {
  font-weight: 400;
}

::-moz-placeholder {
  color: #C5C5C5;
  font-weight: 400;
}

::placeholder {
  color: #C5C5C5;
  font-weight: 400;
}

.hide {
  overflow: hidden;
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  clip: rect(1px 1px 1px 1px);
  clip-path: inset(50%);
}

::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.16);
  border-radius: 6px;
  border: 2px solid transparent;
  background-clip: padding-box;
}

::-webkit-scrollbar-button {
  background: transparent;
  border: none;
  width: 12px;
  height: 12px;
}

::-webkit-scrollbar-button:single-button:vertical:decrement {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="%23000" d="M12 8l6 6H6z"/></svg>');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
}

::-webkit-scrollbar-button:single-button:vertical:increment {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="%23000" d="M12 16l6-6H6z"/></svg>');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
}

.none_scroll {
  position: fixed;
  overflow: hidden;
  width: 100%;
  margin: 0 auto;
}

html:has(dialog[open]) {
  overflow: hidden;
}

/* layout
--------------------------*/
html {
  width: 100%;
  max-width: 768px;
  height: 100%;
  margin: 0 auto;
  background-color: rgb(239, 239, 239);
}
body {
  min-height: calc(100% - 85px);
  box-sizing: border-box;
  background-color: #fff;
}
.header_container {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  z-index: 10;
  width: 100%;
  max-width: 768px;
  margin: 0 auto;
  height: 54px;
  background-color: #fff;
}
.header_container h1 {
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  line-height: 54px;
  letter-spacing: -0.43px;
  color: #000;
}
.header_container h1 button {
  border: 0;
  font-weight: 700;
  font-size: 16px;
  line-height: 44px;
  padding-right: 20px;
  background: url("/assets/images/ico_arrow_04_down.png") right 0 center/18px no-repeat;
}
.header_container h1 button.golfclub_select {
  font-size: 14px;
}
.header_container h1.logo {
  text-align: left;
  float: left;
  padding: 15px 5px 0 15px;
}
.header_container h1.logo a {
  display: block;
  width: 24px;
  height: 24px;
  background: url("/assets/images/img_logo_01.png") 0 0/24px no-repeat;
}
.header_container .btn_search {
  position: absolute;
  right: 61px;
  top: 15px;
  width: 24px;
  height: 24px;
  background: url("/assets/images/ico_search.png") 0 0/24px no-repeat;
}
.header_container .btn_food {
  position: absolute;
  right: 61px;
  top: 15px;
  width: 24px;
  height: 24px;
  background: url("/assets/images/btn_food.png") 0 0/24px no-repeat;
}
.header_container .btn_back {
  position: absolute;
  left: 20px;
  top: 15px;
  width: 24px;
  height: 24px;
  background: url("/assets/images/btn_back_01.png") 0 0/24px no-repeat;
}
.header_container .btn_menu {
  position: absolute;
  right: 18px;
  top: 15px;
  width: 24px;
  height: 24px;
  background: url("/assets/images/btn_menu_01.png") 0 0/24px no-repeat;
}
.header_container .btn_stt {
  position: absolute;
  right: 54px;
  top: 15px;
  width: 24px;
  height: 24px;
  background: url("/assets/images/btn_settings.png") 0 0/24px no-repeat;
}
.header_container .qr {
  position: absolute;
  right: 61px;
  top: 15px;
  width: 24px;
  width: 24px;
  overflow: hidden;
  background: url("/assets/images/img_qr_01.png") 0 0/24px no-repeat;
}
.header_container .logff {
  float: left;
  padding-top: 15px;
  line-height: 24px;
  font-size: 16px;
  letter-spacing: -0.5px;
}
.header_container .logff a {
  font-weight: 700;
  color: #1F1F1F;
  text-decoration: underline;
}
.gnb {
  position: fixed;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 90;
  background-color: #fff;
  width: 100%;
  max-width: 768px;
  margin: 0 auto;
  box-shadow: 0px 0px 16px 0px #00000033;
}
.gnb ul {
  display: flex;
  height: 85px;
  justify-content: space-around;
}
.gnb ul li {
  padding-top: 19px;
  width: 40px;
}
.gnb ul a {
  padding-top: 24px;
  line-height: 22px;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: -0.43px;
  text-align: center;
  display: block;
  background-repeat: no-repeat;
  background-size: 24px;
  background-position: center 0;
  height: 22px;
  width: 100%;
  position: relative;
}
.gnb ul a .alram {
  position: absolute;
  left: 50%;
  top: -2px;
  width: fit-content;
  height: 13px;
  border-radius: 100px;
  background-color: #D72F20;
  color: #fff;
  font-weight: 700;
  font-size: 10px;
  line-height: 14px;
  letter-spacing: -0.43px;
  padding: 0 5px;
}
.gnb ul a .text {
  color: #9CB8EC;
}
.gnb ul a.gnb_01 {
  background-image: url("/assets/images/gnb_01_off.png");
}
.gnb ul a.gnb_02 {
  background-image: url("/assets/images/gnb_02_off.png");
}
.gnb ul a.gnb_03 {
  background-image: url("/assets/images/gnb_03_off.png");
}
.gnb ul a.gnb_04 {
  background-image: url("/assets/images/gnb_04_off.png");
}
.gnb ul a.gnb_05 {
  background-image: url("/assets/images/gnb_05_off.png");
}
.gnb ul a.active .text {
  display: block;
  color: #DBAC2E;
}
.gnb ul a.active.gnb_01 {
  background-image: url("/assets/images/gnb_01_on.png");
}
.gnb ul a.active.gnb_02 {
  background-image: url("/assets/images/gnb_02_on.png");
}
.gnb ul a.active.gnb_03 {
  background-image: url("/assets/images/gnb_03_on.png");
}
.gnb ul a.active.gnb_04 {
  background-image: url("/assets/images/gnb_04_on.png");
}
.gnb ul a.active.gnb_05 {
  background-image: url("/assets/images/gnb_05_on.png");
}

.dimmed {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  width: 100%;
  max-width: 768px;
  margin: 0 auto;
}

dialog {
  border: 0;
  padding: 0;
}

dialog::backdrop {
  animation: fadein-backdrop 0.3s forwards;
  background-color: rgba(0, 0, 0, 0.6);
}

.calendar_popup {
  width: 100%;
  padding: 0;
}
.calendar_popup .calendar {
  width: 100%;
}
.calendar_popup .calendar .ui-widget * {
  font-family: NanumSquare;
}
.calendar_popup .calendar .ui-widget.ui-widget-content {
  border: 0;
  width: 100%;
  box-sizing: border-box;
  border-radius: 0;
  padding: 12px;
}
.calendar_popup .calendar .ui-widget-header {
  border: 0;
  background-color: #fff;
}
.calendar_popup .calendar .ui-datepicker .ui-datepicker-prev {
  left: 50%;
  margin-left: -60px;
  text-align: center;
}
.calendar_popup .calendar .ui-datepicker .ui-datepicker-prev span {
  text-indent: 0;
  font-weight: 800;
  font-size: 16px;
  line-height: 22px;
  letter-spacing: -0.43px;
  color: #000;
  position: static;
  margin: 0;
}
.calendar_popup .calendar .ui-datepicker .ui-datepicker-next {
  right: 50%;
  margin-right: -60px;
  text-align: center;
}
.calendar_popup .calendar .ui-datepicker .ui-datepicker-next span {
  text-indent: 0;
  font-weight: 800;
  font-size: 16px;
  line-height: 22px;
  letter-spacing: -0.43px;
  color: #000;
  position: static;
  margin: 0;
}
.calendar_popup .calendar .ui-datepicker .ui-datepicker-title {
  font-weight: 800;
  font-size: 16px;
  line-height: 22px;
  letter-spacing: -0.43px;
  color: #000;
}
.calendar_popup .calendar .ui-datepicker th {
  font-weight: 400;
  font-size: 12px;
  line-height: 22px;
  letter-spacing: -0.43px;
  text-align: center;
  vertical-align: middle;
  color: #1F1F1F;
}
.calendar_popup .calendar .ui-datepicker td {
  padding: 14px 0;
  text-align: center;
}
.calendar_popup .calendar .ui-datepicker td a,
.calendar_popup .calendar .ui-datepicker td span {
  font-weight: 800;
  font-size: 14px;
  line-height: 22px;
  letter-spacing: -0.43px;
}
.calendar_popup .calendar .ui-datepicker td span,
.calendar_popup .calendar .ui-datepicker td a {
  text-align: center;
}
.calendar_popup .calendar .ui-state-default,
.calendar_popup .calendar .ui-widget-content .ui-state-default,
.calendar_popup .calendar .ui-widget-header .ui-state-default,
.calendar_popup .calendar .ui-button,
.calendar_popup .calendar html .ui-button.ui-state-disabled:hover, .calendar_popup .calendar html .ui-button.ui-state-disabled:active {
  border: 0;
  background-color: #fff;
}
.calendar_popup .calendar .ui-datepicker th span[title=Saturday],
.calendar_popup .calendar .ui-datepicker th span[title=Sunday],
.calendar_popup .calendar .ui-datepicker td.sunday a,
.calendar_popup .calendar .ui-datepicker td.saturday a {
  color: #D72F20;
}
.calendar_popup .calendar .ui-datepicker .ui-state-default.ui-state-active {
  display: inline-block;
  width: 40px;
  box-sizing: border-box;
  height: 26px;
  line-height: 26px;
  background-color: #87B1FF;
  color: #fff;
  padding: 0;
  border-radius: 13px;
}
.calendar_popup .btn_close {
  position: absolute;
  right: 20px;
  top: 14px;
  width: 24px;
  height: 24px;
  background: url("/assets/images/btn_close_01.png") 0 0/24px no-repeat;
  border: 0;
}

.flatpickr-wrapper {
  width: 100%;
  background-color: #F5F5F5;
  padding: 20px;
  box-sizing: border-box;
}
.flatpickr-wrapper .flatpickr-current-month {
  display: flex;
  flex-direction: row-reverse;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.flatpickr-wrapper .flatpickr-current-month input.cur-year {
  font-family: NanumSquare;
  font-weight: 800;
  font-size: 16px;
  line-height: 22px;
  letter-spacing: -0.43px;
}
.flatpickr-wrapper .flatpickr-current-month .numInputWrapper {
  width: 50px;
}
.flatpickr-wrapper .flatpickr-current-month .numInputWrapper span.arrowDown,
.flatpickr-wrapper .flatpickr-current-month .numInputWrapper span.arrowUp {
  display: none;
}
.flatpickr-wrapper .flatpickr-current-month .flatpickr-monthDropdown-months {
  padding: 0;
  margin-top: -3px;
  font-family: NanumSquare;
  font-weight: 800;
  font-size: 16px;
  line-height: 22px;
  letter-spacing: -0.43px;
}
.flatpickr-wrapper .flatpickr-innerContainer,
.flatpickr-wrapper .flatpickr-rContainer,
.flatpickr-wrapper .flatpickr-days,
.flatpickr-wrapper .dayContainer {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  -moz-column-gap: 0;
       column-gap: 0;
  row-gap: 20px;
}
.flatpickr-wrapper .flatpickr-innerContainer > span,
.flatpickr-wrapper .flatpickr-rContainer > span,
.flatpickr-wrapper .flatpickr-days > span,
.flatpickr-wrapper .dayContainer > span {
  width: 100%;
  text-align: center;
  max-width: 100%;
  height: 26px;
  line-height: 26px;
  font-weight: 800;
  font-size: 14px;
  letter-spacing: -0.43px;
  color: #1F1F1F;
}
.flatpickr-wrapper .flatpickr-calendar.inline {
  top: 0;
  background: transparent;
}
.flatpickr-wrapper .flatpickr-weekdaycontainer {
  gap: 10px;
}
.flatpickr-wrapper .flatpickr-weekday {
  line-height: 22px;
}
.flatpickr-wrapper .flatpickr-weekday:nth-child(1), .flatpickr-wrapper .flatpickr-weekday:nth-child(7) {
  color: #D72F20;
}
.flatpickr-wrapper .flatpickr-day {
  flex: 1 0 14.2857142857%;
  max-width: 14.2857142857%;
  box-sizing: border-box;
  text-align: center;
}
.flatpickr-wrapper .flatpickr-day.flatpickr-disabled, .flatpickr-wrapper .flatpickr-day.flatpickr-disabled:hover, .flatpickr-wrapper .flatpickr-day.prevMonthDay, .flatpickr-wrapper .flatpickr-day.nextMonthDay, .flatpickr-wrapper .flatpickr-day.notAllowed, .flatpickr-wrapper .flatpickr-day.notAllowed.prevMonthDay, .flatpickr-wrapper .flatpickr-day.notAllowed.nextMonthDay {
  color: #ccc;
}
.flatpickr-wrapper .flatpickr-day:nth-child(7n+1):not(.flatpickr-disabled):not(.nextMonthDay):not(.prevMonthDay),
.flatpickr-wrapper .flatpickr-day:nth-child(7n):not(.flatpickr-disabled):not(.nextMonthDay):not(.prevMonthDay),
.flatpickr-wrapper .flatpickr-day:not(.flatpickr-disabled):not(.nextMonthDay):not(.prevMonthDay):has(.holiday) {
  color: red;
}
.flatpickr-wrapper .flatpickr-day.inRange, .flatpickr-wrapper .flatpickr-day.prevMonthDay.inRange, .flatpickr-wrapper .flatpickr-day.nextMonthDay.inRange, .flatpickr-wrapper .flatpickr-day.today.inRange, .flatpickr-wrapper .flatpickr-day.prevMonthDay.today.inRange, .flatpickr-wrapper .flatpickr-day.nextMonthDay.today.inRange, .flatpickr-wrapper .flatpickr-day:hover, .flatpickr-wrapper .flatpickr-day.prevMonthDay:hover, .flatpickr-wrapper .flatpickr-day.nextMonthDay:hover, .flatpickr-wrapper .flatpickr-day:focus, .flatpickr-wrapper .flatpickr-day.prevMonthDay:focus, .flatpickr-wrapper .flatpickr-day.nextMonthDay:focus {
  background-color: transparent;
  border: 0;
}
.flatpickr-wrapper .flatpickr-day.selected {
  border: 0;
  background-color: transparent;
}
.flatpickr-wrapper .flatpickr-day.selected .day-inner {
  display: inline-block;
  background-color: #87B1FF;
  line-height: 26px;
  width: 38px;
  text-align: center;
  border-radius: 13px;
  color: #fff;
  font-family: NanumSquare;
  font-weight: 800;
  font-size: 14px;
  letter-spacing: -0.43px;
}
.flatpickr-wrapper .flatpickr-calendar {
  width: 100% !important;
  display: block !important;
  box-shadow: none;
}
.flatpickr-wrapper .flatpickr-calendar:before, .flatpickr-wrapper .flatpickr-calendar:after {
  display: none;
}
.flatpickr-wrapper .flatpickr-months {
  display: none;
}
.flatpickr-wrapper .flatpickr-weekdays {
  height: 22px;
}

.calendar_wrap {
  position: relative;
}
.calendar_wrap .calendar-header {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 50px;
}
.calendar_wrap .calendar-header .monthInput,
.calendar_wrap .calendar-header .mainMonthInput {
  width: 70px;
  border: 0;
  text-align: center;
  color: #000;
  font-family: NanumSquare;
  font-weight: 800;
  font-size: 16px;
  letter-spacing: -0.43px;
}
.calendar_wrap .calendar-header .prevMonth,
.calendar_wrap .calendar-header .nextMonth,
.calendar_wrap .calendar-header .mainPrevMonth,
.calendar_wrap .calendar-header .mainNextMonth {
  width: 18px;
  height: 18px;
  overflow: hidden;
  text-indent: -999px;
  border: 0;
}
.calendar_wrap .calendar-header .prevMonth,
.calendar_wrap .calendar-header .mainPrevMonth {
  background: url("/assets/images/btn_left_01.png") 0 0/18px no-repeat;
}
.calendar_wrap .calendar-header .nextMonth,
.calendar_wrap .calendar-header .mainNextMonth {
  background: url("/assets/images/btn_right_01.png") 0 0/18px no-repeat;
}

.search_popup {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  width: 100%;
  max-width: 768px;
  margin: 0 auto;
  background-color: #fff;
  z-index: 90;
  flex-direction: column;
}
.search_popup.show {
  display: flex;
}
.search_popup .title {
  text-align: center;
  height: 57px;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  background-color: #fff;
  font-weight: 700;
  font-size: 16px;
  line-height: 57px;
  color: #1F1F1F;
  z-index: 2;
  width: 100%;
  max-width: 768px;
  margin: 0 auto;
}
.search_popup .content {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  box-sizing: border-box;
  padding-top: 57px;
}
.search_popup .content h3 {
  text-align: center;
  border-top: 1px solid #E2E2E2;
  line-height: 36px;
  height: 36px;
  background-color: #F5F5F5;
  color: #464C51;
  font-weight: 700;
  font-size: 14px;
}
.search_popup .content .flatpickr-wrapper {
  background-color: #fff;
  padding: 0 10px 10px;
}
.search_popup .content .select_cc dl {
  padding: 18px 20px;
}
.search_popup .content .select_cc dl dt {
  font-weight: 700;
  font-size: 14px;
  line-height: 100%;
  color: #000;
  margin-bottom: 4px;
}
.search_popup .content .select_cc dl dd {
  display: flex;
  row-gap: 5px;
  -moz-column-gap: 4px;
       column-gap: 4px;
  flex-wrap: wrap;
}
.search_popup .content .select_cc dl dd label {
  display: block;
  overflow: hidden;
  position: relative;
}
.search_popup .content .select_cc dl dd label span {
  height: 28px;
  display: block;
  padding: 0 15px;
  line-height: 28px;
  font-weight: 400;
  font-size: 14px;
  letter-spacing: 0%;
  color: #999999;
  border: 1px solid #DFDFDF;
  border-radius: 15px;
  text-align: center;
}
.search_popup .content .select_cc dl dd label input:checked + span {
  border: 1px solid #1F1F1F;
  color: #1F1F1F;
}
.search_popup .content .select_cc dl dd + dt {
  margin-top: 16px;
}
.search_popup .content .select_period {
  margin-bottom: 30px;
}
.search_popup .content .select_period .input {
  display: flex;
  align-items: center;
  margin: 12px 20px;
  border: 1px solid #1F1F1F;
  border-radius: 100px;
  padding: 9px 16px;
  line-height: 14px;
  font-weight: 700;
}
.search_popup .content .select_period .input .period{
  display: flex;
  align-items: center;
  justify-content: center;
}
.search_popup .content .select_period .input .period input{
  flex: 1;
  width: 100%;
  outline: 0;
  border: 0;
  line-height: 14px;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  font-family: 'NanumSquare';
}
.search_popup .content .select_period .input_dir {
  display: flex;
  align-items: center;
  background-color: #F5F5F5;
  border-color: #F5F5F5;
}
.search_popup .content .select_period .input_dir .period {
  font-weight: 700;
  color: #1F1F1F;
  display: flex;
  gap: 3px;
  align-items: center;
}
.search_popup .content .select_period .input_dir .period input {
  border: 0;
  flex: 1;
  width: 100%;
  text-align: center;
  height: 16px;
  background-color: transparent;
  line-height: 14px;
  font-size: 12px;
  font-weight: 700;
  font-family: 'NanumSquare';
}
.search_popup .content .select_period .input > * {
  flex-grow: 1;
}
.search_popup .content .select_period .input .text {
  flex-shrink: 0;
  flex-grow: 0;
  margin-right: 12px;
  border-right: 1px solid #E2E2E2;
  width: 68px;
}
.search_popup .content .selectbox {
  display: flex;
  justify-content: center;
  -moz-column-gap: 4px;
       column-gap: 4px;
  margin-top: 20px;
  border-top: 1px solid #E2E2E2;
  padding: 24px 20px 40px;
}
.search_popup .content .selectbox select {
  min-width: 74px;
  padding: 0 30px 0 17px;
  height: 30px;
  border-radius: 30px;
  border: 0 none;
  text-align: center;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  font-size: 12px;
  font-weight: 700;
  background: #F5F5F5 url("/assets/images/ico_arrow_down4.png") center right 12px/auto 5px no-repeat;
}
.search_popup .btn_rev {
  width: 100%;
  height: 50px;
  box-sizing: border-box;
  padding: 15px 0 16px;
  border: 0 none;
  background-color: #358DFF;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
}
.search_popup .btn_close {
  position: absolute;
  right: 20px;
  top: 14px;
  width: 24px;
  height: 24px;
  background: url("/assets/images/btn_close_01.png") 0 0/24px no-repeat;
  border: 0;
  z-index: 3;
}

.secureKeypad_popup {
  overflow: hidden;
}
.secureKeypad_popup .inner {
  background-color: #fff;
  width: 320px;
}
.secureKeypad_popup .text01 {
  padding: 34px 0 6px;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  line-height: 22px;
  color: #000;
}
.secureKeypad_popup .text02 {
  padding: 0 0 10px;
  line-height: 22px;
  text-align: center;
  color: #777;
}
.secureKeypad_popup .keypad_wrap {
  height: 270px;
  background-color: #777;
  position: relative;
}
.secureKeypad_popup .keypad_wrap .select_key {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  text-align: center;
  font-size: 0;
  line-height: 0;
  padding: 47px 0 25px;
}
.secureKeypad_popup .keypad_wrap .select_key span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  color: #fff;
  font-weight: 800;
  font-size: 36px;
  text-align: center;
  line-height: 30px;
  background-color: #358DFF;
  border: 1px solid #87B1FF;
  box-sizing: border-box;
  border-radius: 4px;
  padding-top: 12px;
  padding-bottom: 12px;
}
.secureKeypad_popup .keypad_wrap .select_key span.error {
  background-color: #D72F20;
  border: 1px solid #FF6A7A;
}
.secureKeypad_popup .keypad_wrap .text_error {
  position: absolute;
  left: 0;
  top: 18px;
  right: 0;
  text-align: center;
  font-weight: 800;
  font-size: 14px;
  line-height: 22px;
  color: #FF95A0;
}
.secureKeypad_popup .keypad_wrap .keypad {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  justify-content: center;
}
.secureKeypad_popup .keypad_wrap .keypad button {
  width: 54px;
  height: 54px;
  padding: 13px 0;
  border-radius: 4px;
  background-color: #fff;
  font-weight: 700;
  font-size: 32px;
  line-height: 1;
  text-align: center;
  color: #1F1F1F;
  border: 0;
}
.secureKeypad_popup .keypad_wrap .keypad button.btn_del {
  background: #fff url("/assets/images/btn_del_01.png") center/32px auto no-repeat;
}
.secureKeypad_popup .btn_confirm {
  width: 100%;
  height: 50px;
  color: #000;
  font-weight: 700;
  font-size: 16px;
  text-align: center;
  border: 0;
  background-color: #358DFF;
  color: #fff;
}
.secureKeypad_popup .btn_confirm:disabled {
  background-color: #999;
}
.secureKeypad_popup .btn_close {
  position: absolute;
  right: 20px;
  top: 14px;
  width: 24px;
  height: 24px;
  background: url("/assets/images/btn_close_01.png") 0 0/24px no-repeat;
  border: 0;
}
.secureKeypad_popup.fail .text01 {
  padding: 0;
  height: 50px;
  line-height: 50px;
}
.secureKeypad_popup.fail .entry_block {
  background-color: #777777;
  height: 270px;
}
.secureKeypad_popup.fail .entry_block p {
  padding: 42px 0 36px;
  color: #fff;
  font-weight: 800;
  font-size: 14px;
  line-height: 22px;
  text-align: center;
}
.secureKeypad_popup.fail .entry_block dt {
  font-weight: 800;
  font-size: 14px;
  line-height: 22px;
  text-align: center;
  color: #fff;
  margin-bottom: 2px;
}
.secureKeypad_popup.fail .entry_block dd {
  text-align: center;
}
.secureKeypad_popup.fail .entry_block dd span {
  display: inline-block;
  width: 160px;
  height: 56px;
  border-radius: 4px;
  border: 1px solid #87B1FF;
  background: #358DFF;
  font-weight: 800;
  font-size: 36px;
  line-height: 54px;
  text-align: center;
  color: #fff;
}

.radio {
  position: relative;
  padding-left: 17px;
}
.radio + .radio {
  margin-left: 5px;
}
.radio span::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 12px;
  height: 12px;
  border-radius: 7px;
  border: 1px solid #E2E2E2;
}
.radio input[type=radio] {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}
.radio input[type=radio]:checked + span::before {
  border-color: #358DFF;
  background-color: #358DFF;
}

.check span {
  display: inline-block;
  padding-left: 27px;
  line-height: 22px;
  background: url(/assets/images/btn_checkbox.png) 0 1px/20px no-repeat;
}
.check input[type=checkbox] {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}
.check input[type=checkbox]:checked + span {
  background-image: url(/assets/images/btn_checkbox_checked.png);
}

/* 달력 전체 박스 줄이기 */
.layer-calendar.flatpickr-calendar {
  width: 220px !important;
  font-size: 12px;
  padding: 4px;
}
.layer-calendar.flatpickr-calendar .flatpickr-weekdaycontainer {
  font-size: 11px;
  padding: 2px 0;
}
.layer-calendar.flatpickr-calendar .flatpickr-monthDropdown-months {
  font-size: 14px;
}
.layer-calendar.flatpickr-calendar .flatpickr-day {
  width: 22px;
  height: 22px;
  line-height: 22px;
  font-size: 11px;
  margin: 0 1px;
}
.layer-calendar.flatpickr-calendar .flatpickr-innerContainer,
.layer-calendar.flatpickr-calendar .flatpickr-rContainer,
.layer-calendar.flatpickr-calendar .flatpickr-days,
.layer-calendar.flatpickr-calendar .dayContainer {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  -moz-column-gap: 0;
       column-gap: 0;
}
.layer-calendar.flatpickr-calendar .flatpickr-months .flatpickr-month {
  font-size: 14px;
  height: 28px;
}
.layer-calendar.flatpickr-calendar .flatpickr-current-month input {
  font-size: 14px;
  padding: 0 4px;
}
.layer-calendar.flatpickr-calendar .flatpickr-prev-month,
.layer-calendar.flatpickr-calendar .flatpickr-next-month {
  width: 22px;
  height: 22px;
  top: 3px;
}
.layer-calendar.flatpickr-calendar .flatpickr-innerContainer {
  padding: 0;
}

.alert_popup {
  width: 320px;
}
.alert_popup .inner {
  background-color: #fff;
}
.alert_popup .inner > h2 {
  padding: 16px 0 12px;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  line-height: 22px;
  color: #000;
  border-bottom: 1px solid #E2E2E2;
  outline: 0;
  background-color: #fff;
}
.alert_popup .content {
  margin: 40px 30px;
}
.alert_popup .content p {
  font-size: 14px;
  font-weight: 700;
  line-height: 22px;
  letter-spacing: -0.43px;
}
.alert_popup .content.tac {
  text-align: center;
}
.alert_popup .content .imp {
  color: #358DFF;
}
.alert_popup .content .imp2 {
  color: #D72F20;
}
.alert_popup .btn_close {
  position: absolute;
  right: 20px;
  top: 14px;
  width: 24px;
  height: 24px;
  background: url("/assets/images/btn_close_01.png") 0 0/24px no-repeat;
  border: 0;
}
.alert_popup .buttons {
  display: flex;
  -moz-column-gap: 1px;
       column-gap: 1px;
  margin-top: 20px;
}
.alert_popup .buttons button {
  flex: 1;
  height: 40px;
  border: 0 none;
  background-color: #A99362;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
}
.alert_popup .buttons button.btn_blue {
  background-color: var(--primary);
}

.theme_1 {
  --primary: #358DFF;
}

.theme_2 {
  --primary: #25552E;
}

.theme_3 {
  --primary: #F17551;
}

.header_container:has(.gnb) + .menu {
  margin-bottom: 85px;
}
.header_container:has(.gnb) + .menu .fixed_bottom {
  bottom: 85px;
}
.menu:has(.fixed_bottom) {
  padding-bottom: 40px;
}

.menu .tab {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0 10px;
  border-bottom: 1px solid #E2E2E2;
  background-color: #fff;
}
.menu .tab li a {
  border-bottom: 4px solid transparent;
  display: block;
  width: 86px;
  box-sizing: border-box;
  padding: 12px 0 10px;
  text-align: center;
  font-size: 14px;
  line-height: 1;
}
.menu .tab li a.active {
  font-weight: 700;
  border-color: var(--primary);
}

.menu_main {
  min-height: calc(100vh - 54px);
  background-color: #F5F5F5;
}

.menu_main h3 {
  padding: 10px 20px;
  background-color: #F5F5F5;
  color: #777;
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  letter-spacing: -0.25px;
}
.menu_box {
  padding: 30px 20px;
  background: #dbac2e url("/assets/images/bg_my_zone.png") right bottom/auto 240px no-repeat;
  text-align: center;
}
.menu_box .mileage {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
}
.menu_box .mileage p {
  margin-left: 8px;
}
.menu_box .mileage p a {
  border-bottom: 1px solid #1f1f1f;
  line-height: 0.8;
  font-size: 20px;
  font-weight: 800;
}
.menu_box .mileage::after {
  content: "";
  width: 20px;
  height: 20px;
  margin-left: 2px;
  background: url("/assets/images/ico_stt_mileage.png") center/contain no-repeat;
}
.menu_box .state ul {
  margin-top: 17px;
  display: flex;
  /* justify-content: center; */
  /* flex-wrap: wrap; */
  -moz-gap: 4px;
       gap: 4px;
}
.menu_box .state li {
  flex: 1;
}
.menu_box .state li a {
  /* display: flex;
  justify-content: center;
  align-items: center;
  height: fit-content; */
  /* padding: 8px 20px; */
  display: block;
  height: 30px;
  line-height: 30px;
  text-decoration: none;
  border: 1px solid #C19726;
  border-radius: 18px;
  text-align: center;
  color: #444;
  box-sizing: border-box;
  white-space: nowrap;
}
.menu_box .state li strong {
  font-size: 14px;
  font-weight: 800;
  text-decoration: underline;
  color: #444;
}
.menu_all {
  padding: 0 30px 66px;
  background-color: #fff;
}
.menu_all h3 {
  margin: 0 -30px 30px;
}
.menu_all ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 20px 30px;
  align-items: center;
}
.menu_all ul + ul {
  margin-top: 30px;
  padding-top: 30px;
  border-top: 1px solid #E2E2E2;
}
.menu_all li {
  position: relative;
  text-align: center;
  line-height: 1.2;
  font-weight: 700;
}
.menu_all li>a {
  word-break: auto-phrase;
}
.menu_all li::after {
  content: "";
  position: absolute;
  right: -15px;
  top: calc(50% - 2px);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: #E2E2E2;
}
.menu_all li:nth-child(3n) {
  -moz-column-gap: 0;
       column-gap: 0;
}
.menu_all li:nth-child(3n)::after {
  display: none;
}
.menu_foot {
  background-color: #F5F5F5;
  border-top: 1px solid #E2E2E2;
  padding: 22px;
  line-height: 1.3;
}
.menu_foot strong {
  display: block;
  margin-bottom: 8px;
  font-weight: 800;
}
.menu_foot p {
  margin: 4px 0;
}
.menu_foot address {
  margin-top: 20px;
}
.menu_foot cite {
  font-size: 10px;
  line-height: 18px;
  font-weight: 400;
}
.menu .notice [class^=tag_] {
  display: inline-block;
  margin-right: 4px;
  padding: 4px 12px 3px;
  border: 1px solid #C59F38;
  border-radius: 10px;
  font-size: 11px;
  line-height: 1;
  color: #C59F38;
}
.menu .notice .tag {
  font-size: 0;
}
.menu .notice .tag_red {
  color: #E37883;
  border-color: #E37883;
}
.menu .notice .tag_blue {
  color: #7BA5F3;
  border-color: #7BA5F3;
}
.menu .notice .tag_green {
  color: #98BE46;
  border-color: #98BE46;
}
.menu .notice .tag_gray {
  color: #999;
  border-color: #999;
}
.menu .notice_list {
  border-top: 6px solid #F5F5F5;
  padding: 20px;
}
.menu .notice_list a {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  line-height: 1;
  overflow: hidden;
  margin-bottom: 13px;
  padding: 0 0 11px;
  border-bottom: 1px solid #E2E2E2;
}
.menu .notice_list .tag {
  width: 100%;
  margin-bottom: 12px;
}
.menu .notice_list .title {
  width: calc(100% - 60px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 700;
}
.menu .notice_list .date {
  margin-left: auto;
  width: 50px;
  font-size: 12px;
  color: #777;
}
.menu .notice_detail {
  position: relative;
  padding: 20px 20px 0;
}
.menu .notice_detail .head {
  display: flex;
  -moz-column-gap: 10px;
       column-gap: 10px;
  padding-bottom: 20px;
  border-bottom: 1px solid #E2E2E2;
}
.menu .notice_detail .head .date {
  margin-left: auto;
  font-size: 12px;
  color: #999;
}
.menu .notice_detail .cont {
  padding: 20px 0;
  line-height: 18px;
}
.menu .notice_detail .cont_event {
  margin: -1px -20px 0;
  padding: 0;
}
.menu .notice_event {
  padding: 20px;
}
.menu .notice_event a {
  display: flex;
  gap: 12px;
  margin-bottom: 13px;
  line-height: 1;
}
.menu .notice_event .thumb {
  flex-shrink: 0;
  width: 100px;
  height: 80px;
  border-radius: 8px;
  background-color: #f1f1f1;
  background-size: cover;
  background-repeat: no-repeat;
}
.menu .notice_event .detail {
  width: 100%;
  margin: 6px 0 4px;
  overflow: hidden;
}
.menu .notice_event .title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin: 11px 0 8px;
  font-weight: 700;
}
.menu .notice_event .duration {
  font-size: 12px;
  color: #777;
}
.menu .inform_panel {
  padding: 23px 20px 30px;
}
.menu .inform_panel .cont + .cont {
  margin-top: 30px;
}
.menu .inform_panel h3 {
  margin-bottom: 7px;
  font-weight: 800;
  line-height: 100%;
}
.menu .inform_panel h4 {
  margin: 7px 0 8px;
  color: var(--primary);
  font-weight: 400;
}
.menu .inform_panel h4 ~ h4 {
  margin-top: 20px;
}
.menu .inform_panel p {
  font-weight: 400;
  line-height: 20px;
}
.menu .inform_panel p.info {
  margin: 12px 0 4px;
  font-size: 12px;
  line-height: 16px;
  color: #777777;
}
.menu .inform_panel table {
  margin-bottom: 20px;
  width: 100%;
}
.menu .inform_panel table th, .menu .inform_panel table td {
  border: 1px solid #E2E2E2;
  text-align: center;
  line-height: 16px;
  letter-spacing: -0.25px;
}
.menu .inform_panel table th {
  width: 140px;
  background-color: #F5F5F5;
  font-weight: 400;
}
.menu .inform_panel table td {
  padding: 13px 10px;
}
.menu .inform_panel .list > li {
  padding-left: 10px;
  text-indent: -10px;
}
.menu .inform_panel .list > li::before {
  content: "-";
  margin-right: 4px;
}
.menu .inform_panel .list > li ul {
  margin-left: 10px;
}
.menu .inform_panel .coupon {
  margin: 0 10px;
  padding: 60px 0;
  border-bottom: 1px solid #E2E2E2;
  text-align: center;
  line-height: 100%;
}
.menu .inform_panel .coupon .img {
  margin-bottom: 23px;
}
.menu .inform_panel .coupon .title {
  font-weight: 800;
  font-size: 18px;
}
.menu .inform_panel .coupon .desc {
  margin-top: 6px;
}
.menu .inform_panel .coupon .desc strong {
  font-weight: 400;
  color: #C59F38;
}
.menu .inform_panel .coupon_info {
  margin: 24px 20px;
  text-align: center;
}
.menu .inform_panel .coupon_info p {
  font-weight: 700;
}
.menu .inform_panel .coupon_info span {
  display: block;
  margin-top: 10px;
  font-size: 12px;
  color: #777;
}
.menu .inform_panel .coupon.mileage {
  padding-top: 10px;
}
.menu .terms {
  border-top: 6px solid #F5F5F5;
  padding: 0 20px;
}
.menu .terms_list li {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #E2E2E2;
}
.menu .terms_list .box {
  flex: 1;
  display: flex;
  align-items: center;
  padding: 20px 0;
}
.menu .terms_list .box p {
  margin-left: auto;
  font-size: 12px;
  color: #777777;
  line-height: 18px;
}
.menu .terms_details .head {
  position: relative;
  display: flex;
  align-items: center;
  -moz-column-gap: 8px;
       column-gap: 8px;
  padding: 20px 30px 20px 0;
  border-bottom: 1px solid #E2E2E2;
}
.menu .terms_details .head.has-history::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  margin-top: -9px;
  width: 18px;
  height: 18px;
  background: url("/assets/images/ico_arrow_down3.png") center/contain no-repeat;
}
.menu .terms_details .head.opened::after {
  transform: rotate(180deg);
}
.menu .terms_details .head h3 {
  padding: 0;
  background: none;
  font-weight: 700;
  color: #1F1F1F;
  line-height: 16px;
  letter-spacing: -0.25px;
}
.menu .terms_details .head p {
  font-size: 12px;
}
.menu .terms_details .history_list {
  border-top: 1px solid #E2E2E2;
}
.menu .terms_details .history_list ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.menu .terms_details .history_list li {
  padding: 10px 0;
  border-bottom: 1px solid #E2E2E2;
}
.menu .terms_details .history_list a h3:first-child {
  font-weight: 700;
  color: #1F1F1F;
  font-size: 14px;
  line-height: 16px;
  letter-spacing: -0.25px;
  margin: 0;
}
.menu .terms_details .history_list a h3:last-child {
  font-size: 12px;
  font-weight: 700;
  color: #1F1F1F;
  line-height: 16px;
  letter-spacing: -0.25px;
  margin: 0;
}
.menu .terms_details .history_list a p:first-child {
  font-size: 12px;
}
.menu .terms_details .history_list a p:last-child {
  font-size: 12px;
}
.menu .terms_details .history_list a {
  display: flex;
  justify-content: space-between;
  text-decoration: none;
  color: inherit;
}
.menu .terms_details .cont {
  padding: 20px 0;
  letter-spacing: -0.43px;
}
.menu .terms_details .cont_warn {
  margin-bottom: 18px;
}
.menu .cc {
  margin: 40px 20px;
  letter-spacing: -0.43px;
}
.menu .cc h2 {
  margin-bottom: 60px;
  padding-top: 131px;
  font-size: 18px;
  font-weight: 800;
  line-height: 28px;
  text-align: center;
  background: url("/assets/images/ico_stt_certif.png") center top/66px auto no-repeat;
}
.menu .cc .info {
  font-weight: 700;
  line-height: 22px;
}
.menu .cc .info p + p {
  margin-top: 20px;
}
.menu .cc .data {
  margin: -10px 0 26px;
}
.menu .cc .data table {
  width: 100%;
}
.menu .cc .data td, .menu .cc .data th {
  border: 1px solid #E2E2E2;
  padding: 13px 6px 11px;
  text-align: center;
  line-height: 16px;
  letter-spacing: -0.25px;
}
.menu .cc .data th {
  width: 116px;
  background-color: #F5F5F5;
  font-weight: 400;
}
.menu .cc .data td {
  font-weight: 800;
}

/* GNB 영역 */
body .layout_main {
  position: relative;
  padding-bottom:85px;
}


/* 로그인*/
input{font-family: 'Spoqa Han Sans', sans-serif; font-weight: 400; vertical-align: middle; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; border-radius: 0;}
.obj{position: absolute;}

#wrap{ width:100%; position: relative; background-color: #ffffff;  word-break:keep-all; white-space:-moz-pre-wrap; white-space:-pre-wrap; white-space:-o-pre-wrap; word-wrap:break-word;}
#wrap #top{padding:10px 0px; min-height:24px; width:100%; color:#ffffff; background-color: #132f54; position: fixed; top:0px; left:0px; z-index: 100;}
#wrap.login{position:relative; display: flex; flex-direction: column; justify-content: center; align-items: center;width:100%; min-height:100vh; padding: 20px 40px; background-color: #ffffff; box-sizing: border-box;}
#wrap.login #top{padding:10px 0px; width:100%; color:#141414; background-color: transparent; position: fixed; top:0px; left:0px; z-index: 100;}
#wrap.login #top h2{font-size:16px; text-align: left; padding-left:20px;}
#wrap.login #top .close {top:5px; right:10px; width:35px;}
#wrap.login #top .close img {width: 100%; height: auto;}
#wrap.login #content{flex:1; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; font-size:14px; }
#wrap.login #content .input{width:100%;}
#wrap.login #content .input li{margin:10px 0px;}
#wrap.login #content .input li input{height:48px; padding:10px 20px; width:100%; border:none; border-radius: 8px; font-size: 14px; font-weight: 400; color:#999999; background-color: #F2F2F2;}
#wrap.login #content .input li input::placeholder{color:#999999;}
#wrap.login #content .input .auto{display: flex; align-items: center; gap: 4px; }
#wrap.login #content .input button.login{height:48px; width:100%; background-color: #28A1FF; color: #ffffff; border: none; border-radius: 8px;}
#wrap.login #content .input .find{text-align: center;}
#wrap.login #content .input .find span{padding:0px 14px; display: inline-block; vertical-align: top; position: relative;}
#wrap.login #content .input .find span a{padding:5px 0px;}
#wrap.login #content .input .find span::before{width:1px; height:18px; top:2px; left:0px; background-color:#EFEFEF; position:absolute; content: ""; }
#wrap.login #content .input .find span:nth-child(1)::before{display: none;}
#wrap.login .bottom{width:100%;}
#wrap.login .bottom button.simpleLogin{height:48px; width:100%; background-color: #ffffff; color: #3090F7; font-family: "Spoqa Han Sans", "sans-serif"; font-size: 16px; font-weight: 800; border: solid 1px #3090F7; border-radius: 8px;}
#wrap.login .bottom button.simpleLogin:hover{background-color: #fff; color: #3090F7;;}
#wrap.login .bottom button.simpleLogin .logo{width: inherit;}
#wrap.login .bottom dl.sns{margin-top:20px; text-align: center;}
#wrap.login .bottom dl.sns dd {margin-top:20px;}
#wrap.login .bottom dl.sns dd span{margin:0px 10px;}
#wrap.login .bottom dl.sns dd span img{width:40px}
#wrap.login #content .login-logo {text-align:center;}
#wrap.login #content .login-logo img {width:inherit;}
/* 기타 */
.no-data {
  padding: 24px 0 12px;
  text-align: center;
  line-height: 18px;
}
.golfclub-ellipsis {
  /* width: 50vw; */
  
  /* 화면 너비의 50% */
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
}
.motion-label {
  display: block;
  margin-top: 10px;
  text-align: center;
  font-size: 14px;
}
#sideMenu {
  transform: translateX(100%);
  z-index: 99;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  overflow: auto;
  background-color: #ffffff;
  box-sizing: border-box;
  transition: all 0.3s ease;
}
#sideMenu::-webkit-scrollbar {
  display: none;
}
#sideMenu.open {
  transform: translateX(0);
  max-width: 768px;
}
.fixed_bottom {
  position: fixed;
  bottom: 0;
  width: 100%;
  margin: 0 auto;
}
.fixed_bottom button {
  flex: 1;
  border: 0 none;
  height: 46px;
  color: #fff;
  background-color: #A99362;
  font-size: 14px;
  font-weight: 700;
  max-width: 768px;
}
.fixed_bottom button.btn_blue {
  background-color: var(--primary);
}
.fixed_bottom .num {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin: 0 2px 0 1px;
  line-height: 16px;
  box-sizing: border-box;
  padding: 0 4px;
  text-align: center;
  background-color: #6CACFF;
  border-radius: 8px;
  font-size: 12px;
}
.qna-block {
  margin-bottom: 20px;
}
.toast_popup_container {
  display: none;
  position: fixed;
  top: 0;
  z-index: 200;
  width: 100%;
  max-width: 768px;
  margin: 0 auto;
  height: 100%;
  box-sizing: border-box;
}
.toast_popup_container .toast_popup_backdrop {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
}
.toast_popup_container.opened .toast_popup_backdrop {
  display: block;
}
.toast_popup_container .toast_popup {
  position: fixed;
  bottom: 0;
  width: 100%;
  margin: 0 auto;
  height: fit-content;
  transition: all 0.5s;
  transform: translateY(100%);
}
.toast_popup_container.opened .toast_popup {
  transform: translateY(0);
}
.toast_popup_top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 12px 20px;
  box-sizing: border-box;
}
.toast_popup_top button {
  outline: none;
  border: none;
  font-size: 14px;
  color: #fff;
  background-color: transparent;
}
.toast_popup_top .toast_popup_close_btn {
  width: 18px;
}
.toast_popup_top .toast_popup_close_btn img{
  width: 100%;
  object-fit: contain;
}
.toast_popup_content {
  position: relative;
  width: 100%;
  height: fit-content;
  border-radius: 20px 20px 0 0;
  background-color: #fff;
  overflow: hidden;
}

.toast_popup_content .toast_popup_content_slide .swiper-pagination{
  z-index: 2;
  position: absolute;
  top: 20px;
  left: auto;
  right: 20px;
  width: fit-content;
  height: fit-content;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 2px 12px;
  font-size: 12px;
  color: #ffffff80;
  border-radius: 100px;
  background-color: #00000080;
}
.toast_popup_content .toast_popup_content_slide .swiper-pagination .swiper-pagination-current{
  color: #fff;
}
.toast_popup_content .toast_popup_content_slide {
  position: relative;
  width: 100%;
  height: 100%;
}
.toast_popup_content .toast_popup_content_slide img{
  width: 100%;
  object-fit: cover;
}
.toast_popup_bottom {
  width: 100%;
  padding: 16px 24px;
  background-color: #fff;
  box-sizing: border-box;
}
.toast_popup_bottom .toast_popup_bottom_btn_wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
}
.toast_popup_bottom button {
  font-size: 16px;
  font-weight: 600;
  outline: none;
  border: none;
  background-color: transparent;
}

.layer_popup_container {
  display: none;
  position: fixed;
  top: 0;
  z-index: 201;
  width: 100%;
  max-width: 768px;
  margin: 0 auto;
  justify-content: center;
  align-items: center;
  height: 100%;
  box-sizing: border-box;
}

.layer_popup_container.opened {
  display: flex !important;
}

.layer_popup_container .layer_popup_backdrop {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
}

.layer_popup_container .layer_popup {
  position: fixed;
  width: 100%;
  min-width: 320px;
  max-width: 428px;
  height: fit-content;
  max-height: 90%;
  padding: 0 8px;
  margin: 0 auto;
  box-sizing: border-box;
}

.layer_popup_top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 12px 20px;
  box-sizing: border-box;
}

.layer_popup_top button {
  outline: none;
  border: none;
  font-size: 14px;
  color: #fff;
  background-color: transparent;
}

.layer_popup_top .layer_popup_close_btn {
  width: 18px;
}

.layer_popup_top .layer_popup_close_btn img {
  width: 100%;
  object-fit: contain;
}

.layer_popup_content {
  position: relative;
  width: 100%;
  height: fit-content;
  background-color: #fff;
  overflow: hidden;
}

.layer_popup_content .layer_popup_content_slide .swiper-pagination-wrapper {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: center;
  width: 100%;
  box-sizing: border-box;
}

.layer_popup_content .layer_popup_content_slide .swiper-pagination {
  left: 50%;
  width: fit-content;
  height: fit-content;
  padding: 2px 12px;
  font-size: 12px;
  color: #ffffff80;
  border-radius: 100px;
  background-color: #00000080;
  transform: translateX(-50%);
  --swiper-pagination-bullet-inactive-color: #fff;
  --swiper-theme-color: #fff;
}

.layer_popup_content .layer_popup_content_slide .swiper-pagination .swiper-pagination-bullet .swiper-pagination-bullet-active {
  width: 16px;
  border-radius: 4px;
}

/* .layer_popup_content .layer_popup_content_slide .swiper-pagination {
  z-index: 2;
  position: absolute;
  top: 20px;
  left: auto;
  right: 20px;
  width: fit-content;
  height: fit-content;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 2px 12px;
  font-size: 12px;
  color: #ffffff80;
  border-radius: 100px;
  background-color: #00000080;
}

.layer_popup_content .layer_popup_content_slide .swiper-pagination .swiper-pagination-current {
  color: #fff;
} */

.layer_popup_content .layer_popup_content_slide {
  position: relative;
  width: 100%;
  height: 100%;
}

.layer_popup_content .layer_popup_content_slide img {
  width: 100%;
  object-fit: contain;
}

.layer_popup_bottom {
  width: 100%;
  background-color: #fff;
  box-sizing: border-box;
}

.layer_popup_bottom .layer_popup_bottom_btn_wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
}

.layer_popup_bottom button {
  flex: 1;
  height: 48px;
  padding: 16px;
  font-size: 14px;
  line-height: 14px;
  font-weight: 600;
  outline: none;
  border: 1px solid #E2E2E2;
  border-left : none;
  border-bottom: none;
  background-color: transparent;
}
.layer_popup_bottom button:last-child {
  border-right: none;
}

.tutorial_popup_container {
  position: fixed;
  top: 0;
  z-index: 202;
  width: 100%;
  max-width: 768px;
  height: 100%;
  margin: 0 auto;
  display: none;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  background-color: #f5f5f5;
}

.tutorial_popup_container.opened {
  display: flex;
}

.tutorial_popup_container .tutorial_popup {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 0 auto;
  height: 100%;
}

.tutorial_popup_top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 12px 20px;
  box-sizing: border-box;
}

.tutorial_popup_top button {
  outline: none;
  border: none;
  font-size: 14px;
  color: #fff;
  background-color: transparent;
}

.tutorial_popup_top .tutorial_popup_close_btn {
  width: 18px;
}

.tutorial_popup_top .tutorial_popup_close_btn img {
  width: 100%;
  object-fit: contain;
}

.tutorial_popup_content {
  flex: 1;
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  max-height: calc(100% - 48px);
  padding: 12px;
  background-color: #f5f5f5;
  box-sizing: border-box;
}

.tutorial_popup_content .tutorial_popup_content_slide {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  padding-bottom: 26px;
}

.tutorial_popup_content .tutorial_popup_content_slide .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.tutorial_popup_content .tutorial_popup_content_slide .swiper-pagination-wrapper {
  z-index: 2;
  display: flex;
  justify-content: center;
  width: 100%;
  box-sizing: border-box;
}

.tutorial_popup_content .tutorial_popup_content_slide .swiper-pagination {
  left: 50%;
  width: fit-content;
  height: fit-content;
  padding: 2px 12px;
  font-size: 12px;
  color: #ffffff80;
  border-radius: 100px;
  background-color: #00000080;
  transform: translateX(-50%);
  --swiper-pagination-bullet-inactive-color: #fff;
  --swiper-theme-color: #fff;
}

.tutorial_popup_content .tutorial_popup_content_slide .swiper-pagination .swiper-pagination-bullet .swiper-pagination-bullet-active {
  width: 16px;
  border-radius: 4px;
}

.tutorial_popup_content .tutorial_msg{
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 14px;
}

.tutorial_popup_bottom {
  width: 100%;
  background-color: #fff;
  box-sizing: border-box;
}

.tutorial_popup_bottom .tutorial_popup_bottom_btn_wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
}

.tutorial_popup_bottom button {
  flex: 1;
  height: 48px;
  padding: 16px;
  font-size: 14px;
  line-height: 14px;
  font-weight: 600;
  outline: none;
  border: 1px solid #E2E2E2;
  border-left: none;
  border-bottom: none;
  background-color: transparent;
}

.tutorial_popup_bottom button:last-child {
  border-right: none;
}


.editor-content figure.table {
  display: block;
  width: 100%;          
  margin: 10px 0;
  max-width: none; /* CKEditor 기본 제한 무시 */
}
.editor-content figure.table table {
  border-collapse: collapse;
  width: 100%;
}
.editor-content figure.table th,
.editor-content figure.table td {
  border: 1px solid #ccc;
  padding: 8px;
  text-align: center;
  vertical-align: middle;
}
.editor-content figure.table th {
  background-color: #f9f9f9;
  font-weight: bold;
}
.prev.obj {
  display: inline-block;
  width: 18px; 
  height: 18px;
  text-indent: -9999px;
  overflow: hidden;
}

#loadMoreTrigger {
  height: 1px;
}

.loading {
  position: fixed;
  top: 0;
  width: 100%;
  max-width: 768px;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.loading .loading_wrapper svg {
  width: 3.25em;
  transform-origin: center;
  animation: rotate4 2s linear infinite;
}

.loading .loading_wrapper circle {
  fill: none;
  stroke: hsl(214, 97%, 59%);
  stroke-width: 4;
  stroke-dasharray: 1, 200;
  stroke-dashoffset: 0;
  stroke-linecap: round;
  animation: dash4 1.5s ease-in-out infinite;
}

@keyframes rotate4 {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes dash4 {
  0% {
    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0;
  }

  50% {
    stroke-dasharray: 90, 200;
    stroke-dashoffset: -35px;
  }

  100% {
    stroke-dashoffset: -125px;
  }
}

@media screen and (max-width: 380px) {
  .menu_box .state li a {
    font-size: 12px;
  }
}


@media screen and (min-width: 768px) {
  #sideMenu {
    display: none;
  }
  #sideMenu.open {
    display: block;
  }
}