@charset "shift_jis";
/*
	2017 ver 5.0
	2014 siterewal ver.4.1
*/
/* --------------------------------------------------
main
-------------------------------------------------- */
    body {
    margin-bottom: 1020px;
    }

    .main{ font-family: "メイリオ",sans-serif; overflow-x: hidden;}
    .pc-hidden{ display: block;}
    .sp-hidden{ display: none;}
    dl div { margin: initial !important;}
    .main img , .main picture{ display:block; width: 100%;}
    .main .box { margin: 3%;}
    .main .contents { width: 100%;height: auto;padding: 0% 3%;}
    .main em { background: linear-gradient(transparent 57%, #fff1d9 35%);line-height: 2.2;}
    .main p {
    text-align: justify;
    text-justify: inter-ideograph;
    }
    .main h2 {
    font-size: calc(18px + 30*((100vw - 320px) / 600));
    line-height: 1.4;
    letter-spacing: -0.5px;
    margin: 1.0em auto;
    color:  #e4004f;
    }
    .main h2 + p {margin-bottom: 20px;}
    .main h3{ font-size: 16px;}
    .main h4{ font-size: 17px;}
    .main .detail-755w{
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
    }

    /* .Firstview & .contents */
    section.Firstview {
    width: 100%;
    height: fit-content;
    }

    section {letter-spacing: 0.07em;}
    section.Firstview h1 {
    padding: 0% !important;
    margin: auto;
    background-image: url(../image/sp-Firstview_bg.png);
    background-repeat: no-repeat;
    background-position: left 0;
    background-size: 99.9999vw 96.5vw;
    }

    section .read {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1.5vw 3vw 2vw;
    position: relative;
    width: 100%;
    background: #e4004f;
    }

    section.Firstview .read img:nth-of-type(1) {
    width: 57vw;
    margin-left: -5vw;
    margin-top: 3vw;
    margin-bottom: 3vw;
    }

    section.Firstview .read span.dotted-line {
    background-image: url(../image/dotted.png);
    background-size: 6.2px 2.11px;
    background-repeat: repeat-x;
    background-position: 5px center;
    width: 100%;
    height: 3.7px;
    }

    section.Firstview .read img:nth-of-type(2) {
    width: 93vw;
    margin-top: 3vw;
    margin-bottom: 3vw;
    }


    section dl.Card-wrap{
    display: flex;
    flex-wrap: wrap;
    gap: 3vw 0vw;
    justify-content: space-between;
    align-items:stretch;
    height: 100%;
    }
    section dl.Card-wrap div{
    width: calc(100% / 2.04);
    border: #dedede 1px solid;
    padding: 1vw;
    box-sizing: border-box;
    }
    section dl.Card-wrap dt {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    }
    section dl.Card-wrap dt span{
    display: block;
    margin: inherit;
    text-align: center;
    }
    section dl.Card-wrap dt img{
    display: block;

    }
    section dl.Card-wrap dt .Gift-Card {
    font-size: calc(18px + 12*((100vw - 320px) / 600));
    display: block;
    margin: 0 auto;
    }
    section dl.Card-wrap dt .Gift-Card small{ font-size: 56%;}
    section dl.Card-wrap dt .Gift-Card strong{
    font-size: 12px;
    }
    section dl.Card-wrap dd{
    background: #dedede;
    padding: 15px;
    margin-top: 8px;
    }
    section dl.Card-wrap dt b{
    font-size: 16px;
    }
    section dl.Card-wrap dt b.red{
    color: #d31619;
    }
    section dl.Card-wrap dt b.blue{
    color: #30aae2;
    }
    p.chushaku {
    padding: 10px 0;
    }

    .contents h3 {
    color: #000 !important;
    position: relative;
    font-weight: bold;
    padding: 0.3em 0.3em 0.2em;
    margin-top: 10%;
    margin-bottom: 3%;
    background: #fadbd9;
    line-height: 1.3;
    border-bottom: solid 9px #e4004f;
    z-index: -2;

    &::before {
    position: absolute;
    content: '';
    left: -2px;
    top: -2px;
    width: 0;
    height: 0;
    border: none;
    border-bottom: solid 79px transparent;
    z-index: -1;
    }
    &::after {
    position: absolute;
    content: '';
    right: -3px;
    top: -7px;
    width: 0;
    height: 0;
    border: none;
    border-bottom: solid 79px white;
    z-index: -1;
    }
    }

    .contents h4 {
    text-align: center;
    margin: 17% auto 3%;
    font-weight: bold;
    color:  #e4004f;

    &::after {
    content: "";
    display: block;
    width: 50%;
    height: 2px;
    background-image: linear-gradient(90deg, rgba(0, 96, 100, 0),  #e4004f , rgba(0, 96, 100, 0));
    margin: 5px auto 0;
    border-radius: 5px;
    }
    }

    .col-head-type1 { border-collapse: collapse;border-spacing: 0;width: 100%;}
    .col-head-type1 th, .col-head-type1 td {border: 1px solid #dbe1e8;padding: 30px 16px;font-size: 14px;}
    .col-head-type1 th {
    background: #fffcfa;
    text-align: left;
    width: 262px;
    height: auto;
    font-weight: bold;
    }

    .col-head-type1 td {
    text-align: justify;
    text-justify: inter-ideograph;
    }

    td > ul > li , .kiyaku-wrap > ul >li{ list-style: disc;margin-bottom: 15px;}
    .contents .kiyaku-wrap {
    border: solid 1px #1b7e97;
    height: 200px;
    overflow-y: scroll;
    padding: 1% 2% 0% 7%;
    margin: 0 auto;
    scrollbar-width: thin;
    scrollbar-color: #006680 #edf7fa;
    }
    td > ul{padding-left: 21px;}

    .contents .kiyaku-wrap > ol > li { list-style: circle;}
    .contents .kiyaku-wrap > ul > li,
    .contents .kiyaku-wrap > ol > li { margin: 1% 0;}
    .contents .kiyaku-wrap > ul,
    .contents .kiyaku-wrap > ol { margin-bottom: 2%;}
    .contents .box_w80-wrap,.kiyaku-wrap { width:100%;margin: 0 auto 15%;}
    .contents .box_w80-wrap dt, .box_w80-wrap dd { font-weight: normal;line-height: 26px;font-size: 14px;}
    .contents .faq-ttl p, .faq-content p { font-size: 14px;padding: 0;}
    .contents .faq-ttl { padding: 16px 15px;font-size: 17px;}
    .contents .faq-ttl { position: relative;background-color: #edf7fa;cursor: pointer;font-weight: bold;}
    .contents .faq-ttl:hover { color: #d20014;text-decoration: underline;}
    .contents .faq-ttl p::before { content: '';display: inline-block;margin-right: 1em;}
    .contents .faq-content , .faq-ttl { margin-top: 25px;}
    .contents .faq-content {
    display: none;
    margin-top: 0;
    margin-left: 0;
    padding: 20px;
    border-left: solid 2px #dcecf1;
    border-right: solid 2px #dcecf1;
    border-bottom: solid 2px #dcecf1;
    }

    .contents .faq-content p::before { content: '';display: inline-block;margin-right: 1em;color: red;}
    .contents .faq-ttl::before,
    .contents .faq-ttl::after {/* 「+」を追加 */
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 4%;
    width: 12px;
    height: 1px;
    margin: auto;
    background-color: #000;
    }

    .contents .faq-ttl::after { transform: rotate(90deg); transition: .3s;}

    .contents .faq-ttl.is-active::after {
    transform: rotate(180deg);
    }

    a#btn {
    display: block;
    width: 70%;
    max-width: 380px;
    padding: 17px 0;
    background-color: #cc0000;
    border-bottom: 1px solid #990606;
    color: #fff;
    text-align: center;
    position: relative;
    border-radius: 0;
    box-shadow: 1px 3px 3px rgb(102 102 102 / 32%);
    margin: 13% auto;
    font-size: 15px;

    &::hover{
    color: #FFF;
    text-decoration:underline;
    opacity: 0.7;
    }
    }

    .Fixed-button {
    position: sticky;
    top: auto;
    bottom: 0px;
    z-index: 999;
    left: 0;
    min-width: 100%;
    background-size: auto auto;
    background-color: rgb(250 219 217);
    background-image: repeating-linear-gradient(45deg, transparent, transparent 8px, rgb(251, 242, 221) 5px, rgba(251, 242, 221, 1) 16px);
    border-top: 3px solid #e4004f;
    border-bottom: 3px solid #e4004f;
    box-shadow: 0px 13px 12px 20px rgb(113 96 34 / 8%);
    padding: 0 0;
    display: flex;
    justify-content: center;
    }

    .Fixed-button a#btn{
    margin: 13px;
    border-radius: 3px;
    }

    .repost .box2,
    .repost p{
    max-width: 800px;
    margin: auto;
    text-align: center;
    }

/* ================================================= */
/* 　.oubohouhou_inner - */
/* ================================================= */

    .foot_AppDL_area h5.toparea_AppDL_h5 {
    text-align: center;
    font-size: 22px;
    margin: 1% auto 1%;
    font-weight: bold;
    color: #815d2e;
    }

    dd.oubohouhou_inner {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 20px;
    margin: 0 auto;
    width: 90%;
    max-width: 980px;
    }

    .oubohouhou_inner .oubo-step-block {
    width: 100%;
    border: #dedede 1px solid;
    padding: 1vw;
    box-sizing: border-box;
    margin: 0 auto;
    }

    .oubo-step-block .oubo-step-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 2% 0 2% 0;
    display: block;
    }

    .oubo-step-block dt.oubo-img {
    width: 100%;
    height: 250px;
    clear: both;
    background-color: #E6F4FD;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 8px;
    padding: 1% 0 1% 0;
    }

    .oubo-step-block dt.oubo-img .apli_imgBox {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    }

    .oubo-step-block dt.oubo-img img.flow002,
    .oubo-step-block dt.oubo-img img:not(.flow002) {
    width: 95%;
    max-width: 350px;
    margin: 0;
    height: auto;
    object-fit: contain;
    }

    .oubo-step-block dd.oubo-text {
    width: 100%;
    font-size: 16px;
    text-align: left;
    padding: 15px;
    margin: 0;
    line-height: 1.5;
    }

/* --------------------------------------------------
-----------------------------------------------------
Add_app Link
-----------------------------------------------------
-------------------------------------------------- */
    div.foot_btn_area a#btn{
    margin:  2% auto;
    }

    .Fixed-button {
    display: flex;
    flex-direction: column;
    }

    .Fixed-button > div:first-child {
    order: 1;
    }

    .TopApp_1024px_tate {
    order: 2;
    }

    .TopApp_1024px_tate {
    width: 100%;
    max-width: 900px;
    display: flex;
    flex-direction: column;
    padding: 0 0% 0 0%;
    }

    .sp_mb20px {
    margin-bottom: 20px;
    }

    .foot_AppDL_area {

    height: auto;
    margin: 0 0 2% 0;
    /* background-color: #ffffff; */
    text-align: center;
    }


    .main h4 {
    text-align: center;
    margin: 8% auto 3%;
    font-size: 23px;
    }

    .foot_AppDL_area h4.toparea_AppDL_h4 {
    text-align: center;
    margin: 1% auto 1%;
    font-weight: bold;
    color:  #e4004f;

    &::after {
    content: "";
    display: block;
    width: 50%;
    height: 2px;
    background-image: linear-gradient(90deg, rgba(0, 96, 100, 0),  #e4004f, , rgba(0, 96, 100, 0));
    margin: 5px auto 0;
    border-radius: 5px;
    }
    }

    ul.AppDL_inner {
    width: 100%;
    max-width: 960px;
    height: auto;
    /* background-color: #ffffff; */
    padding: 2%;
    /* padding: 0 0 0 10px; */
    margin: 0 auto 0 auto;
    border-radius: 10px;
    }

    .AppDL_inner > li:nth-child(1), .AppDL_inner > li:nth-child(2) {
    display: inline-block;
    }

    .AppDL_inner > li:nth-child(3) {
    width: 100%;
    text-align: center;
    font-size: 1.1em;
    }

    p.font_size_coment {
    font-size: 16px;
    text-align: center;
    }


/* --------------------------------------------------
-----------------------------------------------------
window size 600-
-----------------------------------------------------
-------------------------------------------------- */

@media screen and (min-width:600px) {

/* ----------
Base 600px-
--------------------- */

    .main .box {margin: 3%;}
    .main a#btn {
    width: 55%;
    padding: 15px 0;
    /* padding: 22px 0; */
    font-size: 20px;
    margin: 40px auto 60px ;
    }
    .main h2 {
    font-size: 27px;
    }
    .main h3 {
    font-size: 20px;
    margin-top: 9%;
    &::after { border-left: solid 40px transparent;}
    }

    .main h4 {
    text-align: center;
    margin: 8% auto 3%;
    font-size: 23px;
    }

    section dl.Card-wrap dt .Gift-Card {
    font-size: 20px;
    }

    .col-head-type1 th { font-size: 17px;}
    .col-head-type1 td { font-size: 16px;}
    td > ul{ padding-left: 25px;}
    .contents .box_w80-wrap dt, .box_w80-wrap dd { font-weight: normal;line-height: 30px;font-size: 16px;}
    .contents .box_w80-wrap, .kiyaku-wrap { width: 100%;margin: 0 auto 12%;}
    .contents .kiyaku-wrap { padding: 1% 1% 0% 4%;}
    .contents .box_w80-wrap dt, .box_w80-wrap dd { font-weight: normal;line-height: 26px;font-size: 17px;}
    .contents .faq-ttl p, .faq-content p { display: block;font-size: 16px;padding: 0px 4px;}
    .contents .faq-ttl { padding: 27px 15px;font-size: 17px;}


}


/* ----------
oubohouhou_inner 600px-
--------------------- */
    dd.oubohouhou_inner {
    width: 100%;
    max-width: 500px;
    gap: 30px;
    }

    .oubo-step-block .oubo-step-inner {
    flex-direction: column;
    }


/* ----------
Add_app Link 600px-
--------------------- */

    .TopApp_1024px_tate {
    width: 100%;
    max-width: 960px;
    display: flex;
    flex-direction: column;
    padding: 0 0% 0 0%;
    margin: 0 auto;
    }

    .sp_mb20px {
    margin-bottom: 20px;
    }

    .foot_AppDL_area {

    height: auto;
    margin: 0 0 0% 0;
    /* background-color: #ffffff; */
    text-align: center;
    }

    h3.toparea_AppDL_h3 {

    font-size: clamp(2.438rem, 2.313rem + 0.33vw, 2.5rem);
    font-weight: 900;
    font-family: "RoundedMgenplus-medium", sans-serif;
    font-size: 20px;
    margin-top: 0%;
    }

    .foot_AppDL_area h4.toparea_AppDL_h4 {
    text-align: center;
    margin: 1% auto 1%;
    font-weight: bold;
    color: #e4004f;

    &::after {
    content: "";
    display: block;
    width: 50%;
    height: 2px;
    background-image: linear-gradient(90deg, rgba(0, 96, 100, 0), #e4004f, rgba(0, 96, 100, 0));
    margin: 5px auto 0;
    border-radius: 5px;
    }
    }

    .main h4 {
    text-align: center;
    margin: 8% auto 3%;
    font-size: 23px;
    }

    ul.AppDL_inner {
    width: 100%;
    max-width: 960px;
    height: auto;
    /* background-color: #ffffff; */
    padding: 2%;
    /* padding: 0 0 0 10px; */
    margin: 0 auto 0 auto;
    border-radius: 10px;
    }



    .AppDL_inner > li:nth-child(1), .AppDL_inner > li:nth-child(2) {
    display: inline-block;
    }

    .AppDL_inner > li:nth-child(3) {
    width: 100%;
    text-align: center;
    font-size: 1.1em;
    }

    p.font_size_coment {
    font-size: 16px;
    text-align: center;
    }

/* ----------
table responsive 600px-
--------------------- */

@media only screen and (max-width: 600px) {

    .col-head-type1 tr,.col-head-type1 th,.col-head-type1 td { display: block;width: auto;}
    .col-head-type1 tr:first-child { border-top: 1px solid #dbe1e8;}
    .col-head-type1 th, .col-head-type1 td { border-top: none;padding: 2% 2% 2% 3%;}
    .col-head-type1 td { padding-bottom: 4%;}

}
/* --------------------------------------------------
-----------------------------------------------------
window size 900-
-----------------------------------------------------
-------------------------------------------------- */
@media screen and (min-width:900px) {

    .pc-hidden{ display: none;}
    .sp-hidden{ display: block;}
    .main section.Firstview h1 {
    height: fit-content;
    margin: 100px auto 0 auto;
    background-image: url(../image/pc-Fistview_bg.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    }

    section.Firstview .read {
    flex-direction: row;
    align-items: flex-end;
    padding: 15px 3vw;
    }
    section.Firstview .read span.dotted-line {
    display: none;
    }
    section.Firstview .read img:nth-of-type(1) {
    width: 276px;
    margin: 0;
    margin-left: 63px;
    }
    section.Firstview .read img:nth-of-type(2) {
    width: 430px;
    margin: 0;
    margin-left: 76px;
    }
    section dl.Card-wrap div{
    width: 48%;
    }
    section dl.Card-wrap dt {
    display: flex;
    flex-direction: row;
    align-items: center;
    }
    section dl.Card-wrap dt span{
    width: 50%;
    }
    section dl.Card-wrap dt span.Gift-Card{
    width: 50%;
    text-align: left;
    font-size: 25px;
    }
    section dl.Card-wrap dt span.Gift-Card strong{
    font-size: 14px;
    }
    section dl.Card-wrap dt span.Gift-Card strong b{
    font-size: 20px;
    }
    section dl.Card-wrap dt img {
    width: 100%;
    }

    .main .contents { padding: 0;}
    .main .box { margin: 3% auto; width: auto;}
    a#btn { margin: 100px auto;}
    .Fixed-button {
    min-width: 100%;
    }

    .Fixed-button a#btn{
    margin: 10.5px;
    border-radius: 0;
    font-size: 20px;
    }

    /* ----------
    Add_app Link 900px-
    --------------------- */

    dd.oubohouhou_inner {
    flex-direction: row;
    justify-content: space-between;
    gap: 20px;
    padding: 40px 0;
    width: 100%;
    max-width: 960px;
    align-items: stretch;
    }


    .oubohouhou_inner .oubo-step-block {
    width: calc(33.33% - 15px);
    padding: 15px 15px 0px 15px;
    }

    .oubo-step-block .oubo-step-inner {
    flex-direction: column;
    display: flex;
    height: 100%;
    }

    .oubo-step-block dt.oubo-img {
    max-width: 100%;
    }

    .oubo-step-block dd.oubo-text {
    flex-grow: 1;
    }

}