
/* === Global === */
:root{
  --color-main: #411e09;
  --color-red: #f84212;
  --screen-base-size: 750;
}

html{
  scroll-behavior: smooth !important;
}

body{
  color: var(--color-main);
  background-color: #FFF;  
  font-family: "Shippori Mincho", serif;
  font-size: min(28px, calc(28 / var(--screen-base-size) * 100vw));
}

img{
  width: 100%;
}
/* === Global /E === */



/* === Layout === */
.l-container{
  width: 100%;
  max-width: 750px;
  /* margin: 0 auto; */
  margin: 0 auto;
}
/* === Layout /E === */


/* === Component === */
.c-cta-btn{
  display: block;
  filter: drop-shadow(0 3px 5px rgba(48, 67, 23, 0.33));
  width: 92.5%;
}

.c-fixed-cta{
  display: none;
  width: 92.5%;
  max-width: 590px;
  margin: 0 auto min(15px, calc(15 / var(--screen-base-size) * 100vw));

  position: fixed;
  bottom: 0%;
  left: 50%;
  z-index: 1;
  transform: translateX(-50%);
}

.c-fiexd-cta__img{
  filter: drop-shadow(0 3px 5px rgba(48, 67, 23, 0.33));
}
/* === Component /E === */


/* === Project === */
/* * * FV * * */
.p-fv-cta-btn{
  position: absolute;
  left: 50%;
  bottom: 1.65%;
  transform: translateX(-50%);
}
/* * * FV /E * * */



/* * * INTRO * * */
.p-intro-swiper{
  position: absolute;
  bottom: 9%;
  left: 50%;
  transform: translateX(-50%);
  width: 92%;
}

/* swiper矢印 - カスタム*/
/* 前へ次への矢印カスタマイズ */
.swiper-button-prev svg,
.swiper-button-next svg{
  display: none;
}

.swiper-button-prev::after,
.swiper-button-next::after {
  bottom: 0;
  content: "";
  height: 0;
  margin: auto;
  position: absolute;
  bottom: 60%;
  width: 0;
  filter: drop-shadow(0 5px 6px rgba(22, 5, 9, 0.25));
}
/* 前への矢印カスタマイズ */
.swiper-button-prev::after {
  border-bottom: 
    min(20px, calc(20 / var(--screen-base-size) * 100vw)) 
    solid transparent;
  border-right: 
    min(20px, calc(20 / var(--screen-base-size) * 100vw)) 
    solid var(--color-main);
  border-top: 
    min(20px, calc(20 / var(--screen-base-size) * 100vw)) 
    solid transparent;
  left: 0;
}
/* 次への矢印カスタマイズ */
.swiper-button-next::after {
  border-bottom:
    min(20px, calc(20 / var(--screen-base-size) * 100vw)) 
    solid transparent;
  border-left:
    min(20px, calc(20 / var(--screen-base-size) * 100vw)) 
    solid var(--color-main);
  border-top: 
    min(20px, calc(20 / var(--screen-base-size) * 100vw)) 
    solid transparent;
  right: 0;
}
/* 画像サイズ調整 */
.swiper-slide img {
  height: auto;
  width: 100%;
}
/* * * INTRO /E * * */



/* * * オファー01・オファー02 * * */
.p-offer-cta-btn{
  position: absolute;
  left: 50%;
  bottom: 6.5%;
  transform: translateX(-50%);
}
/* * * オファー01・オファー02 /E * * */



/* * * PLAN * * */
.p-plan-cta-btn{
  position: absolute;
  left: 50%;
  bottom: 2.75%;
  transform: translateX(-50%);
}

.p-plan-cta-btn__text{
  display: block;
  width: 42%;
  margin: 0 auto;
  position: relative;
  top: min(13px, calc(13 / var(--screen-base-size) * 100vw));
}
/* * * PLAN /E * * */



/* * * よくあるご質問 * * */
.p-faq{
  background-color: #fff9c6;
  padding-top: min(70px, calc(70 / var(--screen-base-size) * 100vw));
  padding-bottom: min(42px, calc(42 / var(--screen-base-size) * 100vw));
}

.p-faq__title{
  font-weight: 600;
  font-size: min(72px, calc(72 / var(--screen-base-size) * 100vw));
  text-align: center;
}

.p-faq-wrap{
  background-color: #FFF;
  margin: 
    min(80px, calc(80 / var(--screen-base-size) * 100vw))
    auto 0;
  width: 92%;
  padding-top: min(47px, calc(47 / var(--screen-base-size) * 100vw));
  padding-bottom: min(13px, calc(13 / var(--screen-base-size) * 100vw));
}

.p-faq-item{
  margin-bottom: min(42px, calc(42 / var(--screen-base-size) * 100vw));
}

.p-faq-question{
  cursor: pointer;
}

.p-faq-answer{
  display: none;
  margin-top: min(15px, calc(15 / var(--screen-base-size) * 100vw));
}

.p-faq-question__text,
.p-faq-answer__text{
  position: relative;
  padding-left: min(70px, calc(70 / var(--screen-base-size) * 100vw));
  padding-right: min(50px, calc(50 / var(--screen-base-size) * 100vw));
}

.p-faq-question__text{
  color: var(--color-red);
  font-size: min(34px, calc(34 / var(--screen-base-size) * 100vw));
  font-weight: bold;
  line-height: min(69px, calc(69 / var(--screen-base-size) * 100vw));
}

.p-faq-answer__text{
  font-weight: 500;
  font-size: min(28px, calc(28 / var(--screen-base-size) * 100vw));
  line-height: min(42px, calc(42 / var(--screen-base-size) * 100vw));
}

.p-faq-question__text::before,
.p-faq-answer__text::before{
  font-size: min(42px, calc(42 / var(--screen-base-size) * 100vw));
  position: absolute;
  left: 3%;
}

.p-faq-question__text::before{
  content: "Q";
  top: 0%;
}

.p-faq-answer__text::before{
  content: "A";
  top: 1.6%;
}

.p-faq-question__text::after{
  content: "";
  background-color: var(--color-red);
  clip-path: polygon(100% 0, 0% 50%, 100% 100%);
  width: min(25px, calc(25 / var(--screen-base-size) * 100vw));
  height: min(25px, calc(25 / var(--screen-base-size) * 100vw));
  position: absolute;
  top: min(24px, calc(24 / var(--screen-base-size) * 100vw));
  right: 3%;

  transition: all .3s ease;
}

.p-faq-question__text.is-open::after{
  transform: rotate(-90deg);
}

.p-faq__text{
  font-weight: 600;
  font-size: min(42px, calc(42 / var(--screen-base-size) * 100vw));
  text-align: center;
  line-height: min(63px, calc(63 / var(--screen-base-size) * 100vw));
  display: block;
  margin-top: min(44px, calc(44 / var(--screen-base-size) * 100vw));
}

.p-faq-cta-btn{
  margin: 0 auto;
}
/* * * よくあるご質問 /E * * */



/* * * フッター * * */
.p-footer{
  color: #233031;
  background-color: #d1d1d6;
  font-size: min(18px, calc(18 / var(--screen-base-size) * 100vw));
  padding: min(15px, calc(15 / var(--screen-base-size) * 100vw)) 0;
}

.p-footer-wrap{
  display: flex;
  justify-content: space-evenly;
}

/* * * フッター /E * * */

/* === Project /E === */


/* === Utility === */
.u-relative{
  position: relative;
}

.u-fw-semibold{
  font-weight: 600;
}
/* === Utility /E === */