@charset "UTF-8";
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  background-origin: border-box;
}

body {
  font-family: "Noto Serif JP", serif;
  color: var(--wht);
  font-size: 16px;
  display: block;
  overflow-x: hidden;
  width: 100%;
  word-break: break-all;
  font-weight: 500;
}

:root {
  --bor: #e9d275;
  --wht: #fff;
  --btn: #b00b0b;
  --txt: #3c321e;
  --yellow: #f8c461;
  --bgo: #bf421d;
  --bgn: #223140;
  --bgb: #a06510;
  --dec: #ffe7a3;

  --sansjp: "Noto Sans JP", sans-serif;
  --serifjp: "Noto Serif JP", serif;
}

/*====================================*/
/* base contents */
/*====================================*/
html {
  font-family: "Noto Sans JP", serif;
  font-size: 14px;
}

@media screen and (min-width: 768px) {
  html {
    font-size: 16px;
  }
}
a {
  text-decoration: none;
}

img {
  max-width: 100%;
  width: 100%;
  height: auto;
}

/* ------------------------
    edit contents
------------------------- */
/* 指定フォント ここから */

/* ----pc,sp/on_off---- */
.pc {
  display: none;
}

.tb {
  display: none;
}

.sp {
  display: block;
}

/* view animation */
.view.view-fix,
.view.view-slideup,
.view.view-slidedown,
.view.view-slidein-L,
.view.view-slidein-R {
  opacity: 0;
  transition: opacity 0.5s ease, transform 0.5s ease;
}

.view.view-fix.on {
  opacity: 1;
  animation: view-fix 1s ease both;
}

.view.view-slideup.on {
  opacity: 1;
  animation: view-slideup 1s ease both;
}

.view.view-slidedown.on {
  opacity: 1;
  animation: view-slidedown 1s ease both;
}

.view.view-slidein-L.on {
  opacity: 1;
  animation: view-slidein-L 1s ease both;
}

.view.view-slidein-R.on {
  opacity: 1;
  animation: view-slidein-R 1s ease both;
}

/* mv */
.mv {
  position: relative;
  /* background: url(../img/top_pc.png);
  background-size: 100%;
  background-repeat: no-repeat; */
  z-index: 0;
}
.mv .image {
  display: flex;
}
/* main */

/* notice */
.notice {
  position: relative;
  background: url(../img/bg_sp.png);
  z-index: 0;
  background-size: cover;
  background-repeat: no-repeat;
  padding: 48px 24px 65px;
}
.tts_dis {
  padding: 90px 25% 48px;
}
.notice .remind {
  border: 3px solid var(--dec);
  width: fit-content;
  margin: auto;
}
.tts_bor {
  border: 2px solid var(--dec);
  margin: 12px;
}
.text {
  font-size: 18px;
  text-align: center;
  font-weight: 500;
  line-height: 200%; /* 36px */
  letter-spacing: 1.08px;
  position: relative;
}
.tts_pad {
  padding: 76px 20px;
}
.text::before,
.text::after {
  content: "";
  display: block;
  width: 90px;
  height: 90px;
  position: absolute;
}

