/* =====================================================
   下層ページ共通パーツ（about.html など）
   ※他のページを作るときもこのブロックをそのまま使い回せます
===================================================== */


.page-content{

    max-width:1100px;
    margin:0 auto;
    padding:180px 5% 60px;

}


/* セクション見出し（英語大文字＋グレーの線＋日本語） */

.page-heading{

    text-align:center;
    margin-bottom:40px;

}


.page-heading h2{

    font-size:clamp(36px,6vw,64px);
    color:#e4e4e4;
    font-weight:700;
    letter-spacing:.02em;

}


.line{

    width:100%;
    height:2px;
    background:#c8c8c8;

}


.page-heading .line{

    margin:-14px 0 14px;

}





.page-heading p{

    font-size:clamp(16px,2vw,22px);
    font-weight:700;
    color:#111;

}


.page-section{

    margin-bottom:90px;
    scroll-margin-top:180px;

}


.page-section p.lead{

    font-size:clamp(14px,1.6vw,17px);
    line-height:2;
    color:#222;
    margin-bottom:24px;

}



/* About us：イントロ＋ベン図 */

.about-intro{

    display:flex;
    flex-wrap:wrap;
    gap:30px;

    align-items:center;
    margin-bottom:50px;

}


.about-intro .about-text{

    flex:1 1 320px;

}


.about-intro .venn-image{

    flex:1 1 300px;
    max-width:380px;
    margin:0 auto;

}


.about-intro .venn-image img{

    width:100%;
    height:auto;

}


.quote-box{

    text-align:center;
    font-size:clamp(18px,2.6vw,28px);
    font-weight:700;
    line-height:1.9;
    margin:40px 0;

}



/* Our Strengths：写真＋テキスト交互 */

.strength-item{

    display:flex;
    flex-wrap:wrap;
    gap:30px;
    align-items:center;
    margin-bottom:50px;

}


.strength-item.reverse{

    flex-direction:row-reverse;

}


.strength-item h3{

    flex:1 1 100%;
    font-size:clamp(16px,2.2vw,22px);
    font-weight:700;
    margin-bottom:15px;

}


.strength-item .strength-photo{

    flex:1 1 320px;

}


.strength-item .strength-photo img{

    width:100%;
    height:auto;
    display:block;

}


.strength-item .strength-text{

    flex:1 1 320px;
    font-size:clamp(14px,1.6vw,16px);
    line-height:2;

}



/* Company Overview：会社概要テーブル */

.company-table{

    width:100%;
    border-collapse:collapse;
    margin-bottom:50px;

}


.company-table th,
.company-table td{

    text-align:left;
    padding:16px 10px;
    border-bottom:1px solid #ddd;

    font-size:clamp(13px,1.5vw,16px);
    line-height:1.8;
    vertical-align:top;

}


.company-table th{

    width:120px;
    font-weight:700;
    white-space:nowrap;

}


/* 役員一覧 */

.officer-list{

    max-width:520px;
    margin:0 auto;

}


.officer-list li{

    display:flex;
    justify-content:space-between;
    list-style:none;

    padding:12px 10px;
    border-bottom:1px solid #eee;
    font-size:clamp(13px,1.5vw,16px);

}



/* Basic policy */

.policy-list{

    list-style:none;

}


.policy-list > li{

    margin-bottom:22px;

}


.policy-list > li > .policy-title{

    font-size:clamp(15px,1.8vw,19px);
    font-weight:700;
    margin-bottom:8px;

}


.policy-list ul{

    list-style:none;
    padding-left:1.4em;

}


.policy-list ul li{

    font-size:clamp(13px,1.5vw,16px);
    line-height:1.9;
    position:relative;

}


.policy-list ul li::before{

    content:"・";
    position:absolute;
    left:-1.2em;

}



/* History：沿革 */

.history-list{

    list-style:none;

}


.history-list li{

    display:flex;
    gap:20px;
    padding:12px 0;
    border-bottom:1px solid #eee;

    font-size:clamp(13px,1.5vw,16px);
    line-height:1.8;

}


.history-list .year{

    flex:0 0 90px;
    font-weight:700;

}



/* Logo mark */

.logomark-block{

    display:flex;
    flex-wrap:wrap;
    gap:30px;
    align-items:center;

}


.logomark-block .logomark-text{

    flex:1 1 320px;

}


.logomark-block .logomark-text h3{

    font-size:clamp(15px,1.8vw,19px);
    font-weight:700;
    margin-bottom:12px;

}


.logomark-block .logomark-text p{

    font-size:clamp(13px,1.5vw,16px);
    line-height:2;

}


.logomark-block .logomark-icon{

    flex:0 0 180px;
    max-width:180px;

}


.logomark-block .logomark-icon img{

    width:100%;
    height:auto;

}



/* Brochure：資料ダウンロード */

.brochure-block{

    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-items:center;
    gap:20px;

}


.brochure-block h3{

    font-size:clamp(15px,1.8vw,19px);
    font-weight:700;

}


.download-btn{

    display:inline-flex;
    align-items:center;
    gap:8px;

    padding:18px 34px;     /* リンクボタンのサイズ縦：横 */

    background:#213269;
    color:#fff;
    text-decoration:none;

    font-size:16px;
    letter-spacing:.1em;
    transition:.3s;

}


.download-btn:hover{

    background:#31458a;

}

.movie-link-btn{

    flex-basis:100%;
    display:flex;
    justify-content:center;
    margin-top:10px;

}


.movie-link-btn img{

    width:100%;
    max-width:320px;
    height:auto;
    min-width:0;
    display:block;

}

@media(max-width:600px){

    .page-content{

        padding-top:170px;

    }

    .strength-item,
    .strength-item.reverse{

        flex-direction:column;

    }

    .officer-list li{

        font-size:14px;

    }

}