@charset "utf-8";
/* 加工頒布会 */
:where(.lp-daichi) {
  --lp-croq: #130303;
  --lp-bouzushi: #3d3d3d;
  --lp-sweets: #473b31;
  --kakou-orng: #d94608;
  --sizzle-croq-bg: #241e1e;
  --croq-brwn: #452417;
  --cv-shadow: rgba(195, 133, 0, .9);
  --vendor-shadow: rgba(99, 99, 99, .5);
  
  /* https://min-max-calculator.9elements.com/ :w480,960 */
  --minM30minM15: clamp(-1.875rem, -2.813rem + 3.13vw, -0.938rem);
  --minM20maxM10: clamp(-1.25rem, -1.875rem + 2.08vw, -0.625rem);
  --minM15max0: clamp(-0.938rem, -1.875rem + 3.13vw, 0rem);
  --minM5max0: clamp(-0.313rem, -0.625rem + 1.04vw, 0rem);
  --min0max15: clamp(0rem, -0.938rem + 3.13vw, 0.938rem);
  --min0max20: clamp(0rem, -1.25rem + 4.17vw, 1.25rem);
  --min0max30: clamp(0rem, -1.875rem + 6.25vw, 1.875rem);
  --min0max115: clamp(0rem, -7.188rem + 23.96vw, 7.188rem);
  --min3max4: clamp(0.188rem, 0.125rem + 0.21vw, 0.25rem);
  --min4max9: clamp(0.25rem, -0.063rem + 1.04vw, 0.563rem);
  --min7max10: clamp(0.438rem, 0.25rem + 0.63vw, 0.625rem);
  --min8max15: clamp(0.5rem, 0.063rem + 1.46vw, 0.938rem);
  --min9max19: clamp(0.563rem, -0.063rem + 2.08vw, 1.188rem);
  --min10max15: clamp(0.625rem, 0.313rem + 1.04vw, 0.938rem);
  
  --min10max20: clamp(0.625rem, 2.08vw, 1.25rem);
  --min10max40: clamp(0.625rem, -1.25rem + 6.25vw, 2.5rem);
  --min13max26: clamp(0.813rem, 2.71vw, 1.625rem);
  --min14max18: clamp(0.875rem, 0.625rem + 0.83vw, 1.125rem);
  --min15max19: clamp(0.938rem, 0.688rem + 0.83vw, 1.188rem);
  --min15max22: clamp(0.938rem, 0.5rem + 1.46vw, 1.375rem);
  --min15max25: clamp(0.938rem, 0.313rem + 2.08vw, 1.563rem);
  --min16max22: clamp(1rem, 0.625rem + 1.25vw, 1.375rem);
  --min17max20: clamp(1.063rem, 0.875rem + 0.63vw, 1.25rem);
  --min17max22: clamp(1.063rem, 0.75rem + 1.04vw, 1.375rem);
  --min17max26: clamp(1.063rem, 0.5rem + 1.88vw, 1.625rem);
  --min19max22: clamp(1.188rem, 1rem + 0.63vw, 1.375rem);
  --min20max25: clamp(1.25rem, 0.938rem + 1.04vw, 1.563rem);
  --min20max30: clamp(1.25rem, 0.625rem + 2.08vw, 1.875rem);
  --min22max30: clamp(1.375rem, 0.875rem + 1.67vw, 1.875rem);
  --min22max35: clamp(1.406rem, 0.625rem + 2.6vw, 2.188rem);
  --min23max26: clamp(1.438rem, 1.25rem + 0.63vw, 1.625rem);
  --min23max27: clamp(1.438rem, 1.188rem + 0.83vw, 1.688rem);
  --min25max35: clamp(1.563rem, 0.938rem + 2.08vw, 2.188rem);
  --min25max40: clamp(1.563rem, 0.625rem + 3.13vw, 2.5rem);
  --min27max40: clamp(1.688rem, 0.875rem + 2.71vw, 2.5rem);
  --min29max40: clamp(1.813rem, 1.125rem + 2.29vw, 2.5rem);
  --min30max50: clamp(1.875rem, 0.625rem + 4.17vw, 3.125rem);
  --min30max60: clamp(1.875rem, 6.25vw, 3.75rem);
  --min32max45: clamp(2rem, 1.188rem + 2.71vw, 2.813rem);
  --min35max60: clamp(2.188rem, 0.625rem + 5.21vw, 3.75rem);
  --min40max60: clamp(2.5rem, 1.25rem + 4.17vw, 3.75rem);
  --min40max120: clamp(2.5rem, -2.5rem + 16.67vw, 7.5rem);
  --min70max100: clamp(4.375rem, 2.5rem + 6.25vw, 6.25rem);
  --min80max110: clamp(5rem, 3.125rem + 6.25vw, 6.875rem);
  --min100max148: clamp(6.25rem, 3.25rem + 10vw, 9.25rem);
}