.text::before {
  background: url(../img/cherryblossoms_left.png);
  background-size: 100%;
  background-position: top left;
  top: 0;
  left: 0;
}
.text::after {
  background: url(../img/cherryblossoms_right.png);
  background-size: 100%;
  background-position: bottom right;
  bottom: 0;
  right: 0;
}
/* content */
.content-1 {
  background-image: url(../img/bg_block_sp.png);
  padding-top: 32px;
  /* background-size: cover; */
}
.top-bg {
  width: 100%;
  height: 46px;
  background-image: url(../img/flower_line_pc.png);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.content-ttl {
  padding: 24px 20px;
  text-align: center;
  line-height: 170%;
}
.content-ttl h3 {
  font-family: var(--serifjp);
  font-size: 24px;
  font-weight: 700;
}
.content-ttl h5 {
  font-family: var(--sansjp);
  font-weight: 500;
  font-size: 16px;
}
.content-ttl p {
  border-bottom: 2px solid var(--wht);
  max-width: 60px;
  text-align: center;
  margin: 15px auto;
}
.box-text {
  padding: 0 20px;
  margin-top: 52px;
  margin-left: 20px;
  position: relative;
  margin-bottom: 15px;
}
.box-text .text-txt {
  font-family: var(--serifjp);
  font-size: 20px;
  line-height: 170%;
  font-weight: 500;
}
.box-text p::before {
  content: "";
  background: url(../img/title_bg.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: top left;
  display: block;
  width: 147px;
  height: 130px;
  position: absolute;
  left: 0;
  top: -30px;
}
.box-title {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.box-img-left {
  padding: 0 20px;
}
.left-cnt1 {
  padding-right: 0;
}
.right-cnt2 {
  padding-left: 0;
}
.box-img {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  margin: 32px 0;
  align-content: center;
}
.box-img img {
  width: 44%;
  height: 110px;
}
.box-menu {
  border: 1px solid #9a7605;
  padding: 20px;
  background: var(--wht);
  color: var(--txt);
  margin: 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 16px;
}
.cus-type {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 16px;
  position: relative;
  line-height: 170%;
}
.box-menu-ttl {
  width: fit-content;
  background: var(--btn);
  padding: 4px;
}
.box-menu-ttl p {
  border: 1px solid var(--bor);
  padding: 8px 24px 10px 24px;
  font-family: var(--sansjp);
  font-weight: 500;
  line-height: 100%;
  color: var(--wht);
  text-align: center;
}
.box-menu-txt {
  line-height: 170%;
  font-weight: 500;
}
.box-2 {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.cus-type-ttl {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.type--ttlA {
  color: var(--btn);
  font-size: 14px;
  font-weight: 500;
  line-height: 140%; /* 19.6px */
  border: 1px solid var(--btn);
  background: var(--wht);
  padding: 6px 10px;
  width: fit-content;
}
.line {
  position: absolute;
  top: 12%;
  right: 0;
  transform: translateY(-50%);
  width: 30px;
  height: 2px;
  background-color: var(--btn);
  display: flex;
  align-items: center;
}
.set2 {
  top: 10%;
}
.set3 {
  top: 62% !important;
}
.square-1 {
  width: 10px;
  height: 10px;
  background-color: var(--btn);
  margin-left: 0;
}
.square-2 {
  width: 10px;
  height: 10px;
  background-color: var(--btn);
  margin-left: 10px;
}
.square-2-3 {
  margin-left: 91%;
}
.set {
  top: 65%;
  width: 220px;
}
.square-2-1 {
  margin-left: 200px;
}
.type--ttlB {
  font-size: 16px;
  font-weight: 500;
  line-height: 170%;
}
.reserv {
  margin: 0 auto;
  margin-top: 48px;
  text-align: center;
  padding: 0 40px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  position: relative;
  z-index: 1;
}
.reserv .text-txt {
  font-size: 18px;
  font-weight: 500;
  line-height: 170%;
}
.reserv::after {
  content: "";
  background: url(../img/bg_red_sp.png);
  background-size: 100%;
  background-repeat: no-repeat;
  width: 340px;
  height: 125px;
  position: absolute;
  right: 0;
  bottom: -17%;
  z-index: -1;
}
.bot-bg {
  display: flex;
  padding: 32px 20px;
  margin-top: 32px;
}
.bot-bg-img {
  width: 60%;
}
.bot-bg-note {
  font-size: 12px;
  line-height: 170%;
  font-family: var(--sansjp);
}
/* btn */
.gr-btn {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.btn {
  border: 1px solid var(--btn);
  border-radius: 4px;
  background: var(--wht);
}
.btn--link {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  padding: 10px 20px;
}
.btn--link p {
  color: var(--btn);
  font-family: var(--serifjp);
  font-size: 18px;
  font-weight: 700;
  line-height: 180%;
}
.btn--link img {
  width: 15px;
}
.btn:hover {
  opacity: 0.7;
}
.content-2 {
  background: var(--bgo);
  position: relative;
  z-index: 1;
}
.content-2 .top-bg {
  position: absolute;
  top: -30px;
}
.content-2 .content-ttl {
  padding-top: 40px;
}
.cnt-2 {
  justify-content: flex-start;
}
.tele {
  padding: 30px 20px;
  margin: 0 5%;
  border: 1px solid var(--wht);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  position: relative;
  z-index: 1;
}
.tele::after {
  content: "";
  background: url(../img/bg_red_sp-rv.png);
  background-size: 100%;
  background-repeat: no-repeat;
  width: 340px;
  height: 125px;
  position: absolute;
  left: -6%;
  top: -48%;
  z-index: -1;
}
.tt-phone {
  display: flex;
  align-items: center;
}
.tt-phone img {
  width: 12%;
}
.tel {
  text-decoration: underline;
  color: var(--wht);
}
.content-2 .bot-bg {
  gap: 10px;
  position: relative;
}
.content-2 .btn {
  margin: 48px 10% 56px;
  position: relative;
  z-index: 2;
}
.content-2 .bot-bg .bot-bg-img {
  width: 80%;
}
.tele-note {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* content-3 */
.content-3 {
  background: url(../img/bg_block_n_pc.png);
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}
.content-3 .top-bg {
  position: absolute;
  top: -23px;
}
.content-3 .content-ttl {
  padding-top: 125px;
}
.content-3::before {
  content: "";
  background: url(../img/flower_top.png);
  background-repeat: no-repeat;
  background-size: 100%;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 300px;
  height: 200px;
}
.content-3::after {
  content: "";
  background: url(../img/pine_bottom.png);
  background-repeat: no-repeat;
  background-size: 85%;
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 300px;
  height: 154px;
  z-index: 0;
}
.tts-dis-cnt3 {
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 1;
}
.box-img-cnt3 {
  padding: 0 20px;
}
.notes {
  padding: 0 20px;
}
.padd-style {
  padding-bottom: 175px;
}
.content-4 {
  background: var(--bgo);
  position: relative;
  z-index: 1;
  padding-bottom: 50px;
}
.content-4 .top-bg {
  position: absolute;
  top: -20px;
}
.content-4::after {
  content: "";
  background: url(../img/bg_sp-cnt4.png);
  background-repeat: no-repeat;
  background-size: 100%;
  width: 100%;
  height: 280px;
  position: absolute;
  z-index: 0;
  bottom: 0;
  mix-blend-mode: soft-light;
}
.content-4 .content-ttl {
  padding-top: 50px;
}
.content-5 {
  background: #23303f;
  position: relative;
  z-index: 1;
  padding-bottom: 50px;
  border-bottom: 25px solid #e9d275;
}
.content-5 .top-bg {
  position: absolute;
  top: -20px;
}
.content-5 .content-ttl {
  padding-top: 50px;
}
.content-5::after {
  content: "";
  background: url(../img/07_section5_bg_sp.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: right;
  width: 100%;
  height: 85px;
  position: absolute;
  z-index: 0;
  bottom: 0;
}
footer {
  padding: 48px 20px 20px;
  background: #a06510;
  font-family: "Zen Old Mincho";
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
footer .intro {
  font-size: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
footer .social {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 20px;
}
footer .social .social--link {
  display: flex;
  border: 2px solid var(--wht);
  align-items: center;
  color: var(--wht);
  justify-content: space-around;
  padding: 10px 0;
}
footer .social .social--link:hover {
  opacity: 0.8;
}
footer .logo {
  padding: 24px 20px;
}
.social--link img {
  width: 20%;
  padding: 10px;
}
.social--link .lef-ar {
  width: 10%;
}
footer .noti {
  text-align: start;
  margin-bottom: 20px;
  line-height: 170%;
}
footer .copyright {
  font-size: 12px;
  line-height: 170%;
}


@media screen and (max-width: 768px) {
.tts_dis {
  padding: 0 0 48px;
}
}