:root {
    --gp: #694485;
    --gd: #4a2e5d;
    --gl: #f2eef5;
    --gm: #8b66a3;
    --gp2: #fcfafc;
    --gld: #d4a843;
      --txt: #222;
      --sub: #555;
      --r: 50px;
    }

    *,
    *::before,
    *::after {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      font-family: 'Noto Sans JP', sans-serif;
      font-size: 16px;
      color: var(--txt);
      background: #fff;
      overflow-x: hidden;
      line-height: 1.7;
      /* Text protection */
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
    }

    h1,
    h2,
    h3,
    h4,
    h5 {
      font-family: 'Noto Sans JP', sans-serif;
    }

    a {
      color: inherit;
      text-decoration: none;
    }

    img {
      display: block;
      max-width: 100%;
      /* Image protection */
      pointer-events: none;
      -webkit-user-drag: none;
      -webkit-touch-callout: none;
    }

    .wrap {
      max-width: 1060px;
      margin: 0 auto;
      padding: 0 20px;
    }

    .sec {
      padding: 72px 20px;
    }

    .alt {
      background: var(--gp2);
    }

    /* 笏€笏€ headings 笏€笏€ */
    .en {
      font-size: .68rem;
      letter-spacing: .22em;
      color: var(--gm);
      font-weight: 700;
      text-transform: uppercase;
    }

    .ttl {
      font-size: 36px;
      font-weight: 800;
      color: var(--gd);
      line-height: 1.45;
      margin: 8px 0 4px;
    }

    .lead {
      font-size: 1rem;
      color: var(--sub);
      line-height: 1.9;
      margin-top: 10px;
    }

    .bar {
      width: 38px;
      height: 3px;
      background: linear-gradient(to right, var(--gp), var(--gld));
      border-radius: 99px;
      margin: 14px auto 0;
    }

    .bar.l {
      margin-left: 0;
    }

    .badge {
      display: inline-block;
      background: var(--gp);
      color: #fff;
      font-size: .68rem;
      font-weight: 700;
      letter-spacing: .12em;
      padding: 4px 14px;
      border-radius: 99px;
      margin-bottom: 10px;
    }

    .sp-br {
      display: none;
    }

    /* 笏€笏€ buttons 笏€笏€ */
    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 15px 30px;
      border-radius: var(--r);
      font-weight: 700;
      font-size: .9rem;
      cursor: pointer;
      transition: opacity .18s, transform .18s;
      white-space: nowrap;
      font-family: 'Noto Sans JP', sans-serif;
    }

    .btn:hover {
      opacity: .86;
      transform: translateY(-2px);
    }

    .btn-g {
      background: var(--gp);
      color: #fff;
    }

    .btn-l {
      background: #06c755;
      color: #fff;
    }

    .btn-d {
      background: var(--gd);
      color: #fff;
    }

    /* 笏€笏€ HEADER 笏€笏€ */
    #hd {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      z-index: 1000;
      background: rgba(255, 255, 255, .97);
      border-bottom: 1px solid var(--gl);
      box-shadow: 0 2px 14px rgba(0, 0, 0, .07);
    }

    .hdi {
      max-width: 1060px;
      margin: 0 auto;
      padding: 0 20px;
      height: 62px;
      display: flex;
      align-items: center;
      gap: 14px;
    }

    .logo-m {
      font-family: 'Noto Sans JP', sans-serif;
      font-weight: 800;
      font-size: 1.1rem;
      color: var(--gd);
      line-height: 1.1;
    }

    .logo-s {
      font-size: .6rem;
      color: var(--gm);
      margin-top: 2px;
      font-weight: 500;
    }

    .pcnav {
      display: flex;
      gap: 2px;
      margin-left: auto;
    }

    .pcnav a {
      font-size: .74rem;
      font-weight: 500;
      color: var(--txt);
      padding: 6px 9px;
      border-radius: 6px;
      transition: background .15s, color .15s;
      white-space: nowrap;
    }

    .pcnav a:hover {
      background: var(--gl);
      color: var(--gp);
    }

    .hcta {
      margin-left: 10px;
      flex-shrink: 0;
    }

    .hcta .btn {
      padding: 10px 20px;
      font-size: .8rem;
    }

    /* 笏€笏€ HAMBURGER 笏€笏€ */
    #hbg {
      display: none;
      flex-direction: column;
      gap: 5px;
      cursor: pointer;
      padding: 8px;
      background: none;
      border: none;
      margin-left: auto;
    }

    #hbg span {
      display: block;
      width: 22px;
      height: 2px;
      background: var(--gd);
      border-radius: 2px;
      transition: all .28s;
    }

    #hbg.open span:nth-child(1) {
      transform: translateY(7px) rotate(45deg);
    }

    #hbg.open span:nth-child(2) {
      opacity: 0;
    }

    #hbg.open span:nth-child(3) {
      transform: translateY(-7px) rotate(-45deg);
    }

    #spnav {
      display: none;
      position: fixed;
      top: 62px;
      left: 0;
      right: 0;
      bottom: 0;
      background: var(--gd);
      z-index: 999;
      padding: 28px 24px;
      overflow-y: auto;
    }

    #spnav.open {
      display: block;
    }

    #spnav a {
      display: block;
      color: rgba(255, 255, 255, .9);
      font-size: 1rem;
      font-weight: 500;
      padding: 14px 0;
      border-bottom: 1px solid rgba(255, 255, 255, .1);
      text-align: center;
    }

    .sncta {
      margin-top: 24px;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    /* 笏€笏€ FV 笏€笏€ */
    #fv {
      position: relative;
      margin-top: 62px;
      overflow: hidden;
    }

    .fv-img-wrap {
      position: relative;
      width: 100%;
      line-height: 0;
    }

    .fv-img-pc {
      display: block;
      width: 100%;
      height: auto;
    }

    .fv-img-sp {
      display: none;
      width: 100%;
      height: auto;
    }


    /* 笏€笏€ STATS 笏€笏€ */
    #stats {
      background: var(--gd);
      padding: 0;
    }

    .stg {
      max-width: 900px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: repeat(4, 1fr);
    }

    .st {
      text-align: center;
      padding: 26px 16px;
      border-right: 1px solid rgba(255, 255, 255, .15);
    }

    .st:last-child {
      border-right: none;
    }

    .stn {
      font-family: 'Noto Sans JP', sans-serif;
      font-size: 2rem;
      font-weight: 800;
      color: #e2d6ed;
    }

    .stu {
      font-size: .85rem;
      color: #e2d6ed;
    }

    .stl {
      font-size: .68rem;
      color: rgba(255, 255, 255, .72);
      margin-top: 5px;
    }

    /* 笏€笏€ WORRIES 笏€笏€ */
    #worries {
      position: relative;
      background: url('../img/sfvbg.jpg') no-repeat left center / cover;
      z-index: 1;
    }

    #worries::before {
      content: '';
      position: absolute;
      inset: 0;
      background: rgba(255, 255, 255, 0.6);
      z-index: -1;
    }

    .w-right {
      margin-left: 50%;
      /* 2-column layout width approx 50% split */
      text-align: left;
    }

    @media(max-width:767px) {
      .w-right {
        margin-left: 0;
      }
      #worries {
        background-position: 10% center;
      }
    }

    .wgrid {
      display: grid;
      gap: 12px;
    }

    .wcard {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 10px 0;
      border-bottom: 1px solid rgba(105, 68, 133, 0.1);
    }

    .wcard:last-child {
      border-bottom: none;
    }

    .wico {
      width: 24px;
      height: 24px;
      min-width: 24px;
      background: var(--gp);
      color: #fff;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 0.8rem;
      font-weight: 900;
      flex-shrink: 0;
    }

    .wico::before {
      content: '✓';
    }

    .wtxt {
      font-size: 1rem;
      font-weight: 500;
      line-height: 1.4;
      white-space: nowrap;
    }

    .wcta-msg {
      font-family: 'Noto Sans JP', sans-serif;
      margin-top: 60px;
      text-align: center;
      /* Restore centering as requested */
    }

    .wcta-s {
      display: block;
      font-size: 1.1rem;
      font-weight: 700;
      color: var(--sub);
      margin-bottom: 8px;
    }

    .wcta-l {
      display: block;
      font-size: 2rem;
      font-weight: 900;
      color: var(--gd);
      line-height: 1.3;
      letter-spacing: -0.02em;
    }

    .wcta-l span {
      color: var(--gm);
      position: relative;
      display: inline-block;
    }

    .wcta-l span::after {
      content: '';
      position: absolute;
      left: 0;
      bottom: 4px;
      width: 100%;
      height: 10px;
      background: rgba(105, 68, 133, .2);
      z-index: -1;
    }

    /* 笏€笏€ ABOUT 笏€笏€ */
    #about {
      position: relative;
      background-color: #fafafa;
      background-image: 
        linear-gradient(#ebebeb 1px, transparent 1px),
        linear-gradient(90deg, #ebebeb 1px, transparent 1px);
      background-size: 20px 20px;
    }

    .about-g {
      max-width: 1000px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 52px;
      align-items: center;
    }

    .about-overlap {
      position: relative;
      width: 100%;
      aspect-ratio: 1 / 0.92;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 20px;
    }

    .about-overlap img {
      position: absolute;
      width: 75%;
      border-radius: 12px;
      box-shadow: 0 15px 45px rgba(0, 0, 0, 0.15);
      border: 6px solid #fff;
    }

    .a1-wrap {
      position: absolute;
      top: 0;
      left: 0;
      width: 75%;
      aspect-ratio: 4 / 3;
      z-index: 1;
      transform: rotate(-2deg);
      border-radius: 12px;
      overflow: hidden;
      box-shadow: 0 15px 45px rgba(105, 68, 133, 0.15);
      border: 6px solid #fff;
    }

    .about-overlap .a1 {
      position: static;
      width: 100%;
      height: 100%;
      object-fit: cover;
      transform: scale(1.2);
    }

    .about-overlap .a2 {
      position: absolute;
      bottom: -4%;
      right: 0;
      z-index: 2;
      transform: rotate(2deg);
      width: 70%;
      border-radius: 12px;
      box-shadow: 0 15px 45px rgba(105, 68, 133, 0.15);
      border: 6px solid #fff;
    }

    @media (max-width: 767px) {
      .about-overlap {
        margin-bottom: 30px;
      }
    }

    .aqlist {
      margin-top: 22px;
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .aq {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      background: #fff185;
      border-radius: 8px;
      padding: 12px 14px;
    }

    .aqico {
      color: var(--gld);
      font-size: 1.1rem;
      margin-top: -2px;
      flex-shrink: 0;
    }

    .aqtxt {
      font-size: .85rem;
      font-weight: 700;
      color: var(--gd);
    }

    /* 笏€笏€ POINTS 笏€笏€ */
    .ptg {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 22px;
      margin-top: 40px;
    }

    .ptc {
      background: #fff;
      border-radius: 14px;
      overflow: hidden;
      box-shadow: 0 4px 20px rgba(105, 68, 133, .1);
      transition: transform .22s, box-shadow .22s;
    }

    .ptc:hover {
      transform: translateY(-5px);
      box-shadow: 0 12px 32px rgba(105, 68, 133, .16);
    }

    .ptimg {
      width: 100%;
      aspect-ratio: 16/10;
      object-fit: cover;
      background: #eaeaea;
    }

    .ptbd {
      padding: 20px 22px;
    }

    .ptn {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      background: #ff7800;
      color: #fff;
      font-size: .68rem;
      font-weight: 800;
      letter-spacing: .1em;
      padding: 4px 12px;
      border-radius: 99px;
      margin-bottom: 10px;
    }

    .ptn::before {
      content: '';
      display: block;
      width: 6px;
      height: 6px;
      background: #fff;
      border-radius: 50%;
    }

    .ptttl {
      font-size: 24px;
      font-weight: 800;
      color: var(--gd);
      margin-bottom: 8px;
      line-height: 1.4;
    }

    .pttxt {
      font-size: 1rem;
      color: var(--sub);
      line-height: 1.8;
    }

    .btn-shine {
      position: relative;
      overflow: hidden;
    }

    .btn-shine::after {
      content: '';
      position: absolute;
      top: -50%;
      left: -100%;
      width: 50%;
      height: 200%;
      background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0) 100%);
      transform: rotate(30deg);
      animation: shine-btn 3s infinite;
    }

    @keyframes shine-btn {
      0% {
        left: -100%;
      }

      50% {
        left: 100%;
      }

      100% {
        left: 100%;
      }
    }



    /* 笏€笏€ STAFF 笏€笏€ */
    .sfg {
      max-width: 1000px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 48px;
      align-items: center;
    }

    .sfimg {
      overflow: hidden;
    }

    .sfimg img {
      width: 100%;
      height: auto;
    }

    .sfnm {
      font-family: 'Noto Sans JP', sans-serif;
      font-size: 1.5rem;
      font-weight: 800;
      color: var(--gd);
      margin-bottom: 4px;
    }

    .sfrole {
      font-size: .75rem;
      color: var(--gm);
      margin-bottom: 16px;
      font-weight: 500;
    }

    .sftags {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-bottom: 18px;
    }

    .sftag {
      background: var(--gl);
      color: var(--gd);
      font-size: .72rem;
      font-weight: 700;
      padding: 5px 13px;
      border-radius: 99px;
    }

    .sfbody {
      font-size: 1rem;
      color: var(--sub);
      line-height: 1.9;
    }

    .sfmsg {
      margin-top: 20px;
      background: var(--gp2);
      border-left: 3px solid var(--gld);
      padding: 16px 18px;
      border-radius: 0 10px 10px 0;
    }

    .sfmttl {
      font-family: 'Noto Sans JP', sans-serif;
      font-size: 1.2rem;
      font-weight: 800;
      color: var(--gd);
      margin-bottom: 7px;
    }

    .sfmp {
      font-size: 1rem;
      color: var(--sub);
      line-height: 1.9;
    }

    /* 笏€笏€ ACCESS 笏€笏€ */
    .acg {
      max-width: 960px;
      margin: 40px auto 0;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 40px;
    }

    .acdl {
      display: flex;
      flex-direction: column;
    }

    .acrow {
      display: flex;
      padding: 12px 0;
      border-bottom: 1px solid var(--gl);
    }

    .acdt {
      width: 88px;
      min-width: 88px;
      font-size: .75rem;
      font-weight: 700;
      color: var(--gp);
    }

    .acdd {
      font-size: 1rem;
      line-height: 1.7;
    }

    .acmap {
      border-radius: 14px;
      overflow: hidden;
      box-shadow: 0 4px 20px rgba(105, 68, 133, .12);
      height: 400px;
      background: #eee;
    }

    .acmap iframe {
      width: 100%;
      height: 100%;
      border: 0;
    }

    .rbox {
      max-width: 680px;
      margin: 48px auto 0;
      background: var(--gp2);
      border: 2px solid var(--gl);
      border-radius: 16px;
      padding: 36px 32px;
      text-align: center;
    }

    .rttl {
      font-family: 'M PLUS Rounded 1c', sans-serif;
      font-size: 24px;
      font-weight: 800;
      color: var(--gd);
      margin-bottom: 6px;
    }

    .rsub {
      font-size: 1rem;
      color: var(--sub);
      margin-bottom: 24px;
    }

    .rbtns {
      display: flex;
      gap: 14px;
      justify-content: center;
      flex-wrap: wrap;
    }

    /* 笏€笏€ FOOTER 笏€笏€ */
    footer {
      background: var(--gd);
      color: rgba(255, 255, 255, .8);
      padding: 40px 20px;
      text-align: center;
    }

    .ftl {
      font-family: 'Noto Sans JP', sans-serif;
      font-size: 1.15rem;
      font-weight: 800;
      color: #fff;
      margin-bottom: 10px;
    }

    .ftcp {
      font-size: .65rem;
      opacity: .45;
      margin-top: 10px;
    }

    .ftnav {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 18px;
      margin: 18px 0;
    }

    .ftnav a {
      font-size: .75rem;
      color: rgba(255, 255, 255, .65);
    }

    .ftnav a:hover {
      color: #e2d6ed;
    }

    /* 笏€笏€ BACK TOP 笏€笏€ */
    #bt {
      position: fixed;
      bottom: 88px;
      right: 18px;
      z-index: 900;
      width: 44px;
      height: 44px;
      border-radius: 50%;
      background: var(--gp);
      color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 1rem;
      box-shadow: 0 4px 14px rgba(105, 68, 133, .35);
      transition: opacity .3s, transform .2s;
      cursor: pointer;
    }

    #bt:hover {
      transform: translateY(-3px);
    }

    #bt.hide {
      opacity: 0;
      pointer-events: none;
    }

    /* 笏€笏€ SP CTA 笏€笏€ */
    #spcta {
      display: none;
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      z-index: 880;
      background: #fff;
      border-top: 1px solid var(--gl);
      box-shadow: 0 -4px 16px rgba(0, 0, 0, .1);
      padding: 10px 14px;
      gap: 10px;
      transition: transform 0.3s ease;
    }

    #spcta.hide {
      transform: translateY(100%);
    }

    #spcta a {
      flex: 1;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      padding: 13px 10px;
      border-radius: 50px;
      font-weight: 700;
      font-size: .82rem;
      white-space: nowrap;
    }

    .sptel {
      background: var(--gp);
      color: #fff;
    }

    .spline {
      background: #06c755;
      color: #fff;
    }

    /* 笏€笏€ INFINITE SLIDER 笏€笏€ */
    .slide-wrap {
      width: 100%;
      overflow: hidden;
      margin-top: 60px;
    }

    .slide-track {
      display: flex;
      width: calc(300px * 10);
      animation: slide 30s linear infinite;
    }

    .slide-item {
      width: 300px;
      padding: 0 10px;
      flex-shrink: 0;
    }

    .slide-item img {
      width: 100%;
      height: 200px;
      object-fit: cover;
      border-radius: 8px;
    }

    @keyframes slide {
      0% {
        transform: translateX(0);
      }

      100% {
        transform: translateX(calc(-300px * 5));
      }
    }

    /* 笏€笏€ CTA SECTION 笏€笏€ */
    .cta-mid-section {
      background: var(--gd);
      padding: 60px 20px;
      color: #fff;
      text-align: center;
    }

    .cta-mid-in {
      max-width: 1000px;
      margin: 0 auto;
    }

    .cta-badge {
      display: inline-block;
      background: #ff7800;
      color: #fff;
      font-size: 16px;
      font-weight: 700;
      padding: 6px 24px;
      border-radius: 20px;
      margin-bottom: 20px;
    }

    .cta-ttl-mid {
      font-size: 36px;
      font-weight: 700;
      margin-bottom: 50px;
      letter-spacing: 0.05em;
    }

    .cta-g2 {
      display: grid;
      grid-template-columns: 1.1fr 0.9fr;
      gap: 50px;
      align-items: center;
      text-align: left;
    }

    .cta-img-mid img {
      width: 100%;
      height: auto;
      display: block;
      border-radius: 8px;
    }

    .cta-btns-mid {
      display: flex;
      gap: 14px;
      justify-content: center;
    }

    .cta-btns-mid > a {
      flex: 1;
    }

    @media (max-width: 767px) {
      .cta-btns-mid {
        flex-direction: column;
      }
    }

    .cta-btn-phone,
    .cta-btn-line,
    .cta-btn-line-v2 {
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 14px 24px;
      border-radius: 50px;
      font-size: 22px;
      font-weight: 700;
      text-decoration: none;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
      transition: .3s;
    }

    .cta-btn-phone {
      background: #ff7800;
      color: #fff;
    }

    .cta-btn-line {
      background: #fff;
      color: var(--gp);
      border: 1px solid var(--gp);
    }

    .cta-btn-line-v2 {
      background: #06c755;
      color: #fff;
    }

    .cta-btn-phone:hover,
    .cta-btn-line:hover,
    .cta-btn-line-v2:hover {
      transform: translateY(-2px);
      box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
    }

    .icon-phone {
      display: inline-block;
      width: 1.1em;
      height: 1.1em;
      background-color: currentColor;
      -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.62,10.79C8.06,13.62 10.38,15.94 13.21,17.38L15.41,15.18C15.69,14.9 16.08,14.82 16.43,14.93C17.55,15.3 18.75,15.5 20,15.5C20.55,15.5 21,15.95 21,16.5V20C21,20.55 20.55,21 20,21C10.61,21 3,13.39 3,4C3,3.45 3.45,3 4,3H7.5C8.05,3 8.5,3.45 8.5,4C8.5,5.25 8.7,6.45 9.07,7.57C9.18,7.92 9.1,8.31 8.82,8.59L6.62,10.79Z'/%3E%3C/svg%3E") no-repeat center / contain;
      mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.62,10.79C8.06,13.62 10.38,15.94 13.21,17.38L15.41,15.18C15.69,14.9 16.08,14.82 16.43,14.93C17.55,15.3 18.75,15.5 20,15.5C20.55,15.5 21,15.95 21,16.5V20C21,20.55 20.55,21 20,21C10.61,21 3,13.39 3,4C3,3.45 3.45,3 4,3H7.5C8.05,3 8.5,3.45 8.5,4C8.5,5.25 8.7,6.45 9.07,7.57C9.18,7.92 9.1,8.31 8.82,8.59L6.62,10.79Z'/%3E%3C/svg%3E") no-repeat center / contain;
      vertical-align: middle;
      margin-right: 8px;
    }

    .icon-instagram {
      display: inline-block;
      width: 1.1em;
      height: 1.1em;
      background-color: currentColor;
      -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7.8 2h8.4C19.4 2 22 4.6 22 7.8v8.4a5.8 5.8 0 0 1-5.8 5.8H7.8C4.6 22 2 19.4 2 16.2V7.8A5.8 5.8 0 0 1 7.8 2m-.2 2A3.6 3.6 0 0 0 4 7.6v8.8A3.6 3.6 0 0 0 7.6 20h8.8a3.6 3.6 0 0 0 3.6-3.6V7.6A3.6 3.6 0 0 0 16.4 4H7.6m9.65 1.5a1.25 1.25 0 0 1 1.25 1.25A1.25 1.25 0 0 1 17.25 8 1.25 1.25 0 0 1 16 6.75a1.25 1.25 0 0 1 1.25-1.25M12 7a5 5 0 0 1 5 5 5 5 0 0 1-5 5 5 5 0 0 1-5-5 5 5 0 0 1 5-5m0 2a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3z'/%3E%3C/svg%3E") no-repeat center / contain;
      mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7.8 2h8.4C19.4 2 22 4.6 22 7.8v8.4a5.8 5.8 0 0 1-5.8 5.8H7.8C4.6 22 2 19.4 2 16.2V7.8A5.8 5.8 0 0 1 7.8 2m-.2 2A3.6 3.6 0 0 0 4 7.6v8.8A3.6 3.6 0 0 0 7.6 20h8.8a3.6 3.6 0 0 0 3.6-3.6V7.6A3.6 3.6 0 0 0 16.4 4H7.6m9.65 1.5a1.25 1.25 0 0 1 1.25 1.25A1.25 1.25 0 0 1 17.25 8 1.25 1.25 0 0 1 16 6.75a1.25 1.25 0 0 1 1.25-1.25M12 7a5 5 0 0 1 5 5 5 5 0 0 1-5 5 5 5 0 0 1-5-5 5 5 0 0 1 5-5m0 2 a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3z'/%3E%3C/svg%3E") no-repeat center / contain;
      vertical-align: middle;
      margin-right: 8px;
    }

    .icon-line {
      display: inline-block;
      width: 1.1em;
      height: 1.1em;
      background-color: currentColor;
      -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C6.48 2 2 4.84 2 8.32c0 1.82 1.2 3.44 3.12 4.6-.12.42-.44 1.54-.5 1.76-.08.3.1.3.22.22.1-.08 1.54-1.04 2.14-1.46.34.1.7.16 1.02.16 5.52 0 10-2.84 10-6.32S17.52 2 12 2z'/%3E%3C/svg%3E") no-repeat center / contain;
      mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C6.48 2 2 4.84 2 8.32c0 1.82 1.2 3.44 3.12 4.6-.12.42-.44 1.54-.5 1.76-.08.3.1.3.22.22.1-.08 1.54-1.04 2.14-1.46.34.1.7.16 1.02.16 5.52 0 10-2.84 10-6.32S17.52 2 12 2z'/%3E%3C/svg%3E") no-repeat center / contain;
      vertical-align: middle;
      margin-right: 8px;
    }

    /* 笏€笏€ RESPONSIVE 笏€笏€ */
    @media(max-width:767px) {

      .pcnav,
      .hcta {
        display: none;
      }

      #hbg {
        display: flex;
      }

      #spcta {
        display: flex;
      }

      #bt {
        bottom: 100px;
        right: 14px;
      }

      .sec {
        padding: 52px 20px;
      }

      .wrap {
        padding: 0;
      }

      .ttl {
        font-size: 28px !important;
      }

      .ptttl,
      .fttl,
      .vcq,
      .rttl {
        font-size: 20px !important;
      }



      .fv-img-pc {
        display: none;
      }

      .fv-img-sp {
        display: block;
      }


      .btn {
        padding: 14px 20px;
        font-size: .85rem;
        width: 100%;
      }

      .stg {
        grid-template-columns: 1fr 1fr;
      }

      .st {
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, .1);
      }

      .st:nth-child(odd) {
        border-right: 1px solid rgba(255, 255, 255, .15);
      }

      .stn {
        font-size: 1.55rem;
      }

      .about-g {
        grid-template-columns: 1fr;
        gap: 24px;
      }

      .ptg {
        grid-template-columns: 1fr;
      }

      .sfg {
        grid-template-columns: 1fr;
        gap: 22px;
      }

      .sfimg {
        max-width: 260px;
        margin: 0 auto;
      }

      .cta-ttl-mid {
        font-size: 24px;
        margin-bottom: 30px;
      }

      .cta-g2 {
        grid-template-columns: 1fr;
        gap: 30px;
        text-align: center;
      }

      .cta-btns-mid {
        gap: 14px;
      }

      .cta-btn-phone,
      .cta-btn-line,
      .cta-btn-line-v2 {
        font-size: 18px;
        padding: 12px 20px;
      }

      .acg {
        grid-template-columns: 1fr;
        gap: 24px;
      }

      .acmap {
        height: 220px;
      }

      .rbtns {
        flex-direction: column;
      }

      .rbtns .btn {
        width: 100%;
      }

      .wtxt {
        white-space: normal;
        font-size: 0.9rem;
      }

      .sp-br {
        display: inline;
      }

      .wcta-l {
        font-size: 28px !important;
      }
    }

    @media(min-width:768px) and (max-width:1023px) {
      .fv-h1 {
        font-size: 1.55rem;
      }

      .sfg {
        grid-template-columns: 220px 1fr;
        gap: 28px;
      }


    }

