@layer settings {
  :root {
    --torem: calc(1rem / 16);
    --torlh: calc(1rlh / 16);
    --tovi: calc(100vi / var(--viewport));
    --tovi-sm: calc(100vi / var(--design-width-sm));
    --tovi-md: calc(100vi / var(--design-width-md, 768));
    --tovi-lg: calc(100vi / var(--design-width-lg));
    --tovw-sm: calc(100vw / var(--design-width-sm));
    --tovw-md: calc(100vw / var(--design-width-md, 768));
    --tovw-lg: calc(100vw / var(--design-width-lg));
    --toremvw: calc((var(--torem) * 0.5) + (var(--viewport) * 0.5));
    --toremvi-sm: calc((var(--torem) * 0.5) + (var(--tovi-sm) * 0.5));
    --toremvi-md: calc((var(--torem) * 0.5) + (var(--tovi-md) * 0.5));
    --toremvi-lg: calc((var(--torem) * 0.5) + (var(--tovi-lg) * 0.5));
    --design-ratio: calc(100% / var(--viewport));
    --min-viewport: 375;
    --max-viewport: 1440;
    --design-width-sm: 375;
    --design-width-lg: 1440;
    --color-blue-50: #1e1a07;
    --color-grey: #b5b4ac;
    --base-background-color: #fff;
    --base-color: var(--color-dark);
    --font-sans-ja:
      "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN",
      "BIZ UDPGothic", "Meiryo", sans-serif;
    --font-sans-en:
      "Montserrat", "Helvetica Neue", "Arial", system-ui, sans-serif;
    --font-sans-mix: "Montserrat", "Noto Sans JP", sans-serif;
    --base-font-family: var(--font-sans-ja);
    --font-base: 16;
    --font-ratio: 8;
    --font-2xs: calc(var(--font-base) * var(--font-ratio) / 12 * var(--torem));
    --font-xs: calc(var(--font-base) * var(--font-ratio) / 10 * var(--torem));
    --font-sm: calc(var(--font-base) * var(--font-ratio) / 9 * var(--torem));
    --font-md: calc(var(--font-base) * var(--font-ratio) / 8 * var(--torem));
    --font-lg: calc(var(--font-base) * var(--font-ratio) / 7 * var(--torem));
    --font-xl: calc(var(--font-base) * var(--font-ratio) / 5 * var(--torem));
    --font-2xl: calc(var(--font-base) * var(--font-ratio) / 3 * var(--torem));
    --font-fluid-xs: clamp(0.666688rem, 0.63433rem + 0.138058vi, 0.8rem);
    --font-fluid-sm: clamp(0.888875rem, 0.861903rem + 0.115081vi, 1rem);
    --font-fluid-md: clamp(1rem, 0.965322rem + 0.147961vi, 1.14288rem);
    --font-fluid-lg: clamp(1.125rem, 1.07444rem + 0.215728vi, 1.33331rem);
    --font-fluid-xl: clamp(1.6rem, 1.50291rem + 0.414239vi, 2rem);
    --font-fluid-2xl: clamp(2rem, 1.83818rem + 0.690421vi, 2.66669rem);
    --font-fluid-3xl: clamp(2.66669rem, 2.34307rem + 1.38078vi, 4rem);
    --leading-base: 4;
    --leading-xs: calc(var(--leading-base) * 3 * var(--torem));
    --leading-sm: calc(var(--leading-base) * 4 * var(--torem));
    --leading-md: calc(var(--leading-base) * 5 * var(--torem));
    --leading-lg: calc(var(--leading-base) * 6 * var(--torem));
    --leading-xl: calc(var(--leading-base) * 7 * var(--torem));
    --leading-2xl: calc(var(--leading-base) * 8 * var(--torem));
    --leading-3xl: calc(var(--leading-base) * 9 * var(--torem));
    --leading-4xl: calc(var(--leading-base) * 10 * var(--torem));
    --leading-none: 1;
    --leading-tight: 1.25;
    --leading-normal: 1.5;
    --leading-relaxed: 1.75;
    --leading-loose: 2;
    --tracking-tigher: -0.05em;
    --tracking-tight: -0.025em;
    --tracking-normal: normal;
    --tracking-wide: 0.025em;
    --tracking-wider: 0.05em;
    --tracking-widest: 0.1em;
    --container-size-4xs: 460px;
    --container-size-3xs: 480px;
    --container-size-2xs: 600px;
    --container-size-xs: 640px;
    --container-size-sm: 768px;
    --container-size-md: 1200px;
    --container-size-lg: 1440px;
    --container-size-xl: 1500px;
    --container-size-2xl: 1640px;
    --offset-xs: 1.5vw;
    --offset-sm: 2.8vw;
    --offset-md: 5.5vw;
    --offset-lg: 7.3vw;
    --offset-xl: 13vw;
    --space-base: 8;
    --space-2xs: calc(var(--space-base) * var(--torem));
    --space-xs: calc(var(--space-base) * 2 * var(--torem));
    --space-sm: calc(var(--space-base) * 3 * var(--torem));
    --space-md: calc(var(--space-base) * 5 * var(--torem));
    --space-lg: calc(var(--space-base) * 8 * var(--torem));
    --space-xl: calc(var(--space-base) * 13 * var(--torem));
    --radius-sm: 1rem;
    --radius-md: 2rem;
    --radius-lg: 2.5rem;
    --radius-full: 50%;
    --grid-fit-sm: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
    --grid-fit-md: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
    --grid-fit-lg: repeat(auto-fit, minmax(min(400px, 100%), 1fr));
    --grid-fill-sm: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
    --grid-fill-md: repeat(auto-fill, minmax(min(320px, 100%), 1fr));
    --grid-fill-lg: repeat(auto-fill, minmax(min(400px, 100%), 1fr));
    --grid-1: repeat(1, minmax(0, 1fr));
    --grid-2: repeat(2, minmax(0, 1fr));
    --grid-3: repeat(3, minmax(0, 1fr));
    --grid-4: repeat(4, minmax(0, 1fr));
    --grid-5: repeat(5, minmax(0, 1fr));
    --grid-6: repeat(6, minmax(0, 1fr));
    --grid-7: repeat(7, minmax(0, 1fr));
    --grid-8: repeat(8, minmax(0, 1fr));
    --grid-9: repeat(9, minmax(0, 1fr));
    --grid-10: repeat(10, minmax(0, 1fr));
    --grid-11: repeat(11, minmax(0, 1fr));
    --grid-12: repeat(12, minmax(0, 1fr));
    --arrow-width: 10%;
    --arrow-prev: polygon(
      75% var(--arrow-width),
      calc(75% - var(--arrow-width)) 0,
      calc(25% - var(--arrow-width)) 50%,
      calc(75% - var(--arrow-width)) 100%,
      75% calc(100% - var(--arrow-width)),
      calc(25% + var(--arrow-width)) 50%,
      75% var(--arrow-width)
    );
    --arrow-next: polygon(
      25% var(--arrow-width),
      calc(25% + var(--arrow-width)) 0,
      calc(75% + var(--arrow-width)) 50%,
      calc(25% + var(--arrow-width)) 100%,
      25% calc(100% - var(--arrow-width)),
      calc(75% - var(--arrow-width)) 50%,
      25% var(--arrow-width)
    );
    --arrow-down: polygon(
      var(--arrow-width) 25%,
      0 calc(25% + var(--arrow-width)),
      50% calc(75% + var(--arrow-width)),
      100% calc(25% + var(--arrow-width)),
      calc(100% - var(--arrow-width)) 25%,
      50% calc(75% - var(--arrow-width)),
      var(--arrow-width) 25%
    );
    --duration-fast: 0.3s;
    --duration-normal: 0.6s;
    --duration-slow: 1.6s;
    --ease-in-sine: cubic-bezier(0.12, 0, 0.39, 0);
    --ease-out-sine: cubic-bezier(0.61, 1, 0.88, 1);
    --ease-in-out-sine: cubic-bezier(0.37, 0, 0.63, 1);
    --ease-in-cubic: cubic-bezier(0.32, 0, 0.67, 0);
    --ease-out-cubic: cubic-bezier(0.33, 1, 0.68, 1);
    --ease-in-out-cubic: cubic-bezier(0.65, 0, 0.35, 1);
    --ease-in-quint: cubic-bezier(0.64, 0, 0.78, 0);
    --ease-out-quint: cubic-bezier(0.22, 1, 0.36, 1);
    --ease-in-out-quint: cubic-bezier(0.83, 0, 0.17, 1);
    --ease-in-circ: cubic-bezier(0.55, 0, 1, 0.45);
    --ease-out-circ: cubic-bezier(0, 0.55, 0.45, 1);
    --ease-in-out-circ: cubic-bezier(0.85, 0, 0.15, 1);
    --ease-in-quad: cubic-bezier(0.11, 0, 0.5, 0);
    --ease-out-quad: cubic-bezier(0.5, 1, 0.89, 1);
    --ease-in-out-quad: cubic-bezier(0.45, 0, 0.55, 1);
    --ease-in-quart: cubic-bezier(0.5, 0, 0.75, 0);
    --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
    --ease-in-out-quart: cubic-bezier(0.76, 0, 0.24, 1);
    --ease-in-expo: cubic-bezier(0.7, 0, 0.84, 0);
    --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in-out-expo: cubic-bezier(0.87, 0, 0.13, 1);
    --ease-in-back: cubic-bezier(0.36, 0, 0.66, -0.56);
    --ease-out-back: cubic-bezier(0.34, 1.56, 0.64, 1);
    --ease-in-out-back: cubic-bezier(0.68, -0.6, 0.32, 1.6);
    --viewport: var(--design-width-sm);
  }

  @media (width >= 48rem) {
    :root {
      --viewport: var(--design-width-md, var(--design-width-sm));
    }
  }

  @media (width >= 64rem) {
    :root {
      --viewport: var(--design-width-lg);
    }
  }
}

