/* info_pages.css : 共通下層ページのフォーマット */

/* PC表示：最大幅1200pxで中央寄せ＋左右30pxの余白 */
@media screen and (min-width: 1025px) {
    .ec-off1Grid,
    .ec-pageHeader {
        max-width: 1200px;
        margin-left: auto;
        margin-right: auto;
        padding-left: 30px;  /* 左余白 */
        padding-right: 30px; /* 右余白 */
        box-sizing: border-box; /* paddingを含めて幅計算 */
    }
}

/* タブレット表示：左右に30pxの余白 */
@media screen and (max-width: 1024px) {
    .ec-off1Grid,
    .ec-pageHeader {
        padding-left: 30px;
        padding-right: 30px;
        box-sizing: border-box;
    }
}

/* 各項目を横並びにして上揃え */
.ec-borderedDefs dl {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    margin-bottom: 15px;
    border-bottom: 1px solid #000000;
    padding: 6px 0;
}

/* ラベル部分 */
.ec-borderedDefs dt {
    font-weight: bold;
    color: #333;
    flex-shrink: 0;
    margin: 0;
    width: 250px;       /* ラベル最大幅に固定 */
    margin-right: 15px; /* 内容との間隔 */
}

/* 内容部分 */
.ec-borderedDefs dd {
    flex: 1;
    margin: 0;
    line-height: 1.6;
}

/* dd 内の段落や改行の余白リセット */
.ec-borderedDefs dd p,
.ec-borderedDefs dd br {
    margin: 0;
    padding: 0;
}

/* 2カラムレイアウト */
.ec-infoGrid2 {
    display: flex;
    gap: 40px;
}

.ec-infoColumn {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

/* 各項目（2カラム用） */
.ec-infoItem {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    border-bottom: 1px solid #000000;
    padding: 6px 0;
}

/* ラベル部分（2カラム用） */
.ec-infoLabel {
    font-weight: bold;
    color: #333;
    flex-shrink: 0;
    margin: 0;
}

/* 内容部分（2カラム用） */
.ec-infoContent {
    flex: 1;
    margin: 0;
    line-height: 1.6;
}

/* セクションタイトル */
.ec-heading-bold {
    font-weight: 700;
    margin-bottom: 8px;
    color: #000;
}

/* スマホ対応 */
@media (max-width: 767px) {
    .ec-borderedDefs dl,
    .ec-infoItem {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }
    .ec-borderedDefs dt,
    .ec-infoLabel {
        width: auto;
        margin-right: 0;
    }
    .ec-infoGrid2 {
        flex-direction: column;
    }
    .ec-infoColumn {
        gap: 10px;
    }

    /* モバイル時に左右マージン30pxを確保 */
    .ec-off1Grid {
        padding-left: 30px;
        padding-right: 30px;
    }

    .ec-pageHeader {
        padding-left: 30px;
        padding-right: 30px;
    }
}