@charset "UTF-8";
@import url('//fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Oswald:wght@200..700&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=WindSong:wght@400;500&display=swap');
/* =========================
  確認用
========================= */
/*
* {
  outline: 2px red solid;
}
*/
/* =========================
  ベース
========================= */
body {
  padding-top: 0 !important;
  font-family: var(--font-gothic);
}
.inner {
  width: 163rem;
  height: 100%;
  box-sizing: border-box;
  margin: 0 auto;
  padding: 0 30px;
}
@media screen and (max-width: 1024px) {
  .inner {
    padding: 0 2vw;
  }
}
@media screen and (max-width: 810px) {
  .inner {
    width: 100%;
    padding: 0 2.7rem;
  }
}
.inner2 {
  width: 163rem;
  height: 100%;
  box-sizing: border-box;
  margin: 0 auto;
}
@media screen and (max-width: 810px) {
  .inner2 {
    width: 100%;
    padding: 0 2.7rem;
  }
}
.inner-fll {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  margin: 0 auto;
  padding: 0;
}
.inner-fll2 {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  margin: 0 auto;
  padding: 0;
}
@media screen and (max-width: 810px) {
  .inner-fll2 {
    padding: 0 2.7rem;
  }
}
.inner-fll-wrapper {
  width: 163rem;
  height: 100%;
  box-sizing: border-box;
  margin: 0 auto;
  padding: 0 70px;
}
@media screen and (max-width: 1024px) {
  .inner-fll-wrapper {
    padding: 0 4.5vw;
  }
}
@media screen and (max-width: 810px) {
  .inner-fll-wrapper {
    width: 100%;
    padding: 0 2.7rem;
  }
}
@media screen and (max-width: 810px) {
  .inner, .inner2, .inner-fll-wrapper {
    width: 100%;
  }
}
.outer {
  background: linear-gradient(#F3F6F7 0 70%, transparent 100px 100%);
}
/* =========================
  ファーストビュー
========================= */
.p-fv.p-area {
  height: 100vh;
}
.p-fv.p-area .inner {
  position: relative;
}
.p-area-fv-ttl {
  position: absolute;
  top: 54%;
  left: 30px;
  transform: translateY(-50%) translateX(0);
  -webkit- transform: translateY(-50%) translateX(0);
  z-index: 5;
}
@media screen and (max-width: 810px) {
  .p-area-fv-ttl {
    top: 36vh;
    left: 2.7rem;
  }
}
@media screen and (max-width: 480px) {
  .p-area-fv-ttl {
    top: 38vh;
  }
}
.p-area-fv-ttl .fv-ttl {
  color: #fff;
  font-size: 4.5rem;
  font-weight: 700 !important;
  line-height: 1.5;
  text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);
}
@media screen and (max-width: 1024px) {
  .p-area-fv-ttl .fv-ttl {
    font-size: 3.5vw;
  }
}
@media screen and (max-width: 810px) {
  .p-area-fv-ttl .fv-ttl {
    font-size: clamp(14px, 3.2vw, 24px);
  }
}
@media screen and (max-width: 480px) {
  .p-area-fv-ttl .fv-ttl {
    font-size: clamp(16px, 6.5vw, 24px);
  }
}
.p-area-fv-ttl .fv-ttl .ttl-bold1 {
  font-size: 6.8rem;
  margin-right: 10px;
}
@media screen and (max-width: 1024px) {
  .p-area-fv-ttl .fv-ttl .ttl-bold1 {
    font-size: 4.5vw;
  }
}
@media screen and (max-width: 810px) {
  .p-area-fv-ttl .fv-ttl .ttl-bold1 {
    font-size: clamp(16px, 6.5vw, 32px);
  }
}
@media screen and (max-width: 480px) {
  .p-area-fv-ttl .fv-ttl .ttl-bold1 {
    font-size: clamp(16px, 9.5vw, 30px);
    margin-right: 5px;
  }
}
.p-area-fv-ttl .fv-ttl .ttl-bold2 {
  font-size: 8.0rem;
}
@media screen and (max-width: 1024px) {
  .p-area-fv-ttl .fv-ttl .ttl-bold2 {
    font-size: 5.5vw;
  }
}
@media screen and (max-width: 810px) {
  .p-area-fv-ttl .fv-ttl .ttl-bold2 {
    font-size: clamp(18px, 7.5vw, 36px);
  }
}
@media screen and (max-width: 480px) {
  .p-area-fv-ttl .fv-ttl .ttl-bold2 {
    font-size: clamp(18px, 10.5vw, 38px);
  }
}
@media screen and (max-width: 480px) {
  .p-area-fv-ttl .fv-ttl .spacing {
    letter-spacing: -2px;
  }
}
.p-area-fv-ttl p {
  margin-top: 30px;
  font-size: 3.3rem;
  font-weight: 700 !important;
  line-height: 1.6;
  color: #fff;
  text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2);
  letter-spacing: 0.1vw;
}
@media screen and (max-width: 1024px) {
  .p-area-fv-ttl p {
    font-size: 5.3rem;
  }
}
@media screen and (max-width: 810px) {
  .p-area-fv-ttl p {
    font-size: clamp(16px, 5.0rem, 24px);
  }
}
@media screen and (max-width: 480px) {
  .p-area-fv-ttl p {
    margin-top: 2.7vh;
    font-size: clamp(15px, 6.0vw, 24px);
    letter-spacing: 0;
  }
}
.p-area-fv__icon {
  position: absolute;
  top: 20%;
  right: 30px;
  width: 100%;
  max-width: 340px;
  z-index: 5;
}
@media screen and (max-width: 1920px) {
  .p-area-fv__icon {
    max-width: 18vw;
  }
}
@media screen and (max-width: 1024px) {
  .p-area-fv__icon {
    max-width: 24vw;
  }
}
@media screen and (max-width: 810px) {
  .p-area-fv__icon {
    top: initial;
    bottom: 10%;
    left: 0;
    right: 0;
    max-width: 100%;
    margin: auto;
  }
}
@media screen and (max-width: 810px) {
  .p-area-fv__icon figure {
    text-align: center;
  }
}
@media screen and (max-width: 810px) {
  .p-area-fv__icon figure img {
    display: inline-block;
    max-width: 22vw;
    height: auto;
  }
}
@media screen and (max-width: 640px) {
  .p-area-fv__icon figure img {
    max-width: 30vw;
  }
}
@media screen and (max-width: 480px) {
  .p-area-fv__icon figure img {
    max-width: 40vw;
  }
}
.p-area-fv__icon figure figcaption {
  margin-top: 10px;
  font-size: 2rem;
  text-align: center;
  color: #fff;
  text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2);
}
@media screen and (max-width: 1024px) {
  .p-area-fv__icon figure figcaption {
    font-size: 1.2vw;
  }
}
@media screen and (max-width: 1024px) {
  .p-area-fv__icon figure figcaption {
    font-size: 1.7vw;
  }
}
@media screen and (max-width: 810px) {
  .p-area-fv__icon figure figcaption {
    max-width: none;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    display: block;
    padding-top: 15px;
    font-size: 1.7rem;
  }
}
@media screen and (max-width: 480px) {
  .p-area-fv__icon figure figcaption {
    width: 40vh;
    padding-top: 10px;
    font-size: 1.5rem;
  }
}
.p-fv.p-area .p-fv__slide__item {
  position: relative
}
.p-fv.p-area .p-fv__slide__item img {
  height: 100vh;
}
.p-fv.p-area .p-fv__slide__item .overlay {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.2);
  z-index: 1;
}
.p-fv:after {
  background: initial;
  height: initial;
}
.p-fv:before {
  background-color: initial;
}
.p-fv.p-area .p-fv__slide {
  height: 100vh;
}
.p-area-contact {
  margin-top: -35px;
  position: relative;
  z-index: 2;
}
.p-fv__scrWrap {
  display: none !important;
}
@media screen and (max-width: 810px) {
  .p-fv__scrWrap {
    display: flex !important;
  }
}
@media screen and (max-width: 810px) {
  .p-fv__scr {
    height: 18rem;
  }
}
/* =========================
  ファーストビュー下のお問い合わせ
========================= */
.contact-items {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
}
@media screen and (max-width: 810px) {
  .contact-items {
    width: 100%;
    flex-wrap: wrap;
    gap: 3rem;
  }
}
.contact-item {
  width: 48%;
  font-size: 2.0rem;
  font-weight: 700;
  text-align: center;
}
@media screen and (max-width: 810px) {
  .contact-item {
    width: 100%;
  }
}
.contact-item a {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  border-radius: min(1.5625vw, 30px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, .25);
}
@media screen and (max-width: 810px) {
  .contact-item a {
    border-radius: 1.5rem;
  }
}
.contact-item .item-wrapper {
  background-color: #fff;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media screen and (max-width: 810px) {
  .contact-item .item-wrapper {
    padding-top: 20px;
  }
}
.contact-item p {
  font-size: 2.7rem;
  line-height: 1.0;
  padding: 5px 0 10px;
}
@media screen and (max-width: 810px) {
  .contact-item p {
    font-size: 1.8rem;
  }
}
.contact-item .item-ttl {
  padding: min(.8854166667vw, 17px);
  font-size: 2.7rem;
}
@media screen and (max-width: 810px) {
  .contact-item .item-ttl {
    padding: .8rem;
    font-size: 1.9rem;
  }
}
.contact-item:first-child .item-ttl {
  background-color: #F25C5C;
  color: #fff;
}
.contact-item:nth-child(2) p.item-ttl {
  background-color: #EEE130;
}
.contact-item .guidance {
  margin-top: 15px;
}
@media screen and (max-width: 810px) {
  .contact-item .guidance {
    margin-top: -10px;
  }
}
.contact-item p.tel-no {
  margin: -10px 0 0px;
  font-family: "Barlow Condensed", sans-serif;
  font-size: 7.5rem;
  font-weight: 700;
  line-height: 1.0;
  letter-spacing: 0.2vw;
}
@media screen and (max-width: 810px) {
  .contact-item p.tel-no {
    margin: -5px 0 5px;
    font-size: 5.0rem;
  }
}
.contact-item .tel-time {
  padding: .8rem;
  line-height: 1.5;
  background-color: #F8F8F8;
}
.contact-item:nth-child(2) p:nth-child(2) {
  margin-top: 4%;
}
.contact-item .c-btn2 {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 13px;
}
@media screen and (max-width: 1024px) {
  .contact-item .c-btn2 {
    margin-top: .7vw;
  }
}
@media screen and (max-width: 810px) {
  .contact-item .c-btn2 {
    margin: 2.1rem auto 2.7rem;
    width: 22.7rem;
  }
}
.contact-item .c-btn2 span, .support-item .c-btn2 span {
  width: 100%;
  background-color: var(--color-black);
  border-radius: 50px;
  color: var(--color-text-white);
  display: block;
  text-align: center;
  transition: opacity var(--easeOutQuart) .3s;
}
.contact-item .c-btn2 span {
  width: 40rem;
  font-size: 2.5rem;
  line-height: 1.5;
  padding: 2.9rem;
}
@media screen and (max-width: 810px) {
  .contact-item .c-btn2 span {
    width: 22.7rem;
    font-size: 1.6rem;
    line-height: 1.5;
    padding: 1.3rem;
  }
}
.contact-item .c-btn2 span:hover, .support-item .c-btn2 span:hover {
  opacity: 0.7;
}
/* =========================
  3つの特徴
========================= */
.p-area-feature {
  --img-ar: calc(900 / 1920);
  background-color: #966E3A;
  position: relative;
  margin-top: -35px;
  z-index: 1;
  padding: 210px 0 100px;
  container-type: inline-size;
  text-align: center;
  overflow: hidden;
  border-radius: 0 0 5rem 5rem;
}
@media screen and (max-width: 810px) {
  .p-area-feature {
    margin-top: -35px;
    padding: 100px 0 40px;
  }
}
.p-area-feature::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(100cqw * var(--img-ar));
  mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
  z-index: 0;
}
.page-id-1225 .p-area-feature::before {
  background:
    -webkit-image-set(url("../images/area/kaga/feature-bg.webp") type("image/webp") 1x, url("../images/area/kaga/feature-bg.jpg") type("image/jpeg") 1x) top center / 100% auto no-repeat;
  background:
    image-set(url("../images/area/kaga/feature-bg.webp") type("image/webp") 1x, url("../images/area/kaga/feature-bg.jpg") type("image/jpeg") 1x) top center / 100% auto no-repeat;
  -webkit-mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
}
.page-id-1327 .p-area-feature::before {
  background:
    -webkit-image-set(url("../images/area/kanazawa/feature-bg.webp") type("image/webp") 1x, url("../images/area/kanazawa/feature-bg.jpg") type("image/jpeg") 1x) top center / 100% auto no-repeat;
  background:
    image-set(url("../images/area/kanazawa/feature-bg.webp") type("image/webp") 1x, url("../images/area/kanazawa/feature-bg.jpg") type("image/jpeg") 1x) top center / 100% auto no-repeat;
  -webkit-mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
}
.page-id-1329 .p-area-feature::before {
  background:
    -webkit-image-set(url("../images/area/nomi/feature-bg.webp") type("image/webp") 1x, url("../images/area/nomi/feature-bg.jpg") type("image/jpeg") 1x) top center / 100% auto no-repeat;
  background:
    image-set(url("../images/area/nomi/feature-bg.webp") type("image/webp") 1x, url("../images/area/nomi/feature-bg.jpg") type("image/jpeg") 1x) top center / 100% auto no-repeat;
  -webkit-mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
}
.p-area-feature::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(100cqw * var(--img-ar));
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.2) 40%, rgba(0, 0, 0, 0) 100%);
  -webkit-mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
  mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
  z-index: 1;
}
.p-area-feature .inner {
  position: relative;
  z-index: 2;
}
.p-area-feature h3 {
  font-size: 3.8rem;
  font-weight: 700 !important;
  line-height: 1.5;
  text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);
  text-align: center;
  color: #ffffff;
}
@media screen and (max-width: 810px) {
  .p-area-feature h3 {
    font-size: 2.3rem;
  }
}
.p-area-feature h3 .ttl-bold1 {
  font-size: 6.0rem;
  margin-right: 10px;
}
@media screen and (max-width: 810px) {
  .p-area-feature h3 .ttl-bold1 {
    font-size: 3.5rem;
    margin-right: 5px;
  }
}
.p-area-feature h3 .ttl-bold2 {
  font-size: 6.8rem;
}
@media screen and (max-width: 810px) {
  .p-area-feature h3 .ttl-bold2 {
    font-size: 4.0rem;
  }
}
.feature-items1, .feature-items2 {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
}
@media screen and (max-width: 810px) {
  .feature-items1, .feature-items2 {
    flex-wrap: wrap;
  }
}
.feature-items1 {
  margin: 70px 0 90px;
}
@media screen and (max-width: 810px) {
  .feature-items1 {
    margin: 50px 0 60px;
  }
}
.feature-items2 {
  margin: 90px 0 40px;
}
@media screen and (max-width: 810px) {
  .feature-items2 {
    margin: 60px 0 30px;
  }
}
.feature-items1 .feature-item, .feature-items2 .feature-item {
  width: calc(96% / 3);
  border-radius: min(1.5625vw, 30px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, .25);
  overflow: hidden;
}
@media screen and (max-width: 810px) {
  .feature-items1 .feature-item, .feature-items2 .feature-item {
    width: 100%;
    border-radius: 1.5rem;
    margin-bottom: 25px;
  }
  .feature-items1 .feature-item:last-child, .feature-items2 .feature-item:last-child {
    margin-bottom: 0;
  }
}
.feature-items1 .feature-item {
  background-color: rgba(255, 255, 255, 0.85);
  opacity: 0.85;
}
.feature-items2 .feature-item {
  background-color: #fff;
}
.feature-items1 .feature-item h4 {
  margin: 0;
  padding: 20px 10px;
  font-family: var(--font-mincho);
  font-size: 3.0rem;
  font-weight: 500;
  text-align: center;
  background-color: #fff;
}
@media screen and (max-width: 810px) {
  .feature-items1 .feature-item h4 {
    padding: .8rem;
    font-size: 2.3rem;
  }
}
.feature-items1 .feature-item p, .feature-items2 .feature-item p {
  text-align: left;
}
.feature-items1 .feature-item p {
  padding: 25px 25px;
}
.feature-items2 .feature-item h4 {
  padding: 20px 10px;
  font-size: 3.0rem;
  font-weight: 700;
  text-align: center;
  background-color: #FDFBEE;
}
@media screen and (max-width: 810px) {
  .feature-items2 .feature-item h4 {
    padding: .8rem;
    font-size: 2.3rem;
  }
}
.feature-items2 .feature-item p {
  padding: 20px 25px;
}
.feature-items1 .feature-item p, .feature-items2 .feature-item p {
  padding: 20px 20px;
}
.feature-support-contact {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media screen and (max-width: 810px) {
  .feature-support-contact {
    flex-wrap: wrap;
  }
}
.feature-support-contact .explanation {
  width: 64%;
  text-align: left;
  color: #ffffff;
}
@media screen and (max-width: 810px) {
  .feature-support-contact .explanation {
    width: 100%;
    margin-bottom: 20px;
  }
}
.feature-support-contact .explanation h4 {
  font-size: 2.3rem;
  font-weight: 700;
}
@media screen and (max-width: 810px) {
  .feature-support-contact .explanation h4 {
    font-size: 1.8rem;
  }
}
.feature-support-contact .explanation p:first-of-type {
  margin-top: 20px;
}
.feature-support-contact .link-btn {}
@media screen and (max-width: 810px) {
  .feature-support-contact .link-btn {
    margin: auto;
  }
}
.c-btn3 {
  width: 100%;
  background-color: #EEE130;
  border: .7rem solid var(--color-white);
  border-radius: 50px;
  display: grid;
  font-size: 2.7rem;
  font-weight: 700;
  line-height: 1;
  place-content: center;
  position: relative;
  text-align: center;
  transition: opacity var(--easeOutQuart) .3s;
  cursor: pointer;
}
@media screen and (max-width: 810px) {
  .c-btn3 {
    border: .4rem solid var(--color-white);
    margin: auto;
    font-size: 1.6rem;
    line-height: 1.5;
  }
}
.c-btn3 a, .c-btn3 span {
  display: block;
  width: 40rem;
  height: 100%;
  padding: 2.9rem;
  text-decoration: none;
  color: inherit;
  line-height: 2.0rem;
}
@media screen and (max-width: 810px) {
  .c-btn3 a, .c-btn3 span {
    width: 20rem;
    padding: .8rem 0;
  }
}
.c-btn3:hover {
  opacity: 0.7;
}
/* =========================
  このページでわかること
========================= */
.p-area-recognize {
  padding: 15rem 0;
}
@media screen and (max-width: 810px) {
  .p-area-recognize {
    padding: 8rem 0;
  }
}
.recognize-content-link {
  width: 100%;
}
.recognize-content-link.recognize {
  position: relative;
  z-index: 0;
}
.recognize-content-link.recognize::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(243, 246, 247, 1) 100%);
  pointer-events: none;
  z-index: -1;
}
.recognize-list {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: stretch;
  margin-top: 70px;
  list-style: none;
}
@media screen and (max-width: 810px) {
  .recognize-list {
    flex-wrap: wrap;
    margin-top: 40px;
  }
}
.recognize-list li {
  width: calc(96% / 4);
  margin-bottom: 30px;
  border-radius: min(1.5625vw, 30px);
  overflow: hidden;
  background-color: #F2F2F2;
  transition: background-color .3s ease, color .3s ease;
}
@media screen and (max-width: 1024px) {
  .recognize-list li {
    width: calc(96% / 2);
  }
}
@media screen and (max-width: 640px) {
  .recognize-list li {
    width: 100%;
    border-radius: 1.5rem;
    margin-bottom: 15px;
  }
}
.recognize-list li > a {
  display: grid;
  grid-template-columns: 2.2em 1fr 0;
  align-items: center;
  gap: 10px;
  padding: 15px 10px 15px 15px;
  text-decoration: none;
  color: #333;
  line-height: 1.4;
  height: 100%;
  transition: color .3s ease;
}
.recognize-list li > a::before {
  content: "";
  width: 30px;
  height: 30px;
  display: block;
  -webkit-mask: url(../images/area/kaga/link-icon.svg) no-repeat center / contain;
  mask: url(../images/area/kaga/link-icon.svg) no-repeat center / contain;
  background-color: currentColor;
}
@media screen and (max-width: 1024px) {
  .recognize-list li > a::before {
    width: 2.0vw;
    height: 2.0vw;
  }
}
@media screen and (max-width: 640px) {
  .recognize-list li > a::before {
    width: 6.0vw;
    height: 6.0vw;
  }
}
.recognize-list li > a::after {
  content: "";
}
.recognize-list li > a > span {
  justify-self: center;
  font-size: 1.8rem;
  text-align: center;
  display: block;
}
@media screen and (max-width: 1024px) {
  .recognize-list li > a > span {
    font-size: 2.3rem;
  }
}
@media screen and (max-width: 810px) {
  .recognize-list li > a > span {
    font-size: 1.5rem;
  }
}
.recognize-list li:hover, .recognize-list li:focus-within, .recognize-list li:active {
  background-color: #333;
}
.recognize-list li:hover > a, .recognize-list li:focus-within > a, .recognize-list li:active > a {
  color: #fff;
}
.recognize-list li > a:active {
  transform: translateY(1px);
}
/* =========================
  ミニ知識
========================= */
/* ミニ知識 ベース */
.recognize-wrapper {
  padding-bottom: 15rem;
}
@media screen and (max-width: 810px) {
  .recognize-wrapper {
    padding-bottom: 7rem;
  }
}
.recognize-wrapper .inner.bg-white {
  padding: 10rem 70px;
  border-radius: 5rem;
}
@media screen and (max-width: 1024px) {
  .recognize-wrapper .inner.bg-white {
    padding: 10rem 4.5vw;
  }
}
@media screen and (max-width: 810px) {
  .recognize-wrapper .inner.bg-white {
    padding: 5rem 2.7rem;
  }
}
.recognize-wrapper .inner.bg-green {
  position: relative;
  background-color: #E7EDC5;
  border-radius: 12px;
  padding: 20px;
  z-index: 1;
}
.recognize-wrapper .inner.bg-green::before {
  content: "";
  position: absolute;
  inset: -10px;
  background-color: #F3F6F7;
  border-radius: 20px;
  z-index: -1;
}
.recognize-content {
  width: 100%;
  padding-top: 10rem;
}
@media screen and (max-width: 810px) {
  .recognize-content {
    padding-top: 5rem;
  }
}
.c-sectionTitle2 {
  font-size: 5rem;
  text-align: center;
  font-weight: 700;
}
@media screen and (max-width: 810px) {
  .c-sectionTitle2 {
    font-size: 2.7rem;
  }
}
.title-txt {
  margin: 40px 0 70px;
  text-align: center;
}
@media screen and (max-width: 810px) {
  .title-txt {
    margin: 20px 0 40px;
    text-align: left;
  }
}
/* ミニ知識 背景 */
.bg-white {
  background-color: #fff;
}
.bg-gray {
  background-color: #F3F6F7;
}
.bg-green {
  background-color: #E7EDC5;
}
/* ミニ知識 コンテンツ */
.recognize-wrapper .recognize-content.know .inner {
  padding: 10rem 70px;
}
@media screen and (max-width: 1024px) {
  .recognize-wrapper .recognize-content.know .inner {
    padding: 10rem 4.5vw;
  }
}
@media screen and (max-width: 810px) {
  .recognize-wrapper .recognize-content.know .inner {
    padding: 5rem 2.7rem;
  }
}
.know-items {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  flex-wrap: wrap;
  margin-top: 70px;
}
@media screen and (max-width: 810px) {
  .know-items {
    margin-top: 40px;
  }
}
.know-items .know-item {
  width: calc(96% / 2);
  border: 5px solid #DA902E;
  border-radius: min(1.5625vw, 30px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, .25);
}
@media screen and (max-width: 640px) {
  .know-items .know-item {
    width: 100%;
    border: 3px solid #DA902E;
    border-radius: 1.5rem;
  }
}
.know-item {
  display: flex;
  align-items: stretch;
  border: 2px solid #E5E5E5;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  max-width: 750px;
  margin-bottom: 60px;
}
/*
.know-item:last-child {
  margin-bottom: 0;
}*/
@media screen and (max-width: 810px) {
  .know-item {
    margin-bottom: 20px;
  }
  .know-item:last-child {
    margin-bottom: 0;
  }
}
.know-item .item-txt {
  flex: 1;
  padding: 20px 25px 20px;
  box-sizing: border-box;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .know-item .item-txt {
    padding: 1.2vw 1.5vw 1.2vw;
  }
}
@media screen and (max-width: 810px) {
  .know-item .item-txt {
    padding: 10px;
  }
}
.know-item .item-head {
  padding-left: 55px;
  padding-bottom: 18px;
}
@media screen and (max-width: 1024px) {
  .know-item .item-head {
    padding-left: 3vw;
    padding-bottom: 1.0vw;
  }
}
@media screen and (max-width: 810px) {
  .know-item .item-head {
    padding-left: 5.5vw;
  }
}
@media screen and (max-width: 640px) {
  .know-item .item-head {
    padding-left: 7vw;
    padding-bottom: 10px;
  }
}
.know-item .item-head h5 {
  font-size: 3.0rem;
  color: #DA902E;
  margin: 0;
}
@media screen and (max-width: 810px) {
  .know-item .item-head h5 {
    font-size: 1.8rem;
  }
}
.know-item .item-head .num {
  position: absolute;
  top: 0;
  left: 0;
  background: #DA902E;
  color: #fff;
  font-weight: 700;
  font-size: 4.0rem;
  border-radius: 0 0 30px 0;
  padding: 13px 20px 13px 18px;
  line-height: 1;
}
@media screen and (max-width: 1024px) {
  .know-item .item-head .num {
    font-size: 2.0vw;
    padding: 0.7vw 1.2vw .9vw .9vw;
  }
}
@media screen and (max-width: 810px) {
  .know-item .item-head .num {
    font-size: 3.0vw;
    padding: 1.0vw 1.7vw 1.2vw 2.2vw;
  }
}
@media screen and (max-width: 640px) {
  .know-item .item-head .num {
    left: -5px;
    font-size: 5.1vw;
    border-radius: 0 0 15px 0;
    padding: 1.7vw 2.7vw 2.2vw 3.2vw;
  }
}
.know-item .item-txt p {
  font-size: 2.3rem;
  line-height: 1.6;
}
@media screen and (max-width: 810px) {
  .know-item .item-txt p {
    font-size: 1.5rem;
    line-height: 1.4;
  }
}
.know-item .item-txt .sup-txt {
  margin-top: 10px;
  font-size: 1.7rem;
}
@media screen and (max-width: 810px) {
  .know-item .item-txt .sup-txt {
    font-size: 1.3rem;
  }
}
.know-item .item-img {
  flex: 0 0 30%;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .know-item .item-img {
    flex: 0 0 11vw;
  }
}
@media screen and (max-width: 810px) {
  .know-item .item-img {
    flex: 0 0 120px;
  }
}
.know-item .item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* =========================
  よくある質問