/* ── MENU ── */
#menu {
  background: linear-gradient(rgb(168 127 195 / 85%), rgb(168 127 195 / 85%)), url('../img/menubg.jpg') no-repeat center / cover;
  padding: 100px 20px;
}

#menu .ttl {
  color: #fff;
}

#menu .en {
  color: #e2d6ed;
}

.menu-featured {
  background: #fff;
  border: 3px solid var(--gld);
  border-radius: 20px;
  position: relative;
  padding: 40px;
  margin-bottom: 40px;
  box-shadow: 0 10px 30px rgba(212, 168, 67, 0.15);
}

.m-label {
  position: absolute;
  top: -15px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--gld);
  color: #fff;
  padding: 4px 24px;
  border-radius: 20px;
  font-weight: 900;
  font-size: 14px;
  letter-spacing: 0.1em;
  z-index: 2;
}

.m-featured-flex {
  display: flex;
  gap: 40px;
  align-items: center;
}

.m-featured-img {
  flex: 1;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(105, 68, 133, 0.2);
}

.m-featured-img img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
}

.m-featured-text {
  flex: 1;
}

.m-ttl {
  font-size: 24px;
  font-weight: 800;
  color: var(--gd);
  margin-bottom: 10px;
}

.m-price {
  font-size: 32px;
  font-weight: 900;
  color: var(--gp);
  line-height: 1;
}

