/******************************************************************
           Common Style Css 
********************************************************************/
body.main-bg {
  background: linear-gradient(180deg, rgba(141, 243, 28, 0.28) 5.83%, rgba(96, 177, 7, 0.00) 77.87%), #F6FAF2;
}
.wdh-100 {
  width: 100%;
}

.pT6  { padding-top: 6px; }
.pT16  { padding-top: 16px; }
.mT0 { margin-top: 0px !important; }
.mT8 { margin-top: 8px !important; }
.mT12 { margin-top: 12px !important; }
.mT16 { margin-top: 16px !important; }
.mT50 { margin-top: 50px !important; }
.mT90 { margin-top: 90px !important; }

.tx-12 {
	font-size: var(--font-12); line-height: 15px;
}
.tx-14 {
	font-size: var(--font-14); line-height: 17px;
}
.tx-16 {
	font-size: var(--font-16); line-height: 20px;
}
.tx-18 {
	font-size: var(--font-18); line-height: 21px;
}
.tx-22 {
	font-size: var(--font-22); line-height: 31px;
}
.tx-26 {
	font-size: var(--font-26); line-height: 31px;
}
.tx-28 {
	font-size: var(--font-28); line-height: 34px;
}
.tx-36 {
	font-size: var(--font-36); line-height: 45px;
}
.tx-38 {
	font-size: var(--font-38); line-height: 45px;
}
.tx-42 {
	font-size: var(--font-42); line-height: 50px;
}
.tx-55 {
	font-size: var(--font-55); line-height: 66px;
}


.inp-bx.line input {
  border: 1px solid var(--color-border-1);
}
.rdus3 {
  border-radius: var(--radius-3);
}
.rdus4 {
  border-radius: var(--radius-4);
}
.rdus8 {
  border-radius: var(--radius-8);
}
.rdus16 {
  border-radius: var(--radius-16);
}
.rdus30 {
  border-radius: var(--radius-30);
}
.rdus50 {
  border-radius: var(--radius-50);
}

.Shadow-1 {
  box-shadow: 0px 0px 8px 0px rgba(96, 177, 7, 0.08), 0px 0px 28px 0px rgba(96, 177, 7, 0.08);
}
.Shadow-2 {
  box-shadow: 0px 0px 8px 0px rgba(96, 177, 7, 0.08), 2px 4px 18px 0px rgba(96, 177, 7, 0.08);
}

.boder-bt-1 {
  border-bottom: 1px solid var(--color-border-1);
}
.boder-1 {
  border: 1px solid var(--color-border-1);
}
.boder-top-2 {
  border-top: 1px solid var(--color-border-2);
}
.boder-bt-2 {
  border-bottom: 1px solid var(--color-border-2);
}

.type-dash {
  text-indent: -7px;
  padding-left: 7px;
}
.type-dash > ul li {
  margin-left: 2px;
}

.justify-conte-center {
  justify-content: center !important;
}
.justify-conte-left {
  justify-content: left !important;
}
.justify-conte-right {
  justify-content: right !important;
}

.dtpck-bx {
  display: flex;
  flex-direction: row; justify-content: space-between; align-items: center;
  width: px; height: px;
  border: 1px solid var(--color-border-1); border-radius: var(--radius-8);
  background-color: #fff;;
}
.dtpck-bx > img {
  margin-right: 10px;
}
.dtpck-bx > input {
  padding: 0 16px;
  font-weight: 400;
  color: var(--color-fonts);
}

section .inner {
  width: 100%; height: 100%;
}


/************************************************** Header ****************/
header {
  position: relative; z-index: 1;
  /* background-color: var(--color-point); */
  background-color: #fff;;
  width: 100%; height: 58px;
  box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.08);
}
header .inner {
  display: flex;
  flex-direction: row; align-items: center; justify-content: space-between;
  width: 1400px; height: 58px;
  margin: 0 auto;
}
header .inner .logo > a {
  display: block;
}
.logo {
  display: flex;
  flex-direction: row;
  justify-content: flex-start; align-items: center;
}
header .inner .btn-right-bx {
  display: flex;
  flex-direction: row; justify-content: flex-end; align-items: center;
}
header .inner .btn-right-bx a {
  margin-left: 8px;
}

header .inner .button-2x-bx .btn-inner {
  display: flex; justify-content: flex-end; align-items: center;
}
header .inner .button-2x-bx .btn-inner a {
  margin-left: 8px;
}

header .inner .button-2x-bx .btn-inner a.mobile {
  display: none;
  width: 24px; height: 24px;
}
header .inner .button-2x-bx .btn-inner a.mobile > span {
  width: 18px; height: 2px;
  background-color: var(--color-fontGray);
  border-radius: var(--radius-4);
}
header .inner .button-2x-bx .btn-inner a.mobile > span:nth-child(2) {
  width: 12px;
}


/************************************************** Button ****************/
.btn-bx-1x, .bxbt-inner,
.btn-bx-2x {
  width: 100%;
}
.btn-bx-1x .bxbt-inner,
.btn-bx-2x .bxbt-inner {
  display: flex;
  flex-direction: row;
  justify-content: center; align-items: center;
  padding: 30px 0;
}
.btn-bx-2x .bxbt-inner {
  gap: 30px;
}
.button {
  width: auto; height: auto;
  position: relative;
  display: flex; justify-content: center; align-items: center;
  word-break: keep-all;
  cursor: pointer;
}
.button:hover {
  opacity: .8;
}
.button:focus {
  color: #fff;;
}
.Primary {
  background-color: var(--color-point);
  color: #fff;;
}
.Primary:hover, .Primary:active, .Primary:focus {
  color: #fff;;
}
.Primary:active {
  background-color: var(--color-pit-atv);
}
.Gray {
  background-color: var(--color-gray);
  color: var(--color-fonts);
}
.Gray:active {
  background-color: rgba(170, 170, 170, 1);
  color: var(--color-fonts);
}
.Gray:focus {
  color: var(--color-fonts);
}
.Gray-1 {
  background-color: var(--color-bg-2);
  color: var(--color-point);
}
.Gray-1:hover {
  background-color: rgba(246, 246, 246, .75);
  color: var(--color-point);
}
.Gray-1:active {
  background-color: rgba(224, 224, 224, 1);
  color: var(--color-point);
}
.Gray-1:focus {
  color: var(--color-point);
}
.line-lime {
  display: flex; justify-content: center; align-items: center;
  border: 1px solid var(--color-border-1); background-color: #fff;;
  color: var(--color-point);
}
.line-lime:hover {
  color: var(--color-point);
  background-color: rgba(96, 177, 7, .25);
}
.line-lime:focus {
  color: var(--color-point);
}
.line-lime:active {
  color: #fff;;
  background-color: var(--color-point);
}
.line-Primary {
  display: flex; justify-content: center; align-items: center;
  border: 1px solid var(--color-point); background-color: #fff;;
  color: var(--color-point);
}
.line-Primary:hover {
  color: var(--color-point);
  background-color: rgba(96, 177, 7, .25);
}
.line-Primary:focus {
  color: var(--color-point);
}
.line-Primary:active {
  color: #fff;;
  background-color: var(--color-point);
}
.line-Gray {
  display: flex; justify-content: center; align-items: center;
  border: 1px solid var(--color-border-1); background-color: #fff;;
  color: var(--color-fonts);
}
.line-Gray:hover {
  color: var(--color-point);
  border-color: var(--color-point);
}
.line-Gray:focus {
  color: var(--color-fonts);
}
.line-Gray:active {
  color: var(--color-white);
  background-color: var(--color-point);
}

