/* 症状別施術一覧ページ */

.symptom-index-page{
--green:#63ad45;
--dark:#214b2c;
--light:#edf7e9;
--pale:#f7fbf5;
--text:#303630;
--muted:#626b63;
--border:#d9e8d4;
--shadow:0 12px 34px rgba(36,75,39,.10);
width:100%;
max-width:none;
margin:0;
padding:0 0 100px;
background:#fff;
color:var(--text);
font-family:"Noto Sans JP","Yu Gothic",sans-serif;
}

.symptom-index-page *{box-sizing:border-box;}
.si-container{width:min(100% - 40px,1120px);margin-inline:auto;}
.symptom-index-page img{display:block;max-width:100%;height:auto;}

.si-breadcrumb{padding:13px 0;background:#f2f6f0;font-size:13px;}
.si-breadcrumb .si-container{display:flex;gap:8px;align-items:center;}
.si-breadcrumb a{color:#477a38;text-decoration:none;}

.si-hero{
padding:80px 0 70px;
background:radial-gradient(circle at 88% 12%,rgba(99,173,69,.18),transparent 36%),linear-gradient(135deg,#f3faef,#fff 68%);
text-align:center;
}

.si-eyebrow{margin:0 0 10px;color:var(--green);font-size:14px;font-weight:900;letter-spacing:.18em;}
.si-hero h1{margin:0;color:var(--dark);font-size:clamp(36px,6vw,58px);line-height:1.4;}
.si-hero__lead{max-width:760px;margin:24px auto 0;color:var(--muted);font-size:18px;line-height:2;}

.si-section{padding:82px 0;}
.si-heading{margin-bottom:42px;text-align:center;}
.si-heading>p{margin:0 0 7px;color:var(--green);font-size:13px;font-weight:900;letter-spacing:.17em;}
.si-heading h2{margin:0;color:var(--dark);font-size:clamp(28px,4vw,42px);}

.si-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;}

.si-card{
overflow:hidden;
background:#fff;
border:1px solid var(--border);
border-radius:18px;
box-shadow:var(--shadow);
transition:.25s;
}

.si-card:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(36,75,39,.15);}
.si-card__link{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none;}
.si-card__image{overflow:hidden;margin:0;background:var(--light);}
.si-card__image img{width:100%;aspect-ratio:16/10;object-fit:cover;transition:.3s;}
.si-card:hover .si-card__image img{transform:scale(1.04);}
.si-card__body{display:flex;flex:1;flex-direction:column;padding:26px;}
.si-card__english{margin:0 0 5px;color:var(--green);font-size:12px;font-weight:900;letter-spacing:.14em;}
.si-card h2{margin:0 0 12px;color:var(--dark);font-size:25px;}
.si-card__description{margin:0 0 18px;color:var(--muted);line-height:1.85;}

.si-card__examples{
display:flex;
flex-wrap:wrap;
gap:7px;
margin:0 0 22px;
padding:0;
list-style:none;
}

.si-card__examples li{
padding:5px 10px;
background:var(--light);
border-radius:999px;
color:#47783a;
font-size:12px;
font-weight:700;
}

.si-card__more{
display:flex;
align-items:center;
justify-content:space-between;
margin-top:auto;
padding-top:17px;
border-top:1px solid var(--border);
color:var(--green);
font-weight:900;
}

.si-guide{padding:80px 0;background:var(--dark);}
.si-guide__label{margin:0 0 7px;color:#bee4ad;font-weight:900;letter-spacing:.16em;text-align:center;}
.si-guide h2{margin:0 0 38px;color:#fff;font-size:clamp(28px,4vw,40px);text-align:center;}
.si-guide__steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;}

.si-guide__steps article{
padding:30px;
background:rgba(255,255,255,.10);
border:1px solid rgba(255,255,255,.18);
border-radius:16px;
color:#fff;
}

.si-guide__steps span{color:#bee4ad;font-size:28px;font-weight:900;}
.si-guide__steps h3{margin:10px 0;color:#fff;}
.si-guide__steps p{margin:0;line-height:1.9;}

.si-feature{padding:82px 0;background:var(--pale);}
.si-feature__lead{max-width:850px;margin:0 auto 38px;color:var(--muted);font-size:17px;line-height:2;text-align:center;}
.si-feature__grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;}

.si-feature__grid article{
padding:26px 16px;
background:#fff;
border-radius:14px;
box-shadow:var(--shadow);
text-align:center;
}

.si-feature__grid strong{display:block;margin-bottom:8px;color:var(--green);font-size:21px;}
.si-feature__grid p{margin:0;color:var(--dark);font-size:14px;font-weight:700;line-height:1.7;}

.si-contact {
    padding: 60px 20px;
    background-color: #f4faf2;
}

.si-contact__inner {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
}

.si-contact__label {
    margin-bottom: 8px;
    color: #6dbe45;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.12em;
}

.si-contact h2 {
    margin: 0 0 16px;
    color: #333333;
    font-size: 28px;
}

.si-contact__text {
    margin: 0 0 30px;
    color: #444444;
    font-size: 16px;
    line-height: 1.8;
}

/* 3つのボタンを横3列にする */
.si-contact__buttons {
  .si-contact__buttons {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}
}

.si-contact-button {
    display: flex;
    align-items: center;
    justify-content: center;

    display: grid;
   grid-template-columns: 1fr;
   gap: 12px;

    min-height: 64px;
    padding: 12px 8px;

    border-radius: 8px;
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;

    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
    transition: 0.2s;
}

/* LINE */
.si-contact-button--line {
    background-color: #06c755;
}

/* ネット予約：オレンジ */
.si-contact-button--web {
    background-color: #e88b2e;
}

/* 電話 */
.si-contact-button--tel {
    background-color: #4f9d55;
}

.si-contact-button:hover {
    opacity: 0.85;
    transform: translateY(-2px);
}

@media(max-width:900px){
.si-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
.si-feature__grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}

@media(max-width:700px){
.si-container{width:min(100% - 30px,1120px);}
.symptom-index-page{padding-bottom:90px;}
.si-hero{padding:55px 0 48px;}
.si-hero__lead{font-size:16px;}
.si-section,.si-guide,.si-feature,.si-contact{padding:58px 0;}
.si-grid,.si-guide__steps,.si-feature__grid{grid-template-columns:1fr;}
.si-card__body{padding:22px;text-align:center;}
.si-card__examples{justify-content:center;}
.si-contact__inner{padding:34px 20px;}
.si-contact__buttons{flex-direction:column;align-items:center;}
.si-contact-button{width:100%;min-width:0;max-width:360px;}
}


/* ==========================================================
   症例一覧ページ専用調整
========================================================== */
main.symptom-index-page{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 0 100px !important;
}

.symptom-index-page .si-feature{
    position:relative !important;
    top:auto !important;
    left:auto !important;
    z-index:1 !important;
}
