@charset "UTF-8";
/*==================================================
*   main / fv
==================================================*/
section.fv {
    position:relative;
    padding:0;

    & .bg {
        width:100%;
        height:calc(100dvh - var(--header-height));
        object-fit:cover;
        object-position:bottom center;
    }
    & .catch {
        position:absolute;
        inset:50% auto auto max(1rem, 10%);
        translate:0 -50%;
        font-size:36px;
        /* viewport:768-1000px  27-36px */
        font-size:clamp(1.688rem, calc(-0.175rem + 3.879vw), 2.25rem);
        color:#fff;
    }
    & .logo {
        position:absolute;
        inset:50% auto auto 50%;
        translate:-50% -50%;
        width:min(370px, 25%);
    }
}
@media (max-width: 1000px) {
}
@media (max-width: 768px) {
    section.fv {

        & .catch { inset:calc(50% + 2rem) auto auto 50%; translate:-50% 0%; text-wrap:nowrap;}
        & .logo { width:50%; translate:-50% -100%;}
    }
}


/*==================================================
*   main / news
==================================================*/
section.news {

    & .news_wrap {
        display:grid;
        grid-template-columns:9rem 1fr;
        grid-template-rows:auto;
        
    }
    & dl { 
        display:grid;
        grid-template-columns:subgrid;
        align-items:baseline;
        grid-column:span 2;
        border-top:solid 1px;
        font-family:var(--noto-sans);
    }
    & dl:first-of-type { border-top:none;}
    & :is(dt, dd) { padding-block:1.5rem;}
    & dt { font-size:24px; font-weight:bold;}
    & dd { padding-left:1.5rem;}
}

@media (max-width: 1000px) {
}
@media (max-width: 768px) {
    section.news {

        & .news_wrap { grid-template-columns:1fr; max-height:70vh; overflow-y:auto;}
        & dl { grid-column:auto;}
        & dd { padding-top:0; padding-left:0;}
    }
}


/*==================================================
*   main / about
==================================================*/
section.about {
    position:relative;
    margin-bottom:100px;
    padding-block:0;
    
    & .bg {
        width:100%;
        height:500px;
        object-fit:cover;
        object-position:bottom;
    }
    & .about_wrap {
        position:absolute;
        inset:50% auto auto 10vw;
        translate:0 -50%;
        width:min(535px, 90%);
        color:#fff;
    }
    & .about_wrap h3 {
        font-family:var(--noto-sans);
        /* viewport:768-1000px  22.5-30px */
        font-size:clamp(1.406rem, calc(-0.145rem + 3.233vw), 1.875rem);
    }
    & .about_wrap p {
        margin-top:1em;
        /* viewport:768-1000px  15-17px */
        font-size:clamp(0.938rem, calc(0.524rem + 0.862vw), 1.063rem);
    }
}
@media (max-width: 1000px) {
}
@media (max-width: 768px) {
    section.about .about_wrap { left:5%;}
}



/*==================================================
*   main / style, activity
==================================================*/
section:is(.style, .activity) { container:sa/ inline-size; background-color:#F1F5F7; padding-block:0;}
section.activity { margin-bottom:100px;}
section:is(.style, .activity) .col2 {
    display:grid;
    grid-template-columns:repeat(2, 1fr);

    & .col2_box {
        align-self:center;
        margin-inline:auto;
        padding:1rem;
        width:auto;
    }
    & .col2_title {
        /* viewport:768-1200px  31.5-42px */
        font-size:clamp(1.969rem, calc(0.802rem + 2.431vw), 2.625rem);
    }
    & .col2_title i {
        display:inline-block;
        margin-inline:0.5em;
        width:0.75em;
        height:1lh;
        vertical-align:bottom;
        background-color:#000;
        mask:url(../../img/icon_cross.svg) no-repeat center / contain;
    }
    & .col2_catch {
        margin-top:1em;
        font-family:var(--noto-sans);
        /* viewport:768-1200px  21-28px */
        font-size:clamp(1.313rem, calc(0.535rem + 1.62vw), 1.75rem);
    }
    & p { margin-top:1em; line-height:2;}
    & a.btn {
        /* 768-1200px  32-48px */
        margin-top:clamp(2rem, calc(0.222rem + 3.704vw), 3rem);
    }
    & img { height:100%; object-fit:cover;}
}
section:is(.style, .activity) .col5 {
    display:grid;
    grid-template-columns:repeat(5, 1fr);
}
section:is(.style, .activity) :is(.col2, .col5) img { width:100%;}

section:is(.style, .activity) .swiper { width:100%;}
section:is(.style, .activity) .swiper-slide { width:20%; pointer-events:none;}
section:is(.style, .activity) .swiper img { width:100%;}
section:is(.style, .activity) .swiper-wrapper { transition-timing-function:linear;}

@container sa (width < 1000px){
    section:is(.style, .activity) .col2 { grid-template-columns:1fr;}
    section:is(.style, .activity) .swiper-slide { width:50%;}
}

@media (max-width: 1000px) {
}
@media (max-width: 768px) {
    section:is(.style, .activity) {

        & .col2 .col2_box { padding-block:2rem;}
        & .col2 a.btn { margin-inline:auto;}
    }
}


/*==================================================
*   main / lecture
==================================================*/
section.lecture {
    background-color:#F5F2E9;

    & .lecture_wrap { width:min(350px, 100%); margin:60px auto 0;}
    & .lecture_title { margin-top:0.75em; font-size:18px; text-align:center; font-weight:bold;}
    & .lecture_title:first-line { font-size:20px;}
    & p { margin-top:1em; font-size:14px; font-family:var(--noto-sans);}
    & a.btn { margin:3rem auto 0;}
}

@media (max-width: 1000px) {
}
@media (max-width: 768px) {
}

/*==================================================
*   main / faq
==================================================*/
section.faq .faq_list {

    & :is(dt, dd) { position:relative; padding-left:3rem;}
    & :is(dt, dd):before {
        content:"";
        position:absolute;
        inset:calc((1lh - 1em) / 2) auto auto 0;
        display:block;
        width:1.5rem;
        aspect-ratio:1;
        background:url() no-repeat center / contain;
    }
    & dt:before { background-image:url(../../img/icon_faq_q.svg);}
    & dd:before { background-image:url(../../img/icon_faq_a.svg);}

    & dt { font-size:22px;}
    & dd { margin-top:1em; font-family:var(--noto-sans); font-size:14px;}
    & dd:not(:last-of-type) { margin-bottom:1rem; padding-bottom:1rem; border-bottom:dotted 2px #7E8B95;}

    & dt.sec {
        position:static;
        padding:0;
        margin-block:5rem 1rem;
        text-align:center;
        font-size:24px;
        font-weight:bold;
    }
    & dt.sec:before { content:none;}
}



@media (max-width: 1000px) {
}
@media (max-width: 768px) {
}


/*==================================================
*   main / nearby
==================================================*/
section.nearby {
    background-color:#F1F5F7;

    & .nearby_list {
        display:grid;
        grid-template-columns:repeat(auto-fit,340px);
        grid-template-rows:repeat(3, auto);
        justify-content:center;
        gap:2rem;
        margin:70px auto 0;
    }
    & .nearby_list li {
        display:grid;
        grid-template-rows:subgrid;
        grid-row:span 3;
        gap:0.5rem 0;
    }
    & .nearby_list .nearby_list_title { font-size:22px; font-weight:bold; text-align:center;}
    & .nearby_list p { font-size:14px; font-family:var(--noto-sans);} 
    & a.btn { margin:3rem auto 0;}
}
@media (max-width: 1000px) {
}
@media (max-width: 768px) {
}