.m-tax {
  font-size: 14px;
  font-weight: 500;
  color: var(--sub);
}

.m-note {
  display: inline-block;
  background: #fff185;
  color: var(--gd);
  font-weight: 800;
  font-size: 15px;
  padding: 4px 12px;
  margin-top: 15px;
  border-radius: 6px;
}

.m-desc {
  flex: 1;
  font-size: 16px;
  line-height: 1.8;
  color: var(--txt);
}

.m-caution {
  font-size: 14px;
  color: #e63946;
  margin-top: 12px;
  font-weight: 700;
}

.menu-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.menu-item {
  background: #fff;
  padding: 20px;
  border-radius: 16px;
  border: 1px solid var(--gl);
  display: flex;
  flex-direction: column;
}

.m-item-img {
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 10px;
  overflow: hidden;
}

.m-item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.m-item-body {
  padding: 15px 0 0;
}

.m-ttl-s {
  font-size: 18px;
  font-weight: 800;
  color: var(--gd);
  margin-bottom: 8px;
}

.m-price-s {
  font-size: 24px;
  font-weight: 900;
  color: var(--gm);
  margin-bottom: 15px;
}

.m-desc-s {
  font-size: 15px;
  line-height: 1.7;
  color: var(--sub);
}

@media (max-width: 1023px) {
  .m-featured-flex {
    flex-direction: column;
    gap: 30px;
  }
  .m-featured-img {
    width: 100%;
  }
}