.line-Grdt {
  display: flex; justify-content: center; align-items: center;
  border: 1px solid var(--color-border-1); background-color: var(--color-white);
  color: var(--color-fonts);
}
.line-Grdt:hover {
  border-color: #6CC9C9; color: var(--color-Blue);
}
.line-Grdt:focus {
  color: var(--color-fonts);
}
.line-Grdt:active {
  color: var(--color-white);
  background: linear-gradient(to right, #94D947 0%, #6CC9C9 100%);
  border: 0px;
}
button:disabled {
  background: var(--color-disabled);
  color: rgba(255, 255, 255, 0.38); font-weight: 500;
  cursor: not-allowed;
}
button:disabled:hover,
button:disabled:active {
  background: var(--color-disabled);
  color: rgba(255, 255, 255, 0.38); font-weight: 500;
  cursor: not-allowed;
}

.tt-link,
.tt-link:focus {
  background-color: transparent;
  color: var(--color-point); font-weight: 300;
  text-decoration: underline;
}
.tt-link:hover {
  opacity: 1;
  color: var(--color-red);
  text-decoration: underline;
}
.tt-link:active {
  font-weight: 500;
  color: var(--color-red);
  text-decoration: underline;
}
.tt-link2,
.tt-link2:focus {
  background-color: transparent;
  color: var(--color-point); font-weight: 400;
  text-decoration: underline;
}
.tt-link2:hover {
  color: var(--color-point); font-weight: 400;
  text-decoration: underline;
}
.tt-link2:active {
  font-weight: 500;
  color: var(--color-pit-atv);
  text-decoration: underline;
}

.Large {
  width: 280px; height: 53px;
  padding: 8px 16px;
}
.Medium {
  width: auto; height: 38px; 
  padding: 8px 16px;
}
.XMedium {
  width: auto; height: auto; 
  padding: 8px 24px;
}
.Small {
  width: auto; height: auto;
  padding: 4px 24px;
}




/******************************************************************
          Common Style Css 
********************************************************************/
section {
  display: flex;
  justify-content: center; align-items: center;
}
section .inner.cnts {
  display: flex;
  justify-content: center; align-items: center;
  width: 1400px;
  margin: 0 auto;
}
section .inner.cstInf {
  display: flex;
  flex-direction: row;
  gap: 50px;
  width: 100%; height: 800px;
  margin: 0 15%;
  overflow: hidden;
  /* width: 1380px; */
}

.spc-cnt-sbs {
  width: 486px;
}
.spc-cnt-sbs .bx-crd-bnr {
  display: inline-flex;
  gap: 16px;
}
section .inner .col-bx {
  width: 50%; height: calc(100vh - 58px);
}
section .inner.cstInf .col-bx {
  margin: 70px auto;
  width: 50%; height: 100%;
}
section .inner .col-bx.trvlPrps {
  background-color: #fff;;
  height: 700px;
  overflow: hidden;
}
section .inner.cstInf .col-bx.mvsl,
section .inner.cstInf .col-bx.trvlPrps,
section .inner.cstInf .col-bx.menu,
section .inner.cstInf .col-bx.ip-if-bx,
section .inner.cstInf .col-bx.ip-cmplt-bx {
  background-color: #fff;;
  overflow: hidden;
  height: 700px;
}
section .inner.cstInf .col-bx.mvsl form ,
section .inner.cstInf .col-bx.trvlPrps form ,
section .inner.cstInf .col-bx.menu form ,
section .inner.cstInf .col-bx.ip-if-bx form ,
section .inner.cstInf .col-bx.ip-cmplt-bx form {
  width: 100%
}
section .inner.cstInf .col-bx.mvsl {
  max-width: 35%;
}
section .inner .col-bx.trvlPrps {
  width: 65%;
}
section .inner.cstInf .col-bx.ip-if-bx,
section .inner.cstInf .col-bx.ip-cmplt-bx {
  width: 65%;
}
section .inner .col-bx.ip-if-bx .inner {
  overflow-y: auto;
}
section .inner .col-bx .inner {
  display: flex;
  flex-direction: column; justify-content: space-between; align-items: flex-start;
  width: 100%; height: 100%;
}
section .inner .col-bx .inner .btn-bx-1x .bxbt-inner,
section .inner .col-bx .inner .btn-bx-2x .bxbt-inner {
  display: flex;
  flex-direction: row; justify-content: center; align-items: center;
  padding: 30px 0; margin: 0 80px;
  width: calc(100% - 80px - 80px);
}
section .inner .col-bx .inner .btn-bx-1x .bxbt-inner .button.Large,
section .inner .col-bx .inner .btn-bx-2x .bxbt-inner .button.Large {
  width: 50%;
}
section .inner .col-bx .inner .btn-bx-1x .bxbt-inner .button svg {
  stroke: #fff;;
}


/**************************************************** Main style css */
section .inner.cnts .col-bx.mvsl .left-vsul {
  position: relative;
  margin-top: 70px;
  height: calc(100% - 71px);
}
.col-bx.mvsl {
  width: 35%;
}
.col-bx.mvsl .left-vsul h2 .point {
  font-weight: 900; color: var(--color-lghtYlw);
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: var(--color-point);
}
.col-bx.mvsl .left-vsul h2 .mg-tt-btt {
  color: var(--color-fontGray);
}
.col-bx.mvsl .left-vsul .img-vsul {
  position: absolute; top: 115px; left: 50%; z-index: -1;
}

.col-bx.mvsl .left-vsul .spc-cnt-sbs {
  display: flex;
  flex-direction: column; justify-content: center; align-items: center;
  width: 486px;
  margin-top: 12%;
}
.col-bx.mvsl .left-vsul .spc-cnt-sbs h3 {
  color: var(--color-fonts); font-weight: 700;
}
.spc-cnt-sbs .bx-crd-bnr {
  display: flex;
  flex-direction: row; justify-content: center; align-items: stretch;
  gap: 16px;
  margin-top: 16px;
}
.spc-cnt-sbs .bx-crd-bnr .card-bx {
  display: flex;
  flex-direction: column; justify-content: space-between; align-items: center;
  width: 33%; height: 180px;
  margin-top: 0;
}
.spc-cnt-sbs .bx-crd-bnr .card-bx strong {
  width: 100%;
  letter-spacing: -0.0594rem;
  word-break: keep-all;
}
.spc-cnt-sbs .bx-crd-bnr .card-bx img {
  width: 78px; height: 78px;
}
.col-bx.mvsl .left-vsul .tim-24-bx {
  position: absolute; bottom: 0;
  background-color: #fff;;
  border-radius: 24px 24px 0 0;
  width: 486px;
  margin-top: -10px;
}
.col-bx.mvsl .left-vsul .tim-24-bx .inner-bnr {
  margin:0 30px; padding-top: 30px;
}
.tim-24-bx .inner-bnr .tim-kr {
  display: flex;
  flex-direction: row; justify-content: space-between; align-items: center;
}
.tim-24-bx .inner-bnr .tim-kr h3 {
  color: var(--color-fonts); font-weight: 300;
  margin-right: 16px;
}
.tim-24-bx .inner-bnr .tim-kr h3 strong {
  font-weight: 700;
}
.tim-24-bx .inner-bnr .tim-kr h3 span {
  display: block;
  color: var(--color-point); font-weight: 700;
}
.tim-24-bx .inner-bnr .tim-kr img {
  margin-left: 24px;
}

.footer.Mobile {
  display: none;
  height: 0;
}
.footer {
  margin-top: 15px; padding-top: 15px;
  border-top: 1px solid var(--color-border-1);
}
.footer .menu-bx-ft {
  display: flex;
}
.footer .menu-bx-ft a {
  font-weight: 700; color: var(--color-fonts);
  padding: 4px 8px;
}
.footer .menu-bx-ft a:first-child {
  padding-left: 0;
}
.footer .add-tt-bx {
}
.footer .add-tt-bx .row {
  display: flex;
  justify-content: flex-start; align-items: center;
}
.footer .add-tt-bx .row span {
  padding: 4px 8px;
}
.footer .add-tt-bx .row span:first-child {
  padding-left: 0;
}

section .inner .col-bx.trvlPrps {
  width: 65%; height: calc(100vh - 58px);
}
.col-bx.trvlPrps .inner .cstmr-Input form {
  width: 100%;
}
.col-bx.trvlPrps .inner .cstmr-Input {
  display: flex;
  flex-direction: column;  align-items: flex-start;
  width: 100%;
  padding: 80px 0 0;
  overflow: hidden;
}
.cstmr-Input .inp-dtil .row .inp-bx.line.row-dub {
  display: flex;
  flex-direction: row; justify-content: center;
  gap: 8px;
}
.cstmr-Input .inp-dtil .row .inp-bx.line.row-dub a.button.Gray-1 {
  margin-right: 16px;
}
.cstmr-Input .inp-dtil .row .inp-bx.line.row-dub a.button.Gray-1 > span {
  padding-right: 16px;
  color: var(--color-point);
}
.inp-dtil.main .inp-bx.line.row-dub .select-box,
.inp-dtil.main .inp-bx.line.row-dub .dtpck-bx {
  width: 50%;
}
.inp-dtil.main .inp-bx.line.row-dub .dtpck-bx > input {
  border: 0px;
  width: 100%; height: 100%;
}


/**************************************************** 고객정보 입력화면 style css */
section .inner .col-bx .inner .cstmr-Input {
  display: flex;
  flex-direction: column;  align-items: flex-start;
  width: 100%; height: 100%;
  padding: 80px 0 0;
  overflow: hidden;
}
.cstmr-Input > h2 {
  display: flex;
  justify-content: center; align-items: center;
  width: calc(100% - 80px - 80px);
  padding-bottom: 30px;
  font-weight: 700; color: var(--color-fonts);
  margin: 0 80px;
}
.cstmr-Input .inp-dtil,
.cstmr-Input .trip-plan,
.cstmr-Input .chck-infr,
.cstmr-Input .cmplt-cts {
  width: 100%; height: 100%;
  padding: 0 80px;
  overflow-y: auto;
  /* height: 582px; */
}
.cstmr-Input .inp-dtil .row,
.cstmr-Input .inp-dtil .row .inp-bx.line,
.card-box.hstr .row,
.card-box.hstr .row .inp-bx.line {
  width: 100%;
}
.cstmr-Input .inp-dtil .row, 
.card-box.hstr .row {
  margin-top: 30px;
}
.cstmr-Input .inp-dtil .row.mt-16, 
.card-box.hstr .row.mt-16 {
  margin-top: 16px;
}
.cstmr-Input .inp-dtil .row .inp-bx, 
.card-box.hstr .row .inp-bx {
  margin-top: 12px;
}
.cstmr-Input .inp-dtil > h3.subject {
  font-weight: 700;
  margin-top: 24px;
}
.cstmr-Input .inp-dtil .row strong, 
.card-box.hstr .row strong {
  color: var(--color-fonts);
}
.cstmr-Input .inp-dtil .row .inp-bx.mbl {
  display: grid;
  grid-template-columns: 2fr 20px 2fr 20px 2fr;
  align-items: center; justify-items: center;
}
.cstmr-Input .inp-dtil .row .inp-bx.gndr, 
.card-box.hstr .row .inp-bx.gndr {
  display: grid;
  grid-template-columns: 3fr 200px;
  align-items: center; justify-items: center;
}


.cstmr-Input .inp-dtil .row .inp-bx.gndr .input-type-2x,
.card-box.hstr .row .inp-bx.gndr .input-type-2x {
  display: flex;
  flex-direction: row; justify-content: flex-start; align-items: center;
  width: 100%;
  margin-top: 12px;
  padding-left: 16px;
}
.cstmr-Input .inp-dtil .row .inp-bx.gndr .input-type-2x > .col,
.card-box.hstr .inp-bx.gndr .input-type-2x > .col {
  position: relative;
  height: 50px;
}
.input-type-2x .col input[type=radio] {
  position: absolute;
  visibility: hidden;
}
.input-type-2x .col label {
  display: flex; align-items: center;
  position: relative;
  font-weight: 500;
  padding: 16px 32px;
  height: 100%;
  z-index: 9;
  cursor: pointer;
  -webkit-transition: all 0.25s linear;
}
.input-type-2x .col:hover label {
	color: var(--color-fonts);
}
.input-type-2x .col .check {
  display: block;
  position: absolute; top: 50%; left: 0px;
  transform: translateY(-50%);
  border: 2px solid var(--color-border-1);
  border-radius: 100%;
  height: 24px; width: 24px;
	z-index: 5;
	-webkit-transition: border .25s linear;
	        transition: border .25s linear;
}
.input-type-2x .col:hover .check {
  border-color: #f6f6f6;
}
.input-type-2x .col .check::before {
  display: block;
  position: absolute; top: 4px; left: 4px;
	content: "";
  border-radius: 100%;
  height: 12px;  width: 12px;
  margin: auto;
	-webkit-transition: background 0.25s linear;
	        transition: background 0.25s linear;
}
.input-type-2x .col input[type=radio]:checked ~ .check {
  border: 2px solid var(--color-point);
}
.input-type-2x .col input[type=radio]:checked ~ .check::before {
  background: var(--color-point);
}
.input-type-2x .col input[type=radio]:checked ~ label {
  color: var(--color-point);
}

.cstmr-Input .inp-dtil .row .inp-bx.gndr .gndr-tgg-bx {
  width: 100%;
  margin-top: 12px; margin-left: 16px;
}
.cstmr-Input .inp-dtil .row .inp-bx.gndr .gndr-tgg-bx .toggle {
  max-width: 200px;
}
.gndr-tgg-bx .toggle-label {
  background-color: rgba(96, 177, 7, 0.08);
  width: 100%;
}
.gndr-tgg-bx .toggle-label span {
  color: var(--color-fonts);
}
.gndr-tgg-bx .toggle-label:before {
  content: "여자";
  line-height: 21px; color: #fff;;
  width: 50%;
  margin: 0px;
  background: var(--color-point);
}
.gndr-tgg-bx .toggle-checkbox:checked + .toggle-label:before {
	content: "남자";
}

.cstmr-Input .inp-dtil .row.cmpnn {
  display: flex;
  flex-direction: column; align-items: flex-start;
}
.cstmr-Input .inp-dtil .row.cmpnn .bt-add-bx {
  display: flex;
  justify-content: center; align-items: center;
  width: 100%;
  margin: 24px 0;
}
.cstmr-Input .inp-dtil .row.cmpnn .bt-add-bx a.Medium {
  width: 188px;
}
.cstmr-Input .inp-dtil .row.cmpnn .bt-add-bx a.button svg {
  stroke: #fff;;
  margin-left: 8px;
}
.cstmr-Input .inp-dtil .row.cmpnn .col-inp-bx {
  display: flex;
  flex-direction: column; align-items: flex-start;
}
.cstmr-Input .inp-dtil .row.cmpnn .col-inp-bx > h3 {
  display: flex;
  flex-direction: row; justify-content: space-between; align-items: center;
  font-weight: 700;
  padding: 12px 0;
}
.cstmr-Input .inp-dtil .row.cmpnn .col-inp-bx .inp-bx-add {
  margin-top: 30px;
} 
.cstmr-Input .inp-dtil .row.cmpnn .col-inp-bx .inp-bx-add.first {
  margin-top: 0px;
}

/**************************************************** Card Box style css */
.card-bx {
  background-color: #fff;;
  width: 100%;
  padding: 16px 24px;
  margin-top: 24px;
}
.card-bx.line {
  border: 1px solid var(--color-border-1);
}
.card-bx.line.active {
  background: rgba(96, 177, 7, 0.08);
  box-shadow: 0px 0px 8px 0px rgba(96, 177, 7, 0.08), 2px 4px 18px 0px rgba(96, 177, 7, 0.08);
}
.card-bx:first-child {
  margin-top: 0;
}
.card-bx .row {
  display: flex;
  flex-direction: row; justify-content: space-between; align-items: center;
}
.card-bx .row .subject {
  font-weight: 500;
}

.card-bx .Details .row {
  display: flex;
  flex-direction: row; justify-content: flex-start; align-items: center;
  padding: 12px 0 10px;
}
.card-bx .Details .row strong {
  font-weight: 600; color: var(--color-fontGray);
}
.card-bx .Details .row span,
.card-bx .Details .row .txt {
  font-weight: 400; color: var(--color-fonts);
  margin-left: 16px;
}
.card-bx .Details .row span.thnm-ppl {
  display: flex;
  flex-direction: row; align-items: center;
}
.card-bx .Details .row span.thnm-ppl a.button {
  margin-left: 8px;
}
.card-bx .Details .row .txt b {
  color: var(--color-point); font-weight: 700;
}

/**************************************************** 여행플랜 style css */
.cstmr-Input .trip-plan .bx-list {
  display: flex;
  flex-direction: column; align-items: flex-start;
  margin-top: 20px;
}
.cstmr-Input .trip-plan .bx-list .card-line-bx > .travel-plan {
  width: 560px; height: 116px;
}
.travel-plan .top-ttl-link span {
  font-weight: 500;
  display: block;
  margin-left: 20px;
}
.travel-plan .top-ttl-link .chck-ttl {
  position: relative;
}
.travel-plan .top-ttl-link .chck-ttl .check-icon {
  position: relative; top: 3px; left: 0;
}
.travel-plan .top-ttl-link .chck-ttl .check-icon svg {
  stroke: #fff;;
  position: absolute; top: 5px; left: 3px; z-index: 1;
}
.travel-plan .top-ttl-link .chck-ttl .check-icon:after {
  content: "";
  position: absolute; top: 0; left: 0;
  display: flex; justify-content: center; align-items: center;
  width: 14px; height: 14px;
  border-radius: 30px;
  background-color: #fff;; border: 1px solid var(--color-border-1);
}
.travel-plan .grnt-cntn {
  display: flex;
  flex-direction: row; justify-content: flex-start; align-items: center;
}
.travel-plan .grnt-cntn span {
  color: var(--color-fontGray);
  padding: 4px 4px;
}
.travel-plan .grnt-cntn span:first-child {
  padding-left: 0px;
}
.travel-plan .amnt {
  color: var(--color-fonts);
  font-weight: 400;
}
.travel-plan .amnt strong {
  font-weight: 700;
  color: var(--color-point);
}
.travel-plan input:checked+label .top-ttl-link .chck-ttl .check-icon:after {
  border-color: var(--color-point);
  background-color: var(--color-point);
}

/****************************************************** 25.01.21 수정 *************/
.trip-plan .bx-list .card-line-bx.accd-box {
  width: 100%;
}
.trip-plan .bx-list .card-line-bx.accd-box .accordion-item {
  display: flex; flex-direction: column;
  width: 100%; height: 100%;
  margin-top: 24px;
}
.trip-plan .bx-list .card-line-bx.accd-box .accordion-item:first-child {
  margin-top: 0;
}
/* .accd-box .accordion-item a[aria-expanded=true] {
  border-bottom: 1px solid #03b5d2;
} */
.accd-box button {
  position: relative; z-index: 1;
  display: flex;
  flex-direction: column; justify-content: center; align-items: center;
  padding: 16px 24px;
  background-color: var(--color-white); border: 1px solid var(--color-border-1);
}
.accd-box button:hover, .accd-box button:focus, .accd-box button.active {
  cursor: pointer;
  background-color: rgba(96, 177, 7, .08); border-color: var(--color-point);
  color: var(--color-white);
}
.accd-box button:hover::after, .accd-box button:focus::after {
  cursor: pointer;
}
.accd-box button .accordion-title {
  display: flex;
  flex-direction: row; justify-content: space-between; align-items: flex-end;
  width: 100%;
}
.accd-box button .accordion-title strong {
  display: flex; justify-content: flex-start;
  width: auto;
  padding-left: 22px;
}
.accd-box button .accordion-title a.tt-link2 {
  width: auto;
}
.accd-box button .icon {
  display: inline-block;
  position: absolute; top: 18px; left: 24px;
  /* position: relative; top: 3px; left: 0; */
  width: 14px; height: 14px;
  border: 1px solid var(--color-border-1);
  border-radius: 30px;
}
.accd-box button .icon svg {
  stroke: #fff;
  position: absolute;
  top: 4px;
  left: 2px;
  z-index: 1;
}
.accd-box button[aria-expanded=true] .icon {
  border-color: var(--color-point);
  background-color: var(--color-point);
}
.accd-box button[aria-expanded=true] .icon::after {
  width: 0;
}
/*
.accd-box button[aria-expanded=true] + .accordion-content {
  opacity: 1;
  min-height: 200px; height: 100%;
  transition: all 200ms linear;
  will-change: opacity, max-height;
}
.accd-box .accordion-content {
  opacity: 0;
  height: 0;
  overflow: hidden;
  transition: opacity 200ms linear, max-height 200ms linear;
  will-change: opacity, max-height;
  border: 1px solid var(--color-border-1);
  margin-top: 8px;
}
*/
/* 버튼 아이콘 스타일 */
.accd-box button .icon {
  display: inline-block;
  border: 1px solid var(--color-border-1);
  border-radius: 30px;
}

/* 아이콘 내부 */
.accd-box button .icon svg {
  stroke: #fff;
  z-index: 1;
}

/* 버튼이 활성화되었을 때 아이콘 스타일 */
.accd-box button[aria-expanded="true"] .icon {
  border-color: var(--color-point);
  background-color: var(--color-point);
}

/* 아코디언 컨텐츠 기본적으로 숨김 */
.accd-box .accordion-content {
  opacity: 0;
  height: 0;
  overflow: hidden;
  transition: opacity 200ms linear, height 200ms linear;
  border: 1px solid var(--color-border-1);
  margin-top: 8px;
}

/* 버튼이 활성화되었을 때 컨텐츠 보이기 */
.accd-box button[aria-expanded="true"] + .accordion-content,
.accd-box button.active + .accordion-content {
  opacity: 1;
  height: auto;
  min-height: 200px;
}


.accd-box .accordion-content .inner-flan-detas {
  width: 100%;
}
.accordion-item .row {
  display: flex;
  flex-direction: row; justify-content: space-between; align-items: flex-end;
  width: 100%;
}
.accordion-item .grnt-cntn {
  display: flex;
  flex-direction: row; justify-content: flex-start; align-items: center;
}
.accordion-item .grnt-cntn span {
  color: var(--color-fontGray);
  padding: 4px 4px;
}
.accordion-item .grnt-cntn span:first-child {
  padding-left: 0px;
}
.accordion-item .amnt {
  color: var(--color-fonts);
  font-weight: 400;
}
.accordion-item .amnt strong {
  font-weight: 700;
  color: var(--color-point);
}
.accordion-item .inner-plan {
  padding: 1rem;
}
.accordion-item .inner-plan .plan-name {
  display: block;
  font-weight: 500;
  color: var(--color-fonts);
  width: 100%;
  padding: 8px 0 16px;
  border-bottom: 1px solid var(--color-border-1);
}
.details-box, .details-box .inner-flan-detas {
  width: 100%;
}
.details-box .inner-flan-detas .row {
  display: flex;
  flex-direction: row; justify-content: space-between; align-items: center;
  padding: 16px 0;
  border-bottom: 1px solid var(--color-border-1);
}
.details-box .inner-flan-detas .row:last-child {
  border-bottom: 0px;
}
.details-box .inner-flan-detas .row .subject {
  display: flex;
  flex-direction: column; align-items: flex-start; justify-content: center;
}
.details-box .inner-flan-detas .row .subject strong {
  display: flex;
  flex-direction: row; justify-content: flex-start; align-items: center;
  font-weight: 600;
}
.details-box .inner-flan-detas .row .subject strong > span {
  font-weight: 500; color: var(--color-point);
  margin-right: 6px;
}
.details-box .inner-flan-detas .row .subject  > p {
  color: var(--color-fontGray); font-weight: 300;
  padding-top: 4px;
}
.krw-info-area {
  display: flex;
  flex-direction: row; align-items: flex-end;
}
.krw-info-area .button.icon,
.krw-info-area .icon.info {
  margin: 0 12px;
}
.krw-info-area .icon.info > svg {
  fill: var(--color-point)
}
.krw-info-area .krw-box > span {
  font-weight: 700; margin-right: 4px;
}

/* 툴팁 기본 스타일 설정 시작 */
.krw-info-area .icon.info.tooltip {
  position: relative;
  display: block;
}

.tooltip .tooltiptext {
  visibility: hidden;
  min-width: 430px; width: 100%;
  background-color: rgba(96, 177, 7, .95); border-radius: 6px;
  color: var(--color-white); font-weight: 400; text-align: center;
  padding: 16px 16px;

  position: absolute;
  z-index: 1;
}
.tooltip:hover .tooltiptext {
  visibility: visible;
}
.tooltip:hover .tooltiptext strong {
  color: var(--color-white); font-weight: 600;
}
.tooltip:hover .tooltiptext p {
  color: var(--color-white); font-weight: 400;
}
/* 툴팁 기본 스타일 설정 끝 */

/* -------------------------- */

/* 툴팁 화살표 기본 스타일 설정 시작 */
.tooltip .tooltiptext::after {
  content: " ";
  position: absolute;
  border-style: solid;
  /*border-width: 5px;*/
}
/* 툴팁 화살표 기본 스타일 설정 끝 */

/* -------------------------- */

/* 툴팁 방향 설정 시작 */
/* 왼쪽 툴팁 시작 */
.tooltip .tooltip-left {
  top: -5px;
  right: 105%;
}
.tooltip .tooltip-left::after {
  top: 50%;
  left: 100%;
  margin-top: -5px;
  /*border-color: transparent transparent transparent rgba(96, 177, 7, .95);*/
}
/* 왼쪽 툴팁 끝 */

/* 오른쪽 툴팁 시작 */
.tooltip .tooltip-right {
  top: -5px;
  left: 105%;
}
.tooltip .tooltip-right::after {
  top: 50%;
  right: 100%;
  margin-top: -5px;
  /*border-color: transparent rgba(96, 177, 7, .95) transparent transparent;*/
}
/* 오른쪽 툴팁 끝 */

/* 위쪽 툴팁 시작 */
.tooltip .tooltip-top {
  width: 120px;
  bottom: 150%;
  left: 50%;
  margin-left: -60px;
}
.tooltip .tooltip-top::after {
  top: 100%;
  left: 50%;
  margin-left: -5px;
  /*border-color: rgba(96, 177, 7, .95) transparent transparent transparent;*/
}

/* 아래쪽 툴팁 시작 */
.tooltip .tooltip-bottom {
  width: 120px;
  top: 150%;
  left: 50%;
  margin-left: -60px;
}
.tooltip .tooltip-bottom::after {
  bottom: 100%;
  left: 50%;
  margin-left: -5px;
  /*border-color: transparent transparent rgba(96, 177, 7, .95) transparent;*/
}
/* 아래쪽 툴팁 시작 */

/* 툴팁 방향 설정 끝 */

/****************************************************** 25.01.25 Tab Add *************/
.accordion-content > input, .accordion-content .tab-cont-inner > .tabs-accd {
  display: none;
}
.accordion-content .nav ul {
  display: flex;
  flex-direction: row; justify-content: flex-start; align-items: center;
  list-style: none;
  margin: 0; padding: 0;
}
.accordion-content .nav ul li {
  width: 20%; height: 55px;
}
/* 선택된 탭 버튼 스타일 */
.accordion-content input:checked + .nav ul li.grntStal-01 label,
.accordion-content input:checked + .nav ul li.grntStal-11 label,
.accordion-content input:checked + .nav ul li.grntStal-21 label {
  background-color: var(--color-point);
  color: var(--color-white);
  border-color: var(--color-point);
  position: relative;
}
.accordion-content .nav ul li label {
  display: flex;
  justify-content: center; align-items: center;
  color: var(--color-fontGray);
  width: 100%; height: 100%;
  border: 1px solid var(--color-border-1);
  border-bottom: 0;
  background: #f6f6f6;
  cursor: pointer;
}
.accordion-content .nav ul li label:active {
  background-color: var(--color-point);
}
.accordion-content .nav ul li:not(:last-child) label {
  border-right-width: 0;
}
.accordion-content .tab-cont-inner .tabs-accd {
  padding: 0 1rem;
  border-top: 1px solid var(--color-border-1);
}

/* 개별 선택자 수정 */
#grntStal-01:checked ~ .nav ul .grntStal-01 label,
#grntStal-02:checked ~ .nav ul .grntStal-02 label,
#grntStal-03:checked ~ .nav ul .grntStal-03 label,
#grntStal-04:checked ~ .nav ul .grntStal-04 label,
#grntStal-05:checked ~ .nav ul .grntStal-05 label,

#grntStal-11:checked ~ .nav ul .grntStal-11 label,
#grntStal-12:checked ~ .nav ul .grntStal-12 label,
#grntStal-13:checked ~ .nav ul .grntStal-13 label,
#grntStal-14:checked ~ .nav ul .grntStal-14 label,
#grntStal-15:checked ~ .nav ul .grntStal-15 label,

#grntStal-21:checked ~ .nav ul .grntStal-21 label,
#grntStal-22:checked ~ .nav ul .grntStal-22 label,
#grntStal-23:checked ~ .nav ul .grntStal-23 label,
#grntStal-24:checked ~ .nav ul .grntStal-24 label,
#grntStal-25:checked ~ .nav ul .grntStal-25 label {
  background-color: var(--color-point);
  color: var(--color-white);
  border-color: var(--color-point);
  position: relative;
}
#grntStal-01:checked ~ .nav .grntStal-01 label:after, #grntStal-02:checked ~ .nav .grntStal-02 label:after,
#grntStal-03:checked ~ .nav .grntStal-03 label:after, #grntStal-04:checked ~ .nav .grntStal-04 label:after,
#grntStal-05:checked ~ .nav .grntStal-05 label:after,

