@charset "utf-8";
/* CSS Document */

html {
  scroll-behavior: smooth;
}

  :root{
    --pink:#e89aaf;
    --pink-deep:#d4708c;
    --pink-soft:#fbeef2;
    --pink-bg:#fdf6f8;
    --text:#3d3a3c;
    --text-light:#6f6a6d;
    --line:#f0dde3;
    --white:#ffffff;
    --accent:#c95c7c;
    --radius:18px;
    --shadow:0 6px 24px rgba(201,92,124,.10);
    --dejisuma: #0079d1; 
    --dejisuma-bg:#e6f2fa;  
      
    --main:#c98ba0;        /* メインカラー（ローズピンク） */
    --main-dark:#a86a82;
    --accent:#f6e7ec;      /* 淡いピンク背景 */
    --accent2:#fbf4f6;
    --sub:#7a6f75;     
  }
  *{box-sizing:border-box;margin:0;padding:0;}
    img{max-width: 100%; height: auto;}    

@media screen and (min-width:641px){.smp{display: none!important;}}
@media screen and (max-width:640px){.pc{display: none!important;}}
    
  body{
    font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--text);
    background:var(--pink-bg);
    line-height:1.85;
    font-size:16px;
    -webkit-text-size-adjust:100%;
  }
  .wrap{max-width:760px;margin:0 auto;background:var(--white);overflow:hidden; padding: 0 24px 30px;}