========================= */
.qa-items {
  margin: 70px 0 0;
}
@media screen and (max-width: 810px) {
  .qa-items {
    margin: 40px 0 0;
  }
}
.qa-items .qa-item {}
.qa-item {
  border-radius: min(1.5625vw, 30px);
  overflow: hidden;
  background: #DA902E;
  color: #fff;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .06) inset;
  margin-bottom: 30px;
}
.qa-item:last-child {
  margin-bottom: 0;
}
@media screen and (max-width: 810px) {
  .qa-item {
    border-radius: 1.5rem;
    margin-bottom: 20px;
  }
}
.qa-item summary::-webkit-details-marker {
  display: none;
}
.qa-item summary::marker {
  content: "";
}
.qa-item > summary {
  display: grid;
  grid-template-columns: 40px 1fr 28px;
  align-items: center;
  gap: 25px;
  padding: 20px 25px;
  font-weight: 700;
  cursor: pointer;
  position: relative;
}
@media (max-width: 640px) {
  .qa-item > summary {
    grid-template-columns: 35px 1fr 28px;
    gap: 15px;
  }
}
.qa-item > summary::before {
  content: "？";
  display: grid;
  place-items: center;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background: #fff;
  color: #DA902E;
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 1;
}
@media screen and (max-width: 810px) {
  .qa-item > summary::before {
    width: 28px;
    height: 28px;
    font-size: 2.0rem;
  }
}
.qa-item > summary .icon {
  position: relative;
  width: 25px;
  height: 25px;
  justify-self: end;
  transition: transform 0.6s ease;
}
.qa-item > summary .icon::before, .qa-item > summary .icon::after {
  content: "";
  position: absolute;
  background: currentColor;
  border-radius: 1px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.qa-item > summary .icon::before {
  width: 25px;
  height: 3px;
}
.qa-item > summary .icon::after {
  width: 3px;
  height: 25px;
  transition: opacity 0.4s ease;
}
.qa-item[open] > summary .icon {
  transform: rotate(180deg);
}
.qa-item[open] > summary .icon::after {
  opacity: 0;
}
.qa-item > summary:hover {
  background: color-mix(in oklab, #DA902E 92%, white);
}
.qa-item > summary:focus-visible {
  box-shadow: 0 0 0 3px rgba(255, 255, 255, .35) inset, 0 0 0 3px rgba(0, 0, 0, .05);
}
.qa-item:not([open]) > p {
  display: none;
}
.qa-item > p {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 25px;
  padding: 20px 25px;
  border-radius: 10px;
  will-change: transform, opacity, filter;
}
@media (max-width: 640px) {
  .qa-item > p {
    grid-template-columns: 35px 1fr;
    gap: 12px;
  }
}
.qa-item > p::before {
  content: "Ａ";
  display: grid;
  place-items: center;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background: #EEE130;
  color: #DA902E;
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 1;
}
@media screen and (max-width: 810px) {
  .qa-item > p::before {
    width: 28px;
    height: 28px;
    font-size: 2.0rem;
  }
}
@media (max-width: 640px) {
  .qa-item > summary {
    grid-template-columns: 32px 1fr 26px;
    padding: 14px 16px;
  }
  .qa-item > p {
    padding: 14px 16px;
  }
}
.qa-explanation {
  font-size: 1.8rem;
  margin-top: 70px;
}
@media screen and (max-width: 810px) {
  .qa-explanation {
    font-size: 1.5rem;
    margin-top: 40px;
  }
}
/* =========================
  そのほかにも ミニ知識
========================= */
@media screen and (min-width: 810px) {
  .miniKnow .p-appealSlider {
    margin-top: 0;
    padding-top: 60px;
  }
}
.p-appealSlider .c-appeal {
  background-color: #fdfbee;
}
@media screen and (max-width: 810px) {
  .p-appealSlider .splide__arrow {
    bottom: 45%;
  }
}
/*@media screen and (max-width: 480px) {
  .p-appealSlider .splide__arrow {
    bottom: 72vw;
  }
}*/
.p-appealSlider .splide__arrows {
  height: 60.0rem;
}
/*@media screen and (max-width: 480px) {
  .p-appealSlider .splide__arrows {
    width: 100%;
  }
}*/
@media screen and (min-width: 810px) {
  .miniKnow .p-appealSlider .c-appeal__content {
    height: initial;
    padding-bottom: 0;
    padding-left: 0;
    padding-top: 0;
  }
}
@media screen and (min-width: 810px) {
  .c-appeal__pic {
    position: relative;
  }
}
.splide__slide img {
  width: 100%;
  /*height: 350px;
  object-fit: cover;*/
}
@media screen and (min-width: 810px) {
  .miniKnow .p-appealSlider .c-appeal__content_explain {
    position: relative;
    padding: 30px 30px;
    background-color: #fdfbee;
    text-align: left;
    z-index: 2;
  }
}
.miniKnow .p-appealSlider .c-appeal__content_explain {
  padding: 2.7rem;
}
@media screen and (max-width: 810px) {
  .c-appeal__ttl {
    font-size: 2.5rem;
  }
}
/* =========================
  葬儀ディレクターによるサポート体制
========================= */
.support-items {
  width: 163rem;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  margin: 0 auto;
}
@media screen and (max-width: 810px) {
  .support-items {
    width: 100%;
    flex-wrap: wrap;
  }
}
.support-item {
  width: 77rem;
}
@media screen and (max-width: 810px) {
  .support-item {
    width: 100%;
    margin-bottom: 30px;
  }
}
.support-item a {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  border-radius: min(1.5625vw, 30px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, .25);
  background-color: #fff;
}
@media screen and (max-width: 810px) {
  .support-item a {
    border-radius: 1.5rem;
  }
}
.support-item p.position {
  padding: min(.8854166667vw, 17px);
  background-color: #DA902E;
  font-size: min(1.0416666667vw, 20px);
  font-weight: 700;
  text-align: center;
  color: #fff;
}
@media screen and (max-width: 810px) {
  .support-item p.position {
    font-size: 3.5vw;
    /*font-size: 2.0833333333vw;*/
    padding: 1.7708333333vw;
  }
}
.support-item .support-content {
  padding: 20px 30px 20px;
  font-weight: 500;
}
@media screen and (max-width: 810px) {
  .support-item .support-content {
    padding: 20px 20px 20px;
  }
}
.support-item p.support-ttl {
  font-size: 5.0rem;
  font-weight: 500;
  letter-spacing: 0.1vw;
  text-align: center;
}
@media screen and (max-width: 810px) {
  .support-item p.support-ttl {
    font-size: 2.7rem;
  }
}
.support-item p.support-ttl rt {
  margin-bottom: 5px;
  font-size: 1.5rem;
}
@media screen and (max-width: 810px) {
  .support-item p.support-ttl rt {
    font-size: 1.2rem;
  }
}
.support-item .support-img {
  width: 100%;
}
.support-item .support-txt {
  padding: 20px 0;
  text-align: left;
}
.testimonial {}
.testimonial li {
  position: relative;
}
.testimonial li::before {
  display: inline-block;
  width: 45px;
  height: 40px;
  background-image: url(../images/area/kaga/link-icon.svg);
  background-size: contain;
  background-repeat: no-repeat;
}
.testimonial {
  list-style: none;
  margin: 0;
  padding: 0;
  color: #333;
}
.testimonial li {
  position: relative;
  padding: 20px 0 20px 70px;
}
@media screen and (max-width: 810px) {
  .testimonial li {
    padding: 20px 0 20px 57px;
  }
}
.testimonial li {
  border-top: 1px dashed #CCCCCC;
}
.testimonial li::before {
  content: "";
  position: absolute;
  left: 8px;
  top: 22px;
  width: 45px;
  height: 40px;
  background: url(../images/area/kaga/comment-icon.svg) center/contain no-repeat;
  opacity: .9;
}
@media screen and (max-width: 810px) {
  .testimonial li::before {
    width: 35px;
    height: 33px;
  }
}
.testimonial li strong {
  background: linear-gradient(transparent 90%, #707070 90%);
  font-weight: 500;
}
.t-body {
  margin: 0 0 6px;
  line-height: 1.6;
}
.t-meta {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #7a7a7a;
  font-size: 1.9rem;
}
@media screen and (max-width: 810px) {
  .t-meta {
    font-size: 1.5rem;
  }
}
.t-meta .score b {
  font-weight: 700
}
.stars {
  --value: 4.5;
  --size: 12px;
  --gap: 3px;
  --star-empty: #d9d9d9;
  --star-fill: #EEE130;
  --w: calc(var(--size) * 5 + var(--gap) * 4);
  display: inline-block;
  width: var(--w);
  height: var(--size);
  line-height: 1;
  --percent: calc((var(--value) / 5) * 100%);
  background:
    linear-gradient(90deg, var(--star-fill) var(--percent), var(--star-empty) var(--percent));
  -webkit-mask: url("data:image/svg+xml;utf8,\
  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><path d='M6 0l1.76 3.58L12 4.1 9 7l.7 4.1L6 9.5 2.3 11.1 3 7 0 4.1l4.24-.52z'/></svg>") repeat left/var(--size) var(--size);
  mask: url("data:image/svg+xml;utf8,\
  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><path d='M6 0l1.76 3.58L12 4.1 9 7l.7 4.1L6 9.5 2.3 11.1 3 7 0 4.1l4.24-.52z'/></svg>") repeat left/var(--size) var(--size);
  background-size: calc(var(--size) + var(--gap)) var(--size);
}
.stars:focus {
  outline: 2px solid #c0c0c0;
  outline-offset: 2px;
}
/* レスポンシブ微調整（任意） */
/*@media (min-width: 810px){
  .testimonial{ font-size:15px; }
  .t-meta{ font-size:12.5px; }
  .stars{ --size: 13px; --gap: 3px; }
}*/
.support-item .link-btn {
  background-color: #F2F2F2;
  display: grid;
  height: min(3.28125vw, 63px);
  place-content: center;
}
@media screen and (max-width: 810px) {
  .support-item .link-btn {
    width: 100%;
    padding: 3.5rem 0;
  }
}
.support-item .link-btn .c-btn2 {
  margin: 0 1.5rem;
  position: relative;
  width: 20rem;
}
.support-item .link-btn .c-btn2 span {
  border-radius: 20px;
  display: block;
  line-height: 3.9rem;
  text-align: center;
  transition: opacity var(--easeOutQuart) .3s;
  width: 100%;
}
/* =========================
  選ばれるお葬式の形式とは？
========================= */
.format .title-txt {
  text-align: left;
}
@media screen and (max-width: 810px) {
  .format .title-txt {
    margin: 40px 0 20px;
  }
}
.format-img {
  margin-bottom: 40px;
}
@media screen and (max-width: 810px) {
  .format-img {
    margin-bottom: 20px;
  }
}
.format-img .pc {
  display: block;
}
.format-img .sp {
  display: none;
}
@media screen and (max-width: 810px) {
  .format-img .pc {
    display: none;
  }
  .format-img .sp {
    display: block;
  }
}
.format .inner {
  position: relative;
}
.format .inner .link-btn {
  position: absolute;
  right: 0;
  bottom: -2vw;
  left: 0;
  width: 40rem;
  margin: auto;
}
@media screen and (max-width: 810px) {
  .format .inner .link-btn {
    bottom: -2.5vw;
    width: 20rem;
  }
}
@media screen and (max-width: 810px) {
  .format .inner .link-btn {
    bottom: -5vw;
  }
}
/* =========================
  家族葬とは？
========================= */
.whatcont .inner-fll {
  position: relative;
  padding: 10rem 0;
}
@media screen and (max-width: 810px) {
  .whatcont .inner-fll {
    padding: 5rem 0;
  }
}
.whatcont .inner-fll::before {
  content: "";
  position: absolute;
  inset: 0;
  width: 163rem;
  height: 100%;
  margin: 0 auto;
  background-color: #fff;
  border-radius: 5rem;
  z-index: 0;
}
@media screen and (max-width: 810px) {
  .whatcont .inner-fll::before {
    width: 100%;
  }
}
.whatcont .inner-fll > * {
  position: relative;
  z-index: 1;
}
.whatcont .what2 {
  padding-top: 10rem;
}
@media screen and (max-width: 810px) {
  .whatcont .what2 {
    padding-top: 5rem;
  }
}
.c-what, .c-what2 {
  background-color: var(--color-white);
  border-radius: 3rem;
  box-shadow: 0 1rem 2rem rgba(0, 0, 0, .15);
  overflow: hidden;
  width: 100rem;
}
.c-what__head, .c-what2__head {
  align-items: center;
  background-color: #fdfbee;
  display: flex;
  height: 9.6rem;
  justify-content: center;
}
@media screen and (max-width: 810px) {
  .c-what__head, .c-what2__head {
    height: 7.5rem;
  }
}
.c-what__content, .c-what2__content {
  position: relative;
}
.c-what__content .c-btn2, .c-what2__content .c-btn2 {
  width: 22.7rem;
}
.c-what__sub, .c-what2__sub {
  background-color: var(--color-red);
  border-radius: 30px;
  color: var(--color-text-white);
  font-size: 1.8rem;
  line-height: 1.5;
  padding: .8rem 2.5rem;
  text-align: center;
}
.c-what .c-btn2, .c-what__desc, .c-what__subTtl, .c-what2 .c-btn2, .c-what2__desc, .c-what2__subTtl {
  position: relative;
  z-index: 1;
}
.c-what__ttl, .c-what2__ttl {
  font-family: var(--font-mincho);
  font-size: 4rem;
  margin: 0 0 0 .5rem;
}
.c-what--arigatou .c-what__ttl, .c-what2--arigatou .c-what2__ttl {
  mix-blend-mode: multiply;
  width: 19.5rem;
}
.c-what__subTtl, .c-what2__subTtl {
  font-weight: 700;
  line-height: 1.3636363636;
}
.c-what__desc, .c-what2__desc {
  font-size: 1.8rem;
  line-height: 1.6666666667;
}
.p-whatSlider, .p-what2Slider {
  position: relative;
  z-index: 10;
}
.p-whatSlider .splide__track, .p-what2Slider .splide__track {
  padding: 3rem 0;
}
.p-whatSlider .c-what, .p-what2Slider .c-what2 {
  margin-right: 12rem !important;
}
.p-whatSlider .splide__arrows, .p-what2Slider .splide__arrows {
  height: 41.1rem;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  top: 3rem;
  width: 100rem;
}
.p-whatSlider .splide__arrow, .p-what2Slider .splide__arrow {
  bottom: 0;
  margin: auto;
  top: 0;
}
.p-whatSlider .splide__arrow--prev, .p-what2Slider .splide__arrow--prev {
  left: -4.5rem;
}
.p-whatSlider .splide__arrow--next, .p-what2Slider .splide__arrow--next {
  right: -4.5rem;
}
@media screen and (min-width:810px) {
  .c-what__content, .c-what2__content {
    display: flex;
    flex-direction: column;
    height: 31.5rem;
    justify-content: space-between;
    padding-bottom: 3.8rem;
    padding-left: 8.2rem;
    padding-top: 3.4rem;
  }
  .c-what--system .c-what__content, .c-what2--system .c-what2__content {
    padding-top: 2rem;
  }
  .c-what__desc, .c-what2__desc {
    width: 30.5rem;
  }
  .c-what--system .c-what__desc, .c-what2--system .c-what2__desc {
    width: 33.6rem
  }
  .c-what__pic, .c-what2__pic {
    position: absolute;
    right: 0;
    top: 0;
    width: 100rem;
  }
}
@media screen and (max-width:810px) {
  .c-what, .c-what2 {
    border-radius: 1.5rem;
    width: 35rem;
  }
  .c-what__head, .c-what2__head {
    flex-direction: column;
  }
  .c-what__content .c-btn2, .c-what2__content .c-btn2 {
    margin: 2.1rem auto 2.7rem;
  }
  .c-what__sub, .c-what2__sub {
    font-size: 1.2rem;
    padding: .6rem 2.5rem;
  }
  .c-what__ttl, .c-what2__ttl {
    font-size: 2.8rem;
    margin: 0;
  }
  .c-what--arigatou .c-what__ttl, .c-what2--arigatou .c-what2__ttl {
    translate: 0 -11px;
    width: 13.8rem;
  }
  .c-what__desc, .c-what2__desc {
    padding: 1rem 2rem;
  }
  .p-whatSlider, .p-what2Slider {
    background-color: var(--color-base);
  }
  .p-whatSlider .c-what, .p-what2Slider .c-what2 {
    margin-right: 2rem !important;
  }
  .p-whatSlider .splide__arrows, .p-what2Slider .splide__arrows {
    width: 35rem;
  }
  .p-whatSlider .splide__arrow--prev, .p-what2Slider .splide__arrow--prev {
    left: -1rem;
  }
  .p-whatSlider .splide__arrow--next, .p-what2Slider .splide__arrow--next {
    right: -1rem;
  }
}
/* 調整 */
@media screen and (max-width: 810px) {
  .p-whatSlider, .p-what2Slider {
    background-color: initial;
  }
}
.js-whatSlider .splide__slide.is-prev, .js-what2Slider .splide__slide.is-prev {
  visibility: hidden !important;
}
.p-whatSlider .splide__arrows, .p-what2Slider .splide__arrows {
  height: auto;
  top: 35rem;
}
@media screen and (max-width: 810px) {
  .p-whatSlider .splide__arrows, .p-what2Slider .splide__arrows {
    width: 88%;
    top: 30rem;
  }
}
@media screen and (max-width: 480px) {
  .p-whatSlider .splide__arrows, .p-what2Slider .splide__arrows {
    width: 35rem;
  }
}
.p-whatSlider .splide__arrow--prev, .p-what2Slider .splide__arrow--prev {
  left: 16.5rem;
}
.p-whatSlider .splide__arrow--next, .p-what2Slider .splide__arrow--next {
  right: 16.5rem;
}
@media screen and (max-width: 810px) {
  .p-whatSlider .splide__arrow--next, .p-what2Slider .splide__arrow--next {
    right: -1rem;
  }
}
.js-whatSlider .splide__list, .js-what2Slider .splide__list {
  counter-reset: step;
}
.c-what, .c-what2 {
  width: 60rem;
  background: #fff;
  border-radius: min(1.5625vw, 30px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, .25);
  transition: transform .35s ease, box-shadow .35s ease;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 810px) {
  .c-what, .c-what2 {
    width: 88%;
    border-radius: 1.5rem;
  }
}
.c-what__ttl, .c-what2__ttl {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 9.6rem;
  font-size: 3.0rem;
  font-weight: 500;
  text-align: center;
  background-color: #FDFBEE;
}
@media screen and (max-width: 810px) {
  .c-what__ttl, .c-what2__ttl {
    height: 7.5rem;
    font-size: 2.5rem;
  }
}
.c-what__ttl span, .c-what2__ttl span {
  display: flex;
  align-items: center;
  gap: 1.2rem;
}
.splide__slide:not(.splide__slide--clone) .c-what__ttl span::before, .splide__slide:not(.splide__slide--clone) .c-what2__ttl span::before {
  content: attr(data-step);
  width: 35px;
  height: 35px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #CCC;
  color: #fff;
  font-weight: 700;
  line-height: 1;
  margin-right: .6rem;
}
@media screen and (min-width: 810px) {
  .c-what__content, .c-what2__content {
    height: auto;
  }
}
.c-what__content, .c-what2__content {
  padding: 30px 30px;
}
@media screen and (min-width: 810px) {
  .c-what__pic, .c-what2__pic {
    position: relative;
    width: 100%;
  }
}
.c-what__pic, .c-what2__pic {
  display: block;
  margin: 6px auto 0;
}
.c-what__pic img, .c-what2__pic img {
  display: block;
  width: min(92%, 300px);
  height: auto;
  margin-inline: auto;
}
.whatcont .splide {
  visibility: hidden;
}
.whatcont .splide.is-initialized, .splide.is-active {
  visibility: visible;
}
.whatcont .splide__track {
  overflow: hidden;
}
.whatcont .splide__arrow--prev {
  display: none !important;
}
.whatcont .splide__list {
  will-change: transform;
  backface-visibility: hidden;
  transform: translateZ(0);
}
/* =========================
  比較表：こんな方にはこの形式が向いています
========================= */
.comparison .testimonial li:first-child {
  border-top: none;
}
.comparison .testimonial li::before {
  top: 19px;
}
@media screen and (max-width: 810px) {
  .comparison .testimonial li::before {
    top: 20px;
  }
}
.comparison .support-item .link-btn {
  background-color: #F2F2F2;
  padding: 6.5rem 0;
  place-content: center;
}
@media screen and (max-width: 810px) {
  .comparison .support-item .link-btn {
    width: 100%;
    padding: 3.5rem 0;
  }
}
/* =========================
  加賀市の家族葬・葬儀場
========================= */
.recognize-wrapper.bg-green {
  border-radius: 5rem;
}
.recognize-wrapper.access .inner2 {
  padding: 10rem 0 0;
}
@media screen and (max-width: 810px) {
  .recognize-wrapper.access .inner2 {
    padding: 5rem 2.7rem 0;
  }
}
.content-detail {
  width: 163rem;
  height: 100%;
  box-sizing: border-box;
  margin: 0 auto;
}
@media screen and (max-width: 810px) {
  .content-detail {
    width: 100%;
  }
}
.content-detail.plan {
  padding-top: 10rem;
}
@media screen and (max-width: 810px) {
  .content-detail.plan {
    padding-top: 5rem;
  }
}
.p-accessSlider {
  padding-top: 50px;
  position: relative;
  z-index: 10;
}
@media screen and (max-width: 810px) {
  .p-accessSlider {
    padding-top: 40px;
  }
}
.p-accessSlider .splide__track {
  padding: 3rem 0;
}
@media screen and (max-width: 810px) {
  .p-accessSlider .splide__track {
    padding: 0;
  }
}
.p-accessSlider .c-access {
  margin-right: 3.5rem !important;
}
.p-accessSlider .splide__arrows {
  height: 41.1rem;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  top: 3rem;
  width: 100rem;
}
@media screen and (max-width: 810px) {
  .p-accessSlider .splide__arrows {
    width: 100%;
  }
}
/*@media screen and (max-width: 480px) {
  .p-accessSlider .splide__arrows {
    width: 33rem;
  }
}*/
.p-accessSlider .splide__arrow {
  bottom: 0;
  margin: auto;
  top: 0;
}
.p-accessSlider .splide__arrow {
  top: 28%;
}
@media screen and (min-width: 810px) {
  .p-accessSlider .splide__arrow {
    top: 5vw;
  }
}
@media screen and (max-width: 810px) {
  .p-accessSlider .splide__arrow {
    top: 11vw;
  }
}
@media screen and (max-width: 480px) {
  .p-accessSlider .splide__arrow {
    top: 0;
    bottom: 45vw;
  }
}
.p-accessSlider .splide__arrow--prev {
  left: -36.5rem;
}
@media screen and (max-width: 810px) {
  .p-accessSlider .splide__arrow--prev {
    left: -1rem;
  }
}
.p-accessSlider .splide__arrow--next {
  right: -36.5rem;
}
@media screen and (max-width: 810px) {
  .p-accessSlider .splide__arrow--next {
    right: -1rem;
  }
}
.c-access {
  overflow: hidden;
  width: 51.8rem;
}
@media screen and (max-width: 810px) {
  .c-access {
    width: 100%;
  }
}
/*@media screen and (min-width: 811px) {
  .p-topPlan__list .p-planSlider, .p-topPlan__list .p-topPlan__list__kaso {
    width: 74rem;
  }
}*/
.js-accessSlider .splide__list {
  align-items: stretch;
}
.js-accessSlider .splide__slide {
  display: flex;
}
.js-accessSlider .p-funeralHomeItem {
  height: 100%;
  min-height: 0;
  border-radius: min(1.5625vw, 30px);
}
@media screen and (max-width: 810px) {
  .js-accessSlider .p-funeralHomeItem {
    border-radius: 1.5rem;
  }
}
.js-accessSlider .p-funeralHomeItem__desc {
  display: block;
  min-width: 0;
  margin: 0;
  padding: 0;
}
.js-accessSlider .p-funeralHomeItem__desc .desc-grow {
  --lines: 2; /* 表示行数（2行固定） */
  --lh: 1.6; /* 行間 */
  --py: 1.9rem; /* 上下のpadding（希望値） */
  --px: 5rem; /* 左右のpadding（希望値） */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: var(--lines);
  overflow: hidden;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  padding: var(--py) var(--px);
  box-sizing: border-box;
  width: 100%;
  background: #FDFBEE;
  line-height: var(--lh);
  min-width: 0;
  --content-h: calc(1em * var(--lh) * var(--lines));
  height: calc(var(--content-h) + (2 * var(--py)));
}
.js-accessSlider .p-funeralHomeItem__info {
  flex: 0 0 auto;
}
.js-accessSlider .p-funeralHomeItem__btns {
  margin-top: auto;
  position: relative;
  z-index: 2;
}
.js-accessSlider .p-funeralHomeItem__link {
  z-index: 1;
}
/* =========================
  人季（ひととき）の安心プラン
========================= */
@media screen and (min-width: 810px) {
  .p-topPlan__list {
    width: 100%;
    margin-top: 70px;
  }
}
@media screen and (max-width: 810px) {
  .p-planSlider .splide__arrow {
    top: 8vw;
  }
}
@media screen and (max-width: 810px) {
  .p-planCard__subName {
    font-size: 3.5vw;
  }
}
/* =========================
  無料相談・お問い合わせ
========================= */
.p-area-contact-form {
  padding: 0 0 15rem;
  position: relative;
  z-index: 2;
}
.p-area-contact-form::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(243, 246, 247, 1) 100%);
  border-radius: 0 0 5rem 5rem;
  pointer-events: none;
  z-index: -1;
}
@media screen and (max-width: 810px) {
  .p-area-contact-form::after {
    border-radius: 0 0 1.5rem 1.5rem;
  }
}
.p-contact__desc {
  margin-top: 6rem;
}
/* =========================
  フッター
========================= */
body:not(.post-type-archive) .p-footer {
  margin-top: -5rem;
}
body:not(.post-type-archive) .p-footer:after {
  background: #fff;
}
.p-footer__content {
  padding: 20.0rem 0 3.9rem;
  background-color: #fff;
}
@media screen and (max-width: 810px) {
  .p-footer__content {
    padding: 11.5rem 0 2.2rem;
  }
}
@media screen and (max-width: 810px) {
  .l-wrapper .c-fixContact {
    display: none !important;
  }
}
/* =========================
  改行
========================= */
.sp-hide-810 {
  display: block !important;
}
@media screen and (max-width: 810px) {
  .sp-hide-810 {
    display: none !important;
  }
}
.sp-hide-640 {
  display: block !important;
}
@media screen and (max-width: 640px) {
  .sp-hide-640 {
    display: none !important;
  }
}
.sp-hide-480 {
  display: block !important;
}
@media screen and (max-width: 480px) {
  .sp-hide-480 {
    display: none !important;
  }
}
.pc-hide-810 {
  display: none !important;
}
@media screen and (max-width: 810px) {
  .pc-hide-810 {
    display: block !important;
  }
}
.pc-hide-640 {
  display: none !important;
}
@media screen and (max-width: 640px) {
  .pc-hide-640 {
    display: block !important;
  }
}
.pc-hide-480 {
  display: none !important;
}
@media screen and (max-width: 480px) {
  .pc-hide-480 {
    display: block !important;
  }
}
/* =========================
  その他
========================= */
@media screen and (max-width: 640px) {
  .sp-none {
    display: none !important;
  }
}


/* エリア一覧全体のコンテナ */
.area-card-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px; /* カード間の余白 */
    margin-top: 50px;
}

