@charset "UTF-8";
.page-hero{
    height:90vh;
    display:flex;
    align-items:center;
    background-position:center;
    background-size:cover;
    background-repeat:no-repeat;
    color:var(--white);
    background-image:url("../img/about/about-main-visual.jpg");
}

.page-hero-inner{
    height:100%;
    display:flex;
    align-items:center;
}

.page-hero-content{
    max-width:760px;
}

.page-hero-en{
    color:var(--corporate-color);
    margin:20px 0;
    font-size:clamp(15px,1.2vw,20px);
    font-weight:500;
}

.page-hero-title{
    font-size:clamp(40px,4.5vw,72px);
    line-height:1.2;
    margin-bottom:15px;
}

.page-hero-copy{
    font-size:clamp(18px,1.6vw,26px);
    line-height:1.7;
    margin-bottom:30px;
}

.page-hero-text{
    font-size:16px;
    line-height:2;
    margin-bottom:50px;
}

.breadcrumb{
    display:flex;
    gap:15px;
    font-size:13px;
}

/*==============================
Message
==============================*/

.about-message{
    padding:120px 0 180px;
}

.about-message .container{
    max-width:1000px;
    text-align:center;
}

.about-message h2{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:20px;
    color:var(--blue);
    margin-bottom:50px;
}

.about-message p{
    font-size:16px;
    line-height:2.4;
    color:var(--sumi);
}

.about-message .message-small{
    display:block;
    font-size:clamp(30px,3vw,52px);
    font-weight:700;
    font-family:"Noto Serif JP", serif;
    color:var(--blue);
    line-height:1.3;
}

.about-message .message-main{
    display:block;
    font-size: clamp(26px, 3vw, 40px);
    font-family:"Noto Serif JP", serif;
    color:var(--blue);
    line-height:1.3;
}

/*==============================
Company
==============================*/

.company{
    padding:0 0 80px;
}

.section-title{
    text-align:center;
    font-size:clamp(34px,3vw,52px); /* serviceの.section-head h2 */
    color:var(--blue);
    margin-bottom:70px;
}

.company-grid{
    display:grid;
    grid-template-columns:1.3fr 1fr;
    gap:60px;
    align-items:start;
}

.company-table{
    width:100%;
    border-collapse:collapse;
}

.company-table th,
.company-table td{
    border-bottom:1px solid #ddd;
    padding:20px;
    text-align:left;
    font-size:15px;
    color:var(--sumi);
}

.company-table th{
    width:140px;
    color:var(--blue-deep);
    font-weight:700;
    background:#fafafa;
}

.company-map{
    border-radius:12px;
    overflow:hidden;
}

.company-map iframe{
    width:100%;
    height:420px;
    border:none;
}

/* ===========================
   SP
=========================== */

@media(max-width:768px){

.page-hero{
    height:550px;
    display:flex;
    align-items:center;
    background-position:center;
    background-size:cover;
    background-repeat:no-repeat;
    background-image:url("../img/about/sp/sp-about-main-visual.jpg");
}

.page-hero-content{
    max-width:330px;
    transform:translateY(18px);
}

.page-hero-en{
    margin:0 0 10px;
    font-size:16px;
}

.page-hero-title{
    font-size:42px;
    line-height:1.15;
    margin-bottom:18px;
}

.page-hero-copy{
    font-size:22px;
    line-height:1.45;
    margin-bottom:20px;
}

.page-hero-text{
    font-size:15px;
    line-height:1.8;
    margin-bottom:32px;
    letter-spacing: 0.05;
}

.breadcrumb{
    font-size:13px;
    gap:12px;
}

.about-message .message-main{
    line-height: 1.6;
}

.about-message{
    padding:80px 0;
}

.about-message p{
    font-size:15px;
    line-height:2;
    text-align:justify;
}

.about-message h2{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:14px;
    margin-bottom:40px;
}

.about-message .message-small{
    font-size:22px;
    line-height:1.6;
}

.company{
    padding:0 0 80px;
}

.section-title{
    font-size:34px;
    margin-bottom:45px;
}

.company-grid{
    grid-template-columns:1fr;
    gap:40px;
}

.company-table th,
.company-table td{
    display:block;
    width:100%;
}

.company-table th{
    border-bottom:none;
    padding-bottom:6px;
    background:none;
}

.company-table td{
    padding-top:0;
    padding-bottom:18px;
}

.company-map iframe{
    height:300px;
}

}