@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD / Guru
    Theme URI: https://swell-theme.com/
    Description: SWELLのデフォルト子テーマを使用したカスタマイズ用子テーマ
    Version: 1.0.3
    Author: ぐる
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/*
* 　
*　以下「ぐる」による追加部分　2025/09/07
* 　
*/

/*######################################################################
共通
######################################################################*/

/*--------------- メニュー ---------------*/

/* ヘッダーメニュー */

.l-header__inner {
    container-type: inline-size;
}

.image__menu__header {
    width: 6cqw;
    min-width: 4em;

    a {
        padding: 0 !important;
    }
}

/* 追従ヘッダーメニュー */

.l-fixHeader {

    .image__menu__header {
        width: 4em;
    }
}

/* スマホ開閉メニュー */

.p-spMenu__nav {

    ul {
        display: flex;
        align-items: center;

        li {
            width: 10em;
            
            a {
                border: none;

                &::before {
                    display: none;
                }
            }
        }

    }
}


/*--------------- FV下の画像スライダー ---------------*/

.p-postSlider__title {
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    color: #AB3D1F;
}

/*--------------- FV下の画像スライダーより下のコンテンツエリア用 ---------------*/

/* フォントサイズ管理用 */

.content {
    container-type: inline-size;
}

/* コンテンツ */

.post_content {

    /* 見出しのフォント */

    h2, h3, h4 {
        font-family: 'Inter', sans-serif;
        font-weight: 500;
    }

    /* h2見出し */

    h2.wp-block-heading {
        width: 11em;
        background-color: #D47A62;
        color: #ffffff;
        position: relative;
        padding: 0.5em 1em;
        
        &::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 0.6em;
            height: 100%;
            background-color: #AB3D1F;
            z-index: -1;
            border: none;
        }
    }

    /* h3見出し */

    h3 {
        color: #0d0d0d;
        text-align: center;
        position: relative;
        margin-bottom: 1em;

        &::before {
            display: none;
        }

        &.section__column::after,
        &.section__seminar::after,
        &.section__partner::after {
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            color: #D47A62;
            font-size: 0.5em;
        }
        
        &.section__column::after {
            content: "column";
        }

        &.section__seminar::after {
            content: "seminar";
        }

        &.section__partner::after {
            content: "information";

        }

    }
}

/*--------------- フッター ---------------*/

.l-container {
    container-type: inline-size;
}

.footer__nav {
    display: flex;
    font-family: 'Inter', sans-serif;
    justify-content: space-evenly;
    flex-wrap: wrap;
    font-size: 1.5cqw;
    margin: 0 auto 2em;

    .footer__nav__inner {
        display: contents;
    }

    ul {
        
        li {
            display: flex;
            align-items: center;
            gap: 0.5em;
            margin-bottom: 0.25em;

            &::before {
                content: "";
                width: 1.5em;
                height: 1px;
                background-color: #AB3D1F;
            }
        }
    }
}

/*######################################################################
TOP Page
######################################################################*/