#grntStal-11:checked ~ .nav .grntStal-11 label:after, #grntStal-12:checked ~ .nav .grntStal-12 label:after,
#grntStal-13:checked ~ .nav .grntStal-13 label:after, #grntStal-14:checked ~ .nav .grntStal-14 label:after,
#grntStal-15:checked ~ .nav .grntStal-15 label:after,

#grntStal-21:checked ~ .nav .grntStal-21 label:after, #grntStal-22:checked ~ .nav .grntStal-22 label:after,
#grntStal-23:checked ~ .nav .grntStal-23 label:after, #grntStal-24:checked ~ .nav .grntStal-24 label:after,
#grntStal-25:checked ~ .nav .grntStal-25 label:after {
  content: "";
  display: block;
  position: absolute; left: 0; bottom: -1px;
  height: 2px; width: 100%;
  background: var(--color-point);
}
#grntStal-01:checked ~ .tab-cont-inner .tabs-accd.grntStal-01, #grntStal-02:checked ~ .tab-cont-inner .grntStal-02,
#grntStal-03:checked ~ .tab-cont-inner .grntStal-03, #grntStal-04:checked ~ .tab-cont-inner .grntStal-04,
#grntStal-05:checked ~ .tab-cont-inner .grntStal-05,

#grntStal-11:checked ~ .tab-cont-inner .tabs-accd.grntStal-11, #grntStal-12:checked ~ .tab-cont-inner .grntStal-12,
#grntStal-13:checked ~ .tab-cont-inner .grntStal-13, #grntStal-14:checked ~ .tab-cont-inner .grntStal-14,
#grntStal-15:checked ~ .tab-cont-inner .grntStal-15,

