@charset "utf-8";

/* CSS INFORMATION -====================================================
File name : data.css
Description :
===================================================================== */

#subpage #wrapper {
    padding: 0;
}

@media screen and (min-width: 768px) {
    .subpage_copy {
        margin: 0;
    }
}


/* =====================================================================
*    data_intro
* =================================================================== */

#data .subpage_ttl {
    padding-bottom: calc(20 / 750 * 100%);
}

#data .subpage_ttl::before {
    background: url(../images/common/bg_deco12.png) no-repeat center center;
    background-size: auto 100%;
}

.data_intro_ttl {
    width: calc(650 / 750 * 100%);
    margin: 0 auto calc(70 / 750 * 100%);
}


/* .data_intro_ttl::after {
    content: "";
    display: block;
    width: calc(129 / 650 * 100%);
    padding-top: calc(130 / 650 * 100%);
    background: url(../images/data/ttl3_2.png) no-repeat center center;
    background-size: cover;
    position: absolute;
    bottom: 0;
    right: 0;
    margin: 0 calc(41 / 650 * 100%) calc(-68 / 650 * 100%) 0;
} */

.data_intro_ttl .data_intro_ttl2 {
    width: calc(489 / 650 * 100%);
    margin: calc(50 / 650 * 100%) auto 0;
}

.data_intro_photo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: calc(650 / 750 * 100%);
    margin: 0 auto calc(80 / 750 * 100%);
    z-index: 2;
}

.data_intro_photo li {
    width: calc(313 / 650 * 100%);
}

.data_intro_photo li img {
    border-radius: 50%;
}

.data_intro_photo li::before {
    content: "";
    display: block;
    width: calc(280 / 313 * 100%);
    padding-top: calc(166 / 313 * 100%);
    background: url(../images/data/bg_cloud2.png) no-repeat center center;
    background-size: auto 100%;
    position: absolute;
    top: 0;
    left: 0;
    margin: calc(-72 / 313 * 100%) 0 0 calc(-130 / 313 * 100%);
}

.data_intro_photo li:nth-child(2)::before {
    width: calc(403 / 313 * 100%);
    padding-top: calc(194 / 313 * 100%);
    background: url(../images/data/bg_cloud1.png) no-repeat center center;
    background-size: auto 100%;
    margin: calc(243 / 313 * 100%) 0 0 calc(53 / 313 * 100%);
}

.data_intro_date {
    padding: calc(50 / 750 * 100%) 0;
    background: url(../images/common/bg_red2.jpg) repeat center top;
    background-size: calc(640 / 750 * 100%) auto;
}

.data_date {
    width: calc(710 / 750 * 100%);
    margin: 0 auto calc(30 / 750 * 100%);
}

.data_link {
    width: calc(650 / 750 * 100%);
    margin: 0 auto;
}

.data_link.btn1 a {
    border-radius: 2em;
    overflow: hidden;
    font-size: 3rem;
    line-height: 1.25;
}

.data_link.btn1 .arrow1::after {
    top: 0;
}

.data_link_pre,
.data_link_end {
    padding: calc(31 / 750 * 100vw) 0;
    background: url(../images/common/bg_blue.jpg) repeat center top;
    background-size: calc(300 / 750 * 100vw) auto;
    border-radius: 2em;
    overflow: hidden;
    color: #ebe7e1;
    font-size: 3rem;
    line-height: 1.25;
    text-align: center;
}

.data_link_end {
    background: url(../images/common/bg_black.jpg) repeat center top;
    background-size: calc(300 / 750 * 100vw) auto;
    color: #999793;
}

.data_intro_date_txt {
    margin: 0.9em 0 0;
    color: #ebe7e1;
    font-size: 2.4rem;
    line-height: 1;
    text-align: center;
}

.data_intro_box {
    padding: calc(80 / 750 * 100%) 0 calc(70 / 750 * 100%);
}

.data_intro_box_img1 {
    width: calc(653 / 750 * 100%);
    margin: 0 auto calc(50 / 750 * 100%);
}

.data_intro_box_img2 {
    width: calc(510 / 750 * 100%);
    margin: 0 auto calc(40 / 750 * 100%);
}

.data_intro_box_txt1 {
    width: calc(650 / 750 * 100%);
    margin: 0 auto;
    font-size: 2.4rem;
    line-height: 1.833;
    letter-spacing: 0;
}

.data_intro_box_txt1 strong {
    font-weight: normal;
}

.data_intro_box_color1 {
    color: #da4043;
}

.data_intro_box_color2 {
    color: #af5bb2;
}

.data_intro_box_color3 {
    color: #269f98;
}

.data_intro_box_color4 {
    color: #68963b;
}

.data_intro_box_txt1 .data_intro_box_img3 {
    display: inline-block;
    width: calc(34 / 650 * 100%);
    margin: 0 0.4em 0 0.2em;
    top: -0.1em;
    vertical-align: middle;
}

.data_intro_bonus {
    padding-top: calc(20 / 750 * 100%);
}

.data_intro_bonus .data_date {
    width: calc(651 / 750 * 100%);
    margin-bottom: calc(10 / 750 * 100%);
}

