@charset "UTF-8";
/* Sass Document */
/* ----------------------------------------------------------------------------------------------------
*  基本情報
* --------------------------------------------------------------------------------------------------*/
@layer components, variations;
@layer components {
  a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    font-size: 100%;
    vertical-align: baseline;
  }
  p {
    font-size: 1.6rem;
    line-height: 1.75;
  }
  button {
    border: none;
    font: inherit;
    color: currentColor;
  }
  ol,
ul {
    list-style: none;
  }
}
html {
  line-height: 1;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

strong {
  font-weight: 700;
}

caption,
td,
th {
  text-align: left;
}

blockquote,
q {
  quotes: none;
}

blockquote:after,
blockquote:before,
q:after,
q:before {
  content: "";
  content: none;
}

a img {
  border: none;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}

html {
  font-size: 100%;
  line-height: 1.5em;
}

* {
  box-sizing: border-box;
  word-break: break-word; /* 長い単語を強制的に折り返す */
  overflow-wrap: break-word; /* 同様の目的。対応ブラウザが広い */
  line-break: strict; /* 節での自然な改行を優先（日本語では特に有効） */
  white-space: normal; /* 普通の折り返し挙動に */
}

html {
  font-size: 100%;
  width: 100%;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  scroll-behavior: smooth;
  font-size: min(0.732vw, 62.5%);
}
@media screen and (max-width: 767.98px) {
  html {
    font-size: 1.3333333vw;
  }
}

body {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  position: relative;
  font-weight: 400;
  font-family: "Noto Sans JP", sans-serif;
  color: #1e1a1a;
  font-size: 1.6rem;
  scroll-behavior: smooth;
}
body.is-fixed {
  overscroll-behavior-y: none;
  overflow: hidden;
}

div[id],
section[id] {
  scroll-margin-top: -8rem;
}
@media screen and (max-width: 767.98px) {
  div[id],
section[id] {
    scroll-margin-top: -1rem;
  }
}

@media (min-width: 768px) {
  a[href*="tel:"] {
    text-decoration: none;
    cursor: default;
    pointer-events: none;
  }
}
img {
  max-width: 100%;
  height: auto;
  vertical-align: top;
}

p {
  font-feature-settings: "palt";
  line-height: 1.875;
}

.clearfix::after {
  content: "";
  display: block;
  clear: both;
}

.u-sp {
  display: none;
}
@media screen and (max-width: 767.98px) {
  .u-sp {
    display: block;
  }
}

.u-pc {
  display: block;
}
@media screen and (max-width: 767.98px) {
  .u-pc {
    display: none;
  }
}

.u-txtcolor--red {
  color: #cc280c;
}

.u-txtcolor--darkred {
  color: #a81420;
}

.is-animate {
  opacity: 0;
  transform: translateY(4rem);
  transition: 1s opacity, 1s transform;
}
.is-animate.is-show {
  opacity: 1;
  transform: translateY(0);
}

.u-min {
  font-family: "Noto Serif JP", serif;
}

.l-content__inner {
  max-width: 110rem;
  margin-inline: auto;
}

.c-section__ttl {
  font-family: "Noto Serif JP", serif;
  font-size: 7rem;
  font-weight: 600;
  text-align: center;
}
@media screen and (max-width: 767.98px) {
  .c-section__ttl {
    font-size: 6rem;
  }
}

.p-heading {
  background: url(../img/bg_kv.png) #f7f7e2 no-repeat top center/100% auto;
  padding-block: 1rem 7.4rem;
}
@media screen and (max-width: 767.98px) {
  .p-heading {
    background-image: url(../img/bg_kv_sp.png);
    padding-block: 2.6rem 8rem;
  }
}

.p-kv {
  max-width: 136.6rem;
  margin-inline: auto;
  position: relative;
}
.p-kv .c-note {
  font-size: 1.2rem;
  line-height: 2;
  margin: 2.2rem 0 0 14.3rem;
}
@media screen and (max-width: 767.98px) {
  .p-kv .c-note {
    font-size: 1.8rem;
    margin: 0 2rem 0;
    letter-spacing: -0.01em;
    line-height: 1.6666666667;
  }
}

.c-logo {
  width: 36.4rem;
  position: absolute;
  top: 2rem;
  right: 2rem;
}
@media (any-hover) {
  .c-logo a {
    transition: 0.3s;
  }
  .c-logo a:hover {
    opacity: 0.7;
  }
}
@media screen and (max-width: 767.98px) {
  .c-logo {
    position: static;
    width: 41.6rem;
    margin-inline: auto;
  }
}
.c-logo img {
  width: 100%;
}

.c-mark {
  position: absolute;
  width: 23.1rem;
  top: -9.7rem;
  right: -3rem;
}
@media screen and (max-width: 767.98px) {
  .c-mark {
    width: 30rem;
    right: 1rem;
  }
}

.p-series {
  position: absolute;
  top: 19.1rem;
  right: 4rem;
}
@media screen and (max-width: 767.98px) {
  .p-series {
    position: relative;
    top: 0;
    right: 0;
    margin-top: -11rem;
  }
}
.p-series .c-ttl {
  width: 43rem;
  margin-inline: auto;
}
@media screen and (max-width: 767.98px) {
  .p-series .c-ttl {
    width: auto;
    margin-top: -3rem;
  }
}

.swiper__wrapper {
  width: 53rem;
  overflow: hidden;
  position: relative;
}
@media screen and (max-width: 767.98px) {
  .swiper__wrapper {
    width: auto;
  }
}

.swiper {
  width: 68.3rem;
  margin-left: -8rem;
  padding-bottom: 1rem;
}
@media screen and (max-width: 767.98px) {
  .swiper {
    width: auto;
    margin-left: 0;
    padding-bottom: 2rem;
  }
}

.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
  bottom: 0;
}

.swiper-pagination-bullet {
  width: 1rem;
  height: 1rem;
  margin: 0 0.7rem !important;
}
@media screen and (max-width: 767.98px) {
  .swiper-pagination-bullet {
    width: 1.2rem;
    height: 1.2rem;
    margin: 0 1rem !important;
  }
}

.swiper-pagination-bullet-active {
  background-color: #bf9f39;
}

.swiper-slide {
  transition: transform 0.5s ease, top 0.5s ease;
  transform: scale(0.55) !important; /* ← 基本は小さく */
  margin-top: auto;
  position: relative;
  top: 4.7rem;
}

.swiper-slide-prev {
  right: -4.4rem;
}

.swiper-slide-next {
  left: -4.4rem;
}

/* 中央のスライドだけ拡大・強調 */
.swiper-slide-active {
  transform: scale(1) !important;
  opacity: 1;
  z-index: 2;
  top: 0;
}

.p-kv__img {
  width: 84.3rem;
  margin-left: 14.3rem;
}
@media screen and (max-width: 767.98px) {
  .p-kv__img {
    width: auto;
    max-width: 70.7rem;
    margin: 2rem auto 0;
  }
}

.p-content__heading {
  background: url(../img/bg_heading.png) no-repeat top left 2rem/98.2% auto;
  max-width: 133rem;
  margin: 4rem auto 0;
  padding: 9.1rem 0 10rem 3rem;
}
@media screen and (max-width: 767.98px) {
  .p-content__heading {
    background-image: url(../img/bg_heading_sp.png);
    background-position: top center;
    padding: 13rem 3rem 0;
    margin-inline: 3.5rem;
  }
}
.p-content__heading .p-porduct__img {
  width: 60.3rem;
  margin: 4rem auto 0;
}
@media screen and (max-width: 767.98px) {
  .p-content__heading .p-porduct__img {
    width: 53.1rem;
    margin-top: 2rem;
  }
}
.p-content__heading .c-read {
  font-size: 2.2rem;
  line-height: 2.2727272727;
  font-weight: 700;
  text-align: center;
  margin-top: 1.8rem;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 767.98px) {
  .p-content__heading .c-read {
    font-size: 2.6rem;
    line-height: 1.9230769231;
    margin-top: 2rem;
  }
}
.p-content__heading .p-btn-wrapper {
  max-width: 57.6rem;
  margin: 4rem auto 0;
}
@media screen and (max-width: 767.98px) {
  .p-content__heading .p-btn-wrapper {
    margin-top: 28rem;
    max-width: 63.3rem;
  }
}
.p-content__heading .p-btn-wrapper .c-btn {
  min-height: 8rem;
}
@media screen and (max-width: 767.98px) {
  .p-content__heading .p-btn-wrapper .c-btn {
    font-size: 2.8rem;
    letter-spacing: 0;
    min-height: 8.8rem;
  }
  .p-content__heading .p-btn-wrapper .c-btn::before {
    right: 2.4rem;
  }
}
.p-content__heading .c-note {
  font-size: 1.2rem;
  text-align: center;
  margin-top: 0.8rem;
}
@media screen and (max-width: 767.98px) {
  .p-content__heading .c-note {
    font-size: 1.8rem;
  }
}

.p-recommend__upper {
  background: url(../img/bg_reccomend_upper.jpg) no-repeat top center/cover;
  padding-block: 7.7rem 5.9rem;
  position: relative;
}
@media screen and (max-width: 767.98px) {
  .p-recommend__upper {
    padding-block: 8rem 5rem;
    background-image: url(../img/bg_reccomend_upper_sp.jpg);
  }
}
.p-recommend__upper::after {
  position: absolute;
  content: "";
  width: 26.8rem;
  height: 7.6rem;
  background: url(../img/arrow.png) no-repeat top center/100% auto;
  left: 0;
  right: 0;
  margin-inline: auto;
  top: calc(100% - 3.1rem);
  z-index: 1;
}
.p-recommend__upper .c-catch {
  text-align: center;
  font-weight: 600;
  color: #fff;
  font-size: 5rem;
  font-family: "Noto Serif JP", serif;
  margin-top: 4.3rem;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 767.98px) {
  .p-recommend__upper .c-catch {
    margin-top: 3rem;
  }
}
.p-recommend__upper .c-catch span {
  font-size: 130%;
  position: relative;
}
.p-recommend__upper .c-catch span::before {
  position: absolute;
  content: "";
  width: 1rem;
  height: 1rem;
  background-color: #fff;
  -webkit-clip-path: circle(50% at 50% 50%);
          clip-path: circle(50% at 50% 50%);
  bottom: calc(100% - 1.2rem);
  left: -1rem;
  right: 0;
  margin-inline: auto;
}