/* 各カードのデザイン */
.area-card-box {
    width: 100%;
    max-width: 32%; /* PCでは3列 */
    background: #fff;
    border: 1px solid #e6e6e6; /* 薄い枠線 */
    border-radius: 10px; /* 角丸 */
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05); /* ふんわりした影 */
    display: flex;
    flex-direction: column;
}

/* スマホ表示時の調整 */
@media (max-width: 768px) {
    .area-card-box {
        max-width: 100%; /* スマホでは1列 */
    }
}

/* 地域名の見出し（緑色の帯） */
.area-card-head {
    background-color: #9dae3e; /* サイト共通の緑 */
    color: #fff;
    text-align: center;
    padding: 15px 10px;
    margin: 0;
    font-size: 2.0rem;
    font-weight: bold;
    font-family: var(--font-mincho); /* 明朝体があれば適用 */
}

/* カードの中身 */
.area-card-body {
    padding: 25px 20px;
    flex: 1; /* 高さを揃える */
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-align: center;
}

.area-card-body p {
    font-size: 1.6rem;
    line-height: 1.8;
    margin-bottom: 20px;
    text-align: left; /* 文章は左寄せ */
}

/* ボタンのデザイン上書き（オレンジ色へ） */
.area-card-body .c-btn2 {
    width: 100%;
    margin: 0 auto;
}

