/*----------------------------------
    body
-----------------------------------*/
body,
.l-footer {
  background: linear-gradient(90deg, rgba(255, 241, 223, 1) 0%, rgba(255, 250, 237, 1) 70%);
}

/*----------------------------------
    MV
-----------------------------------*/
.p-mainVisual__inner {
}

@media screen and (min-width: 600px) {
  .p-mainVisual__inner {
      height: 40vw;
  }
}

/*----------------------------------
    topic
-----------------------------------*/
.pd-topic .p-postList__item {
  background: linear-gradient(90deg, rgba(255, 241, 223, 1) 0%, rgba(255, 250, 237, 1) 70%);
}

@media (max-width: 767px) {
  .pd-topic .p-postList__link {
    flex-direction: column;
  }

  .pd-topic .-type-list .p-postList__thumb, .-type-list2 .p-postList__thumb {
    width: 100%;
  }

  .pd-topic .p-postList__body {
    width: 100%;
    padding-top: 1em;
  }
}

/*----------------------------------
    mews
-----------------------------------*/


/*----------------------------------
    もっと見るボタン
-----------------------------------*/
.p-postListWrap .btn_text {
  border-radius: 100vmax;
}

/*----------------------------------
    swiper
-----------------------------------*/
/* --- Swiper 基本レイアウト（上書き） --- */
.card .swiper {
  overflow: hidden;
}
.card .swiper .swiper-wrapper {
  display: flex !important;
  flex-wrap: nowrap !important;
}

/* SwiperのCSSより強く、確実に線形補間にする */
.card .swiper .swiper-wrapper.card__swiper-wrapper {
  transition-timing-function: linear !important;
  transition-property: transform !important;
}

.card .card__swiper-slide {
  overflow: hidden;
  border-radius: 20px;
  aspect-ratio: 16 / 9;
}

/* PC & タブレット: 4枚見せる */
@media (min-width: 768px) {
  .card .swiper .swiper-slide {
    width: calc((100% - (16px * 3)) / 4); /* spaceBetween:16px × (4枚-1) */
  }
}

/* スマホ: 2枚見せる */
@media (max-width: 767px) {
  .card .swiper .swiper-slide {
    width: calc((100% - 16px) / 2);
  }
}

.card .card__swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/*----------------------------------
    お問い合わせ
-----------------------------------*/
/* お問い合わせフォームの幅変更 */
.pd-contact > .l-article {
  max-width: 600px;
}

/* プライバシーポリシーの中央揃え */
p:has(.wpcf7-form-control-wrap[data-name="privacy-check"]) {
  text-align: center;
  margin-bottom: 2rem;
}

.underline {
  text-decoration: underline;
}

/* 送信ボタンの中央揃え */
p:has(.wpcf7-submit) {
  text-align: center;
}

.wpcf7-spinner {
  display: none;
}

/* labelのfont-size変更 */
label {
  font-size: 1.125rem;
}

/* 必須マーク追加 */
.required::after {
  content: "必須";
  color: #ffffff;
  background: #cc0000;
  font-size: 0.8em;
  padding: 0.3em;
  border-radius: 0.5em;
  margin-left: 0.3em;
}

/* 入力欄の幅を変更、余白変更 */
input[name="your-name"],
input[name="your-email"],
input[name="your-tel"],
textarea[name="your-message"] {
  width: 100%;
  margin-top: 10px;
  margin-bottom: 24px;
}

/* 送信ボタンのカスタム */
.wpcf7-submit {
  border: none;
  cursor: pointer;
  line-height: 1;
  font-size: 1rem;
  background-color: var(--color_main);
  color: #ffffff;
  border-radius: 40px;
  padding: 12px 38px;
  border: 1px solid transparent;
  box-shadow: var(--swl-btn_shadow);
  transition: ease-out 0.3s;
}

.wpcf7-submit:hover {
  color: var(--color_main);
  background-color: #ffffff;
  border: 1px solid var(--color_main);
  box-shadow: 0 4px 12px rgb(0 0 0 / 10%), 0 12px 24px -12px rgb(0 0 0 / 20%);
  opacity: 1;
}

/*----------------------------------
    背景画像
-----------------------------------*/
/* topic */
.pd-topic {
  position: relative;
  z-index: 0;
}

.pd-topic::after {
  content: "";
  position: absolute;
  top: 0;
  width: 20%;
  aspect-ratio: 500 / 1000;
  pointer-events: none;
  z-index: -1;
}

.pd-topic::after {
  right: 0;
  background: url("../img/topic-bg.png") right center / auto 100% no-repeat;
}

/* news */
.pd-news {
  position: relative;
  z-index: 0;
}

.pd-news::before {
  content: "";
  position: absolute;
  top: 0;
  width: 20%;
  aspect-ratio: 500 / 1000;
  pointer-events: none;
  z-index: -1;
}

.pd-news::before {
  left: 0;
  background: url("../img/news-bg.png") left top / contain no-repeat;
}

/* member */
.pd-member {
  position: relative;
  z-index: 0;
}

.pd-member::before {
  content: "";
  position: absolute;
  top: 0;
  width: 20%;
  aspect-ratio: 750 / 1000;
  pointer-events: none;
  z-index: -1;
}

.pd-member::before {
  right: 0;
  background: url("../img/member-bg.png") right top / contain no-repeat;
}

.pd-faq {
  position: relative;
  z-index: 0;
}

.pd-faq::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 40%;
  aspect-ratio: 1140 / 400;
  background: url("../img/faq-bg.png") left top / contain no-repeat;
  pointer-events: none;
  z-index: -1;
}

/*----------------------------------
    フッター
-----------------------------------*/
.l-footer::before {
  content: "";
  position: absolute;
  width: 10%;
  aspect-ratio: 200 / 100;
  top: 0;
  left: 0;
  background: url("../img/footer-bg01.png") center center / cover no-repeat;
}

.l-footer::after {
  content: "";
  position: absolute;
  width: 10%;
  aspect-ratio: 250 / 100;
  bottom: 0;
  right: 0;
  background: url("../img/footer-bg02.png") center center / cover no-repeat;
}


/*----------------------------------
    アニメーション
-----------------------------------*/
.animated__fadeIn {
  /* before (出現前) */
  opacity: 0;
  translate: 0 40px;
  transition: opacity 0.3s ease, translate 0.3s ease;
}

.animated__fadeIn.js-show {
  /* after (出現後) */
  opacity: 1;
  translate: 0 0;
}