@media screen and (max-width:640px){
    .wrap{padding: 0;}
}

  /* ===== Hero ===== */
  .hero{
    max-width:760px;
    margin: 0 auto;
    position:relative;
    background:linear-gradient(160deg,#f6c6d4 0%,#e89aaf 55%,#d4708c 100%);
    color:#fff;
    padding:54px 24px 60px;
    text-align:center;
    overflow:hidden;
  }
  .hero::before,.hero::after{
    content:"";position:absolute;border-radius:50%;
    background:rgba(255,255,255,.16);
  }
  .hero::before{width:180px;height:180px;top:-60px;right:-50px;}
  .hero::after{width:120px;height:120px;bottom:-40px;left:-30px;}
  .hero h1.clinic{
    font-size:13px;letter-spacing:.15em;opacity:.95;margin-bottom:5px;
    position:relative;z-index:1;
  }
.hero .logo-kanuki{width: 70px; margin: auto;}
  .hero h2{
    font-size:30px;font-weight:700;letter-spacing:.04em;
    position:relative;z-index:1;margin-bottom:14px;line-height:1.5;
  }
  .hero .sub{
    font-size:16px;font-weight:500;line-height:1.7;
    position:relative;z-index:1;opacity:.97;
  }
  .hero .sub span{display:block;}

  /* ===== Section common ===== */
  section{padding:46px 22px;}
  .sec-head,.sec-head-dejisuma{text-align:center;margin-bottom:30px;}
  .sec-head .en{
    display:block;font-size:12px;letter-spacing:.2em;color:var(--pink);
    font-weight:700;margin-bottom:8px;
  }
  .sec-head h2{
    font-size:23px;font-weight:700;color:var(--text);
    position:relative;display:inline-block;padding-bottom:12px;
  }
  .sec-head h2::after{
    content:"";position:absolute;bottom:0;left:50%;transform:translateX(-50%);
    width:48px;height:3px;border-radius:3px;background:var(--pink);
  }
  .sec-head-dejisuma .en{
    display:block;font-size:12px;letter-spacing:.2em;color:var(--dejisuma);
    font-weight:700;margin-bottom:8px;
  }
 .sec-head-dejisuma h2{
    font-size:23px;font-weight:700;color:var(--text);
    position:relative;display:inline-block;padding-bottom:12px;
  }
 .sec-head-dejisuma h2::after{
    content:"";position:absolute;bottom:0;left:50%;transform:translateX(-50%);
    width:48px;height:3px;border-radius:3px;background:var(--dejisuma);
  }

  p{margin-bottom:14px;}
  .lead{text-align:center;color:var(--text-light);font-size:15px;}

  /* ===== Intro text ===== */
  .intro{background:var(--white);text-align:center;}
  .intro p{text-align:left;}

  /* ===== CTA Button ===== */
  .cta-btn{
    display: block;
    text-decoration: none;
    text-align: center;
    background: linear-gradient(135deg,#0079d1,#0079d1);
    color: #fff;
    font-size: 19px;
    font-weight: 700;
    letter-spacing: .03em;
    padding: 18px 20px 15px;
    border-radius: 50px;
    box-shadow: 0 8px 22px rgba(178,179,187,0.35);
    transition: transform .15s,box-shadow .15s;
    max-width: 530px;
    width: 95%;  
    margin: auto;
    position: relative;
    -webkit-box-shadow: 0 8px 22px rgba(178,179,187,0.35);
  }
  .cta-btn:active{transform:translateY(2px);box-shadow:0 4px 12px rgba(212,112,140,.3);}
  .cta-btn small{display:block;font-size:12px;font-weight:500;opacity:.95;letter-spacing:.05em;}
  .cta-btn .arrow{margin-left:6px;}
  .cta-wrap{margin:30px 0;}

  /* ===== Box / Card ===== */
  .box{
    background:var(--pink-soft);border-radius:var(--radius);
    padding:24px 20px;margin-bottom:18px;
  }
  .box h3{font-size:18px;color:var(--accent);margin-bottom:10px;}

  /* ===== Digisuma block ===== */
  .digisuma{background:var(--dejisuma-bg);}
  .digisuma .card{
    background:#fff;border-radius:var(--radius);padding:26px 4%;
    box-shadow:var(--shadow);text-align:center;     
  }
  .app-visual{
    width:96px;height:96px;margin:0 auto 18px;
    display:flex;align-items:center;justify-content:center;
  }
  .app-visual svg{width:50px;height:50px;}
  .digisuma .card h3{font-size:19px;margin-bottom:8px;color:var(--text);}
  .digisuma .card p{font-size: clamp(14px,1.4vw,16px);}
  .store-btns{
    display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:22px;
  }
  .store-btn{
    display:flex;align-items:center;gap:9px;max-width:180px; width: 40%;
  }
  .store-btn:active{opacity:.8;}
  .store-btn svg{width:24px;height:24px;flex-shrink:0;}
  .store-btn .txt{text-align:left;line-height:1.25;}
  .store-btn .txt small{display:block;font-size:10px;opacity:.85;}
  .store-btn .txt b{font-size:15px;font-weight:600;}

  /* ===== Recommend list ===== */
  .reco-list{list-style:none;}
  .reco-list li{
    background:#fff;border:1px solid var(--line);border-radius:14px;
    padding:14px 16px 14px 48px;margin-bottom:11px;position:relative;
    font-size:15px;
  }
  .reco-list li::before{
    content:"";position:absolute;left:16px;top:50%;transform:translateY(-50%);
    width:20px;height:20px;border-radius:50%;
    background:var(--pink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/12px no-repeat;
  }

  /* ===== Consult topics ===== */
  .topics{display:grid;grid-template-columns:1fr;gap:14px;}
  .topic{
    background:#fff;border-radius:var(--radius);padding:20px 20px 20px 20px;
    border:1px solid var(--line);box-shadow:0 3px 12px rgba(201,92,124,.05);
  }
  .topic .tt{
    display:flex;align-items:center;gap:10px;font-size:17px;font-weight:700;
    color:var(--accent);margin-bottom:8px;
  }
  .topic .ico{
    width:34px;height:34px;border-radius:10px;background:var(--pink-soft);
    display:flex;align-items:center;justify-content:center;flex-shrink:0;
  }
  .topic .ico svg{width:20px;height:20px;stroke:var(--pink-deep);}
  .topic p{font-size:14.5px;color:var(--text-light);margin:0;}
  .note{
    background:#fff7e6;border-left:4px solid #f0c36d;border-radius:8px;
    padding:14px 16px;font-size:14px;color:#7a5c1e;margin-top:18px;
  }

  /* ===== Patient tabs ===== */
  .patient-block{margin-bottom:22px;}
  .patient-block .ribbon{
    display:inline-block;background:var(--pink);color:#fff;
    font-size:14px;font-weight:700;padding:7px 18px;border-radius:50px;
    margin-bottom:14px;
  }
  .patient-block.second .ribbon{background:var(--pink-deep);}
  .patient-block .body{
    background:var(--pink-soft);border-radius:var(--radius);padding:22px 20px;
  }
  .patient-block .body ul{margin:10px 0 0 0;padding-left:0;list-style:none;}
  .patient-block .body ul li{
    padding-left:22px;position:relative;margin-bottom:8px;font-size:15px;
  }
  .patient-block .body ul li::before{
    content:"";position:absolute;left:4px;top:11px;width:7px;height:7px;
    border-radius:50%;background:var(--pink-deep);
  }

  /* ===== Caution (face-to-face) ===== */
  .caution{background:#fff4f4;}
  .caution .sec-head .en{color:#d9534f;}
  .caution .sec-head h2::after{background:#e57373;}
  .caution-card{
    background:#fff;border:1.5px solid #f3c0c0;border-radius:var(--radius);
    padding:22px 20px;margin-bottom:16px;
  }
  .caution-card h3{
    font-size:16px;color:#c0392b;margin-bottom:10px;display:flex;align-items:center;gap:8px;
  }
  .caution-card h3 svg{width:22px;height:22px;}
  .emergency{
    background:#c0392b;color:#fff;border-radius:var(--radius);
    padding:20px;text-align:center;font-weight:600;font-size:15px;
  }

  /* ===== Digisuma features ===== */
  .features{display:grid;grid-template-columns:1fr;gap:12px;margin-top:8px;}
  .feature{
    background:#fff;border-radius:14px;padding:16px 18px;display:flex;gap:14px;
    align-items:flex-start;border:1px solid var(--line);
  }
  .feature .fico{
    width:40px;height:40px;border-radius:10px;background:var(--pink-soft);
    display:flex;align-items:center;justify-content:center;flex-shrink:0;
  }
  .feature .fico svg{width:22px;height:22px;stroke:var(--pink-deep);}
  .feature b{font-size:15px;color:var(--text);display:block;margin-bottom:3px;}
  .feature span{font-size:13.5px;color:var(--text-light);}

  /* ===== Need items ===== */
  .need-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
  .need-grid .item{
    background:#fff;border:1px solid var(--line);border-radius:12px;
    padding:12px 10px;text-align:center;font-size:13.5px;font-weight:600;
    display:flex;flex-direction:column;align-items:center;gap:6px;
  }
  .need-grid .item svg{width:24px;height:24px;stroke:var(--pink-deep);}

  /* ===== Fee / Notice ===== */
  .fee-box{display:grid;grid-template-columns:1fr;gap:14px;}
  .fee-card{background:#fff;border-radius:var(--radius);padding:20px;border:1px solid var(--line);}
  .fee-card .tag{
    display:inline-block;background:var(--pink);color:#fff;font-size:13px;
    font-weight:700;padding:4px 14px;border-radius:50px;margin-bottom:10px;
  }
  .fee-card.jihi .tag{background:var(--pink-deep);}
  .fee-card p{font-size:14.5px;margin:0;color:var(--text-light);}

  .notice-list{list-style:none;background:#fff;border-radius:var(--radius);padding:8px 6px;border:1px solid var(--line);}
  .notice-list li{
    padding:13px 14px 13px 40px;position:relative;font-size:14.5px;
    border-bottom:1px dashed var(--line);
  }
  .notice-list li:last-child{border-bottom:none;}
  .notice-list li::before{
    content:"!";position:absolute;left:12px;top:13px;
    width:20px;height:20px;border-radius:50%;background:var(--pink);
    color:#fff;font-size:13px;font-weight:700;text-align:center;line-height:20px;
  }

  /* ===== FAQ ===== */
  .faq details{
    background:#fff;border-radius:14px;margin-bottom:12px;
    border:1px solid var(--line);overflow:hidden;
  }
  .faq summary{
    list-style:none;cursor:pointer;padding:18px 50px 18px 50px;
    font-size:15.5px;font-weight:600;color:var(--text);position:relative;
  }
  .faq summary::-webkit-details-marker{display:none;}
  .faq summary::before{
    content:"Q";position:absolute;left:16px;top:16px;
    width:26px;height:26px;border-radius:50%;background:var(--pink);
    color:#fff;font-weight:700;text-align:center;line-height:26px;font-size:15px;
  }
  .faq summary::after{
    content:"";position:absolute;right:20px;top:50%;
    width:10px;height:10px;border-right:2px solid var(--pink-deep);
    border-bottom:2px solid var(--pink-deep);
    transform:translateY(-70%) rotate(45deg);transition:transform .2s;
  }
  .faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg);}
  .faq .answer{
    padding:0 20px 20px 50px;font-size:14.5px;color:var(--text-light);position:relative;
  }
  .faq .answer::before{
    content:"A";position:absolute;left:16px;top:0;
    width:26px;height:26px;border-radius:50%;background:var(--pink-soft);
    color:var(--pink-deep);font-weight:700;text-align:center;line-height:26px;font-size:15px;
  }

  /* ===== Closing message ===== */
  .closing{
    background:linear-gradient(160deg,#fbeef2,#f6d8e1);text-align:center;
  }
  .closing h2{font-size:21px;color:var(--accent);margin-bottom:18px;line-height:1.6;}
  .closing p{font-size:15px;color:var(--text);text-align:left;}
  .closing .quote{
    background:#fff;border-radius:var(--radius);padding:20px;
    font-size:14.5px;color:var(--text-light);margin:18px 0;text-align:left;
    box-shadow:var(--shadow);
  }

  /* ===== Sticky bottom CTA ===== */
  .sticky-cta{
    position:fixed;bottom:0;left:0;right:0;z-index:100;
    background:rgba(255,255,255,.96);backdrop-filter:blur(6px);
    padding:10px 16px;box-shadow:0 -4px 16px rgba(0,0,0,.08);
    max-width:640px;margin:0 auto;
  }
  .sticky-cta a{
    display:block;text-decoration:none;text-align:center;
    background:linear-gradient(135deg,#e88aa6,#d4708c);color:#fff;
    font-size:17px;font-weight:700;padding:15px;border-radius:50px;
    box-shadow:0 6px 16px rgba(212,112,140,.4);
  }

    
/* ===== おすすめの方 ===== */
.recommend-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:20px;
  position:relative;
}

.rec-card{
  background:#fff;
  border-radius:var(--radius);
  padding:16px 25px;
  box-shadow:var(--shadow);
  display:flex;
  gap:16px;
  align-items:center;
  border:1px solid var(--line);
  transition:.25s;
}

.rec-card:hover{
  transform:translateY(-4px);
}

.rec-card .ico{
  flex:0 0 44px;
  width:44px;
  height:44px;
  border-radius:50%;
  background:var(--accent);
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--main-dark);
  font-size:1.2rem;
}

.rec-card p{
  font-size:.95rem;
  margin:0;
}


@media(max-width:640px){
  .recommend-grid{grid-template-columns:repeat(1,1fr);gap:20px;}   
  .rec-card{padding:15px 20px;line-height: 1.4em;}      
}


  /* ===== ご相談内容 ===== */
  .consult-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
  .consult-card{
    background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);
    border:1px solid var(--line);transition:.25s;
  }
  .consult-card:hover{transform:translateY(-5px);box-shadow:0 14px 30px rgba(180,130,150,.18);}
  .consult-card .top{background:linear-gradient(135deg,var(--main) 0%,var(--main-dark) 100%);padding:5px 24px 8px; color:#fff; text-align: center;}
  .consult-card .top .ico{font-size:1.7rem;margin-bottom:0;}
  .consult-card .top h3{font-size:1.15rem;font-weight:700;}
  .consult-card .body{padding:15px 22px;font-size:.92rem;}
  .note-inline{
    margin-top:30px;text-align:center;font-size:.8rem;
    background:#fff;border:1px dashed var(--main);border-radius:14px;padding:10px 2%;
  }

@media(max-width:640px){
  .consult-grid{grid-template-columns:repeat(1,1fr);gap:20px;}    
}


  /* ===== 受診できる方 ===== */
  .target-grid{display:grid;gap:20px;}
  .target-box{background:#fff;border-radius:var(--radius);padding:36px 34px;box-shadow:var(--shadow);border-top:5px solid var(--main);border:1px solid var(--line);}
  .target-box h3{font-size:1.25rem;font-weight:700;margin-bottom:18px;color:var(--main-dark);}
  .target-box ul{list-style:none;}
  .target-box li{position:relative;padding-left:26px;margin-bottom:5px;font-size:.95rem;color:var(--main-dark);}
  .target-box li::before{content:"✓";position:absolute;left:0;color:var(--main);font-weight:700;}
  .target-box p{font-size:.92rem;margin-bottom:8px;}

  /* ===== 対面案内（注意） ===== */
  .alert{
    background:#fff7f4;border:1.5px solid #f0c9b8;border-radius:var(--radius);
    padding:36px 32px 36px 38px;max-width:840px;margin:0 auto;
  }
  .alert h3{color:#c2603e;font-size:1.15rem;margin-bottom:16px;display:flex;align-items:center;gap:10px;}
  .alert p{font-size:.90rem;margin-bottom:12px; line-height: 1.75em;}
  .alert .strong{color:#c2603e;font-weight:700;}

@media(max-width:640px){
    .alert{padding:30px 20px 30px 22px;}
}


  /* ===== STEP 流れ ===== */
  .steps{position:relative;max-width:840px;margin:0 auto;}
  .step{display:flex;gap:10px;padding-bottom:40px;position:relative;}
  .step:not(:last-child)::before{
    content:"";position:absolute;left:27px;top:56px;bottom:0;width:2px;background:var(--line);
  }
  .step .num{
    flex:0 0 56px;width:56px;height:56px;border-radius:50%;
    background:var(--main);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;
    font-weight:700;box-shadow:var(--shadow);z-index:2;line-height:1.1;
  }
  .step .num small{font-size:.55rem;letter-spacing:.1em;font-weight:400;}
  .step .num b{font-size:1.3rem;}
  .step .txt{background:#fff;border-radius:var(--radius);padding:22px 26px;box-shadow:var(--shadow);flex:1;border:1px solid var(--line);}
  .step .txt h4{font-size:1.1rem;margin-bottom:8px;color:var(--main-dark);}
  .step .txt p{font-size:.90rem;}

@media(max-width:640px){
    .step .txt{padding:15px 20px;}   
    .step .txt p{font-size:.82rem; line-height: 1.8em;}
    .step .store-btns{margin-top:10px;}    
}


  /* ===== お薬の受け取り / アプリ機能 ===== */
  .mini-grid{display:grid;grid-template-columns:repeat(1,1fr);gap:22px;margin-top:10px;}
  .mini-card{background:#fff;border-radius:var(--radius);padding:28px 26px;box-shadow:var(--shadow);text-align:center;border:1px solid var(--line);}
  .mini-card .ico{width:56px;height:56px;border-radius:50%;background:var(--accent);margin:0 auto 16px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:var(--main-dark);}
  .mini-card h4{font-size:1.05rem;margin-bottom:10px;color:var(--main-dark);}
  .mini-card p{font-size:.88rem;}

/* チェックリスト（受診に必要なもの） */
.check-list{
  list-style:none; padding:0; margin:0;
  display:grid; grid-template-columns:repeat(2,1fr); gap:14px 28px;
  padding-bottom: 20px;
}
.check-list li{
  position:relative; padding:14px 14px 14px 46px;
  background:#fff; border-radius:12px;
  box-shadow:0 2px 10px rgba(0,0,0,.04);
  font-size:15px;
  border:1px solid var(--line);    
}
.check-list li::before{
  content:"✓"; position:absolute; left:14px; top:50%; transform:translateY(-50%);
  width:22px; height:22px; line-height:22px; text-align:center;
  background:var(--main,#e89bb0); color:#fff; border-radius:50%; font-size:13px; font-weight:700;
}

@media(max-width:640px){
    .mini-card{padding:20px 15px;}  
    .check-list{gap:8px 28px;padding-bottom: 0;}
    .check-list li{padding:10px 14px 10px 46px;}
}


/* 費用 */
.fee-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
.fee-card{
  background:#fff; border-radius:16px; padding:28px;
  box-shadow:0 4px 18px rgba(0,0,0,.05);
  border-top:4px solid var(--main,#e89bb0);
}
.fee-card h4{ margin:0 0 10px; font-size:18px; }
.fee-card p{ margin:0; color:#555; line-height:1.7; }

/* 注意事項 */
.note-list{ list-style:none; padding:0; margin:0; }
.note-list li{
  position:relative; padding:12px 12px 12px 32px;
  border-bottom:1px dashed #e3d3d8; line-height:1.7; color:#444;
    font-size: .9rem;
}
.note-list li::before{
  content:"！"; position:absolute; left:0; top:12px;
  width:20px; height:20px; line-height:20px; text-align:center;
  background:#f6e7eb; color:var(--main,#d77a93); border-radius:50%; font-size:12px; font-weight:700;
}

.app{background:var(--dejisuma-bg);}
.app .card-grid{display:grid;grid-template-columns:repeat(1,1fr);gap:22px;margin-top:10px;}
.app .card{
    background:#fff;border-radius:var(--radius);padding:26px 4%;
    box-shadow:var(--shadow);text-align:center;     
  }
.app h4{font-size: 19px;}
.app .card p{font-size: clamp(14px,1.4vw,16px);}

/* レスポンシブ */
@media(max-width:640px){
  .check-list, .fee-grid{ grid-template-columns:1fr; }
}

/* 幅を絞ったwrap */
.wrap.narrow{ max-width:780px; }

/* FAQ アコーディオン */
.faq-list{ display:flex; flex-direction:column; gap:14px; }
.faq-item{
  background:#fff; border-radius:14px; overflow:hidden;
  box-shadow:0 3px 14px rgba(0,0,0,.05);
}
.faq-item summary{
  list-style:none; cursor:pointer; position:relative;
  padding:20px 56px 20px 24px; font-weight:700; font-size:16px; color:#333;
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::before{
  content:"Q"; margin-right:12px; color:var(--main,#d77a93); font-weight:800;
}
.faq-item summary::after{
  content:"＋"; position:absolute; right:22px; top:50%; transform:translateY(-50%);
  color:var(--main,#d77a93); font-weight:700; transition:transform .25s;
}
.faq-item[open] summary::after{ content:"－"; }
.faq-body{
  padding:0 24px 22px 24px; color:#555; line-height:1.8;
  animation:fadeIn .3s ease;
}
.faq-body p{ margin:0; padding-left:26px; border-left:3px solid #f0dde2; }
@keyframes fadeIn{ from{opacity:0; transform:translateY(-6px);} to{opacity:1; transform:none;} }

/* CTA */
.cta{
  background:linear-gradient(135deg,#f6e7eb 0%,#fbf2f5 100%);
}
.cta-inner{
  text-align:center;
  background:#fff; border-radius:24px; padding:35px 40px;
  box-shadow:0 12px 40px rgba(215,122,147,.12);
}
.cta-inner .en{
  display:block; color:var(--main,#d77a93); letter-spacing:.15em;
  font-size:13px; font-weight:600; margin-bottom:8px;
}

.cta-inner h2{ font-size:26px; margin:0 0 22px; color:#333; }
.cta-inner .lead{ color:#555; line-height:1.9; margin:0 auto 20px; max-width:600px; }
.voice-list{
  list-style:none; padding:0; margin:0 auto 24px; max-width:520px;
  display:flex; flex-direction:column; gap:12px;
}
.voice-list li{
  background:#faf1f4; border-radius:999px; padding:14px 24px;
  color:#a85a72; font-weight:600; font-size:15px;
}

/* レスポンシブ */
@media(max-width:640px){
  .cta-inner{ padding:36px 22px; }
  .cta-inner h2{ font-size:22px; }
  .faq-item summary{ font-size:15px; padding:18px 50px 18px 18px; }
}

/* ========== フッター ========== */
 footer{
    max-width:760px;
    margin: 0 auto;
    position:relative;
    background:linear-gradient(160deg,#d4708c 0%,#e89aaf 55%,#f6c6d4 100%);
    overflow:hidden;
    color: #fff;
  }
   footer::before, footer::after{
    content:"";position:absolute;border-radius:50%;
    background:rgba(255,255,255,.16);
  }
   footer::before{width:180px;height:180px;top:-60px;right:-50px;}
   footer::after{width:120px;height:120px;bottom:-40px;left:-30px;}

footer a{color: #fff;}

/* 本体 */
.footer-main{padding:40px 6%; }

/* クリニック情報 */
.f-logo{
  position:relative; margin:0 0 14px;
  display:flex; align-items:center;   /* ← 上下中央に揃える */
}
.f-logo span.logo{
  width:40px; margin-right:5px;
  display:flex; align-items:center;   /* ← 画像の縦位置も安定 */
  flex-shrink:0;                      /* ← 画像が潰れないように */
}
.f-logo span.logo img{
  width:100%; display:block;          /* ← 画像下の余白を消す */
}
.f-logo span.name{
  font-size:22px; font-weight:600; letter-spacing:.04em;
}
.f-info{line-height: 1.5em; font-size: 85%;}

/* コピーライト */
.footer-copy{
  background:var(--pink-deep); text-align:center; padding:18px 0;
}
.footer-copy small{color:#fff; font-size:12px; letter-spacing:.04em; }

/* レスポンシブ */

@media(max-width:640px){
  .footer-main{ padding:44px 5% 32px; }
  .f-logo{ font-size:20px;}
  .footer-copy{padding:10px 0;}
}


/* ページトップ */
.page-top {
  position: fixed;
  right: 10px;
  bottom: 60px;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color:var(--pink);
  z-index: 9999;
  opacity: 0.85;
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.page-top::before {
  content: "";
  position: absolute;
  top: 20px;
  left: 16px;
  width: 16px;
  height: 16px;
  border-top: 4px solid #fff;
  border-left: 4px solid #fff;
  transform: rotate(45deg);
}

.page-top:hover {
  opacity: 1;
  transform: translateY(-4px);
}


/* ========== フッター追従固定バー ========== */
.fixed-bar{
  position:fixed;
  left:0; right:0; bottom:0;
  z-index:1000;
  display:flex;
  box-shadow:0 -3px 12px rgba(0,0,0,.12);
}
.fixed-bar .fb-item{
  flex:1;
  display:flex; align-items:center; justify-content:center; gap:10px;
  padding:12px 8px;
  text-decoration:none; color:#fff;
  transition:opacity .2s;
}
.fixed-bar .fb-item:hover{ opacity:.88; }

/* 電話 */
.fb-tel{ background:var(--main,#d77a93); }
/* 予約 */
.fb-reserve{ background:var(--dejisuma); }

.fb-ico{ font-size:22px; line-height:1; flex-shrink:0; }
.fb-txt{ display:flex; flex-direction:column; line-height:1.3; }
.fb-sub{ font-size:11px; opacity:.9; letter-spacing:.02em; }
.fb-main{ font-size:17px; font-weight:800; letter-spacing:.02em; }

/* ▼ PCでは非表示（スマホ・タブレットのみ表示） */
@media(min-width:769px){
  .fixed-bar{ display:none; }
}
/* ▼ 追記：初期状態は非表示（下にずらして透明に） */
.fixed-bar{
  transform:translateY(100%);   /* 下に隠す */
  opacity:0;
  visibility:hidden;
  transition:transform .4s ease, opacity .4s ease, visibility .4s;
}

/* ▼ 追記：表示状態（JSでこのクラスを付与） */
.fixed-bar.is-show{
  transform:translateY(0);
  opacity:1;
  visibility:visible;
}


/* スマホ微調整 */
@media(max-width:380px){
  .fixed-bar .fb-item{ gap:6px; padding:10px 6px; }
  .fb-ico{ font-size:19px; }
  .fb-main{ font-size:15px; }
  .fb-sub{ font-size:10px; }
}