.home {

    #content {
        padding-top: 1em;
    }

    h4 {
        display: flex;
        align-items: center;
        padding: 0;
        border: none;
        
        &::after {
            content: "";
            height: 0.2em;
            flex-grow: 1;
            background-color: #f5f5f5;
            margin-left: 1em;
        }
        
        &.purpose {
            justify-content: center;

            &::after {
                display: none;
            }
        }
    }

    /*------------------------------------------------------------
    News List
    ------------------------------------------------------------*/

    /*--------------- 一番外側のdiv（グループ） ---------------*/
    .news__wrapper {
        border: solid 2px rgba(171, 61, 31, 0.5);
        border-radius: 0.5em;
        padding: 1em 1.5em;
        position: relative;
        width: 80%;
        margin-inline: auto;

        h2.wp-block-heading {
            background-color: unset;
            color: #0D0D0D;
            position: absolute;
            top: 0.75em;
            left: 1em;
            margin: 0;
            padding: 0;
            display: flex;
            align-items: center;
            gap: 0.5em;

            &::before {
                display: none;
            }

            &::after {
                content: "News";
                color: #AB3D1F;
            }
        }
    }

    /*--------------- お知らせ一覧 ---------------*/

    .news__list {
        display: flex;
        flex-direction: column;

        .p-postList {
            order: 2;
            padding: 1em 0;

            &.-type-simple {
                /* border: none; */

                a {
                    border: none;
                    padding: 0.25em;
                }
            }

            .p-postList__body {
                display: flex;
                align-items: center;

                .p-postList__meta {
                    margin: 0;

                    time::before {
                        display: none;
                    }
                }
            }
        }


        /*--------------- 一覧はこちらボタン ---------------*/

        .is-style-more_btn {
            margin: 0 0 0 auto;
            padding: 0 0 1em 0;

            a {
                box-shadow: none;
                display: flex;
                place-items: center;
                gap: 0.5em;
                padding: 0;

                &::after {
                    content: "\f0a9";
                    font: var(--fa-font-solid);
                    color: #AB3D1F;
                    position: static;
                    transform: unset;
                }
            }

            &::before {
                content: "";
                position: absolute;
                top: 0;
                left: 0;
            }
        }
    }
    
    /*------------------------------------------------------------
    私たちについて
    ------------------------------------------------------------*/

    .section__home__about {
        gap: 3em !important;
        
        &.wp-block-columns {
            align-items: center !important;
        }
    }
    
    .about__column--left {
        height: fit-content;

        h4 {
            margin-top: 2em;
        }

        p {
            /* font-size: 1.125rem; */
        }
    }

    /*------------------------------------------------------------
    コラム / セミナー / 企業紹介
    ------------------------------------------------------------*/

    .col--4 {

        /*--------------- カード型アイテム ---------------*/

        .p-postList__item {
            width: 25% !important;
        }

        .p-postList__body {
            padding-top: 0.5em;
        }
        
        h3.p-postList__title {
            text-align: left;
        }

        .c-postThumb__cat {
            top: unset;
            left: 0;
            right: unset;
            bottom: 0;
        }

        &.list__information {

        }

        /*--------------- もっと見るボタン ---------------*/
        
        .is-style-more_btn {
            width: 10em;
            margin: 0 auto 0 0;

            a {
                padding: 0.75em 1.5em;
                box-shadow: none;
                background-color: #AB3D1F;
                color: #ffffff;
                display: flex;
                justify-content: center;
                align-items: center;
                gap: 1.5em;

                &::after {
                    position: static;
                }

                &::after,
                &:hover::after {
                    transform: unset;
                }
            }
        }

        /*--------------- 企業案内｜スライダー ---------------*/

        .splide__slide {

            img {
                aspect-ratio: 16 / 9;
                object-fit: contain;
            }

            h3 {
                margin: 0;
                font-size: 1em;
            }
        }

    }
}

/*######################################################################
レスポンシブ
######################################################################*/

.w-640 {
    display: none;
}

/*------------------------------------------------------------
960px未満
------------------------------------------------------------*/

@media (width < 960px) {

    #content {
        margin-bottom: 3em;
    }

    /*--------------- フッター ---------------*/

    .footer__nav {
        font-size: 0.875em;

        justify-content: center;
        gap: 2em;

        .footer__nav__inner {
            display: block;
        }
    }

    /*--------------- トップページ ---------------*/

    .home {

        /* News List */

        .news__wrapper {
            width: 100%;
            font-size: 0.75em;
        }

        /* 私たちについて */

        .section__home__about {
            gap: 3em !important;
            
            &.wp-block-columns {
                flex-direction: column;
            }
        }

        .col--4 {

            .p-postList__item {
                width: 50% !important;
            }

            .splide__slide {

                h3 {
                    font-size: 0.875em;
                }
            }
        }
    }
}

/*------------------------------------------------------------
600px未満
------------------------------------------------------------*/

@media (width < 600px) {

    .w-640 {
        display: block;
    }

    #content {
        margin-bottom: 2em;
    }

    /*--------------- フッター ---------------*/

    .footer__nav {
        font-size: 0.8em;

        justify-content: space-around;
    }
    
    /*--------------- FV下の画像スライダーより下のコンテンツエリア用 ---------------*/

    h2.wp-block-heading {
        margin-top: 3em;
        margin-bottom: 1.5em;
        font-size: 1em;
    }

    /*--------------- トップページ ---------------*/

    .home {

        /* 私たちについて */

        .section__home__about {
            font-size: 3.5cqw;
        }

        /* コラム / セミナー / 企業紹介 */

        .col--4 {

            h3.p-postList__title {
                font-size: 3cqw;
            }

            /* もっと見るボタン */
            
            .is-style-more_btn {
                font-size: 3cqw;
            }
            
            /* 企業案内｜スライダー */
            
            .splide__slide {
                
                h3 {
                    font-size: 2.5cqw;
                }
            }
        }

        /* 会社概要 */

        .home__info__table {
            font-size: 3.5cqw;

            table {

                tbody {

                    tr {

                        th, td {
                            display: block;
                            width: 100%;
                        }
                    }
                }
            }
        }
        
    }


}