html {
  font-size: calc((100 / 750) * 1vw);
}

@media screen and (min-width: 750px) {
  html {
    font-size: 1px;
  }
}

body {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
  color: #000;
}

.l-container {
  max-width: 750rem;
  margin: auto;
  background-color: #fff;
}

img,
video {
  width: 100%;
  display: block;
}

a {
  text-decoration: none;
}

.trans {
  transition: all 0.3s ease;
}

.trans:hover {
  opacity: 0.8;
}

.flexcol {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.txt-red {
  color: #e60012;
}

.title-common {
  font-weight: 500;
  text-align: center;
  font-family: "M PLUS Rounded 1c", sans-serif;
}

.title-common .title-small {
  display: block;
  font-size: 45rem;
  line-height: calc(66.1 / 45);
  margin-bottom: -2rem;
}

.title-common .title-large {
  display: block;
  font-size: 60.4rem;
  line-height: calc(82 / 60.4);
}


.slick-arrow {
  width: 40rem;
  height: 52rem;
  position: absolute;
  top: 50%;
  margin-top: -46rem;
  z-index: 3;
  font-size: 0;
  background: url("../img/arrow.png") no-repeat center 100% / 100%;
}

.slick-arrow.slick-prev {
  left: 20rem;
  transform: rotate(180deg);
}

.slick-arrow.slick-next {
  right: 17rem;
}

.slick-dots {
  display: flex;
  justify-content: center;
  margin-top: 17rem;
}

.slick-dots > li {
  position: relative;
  display: inline-block;
  padding: 0;
  cursor: pointer;
  background-color: #969696;
  width: 13rem;
  height: 13rem;
  border-radius: 100%;
  margin: 0 10rem;
  font-size: 0;
}

.slick-dots > li.slick-active {
  background-color: #e60012;
}

.fv h1 {
  position: relative;
  margin-bottom: -55rem;
}

.cta .cta-inner {
  background-color: #e60012;
  padding: 27rem 8rem 8px;
}

.cta h2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 800;
  margin-bottom: 23rem;
}

.cta .ttl-sub {
  color: #e60012;
  background-color: #fff;
  font-size: 30rem;
  letter-spacing: 0.03em;
  line-height: calc(54.4 / 30);
  padding: 1rem 40rem;
  border-radius: 6rem;
  margin-bottom: 17rem;
  position: relative;
}

.cta .ttl-sub::after {
  content: "";
  position: absolute;
  bottom: -12rem;
  left: 50%;
  transform: translateX(-50%);
  border-left: 18rem solid transparent;
  border-right: 18rem solid transparent;
  border-top: 24rem solid #fff;
}

.cta .ttl-main {
  color: #ffe8be;
  font-size: 50rem;
  letter-spacing: 0.06em;
  line-height: calc(73.6 / 50);
  width: 556rem;
}

.cta .cta-content {
  background-color: #fff;
  padding: 35rem 14rem 13px;
}

.cta-trial {
  display: flex;
  justify-content: space-between;
  margin-bottom: 16em;
}

.cta-trial figure {
  width: 272rem;
}

.trial-price {
  width: 422rem;
}

.cta h3 {
  color: #e60012;
  font-size: 30rem;
  letter-spacing: 0.01em;
  line-height: calc(54.4 / 30);
  font-weight: 500;
  margin-bottom: 20rem;
}

.cta-btn {
  display: block;
  width: 635rem;
  margin: 0 auto 32rem;
  border-radius: 56.5rem;
  text-align: center;
  background-color: #e60012;
  color: #fff;
  font-weight: 800;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 40rem;
  letter-spacing: 0.02em;
  line-height: calc(73.6 / 40);
  position: relative;
  padding: 18rem 50rem 18rem 150rem;
  border: 2rem solid #e60012;
  transition: all 0.3s ease;
}

.cta-btn:hover {
  background-color: #fff;
  color: #e60012;
  transform: scale(1.02);
}

.cta-btn .balloon {
  font-size: 38.83rem;
  letter-spacing: 00;
  line-height: 1;
  background-color: #00a1ea;
  color: #fff;
  border-radius: 100%;
  width: 140rem;
  height: 140rem;
  padding-bottom: 10rem;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 27rem;
  top: 50%;
  transform: translateY(-50%);
}

.cta-note {
  display: grid;
  align-items: flex-start;
  grid-template-columns: repeat(4, 1fr);
  gap: 7rem 6rem;
  padding: 0 13rem;
}

.cta-note li {
  background-color: #ffe5db;
  font-size: 18rem;
  line-height: calc(22 / 18);
  border-radius: 8rem;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 7rem;
}

.cta-note li:nth-child(1) {
  font-size: 37rem;
  line-height: calc(44 / 37);
  letter-spacing: 0.04em;
  grid-area: 1 / 1 / 3 / 3;
  padding: 10rem;
}

.cta-note li:nth-child(2) {
  font-size: 25rem;
  letter-spacing: 0.01em;
  line-height: calc(34 / 25);
  grid-area: 1 / 3 / 2 / 5;
  padding: 5rem;
}