.content-header .content-title {
  display: none;
}

:where([class]).-croq {
  color: var(--lp-croq);
}
:where([class]).-bouzushi {
  color: var(--lp-bouzushi);
}
:where([class]).-sweets {
  color: var(--lp-sweets);
}
:where([class]).-bgStripe {
  background: url(/external/category/image/2025/kakou/stripe_bg.jpg);
}
:where([class]).-brwn {
  color: var(--croq-brwn);
}
:where([class]).-bgNavy {
  background: url(/external/category/image/2025/kakou/navy_bg.jpg);
}
/* :where([class]).-bgSweets {
  background: url(/external/category/image/2025/kakou/beige_bg.jpg);
} */
:where([class]).-bgMarble {
  background: url(/external/category/image/2025/kakou/marble_bg1.jpg);
}
:where([class]).-shippori {
  font-family: var(--font-shippori);
  font-weight: bold;
}
[class*="textwrap"] .text + .text {
  margin-top: 20px;
}
:where([class]).-bgBeige {
  background: url(/external/category/image/2025/kakou/beige_bg.jpg);
}

.area-head:not(:has(img)) {
  font-size: var(--min32max45);
  line-height: 1.2;
  text-align: center;
}
.area-head.-croq {
  font-weight: 100;
}
.area-head.-sweets .sub {
  margin-bottom: 0;
}
.area-head .uBar {
  display: inline-block;
  padding-bottom: var(--min7max10);
  border-bottom: var(--min3max4) solid;
}

.area-title:not(:has(img)) {
  font-size: var(--min27max40);
  line-height: 1.2;
  text-align: center;
}
:is(.area-head,.area-title) .sub {
  font-size: 66.6548%;
  display: block;
  margin-bottom: var(--min7max10);
}
.area-title .sub.-slash {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: flex-end;
  gap: 5px;
}
.area-title .sub.-slash::before,
.area-title .sub.-slash::after {
  content: "＼";
  display: block;
  text-align: right;
}
.area-title .sub.-slash::after {
  transform: scale(-1,1);
}

.block-grid.-lead {
  grid-template-columns: repeat(3, 1fr);
  justify-content: center;
  gap: var(--min15max25);
  margin-top: calc(-1*var(--min40max120));
  width: min(660px, 85%);
  margin-inline: auto;
}
.lead-grid {
  position: relative;
  display: grid;
  place-content: center;
  aspect-ratio: 1 / 1;
  padding: var(--min10max20);
}
.lead-grid::after {
  content: "";
  display: block;
  width: 100%;
  aspect-ratio: 1/1;
  background-color: #fff;
  border-radius: 50%;
  position: absolute;
  top: 0;
}
.lead-grid.-orng::after {
  background-color: var(--kakou-orng);
}
.lead-grid > .str {
  position: inherit;
  z-index: 1;
}
.lead-area > .text {
  text-align: center;
  font-size: var(--min17max26);
  line-height: 1.7;
  padding-inline: calc(-1*var(--minM15max0));
}
.lead-area.-shippori > .text {
  /* font-weight: 600; */
}
.block-grid.-lead + .text {
  margin-top: var(--min25max40);
}