#grntStal-21:checked ~ .tab-cont-inner .tabs-accd.grntStal-21, #grntStal-22:checked ~ .tab-cont-inner .grntStal-22,
#grntStal-23:checked ~ .tab-cont-inner .grntStal-23, #grntStal-24:checked ~ .tab-cont-inner .grntStal-24, 
#grntStal-25:checked ~ .tab-cont-inner .grntStal-25 {
  display: block;
}




/********************************************************************
              동의 & 예아니오 radio check style css
********************************************************************/
.cstmr-Input h2.double,
.agreement h2.double {
  display: flex;
  flex-direction: row; justify-content: space-between; align-items: center;
}
.agreement h2.double {
  margin-top: 50px;
  padding-bottom: 10px;
  font-weight: 700; color: var(--color-fonts);
}
.cstmr-Input h2 a.Gray {
  font-weight: 500;
}
.inp-dtil .dsclm .row,
.agreement .line-bx .row {
  display: flex; 
  justify-content: space-between; flex-direction: row;
}
.inp-dtil .dsclm.line {
}
.inp-dtil .dsclm .row.line-bx {
  border-bottom: 1px solid var(--color-border-1);
}
.dsclm .row .col .choice,
.agreement .line-bx .row .col .choice {
  display: flex;
  flex-direction: row; justify-content: flex-end; align-items: center;
  border: 1px solid var(--color-border-1);
  width: 152px;
}
.dsclm .row .col .choice span.choiceChk ,
.agreement .line-bx .row .col .choice span.choiceChk {
  height: 34px; line-height: 34px;
}
.choice span.choiceChk.first,
.choice span.choiceChk.first label {
  border-radius: 3px 0 0 3px;
}
.choice span.choiceChk.first {
  border-right: 1px solid var(--color-border-1);
}
.choice span.choiceChk.second,
.choice span.choiceChk.second label {
  border-radius: 0 3px 3px 0;
}
.dsclm .row .col .choice span.choiceChk label,
.agreement .line-bx .row .col .choice span.choiceChk label {
  display: flex;
  justify-content: center; align-items: center;
  width: 75px; height: 34px; line-height: 34px; min-height: 34px;
  font-weight: 400;
  cursor: pointer;
}
.row.line-bx .col.double {
  display: flex;
  flex-direction: row; align-items: center; justify-content: flex-start;
  gap: 8px;
}
.row.line-bx .col.double .Small {
  padding: 4px 8px;
}