.cta-note li:nth-child(3) {
  grid-area: 2 / 3 / 3 / 4;
}

.cta-note li:nth-child(4) {
  grid-area: 2 / 4 / 3 / 5;
}

.cta-delivery {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 17rem;
  line-height: calc(22.92 / 17);
  text-align: center;
  margin-top: 6rem;
  letter-spacing: -0.05em;
}

.cta-menu {
  padding: 20rem 0 24rem;
  background: url("../img/menu_bg.png") repeat-y center top / 100%;
}

.cta-menu .slick {
  font-family: "M PLUS Rounded 1c", sans-serif;
  padding: 0 36rem 0 38rem;
}

.cta-menu h2 {
  width: 710rem;
  margin: 0 auto 44rem;
}

.cta-menu .slick-slide {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  gap: 24rem 10rem;
}

.cta-menu .slick-item > div {
  width: 332rem;
}

.kitchen-logo {
  width: 270rem;
  margin-bottom: 38rem;
}

.kitchen {
  position: relative;
  padding: 80rem 0 158rem;
  background-color: #fff;
}

.kitchen::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -100rem;
  height: 965rem;
  background: url("../img/kitchen_bg.png") no-repeat center top / 100%;
  pointer-events: none;
}

.kitchen h2 {
  font-weight: 500;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 43rem;
  line-height: calc(61 / 43);
  text-align: center;
}

.point-number {
  font-family: "Sacramento", cursive;
  font-weight: 400;
  font-size: 80rem;
  line-height: 1;
  background-color: #e60012;
  color: #fff;
  border-radius: 57rem;
  width: 300rem;
  margin: 0 auto;
  display: block;
  text-align: center;
  padding: 28rem 20rem 6rem;
  position: relative;
  z-index: 1;
  margin-top: -60rem;
  margin-bottom: 48rem;
}

.point-item {
  position: relative;
}

.point-item:nth-child(odd){
  background-color: rgba(255, 229, 219, 0.5);
}

.point-item:not(:last-child) {
  padding-bottom: 70rem;
}

.point-item:nth-child(4) .point-text {
  margin-top: 30rem;
}

.point .point-inner {
  padding: 0 18rem;
  border-top: 7rem solid #e60012;
  position: relative;
}

.point-text {
  font-size: 30rem;
  letter-spacing: 0.06em;
  line-height: calc(47 / 30);
  text-align: center;
  margin-top: 45rem;
  font-feature-settings: "palt";
}

.point-use {
  width: 684rem;
  margin: 77rem 0 75rem 20rem;
}

.point .video_01 {
  margin: 8rem 0 12rem;
}

.point .video_02 {
  margin-bottom: 92rem;
}

.point-sidedish {
  margin-top: 50rem;
  position: relative;
}

.point-sidedish::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  height: 135rem;
  background: url("../img/rectangle.png") no-repeat center top / 100%;
}

.diet {
  background-color: #fff;
  display: flex;
  border-radius: 50rem;
  padding: 47rem 25rem 60rem 36rem;
  font-feature-settings: "palt";
  margin: 67rem 0 -4rem;
}

.diet-doctor {
  position: relative;
}

.diet-doctor::after {
  content: "";
  position: absolute;
  top: -79rem;
  right: -33rem;
  background: url("../img/seal.png") no-repeat center 100% / 100%;
  width: 142rem;
  height: 142rem;
}

.diet-doctor img {
  width: 298rem;
  height: 312rem;
  border-radius: 15rem;
  overflow: hidden;
  object-fit: cover;
  margin: 0 10rem 22rem auto;
}

.diet h3 {
  font-weight: 700;
  font-size: 40rem;
  line-height: calc(63 / 40);
  color: #e60012;
  position: relative;
  padding-bottom: 20rem;
  margin-bottom: 26rem;
}

.diet h3::after {
  content: "";
  position: absolute;
  background: repeating-linear-gradient(
    90deg,
    #e60012 0 8rem,
    transparent 8rem 12rem
  );
  left: 0;
  right: 22rem;
  bottom: 0;
  height: 2rem;
}

.diet .diet-info {
  font-size: 23rem;
  line-height: calc(47 / 23);
}

.diet-info p:not(:last-child) {
  margin-bottom: 47rem;
}

.diet .diet-doctor {
  width: 320rem;
  margin-top: 14rem;
  flex-shrink: 0;
}

.diet-doctor span {
  display: block;
  text-align: center;
}

.diet-doctor .doctor-name {
  font-size: 27rem;
  margin-bottom: 14rem;
}

.diet-doctor .doctor-info {
  font-size: 18rem;
  line-height: calc(26 / 18);
}

.diet-content {
  padding-right: 24rem;
}

.nutrition {
  position: relative;
  background-color: #fafaf9;
  padding-bottom: 46rem;
  border-radius: 0 0 50rem 50rem;
}

.nutrition::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1098rem;
  background: url("../img/nutrition_bg.png") no-repeat center top / 100%;
  pointer-events: none;
}