.data_bonus_txt {
    width: calc(650 / 750 * 100%);
    margin: 0 auto;
    padding: calc(22 / 750 * 100vw) 0;
    background: url(../images/common/bg_brown.jpg) repeat center top;
    background-size: calc(300 / 750 * 100vw) auto;
    border-radius: 3em;
    color: #ebe7e1;
    line-height: 1.2;
    text-align: center;
}

@media screen and (min-width: 768px) {
    #data .subpage_ttl {
        padding-bottom: calc(76 / 1040 * 100%);
        margin-bottom: calc(-55 / 1040 * 100%);
    }
    .data_intro {
        z-index: 2;
    }
    .data_intro_ttl {
        width: calc(489 / 1200 * 100%);
        margin: 0 auto calc(50 / 1200 * 100%);
    }
    /* .data_intro_ttl::after {
        width: calc(129 / 489 * 100%);
        padding-top: calc(130 / 489 * 100%);
        margin: 0 calc(-50 / 489 * 100%) calc(-66 / 489 * 100%) 0;
        z-index: 2;
    } */
    .data_intro_ttl .data_intro_ttl2 {
        width: 100%;
        margin: calc(50 / 489 * 100%) auto 0;
    }
    .data_intro_photo {
        width: calc(1090 / 1200 * 100%);
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        margin: calc(110 / 1200 * 100%) auto 0;
    }
    .data_intro_photo li {
        width: calc(250 / 1090 * 100%);
    }
    .data_intro_date {
        width: calc(900 / 1200 * 100%);
        margin: 0 auto;
        padding: calc(50 / 1200 * 100%) 0;
        background-size: calc(640 / 900 * 100%) auto;
    }
    .data_date {
        width: calc(533 / 900 * 100%);
        margin: 0 auto calc(30 / 900 * 100%);
    }
    .data_link {
        width: calc(488 / 900 * 100%);
    }
    .data_link.btn1 a {
        padding: calc(23 / 488 * 100%) 0;
        font-size: 2.25rem;
    }
    .data_link_pre,
    .data_link_end {
        padding: calc(23 / 488 * 100%) 0;
        font-size: 2.25rem;
    }
    .data_link.btn1 a::before {
        background: url(../images/common/bg_gold2.jpg) repeat center top;
        background-size: calc(150 / 488 * 100%) auto;
    }
    .data_link.btn1 .arrow1::after {
        top: -0.1em;
    }
    .data_intro_date_txt {
        font-size: 1.4rem;
    }
    .data_intro_box {
        padding: calc(75 / 1200 * 100%) 0 calc(60 / 1200 * 100%);
    }
    .data_intro_box_img1 {
        width: calc(653 / 1200 * 100%);
        margin: 0 auto calc(50 / 1200 * 100%);
    }
    .data_intro_box_img2 {
        width: calc(510 / 1200 * 100%);
        margin: 0 auto calc(40 / 1200 * 100%);
    }
    .data_intro_box_txt1 {
        width: calc(800 / 1200 * 100%);
        font-size: 1.6rem;
        line-height: 2.25;
    }
    .data_intro_box_txt1 .data_intro_box_img3 {
        width: calc(26 / 800 * 100%);
        margin: 0 0.2em;
    }
    .data_intro_bonus {
        padding-top: calc(20 / 1200 * 100%);
    }
    .data_intro_bonus .data_date {
        width: calc(701 / 900 * 100%);
        margin-bottom: 0;
    }
    .data_bonus_txt {
        width: calc(488 / 900 * 100%);
        padding: calc(17 / 900 * 100%) 0;
        background-size: calc(300 / 488 * 100%) auto;
        font-size: 1.8rem;
    }
}

@media screen and (min-width: 1200px) {
    #data .subpage_ttl {
        padding-bottom: 76px;
        margin-bottom: -55px;
    }
}


/* =====================================================================
*    data_present
* =================================================================== */

.data_present {
    padding: calc(60 / 750 * 100%) 0 calc(150 / 750 * 100%);
    background: url(../images/common/bg_blue.jpg) repeat center top;
    background-size: calc(300 / 750 * 100%) auto;
}

#data .data_present .subpage_ttl::before {
    background: url(../images/common/bg_deco13.png) no-repeat center center;
    background-size: auto 100%;
}

.data_present_list {
    width: calc(650 / 750 * 100%);
    margin: 0 auto;
}

.data_present_list li:not(:last-child) {
    margin: 0 0 calc(80 / 650 * 100%);
}

.data_present_box {
    margin: 0 0 calc(40 / 650 * 100%);
}

.data_present_point {
    margin: 0 0 0.4em;
    color: #da4043;
    font-size: 3.4rem;
    font-weight: normal;
    letter-spacing: 0;
}

.data_present_txt dt {
    margin: 0 0 0.45em;
    color: #b79044;
    font-size: 5.4rem;
    line-height: 1.185;
    letter-spacing: 0;
}

