@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/variable/pretendardvariable.css");
@import url("//fonts.googleapis.com/earlyaccess/jejumyeongjo.css");

:root{
  font-size:62.5%;
  --navy: #0f294a;
  --white: #ffffff;
  --main-text: #f6b05e;
  --gray: #85899b;
  --gray-date: #bbbdbf;
}
* {margin: 0; padding: 0; font: inherit; color: inherit; font-family: "Pretendard Variable", Pretendard, -apple-system,
  BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI",
  "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji",
  "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; line-height: 1.5;}
*, :after, :before {box-sizing: border-box;}
/* font */
.JejuMyeongjo {
  font-family: "Jeju Myeongjo", serif;
}
.MinionPro {
  font-family: "Minion Pro", sans-serif;
}
.times {
  font-family: "Times New Roman";
}
.pc-block {display: block;}
.m-block {display: none;}
ul, ol {padding: 0; list-style: none;}
body {font-size: 2.4rem; word-break: keep-all; background: var(--navy); color: var(--white); text-align: center;}
b, strong {font-weight: 800;}

.sec01 {width: 100%; padding: 7% 4rem 43%; background: url(./images/main_mid_01.jpg) left top/ auto 100% no-repeat,  var(--navy);}
.sec01_inner {width: 60%; margin-left: auto; margin-right: 0; text-align: center;}

.sec02 {color: var(--navy);}
.sec02_inner {background: #ffffffda; border: 3px solid #fff; box-shadow: inset 0 0 5px #888888; border-radius: 1.5rem; padding: 12rem 5rem; max-width: 120rem; width: 90%; margin: -25% auto 6rem;}
.sec02_inner p {margin-bottom: 8rem; text-align: center; font-size: 3.2rem;}
.sec02_inner p:first-of-type {font-weight: 800;}
.logo {color: var(--main-text); margin: 0 auto; position: relative; width: fit-content;}
.logo p {margin: 10rem auto 0; width: fit-content; font-weight: 400 !important; font-size: 3rem;}
.logo span {position: absolute; right: -3rem; top: -0.5rem; font-size: 1rem;}

.main_sub {font-size: 4.8rem; letter-spacing: -0.1rem;}
.main_tit {font-size: 20rem; line-height: 1;}
.main_tit_sub {font-size: 5rem;}

.date_txt_wrap {margin-top: 12rem; font-size: 3.2rem;}
.date_tit {text-decoration: underline; text-decoration-thickness: 0.05rem; font-weight: 300; margin-bottom: 1rem;}
.date_txt {color: var(--main-text); font-weight: 600;}

.reservation-btn {display: flex; justify-content: center; align-items: center; column-gap: 2.5rem; margin: 15rem auto; font-size: 6.3rem; font-weight: 800; color: var(--navy); text-decoration: none; background: var(--main-text); border: 5px solid #fff; border-radius: 4rem; padding: 3rem 0; text-align: center; width: 80rem;}
.reservation-btn .icon {position: relative; display: block; width: auto; height: 6rem; aspect-ratio: auto 162/160; background: url(./images/ico-download.png) top center /100% 100% no-repeat;}

.map-wrap {margin: 0 auto 8rem; width: fit-content; color: var(--white); font-size: 2.2rem; text-align: left; max-width: 120rem; width: 90%;}
.map-wrap img {width: 100%;}
.map-wrap p {padding-left: 1.5rem;}

.sec04 {background: url(./images/main_mid_02.jpg) top center /100% 100% no-repeat; padding: 20rem 0 25rem; color: var(--navy);}
.sec05 {background: url(./images/main_mid_03.jpg) top center /100% 100% no-repeat; padding: 20rem 0 25rem;}
.sec06 {background: url(./images/main_mid_04.jpg) top center /100% 100% no-repeat; padding: 20rem 0 25rem; color: var(--navy);}
.sec07 {background: url(./images/main_mid_05.jpg) top center /100% 100% no-repeat; padding: 5rem 0 10rem;}
.sec08 {background: var(--navy); padding: 7rem 20%; color: var(--white); text-align: left;}

.sec-inner-tit {font-size: 9.2rem; font-weight: 600; color: var(--main-text); margin-bottom: 6rem;}
.sec05 .sec-inner-tit {color: var(--white);}

.sec04 .sec_inner ul  {display: flex; flex-wrap: wrap; justify-content: center; column-gap: 3rem; row-gap: 6rem; max-width: 120rem; width: 90%; margin: 10rem auto 0;}
.sec04 .sec_inner ul li {width: 45%;}
.typebox-tit {display: flex; flex-direction: column; justify-content: center; align-items: center; aspect-ratio: auto 1/1; margin: 0 auto; padding: 3rem; width: 22rem; height: auto; font-size: 3.2rem; font-weight: 600; color: #fff; border-radius: 100%; background: var(--main-text); border: 7px solid #fff; box-shadow: 0 0 10px #0000001a; position: relative; z-index: 1;}
.typebox-txt {border-radius: 1rem; background: #fce2c3; padding: 7rem 1rem 3rem; margin-top: -5rem;}

.sec05 .sec_con {max-width: 95rem; width: 90%; margin: 0 auto; color: var(--navy); text-align: left;}
.sec05 ul {background: #ffffffda; border: 3px solid #fff; box-shadow: inset 0 0 5px #888888; padding: 4rem 5rem; border-radius: 1.5rem; box-shadow: 0 0 10px #00000020;}
.sec05 ul li {padding: 7rem 0; border-bottom: 3px dashed var(--main-text);}
.sec05 ul li:last-of-type {padding-bottom: 4rem; border-bottom: 0;}
.sec05 ul li:nth-of-type(1) {background: url(./images/prize01-2.png) right 2rem center/auto 80% no-repeat;}
.sec05 ul li:nth-of-type(2) {background: url(./images/prize02.png) right center/auto 70% no-repeat;}
.sec05 ul li:nth-of-type(3) {background: url(./images/prize03.png) right 3rem top 5rem/auto 80% no-repeat;}
.benefitbox-tit {color: var(--white); background: var(--main-text); padding: 0.3rem 2.5rem; border-radius: 5rem; font-weight: 800; font-size: 2.8rem; width: fit-content; margin: 0 0 1.5rem;}
.sec05 p {padding-left: 1.5rem; margin-top: 1rem;}


.sec06 p {opacity: 0.8;}
.sec06 ul {display: flex; justify-content: center; column-gap: 2rem; max-width: 82rem; width: 90%; margin: 8rem auto 4rem;}
.sec06 ul li {border-radius: 1.5rem; padding: 1rem 2rem; width: 33%; background: #fce2c3; border: 3px solid #fff; box-shadow: 0 0 10px #00000020;}
.talkbox-tit {width: 100%; border-bottom: 1px solid var(--navy); padding: 0; font-weight: 600;}
.talkbox-date {width: 100%; border-bottom: 1px solid var(--navy); }
/* .talkbox-date b {color: var(--white);} */
.talkbox-txt {font-weight: 600;}
.talkbox-txt.-topic {margin: 0.5rem 0;}

.sec08 div {font-weight: 800; margin-bottom: 1rem;}
.sec08 ul li {padding-left: 2rem;}
.sec08 ul li:not(:last-of-type):before {position: absolute; content: ""; background: var(--white); border-radius: 100%; width: 0.4rem; height: 0.4rem;margin-left: -1rem; margin-top: 1.4rem;}
/* .sec08 ul li:last-of-type:before {content: '※ '; margin-left: -1.5rem;} */
.sec08 ul li:nth-of-type(5):before {content: '※ '; margin-left: -2rem; background: none; width: auto; height: auto; margin-top: 0;}

.talkbox-txt:not(.-topic) {font-size:2rem;}

.sec08 ul li:last-of-type {margin-top: 1.5rem;}
.sec08 ul li:last-of-type:before {display: none;}

@media screen and (max-width: 1740px) {
  .sec01 {padding: 7% 4rem 33%;}
  .main_sub {font-size: 3.8rem;}
  .main_tit {font-size: 15rem;}
  .main_tit_sub {font-size: 4rem;}

}

@media screen and (max-width: 1320px) {
  .sec01 {padding: 7% 4rem 26%;}
  .main_sub {font-size: 2.8rem;}
  .main_tit {font-size: 10rem;}
  .main_tit_sub {font-size: 3rem;}
  .sec02_inner {margin-top: -15%;}
}
@media screen and (max-width: 1059px) {
  .pc-block {display: none;}
  .m-block {display: block;}
  .date_txt_wrap {margin-top: 6rem;font-size: 2.2rem;}

  .sec02_inner p {font-size: 2.6rem;}
  .sec-inner-tit {font-size: 7.2rem;}
  .benefitbox-txt {padding: 0 !important; width: 60%;}

  .sec08 {padding: 4rem 2rem;}

  .typebox-txt {height: 33rem;}
}
@media screen and (max-width: 910px) {

  .main_sub {font-size: 2rem;}
  .main_tit {font-size: 6rem;}
  .main_tit_sub {font-size: 2.2rem;}
  .reservation-btn {font-size: 3.3rem; width: 80%; margin: 7rem auto; padding: 2rem 0; border-radius: 2rem; column-gap: 1rem;}
  .reservation-btn .icon {height: 3.3rem;}
}
@media screen and (max-width: 740px) {
  
  body, .map-wrap  {font-size: 1.6rem;}
  .date_txt_wrap {font-size: 1.8rem;}
  .sec02_inner {padding: 15% 5%;}
  .sec02_inner p {font-size: 2rem; margin-bottom: 4rem;}
  .sec02_inner .logo p {margin: 5rem auto 0;}

  .sec04 {background: url(./images/main_mid_02.jpg) top center / auto 100% no-repeat;padding: 35% 0 40%;}
  .sec06 {background: url(./images/main_mid_04.jpg) top center /auto 100% no-repeat;}
  .sec05, .sec06 {padding: 25% 0 40%;}
  .sec07 {padding: 5rem 0; background: url(./images/main_mid_05.jpg) top center /auto 100% no-repeat;}
  
  .sec-inner-tit {font-size: 3.2rem; margin-bottom: 2rem;}
  .sec04 .sec_inner ul {margin-top: 4rem; column-gap: 1rem; row-gap: 3rem;}
  .sec04 .sec_inner ul li {width: 48%;}
  .sec_inner div {padding: 0 2rem;}
  .typebox-tit {padding: 0.7rem !important; width: 14rem; height: auto; font-size: 2.1rem; line-height: 1.2; border: 4px solid #fff; box-shadow: 0 0 6px #0000001a;}
  .typebox-txt {padding: 7rem 1rem 2rem !important; margin-top: -5rem; height:27rem;}
  .sec05 ul {padding: 3rem 1rem 0;}
  .sec05 ul li {padding: 2rem 0;}
  .sec05 ul li:nth-of-type(1) {background: url(./images/prize01-2.png) right center / auto 60% no-repeat; padding: 1rem 0 2rem;}
  .sec05 ul li:nth-of-type(2) {background: url(./images/prize02.png) right center/auto 40% no-repeat;}
  .sec05 ul li:nth-of-type(3) {background: url(./images/prize03.png) right top 5rem/auto 40% no-repeat;}
  .benefitbox-tit {font-size: 1.8rem; padding: 0 1.5rem !important;}
  .benefitbox-txt {padding: 0 !important; width: 60%;}
  .sec06 ul {max-width: 90%;}

  .talkbox-txt:not(.-topic) {font-size:1.4rem;}

}

@media screen and (max-width: 640px) {
  .sec01 {padding: 5% 1rem 18%;}
  .sec01_inner {width: 65%;}
  .sec02_inner {margin-top: -7%;}
  .main_sub {font-size: 1.6rem;}
  .main_tit {font-size: 3.6rem;}
  .main_tit_sub {font-size: 1.8rem;}
  .date_txt_wrap {font-size: 1.6rem;}

  .reservation-btn {font-size: 2.8rem; width: 80%; margin: 7rem auto;}
  .reservation-btn .icon {height: 2.8rem;}
  .sec06 ul {flex-direction: column; row-gap: 2rem;}
  .sec06 ul li {width: 100%;}
}

@media screen and (max-width: 434px) {
  .sec05 ul li:nth-of-type(2) {
    background: url(./images/prize02.png) right bottom 30% / auto 45% no-repeat;
  }
  .sec05 ul li:nth-of-type(3) {
    background: url(./images/prize03.png) right top 7rem / auto 40% no-repeat;
}
}

@media screen and (max-width: 390px) {
  .typebox-txt {height: 32rem;}  
}