/**************************************************** 정보 확인 style css */
.cstmr-Input .chck-infr .bx-list {
  display: flex;
  flex-direction: column; align-items: flex-start;
  margin-top: 30px;
}

/**************************************************** 완료 style css */
section .inner .col-bx .inner .cstmr-cmplt {
  display: flex;
  flex-direction: column;  align-items: flex-start;
  width: 100%;
  padding: 80px 0 0;
  overflow: hidden;
}
.cstmr-cmplt .cmplt-cts {
  display: flex;
  flex-direction: column; align-items: center;
}
.cstmr-cmplt .cmplt-cts .bx-list h4 {
  display: flex;
  flex-direction: column;
  justify-content: center; align-items: center;
  font-weight: 700; color: var(--color-fonts);
  text-align: center;
}
.cstmr-cmplt .cmplt-cts .bx-list h4 p {
  display: flex; justify-content: center; align-items: baseline;
  padding-bottom: 8px;

}
.cstmr-cmplt .cmplt-cts .bx-list h4 strong {
  color: var(--color-point);
}
.cstmr-cmplt .cmplt-cts .bx-list .img {
  margin-top: 30px;
  display: flex; justify-content: center; align-items: center;
}
.bx-details {
  margin-top: 30px;
}
.bx-details strong {
  display: flex; justify-content: center; align-items: center;
  font-weight: 700;
  margin-bottom: 16px;
}
.bx-details p {
  text-align: center;
}