.c-recommend__ttl {
  color: #fff;
  font-weight: 600;
  font-size: 6rem;
  text-align: center;
  position: relative;
  font-family: "Noto Serif JP", serif;
  padding-bottom: 2.2rem;
  letter-spacing: 0.07em;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}
@media screen and (max-width: 767.98px) {
  .c-recommend__ttl {
    font-size: 5rem;
  }
}
.c-recommend__ttl::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  background: url(../img/line_ttl.svg) no-repeat bottom center/100% auto;
  height: 1.4rem;
  width: 100%;
  top: 100%;
}

.p-recommend__list {
  max-width: 82.7rem;
  margin: 6.7rem auto 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: 1.8rem;
}
@media screen and (max-width: 767.98px) {
  .p-recommend__list {
    max-width: 47.7rem;
  }
}

.p-reccomend__item {
  font-size: 2.2rem;
  font-weight: 500;
  border: 2px solid #fff;
  color: #fff;
  padding: 1.8rem 2rem 1.8rem 9rem;
  position: relative;
  letter-spacing: -0.05em;
  width: 48%;
}
@media screen and (max-width: 767.98px) {
  .p-reccomend__item {
    font-size: 2.5rem;
    width: 100%;
    border-width: 1px;
  }
}
.p-reccomend__item::before, .p-reccomend__item::after {
  content: "";
  position: absolute;
}
.p-reccomend__item::before {
  background: url(../img/icn_check.svg) no-repeat center center/100% 100%;
  width: 2.7rem;
  height: 1.9rem;
  left: 1.7rem;
  top: 2rem;
}
.p-reccomend__item::after {
  width: 2px;
  height: 100%;
  left: 5.8rem;
  top: 0;
  background-color: #fff;
}

.p-reccomed__bottom {
  padding-top: 7.2rem;
  padding-bottom: 7.8rem;
  background: url(../img/bg_reccomend-bottom.png), linear-gradient(-60deg, rgb(213, 168, 80) 0%, rgb(255, 212, 88) 48%, rgba(213, 168, 80, 0.97) 100%);
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 100% auto;
}
@media screen and (max-width: 767.98px) {
  .p-reccomed__bottom {
    background-image: url(../img/bg_reccomend-bottom_sp.png), linear-gradient(-60deg, rgb(213, 168, 80) 0%, rgb(255, 212, 88) 48%, rgba(213, 168, 80, 0.97) 100%);
    padding: 18.8rem 3.5rem 7.8rem;
  }
}
.p-reccomed__bottom .c-section__ttl {
  color: #4f3712;
  line-height: 1.2;
  letter-spacing: 0.03em;
}
.p-reccomed__bottom .c-section__ttl span {
  display: block;
  font-size: 3.4rem;
  margin-bottom: 1.6rem;
}
.p-reccomed__bottom .c-heading__txt {
  font-size: 2.2rem;
  line-height: 2.2727272727;
  text-align: center;
  margin-top: 4rem;
  letter-spacing: 0.08em;
  font-weight: 400;
}
@media screen and (max-width: 767.98px) {
  .p-reccomed__bottom .c-heading__txt {
    font-size: 2.8rem;
    line-height: 1.7857142857;
    letter-spacing: 0.05em;
  }
}

.p-ekisu {
  display: flex;
  background: url(../img/bg_future-list.svg) #fff no-repeat top 2rem right 7rem/58.1rem 19.8rem;
  border-radius: 1rem;
  margin-top: 6rem;
  padding: 3.6rem 5rem 3.2rem 6rem;
  -moz-column-gap: 4rem;
       column-gap: 4rem;
  box-shadow: 2px 2px 0px 0px #cda54e;
}
@media screen and (max-width: 767.98px) {
  .p-ekisu {
    display: block;
    background-image: none;
    padding: 4.4rem 2.5rem 4.1rem;
  }
}
.p-ekisu .p-img-wrapper {
  width: 35.3rem;
  flex-shrink: 0;
}
@media screen and (max-width: 767.98px) {
  .p-ekisu .p-img-wrapper {
    width: 49.5rem;
    margin-inline: auto;
  }
}
.p-ekisu .p-txt-wrapper {
  flex-grow: 1;
}
@media screen and (max-width: 767.98px) {
  .p-ekisu .p-txt-wrapper {
    background: url(../img/bg_future-list.svg) no-repeat top 2rem left/59.3rem 21.4rem;
    padding-top: 5rem;
  }
}
.p-ekisu .p-txt-wrapper .c-ttl {
  color: #4f3712;
  font-size: 3.4rem;
  font-weight: 600;
  font-family: "Noto Serif JP", serif;
  line-height: 1.4705882353;
  letter-spacing: 0.07em;
  margin-bottom: 1.9rem;
}
@media screen and (max-width: 767.98px) {
  .p-ekisu .p-txt-wrapper .c-ttl {
    font-size: 4rem;
    text-align: center;
    letter-spacing: 0;
  }
}
.p-ekisu .p-txt-wrapper p {
  font-size: 2.2rem;
  line-height: 2.2727272727;
  letter-spacing: 0.09em;
}
@media screen and (max-width: 767.98px) {
  .p-ekisu .p-txt-wrapper p {
    font-size: 2.8rem;
    text-align: center;
    line-height: 1.7857142857;
    letter-spacing: 0;
  }
}
.p-ekisu .p-txt-wrapper .c-note {
  font-size: 1.4rem;
  line-height: 2.5;
  margin-top: 0.4rem;
}
@media screen and (max-width: 767.98px) {
  .p-ekisu .p-txt-wrapper .c-note {
    font-size: 1.6rem;
    margin-top: 0.6rem;
  }
}

.p-support {
  background: url(../img/bg_support.svg) #f7f7e2 no-repeat top 5rem center/106rem 105rem;
  padding-top: 9rem;
  padding-bottom: 6rem;
}
@media screen and (max-width: 767.98px) {
  .p-support {
    padding-block: 7.6rem 7.4rem;
    background-size: 59.9rem 59.9rem;
    background-position: top 12.7rem center;
  }
}
.p-support .c-ttl {
  text-align: center;
  font-size: 2.2rem;
  font-weight: 700;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  background: url(../img/bg_ribbon.svg) no-repeat 0 50%/100% 100%;
  color: #fff;
  padding: 0.7rem 7.1rem 3.5rem 8rem;
  letter-spacing: 0.07em;
  filter: drop-shadow(0px 0px 9px #ffffff) drop-shadow(0px 0px 9px #ffffff);
}
@media screen and (max-width: 767.98px) {
  .p-support .c-ttl {
    font-size: 2.4rem;
    letter-spacing: 0;
    padding: 1rem 6rem 3.2rem 7rem;
  }
}
.p-support .c-ttl .u-txtcolor--yellow {
  color: #fffc9f;
}
.p-support .c-ttl .u-txtsize--large {
  font-size: 120%;
}
.p-support .c-section__ttl {
  color: #4f3712;
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  letter-spacing: 0.1em;
  line-height: 1.2;
  position: relative;
  text-shadow: 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255);
}
@media screen and (max-width: 767.98px) {
  .p-support .c-section__ttl {
    font-size: 7.88rem;
    letter-spacing: 0;
  }
}
.p-support .c-section__ttl::before, .p-support .c-section__ttl::after {
  content: "";
  position: absolute;
  width: 3px;
  background-color: #1e1a1a;
  height: 80%;
  filter: drop-shadow(0px 0px 9px #ffffff) drop-shadow(0px 0px 9px #ffffff) drop-shadow(0px 0px 9px #ffffff) drop-shadow(0px 0px 9px #ffffff);
  top: 61%;
}
@media screen and (max-width: 767.98px) {
  .p-support .c-section__ttl::before, .p-support .c-section__ttl::after {
    width: 2px;
    height: 70%;
  }
}
.p-support .c-section__ttl::before {
  left: -2.6rem;
  transform: rotate(-30deg) translateY(-50%);
}
@media screen and (max-width: 767.98px) {
  .p-support .c-section__ttl::before {
    left: 0.5rem;
    transform: rotate(-20deg) translateY(-50%);
  }
}
.p-support .c-section__ttl::after {
  right: -0.6rem;
  transform: rotate(30deg) translateY(-50%);
}
@media screen and (max-width: 767.98px) {
  .p-support .c-section__ttl::after {
    right: 0.5rem;
    transform: rotate(20deg) translateY(-50%);
  }
}
.p-support .c-section__ttl .u-txtsize--small {
  font-size: 3.4rem;
  display: block;
  letter-spacing: 0;
}
@media screen and (max-width: 767.98px) {
  .p-support .c-section__ttl .u-txtsize--small {
    font-size: 4rem;
  }
}
.p-support .c-note {
  margin-top: 2rem;
  text-align: center;
  font-size: 1.4rem;
  line-height: 1.4285714286;
  letter-spacing: 0.1em;
  text-shadow: 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255);
}
@media screen and (max-width: 767.98px) {
  .p-support .c-note {
    text-shadow: 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255);
  }
}
.p-support .p-img-wrapper {
  width: 108.9rem;
  position: relative;
  margin-top: 2.3rem;
  margin-left: 3.6rem;
}
@media screen and (max-width: 767.98px) {
  .p-support .p-img-wrapper {
    width: auto;
    margin-left: 0;
    margin-top: 3.5rem;
    padding-bottom: 8rem;
  }
  .p-support .p-img-wrapper img {
    padding-inline: 3.5rem;
  }
}
.p-support .p-img-wrapper p {
  position: absolute;
  font-size: 7rem;
  font-family: "Noto Serif JP", serif;
  color: #4f3712;
  font-weight: 600;
  line-height: 1.4;
  left: -7rem;
  bottom: 8.2rem;
  letter-spacing: 0.05em;
  text-shadow: 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255);
}
@media screen and (max-width: 767.98px) {
  .p-support .p-img-wrapper p {
    line-height: 1.2;
    left: 0;
    right: 0;
    margin-inline: auto;
    bottom: 0;
    text-align: center;
    letter-spacing: 0;
  }
}
.p-support .p-img-wrapper p span {
  font-size: 5rem;
  display: block;
  margin-left: -0.5em;
}