.data_present_txt1 {
    margin: 0 0 1em;
    padding: 0.5em 0;
    background: url(../images/common/bg_gold2.jpg) repeat center top;
    background-size: calc(150 / 650 * 100%) auto;
    border-radius: 2em;
    font-size: 4rem;
    line-height: 1;
    text-align: center;
}

.data_present_txt2 {
    color: #ebe7e1;
    letter-spacing: 0;
}

.data_present_txt3 {
    margin: 1em 0 0;
    padding: 0 0 0 1.2em;
    background: url(../images/common/btn_arrow1.png) no-repeat center left;
    background-size: calc(12 / 650 * 100%) auto;
    color: #ebe7e1;
}

.data_present_txt3 a {
    display: inline;
    color: #b79044;
    border-bottom: 1px solid #bf3033;
}

.data_present_photo {
    width: calc(500 / 650 * 100%);
    margin: 0 auto;
    padding: calc(14 / 650 * 100%);
    background-color: #fff;
}

.data_present_link {
    margin: calc(80 / 750 * 100%) auto 0;
}

.data_present_link .data_link.btn1 a {
    background: url(../images/common/bg_red.jpg) repeat center top;
    background-size: calc(300 / 750 * 100vw) auto;
}

@media screen and (min-width: 768px) {
    .data_present {
        margin: calc(-120 / 1200 * 100%) 0 0;
        padding: calc(120 / 1200 * 100%) 0 calc(150 / 1200 * 100%);
    }
    #data .data_present .subpage_ttl {
        margin-bottom: 0;
    }
    .data_present_list {
        width: calc(900 / 1200 * 100%);
    }
    .data_present_list li {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }
    .data_present_list li:not(:last-child) {
        margin: 0 0 calc(50 / 900 * 100%);
    }
    .data_present_box {
        width: calc(380 / 900 * 100%);
        margin: 0 auto;
    }
    .data_present_photo {
        width: calc(425 / 900 * 100%);
        margin: 0;
        padding: calc(14 / 900 * 100%);
    }
    .data_present_point {
        margin-top: -0.25em;
        font-size: 2.6rem;
    }
    .data_present_txt dt {
        margin: 0 0 0.4em;
        font-size: 3.7rem;
        line-height: 1.27;
        letter-spacing: -0.075em;
    }
    .data_present_txt1 {
        background-size: calc(150 / 380 * 100%) auto;
        font-size: 2.4rem;
    }
    .data_present_txt3 {
        margin: 3em 0 0;
        padding: 0 0 0 2em;
        background-size: calc(9 / 380 * 100%) auto;
    }
    .data_present_txt3 a:hover {
        border-color: transparent;
    }
    .data_present_link {
        width: calc(900 / 1200 * 100%);
        margin: calc(50 / 1200 * 100%) auto 0;
    }
}

@media screen and (min-width: 1200px) {
    .data_present {
        margin: -120px 0 0;
        padding: 120px 0 150px;
    }
}


/* =====================================================================
*    data_notice
* =================================================================== */

.data_notes {
    width: calc(650 / 750 * 100%);
    margin: calc(80 / 750 * 100%) auto 0;
    padding: calc(60 / 750 * 100%) calc(50 / 750 * 100%);
    background-color: #ebe7e1;
}

.data_notes_ttl {
    width: calc(176 / 550 * 100%);
    margin: 0 auto calc(50 / 550 * 100%);
    padding-top: calc(92 / 550 * 100%);
    background: url(../images/common/bg_deco12.png) no-repeat center top;
    background-size: calc(75 / 176 * 100%) auto;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.data_notes_subttl {
    margin: 0 0 0.7em;
    padding: 0 0 0.4em;
    border-bottom: 1px solid #d1bb92;
    color: #da4043;
    font-size: 2.8rem;
    font-weight: normal;
    line-height: 1.429;
    text-align: center;
}

.data_notes_list {
    margin: 0 0 1.4em;
}

.data_notes_list li {
    margin: 0 0 0.2em;
    padding: 0 0 0 1em;
    text-indent: -1em;
    letter-spacing: 0;
}

.data_notes_list li::before {
    content: "・";
}

.data_notes_list li a {
    display: inline;
    border-bottom: 1px solid #bf3033;
}

@media screen and (min-width: 768px) {
    .data_notes {
        width: calc(900 / 1200 * 100%);
        margin: calc(50 / 1200 * 100%) auto 0;
        padding: calc(30 / 1200 * 100%) calc(100 / 1200 * 100%) calc(60 / 1200 * 100%);
    }
    .data_notes_ttl {
        width: calc(106 / 700 * 100%);
        margin: 0 auto calc(25 / 700 * 100%);
        padding-top: calc(56 / 700 * 100%);
    }
    .data_notes_subttl {
        margin: 0 0 1em;
        padding: 0 0 0.8em;
        font-size: 1.4rem;
        text-align: left;
    }
    .data_notes_list {
        margin: 0 0 3em calc(50 / 700 * 100%);
    }
    .data_notes_list:last-of-type {
        margin-bottom: 0;
    }
    .data_notes_list li a:hover {
        border-color: transparent;
    }
}

@media screen and (min-width: 1200px) {}