/**************************************************** Menu style css */
.col-bx.menu {
  max-width: 35%;
}
.menu-infr-bx {
}
.menu-infr-bx ul {
  display: flex;
  flex-direction: column; align-items: flex-start;
}
.menu-infr-bx ul li {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 8px 30px;
  border-bottom: 1px solid var(--color-border-1);
}
.menu-infr-bx ul li:last-child {
  border-bottom: 0px;
}
.menu-infr-bx ul li .depth-1,
.menu-infr-bx ul li .depth-1 > h3 {
  width: 100%;
}
.menu-infr-bx ul li .depth-1 > h3 {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin: 8px 0;
  height: auto;
}
.menu-infr-bx ul li .depth-1 > h3 .subject {
  display: flex; justify-content: center; align-items: center;
}
.menu-infr-bx ul li .depth-1 > h3 .subject span {
  margin-left: 8px;
}
.menu-infr-bx ul li.on .depth-1 > h3 strong,
.menu-infr-bx ul li.on .depth-1 > h3 span {
  font-weight: 700;
  color: var(--color-point);
}
.menu-infr-bx ul li.active {
  display: flex;
  flex-direction: column; align-items: flex-start;
  padding: 0px 30px;
}
.menu-infr-bx ul li.active .depth-1 > h3 {
  margin: 8px 0 4px;
}
.menu-infr-bx ul li.active .depth-2,
.menu-infr-bx ul li.active .depth-2 .row,
.menu-infr-bx ul li.active .depth-2 .row .col {
  width: 100%;
}
.menu-infr-bx ul li.active .depth-2 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-bottom: 12px;
}
.menu-infr-bx ul li.active .depth-2 .row .col {
  display: flex;
  flex-direction: row; flex-wrap: wrap;
  justify-content: flex-start; align-items: center;
}
.menu-infr-bx ul li.active .depth-2 .row {
  padding: 8px 0px 4px;
}
.menu-infr-bx ul li.active .depth-2 .row .col .ic-arrow {
  width: 16px; height: 16px;
  margin-right: 8px;
}
.depth-2 .row .col .ic-arrow svg {
  stroke: #393D35;
}
.depth-2 .row .col strong {
  margin-right: 8px;
  font-weight: 600;
}
.depth-2 .row .col span {
  margin-left: 8px;
  color: var(--color-fontGray);
  font-weight: 400;
}
.menu-infr-bx ul li.active .depth-2 .row .col.details {
  padding: 8px 16px; padding-bottom: 0;
}
.menu-infr-bx ul li.active .depth-2 .row .col.detailsspan {
  margin-left: 0px;
}



/*********************************************************************************************
						  FAQ Style css
*****************************/

.atnt-note {
  margin: 0 auto;
}
.atnt-question {
  position: relative;
  padding: 0px 0;
}
.atnt-title {
  position: relative;
  width: 100%; font-weight: 700;
  margin: 0; padding: 16px 0px;
  display: block;
  cursor: pointer;
  border-bottom: 1px solid var(--color-border-1);
}
.atnt-panel-content {
  padding: 24px 16px;
  height: 0;
  overflow: hidden;
  position: relative;
  opacity: 0;
  -webkit-transition: .4s ease;
  -moz-transition: .4s ease;
  -o-transition: .4s ease;
  transition: .4s ease;
}
.atnt-panel:checked ~ .atnt-panel-content{
  height: auto;
  opacity: 1;
  border-bottom: 1px solid var(--color-border-1);
}
.drop-down {
  position: absolute; right: 0; top: 16px; z-index: 5;
  -webkit-user-select: none;    
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
     user-select: none;
  -webkit-transition: .2s ease;
  -moz-transition: .2s ease;
  -o-transition: .2s ease;
  transition: .2s ease;
}
.drop-down img {
  width: 16px; height: 16px;
}
.atnt-panel:checked ~ .drop-down {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}
.atnt-panel {
  display: none;
}




/*********************************************************************************************
						  MyPage Style css
*****************************/
section .mypg-box {
  display: flex;
  flex-direction: row;
  gap: 50px;
  width: 1380px;
  height: calc(100vh - 88px - 30px);
  margin: 30px 15%;
  overflow: hidden;
}
section .mypg-box .left-menu.mypg {
  width: 250px; height: 100%;
  border-radius: var(--radius-16);
  background-color: var(--color-white);
}
section .mypg-box .left-menu.mypg ul {
  margin-top: 16px;
}
section .mypg-box .left-menu.mypg ul li {
  border-bottom: 1px solid var(--color-border-1);
}
section .mypg-box .left-menu.mypg ul li a {
  display: flex;
  justify-content: space-between; align-items: center;
  padding: 16px;
  font-weight: 700;
}
section .mypg-box .left-menu.mypg ul li a > svg {
  stroke: var(--color-fonts)
}
section .mypg-box .left-menu.mypg ul li a.active {
  color: var(--color-point);
}
section .mypg-box .left-menu.mypg ul li a.active > svg {
  stroke: var(--color-point);
}

section .mypg-box .card-main-box {
  width: calc(100% - 300px); height: 100%;
  border-radius: var(--radius-16);
  background-color: var(--color-white);
}
.card-main-box .content-box {
  width: 100%; height: 100%;
}
.card-main-box .cardBox > h2 {
  color: var(--color-fonts); font-weight: 700;
  margin: 30px 24px 0;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--color-border-1);
}
.card-main-box .content-box .inner {
  display: flex;
  justify-content: center; align-items: flex-start;
  margin: 80px 0 0;
}
.card-main-box .content-box .inner .card-box.hstr {
  width: 500px;
}
.card-box.hstr .row .inp-bx.mbl {
  display: grid;
  grid-template-columns: 2fr 20px 2fr 20px 2fr 8px 2fr;
  align-items: center; justify-items: center;
}
.card-box.hstr .row .inp-bx.mbl .button.Primary {
  height: 50px; width: 100%;
}
#verificationBox {
  display: none;
  margin-top: 10px;
}
#timer {
  color: var(--color-red);
  font-weight: 700;
  padding-right: 16px;
}
.inputBox {
  display: flex;
  flex-direction: row; justify-content: space-between; align-items: center;
  width: 80%; height: 50px;;
  background-color: var(--color-white);
  border: 1px solid var(--color-border-1);
}
.inputBox input {
  border: 0px !important;;
}
.card-box.hstr .row.vrfctCode .inp-bx.line {
  display: flex;
  flex-direction: row; justify-content: space-between; align-items: stretch;
}
.card-box.hstr .row.vrfctCode button {
  margin-left: 8px;
  width: calc(20% - 8px);
}

/**************************************************** 내 가입내역 style css */
.history-box .inner {
  padding: 30px 24px;
}
.history-box .inner table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}
.history-box .inner table thead th {
  background-color: #F6F6F6;
}
.history-box .inner table tr th,
.history-box .inner table tr td {
  border: 1px solid var(--color-border-1);
  padding: 12px 8px;
  font-size: var(--font-14);
  vertical-align: middle;
  text-align: center;
}
.history-box .inner table tr th:first-child,
.history-box .inner table tr td:first-child {
  border-left: 0px;
}
.history-box .inner table tr th:last-child,
.history-box .inner table tr td:last-child {
  border-right: 0px;
}
.history-box .inner table tr td.left {
  text-align: left;
}
.history-box .inner table tr td.right {
  text-align: right;
}
.history-box .inner table tr td a.Primary {
  padding: 8px 16px;
}
.waiting {
  color: var(--color-fontGray);
}
.complete {
  color: var(--color-red);
}

/**************************************************** 쿠폰함 style css */
.coupon-box .inner {
  align-items: center;
  margin: 30px 24px 0;
}
.coupon-box .inner .card-box {
  border: 1px solid var(--color-border-1);
  width: 580px;
  margin-top: 30px;
}
.coupon-box .inner .card-box:first-child {
  margin-top: 0;
}
.coupon-box .inner .card-box .row {
  display: flex;
  flex-direction: row; justify-content: space-between; align-items: stretch;
  height: 180px;
}
.coupon-box .inner .card-box .row .col:first-child {
  display: flex;
  flex-direction: column; justify-content: center; align-items: flex-start;
  padding: 24px 50px;
}
.card-box .row .col .row-item {
  display: flex; align-items: center;
  padding: 8px 0px 4px 0px;
  gap: 24px;
  align-self: stretch;
}
.card-box .row .col .row-item:nth-child(2) {
  padding: 4px 0px;
  gap: 8px;
}
.card-box .row .col .row-item:last-child {
  padding: 4px 0px 8px 0px;
  gap: 8px;
}
.card-box .row .col .row-item span,
.card-box .row .col .row-item strong {
  font-weight: 400;
  color: var(--color-fonts);
}
.card-box .row .col .row-item strong {
  font-weight: 700;
}
.card-box .row .col .row-item strong.coupon {
  color: var(--color-point);
}
.card-box.expiry  .row .col .row-item span,
.card-box.expiry  .row .col .row-item strong {
  color: var(--color-Placeholder);
}
.card-box.complete  .row .col .row-item strong.coupon {
  color: var(--color-fonts);
}

