@charset "utf-8";

/* 기본값 설정 */
:root {
    /* layout */
    --dbe-pc-container-width: 1200px;
    --dbe-pc-container-margin: 0 auto 20px;

    --dbe-mb-container-width: 100vw;
    --dbe-mb-container-margin: 24px 0 20px;
    --dbe-mb-container-padding: 16px 18px;

    --dbe-pc-list-narrow-width: 900px;
    --dbe-pc-list-margin-bottom: 10px;
    --dbe-pc-separate-height: 24px;
    --dbe-pc-intend: 18px;
    --dbe-pc-intend-margin-bottom: 6px;

    /* font */
    --dbe-pc-p-font-size: 16px;
    --dbe-pc-p-font-weight: 400;
    --dbe-pc-p-line-height: 1.6em;

    --dbe-mb-p-font-size: 14px;

    --dbe-pc-h3-font-size: 19px;
    --dbe-pc-h3-font-weight: 700;
    --dbe-pc-h3-line-height: 2.0em;

    --dbe-mb-h3-font-size: 17px;

    /* color */
    --dbe-font-color-default: #000;
    --dbe-font-color-blue: #1d7fbf;
    --dbe-font-color-white: #FFF;

    --dbe-background-color-blue: #1d7fbf;

    --dbe-border-color: #CCC;

    /* button */
    --dbe-pc-button-width: 260px;
    --dbe-pc-button-height: 54px;
    --dbe-pc-button-margin: 20px auto 150px;
    --dbe-pc-button-font-size: 19px;
    --dbe-pc-button-font-weight: 400;
    --dbe-pc-button-border-radius: 10px;

    --dbe-mb-button-width: 240px;
    --dbe-mb-button-height: 42px;
    --dbe-mb-button-font-size: 16px;
}

/* container */
.container {
    width: var(--dbe-pc-container-width);
    margin: var(--dbe-pc-container-margin);

    color: var(--dbe-font-color-default);
    font-size: var(--dbe-pc-p-font-size);
    font-weight: var(--dbe-pc-p-font-weight);
    line-height: var(--dbe-pc-p-line-height);
}

.container,
.container *,
.container *:before,
.container *:after {
    box-sizing: border-box;
}

/* title */
.title {
    width: var(--dbe-pc-container-width);
    margin: 0 0 var(--dbe-pc-separate-height);
    padding: 0 0 calc(var(--dbe-pc-separate-height) * 1.5);
    text-align: center;
    border-bottom: 1px solid var(--dbe-border-color);
}

.title h1 {
    font-size: 26px;
    font-weight: 600;
    line-height: 34px;
}

/* policy */
.contents {
    color: var(--dbe-font-color-default);
    font-size: var(--dbe-pc-p-font-size);
    font-weight: var(--dbe-pc-p-font-weight);
    line-height: var(--dbe-pc-p-line-height);
}

.contents ul {
    width: var(--dbe-pc-list-narrow-width);
    margin: 0 auto var(--dbe-pc-separate-height);
    padding: 0 0 calc(var(--dbe-pc-separate-height) - var(--dbe-pc-list-margin-bottom));
    border-bottom: 1px solid var(--dbe-border-color);
}

.contents ul li {
    margin: 0 auto var(--dbe-pc-list-margin-bottom);
    word-break: break-all;
    word-wrap: break-word;
    text-align: justify;
}

.contents .list-title {
    margin: 0 0 calc(var(--dbe-pc-separate-height) - var(--dbe-pc-list-margin-bottom));
    font-size: var(--dbe-pc-h3-font-size);
    font-weight: var(--dbe-pc-h3-font-weight);
    line-height: var(--dbe-pc-h3-line-height);
}

.contents .intend-1 {
    padding-left: var(--dbe-pc-intend);
}
.contents .intend-2 {
    padding-left: calc(var(--dbe-pc-intend) * 2);
}

.contents b {
    font-weight: var(--dbe-pc-h3-font-weight);
}

.contents .list-wide {
    width: var(--dbe-pc-container-width);
    margin: 0 0 var(--dbe-pc-list-margin-bottom) calc((var(--dbe-pc-container-width) - var(--dbe-pc-list-narrow-width)) / 2 * (-1));
}

/* table */
.contents label {
    margin: 0 0 var(--dbe-pc-list-margin-bottom);
    font-size: calc(var(--dbe-pc-p-font-size) - 1px);
    font-weight: var(--dbe-pc-h3-font-weight);
}
.contents table {
    width: var(--dbe-pc-list-narrow-width);
    line-height: 1.4em;
}
.contents table tr td,
.contents table tr th {
    padding: 6px;
    font-size: calc(var(--dbe-pc-p-font-size) - 2px);
    border: 1px solid var(--dbe-border-color);
}
.contents table tr th {
    text-align: center;
}
.contents table tr td {
    text-align: left;
}

.contents table thead {
    color: #FFF;
    font-weight: var(--dbe-pc-h3-font-weight);
    text-align: center;
    background-color: var(--dbe-border-color);
}

/* button */
.term-footer {
    text-align: center;
}
.btn-full.btn-primary {
    width: var(--dbe-pc-button-width);
    height: var(--dbe-pc-button-height);
    margin: var(--dbe-pc-button-margin);
    color: var(--dbe-font-color-white);
    font-size: var(--dbe-pc-button-font-size);
    font-weight: var(--dbe-pc-button-font-weight);
    line-height: var(--dbe-pc-button-height);
    background-color: var(--dbe-background-color-blue);
    border: none;
    border-radius: var(--dbe-pc-button-border-radius);
    cursor: pointer;
}

@media screen and (max-width: 990px){
    /* container */
    .container {
        width: var(--dbe-mb-container-width);
        margin: var(--dbe-mb-container-margin);
        padding: var(--dbe-mb-container-padding);
        font-size: var(--dbe-pc-p-font-size);
        overflow-x: hidden;
    }

    /* title */
    .title {
        width: calc(var(--dbe-mb-container-width) - 32px);
    }

    .title h1 {
        font-size: 26px;
        font-weight: 600;
        line-height: 34px;
    }

    /* policy */
    .contents {
        width: calc(var(--dbe-mb-container-width) - 32px);
        font-size: var(--dbe-mb-p-font-size);
    }

    .contents ul {
        width: calc(var(--dbe-mb-container-width) - 32px);
    }

    .contents ul li {
        width: calc(var(--dbe-mb-container-width) - 32px);
        margin: 0 0 var(--dbe-pc-list-margin-bottom);
    }

    .contents .list-title {
        font-size: var(--dbe-mb-h3-font-size);
        line-height: 1.4em;
    }

    /* table */
    .contents .table-container {
        width: var(--dbe-mb-container-width);
        overflow-x: scroll;
        scrollbar-width: none;
    }
    .contents label {
        font-size: calc(var(--dbe-mb-p-font-size) - 1px);
    }
    .contents table {
        width: var(--dbe-pc-list-narrow-width);
        margin-right: 32px;
    }
    .contents table tr td,
    .contents table tr th {
        font-size: calc(var(--dbe-mb-p-font-size) - 1px);
    }

    /* button */
    .btn-full.btn-primary {
        width: var(--dbe-mb-button-width);
        height: var(--dbe-mb-button-height);
        font-size: var(--dbe-mb-button-font-size);
        line-height: var(--dbe-mb-button-height);
    }
}