.area-card-body .c-btn2 a {
    background-color: #da902e !important; /* サイト共通のオレンジ */
    color: #fff !important;
    border-radius: 50px;
    padding: 15px;
    display: block;
    font-weight: bold;
    text-decoration: none;
    transition: opacity 0.3s;
}

.area-card-body .c-btn2 a:hover {
    opacity: 0.8;
}


/* =========================
  施設カルーセルを廃止
========================= */
/* ▼▼ 能美市エリア専用 ▼▼ */
.location--nomi .p-accessList {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}

.location--nomi .p-accessList .c-access {
    flex: 1 1 calc(50% - 30px);
}

/* --- スマホ（〜768px） --- */
@media (max-width: 768px) {
    .location--nomi .p-accessList {
        gap: 20px;
    }
    .location--nomi .p-accessList .c-access {
        flex: 1 1 100%;
    }
}

/* --- 超小型スマホ（〜480px） --- */
@media (max-width: 480px) {
    .location--nomi .p-accessList {
        gap: 15px;
    }
    .location--nomi .p-funeralHomeItem__map iframe {
        width: 100% !important;
        height: 180px;
    }
}
/* ▲▲ 能美市エリア専用 ▲▲ */



/* ===========================
   area/index.html
   地域インデックスページ対応
   2025.12.01 masuda
   =========================== */