@media (max-width: 767px) {
  .menu-grid {
    grid-template-columns: 1fr;
  }
  .menu-featured {
    padding: 24px 16px;
  }
  .m-ttl {
    font-size: 20px;
  }
  .m-price {
    font-size: 28px;
  }
}

/* ── GALLERY SLIDER ── */
.gallery-sec {
  background: var(--gd);
  padding: 80px 0;
  overflow: hidden;
}

.gallery-slider {
  width: 100%;
}

.gallery-track {
  display: flex;
  gap: 20px;
  width: max-content;
  animation: galleryScroll 40s linear infinite;
}

.gallery-track img {
  width: 350px;
  height: 240px;
  object-fit: cover;
  border-radius: 12px;
  flex-shrink: 0;
  box-shadow: 0 10px 25px rgba(0,0,0,0.3);
}

@keyframes galleryScroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(calc(-350px * 4 - 20px * 4)); }
}

@media (max-width: 767px) {
  .gallery-sec {
    padding: 50px 0;
  }
  .gallery-track img {
    width: 260px;
    height: 180px;
  }
  @keyframes galleryScroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(calc(-260px * 4 - 20px * 4)); }
  }
}

/* ── MESSAGE ── */
#message {
  background-color: #fdfaf3; /* やさしいクリーム色のベース */
  background-image: 
    radial-gradient(rgba(205, 168, 95, 0.35) 2.5px, transparent 2.5px),
    radial-gradient(rgba(205, 168, 95, 0.35) 2.5px, transparent 2.5px);
  background-size: 30px 30px;
  background-position: 0 0, 15px 15px; /* ドットを互い違いに配置 */
  padding: 100px 20px;
}