.p-no1__list {
  display: flex;
  margin-top: 3.7rem;
  -moz-column-gap: 2.3rem;
       column-gap: 2.3rem;
}
@media screen and (max-width: 767.98px) {
  .p-no1__list {
    justify-content: center;
    flex-wrap: wrap;
    gap: 2rem;
  }
}
@media screen and (max-width: 767.98px) {
  .p-no1__list li {
    width: 34rem;
  }
}

/* ----------------------------------------------------------------------------------------------------
*	
* --------------------------------------------------------------------------------------------------*/
.p-features {
  background: url(../img/bg_reason.png) #f7f7e2 no-repeat top center/100% auto;
  padding-top: 6.4rem;
  padding-bottom: 17.3rem;
}
@media screen and (max-width: 767.98px) {
  .p-features {
    padding: 5.6rem 3.5rem 7.7rem;
    background-image: url(../img/bg_reason_sp.png);
  }
}

.p-features__ttl {
  width: 49.4rem;
  margin-inline: auto;
}

.p-features__list {
  margin-top: 8rem;
}

.p-feature__item {
  background-color: #fff;
  box-shadow: 0px 0px 15px -2px #bbb;
  border-radius: 1rem;
  background-image: url(../img/bg_future-list.svg);
  background-repeat: no-repeat;
  background-size: 58.1rem 19.8rem;
  background-position: top 0.5rem right 3rem;
  position: relative;
}
@media screen and (max-width: 767.98px) {
  .p-feature__item {
    padding: 10rem 5rem 5rem !important;
    background-position: top 2rem left 4rem;
  }
}
.p-feature__item:nth-of-type(odd) {
  padding-right: 6rem;
  margin-left: 6rem;
}
@media screen and (max-width: 767.98px) {
  .p-feature__item:nth-of-type(odd) {
    margin-left: 0;
  }
}
.p-feature__item:nth-of-type(even) {
  background-position: top 0.5rem left 3rem;
  padding-left: 6rem;
  margin-right: 6rem;
}
@media screen and (max-width: 767.98px) {
  .p-feature__item:nth-of-type(even) {
    margin-right: 0;
    background-position: top 2rem left 4rem;
  }
}
.p-feature__item .c-point {
  position: absolute;
  top: 0;
}
@media screen and (max-width: 767.98px) {
  .p-feature__item .c-point {
    width: 29.5rem;
    left: 4rem !important;
    top: -4rem !important;
  }
}
.p-feature__item .c-ttl {
  grid-area: ttl;
  font-size: 4rem;
  font-weight: 600;
  font-family: "Noto Serif JP", serif;
  letter-spacing: 0.09em;
  border-bottom: 1px solid #1e1a1a;
  padding-bottom: 3rem;
}
@media screen and (max-width: 767.98px) {
  .p-feature__item .c-ttl {
    font-size: 5.4rem;
    padding-bottom: 2rem;
  }
}
.p-feature__item .p-txt-wrapper {
  grid-area: txt;
  margin-top: 2.1rem;
}
.p-feature__item .p-txt-wrapper p {
  font-size: 1.8rem;
  line-height: 1.9444444444;
  letter-spacing: 0.12em;
  font-feature-settings: "palt";
  text-align: justify;
}
@media screen and (max-width: 767.98px) {
  .p-feature__item .p-txt-wrapper p {
    font-size: 2.8rem;
    line-height: 1.7857142857;
    letter-spacing: 0.03em;
  }
}
.p-feature__item .p-txt-wrapper p .c-note {
  font-size: 1.4rem;
}
@media screen and (max-width: 767.98px) {
  .p-feature__item .p-txt-wrapper p .c-note {
    font-size: 70%;
    letter-spacing: 0;
  }
}
.p-feature__item + .p-feature__item {
  margin-top: 11.5rem;
}
@media screen and (max-width: 767.98px) {
  .p-feature__item + .p-feature__item {
    margin-top: 7.8rem;
  }
}

.p-feature__body {
  display: grid;
  grid-auto-columns: 1fr;
  grid-auto-rows: 1fr;
  grid-template-columns: auto auto;
  grid-template-rows: auto 1fr;
  gap: 0px 0px;
  grid-template-areas: "img ttl" "img txt";
}
@media screen and (max-width: 767.98px) {
  .p-feature__body {
    display: block;
  }
}
.p-feature__body .p-img-wrapper {
  grid-area: img;
}

.-feature01 .c-point {
  top: -2.2rem;
  left: 46.4rem;
}
.-feature01 .c-ttl {
  margin-top: 9.5rem;
}
@media screen and (max-width: 767.98px) {
  .-feature01 .c-ttl {
    margin-top: 0;
  }
}
.-feature01 .p-img-wrapper {
  margin: -2rem 4.2rem -5.5rem -6rem;
  width: 47.9rem;
}
@media screen and (max-width: 767.98px) {
  .-feature01 .p-img-wrapper {
    width: 63.2rem;
    margin: 0 0 0 -5rem;
  }
}

.-feature02 {
  padding-block: 9.5rem 1rem;
}
.-feature02 .c-point {
  top: -2.2rem;
  left: 6.3rem;
}
@media screen and (max-width: 767.98px) {
  .-feature02 {
    padding-bottom: 0;
  }
}

.-feature03 {
  padding-top: 6.1rem;
}
.-feature03 .c-point {
  top: -2.2rem;
  left: 46.4rem;
}
.-feature03 .c-ttl {
  margin-top: 3.5rem;
}
@media screen and (max-width: 767.98px) {
  .-feature03 .c-ttl {
    margin-top: 0;
    letter-spacing: 0.05em;
  }
}
.-feature03 .p-img-wrapper {
  width: 47.6rem;
  margin-left: -6rem;
  margin-right: 4rem;
  margin-bottom: -5.1rem;
}
@media screen and (max-width: 767.98px) {
  .-feature03 .p-img-wrapper {
    width: 63.2rem;
    margin: 4rem 0 0 -5rem;
  }
}
.-feature03 .p-txt-wrapper p {
  letter-spacing: 0.09em !important;
}
@media screen and (max-width: 767.98px) {
  .-feature03 .p-txt-wrapper p {
    letter-spacing: 0.03em !important;
  }
}

.p-feature__block {
  display: flex;
  margin-top: 2.7rem;
}
@media screen and (max-width: 767.98px) {
  .p-feature__block {
    display: block;
  }
}
.p-feature__block .p-txt-wrapper {
  margin-top: 0;
}
.p-feature__block .p-img-wrapper {
  width: 45.3rem;
  margin-right: -5.3rem;
  margin-top: 1rem;
  margin-left: 4.3rem;
  flex-shrink: 0;
}
@media screen and (max-width: 767.98px) {
  .p-feature__block .p-img-wrapper {
    width: 66.4rem;
    margin-right: -1rem;
    margin-left: 0;
    margin-top: 3rem;
  }
}
.p-feature__block + .p-feature__block {
  margin-top: 0.5rem;
}
@media screen and (max-width: 767.98px) {
  .p-feature__block + .p-feature__block {
    margin-top: 1rem;
  }
}

sup {
  vertical-align: top;
  font-size: 50% !important;
  position: relative;
  top: 0.6em;
}

.c-ttl-line {
  font-family: "Noto Serif JP", serif;
  font-size: 3.4rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  position: relative;
  line-height: 1.4;
  padding-left: 2.6rem;
  margin-bottom: 0.5rem;
}
@media screen and (max-width: 767.98px) {
  .c-ttl-line {
    font-size: 4.6rem;
  }
}
.c-ttl-line::before {
  content: "";
  position: absolute;
  width: 0.4rem;
  background-color: #a81420;
  left: 0;
  height: 70%;
  top: 0.9rem;
}

.p-pioneer {
  background: url(../img/bg_pioneer.jpg) #1a1a1a no-repeat bottom center/cover;
  padding-bottom: 7.3rem;
}
@media screen and (max-width: 767.98px) {
  .p-pioneer {
    background-size: 100% auto;
    width: 100%;
    overflow: hidden;
  }
}

.p-pioneer__ttl {
  padding-top: 6.6rem;
  padding-bottom: 9rem;
  background: url(../img/ttl_balloon.svg) no-repeat top center/100% 100%;
  text-align: center;
  color: #4f3712;
}
@media screen and (max-width: 767.98px) {
  .p-pioneer__ttl {
    background-image: url(../img/ttl_balloon_sp.svg);
    padding-top: 4rem;
    padding-bottom: 8rem;
  }
}
.p-pioneer__ttl .u-jp {
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  font-size: 3rem;
  background-color: #fff;
  font-weight: 700;
  padding: 1rem 4rem;
  letter-spacing: 0.1em;
  margin-bottom: 2rem;
}
.p-pioneer__ttl .u-min {
  font-size: 4.8rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  display: inline-block;
}
.p-pioneer__ttl .u-min .u-txtsize--large {
  font-size: 150%;
  margin-right: -2.7rem;
  letter-spacing: 0.02em;
}
@media screen and (max-width: 767.98px) {
  .p-pioneer__ttl .u-min .u-txtsize--large {
    margin-right: 0;
  }
}