@layer base {
  *,
  :before,
  :after {
    box-sizing: border-box;
    text-underline-offset: 0.25em;
    border-width: 1px;
    min-inline-size: 0;
    margin: 0;
    padding: 0;
  }

  :where(html) {
    font-family: var(--base-font-family), system-ui, sans-serif;
    font-weight: var(--base-font-weight, 400);
    line-height: var(--base-leading, 1.5);
    color: var(--base-color, initial);
    letter-spacing: var(--base-tracking, initial);
    overflow-wrap: anywhere;
    color-scheme: var(--base-color-scheme, only light);
    scrollbar-gutter: stable;
    background-color: var(--base-background-color, initial);
    line-break: strict;
    text-rendering: optimizeLegibility;
    -webkit-text-size-adjust: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  :where(html:has(dialog:modal[open], :popover-open)) {
    overflow: hidden;
  }

  :where(body) {
    min-block-size: 100svb;
    overflow-x: clip;
  }

  :where(h1, h2, h3, h4, h5, h6) {
    font-weight: var(--base-font-heading-weight, 700);
  }

  :where(h1) {
    font-size: var(--base-font-heading-1, unset);
  }

  :where(h2) {
    font-size: var(--base-font-heading-2, unset);
  }

  :where(h3) {
    font-size: var(--base-font-heading-3, unset);
  }

  :where(h4) {
    font-size: var(--base-font-heading-4, unset);
  }

  :where(h5) {
    font-size: var(--base-font-heading-5, unset);
  }

  :where(h6) {
    font-size: var(--base-font-heading-6, unset);
  }

  :where(hr) {
    border-block-start-style: solid;
  }

  :where(ul, ol) {
    list-style-type: "";
  }

  :where(address:lang(ja)) {
    font-style: unset;
  }

  :where(b, strong) {
    font-weight: 700;
  }

  :where(small) {
    font-size: max(0.625rem, 0.875em);
  }

  :where(code, kbd, samp) {
    font-family: ui-monospace, monospace;
  }

  :where(:any-link) {
    color: unset;
    text-decoration-skip-ink: auto;
  }

  :where(img, svg, video, canvas, audio, iframe, embed, object) {
    display: block;
  }

  :where(img, picture, svg, video) {
    block-size: auto;
    max-inline-size: 100%;
  }

  :where(svg) {
    fill: currentColor;
  }

  :where(table) {
    border-collapse: collapse;
  }

  :where(caption, th) {
    text-align: unset;
  }

  :where(th) {
    font-weight: 700;
  }

  :where(input, button, textarea, select, optgroup) {
    color: unset;
    letter-spacing: inherit;
    word-spacing: inherit;
    font: unset;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
  }

  :where(textarea) {
    resize: vertical;
    resize: block;
  }

  :where(textarea:not([rows])) {
    min-block-size: 10em;
  }

  :where(button, label, select, summary, [role="button"], [role="option"]) {
    cursor: pointer;
  }

  :where(input[type="file"])::-webkit-file-upload-button {
    cursor: pointer;
  }

  :where(input[type="file"])::file-selector-button {
    cursor: pointer;
  }

  :where([disabled], label:has(> input:disabled), label:has(+ input:disabled)) {
    cursor: not-allowed;
  }

  :where(button, [role="button"]) {
    touch-action: manipulation;
    border-style: solid;
  }

  :where(dialog, [popover]) {
    max-inline-size: unset;
    max-block-size: unset;
    color: unset;
    background-color: unset;
    border-style: none;
    margin: auto;
  }

  :where(dialog:not([open], [popover]), [popover]:not(:popover-open)) {
    display: none;
  }

  :where([aria-disabled="true"]) {
    cursor: not-allowed;
  }

  :where([aria-busy="true"]) {
    cursor: progress;
  }

  :where([aria-controls]) {
    cursor: pointer;
  }

  :where([aria-hidden="false"][hidden]) {
    display: initial;
  }

  :where([aria-hidden="false"][hidden]):not(:focus) {
    clip: rect(0, 0, 0, 0);
    position: absolute;
  }

  :where([hidden]:not([hidden="until-found"])) {
    display: none;
  }

  :where(:focus:not(:focus-visible)) {
    outline: none;
  }

  :where(:focus-visible, :target) {
    scroll-margin-block: 8vh;
  }

  :where(.visually-hidden:not(:focus-within, :active)) {
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    user-select: none !important;
    border: 0 !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    position: absolute !important;
    overflow: hidden !important;
  }

  @media (prefers-reduced-motion: reduce) {
    *,
    :before,
    :after,
    ::backdrop {
      animation-duration: 0.01ms !important;
      animation-iteration-count: 1 !important;
      animation-delay: unset !important;
      transition-delay: unset !important;
      scroll-behavior: auto !important;
      view-transition-name: none !important;
      transition-duration: 0.01ms !important;
    }
  }
}

@layer general, vendors;

@layer components {
  :where(.grid) {
    --grid-fit: repeat(
      auto-fit,
      minmax(min(var(--grid-min, 400px), 100%), 1fr)
    );
    --grid-fill: repeat(
      auto-fill,
      minmax(min(var(--grid-min, 400px), 100%), 1fr)
    );
    --grid-cols: none;
    --gap: 0;
    grid-template-columns: var(--grid-cols);
    gap: var(--gap);
    display: grid;
  }

  :where(.container) {
    --container-name: container;
    --layout: flow-root;
    --max-size: none;
    --offset-start: 0;
    --offset-end: 0;
    --offset: var(--offset-start) var(--offset-end);
    box-sizing: content-box;
    display: block var(--layout);
    max-inline-size: var(--max-size);
    padding-inline: var(--offset);
    margin-inline: auto;
  }

  .header {
    color: #fff;
    background: var(--bg-instagram);
    padding: 0.75em 5%;
    z-index:5;
  }

  .header__content {
    justify-content: space-between;
    align-items: center;
    display: flex;
  }

  .header__text p {
    font-size: clamp(0.625rem, 0.179rem + 1.9vw, 0.75rem);
    font-weight: 900;
  }

  .header__viewing{
    position:fixed;
    right: calc(50% - 230px);
    transform: translateX(-50%);
    top: 1.5%;
    z-index:500;
  }

  @media screen and (min-width:420px){
    .header__viewing{

   right: calc(50% - 280px);
  }
  }

  .header__viewing p {
    font-family: var(--secondary-font-family);
    color: #ff4b7e;
    background: #f6ff00;
    padding: 0.65em;
    font-size: clamp(0.688rem, 0.018rem + 2.86vw, 0.875rem);
    font-weight: 700;
    box-shadow: inset 0 0 3px #0006;
  }

  .hero {
    position: relative;
  }

  .hero img {
    width: 100%;
  }

  .cta {
    background: var(--bg-instagram);
    flex-direction: column;
    align-items: center;
    padding: 1em 0;
    display: flex;
  }

  .cta__text {
    color: #fff;
    text-align: center;
    text-shadow: 0 0 3px #00000080;
    letter-spacing: 0.03em;
    font-size: clamp(1.25rem, 0.536rem + 3.05vw, 1.5rem);
    font-weight: 700;
    line-height: 1.4;
  }

  .cta__text span {
    color: #f7ff00;
    font-size: clamp(1.25rem, 0.357rem + 3.81vw, 1.5rem);
  }

  /* キャッチコピー用の強調(太く・大きく・影を強めに) */
  .cta__text--catch {
    font-size: clamp(1.25rem, 0.036rem + 5.71vw, 1.75rem);
    font-weight: 900;
    line-height: 1.45;
    text-shadow:
      0 0 4px #000000b3,
      0 2px 6px #00000080;
  }

  .cta__text--catch span {
    font-size: 1.4em;
    line-height: 1;
  }

  /* キャッチ下の説明文(1行目が改行されずに収まるサイズ) */
  .cta__text--lead {
    margin-top: 0.6em;
    font-size: clamp(0.75rem, 3.9vw, 1.125rem);
    line-height: 1.5;
  }

  .cta__text--lead span {
    font-size: 1.2em;
  }

  .cta__button {
    margin-top: 0.5em;
    display: block;
    transition: transform 0.3s;
  display: block;
  }


.cta__button:hover {
  transform: translateY(4px);
}

  .movie {
    background: url("../images/bg_movie.jpg") center / cover;
  }

  .movie__content {
    aspect-ratio: 337 / 303;

  }

  .movie__content video {
    object-fit: cover;
    width: 100%;
    height: 100%;
  }

  .sec01 {
    background: url("../images/bg_sec01.jpg") center / cover;
    padding: 1em 0;
  }

  .sec01 h2 {
    color: #fff;
    text-align: center;
    background: #0073ff;
    width: fit-content;
    margin-inline: auto;
    padding: 0 0.75em;
    font-size: clamp(1rem, 0.554rem + 1.9vw, 1.125rem);
  }

  .sec01__content {
    grid-template-columns: repeat(3, 1fr);
    margin-top: 1em;
    display: grid;
  }

  .sec02 {
    background: url("../images/bg_sec02.jpg") center / cover;
    padding: 1em 0 3em;
  }

  .sec02 .-list {
    flex-direction: column;
    gap: 0.65em;
    display: flex;
  }

  .sec02 .-item {
    background: #fff;
    align-items: center;
    gap: 1.25em;
    padding: 0.5em 1em;
    display: flex;
    box-shadow: 0 0 5px #00000040;
  }

  .sec02 .-item p {
    letter-spacing: 0.1em;
    font-size: clamp(0.813rem, 0.143rem + 2.86vw, 1rem);
    line-height: 2;
    position: relative;
  }

  .sec02 .-item p:before {
    color: #d23333;
    content: "✓";
    font-size: 1.5em;
    font-weight: 900;
    position: absolute;
    top: -0.5em;
    left: -0.75em;
  }

  .sec02 .-item img {
    flex-shrink: 0;
    width: 65px;
  }

  .sec03 {
    background: url("../images/bg_sec03.jpg") center / cover;
    padding: 0 0 4em;
  }

  .sec03 ul {
    flex-direction: column;
    gap: 0.5em;
    display: flex;
  }

  .sec03 li {
    padding-top: 2em;
    position: relative;
  }

  .sec03 li .-head {
    aspect-ratio: 1;
    background: linear-gradient(
      to right,
      #d23333 0%,
      #ba2727 50%,
      #a31a1a 100%
    );
    border: 2px solid #fff;
    border-radius: 50%;
    place-items: center;
    width: clamp(3rem, 1rem + 10vw, 4rem);
    height: clamp(3rem, 1rem + 10vw, 4rem);
    display: grid;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
  }

  .sec03 li .-head p {
    font-family: var(--number-font-family);
    color: #fff;
    margin-top: -0.25em;
    font-size: clamp(2.5rem, 1.25rem + 6.25vw, 3.125rem);
    line-height: 1;
  }

  .sec03 li .-body {
    background: linear-gradient(#f4d26f 0%, #d2bc67 100%);
    border: 2px solid #fff;
    padding: 8% 0.5em 0.5em;
    box-shadow: 2px 2px 4px #00000040;
  }

  .sec03 li .-title {
    color: #000;
    text-align: center;
    text-shadow: 0 0 6px #fff;
    letter-spacing: 0.05em;
    font-size: clamp(1.063rem, 0.17rem + 3.81vw, 1.313rem);
    font-weight: 800;
  }

  .sec04 {
    background: url("../images/bg_sec04.jpg") center / cover;
  }

  .sec04__head {
    background: url("../images/bg_sec04-head-Q0dYULFt.png.webp") center / cover;
    padding-bottom: 4em;
  }

  .sec04__head img {
    transform: translateY(-1.5em);
  }

  .sec04__heading {
    z-index: 1;
    position: relative;
  }

  .sec04__content {
    margin-top: -5em;
  }

  .sec04__item {
    backdrop-filter: opacity(0.7);
    mix-blend-mode: multiply;
    background: linear-gradient(#b4ecf4 0%, #fff 100%);
    padding: 1.5em 1em;
  }

  .sec04__item h3 {
    color: #fff;
    text-align: center;
    background: linear-gradient(
      45deg,
      #ffd600 2%,
      #ff7a00 25%,
      #ff0069 49%,
      #d300c5 75%,
      #7338fa 99%
    );
    border-radius: 200px;
    width: 95%;
    margin-inline: auto;
    font-size: clamp(1rem, 0.107rem + 3.81vw, 1.25rem);
  }

  .sec04__item h3 span {
    color: #f6ff00;
    padding-left: 0.15em;
    font-size: clamp(1.25rem, 0.357rem + 3.81vw, 1.5rem);
  }

  .sec04__item.-first {
    margin-top: -3em;
    padding-top: 3em;
  }

  .sec04__item .-copy {
    text-align: center;
    letter-spacing: 0.05em;
    border-bottom: 2px solid #fff;
    margin-top: 0.75em;
    padding-bottom: 0.3em;
    font-size: clamp(1.063rem, 0.616rem + 1.9vw, 1.188rem);
    font-weight: 900;
    line-height: 1.3;
  }

  .sec04__item .-copy em {
    font-size: clamp(1.25rem, 0.357rem + 3.81vw, 1.5rem);
    font-style: normal;
  }

  .sec04__item .-copy .-accent {
    color: #a51bde;
  }

  .sec04__item figure {
    margin: 1em 0;
  }

  .sec04__item figure.-small {
    max-width: 80%;
    margin-inline: auto;
  }

  .sec04__item .-text {
    letter-spacing: 0.05em;
    font-size: clamp(0.875rem, 0.429rem + 1.9vw, 1rem);
    font-weight: 700;
    line-height: 1.8;
  }

  .sec04__item .-text em {
    color: #ff214d;
    font-style: normal;
  }

  .sec05 {
    background: url("../images/bg_sec04.jpg") center / cover;
    padding-bottom: 3em;
  }

  .sec05__item {
    background: #fff;
    border-radius: 20px;
    padding: 1.25em;
    box-shadow: 0 0 5px #00000059;
  }

  .sec05__item + .sec05__item {
    margin-top: 1.5em;
  }

  .sec05__head {
    gap: 1em;
    display: flex;
  }

  .sec05__head figure {
    flex-shrink: 0;
    width: 106px;
  }

  .sec05__head .-heading {
    flex-direction: column;
    gap: 1em;
    margin-top: 0.5em;
    display: flex;
  }

  .sec05__head .-number {
    color: #fff;
    background: #a51bde;
    width: fit-content;
    padding: 0 0.5em;
    font-weight: 700;
  }

  .sec05__head .-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
  }

  .sec05__head .-title small {
    margin-top: 0.25em;
    font-size: 10px;
    font-weight: 400;
    display: block;
  }

  .sec05__dl {
    margin-top: 1em;
    position: relative;
  }

  .sec05__dl:after {
    content: "";
    background: url("../images/text_result-ls20dtvv.png.avif") center / cover;
    width: 96px;
    height: 45px;
    position: absolute;
    bottom: -10%;
    left: 50%;
    transform: translateX(-50%);
  }

  .sec05__dl dt {
    z-index: 1;
    position: relative;
  }

  .sec05__dl dt span {
    color: #fff;
    letter-spacing: 0.05em;
    background: #a9a9a9;
    border-radius: 0 50px 50px 0;
    padding: 0 1em;
    font-size: clamp(0.75rem, 0.304rem + 1.9vw, 0.875rem);
    font-weight: 700;
  }

  .sec05__dl dt:before,
  .sec05__dl dt:after {
    z-index: -1;
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
  }

  .sec05__dl dt:before {
    border-bottom: 1px solid #a9a9a9;
    width: 100%;
    height: 1px;
    left: 0;
  }

  .sec05__dl dt:after {
    color: #a9a9a9;
    content: "◆";
    font-size: 0.75rem;
    right: 0;
  }

  .sec05__dl dd {
    background: #f3f3f3;
    margin-top: -1em;
    padding: 2em 1em;
    font-size: clamp(0.625rem, 3.81vw - 0.268rem, 0.875rem);
    font-weight: 700;
    line-height: 1.8;
  }

  .sec05__dl li:before {
    color: #a9a9a9;
    content: "◆";
    padding-right: 0.25em;
  }

  .sec05__dl dl:last-child {
    margin-top: -1em;
  }

  .sec05__dl dl:last-child dt span {
    background: #ff9400;
  }

  .sec05__dl dl:last-child dt:before {
    border-color: #ff9400;
  }

  .sec05__dl dl:last-child dt:after {
    color: #ff9400;
  }

  .sec05__dl dl:last-child dd {
    background: #fff2e0;
    padding-bottom: 2.5em;
  }

  .sec05__dl dl:last-child li:before {
    color: #ff9400;
  }

  .sec05__result {
    flex-direction: column;
    gap: 0.35em;
    margin-top: 2em;
    display: flex;
  }

  .sec05__result li {
    text-align: center;
    letter-spacing: 0.06em;
    background: #b4ecf4;
    padding: 0.5em 1em;
    font-size: clamp(0.75rem, 3.81vw - 0.143rem, 1rem);
    font-weight: 700;
    line-height: 1.2;
  }

  .sec05__result li em {
    color: #ff214d;
    font-style: normal;
  }

  .sec05__result li strong {
    font-size: clamp(1rem, 0.107rem + 3.81vw, 1.25rem);
  }

  .sec05__bottom {
    text-align: center;
    letter-spacing: 0.05em;
    margin-top: 1.5em;
    font-size: clamp(0.875rem, 0.429rem + 1.9vw, 1rem);
    font-weight: 700;
  }

  .sec05__bottom em {
    font-size: clamp(1rem, 0.554rem + 1.9vw, 1.125rem);
    font-style: normal;
  }

  .sec05__bottom strong {
    color: #ff214d;
    text-shadow: 0 0 3px #fff;
    background: linear-gradient(#0000 60%, #f6ff00 60%);
    font-size: clamp(1.25rem, 0.357rem + 3.81vw, 1.5rem);
  }
}

:where(html) {
  --base-font-weight: 600;
  --base-font-family: "Noto Sans JP", sans-serif;
  --secondary-font-family: "Noto Serif JP", serif;
  --number-font-family: "Cormorant Garamond", serif;
  --main-color: #e66d1e;
  --bg-instagram: linear-gradient(to right, #ff4b7e 0%, #d856ff 100%);
}

a {
  text-decoration: none;
}

.l-container {
  padding: 0 5.3%;
}

.l-wrapper {
  max-width: 480px;
  margin-inline: auto;
  box-shadow: 0 0 10px #0000001a;
}

.u-hidden {
  width: 1px;
  height: 1px;
  position: absolute;
  top: auto;
  left: -9999px;
  overflow: hidden;
}

.u-br {
  display: block;
}

.u-col2 {
  grid-template-columns: 1fr 1fr;
  display: grid;
}

.c-button {
  width: 363px;
  display: block;
}

.c-button img {
  width: 100%;
}

.floating {
  visibility: hidden;
  opacity: 0;
  transition:
    opacity 0.3s,
    visibility 0.3s;
  position: fixed;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
  max-width:430px;
  width:90%;
  z-index:2;
}

.floating.show {
  visibility: visible;
  opacity: 1;
}

.floating__limited {
  width: fit-content;
  margin: 0 auto -0.7em;
  position: relative;
  z-index: 1;
  color: #000;
  background: #ffff00;
  border: 0;
  border-radius: 0;
  box-shadow: 0 3px 7px #00000030;
  font-family: "Noto Serif", "Hiragino Mincho ProN", serif;
  /* 25文字 + 左右余白(1.5em)が .floating の幅(90vw / 最大430px)に収まるサイズ */
  font-size: clamp(0.625rem, 3.3vw, 1rem);
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  padding: 0.45em 0.75em 0.5em;
  text-align: center;
}

.floating__limited::after {
  content: "";
  width: 0;
  height: 0;
  position: absolute;
  bottom: -0.78em;
  left: 50%;
  border-top: 0.82em solid #ffff00;
  border-right: 0.48em solid transparent;
  border-left: 0.48em solid transparent;
  transform: translateX(-50%);
}

.floating a {
  color: #fff;
  background: linear-gradient(180deg, #4fc34d 0%, #08a653 58%, #0b9e53 100%);
  border: 5px solid #fff;
  border-radius: 999px;
  box-shadow: 0 5px 8px #00000045;
  font-size: clamp(1.3rem, 6vw, 2rem);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: 0.02em;
  padding: 0.75em 0.7em 0.8em;
  text-align: center;
  text-decoration: none;
  text-shadow: 2px 0 4px #00000070;
  transition: transform 0.3s;
  display: block;
}

.floating a span {
  color: #ffff00;
}

@media (width < 48rem) {
  .floating a {
    border-width: 2px;
  }
}

.floating a:hover {
  transform: translateY(4px);
}
.footer__content{
  padding:1em 5% 9em;
}
.footer__link{
  display: flex;
  flex-direction:column;
  align-items:center;
  gap:.5em;
  font-size:13px;
}
.footer__copyright{
  text-align: center;
  background: #ccc;
  color:#fff;
  padding:.25em 5% 1em;
  font-size: 12px;
}