.coupon-box .inner .card-box .row .col:last-child {
  width: 150px; height: 100%;
  display: flex;
  flex-direction: column; justify-content: center; align-items: center;
}
.coupon-box .inner .card-box .row .col:last-child > strong {
  color: var(--color-point);
  margin-top: 16px;
}
.coupon-box .inner .card-box.expiry .row .col:last-child > strong {
  color: var(--color-Placeholder);
}
.coupon-box .inner .card-box.complete .row .col:last-child > strong {
  color: var(--color-red);
}
.coupon-box .inner .card-box .row .col .icon-check {
  display: flex;
  justify-content: center; align-items: center;
  width: 58px; height: 58px;
  border-radius: 100%;
  border: 1px solid var(--color-border-1);
}
.coupon-box .inner .card-box.available .row .col .icon-check svg {
  stroke: var(--color-point)
}
.coupon-box .inner .card-box.expiry .row .col .icon-check svg {
  fill: var(--color-Placeholder);
}
.coupon-box .inner .card-box.complete .row .col .icon-check svg {
  stroke: var(--color-red)
}

/**************************************************** faq style css */
.faq-box {
  height: calc(100vh - 119px - 24px);
  margin-bottom: 24px;
  overflow: hidden;
}
.faq-box .inner {
  padding: 30px;
  flex-direction: column; align-items: flex-start;
  overflow: auto;
}
.accordion {
  display: flex; flex-direction: column; align-items: flex-start; align-self: stretch;
  width: 100%;
}
.accordion button {
  position: relative;
  display: flex; justify-content: flex-start; align-items: center;
  align-self: stretch;
  border-bottom: 1px solid var(--color-border-1);
  padding: 24px 0px;
  width: 100%;
  background: none; outline: none;
}
.accordion button:hover, .accordion button:focus {
  cursor: pointer;
  color: #03b5d2;
}
.accordion button:hover::after, .accordion button:focus::after {
  cursor: pointer;
  color: #03b5d2;
  border: 1px solid #03b5d2;
}
.accordion .accordion-item {
  width: 100%;
}
.accordion button .accordion-title {
  display: flex;
  flex-direction: row; justify-content: flex-start;
  text-align: left;
  width: calc(100% - 24px);
  padding-right: 4px;
  word-break: keep-all;
}
.accordion button .icon {
  display: inline-block;
  position: absolute; top: 50%; right: 0;
  transform: translateY(-50%);
}
.accordion button .icon svg {
  transform: rotate(0deg); transition-duration: .3s;
  stroke: var(--color-fonts);
}
.accordion button[aria-expanded=true] > span {
  color: var(--color-point);
}
.accordion button[aria-expanded=true] .icon svg {
  transform: rotate(180deg); transition-duration: .3s;
  stroke: var(--color-point);
}
.accordion button[aria-expanded=true] + .accordion-content {
  opacity: 1;
  max-height: 100%;
  transition: all 200ms linear;
  will-change: opacity, max-height;
  padding: 24px;
}
.accordion .accordion-content {
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transition: opacity 200ms linear, max-height 200ms linear;
  will-change: opacity, max-height;
  background-color: #F8F8F8;
  padding: 0 24px;
}



/**************************************************** 스크롤바 style css */
/* 스크롤바 설정*/
section .inner.cstInf .col-bx.ip-if-bx::-webkit-scrollbar,
section .inner .col-bx.ip-if-bx .inner::-webkit-scrollbar,
section .inner .col-bx.ip-if-bx form .inner::-webkit-scrollbar,
section .inner.cstInf .col-bx.ip-cmplt-bx::-webkit-scrollbar,
.trip-plan::-webkit-scrollbar,
.inp-dtil::-webkit-scrollbar,
.chck-infr::-webkit-scrollbar,
.faq-box .inner::-webkit-scrollbar {
  width: 8px;
  margin-top: 20px;
}
/* 스크롤바 막대 설정*/
section .inner.cstInf .col-bx.ip-if-bx::-webkit-scrollbar-thumb,
section .inner .col-bx.ip-if-bx .inner::-webkit-scrollbar-thumb,
section .inner .col-bx.ip-if-bx form .inner::-webkit-scrollbar-thumb,
section .inner.cstInf .col-bx.ip-cmplt-bx::-webkit-scrollbar-thumb,
.trip-plan::-webkit-scrollbar-thumb,
.inp-dtil::-webkit-scrollbar-thumb,
.chck-infr::-webkit-scrollbar-thumb,
.faq-box .inner::-webkit-scrollbar-thumb {
  background: rgba(96, 177, 7, 1); border: 1px solid rgba(0, 0, 0, .05);
  border-radius: 4px;
}
/* 스크롤바 뒷 배경 설정*/
section .inner.cstInf .col-bx.ip-if-bx::-webkit-scrollbar-track,
section .inner .col-bx.ip-if-bx .inner::-webkit-scrollbar-track,
section .inner .col-bx.ip-if-bx form .inner::-webkit-scrollbar-track,
section .inner.cstInf .col-bx.ip-cmplt-bx::-webkit-scrollbar-track,
.trip-plan::-webkit-scrollbar-track,
.inp-dtil::-webkit-scrollbar-track,
.chck-infr::-webkit-scrollbar-track,
.faq-box .inner::-webkit-scrollbar-track {
  background-color: rgba(96, 177, 7, .15);
}




/*********************************************************************************************
						  UI Datepicker Style css
*****************************/
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
  border: solid rgba(255, 255, 255, .55)!important;
  border-width: 1px 0 0 1px!important;
}
.ui-datepicker td {
  border: 1px solid #CCC !important;
  padding: 0 !important
}
.ui-datepicker-calendar thead tr th {
  border: 1px solid #CCC !important;
  background: linear-gradient(20deg, #e2e2e2, #eeeeee) !important;
}
.ui-datepicker-calendar thead tr th span {
  display: block;
  font-size: var(--font-size-12); color: var(--color-black);
  text-transform: uppercase !important;
  border: solid rgba(255, 255, 255, .55) !important;
  border-width: 1px 0 0 1px !important;
  width: 100%; height: 22px; line-height: 22px;
}
.ui-widget-header {
  background: #2d2d2d !important;
  border: 0 !important
}
.ui-datepicker .ui-datepicker-title {
  color: #fff !important;
}
.ui-datepicker .ui-datepicker-title select {
  background: #2d2d2d !important;
  color: #fff !important;
  font-size: 15px !important;
}
.ui-widget-header .ui-icon {
  background-image: none !important;
}
.ui-datepicker .ui-datepicker-title {
  margin-top: 4px !important;
}
#ui-datepicker-div {
  padding: 0;
  width: 275px !important;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default,
.ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
  background: linear-gradient(20deg, #e2e2e2, #eeeeee) !important;
}
.ui-state-default {
  font-size: var(--font-size-12);
  font-weight: bold !important;
}
.ui-datepicker td span, .ui-datepicker td a {
  padding: 12px 0 !important;
  text-align: center !important;
}
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {
  width: 33% !important;
  padding-left: 22px !important;
}
.ui-datepicker th {
  padding: 0 0 !important;
}
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover,
.ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus,
.ui-button:hover, .ui-button:focus {
  background: #1EB7AD !important;
  box-shadow: inset 0px 0px 10px #32DACF, inset 0px 0px 20px #35e5f5 !important;
  color: #fff !important;
}
.ui-datepicker .ui-datepicker-next span {
  margin-left: -3px;
}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
  top: 1px;
}
.ui-datepicker .ui-datepicker-next {
  right: 1px;
}
.ui-datepicker .ui-datepicker-prev {
  left: 1px;
}
.ui-datepicker .ui-datepicker-prev span {
  margin-left: -14px;
}
.ui-datepicker .ui-datepicker-next.ui-datepicker-next-hover,
.ui-datepicker .ui-datepicker-prev.ui-datepicker-prev-hover {
  background: rgba(255, 255, 255, .10) !important;
  box-shadow: inset 0px 0px 2px rgba(0, 0, 0, .75), inset 0px 0px 5px rgba(255, 255, 255, .25) !important;
}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next,
.ui-datepicker-prev.ui-state-hover.ui-datepicker-prev-hover,
.ui-datepicker-next.ui-state-hover.ui-datepicker-next-hover {
  width: 37px; height: 37px;
}
.ui-datepicker table {
  margin: 0 !important;
}
.ui-datepicker-next, .ui-datepicker-prev {
  border: 0 !important;
}