.p-pioneer__content {
  max-width: 110rem;
  margin-inline: auto;
  color: #fff;
  -moz-column-gap: 4rem;
       column-gap: 4rem;
  margin-top: 3.4rem;
  display: grid;
  grid-auto-columns: 1fr;
  grid-auto-rows: 1fr;
  grid-template-columns: auto auto;
  grid-template-rows: auto 1fr;
  grid-template-areas: "img ttl" "img txt";
}
@media screen and (max-width: 767.98px) {
  .p-pioneer__content {
    display: block;
    padding-inline: 5rem;
  }
}
.p-pioneer__content .p-img-wrapper {
  width: 48.9rem;
  flex-shrink: 0;
  grid-area: img;
}
@media screen and (max-width: 767.98px) {
  .p-pioneer__content .p-img-wrapper {
    margin-inline: auto;
  }
}
.p-pioneer__content .p-img-wrapper figcaption {
  font-size: 1.4rem;
  color: #fff;
  position: relative;
  top: -2rem;
  margin-left: 2rem;
}
@media screen and (max-width: 767.98px) {
  .p-pioneer__content .p-img-wrapper figcaption {
    font-size: 1.6rem;
    text-align: right;
    margin-left: 0;
    margin-right: -3rem;
  }
}
.p-pioneer__content .p-txt-wrapper {
  grid-area: txt;
}
@media screen and (max-width: 767.98px) {
  .p-pioneer__content .p-txt-wrapper {
    margin-top: 3rem;
    padding-inline: 3.2rem;
  }
}
.p-pioneer__content .c-ttl {
  grid-area: ttl;
  font-family: "Noto Serif JP", serif;
  font-size: 4rem;
  line-height: 1.25;
  font-weight: 600;
  margin-bottom: 3rem;
  margin-top: 5.5rem;
}
@media screen and (max-width: 767.98px) {
  .p-pioneer__content .c-ttl {
    font-size: 5rem;
    text-align: center;
    margin-top: 0;
    margin-bottom: 4rem;
  }
}
.p-pioneer__content p {
  font-size: 1.8rem;
  line-height: 1.9444444444;
  letter-spacing: 0.13em;
  text-align: justify;
}
@media screen and (max-width: 767.98px) {
  .p-pioneer__content p {
    font-size: 2.8rem;
    letter-spacing: 0.05em;
  }
}

.p-interview {
  background: url(../img/bg_ttl.svg) #edeceb no-repeat calc(50% - 33.5rem) 4.2rem/58.1rem 19.8rem;
  padding-top: 10.5rem;
  padding-bottom: 14.7rem;
}
@media screen and (max-width: 767.98px) {
  .p-interview {
    padding: 13.6rem 3.5rem 8rem;
    background-position: top 6.5rem left 5rem;
  }
}
.p-interview .c-section__ttl {
  text-align: left;
}
@media screen and (max-width: 767.98px) {
  .p-interview .c-section__ttl {
    text-align: center;
    letter-spacing: 0.05em;
  }
}

.p-interview__content {
  background-color: #fff;
  box-shadow: 0px 0px 15px -5px #999;
  margin-top: 5.7rem;
  max-width: 104rem;
  position: relative;
}
@media screen and (max-width: 767.98px) {
  .p-interview__content {
    margin-top: 9.5rem;
  }
}
.p-interview__content .p-porduct__img {
  position: absolute;
  top: -31rem;
  right: -8.3rem;
  width: 28.2rem;
}
@media screen and (max-width: 767.98px) {
  .p-interview__content .p-porduct__img {
    width: 16.2rem;
    top: -5rem;
    right: -2rem;
  }
}
.p-interview__content .c-ttl {
  font-size: 4rem;
  border-bottom: 1px solid #1e1a1a;
  padding: 6rem 6rem 3rem;
  font-family: "Noto Serif JP", serif;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1.2;
}
@media screen and (max-width: 767.98px) {
  .p-interview__content .c-ttl {
    font-size: 5rem;
    padding: 5rem 5rem 4rem;
  }
}

.p-interview__body {
  display: flex;
  padding: 3rem 0 3rem 6rem;
  flex-direction: row-reverse;
}
@media screen and (max-width: 767.98px) {
  .p-interview__body {
    display: block;
    padding: 3rem 4rem 4rem;
  }
}
@media screen and (max-width: 767.98px) {
  .p-interview__body .p-txt-wrapper {
    margin-top: 3rem;
  }
}
.p-interview__body .p-txt-wrapper p {
  font-size: 1.8rem;
  line-height: 1.9444444444;
  letter-spacing: 0.15em;
  text-align: justify;
}
@media screen and (max-width: 767.98px) {
  .p-interview__body .p-txt-wrapper p {
    font-size: 2.8rem;
    letter-spacing: 0.06em;
  }
}
.p-interview__body .p-img-wrapper {
  width: 47.8rem;
  flex-shrink: 0;
  margin: 1rem -6rem -8.6rem 5.3rem;
}
@media screen and (max-width: 767.98px) {
  .p-interview__body .p-img-wrapper {
    margin: 1rem 0 0;
    width: auto;
  }
}
.p-interview__body .p-img-wrapper figcaption {
  font-size: 1.8rem;
  background-color: #1e1a1a;
  color: #fff;
  padding: 1.3rem 2.7rem;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
  letter-spacing: 0.1em;
  margin-top: -2.1rem;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 767.98px) {
  .p-interview__body .p-img-wrapper figcaption {
    font-size: 2.2rem;
  }
}

/* ----------------------------------------------------------------------------------------------------
*	products
* --------------------------------------------------------------------------------------------------*/
.p-products {
  background: url(../img/bg_products.jpg) no-repeat top center/100% 100%;
  padding-block: 11.7rem 8.8rem;
}
@media screen and (max-width: 767.98px) {
  .p-products {
    background-image: url(../img/bg_products_sp.jpg);
    padding: 7.7rem 3.5rem 9.7rem;
  }
}

.p-product__block {
  background-color: #fff;
  position: relative;
  box-shadow: 3px 10px 0px 0 rgba(56, 56, 55, 0.2);
  padding: 5.1rem 6rem 6rem 6rem;
  margin-top: 8.5rem;
}
@media screen and (max-width: 767.98px) {
  .p-product__block {
    padding: 8rem 5rem 6.8rem;
    box-shadow: 3px 5px 0px 0 rgba(56, 56, 55, 0.2);
  }
}
.p-product__block::before, .p-product__block::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.p-product__block::before {
  width: calc(100% - 1.4rem);
  height: calc(100% - 1.4rem);
  background: linear-gradient(90deg, rgb(218, 164, 72) 0%, rgb(207, 111, 80) 25%, rgb(217, 210, 121) 50%, rgb(218, 164, 72) 75%, rgba(208, 120, 84, 0.97) 100%);
}
.p-product__block::after {
  width: calc(100% - 2.2rem);
  height: calc(100% - 2.2rem);
  background-color: #fff;
}
.p-product__block .p-img-wrapper {
  margin-left: -5rem;
}
@media screen and (max-width: 767.98px) {
  .p-product__block .p-img-wrapper {
    margin-left: 0;
  }
}
.p-product__block.-block01 .p-img-wrapper img {
  width: 83%;
}
.p-product__block.-block02 .p-img-wrapper {
  margin-top: 1.4rem;
}
@media screen and (max-width: 767.98px) {
  .p-product__block.-block02 .p-img-wrapper {
    margin-top: 0;
  }
}
.p-product__block.-block02 .p-img-wrapper img {
  width: 44.5%;
}
.p-product__block.-block03 .p-img-wrapper {
  margin-top: 1.7rem;
}
@media screen and (max-width: 767.98px) {
  .p-product__block.-block03 .p-img-wrapper {
    margin-top: 0;
  }
}
.p-product__block.-block03 .p-img-wrapper img {
  width: 44.8%;
}
.p-product__block.-block03 .p-product__links {
  margin-top: 2.6rem;
}
.p-product__block.-block04 {
  margin-top: 3.4rem;
}
@media screen and (max-width: 767.98px) {
  .p-product__block.-block04 {
    padding-top: 5rem;
  }
}
.p-product__block.-block04::before {
  background-color: #b1c9a6;
  background-image: none;
}
.p-product__block.-block04 .p-img-wrapper {
  margin-top: 0.4rem;
}
@media screen and (max-width: 767.98px) {
  .p-product__block.-block04 .p-img-wrapper {
    margin-top: 0;
  }
}
.p-product__block.-block04 .p-img-wrapper img {
  width: 39.1%;
}
.p-product__block.-block04 .p-product__ttl {
  margin-bottom: 2rem;
}
.p-product__block.-block04 .p-product__links {
  margin-top: 3.7rem;
}
.p-product__block.-block04 .p-txt-wrapper {
  margin-top: 1.5rem;
}
.p-product__block + .p-product__block {
  margin-top: 4rem;
}

.p-product__content {
  position: relative;
  z-index: 3;
}

.p-product__links {
  margin-top: 1.6rem;
}
@media screen and (max-width: 767.98px) {
  .p-product__links {
    margin-top: 5.4rem;
  }
}