.contents-area {
  padding-inline: var(--min10max20);
  padding-bottom: 20px;
}
.contents-area.-goyomiDetail {
  padding-inline: 0;
  padding-bottom: 0;
}
/* .contents-area.-goyomiDetail > .inner {
  padding-inline: 0;
} */
.contents-area:has( > .lead-area) {
  padding-top: var(--min25max40)
}
.guide-anc {
  margin-top: 15px;
  padding-inline: var(--min20max30);
}
.guide-anc .link {
  width: min(410px, 100%);
}
.cv-area {
  margin-top: var(--min30max50);
  font-family: var(--font-gothic);
}
.block-grid.-cv {
  background-color: #fff;
}
.cv-textwrap {
  padding-block: 15px calc(-1*var(--minM5max0));
  padding-inline: var(--min20max30);
}
.cv-area:has(.guide-anc.-none) .cv-textwrap {
  padding-bottom: calc(-1*var(--minM20maxM10));
}
.cv-textwrap .title {
  margin-inline: auto;
}
.cv-text {
  padding-left: var(--min0max20);
  margin-top: 18px;
  line-height: 1.25;
  font-size: var(--min23max26);
}
.item-detail .cv-text {
  margin-top: 10px;
}
.cv-text > [class*="tax"] {
  display: block;
}
.cv-text > .taxin + .taxout {
  margin-top: 10px;
}
.cv-text > .taxin {
  font-size: 76.923%;;
}
.js-item-sales .item-summary .info > *:not(.cart) {
  display: none;
}
.js-item-sales .item-summary .info .cart {
  margin-top: 14px;
}
.js-item-sales .item-summary .info .cart::after {
  content: "お休み、途中解約もOK";
  display: block;
  font-size: 17px;
  color: initial;
  font-weight: bold;
  margin-top: 10px;
}
.js-item-sales .item-summary .info .cart .add-to-cart.registration fieldset .button {
  filter: none;
  box-shadow: 0 6px 0 var(--cv-shadow);
  border-radius: 15px;
  padding-block: 16px 10px;
  transition: all .7s;
  margin: 0;
  color: initial;
}
.js-item-sales .item-summary .info .cart .add-to-cart.registration fieldset .button:hover {
  transition: all .7s;
  box-shadow: 0 2px 0 var(--cv-shadow);
  transform: translateY(6px);
}
.js-item-sales .item-summary .info .cart .add-to-cart.registration fieldset .button:disabled {
  box-shadow: none;
}
.js-item-sales .item-summary .info .cart .add-to-cart.registration fieldset .button > span {
  font-size: var(--min23max27);
  background: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 8px;
  align-items: center;
}
.js-item-sales .item-summary .info .cart .add-to-cart.registration fieldset .button > span::before {
  content: "";
  display: block;
  width: 30px;
  aspect-ratio: 17/15;
  background: url(/assets/img/icon_reserve-renewal.png) no-repeat;
  background-size: contain;
}

.sizzle-area {
  color: #fff;
  margin-top: var(--min30max50);
}
.sizzle-area:has(.inner) {
  width: calc(100% + var(--min10max20)*2);
  transform: translateX(calc(-1*var(--min10max20)));
}
.sizzle-area.-croq {
  background-color: var(--sizzle-croq-bg);
}
.sizzle-area.-sweets {
  color: inherit;
}
.sizzle-area .inner {
  padding-inline: var(--min10max20);
  padding-block: var(--min35max60) var(--min30max50);
}
.sizzle-area > .text {
  font-family: var(--font-gothic);
  font-size: var(--min16max22);
  /* font-weight: 400; */
  text-align: center;
}
.block-grid.-sizzle {
  margin-top: var(--min20max30);
}
.block-grid.-sizzle > :is([class*="textwrap"], .text) {
  width: calc(50% - var(--min0max20));
  margin-left: var(--min0max20);
  font-size: var(--min19max22);
  line-height: 1.65;
  padding-inline: calc(-1*var(--minM15max0));
  box-sizing: border-box;
}
.block-grid.-sizzle.-reverse > :is([class*="textwrap"], .text) {
  margin-inline: 0 var(--min0max20);
}
.block-grid.-sizzle.-reverse .text {
  /* margin-left: 0;
  margin-right: 20px; */
}
.block-grid.-sizzle + .area-title {
  margin-top: var(--min35max60);
}
.sizzle-textwrap .title {
  margin-top: 6px;
  font-family: var(--font-shippori);
  font-size: var(--min22max30);
  line-height: 1.2;
}
.sizzle-textwrap .title .sub {
  font-size: 86.6665%;
  display: inline-block;
}
.sizzle-textwrap .text {
  display: block;
  margin-top: 6px;
}
/* .area-head.-sweets {
  font-family: var(--font-shippori);
  font-weight: 600;
} */

