@charset "UTF-8";
/*main*/
/*
  .fs__txt__xxx
  .fs__txt__en__xxx
  .fw__xxx
*/
/*
  .color__txt__xxx
  .color__bg__xxx
*/
/*
  .dp__xxx
  .dp__xxx__pc
  .dp__xxx__sp
*/
* {
  margin: 0;
  padding: 0;
  text-align: left;
}

hr {
  display: none;
  line-height: 0;
  font-size: 0;
  padding: 0;
  margin: 0;
  border: none;
}

a {
  color: inherit;
  text-decoration: none;
}

ul, ol {
  list-style: none;
}

address {
  font-style: normal;
}

img {
  border: none;
  width: auto;
  max-width: 100%;
  font-size: 0;
  line-height: 0;
}

table, tbody, tr, th, td {
  padding: 0;
  margin: 0;
  border: none;
  border-collapse: collapse;
}

html, body {
  width: 100%;
  height: auto;
}

html {
  font-size: 62.5%;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

small {
  font-size: 100%;
}

@-webkit-keyframes anime__light {
  0% {
    transform: scale(0) rotate(45deg);
    opacity: 0;
  }
  80% {
    transform: scale(0) rotate(45deg);
    opacity: 0.5;
  }
  81% {
    transform: scale(4) rotate(45deg);
    opacity: 1;
  }
  100% {
    transform: scale(50) rotate(45deg);
    opacity: 0;
  }
}

@keyframes anime__light {
  0% {
    transform: scale(0) rotate(45deg);
    opacity: 0;
  }
  80% {
    transform: scale(0) rotate(45deg);
    opacity: 0.5;
  }
  81% {
    transform: scale(4) rotate(45deg);
    opacity: 1;
  }
  100% {
    transform: scale(50) rotate(45deg);
    opacity: 0;
  }
}
/*
@keyframes anime__xxx__ptn01 {
}
*/
body {
  width: 100%;
  font-family: "Zen Kaku Gothic Antique", "游ゴシック", "メイリオ", Meiryo, -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, sans-serif;
  font-weight: 500;
  font-size: 1.6rem;
  line-height: 1.875;
  letter-spacing: 0.04em;
  color: #000;
  background-color: #fff;
}
body .ff__sans {
  font-family: "Zen Kaku Gothic Antique";
}
body .ff__serif {
  font-family: "游明朝", Hiragino Mincho ProN, "HGS明朝E", "メイリオ", Meiryo, serif;
}
body .ff__en {
  font-family: "Poppins";
}
body .fw__bold {
  font-weight: 700;
}
body .fw__normal {
  font-weight: 500;
}
body .fs__txt__30 {
  font-size: 30px;
  letter-spacing: 0.04em;
  line-height: 1.3333333333;
}
body .fs__txt__24 {
  font-size: 24px;
  letter-spacing: 0.04em;
  line-height: 1.4166666667;
}
body .fs__txt__20 {
  font-size: 20px;
  letter-spacing: 0.04em;
  line-height: 1.15;
}
body .fs__txt__18 {
  font-size: 18px;
  letter-spacing: 0.04em;
  line-height: 1.3333333333;
}
body .fs__txt__13 {
  font-size: 13px;
  letter-spacing: 0.04em;
  line-height: 2;
}
body .fs__txt__12 {
  font-size: 12px;
  letter-spacing: 0.04em;
  line-height: 1.5;
}
body .dp__block {
  display: block;
}
body .dp__block__pc {
  display: block;
}
body .dp__block__sp {
  display: none;
}
body .dp__inline-block {
  display: inline-block;
}
body .dp__inline-block__pc {
  display: inline-block;
}
body .dp__inline-block__sp {
  display: none;
}
body .dp__inline {
  display: inline;
}
body .dp__inline__pc {
  display: inline;
}
body .dp__inline__sp {
  display: none;
}
body .dp__flex {
  display: flex;
}
body .dp__flex__pc {
  display: flex;
}
body .dp__flex__sp {
  display: none;
}
@media (max-width: 750px) {
  body .dp__block__pc {
    display: none;
  }
  body .dp__block__sp {
    display: block;
  }
  body .dp__inline-block__pc {
    display: none;
  }
  body .dp__inline-block__sp {
    display: inline-block;
  }
  body .dp__inline__pc {
    display: none;
  }
  body .dp__inline__sp {
    display: inline;
  }
  body .dp__flex__pc {
    display: none;
  }
  body .dp__flex__sp {
    display: flex;
  }
}
body .color__txt__white {
  color: #fff;
}
body .color__txt__black {
  color: #000;
}
body .color__txt__pri {
  color: #88ab1c;
}
body .color__txt__sec {
  color: #de5511;
}
body .color__txt__ter {
  color: #27b498;
}
body .color__txt__qua {
  color: #f2fadc;
}
body .color__txt__qui {
  color: #fef5dc;
}
body .color__txt__sen {
  color: #daefeb;
}
body .color__txt__sep {
  color: #f5f5f5;
}
body .color__txt__oct {
  color: #e5e4e4;
}
body .color__txt__non {
  color: #000;
}
body .color__txt__den {
  color: #000;
}
body .color__bg__white {
  background-color: #fff;
}
body .color__bg__black {
  background-color: #000;
}
body .color__bg__pri {
  background-color: #88ab1c;
}
body .color__bg__sec {
  background-color: #de5511;
}
body .color__bg__ter {
  background-color: #27b498;
}
body .color__bg__qua {
  background-color: #f2fadc;
}
body .color__bg__qui {
  background-color: #fef5dc;
}
body .color__bg__sen {
  background-color: #daefeb;
}
body .color__bg__sep {
  background-color: #f5f5f5;
}
body .color__bg__oct {
  background-color: #e5e4e4;
}
body .color__bg__non {
  background-color: #000;
}
body .color__bg__den {
  background-color: #000;
}
body .color__bg__gra__pri {
  background-color: #000;
}
body .color__bg__gra__sec {
  background-color: #000;
}
body .color__bg__gra__ter {
  background-color: #000;
}
body .anime__light {
  position: relative;
  overflow: hidden;
}
body .anime__light:before {
  position: absolute;
  content: "";
  display: inline-block;
  top: -180px;
  left: 0;
  width: 30px;
  height: 100%;
  background-color: #fff;
  -webkit-animation: anime__light 3s ease-in-out infinite;
          animation: anime__light 3s ease-in-out infinite;
}
body .anime__bottom-up {
  opacity: 0;
  transition: transform 0.5s ease 0s, opacity 0.5s ease 0s;
  transform: translateY(100px);
}
body .anime__bottom-up.js--on, body .anime__bottom-up.js--ing {
  opacity: 1;
  transform: translateY(0px);
}
body .anime__opacity {
  opacity: 1;
  transition: opacity 0.5s ease 0s;
}
body .anime__opacity.js--on {
  opacity: 0.5;
}
body .anime__underline {
  text-decoration: none;
}
body .anime__underline.js--on {
  text-decoration: underline;
}
body .img__reset {
  font-size: 0;
  line-height: 0;
}

img {
  width: 100%;
  image-rendering: -webkit-optimize-contrast;
}

.sec__in__l {
  width: 100%;
  max-width: 1180px;
  min-width: 0;
  margin: 0 auto;
}

.sec__in__s {
  width: 100%;
  max-width: 960px;
  min-width: 0;
  margin: 0 auto;
}

@media (max-width: 750px) {
  .sec__in__l {
    width: 100%;
    max-width: 100%;
  }
  .sec__in__s {
    width: 100%;
    max-width: 100%;
  }
}
.marker01 {
  text-decoration: underline;
  text-decoration-thickness: 1em;
  -webkit-text-decoration-color: #fffe31;
          text-decoration-color: #fffe31;
  text-underline-offset: -1em;
  -webkit-text-decoration-skip-ink: none;
          text-decoration-skip-ink: none;
}

.marker02 {
  text-decoration: underline;
  text-decoration-thickness: 0.7em;
  -webkit-text-decoration-color: #fffe31;
          text-decoration-color: #fffe31;
  text-underline-offset: -0.5em;
  -webkit-text-decoration-skip-ink: none;
          text-decoration-skip-ink: none;
}

/*parts*/
/*
  .fs__txt__xxx
  .fs__txt__en__xxx
  .fw__xxx
*/
/*
  .color__txt__xxx
  .color__bg__xxx
*/
/*
  .dp__xxx
  .dp__xxx__pc
  .dp__xxx__sp
*/
body:has(.navigation.js--on) {
  overflow: hidden;
}

header {
  padding: 10px 20px;
  position: relative;
  z-index: 99;
}
header .inner {
  justify-content: space-between;
}
header .logo {
  width: 185px;
}
header .menu {
  width: 40px;
}
header .menu span {
  display: block;
  text-align: center;
}
header .menu .txt {
  font-size: 1.2rem;
  line-height: 1;
}
header .menu .open {
  display: block;
}
header .menu .close {
  display: none;
}
header .menu .fa-bars,
header .menu .fa-xmark {
  font-size: 3rem;
}
header .menu.js--on .open {
  display: none;
}
header .menu.js--on .close {
  display: block;
}
@media (max-width: 750px) {
  header {
    padding: 2.6666666667%;
    position: relative;
    z-index: 99;
  }
  header .inner {
    justify-content: space-between;
    align-items: center;
  }
  header .logo {
    width: 40.8450704225%;
  }
  header .menu {
    width: 16.9014084507%;
  }
}

.navigation {
  position: fixed;
  top: 0;
  right: -530px;
  z-index: 98;
  background: rgba(255, 255, 255, 0.9);
  width: 530px;
  height: 100dvh;
  box-sizing: border-box;
  padding: 100px 60px;
  transition: right 0.5s ease 0s;
  overflow-y: auto;
}
.navigation.js--on {
  right: 0;
}
.navigation dl {
  margin: 0 0 30px;
}
.navigation dt {
  margin: 0 0 10px;
}
.navigation li {
  margin: 0 0 10px;
}
.navigation li a:hover {
  text-decoration: underline;
}
.navigation dl.corp__btn li {
  width: 270px;
  margin: 0 auto;
}
.navigation dl.corp__btn a {
  padding: 0.6em 0;
  display: block;
  text-align: center;
  background: rgb(79, 78, 78);
  font-size: 1.6rem;
  color: #fff;
  transition: opacity 0.2s 0s ease;
}
.navigation dl.corp__btn a:hover {
  text-decoration: none;
  opacity: 0.5;
}
@media (max-width: 750px) {
  .navigation {
    right: -100%;
    width: 100%;
    padding: 120px 2.6666666667% 0;
  }
  .navigation.js--on {
    right: 0;
  }
  .navigation dl {
    margin: 0 0 7%;
  }
  .navigation dl.corp__btn li {
    width: 66%;
  }
}

/*
  .fs__txt__xxx
  .fs__txt__en__xxx
  .fw__xxx
*/
/*
  .color__txt__xxx
  .color__bg__xxx
*/
/*
  .dp__xxx
  .dp__xxx__pc
  .dp__xxx__sp
*/
footer {
  padding: 30px 0 40px;
}
footer .inner {
  justify-content: center;
  align-items: center;
  margin: 0 0 30px;
}
footer h3 {
  width: 25%;
  margin: 0 4.1666666667% 0 0;
}
footer p.txt {
  width: 39.5833333333%;
}
footer ul {
  justify-content: center;
  align-items: center;
  gap: 0 30px;
  margin: 0 0 50px;
}
footer li a {
  justify-content: flex-start;
  align-items: center;
  gap: 0 5px;
}
footer .copy {
  text-align: center;
}
@media (max-width: 750px) {
  footer {
    padding: 20px 6.6666666667% 30px;
  }
  footer .inner.dp__flex {
    display: block;
  }
  footer h3 {
    width: 59.6923076923%;
    margin: 0 0 5px;
  }
  footer p.txt {
    width: auto;
  }
  footer ul.dp__flex {
    display: block;
    margin: 0 0 30px;
  }
}

/*page*/
/*
  .fs__txt__xxx
  .fs__txt__en__xxx
  .fw__xxx
*/
/*
  .color__txt__xxx
  .color__bg__xxx
*/
/*
  .dp__xxx
  .dp__xxx__pc
  .dp__xxx__sp
*/
#index .fixed__content__box {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background-color: #C2D62C;
  pointer-events: none;
}
#index .fixed__content__box__left,
#index .fixed__content__box__right {
  pointer-events: auto;
  position: absolute;
  top: 0;
  height: 100%;
}
#index .fixed__content__box__left {
  left: 0;
  width: calc((100vw - 415px) / 2);
}
#index .fixed__content__box__left img {
  width: 100%;
  height: 100vh;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: right bottom;
     object-position: right bottom;
}
#index .fixed__content__box__right {
  pointer-events: auto;
  position: absolute;
  right: calc((100vw - 415px) / 4);
  transform: translateX(50%);
  top: 20%;
  width: min(323px, 25.63vw);
}
#index .fixed__content__box__right__wrapper {
  padding: 56px 27px;
  box-sizing: border-box;
  background-color: rgba(255, 255, 255, 0.5);
}
#index .fixed__content__box__right__wrapper .logo {
  border-bottom: 1px solid #000;
  margin: 0 auto 19px;
  padding: 0 0 19px;
  font-size: 0;
  line-height: 0;
}
#index .fixed__content__box__right__wrapper .logo span {
  display: block;
  width: 81.6176470588%;
  margin: 0 auto;
}
#index .fixed__content__box__right__wrapper .txt01 {
  width: 83.0882352941%;
  margin: 0 auto 40px;
  font-size: 0;
  line-height: 0;
}
#index .fixed__content__box__right__wrapper .btn01,
#index .fixed__content__box__right__wrapper .btn02 {
  width: 56.25%;
  margin: 0 auto;
  font-size: 0;
  line-height: 0;
}
#index .fixed__content__box__right__wrapper .btn01 {
  margin: 0 auto 21px;
}
@media screen and (max-width: 1001px) {
  #index .fixed__content__box__right {
    display: none;
  }
}
@media (max-width: 750px) {
  #index .fixed__content__box__left {
    display: none;
  }
}
#index .container {
  width: 100%;
  max-width: 375px;
  min-width: 0;
  margin: auto;
  border-right: 20px solid #54402E;
  border-left: 20px solid #54402E;
  position: relative;
  z-index: 2;
  background-color: #F6F4E5;
}
@media (max-width: 750px) {
  #index .container {
    max-width: 100%;
    border-right: none;
    border-left: none;
  }
}
#index .sec01 {
  padding: 22px 0 0;
  margin: 0 0 33px;
  background: url(../images/sec01_bg.svg) no-repeat top center;
  background-size: 100% auto;
}
#index .sec01 h1 {
  width: 36.8%;
  margin: 0 auto 26px;
}
#index .sec01 .txt02 {
  width: 65.6%;
  margin: 0 auto 21px;
}
#index .sec01 .txt03 {
  position: relative;
  text-align: center;
}
#index .sec01 figure {
  margin: -50px 0 0;
}
#index .sec02 {
  position: relative;
  padding: 0 0 140px;
  background: url(../images/sec02_bg.svg) no-repeat bottom center;
  background-size: 100% auto;
}
#index .sec02 h2 {
  position: absolute;
  top: 45px;
  left: 56px;
  width: 19.2%;
}
#index .sec02 .txt02 {
  position: relative;
  margin: 0 0 12px;
  text-align: center;
}
#index .sec02 .txt03 {
  position: relative;
  text-align: center;
  color: #78876F;
}
#index .sec02 figure {
  width: 20%;
  margin: -150px auto 0;
}
#index .sec02 .txt04 {
  width: 82.6666666667%;
  margin: auto;
}
#index .sec02 .txt05 {
  margin: -210px 0 0 25px;
}
#index .sec03 {
  position: relative;
  margin: -77px 0 0;
}
#index .sec03 h2 {
  width: 19.2%;
  margin: 0 auto 30px;
  font-size: 0;
  line-height: 0;
}
#index .sec03 .txt01 {
  width: 46.6666666667%;
  margin: 0 auto 20px;
  font-size: 0;
  line-height: 0;
}
#index .sec03 .txt02 {
  width: 78.6666666667%;
  margin: 0 auto 17px;
  font-size: 0;
  line-height: 0;
}
#index .sec03 .txt03 {
  position: relative;
  z-index: 10;
  text-align: center;
}
#index .sec03 .ph01 {
  width: 37.8666666667%;
  position: absolute;
  top: -20px;
  left: 0;
  z-index: -1;
}
#index .sec03 .ph02 {
  width: 33.8666666667%;
  position: absolute;
  right: 0;
  bottom: -100px;
  z-index: 5;
}
#index .sec04 {
  margin: -30px 0 50px;
  padding: 92px 0 110px;
  background: url(../images/sec04_bg.png) no-repeat top center;
  background-size: 100% auto;
}
#index .sec04 h2 {
  width: 14.9333333333%;
  margin: 0 auto 29px;
  font-size: 0;
  line-height: 0;
}
#index .sec04 .txt01 {
  width: 61.0666666667%;
  margin: 0 auto 10px;
  font-size: 0;
  line-height: 0;
}
#index .sec04 .txt02 {
  width: 90.6666666667%;
  margin: 0 auto 90px;
  font-size: 0;
  line-height: 0;
}
#index .sec04__movie .txt03 {
  width: 46%;
  margin: 0 auto 10px;
}
#index .sec04__movie__box {
  width: 90%;
  margin: 0 auto;
  height: 0;
  position: relative;
  padding: 50.7% 0 0;
}
#index .sec04__movie__box iframe {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}
#index .sec05 {
  margin: -90px 0 50px;
}
#index .sec05 h2 {
  width: 24.5333333333%;
  margin: 0 auto 16px;
  font-size: 0;
  line-height: 0;
}
#index .sec05 figure {
  width: 17.6%;
  margin: 0 auto 0;
  font-size: 0;
  line-height: 0;
}
#index .sec05 .txt01 {
  margin: 0 0 12px;
  text-align: center;
}
#index .sec05 .txt02 {
  margin: 0 0 14px;
  text-align: center;
}
#index .sec05 .txt03 {
  width: 78.6666666667%;
  margin: 0 auto 15px;
  font-size: 0;
  line-height: 0;
}
#index .sec05 .txt04 {
  text-align: center;
}
#index .sec06 {
  margin: -87px 0 50px;
  padding: 80px 0 52px;
  background: url(../images/sec06_bg.svg) no-repeat top center;
  background-size: 100% auto;
}
#index .sec06 h2 {
  width: 29.8666666667%;
  margin: 0 auto 20px;
  font-size: 0;
  line-height: 0;
}
#index .sec06 .txt01 {
  text-align: center;
}
#index .sec06 .txt02 {
  width: 94.6666666667%;
  margin: -38px auto 0;
}
#index .sec06 .txt03 {
  width: 51.2%;
  margin: -115px auto 0 120px;
}
#index .sec07 {
  position: relative;
  margin: -75px 0 17px;
  padding: 0 0 221px;
  background: url(../images/sec07_bg.png) no-repeat bottom center;
  background-size: 100% auto;
}
#index .sec07 h2 {
  width: 23.4666666667%;
  margin: 0 auto 20px;
  font-size: 0;
  line-height: 0;
}
#index .sec07 .txt01 {
  margin: 0 0 20px;
  text-align: center;
}
#index .sec07 .txt02 {
  text-align: center;
}
#index .sec07 .txt03 {
  margin: 0 0 5px;
}
#index .sec07 .txt03,
#index .sec07 .txt04 {
  font-size: 0;
  line-height: 0;
}
#index .sec07 .btn__box {
  position: absolute;
  right: 17px;
  bottom: 25px;
  width: 40%;
}
#index .sec08 {
  padding: 0 0 80px;
}
#index .sec08 .txt01 {
  width: 44%;
  margin: 0 auto 23px;
}
#index .sec08 .txt01 a {
  display: block;
  padding: 0.3em;
  box-sizing: border-box;
  text-align: center;
  color: #fff;
  background-color: #57BD3D;
  border-radius: 50px;
}
#index .sec08 dl.address {
  width: 89.3333333333%;
  padding: 0 0 10px;
  margin: 0 auto 12px;
  border-bottom: 1px solid #060000;
}
#index .sec08 dl.address dt {
  width: 32.8%;
  margin: 0 auto 13px;
  font-size: 0;
  line-height: 0;
}
#index .sec08 dl.address dd p {
  text-align: center;
}
#index .sec08 dl.tel dt {
  text-align: center;
}
#index .sec08 dl.tel dd p a {
  display: block;
  text-align: center;
}
#index .floating__btn {
  position: fixed;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 100;
  margin: auto;
}
#index .floating__btn ul {
  justify-content: center;
  align-items: center;
  gap: 0 2%;
}
#index .floating__btn li {
  width: 153px;
}
@media (max-width: 750px) {
  #index .floating__btn ul {
    gap: 0 5%;
  }
  #index .floating__btn li {
    width: 40.8%;
  }
}