.p-product__body {
  display: flex;
}
@media screen and (max-width: 767.98px) {
  .p-product__body {
    display: block;
  }
}
.p-product__body .p-txt-wrapper {
  width: 64.3rem;
  margin-top: 3.7rem;
  flex-shrink: 0;
}
@media screen and (max-width: 767.98px) {
  .p-product__body .p-txt-wrapper {
    width: auto;
    margin-top: 3rem;
  }
}
.p-product__body .p-txt-wrapper p {
  font-size: 1.8rem;
  line-height: 1.9444444444;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 767.98px) {
  .p-product__body .p-txt-wrapper p {
    font-size: 2.8rem;
    line-height: 1.7857142857;
    letter-spacing: 0.05em;
  }
}
.p-product__body .p-txt-wrapper p .u-txtsize--large {
  font-size: 130%;
}
.p-product__body .p-img-wrapper {
  flex-grow: 1;
  text-align: center;
}

.p-product__ttl {
  font-family: "Noto Serif JP", serif;
  font-size: 4rem;
  font-weight: 600;
  line-height: 1.25;
  border-bottom: 1px solid #1e1a1a;
  padding-bottom: 1.3rem;
  margin-bottom: 1.3rem;
}
@media screen and (max-width: 767.98px) {
  .p-product__ttl {
    font-size: 4.6rem;
    padding-bottom: 2rem;
    margin-bottom: 1rem;
    white-space: nowrap;
  }
}

.p-product__shop-list {
  display: flex;
  -moz-column-gap: 3.2%;
       column-gap: 3.2%;
}
@media screen and (max-width: 767.98px) {
  .p-product__shop-list {
    display: block;
  }
}

.p-product__shop-item {
  width: 31.2%;
}
@media screen and (max-width: 767.98px) {
  .p-product__shop-item {
    width: 100%;
  }
  .p-product__shop-item + .p-product__shop-item {
    margin-top: 1.8rem;
  }
}

.p-product__detail-list {
  margin-top: 3rem;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  row-gap: 2rem;
}
@media screen and (max-width: 767.98px) {
  .p-product__detail-list {
    display: block;
    margin-top: 3.7rem;
  }
}

.p-product__detail-item {
  width: 48.5%;
}
@media screen and (max-width: 767.98px) {
  .p-product__detail-item {
    width: 100%;
  }
  .p-product__detail-item + .p-product__detail-item {
    margin-top: 1.8rem;
  }
}
.p-product__detail-item.-large {
  width: 100%;
}

.p-comparison {
  padding-top: 8rem;
}
.p-comparison .c-section__ttl {
  letter-spacing: 0.1em;
}
.p-comparison .c-read {
  font-family: "Noto Serif JP", serif;
  margin-top: 7.3rem;
  font-size: 4rem;
  letter-spacing: 0.05em;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
}
@media screen and (max-width: 767.98px) {
  .p-comparison .c-read {
    font-size: 4.4rem;
    line-height: 1.3636363636;
    margin-top: 7rem;
  }
}

.p-comparison__talbe {
  border-collapse: separate !important;
  border-spacing: 3px !important;
  width: 100%;
  max-width: 100rem;
  margin-inline: auto;
  margin-top: 14.4rem;
}
@media screen and (max-width: 767.98px) {
  .p-comparison__talbe {
    border-spacing: 2px !important;
  }
}
.p-comparison__talbe .u-align--center {
  text-align: center;
}
@media screen and (max-width: 767.98px) {
  .p-comparison__talbe .u-sp-arlign--left {
    text-align: left;
  }
}
.p-comparison__talbe .u-txtsize--large {
  font-size: 130%;
}
.p-comparison__talbe .u-txtsize--small {
  font-size: 80%;
}
@media screen and (max-width: 767.98px) {
  .p-comparison__talbe .u-txtsize--small {
    font-size: 2rem;
  }
}
.p-comparison__talbe td {
  background-color: #fff;
  width: 33.333%;
  vertical-align: middle;
  padding: 2rem 4.2rem;
}
@media screen and (max-width: 767.98px) {
  .p-comparison__talbe td {
    padding: 4rem 2.3rem;
  }
}
.p-comparison__talbe td .c-note {
  margin-top: 1rem;
  line-height: 1.25;
}
@media screen and (max-width: 767.98px) {
  .p-comparison__talbe td .c-note {
    line-height: 1.8;
  }
}
.p-comparison__talbe td p {
  letter-spacing: 0.05em;
  line-height: 1.875;
}
@media screen and (max-width: 767.98px) {
  .p-comparison__talbe td p {
    font-size: 2.5rem;
    line-height: 1.4;
  }
}
.p-comparison__talbe td p sup {
  vertical-align: top;
}
.p-comparison__talbe th {
  background-color: #72494e;
  color: #fff;
  text-align: center;
  font-size: 2.2rem;
  font-weight: 700;
  padding: 1.5rem;
}
@media screen and (max-width: 767.98px) {
  .p-comparison__talbe th {
    font-size: 3rem;
    padding-block: 1.8rem;
  }
}
.p-comparison__talbe .p-table__heading th {
  background-color: transparent;
  padding: 0;
  position: relative;
  background-color: #fff;
  border-radius: 2rem 2rem 0 0;
}
.p-comparison__talbe .p-table__heading div {
  position: relative;
  padding-top: 12.2rem;
  padding-bottom: 1.9rem;
  color: #1e1a1a;
}
.p-comparison__talbe .p-table__heading div .c-ttl {
  font-family: "Noto Serif JP", serif;
  text-align: center;
  font-size: 1.8rem;
  line-height: 1.3333333333;
}
@media screen and (max-width: 767.98px) {
  .p-comparison__talbe .p-table__heading div .c-ttl {
    font-size: 2.5rem;
  }
}
.p-comparison__talbe .p-table__heading div figure {
  position: absolute;
  right: 0;
  margin-inline: auto;
}
.p-comparison__talbe .product01 figure {
  width: 22.2rem;
  top: -8.6rem;
  left: 1rem;
}
@media screen and (max-width: 767.98px) {
  .p-comparison__talbe .product01 figure {
    width: 16rem;
    top: -4.6rem;
  }
}
@media screen and (max-width: 767.98px) {
  .p-comparison__talbe .product01 .c-ttl {
    position: relative;
    top: 0.5em;
  }
}
.p-comparison__talbe .product02 figure {
  width: 12rem;
  top: -7.3rem;
  left: 1.7rem;
}
@media screen and (max-width: 767.98px) {
  .p-comparison__talbe .product02 figure {
    width: 9rem;
    top: -3.6rem;
  }
}
@media screen and (max-width: 767.98px) {
  .p-comparison__talbe .product02 .c-ttl {
    position: relative;
    top: 0.5em;
  }
}
.p-comparison__talbe .product03 figure {
  width: 12.7rem;
  top: -7.6rem;
  left: 1.9rem;
}
@media screen and (max-width: 767.98px) {
  .p-comparison__talbe .product03 figure {
    width: 9rem;
    top: -3.6rem;
  }
}
.p-comparison__talbe .p-padding td {
  padding-block: 0.6rem;
}
@media screen and (max-width: 767.98px) {
  .p-comparison__talbe .p-padding td {
    padding-block: 4rem;
  }
}
.p-comparison__talbe .p-tablet div {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: center;
  -moz-column-gap: 3rem;
       column-gap: 3rem;
}
@media screen and (max-width: 767.98px) {
  .p-comparison__talbe .p-tablet div {
    flex-direction: column;
  }
}
.p-comparison__talbe .p-tablet figure {
  width: 7.2rem;
}
@media screen and (max-width: 767.98px) {
  .p-comparison__talbe .p-tablet figure {
    width: 9.5rem;
  }
}
.p-comparison__talbe .p-tablet p {
  line-height: 1.75;
}
@media screen and (max-width: 767.98px) {
  .p-comparison__talbe .p-tablet p {
    line-height: 1.2;
    text-align: center;
    margin-top: 2rem;
  }
}
.p-comparison__talbe + .c-note {
  text-align: center;
  font-size: 80%;
}
@media screen and (max-width: 767.98px) {
  .p-comparison__talbe + .c-note {
    font-size: 1.9rem;
    margin-top: 1rem;
  }
}

.p-materials {
  background-image: url(../img/bg_support.png), url(../img/bg_cercle.png);
  background-color: #f7f7e2;
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 100% auto, 91.4rem 61.6rem;
  padding-top: 18vw;
  padding-bottom: 3.5rem;
  position: relative;
}
@media screen and (max-width: 767.98px) {
  .p-materials {
    background-image: url(../img/bg_support_sp.png), url(../img/bg_cercle.png);
    background-position: top center, top -6rem center;
    background-size: 100% auto, 100% auto;
    padding: 20.8rem 3.5rem 8.8rem;
  }
}
.p-materials .c-note {
  text-align: right;
  font-size: 1.2rem;
  position: absolute;
  right: 2rem;
  top: 20vw;
}
@media screen and (max-width: 767.98px) {
  .p-materials .c-note {
    font-size: 1.4rem;
    text-align: center;
    left: 0;
    right: 0;
    top: 14rem;
  }
}
.p-materials p {
  text-align: center;
  font-size: 2.2rem;
  line-height: 2.3;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 767.98px) {
  .p-materials p {
    font-size: 2.8rem;
    line-height: 1.7857142857;
    text-align: justify;
    padding-inline: 1rem;
  }
}
@media screen and (max-width: 767.98px) {
  .p-materials p + p {
    margin-top: 2em;
  }
}