.voice-sec {
  /* position: relative; */
  background: #d6dae2;
  padding-block: var(--min40max60) var(--min20max25);
  padding-inline: var(--min30max60);
  margin-top: 70px;
}
.area-head.-voice {
  font-size: var(--min22max35);
  line-height: 1;
  letter-spacing: .08em;
}
.area-head.-voice .str {
  display: block;
  background: #968337;
  padding: 18px var(--min10max40);
  box-sizing: border-box;
  width: min(530px, 100%);
  margin-top: calc(-1*var(--min70max100));
  margin-inline: auto;
}
.area-head.-voice + .block-grid.-voice {
  margin-top: 30px;
}
.block-grid.-voice {
  grid-template-columns: var(--min100max148) 1fr;
  gap: var(--min10max15);
  align-items: center;
}
.block-grid.-voice + .block-grid.-voice {
  margin-top: calc(-1*var(--minM30minM15));
}
.block-grid.-voice:nth-of-type(2) {
  margin-left: var(--min0max115);
}
.voice-image {
  width: var(--min100max148);
  margin-inline: auto;
}
.voice-textwrap > .title {
  display: grid;
  /* position: relative; */
  grid-template-columns: auto auto auto;
  justify-content: flex-start;
  gap: 8px;
  color: #968337;
  font-size: var(--min17max26);
  line-height: 1;
}
.voice-textwrap > .title::before,
.voice-textwrap > .title::after {
  content: "";
  background: no-repeat center / contain;
  width: var(--min14max18);
  aspect-ratio: 1/1;
}
.voice-textwrap > .title::before {
  background-image: url(/external/category/image/2025/bouzushi/kakko_left.png);
  transform: translateY(calc(-1*var(--min4max9)));
}
.voice-textwrap > .title::after {
  /* bottom: var(--min-3max-9);
  right: 0; */
  background-image: url(/external/category/image/2025/bouzushi/kakko_right.png);
  height: 100%;
  transform: translateY(var(--min10max15));
}
.voice-textwrap > .text {
  padding-top: 10px;
  color: #3d3d3d;
  font-size: var(--min15max22);
  letter-spacing: -.05em;
}

.choice-sec {
  position: relative;
  margin: 0 auto;
  width: 99.11%;
}
.choice-textwrap {
  position: absolute;
  top: 21%;
  left: 39.5%;
  width: 54%;
}
.choice-textwrap .title {
  font-family: var(--font-shippori);
  font-weight: 600;
  color: #413429;
  font-size: var(--min13max26);
  line-height: 1.1;
}
.choice-textwrap .text {
  display: block;
  margin-top: var(--min8max15);
  color: #000;
  font-size: var(--min9max19);
  line-height: 1.7;
}
.month-text {
  display: flex;
  justify-content: center;
  align-items: center;
  width: var(--min80max110);
  height: var(--min29max40);
  padding-top: 3px;
  box-sizing: border-box;
  color: #fff;
  background: #473b31;
  font-size: var(--min15max19);
  line-height: 1;
}

.vendor-area {
  margin-top: var(--min35max60);
}
/* .vendor-area .area-head {
  font-size: 45px;
} */
.block-grid.-vendor {
  gap: var(--min0max30);
  margin-top: var(--min25max35);
}
.block-grid.-vendor:has(.grid) {
  gap: 20px;
}
.vendor-image {
  filter: drop-shadow(4px 5px 0px var(--vendor-shadow));
}
.vendor-textwrap {
  padding-inline: 15px;
  padding-block: 15px var(--min0max15);
}
.block-grid.-vendor:has(.grid) .vendor-textwrap {
  padding-bottom: 0;
}
.vendor-textwrap .title {
  font-size: var(--min23max27);
  /* font-weight: 100; */
  line-height: 1.2;
}
.vendor-textwrap .text {
  font-size: var(--min17max22);
  line-height: 1.5;
}
.vendor-textwrap .title + .text {
  margin-top: var(--min10max15);
}

@media (max-width:480px) {
  .block-grid.-lead.-col3 {
    grid-template-columns: repeat(3, 1fr);
  }
  .lead-area > .text {
    text-align: left;
    line-height: 1.55;
  }
  .lead-area.-sweets > .text {
    text-align: center;
  }

  .cv-text {
    text-align: center;
  }
  .cv-text > [class*="tax"]:nth-of-type(n+3) {
    display: inline-block;
  }

  .block-grid.-sizzle > :is([class*="textwrap"], .text) {
    width: 100%;
    margin-top: 15px;
  }
  .block-grid.-voice {
    grid-template-columns: 1fr;
  }
  .voice-textwrap {
    text-align: center;
  }
  .voice-textwrap > .title {
    justify-content: center;
  }

  .sizzle-area.-sweets .area-head + .text {
    margin-top: 16px;
  }

  .choice-sec {
    margin-top: 20px;
  }
  .choice-textwrap {
    top: unset;
    bottom: 9.5%;
    left: 0;
    right: 0;
    margin: auto;
    width: 88%;
  }
  .choice-textwrap .title {
    font-size: 17px;
    text-align: center;
  }
  .choice-textwrap .text {
    font-size: 14px;
    line-height: 1.6;
  }
}