.nutrition::after {
  content: "";
  position: absolute;
  background: repeating-linear-gradient(
    90deg,
    #e60012 0 15rem,
    transparent 15rem 20rem
  );
  left: 0;
  right: 0;
  top: 0;
  height: 4rem;
}

.nutrition-inner {
  position: relative;
  z-index: 1;
}

.nutrition h3 {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 54rem;
  line-height: calc(63 / 54);
  text-align: center;
  margin-bottom: 26rem;
}

.nutrition-lbl {
  background-color: #e60012;
  color: #fff;
  font-size: 33rem;
  width: 165rem;
  text-align: center;
  padding: 12rem;
  margin-top: -30rem;
  margin-bottom: 48rem;
}

.nutrition-image {
  width: 708rem;
}

.nutrition-txt {
  font-feature-settings: "palt";
  margin-bottom: 68rem;
}

.nutrition-txt span {
  display: block;
  text-align: center;
  font-size: 35rem;
  letter-spacing: 0.06em;
  line-height: calc(47 / 35);
}

.nutrition-txt span:first-child {
  font-size: 30rem;
  line-height: calc(47 / 30);
}

.delivery {
  background-color: #fde8be;
  padding: 70rem 0 80rem;
}

.delivery-list {
  display: flex;
  flex-wrap: wrap;
  margin-top: 60rem;
  padding: 0 39rem;
}

.delivery-list > li {
  width: 50%;
  padding: 0 8rem;
  margin-bottom: 23rem;
}

.faq {
  padding: 82rem 50rem;
  position: relative;
  z-index: 1;
  overflow: hidden;
  margin-bottom: -6rem;
}

.faq::before,
.faq::after {
  content: "";
  position: absolute;
  background: url("../img/decor.png") no-repeat center 100% / 100%;
  width: 176rem;
  height: 652rem;
  right: 0;
  z-index: -1;
}

.faq::before {
  top: 0;
}

.faq::after {
  bottom: 6rem;
}

.faq-ttl {
  font-family: "M PLUS Rounded 1c", sans-serif;
  text-align: center;
  margin-bottom: 55rem;
}

.faq-ttl .ttl-jp {
  font-size: 40rem;
}

.faq-ttl .ttl-eng {
  display: block;
  font-size: 134rem;
  color: #e60012;
  line-height: 1;
}

.faq-ttl .ttl-eng span {
  font-size: 95rem;
}

.faq h3 {
  font-size: 25rem;
  line-height: calc(32 / 25);
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 800;
  background-color: #e60012;
  color: #fff;
  position: relative;
  min-height: 112rem;
  display: flex;
  align-items: center;
  padding: 0 30rem;
  cursor: pointer;
}

.faq h3::before,
.faq h3::after {
  content: "";
  position: absolute;
  right: 30rem;
  top: 52rem;
  width: 16rem;
  height: 6rem;
  border-radius: 10rem;
  background-color: #fff;
}

.faq h3::before {
  transform: rotate(90deg);
  transition: transform 0.3s;
}

.faq h3 span {
  position: relative;
  padding: 20rem 50rem 20rem 95rem;
}

.faq h3 span::before {
  content: "Q.";
  font-size: 49rem;
  color: #e60012;
  background-color: #fff;
  border-radius: 100%;
  width: 75rem;
  height: 75rem;
  position: absolute;
  left: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.faq .content {
  position: relative;
  font-feature-settings: "palt";
  background-color: #fff2ed;
  display: none;
}

.faq .content::before {
  content: "A.";
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 800;
  font-size: 49rem;
  color: #e60012;
  position: absolute;
  left: 46rem;
  top: 22rem;
}

.faq .content-text {
  font-size: 23rem;
  line-height: calc(47 / 23);
  padding: 28rem 24rem 46rem 125rem;
}

.faq .content-text p:not(:last-child) {
  margin-bottom: 46rem;
}

.faq ul {
  position: relative;
  z-index: 1;
}

.faq ul::before {
  content: "";
  position: absolute;
  background: url("../img/decor.png") no-repeat center 100% / 100%;
  width: 176rem;
  height: 652rem;
  left: -50rem;
  top: 32%;
  z-index: -1;
}

.faq li.active h3::before {
  transform: rotate(180deg);
}

.faq li:not(:last-child) {
  margin-bottom: 32rem;
}

footer {
  background-color: #fde8be;
  padding: 14rem 0 20rem;
  position: relative;
  z-index: 1;
}

footer .menu-link {
  font-size: 18rem;
  line-height: calc(47 / 18);
  position: relative;
  padding: 0 20rem;
  font-feature-settings: "palt";
}

footer li:not(:last-child) .menu-link::after {
  content: "|";
  position: absolute;
  right: 0;
}

footer .footer-menu {
  display: flex;
  justify-content: center;
}

.fixed {
  display: none;
  position: fixed;
  z-index: 999;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.fixed a {
  display: block;
  width: 704rem;
  transition: transform 0.3s;
}

.fixed a:hover {
  transform: scale(1.02);
}