.p-materials__ttl {
  text-align: center;
  color: #4f3712;
  font-weight: 700;
  font-family: "Noto Serif JP", serif;
  font-size: 7rem;
  letter-spacing: 0.07em;
  line-height: 1.2857142857;
  margin-bottom: 3.5rem;
}
@media screen and (max-width: 767.98px) {
  .p-materials__ttl {
    font-size: 5.2rem;
    margin-bottom: 10.4rem;
  }
}
.p-materials__ttl span {
  font-size: 4.5rem;
  letter-spacing: -0.05em;
}
@media screen and (max-width: 767.98px) {
  .p-materials__ttl span {
    font-size: 4rem;
  }
}
.p-materials__ttl span span {
  font-size: 70%;
}

.p-materials__content {
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
  margin-top: 4rem;
  padding-left: 8.4rem;
}
@media screen and (max-width: 767.98px) {
  .p-materials__content {
    display: block;
    padding-left: 0;
  }
}
.p-materials__content .p-txt-wrapper {
  margin-left: 9rem;
  margin-top: 2.7rem;
}
@media screen and (max-width: 767.98px) {
  .p-materials__content .p-txt-wrapper {
    margin: 0;
  }
}
.p-materials__content .p-txt-wrapper p {
  font-family: "Noto Serif JP", serif;
  text-align: center;
}
.p-materials__content .p-txt-wrapper .c-sub {
  font-weight: 500;
  font-size: 3.6rem;
  position: relative;
}
@media screen and (max-width: 767.98px) {
  .p-materials__content .p-txt-wrapper .c-sub {
    font-size: 4.1rem;
  }
}
.p-materials__content .p-txt-wrapper .c-sub::before, .p-materials__content .p-txt-wrapper .c-sub::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 2px;
  background-color: #1e1a1a;
  top: 50%;
}
@media screen and (max-width: 767.98px) {
  .p-materials__content .p-txt-wrapper .c-sub::before, .p-materials__content .p-txt-wrapper .c-sub::after {
    width: 1px;
  }
}
.p-materials__content .p-txt-wrapper .c-sub::before {
  left: -2.1rem;
  transform: rotate(-30deg) translateY(-50%);
}
.p-materials__content .p-txt-wrapper .c-sub::after {
  right: -0.9rem;
  transform: rotate(30deg) translateY(-50%);
}
.p-materials__content .p-txt-wrapper .c-main {
  font-weight: 700;
  font-size: 5.3rem;
  line-height: 1.3396226415;
  color: #4f3712;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 767.98px) {
  .p-materials__content .p-txt-wrapper .c-main {
    font-size: 5.4rem;
    white-space: nowrap;
    letter-spacing: 0.05em;
  }
}
.p-materials__content .p-img-wrapper {
  width: 40.2rem;
  flex-shrink: 0;
}
@media screen and (max-width: 767.98px) {
  .p-materials__content .p-img-wrapper {
    width: 55.4rem;
    margin: 3rem auto 0;
  }
}

.p-buy {
  background: url(../img/bg_buy.jpg) no-repeat top center/cover;
  padding-top: 9.5rem;
}
@media screen and (max-width: 767.98px) {
  .p-buy {
    padding-inline: 3.5rem;
  }
}
.p-buy .p-products {
  background: transparent;
  padding-top: 6.7rem;
}
@media screen and (max-width: 767.98px) {
  .p-buy .p-products {
    padding-inline: 0;
  }
}
.p-buy .c-txt {
  font-size: 2rem;
  font-weight: 500;
  text-align: center;
  line-height: 1.75;
  letter-spacing: 0.1em;
  font-weight: 700;
}
.p-buy .c-txt + .c-txt {
  margin-top: 1.4em;
}
@media screen and (max-width: 767.98px) {
  .p-buy .c-txt {
    font-size: 2.8rem;
    line-height: 1.7857142857;
    letter-spacing: 0.05em;
  }
}
.p-buy .c-section__ttl {
  letter-spacing: 0.05em;
}
.p-buy .c-section__ttl + .c-txt {
  margin-top: 8.2rem;
}

.p-buy-flow {
  background-color: #fff;
  border-radius: 1rem;
  width: 84rem;
  margin: 3.7rem auto 0;
  box-shadow: 4px 3px 0px 0px #e6e0d2;
  padding: 2.7rem 4rem 2.2rem;
}
@media screen and (max-width: 767.98px) {
  .p-buy-flow {
    width: auto;
    padding: 3.2rem 4.5rem 3.9rem;
    box-shadow: 3px 2px 0px 0px #e6e0d2;
  }
}
.p-buy-flow .c-ttl {
  font-size: 2.4rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 767.98px) {
  .p-buy-flow .c-ttl {
    font-size: 3.6rem;
  }
}
.p-buy-flow .c-ttl::before, .p-buy-flow .c-ttl::after {
  content: "";
  border-top: 1px solid #1e1a1a;
  flex-grow: 1;
  margin-top: 0.5rem;
}
.p-buy-flow .c-ttl::before {
  margin-right: 4rem;
}
.p-buy-flow .c-ttl::after {
  margin-left: 4rem;
}
.p-buy-flow ol {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 3rem auto 0;
}
.p-buy-flow ol .u-min {
  color: #fff;
  background-color: #a81420;
  width: 2.9rem;
  height: 2.9rem;
  display: grid;
  place-content: center;
  font-weight: 600;
  line-height: 1;
  font-size: 1.5rem;
  flex-shrink: 0;
}
@media screen and (max-width: 767.98px) {
  .p-buy-flow ol .u-min {
    font-size: 2.9rem;
    width: 5.6rem;
    height: 5.6rem;
  }
}
.p-buy-flow li {
  display: flex;
  font-size: 1.8rem;
  line-height: 1.4285714286;
  -moz-column-gap: 1rem;
       column-gap: 1rem;
  align-items: center;
}
@media screen and (max-width: 767.98px) {
  .p-buy-flow li {
    font-size: 2.8rem;
    -moz-column-gap: 1.8rem;
         column-gap: 1.8rem;
  }
}
.p-buy-flow li + li {
  margin-top: 1.1rem;
}
@media screen and (max-width: 767.98px) {
  .p-buy-flow li + li {
    margin-top: 3.3rem;
  }
}
.p-buy-flow + .c-txt {
  margin-top: 3rem;
}
@media screen and (max-width: 767.98px) {
  .p-buy-flow + .c-txt {
    margin-top: 5.4rem;
  }
}

.p-voice {
  padding-block: 9.5rem;
  background: url(../img/bg_voice.jpg) no-repeat top center/100% 100%;
}
@media screen and (max-width: 767.98px) {
  .p-voice {
    padding: 8.2rem 3.5rem;
  }
}
.p-voice .c-note {
  font-size: 1.6rem;
  margin-top: 3.4rem;
  letter-spacing: 0.02em;
  line-height: 2.1875;
}

.p-voice__list {
  margin-top: 10.6rem;
}
@media screen and (max-width: 767.98px) {
  .p-voice__list {
    margin-top: 5.6rem;
  }
}

.p-vice__item {
  display: flex;
  -moz-column-gap: 6.1rem;
       column-gap: 6.1rem;
  background-color: #fff;
  padding: 5.7rem 5.8rem 1.4rem 4.7rem;
  border-radius: 1rem;
  filter: drop-shadow(0px 0px 6px rgba(0, 0, 0, 0.2));
  min-height: 34.6rem;
}
@media screen and (max-width: 767.98px) {
  .p-vice__item {
    display: block;
    padding: 6rem 3rem 6rem 3.5rem;
  }
}
.p-vice__item + .p-vice__item {
  margin-top: 4rem;
}

.p-voice__body {
  flex-grow: 1;
}
.p-voice__body .c-txt {
  font-size: 1.8rem;
  line-height: 1.9444444444;
  letter-spacing: 0.14em;
  font-weight: 400;
  text-align: justify;
}
@media screen and (max-width: 767.98px) {
  .p-voice__body .c-txt {
    font-size: 2.8rem;
    line-height: 1.7857142857;
  }
}

.c-voice__ttl {
  font-family: "Noto Serif JP", serif;
  font-size: 3rem;
  font-weight: 700;
  border-bottom: 1px solid #1e1a1a;
  letter-spacing: 0.05em;
  padding-bottom: 2rem;
  margin-bottom: 2rem;
}
@media screen and (max-width: 767.98px) {
  .c-voice__ttl {
    font-size: 4.6rem;
    line-height: 1.3043478261;
  }
}

.c-attribute {
  font-size: 1.8rem;
  font-weight: 700;
  background-color: #1e1a1a;
  color: #fff;
  display: inline-block;
  margin-top: 1.5rem;
  padding: 0.2rem 1.4rem;
}
@media screen and (max-width: 767.98px) {
  .c-attribute {
    margin-top: 2.5rem;
    font-size: 2.5rem;
  }
}

.p-repeat {
  display: flex;
  margin-top: 7rem;
  margin-left: 4rem;
}
@media screen and (max-width: 767.98px) {
  .p-repeat {
    margin-top: 5rem;
    margin-left: 0;
    display: block;
  }
}
.p-repeat .p-img-wrapper {
  width: 28.9rem;
  flex-shrink: 0;
  margin-right: 5rem;
}
@media screen and (max-width: 767.98px) {
  .p-repeat .p-img-wrapper {
    width: 40rem;
    margin-inline: auto;
  }
}
@media screen and (max-width: 767.98px) {
  .p-repeat .p-txt-wrapper {
    padding-inline: 3rem;
    margin-top: 3rem;
  }
}
.p-repeat .p-txt-wrapper .c-ttl {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  font-family: "Noto Serif JP", serif;
  font-weight: 600;
  font-size: 5.8rem;
  color: #fff;
  background: url(../img/bg_fukidashi.png) no-repeat center center/100% 100%;
  letter-spacing: 0.05em;
  padding: 1.5rem 1rem 3.5rem 4rem;
  margin-bottom: 3rem;
}
@media screen and (max-width: 767.98px) {
  .p-repeat .p-txt-wrapper .c-ttl {
    text-align: center;
    width: auto;
    margin-bottom: 2rem;
  }
}
.p-repeat .p-txt-wrapper p {
  font-size: 1.8rem;
  letter-spacing: 0.15em;
}
@media screen and (max-width: 767.98px) {
  .p-repeat .p-txt-wrapper p {
    font-size: 2.8rem;
    letter-spacing: 0.05em;
  }
}
.p-repeat .p-txt-wrapper p.c-note {
  margin-top: 1em;
  font-size: 1.4rem;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 767.98px) {
  .p-repeat .p-txt-wrapper p.c-note {
    font-size: 1.6rem;
    letter-spacing: 0;
  }
}