/*Right Arrow*/
.ui-datepicker .ui-datepicker-next span {
  width: 0!important; height: 0!important;
  border-left: 10px solid white!important;
  border-right: 8px solid transparent!important;
  border-bottom: 8px solid transparent!important;
  border-top: 8px solid transparent!important;
}

/*Left Arrow*/
.ui-datepicker .ui-datepicker-prev span {
  width: 0!important; height: 0!important;
  border-right: 10px solid white!important;
  border-left: 8px solid transparent!important;
  border-bottom: 8px solid transparent!important;
  border-top: 8px solid transparent!important;
}



/* mobile */
@media (max-width: 1400px) {
  header .inner {
    width: 100%;
    padding: 0 16px;
  }
  header .inner .button-2x-bx .btn-inner a.pc {
    display: none;
  }
  header .inner .button-2x-bx .btn-inner a.mobile {
    display: flex;
    flex-direction: column; justify-content: space-evenly; align-items: flex-end;
  }
  body.main-bg {
    width: 100%; height: 100%;
  }
  .container {
    width: 432px;
    margin: 0 auto;
  }
  section {
    width: 432px;
    height: 100%;
    margin: 0 auto;
  }
  .footer {
    display: none;
    height: 0;
  }
  .footer.Mobile {
    display: block;
    height: auto; width: calc(100% - 16px - 16px);
    margin: 16px; margin-bottom: 0;
  }
  .col-bx.mvsl .left-vsul .tim-24-bx .inner-bnr {
    padding-bottom: 24px;
  }
  body.main-bg .inner.cnts {
    display: flex;
    flex-direction: column;
  }
  .col-bx.menu,
  .left-menu.mypg {
    display: none;
  }
  section .inner.cstInf .col-bx {
    margin: 0px auto;
    width: 100%; height: 100%;
  }
  .inner.cnts,
  .col-bx.mvsl,
  .col-bx.ip-if-bx,
  section .inner.cnts,
  section .inner .col-bx,
  section .inner .col-bx.trvlPrps,
  .col-bx.mvsl .left-vsul .tim-24-bx,
  .col-bx.mvsl .left-vsul .spc-cnt-sbs {
    width: 100%;
  }
  section .mypg-box {
    margin: 16px 0;
    height: calc(100vh - 74px);
  }
  section .mypg-box,
  section .mypg-box .card-main-box {
    width: 100%;
  }
  section .inner .col-bx.mvsl {
    height: 645px;
  }
  .col-bx.mvsl .left-vsul .tim-24-bx {
    position: relative;
  }
  section .inner .col-bx.trvlPrps {
    height: 750px;
  }
  section .inner.cnts .col-bx.mvsl .left-vsul {
    margin-top: 5%;
    height: calc(100% - 5%);
  }
  section .inner.cnts .col-bx.mvsl .left-vsul h2 {
    margin: 0 16px;
  }
  section .inner.cnts .col-bx.mvsl .left-vsul h2 > img {
    width: 80%;
  }
  .col-bx.mvsl .left-vsul .spc-cnt-sbs h3 {
    display: flex;
    flex-direction: row; justify-content: flex-start; align-items: center;
    width: calc(100% - 16px - 16px);
    margin: 0 16px;
  }
  .col-bx.mvsl .left-vsul .img-vsul {
    position: absolute; top: 115px; right: 0px;
    display: flex;
    justify-content: flex-end;
    /*width: 180px;*/
    margin-left: 40px;
  }
  .col-bx.mvsl .left-vsul .spc-cnt-sbs {
    margin-top: 15%;
  }
  .col-bx.mvsl .left-vsul .bnr-bx {
    width: calc(100% - 16px - 16px);
    margin: 0 16px;
  }
  .footer {
    padding-bottom: 16px;
  }
  section .inner.cstInf .col-bx.ip-if-bx {
    height: calc(100% - 58px);
  }
  section .inner .col-bx.ip-if-bx .inner {
    min-height: 600px;
  }
  .cstmr-Input .inp-dtil {
    width: 100%;
    padding: 0 5%;
    overflow-y: auto;
    height: 500px;
  }
  section .inner .col-bx .inner .cstmr-Input {
    padding: 24px 0 0;
  }
  .inner.cstInf .cstmr-Input .inp-dtil {
    height: 100%;
  }
  .cstmr-Input .inp-dtil, 
  .cstmr-Input .trip-plan, 
  .cstmr-Input .chck-infr, 
  .cstmr-Input .cmplt-cts {
    padding: 0 5%;
    height: 100%;
  }
  .cstmr-Input > h2 {
    width: calc(100% - 5% - 5%);
    padding-bottom: 16px; margin: 0 5%;
  }
  section .inner .col-bx .inner .btn-bx-1x .bxbt-inner, section .inner .col-bx .inner .btn-bx-2x .bxbt-inner {
    padding: 16px 0; margin: 0 5%;
    width: calc(100% - 5% - 5%);
  }
  section .inner.cstInf .col-bx.ip-if-bx,
  section .inner .col-bx .inner .cstmr-Input {
    clear:both;
  }
  section .inner.cstInf {
    gap: 0px;
    width: 100%; height: 100%;
    margin: 0 0;
  }
  section .inner.cstInf .col-bx.ip-if-bx, 
  section .inner.cstInf .col-bx.ip-cmplt-bx {
    width: 100%;
  }
  .cstmr-Input .inp-dtil .row .inp-bx.gndr {
    grid-template-columns: 3fr 120px;
  }
  .cstmr-Input .inp-dtil .row .inp-bx.gndr .gndr-tgg-bx .toggle {
    max-width: 120px;
  }
  .cstmr-cmplt .cmplt-cts .bx-list .img {
   margin-top: 24px;
  }
  .cstmr-cmplt .cmplt-cts .bx-list .img img {
    width: calc(100% - 10% - 10%);
    margin: 0 10%;
  }
  .bx-details {
    padding: 0 5%;
  }
  .bx-details strong,
  .bx-details p {
    text-align: center;
    word-break: keep-all;
  }
  .details-box .inner-flan-detas .row .subject {
    width: 58%;
  }
  .details-box .inner-flan-detas .row .subject strong > span {
    min-width: 24px;
  }

  /**/
  .card-main-box .content-box .inner {
    margin: 24px 0 0;
    justify-content: flex-start; align-items: flex-start;
    flex-direction: column;
  }
  section > form,
  .card-main-box .content-box .inner form {
    width: 100%;
  }
  .card-main-box .content-box .inner .card-box.hstr {
    margin: 0 16px;
    width: calc(100% - 16px - 16px);
  }
  .input-type-2x .col label {
    padding-right: 8px;
  }
  .card-box.hstr .row .inp-bx.gndr {
    grid-template-columns: 1fr 58%;
  }
  .card-box.hstr .row .inp-bx.mbl .inp {
    padding: 0 8px;
  }
  .select-box select {
    padding-left: 8px;
  }
  .select-box:after {
    right: 8px;
  }
  
  .tooltip .tooltiptext {
    min-width: 200px; 
  }
  .coupon-box .inner .card-box {
    width: calc(100% - 24px - 24px);
  }
  .coupon-box .inner .card-box .row .col:first-child {
    padding: 24px 24px;
  }
  .coupon-box .inner .card-box .row .col:last-child {
    width: auto;
    padding: 0 16px;
  }
  .card-box .row .col .row-item:last-child {
    display: flex;
    flex-direction: column; align-items: flex-start;
  }
}

@media (max-width: 700px) {
  .container,
  section {
    width: 100%;
  }
  section .inner .col-bx.ip-if-bx .inner {
    height: calc(100vh - 58px);
    min-height: 500px;
  }
  section .inner .col-bx.mvsl {
    height: 748px;
  }
  .inp-dtil .dsclm .row, .agreement .line-bx .row {
    flex-direction: column;
  }
  .col.mble {
    display: flex;
    justify-content: flex-end;
    margin-top: 8px;
  }
  .cstmr-Input .trip-plan .bx-list .card-line-bx  {
    width: 100%;
  }
  .cstmr-Input .trip-plan .bx-list .card-line-bx > .travel-plan {
    width: 100%;
    height: 116px;
  }
  .card-line-bx > .travel-plan label .row {
    display: flex;
    flex-direction: column; align-items: flex-start;
  }
  .spc-cnt-sbs .bx-crd-bnr {
    width: calc(100% - 16px - 16px);
    margin: 16px 16px 0;
  }
  .col-bx.mvsl .left-vsul .bnr-bx > img {
    width: 100%; height: auto;
  }

}

@media (max-width: 590px) {
  section .inner .col-bx.mvsl {
    height: 625px;
  }
  .col-bx.mvsl .left-vsul .img-vsul {
    top: 12%;
  }
}