#message .msg-box {
  background: rgba(255, 255, 255, 0.4);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  padding: 60px 50px;
  border-radius: 16px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
  margin: 0 auto;
}

@media (max-width: 767px) {
  #message {
    padding: 80px 16px;
  }
  #message .msg-box {
    padding: 40px 20px;
  }
  footer {
    padding-bottom: 80px;
  }
}

/* =========================================
   FV-NEW TWIILWIND EXTENSIONS (Animation & Layout)
   ========================================= */

.fv-section-new {
    position: relative;
    width: 100%;
    height: 55vh;
    min-height: 400px;
    background-color: #f9f7f2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0;
    overflow: hidden;
}

.fv-slideshow {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
}

/* White overlay for readability */
.fv-new-overlay {
    position: absolute;
    inset: 0;
    background-color: rgba(255, 255, 255, 0.4);
    z-index: 1;
}

.fv-slide {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: 0;
    z-index: 0;
    animation: fv-fade 32s infinite;
}

.fv-slide:nth-child(1) { animation-delay: 0s; }
.fv-slide:nth-child(2) { animation-delay: 4s; }
.fv-slide:nth-child(3) { animation-delay: 8s; }
.fv-slide:nth-child(4) { animation-delay: 12s; }
.fv-slide:nth-child(5) { animation-delay: 16s; }
.fv-slide:nth-child(6) { animation-delay: 20s; }
.fv-slide:nth-child(7) { animation-delay: 24s; }
.fv-slide:nth-child(8) { animation-delay: 28s; }