.p-voice__img-wrapper {
  width: 22rem;
  flex-shrink: 0;
  margin-top: 0.5rem;
}
@media screen and (max-width: 767.98px) {
  .p-voice__img-wrapper {
    width: 30rem;
    margin: 0 auto;
  }
}

.p-faq {
  padding-top: 10rem;
  padding-bottom: 9.7rem;
}
@media screen and (max-width: 767.98px) {
  .p-faq {
    padding: 8.5rem 3.5rem 8rem;
  }
}

.p-faq__block {
  margin-top: 7.7rem;
  background-color: #f7f7e2;
  padding-inline: 4rem;
}
.p-faq__block .c-icn {
  font-size: 2.1rem;
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  width: 3.7rem;
  height: 3.7rem;
  display: grid;
  place-content: center;
  border-radius: 100vw;
  color: #fff;
  padding-bottom: 0.3rem;
  margin-right: 1.7rem;
  position: relative;
  flex-shrink: 0;
}
.p-faq__block + .p-faq__block {
  margin-top: 3rem;
}

.p-faq__btn {
  background-color: transparent;
  text-align: left;
  display: block;
  padding: 0;
  cursor: pointer;
  width: 100%;
  position: relative;
  padding: 2rem 4.2rem 2rem 0;
  letter-spacing: 0.05em;
}
@media (any-hover) {
  .p-faq__btn {
    transition: 0.3s;
  }
  .p-faq__btn:hover {
    opacity: 0.7;
  }
}
@media screen and (max-width: 767.98px) {
  .p-faq__btn.u-sp-pr {
    padding-right: 8rem;
  }
}
.p-faq__btn.is-open::after {
  top: 3.8rem;
  transform: rotate(-45deg);
}
.p-faq__btn::before, .p-faq__btn::after {
  content: "";
  position: absolute;
}
.p-faq__btn::before {
  background-color: #1e1a1a;
  width: 3.5rem;
  height: 3.5rem;
  right: 0;
  top: 2.4rem;
}
.p-faq__btn::after {
  width: 1.2rem;
  height: 1.2rem;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  right: 1rem;
  transform: rotate(135deg);
  top: 3.2rem;
  transition: 0.3s transform, 0.3s top;
}
@media screen and (max-width: 767.98px) {
  .p-faq__btn::after {
    border-width: 1px;
  }
}

.p-question__txt {
  font-size: 2.6rem;
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.3333333333;
}
@media screen and (max-width: 767.98px) {
  .p-question__txt {
    font-size: 3rem;
  }
}

.p-faq__question .c-icn {
  background-color: #a81420;
}

.p-faq__answer {
  display: none;
  padding: 1.8rem 0 3rem;
  border-top: 1px solid #1e1a1a;
}
.p-faq__answer .c-icn {
  background-color: #1e1a1a;
  top: 0;
}
@media screen and (max-width: 767.98px) {
  .p-faq__answer .c-icn {
    top: 0.8rem;
  }
}

.p-faq__row {
  display: flex;
}

.p-answer__txt {
  font-size: 1.8rem;
  line-height: 1.9444444444;
  letter-spacing: 0.1em;
  text-align: justify;
}
@media screen and (max-width: 767.98px) {
  .p-answer__txt {
    font-size: 2.8rem;
    line-height: 1.7857142857;
    letter-spacing: -0.03em;
  }
}

.p-message {
  background: url(../img/bg_message.jpg) no-repeat top center/cover;
  padding-block: 9.7rem 10rem;
}
@media screen and (max-width: 767.98px) {
  .p-message {
    padding: 9.6rem 3.5rem 10rem;
    background-image: url(../img/bg_message_sp.jpg);
  }
}

.p-message__content {
  max-width: 100rem;
  margin-inline: auto;
  background-color: rgba(255, 255, 255, 0.9);
  border-radius: 1rem;
  padding: 5.6rem 5.6rem 6.4rem;
}
@media screen and (max-width: 767.98px) {
  .p-message__content {
    padding: 5.6rem 5rem;
  }
}
.p-message__content p {
  font-size: 2.2rem;
  line-height: 2.2727272727;
  text-align: center;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-break: strict;
}
@media screen and (max-width: 767.98px) {
  .p-message__content p {
    font-size: 2.8rem;
    line-height: 1.7857142857;
    text-align: left;
    font-feature-settings: "palt";
    letter-spacing: 0.02em;
  }
}
.p-message__content p + p {
  margin-top: 2.3em;
}

.c-message__ttl {
  font-size: 5.4rem;
  font-weight: 600;
  text-align: center;
  font-family: "Noto Serif JP", serif;
  border-bottom: 1px solid #1e1a1a;
  letter-spacing: 0.06em;
  padding-bottom: 3.3rem;
  margin-bottom: 4.5rem;
}
@media screen and (max-width: 767.98px) {
  .c-message__ttl {
    font-size: 4rem;
    margin-bottom: 3rem;
  }
}

.c-btn.-round {
  border-radius: 9999px;
  min-height: 7rem;
  background-color: #d71d34;
  letter-spacing: 0;
}
@media screen and (max-width: 767.98px) {
  .c-btn.-round {
    min-height: 8.4rem;
  }
}

.c-btn {
  font-size: 2.2rem;
  font-weight: 700;
  display: grid;
  place-content: center;
  text-decoration: none;
  position: relative;
  color: #fff;
  letter-spacing: 0.06em;
}
@media (any-hover) {
  .c-btn {
    transition: 0.3s;
  }
  .c-btn:hover {
    opacity: 0.7;
  }
}
@media screen and (max-width: 767.98px) {
  .c-btn {
    font-size: 3.25rem;
  }
}
.c-btn::before {
  content: "";
  position: absolute;
  width: 1.5rem;
  height: 1.5rem;
  background: url(../img/icn_arrow.svg) no-repeat center center/contain;
  right: 2rem;
  top: 50%;
  transform: translateY(-50%);
}
@media screen and (max-width: 767.98px) {
  .c-btn::before {
    width: 1.8rem;
    height: 1.8rem;
    right: 4rem;
  }
}

.c-btn.-square {
  background-color: #1e1a1a;
  border-radius: 0.5rem;
  min-height: 5rem;
  box-shadow: 0px 3px 0px 0px #e5e5e5;
}
@media screen and (max-width: 767.98px) {
  .c-btn.-square {
    min-height: 8.4rem;
  }
}

.p-cta {
  background: linear-gradient(-60deg, rgb(213, 168, 80) 0%, rgb(255, 212, 88) 48%, rgba(213, 168, 80, 0.97) 100%);
  padding-block: 4rem;
}
@media screen and (max-width: 767.98px) {
  .p-cta {
    padding: 5.5rem 3.5rem 4.7rem;
  }
}

.p-cta__content {
  background: url(../img/frame.png) no-repeat center center/100% 100%;
  padding-block: 5.5rem 6rem;
}
@media screen and (max-width: 767.98px) {
  .p-cta__content {
    background-image: url(../img/frame_sp.png);
    padding-top: 6rem;
    padding-bottom: 7.4rem;
  }
}
.p-cta__content .p-btn-wrapper {
  max-width: 57.6rem;
  margin: 2.3rem auto 0;
}
@media screen and (max-width: 767.98px) {
  .p-cta__content .p-btn-wrapper {
    margin-top: 3rem;
  }
}
.p-cta__content .p-btn-wrapper .c-btn {
  min-height: 8rem;
}
@media screen and (max-width: 767.98px) {
  .p-cta__content .p-btn-wrapper .c-btn {
    letter-spacing: 0;
  }
  .p-cta__content .p-btn-wrapper .c-btn::before {
    right: 2.4rem;
  }
}

.p-cta__ttl {
  text-align: center;
  line-height: 1;
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}
@media screen and (max-width: 767.98px) {
  .p-cta__ttl {
    line-height: 1.6;
  }
}
.p-cta__ttl::before, .p-cta__ttl::after {
  content: "";
  position: absolute;
  height: 110%;
  width: 2px;
  background-color: #1e1a1a;
  top: 67%;
}
@media screen and (max-width: 767.98px) {
  .p-cta__ttl::before, .p-cta__ttl::after {
    width: 1px;
    top: 50%;
    height: 90%;
  }
}
.p-cta__ttl::before {
  left: -4rem;
  transform: rotate(-30deg) translateY(-50%);
}
@media screen and (max-width: 767.98px) {
  .p-cta__ttl::before {
    left: -2rem;
    transform: rotate(-25deg) translateY(-50%);
  }
}
.p-cta__ttl::after {
  right: -2rem;
  transform: rotate(30deg) translateY(-50%);
}
@media screen and (max-width: 767.98px) {
  .p-cta__ttl::after {
    right: -1rem;
    transform: rotate(20deg) translateY(-50%);
  }
}
.p-cta__ttl .u-gothic {
  font-size: 4.9rem;
  font-weight: 700;
  color: #fff;
  background-color: #1e1a1a;
  padding: 0 1rem 0.3rem 1.5rem;
  line-height: 1;
  letter-spacing: 0.1em;
}
.p-cta__ttl .u-min {
  font-size: 4.1rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  display: inline-block;
  margin-left: 0.5rem;
}
@media screen and (max-width: 767.98px) {
  .p-cta__ttl .u-min {
    display: inline;
    font-size: 4.19rem;
  }
}

