@charset "UTF-8";
.gaiyou {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px; /* 線と文字の間の隙間 */
    margin: 40px 0;
    padding-top: 30px; /* ← 上にだけ余白を追加 */
}
.lines {
    display: flex;
    flex-direction: column;
    gap: 4px; /* 線と線の間の隙間 */
}
.line {
    width: 128px;     /*  ← これが線の長さ（お好みで調整） */
    height: 1px;     /* 線の太さ */
    background-color: #231815;
    transform: scaleY(1);
    backface-visibility: hidden;/* 高さをピクセル単位で明示 */
    will-change: transform;/* アンチエイリアス軽減 */
}
.gaiyou span {
    font-size: 24px;
    font-weight: bold;
    color: #ea5504;
}
/* 法人名 */
.company-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 40px 0;
    padding: 0 10%;
    box-sizing: border-box;
}

.company-info dl {
    width: 100%;
    max-width: 360px;
    margin-bottom: 20px;
}

.company-info dt {
    font-size: 16px;
    color: #ea5504;
    margin-bottom: 5px;
    text-align: left;
    font-weight: 500;
}

.company-info dd {
    background-color: #e6e6e6;
    color: #231815;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.5;
    padding: 6px 12px;
    box-sizing: border-box;
    text-align: left;
}



/* スマホ画面 */
@media screen and (max-width: 767px) {
    .gaiyou {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px; /* 線と文字の間の隙間 */
    
        padding-top: 0;
        margin: -25px 0 30px 0; /* 上 30px、下 30px に調整 */
        position: relative;
      z-index: 1;
    }
    .lines {
        display: flex;
        flex-direction: column;
        gap: 4px; /* 線と線の間の隙間 */
    }
    .gaiyou .line {
        width: 92px !important;     /*  ← これが線の長さ（お好みで調整） */
        height: 1px;     /* 線の太さ */
        background-color: #231815;
        transform: scaleY(1);
        backface-visibility: hidden;/* 高さをピクセル単位で明示 */
        will-change: transform;/* アンチエイリアス軽減 */
    }
    .gaiyou span {
        font-size: 24px;
        font-weight: bold;
        color: #ea5504;
    }
   /* 法人名 */
    .company-info {
    padding: 0 5%;
    }

    .company-info dl {
    width: 100%;
    max-width: 330px; /* 横幅少し小さく */
    margin-bottom: 20px; /* dl間の余白 */
    }

    .company-info dt {
    font-size: 15px; /* 少し大きく */
    margin-bottom: 6px;
    font-weight: 500;
    }

    .company-info dd {
    font-size: 18px; /* 少し大きく */
    font-weight: bold;
    padding: 10px 12px; /* 高さに余裕を持たせる */
    line-height: 1.5; /* 行間を広げて読みやすく */
    } 

}