@charset "utf-8";

/********************************************
about (SICとは) ページ個別
********************************************/

/* FV 背景 */
.subfv{ background-image: url(../images/about/about_fv_pc.jpg); }
@media (max-width: 768px){
    .subfv{ background-image: url(../images/about/about_fv_sp.jpg); }
}

/********************************************
About SIC(概要)
********************************************/
.ab-about{ padding: 90px 0 100px; }
.ab-about__head{
    display: flex;
    align-items: center;
    gap: 100px;
}
.ab-about__head .ttl__area{ margin-bottom: 0; }
.ab-about__catch{
    color: var(--color-primary);
}
.ab-about__body{ margin-top: 60px; }
.ab-about__lead{
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 25px;
}
.ab-about__text{  line-height: 2; }

/********************************************
画像帯(ギャラリー)
********************************************/
.ab-gallery{
    display: grid;
    grid-template-columns: repeat(5, 1fr);
}
.ab-gallery__item{ display: block; }
.ab-gallery__item img{
    width: 100%;
    height: 100%;
    aspect-ratio: 384 / 320;
    object-fit: cover;
    display: block;
}
.ab-gallery__item--sp{ display: none; } /* 6枚目はSPのみ */

/********************************************
SICの理念
********************************************/
.ab-philosophy{
    display: grid;
    grid-template-columns: 40% 60%;
}
.ab-philosophy__img img{ width: 100%; height: 100%; object-fit: cover; display: block; }
.ab-philosophy__panel{
    background: var(--grad-back);
    color: #fff;
    padding: 70px 60px 84px;
}
.ab-philosophy__inner{ max-width: 680px; }
.ab-philosophy__inner .ttl__area{ margin-bottom: 10px; }
.ab-venn{ max-width: 380px; margin: 24px auto 40px; }
.ab-venn img{ width: 100%; display: block; }
.ab-creed > div{ margin-top: 40px; }
.ab-creed dt{ font-size: 20px; font-weight: 700; margin-bottom: 8px; }

/********************************************
Promise(9つの約束)
********************************************/
.ab-promise{ padding: 90px 0 100px; }
.ab-promise__head{ text-align: center; margin-bottom: 30px; }
.ab-promise__head .ttl__area{ margin-bottom: 20px;display: inline-block;}
.ab-promise__head .ttl__sub{ justify-content: flex-start; }
.ab-promise__sub{
    font-size: 60px;
    font-weight: 500;
    color: var(--color-primary);
    letter-spacing: .04em;
}
.ab-promise__intro{
    text-align: center;
    line-height: 2;
    margin-bottom: 80px;
}
.ab-promise__item{ display: flex; gap: 20px; padding: 0 0 80px; }
.ab-promise__no{
    flex-shrink: 0;
    font-family: var(--font-num);
    font-weight: 700;
    font-size: 80px;
    letter-spacing: 0.05em;
    line-height: 1.1;
    color: var(--color-primary);
}
.ab-promise__ttl{
    font-size: 36px;
    font-weight: 500;
    line-height: 1.3;
    padding-top: 10px;
    color: var(--color-primary);
}
.ab-promise__desc{
    line-height: 1.9;
    margin-top: 30px;
}

/********************************************
SP
********************************************/
@media (max-width: 768px){
    .ab-about{ padding:18.66vw 0 8vw; }
    .ab-about__head{ flex-direction: column; gap: 4vw;align-items: flex-start; }
    .ab-about__catch{ font-size: 6.4vw; padding-top: 0; }
    .ab-about__body{ margin-top: 6vw; }
    .ab-about__lead{ font-size: 4vw; margin-bottom: 3.5vw;line-height: 1.3; }
    .ab-about__text{ font-size: 3.2vw;line-height: 1.3; }

    /* 画像帯：2列×3段(6枚) */
    .ab-gallery{ grid-template-columns: repeat(3, 1fr); }
    .ab-gallery__item--sp{ display: block; }

    /* 理念：画像(上) + パネル(下) */
    .ab-philosophy{ grid-template-columns: 1fr; }
    .ab-philosophy__img{ aspect-ratio:750 / 900; }
    .ab-philosophy__panel{ padding: 10vw 2.933vw 12vw; }
    .ab-philosophy__inner{ max-width: none; }
    .ab-venn{ max-width: 62vw; margin: 5.33vw auto; }
    .ab-creed dt{ font-size: 4vw; }
    .ab-creed dd{ font-size: 3.2vw; }
    .ab-creed > div{ margin-top: 10.66vw; }

    .ab-promise{ padding: 12vw 0 10vw; }
    .ab-promise__head{ margin-bottom: 5.16vw; }
    .ab-promise__head .ttl__area{ margin-bottom: 1.56vw; }
    .ab-promise__sub{ font-size: 5.6vw; }
    .ab-promise__intro{ font-size: 3.2vw; margin-bottom: 10.66vw; }
    .ab-promise__item{ gap: 4vw; padding: 5vw 0; }
    .ab-promise__no{ font-size: 10.66vw; }
    .ab-promise__ttl{ font-size: 4.266vw;padding-top: 0; }
    .ab-promise__desc{ font-size: 3.2vw; margin-top: 2.5vw; }
}