.p-set {
  display: flex;
  margin-top: 3.7rem;
  -moz-column-gap: 2.9rem;
       column-gap: 2.9rem;
  margin-left: 9rem;
}
@media screen and (max-width: 767.98px) {
  .p-set {
    display: block;
    margin-left: 0;
    margin-top: 2rem;
  }
}
.p-set .p-img-wrapper {
  width: 44.3rem;
  flex-shrink: 0;
}
@media screen and (max-width: 767.98px) {
  .p-set .p-img-wrapper {
    width: 50.5rem;
    margin-inline: auto;
  }
}
.p-set p {
  font-size: 2rem;
  line-height: 2.5;
  letter-spacing: 0.1em;
  font-weight: 700;
}
@media screen and (max-width: 767.98px) {
  .p-set p {
    font-size: 2.8rem;
    text-align: center;
    line-height: 1.7857142857;
    letter-spacing: 0.05em;
  }
}
.p-set .p-txt-wrapper {
  margin-top: 4.4rem;
}
@media screen and (max-width: 767.98px) {
  .p-set .p-txt-wrapper {
    margin-top: 1rem;
  }
}

.p-sulforaphane {
  background: url(../img/bg_sulforaphane.jpg) no-repeat top center/cover;
  padding-block: 7.7rem;
}
@media screen and (max-width: 767.98px) {
  .p-sulforaphane {
    padding-inline: 3.5rem;
    padding-block: 8rem;
  }
}
.p-sulforaphane .c-note.-note02 {
  margin-top: 4.3rem;
  font-size: 1.8rem;
  line-height: 1.9444444444;
  letter-spacing: 0.065em;
  text-align: justify;
}
@media screen and (max-width: 767.98px) {
  .p-sulforaphane .c-note.-note02 {
    font-size: 1.8rem;
    margin-top: 5.7rem;
  }
}

.p-sulforaphane__block {
  max-width: 90.7rem;
  margin-inline: auto;
  border-radius: 2.5rem;
  border: 3px solid #d4b987;
  overflow: hidden;
  background-color: #fff;
}
@media screen and (max-width: 767.98px) {
  .p-sulforaphane__block {
    border-width: 2px;
  }
}
.p-sulforaphane__block .c-ttl {
  text-align: center;
  border-radius: calc(2.5rem - 3px) calc(2.5rem - 3px) 0 0;
  color: #fff;
  font-family: "Noto Serif JP", serif;
  font-size: 3.38rem;
  background-color: #11391d;
  padding: 2rem 1rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  border-bottom: 3px solid #d4b987;
}
@media screen and (max-width: 767.98px) {
  .p-sulforaphane__block .c-ttl {
    border-width: 2px;
  }
}

.p-sulforaphane__content {
  display: flex;
  padding: 3rem 4.8rem 0.6rem 5.5rem;
}
@media screen and (max-width: 767.98px) {
  .p-sulforaphane__content {
    padding: 2rem 4rem 2rem 2rem;
  }
}
.p-sulforaphane__content .p-img-wrapper {
  width: 27.7rem;
  flex-shrink: 0;
}
@media screen and (max-width: 767.98px) {
  .p-sulforaphane__content .p-img-wrapper {
    width: 19.9rem;
  }
}
.p-sulforaphane__content .p-txt-wrapper {
  margin-top: 4.4rem;
}
@media screen and (max-width: 767.98px) {
  .p-sulforaphane__content .p-txt-wrapper {
    margin-top: 1rem;
  }
}
.p-sulforaphane__content .c-aside {
  font-size: 2rem;
  border: 1px solid #1e1a1a;
  display: inline-block;
  margin-left: 1.5rem;
  padding: 0.6rem 1.5rem;
  line-height: 1;
  font-weight: 700;
}
.p-sulforaphane__content .c-ingredient {
  font-size: 1.9rem;
  background-color: #e6e6e6;
  padding: 1rem;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: 1.5rem;
  margin-top: 3.7rem;
  letter-spacing: 0.12em;
  font-weight: 500;
}
@media screen and (max-width: 767.98px) {
  .p-sulforaphane__content .c-ingredient {
    margin-top: 2rem;
    font-size: 2rem;
    line-height: 1.45;
  }
}

.p-alt {
  display: flex;
  margin-top: 6.4rem;
  justify-content: center;
  background: url(../img/bg_ttl2.svg) no-repeat calc(50% + 11rem) calc(50% + 5rem)/66.9rem 16.3rem;
}
@media screen and (max-width: 767.98px) {
  .p-alt {
    background: url(../img/bg_ttl2.svg) no-repeat calc(50% + 8rem) calc(50% + 5rem)/48.9rem 12.3rem;
  }
}
.p-alt .c-txt {
  font-family: "Noto Serif JP", serif;
  font-size: 5rem;
  line-height: 1.66;
  font-weight: 600;
  letter-spacing: 0;
  position: relative;
}
@media screen and (max-width: 767.98px) {
  .p-alt .c-txt {
    font-size: 4.1rem;
    line-height: 1.6341463415;
  }
}
.p-alt .c-txt::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  background-color: #1e1a1a;
  top: 100%;
  filter: drop-shadow(0px 0px 3px #ffffff) drop-shadow(0px 0px 3px #ffffff) drop-shadow(0px 0px 3px #ffffff) drop-shadow(0px 0px 3px #ffffff) drop-shadow(0px 0px 3px #ffffff);
}
@media screen and (max-width: 767.98px) {
  .p-alt .c-txt::before {
    height: 1px;
    filter: drop-shadow(0px 0px 3px #ffffff) drop-shadow(0px 0px 3px #ffffff);
  }
}
.p-alt .c-txt .u-txtsize--large {
  font-size: 130%;
  letter-spacing: -0.1em;
  line-height: 1.2;
  display: inline-block;
  margin-right: 1.2rem;
}
.p-alt .c-note {
  font-weight: 700;
  font-size: 2rem;
  text-align: right;
}
.p-alt .p-txt-wrapper {
  text-shadow: 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255);
}
@media screen and (max-width: 767.98px) {
  .p-alt .p-txt-wrapper {
    text-shadow: 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255), 0px 0px 10px rgb(255, 255, 255);
  }
}
.p-alt .p-img-wrapper {
  margin-top: -2rem;
  margin-left: -4rem;
  margin-right: -1.2rem;
  width: 25rem;
}
@media screen and (max-width: 767.98px) {
  .p-alt .p-img-wrapper {
    width: 21rem;
  }
}

.p-sulforaphane-tablet {
  margin-top: 1rem;
  position: relative;
}
.p-sulforaphane-tablet .p-img-wrapper {
  position: absolute;
  top: 4.1rem;
  left: calc(50% + 14rem);
  width: 20.1rem;
  z-index: 10;
}
@media screen and (max-width: 767.98px) {
  .p-sulforaphane-tablet .p-img-wrapper {
    top: 5rem;
    left: calc(50% + 9rem);
    width: 18.9rem;
  }
}
.p-sulforaphane-tablet .c-txt-main {
  text-align: center;
  font-family: "Noto Serif JP", serif;
  font-weight: 600;
  font-size: 6rem;
  line-height: 1.3333333333;
  letter-spacing: 0.05em;
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}
@media screen and (max-width: 767.98px) {
  .p-sulforaphane-tablet .c-txt-main {
    font-size: 4.7rem;
    letter-spacing: 0.02em;
  }
}
.p-sulforaphane-tablet .c-txt-main::before, .p-sulforaphane-tablet .c-txt-main::after {
  height: 90%;
  width: 3px;
  background-color: #1e1a1a;
  position: absolute;
  content: "";
  top: 59%;
}
@media screen and (max-width: 767.98px) {
  .p-sulforaphane-tablet .c-txt-main::before, .p-sulforaphane-tablet .c-txt-main::after {
    width: 2px;
  }
}
.p-sulforaphane-tablet .c-txt-main::before {
  left: -7rem;
  transform: translateY(-50%) rotate(-30deg);
}
.p-sulforaphane-tablet .c-txt-main::after {
  right: -6.2rem;
  transform: translateY(-50%) rotate(30deg);
}
.p-sulforaphane-tablet .c-txt-main .u-txtsize--large {
  font-size: 140%;
  font-weight: 700;
}

.c-balloon {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  font-weight: 700;
  font-size: 2.3rem;
  color: #fff;
  background-color: #153a0f;
  line-height: 1;
  margin-inline: auto;
  letter-spacing: 0.1em;
  padding: 0.7rem 2.1rem 1.6rem 2.4rem;
  position: relative;
}
@media screen and (max-width: 767.98px) {
  .c-balloon {
    text-align: center;
    font-size: 2.6rem;
    padding-inline: 4rem;
  }
}
.c-balloon::after {
  content: "";
  position: absolute;
  left: 50%;
  top: calc(100% - 1px);
  width: 1.6rem;
  height: 1.6rem;
  -webkit-clip-path: polygon(0 0, 50% 100%, 100% 0);
          clip-path: polygon(0 0, 50% 100%, 100% 0);
  background-color: #153a0f;
  transform: translateX(-50%);
}
.c-balloon .u-txtsize--large {
  font-size: 140%;
}
.c-balloon .u-txtsize--small {
  font-size: 70%;
}

#l-footer {
  background-color: #1e1a1a;
  text-align: center;
  padding-block: 3rem 3rem;
}

.c-copyright {
  color: #fff;
  font-weight: 700;
  font-size: 1.4rem;
  letter-spacing: 0.1em;
}
/*# sourceMappingURL=style.css.map */