/* セクション全体のコンテナ */
.p-region-index {
  padding: 15rem 0;
  background: linear-gradient(to bottom, var(--color-base) 0%, #fff 100%);
}

@media screen and (max-width: 810px) {
  .p-region-index {
    padding: 8rem 0;
  }
}

/* メインタイトル */
.p-region-index__title {
  font-size: 5.5rem;
  font-family: var(--font-mincho);
  /* font-weight: 700; */
  text-align: center;
  line-height: 1.5;
  margin: 0 0 2rem;
  color: var(--color-text-black);
}

@media screen and (max-width: 810px) {
  .p-region-index__title {
    font-size: 3rem;
  }
}

/* サブタイトル（改行部分） */
.p-region-index__subtitle {
  display: block;
  font-size: 4rem;
  margin-top: 0.5rem;
}

@media screen and (max-width: 810px) {
  .p-region-index__subtitle {
    font-size: 2.4rem;
  }
}

/* リード文（導入文） */
.p-region-index__lead {
  font-size: 1.8rem;
  line-height: 1.8;
  /* text-align: center; */
  color: var(--color-text-black);
  max-width: 90rem;
  margin: 0 auto 5rem;
  padding: 0 1.5rem;
}

@media screen and (max-width: 810px) {
  .p-region-index__lead {
    font-size: 1.5rem;
    line-height: 1.7;
    margin-bottom: 3rem;
  }
}

/* 地域カード群のグリッド */
.p-region-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3rem;
  margin-top: 5rem;
}