@keyframes fv-fade {
    0% { opacity: 0; transform: scale(1.0); }
    3% { opacity: 1; }
    10% { opacity: 1; transform: scale(1.05); }
    13% { opacity: 0; }
    100% { opacity: 0; }
}

.fv-content-wrapper {
    position: relative;
    z-index: 10;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding-bottom: 60px;
}

.fv-content-wrapper .fv-catch {
    font-weight: 800;
    color: #333;
    text-shadow: 0 0 15px rgba(255, 255, 255, 0.9);
}

.fv-content-wrapper .fv-sub {
    color: #444;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.9);
    font-weight: 500;
}

/* Wave Animation Container */
.fv-section-new .wave-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 80px;
    overflow: hidden;
    line-height: 0;
    z-index: 30;
}

.fv-section-new .wave-svg {
    position: relative;
    display: block;
    width: 300%;
    height: 100%;
    margin-left: -100%;
}

@media (min-width: 768px) {
    .fv-section-new .wave-container {
        height: 150px;
    }
}

/* Base style for all paths */
.fv-section-new .wave-svg path {
    transform-origin: center top;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}

/* Layer 1 (Lightest, Back) */
.fv-section-new .wave-svg path:nth-child(1) {
    animation-name: wave-flow-1;
    animation-duration: 8s;
    opacity: 0.3;
}