@media screen and (max-width: 1024px) {
  .p-region-list {
    grid-template-columns: repeat(2, 1fr);
    gap: 2.5rem;
  }
}

@media screen and (max-width: 810px) {
  .p-region-list {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
}

/* 地域カードのベーススタイル */
.p-region-card {
  background-color: var(--color-white);
  border-radius: min(1.5625vw, 30px);
  overflow: hidden;
  box-shadow: 0px 1rem 2rem rgba(0, 0, 0, 0.15);
  display: flex;
  flex-direction: column;
  transition: box-shadow var(--easeOutQuart) 0.3s, transform var(--easeOutQuart) 0.3s;
  height: 100%;
}

@media screen and (max-width: 810px) {
  .p-region-card {
    border-radius: 1.5rem;
  }
}

/* ホバー時の効果 */
@media (hover: hover) {
  .p-region-card:where(:-moz-any-link, :enabled, summary):hover,
  .p-region-card:where(:any-link, :enabled, summary):hover {
    box-shadow: 0px 2rem 3rem rgba(0, 0, 0, 0.2);
    transform: translateY(-0.5rem);
  }
}

/* 地域カードのタイトル（色分け用） */
.p-region-card__title {
  margin: 0;
  padding: 1.5rem 0;
  font-size: 2.8rem;
  font-family: var(--font-mincho);
  /* font-weight: 700; */
  text-align: center;
  line-height: 1.4;
  color: var(--color-white);
  background-color: var(--color-green);
}

@media screen and (max-width: 810px) {
  .p-region-card__title {
    font-size: 2rem;
    padding: 1.2rem 0;
  }
}

/* タイトルの色分け（各地域ごと） */
.p-region-card--kanazawa .p-region-card__title {
  background-color: #4e90b9;
}

.p-region-card--kaga .p-region-card__title {
  background-color: var(--color-orange);
}

.p-region-card--nomi .p-region-card__title {
  background-color: #9dae3e;
}

.p-region-card--komatsu .p-region-card__title {
  background-color: var(--color-pink);
}

.p-region-card--nonoichi .p-region-card__title {
  background-color: #da902e;
}

/* カードの説明文エリア */
.p-region-card__description {
  flex: 1;
  padding: 2rem 1.8rem;
  font-size: 1.6rem;
  line-height: 1.8;
  color: var(--color-text-black);
  margin: 0;
}

@media screen and (max-width: 810px) {
  .p-region-card__description {
    font-size: 1.5rem;
    padding: 1.5rem 1.5rem;
    line-height: 1.7;
  }
}

/* カードのアクション領域（ボタン親） */
.p-region-card__action {
  padding: 0 1.8rem 2rem;
  display: flex;
  justify-content: center;
}

@media screen and (max-width: 810px) {
  .p-region-card__action {
    padding: 0 1.5rem 1.5rem;
  }
}

/* カードのリンク（ボタンスタイル） */
.p-region-card__link {
  display: inline-block;
  padding: 1rem 2.5rem;
  background-color: var(--color-black);
  color: var(--color-white);
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  border-radius: 50px;
  text-decoration: none;
  transition: opacity var(--easeOutQuart) 0.3s;
  min-width: 20rem;
}

@media (hover: hover) {
  .p-region-card__link:where(:-moz-any-link, :enabled, summary):hover {
    opacity: 0.7;
  }
  .p-region-card__link:where(:any-link, :enabled, summary):hover {
    opacity: 0.7;
  }
}

@media screen and (max-width: 810px) {
  .p-region-card__link {
    font-size: 1.5rem;
    padding: 0.8rem 2rem;
    min-width: 18rem;
  }
}
/* ===========================
   地域インデックスページ対応 end
   2025.12.01 masuda
   =========================== */