/* Layer 2 (Medium, Middle) */
.fv-section-new .wave-svg path:nth-child(2) {
    animation-name: wave-flow-2;
    animation-duration: 6s;
    animation-delay: -2s;
    opacity: 0.5;
}

/* Layer 3 (Solid, Front) */
.fv-section-new .wave-svg path:nth-child(3) {
    animation-name: wave-flow-3;
    animation-duration: 5s;
    animation-delay: -1s;
}

@keyframes wave-flow-1 {
    0% { transform: scaleY(1) translateX(10%); }
    100% { transform: scaleY(1.1) translateX(-10%); }
}

@keyframes wave-flow-2 {
    0% { transform: scaleY(1.1) translateX(15%); }
    100% { transform: scaleY(1.2) translateX(-15%); }
}

@keyframes wave-flow-3 {
    0% { transform: scaleY(1) translateX(8%); }
    100% { transform: scaleY(1.1) translateX(-8%); }
}

@media (min-width: 768px) {
    .fv-section-new {
        height: 85vh;
        min-height: 650px;
    }
}

@media (max-width: 767px) {
    .fv-section-new {
        height: 75vh !important;
        min-height: 500px;
        display: block; /* Remove flex column */
        position: relative;
    }
    .fv-content-wrapper {
        background-color: transparent !important;
        position: absolute !important;
        inset: 0;
        z-index: 20;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding-bottom: 0;
    }
    .fv-slideshow {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        z-index: 1;
        opacity: 1;
        animation: none; /* Show immediately */
    }
    .wave-container {
        top: 0;
        z-index: 30;
        height: 50px;
    }
    .fv-slide {
        animation: fv-fade-mobile 32s infinite !important;
    }
    .fv-slide:nth-child(1) { animation-delay: 0s !important; }
    .fv-slide:nth-child(2) { animation-delay: 4s !important; }
    .fv-slide:nth-child(3) { animation-delay: 8s !important; }
    .fv-slide:nth-child(4) { animation-delay: 12s !important; }
    .fv-slide:nth-child(5) { animation-delay: 16s !important; }
    .fv-slide:nth-child(6) { animation-delay: 20s !important; }
    .fv-slide:nth-child(7) { animation-delay: 24s !important; }
    .fv-slide:nth-child(8) { animation-delay: 28s !important; }
}

@keyframes fv-fade-mobile {
    0% { opacity: 0; }
    3% { opacity: 1; }
    10% { opacity: 1; }
    13% { opacity: 0; }
    100% { opacity: 0; }
}

@keyframes simple-fade-in {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}