@charset "UTF-8";
#Wrap {width: 100%;}
#Contents-All .img-width {width: 100%;}
#Contents-All a:hover {cursor: pointer; opacity: 0.5;}
#Contents-All {font-feature-settings: 'palt'; text-align: justify; text-justify: inter-ideograph;} 
#Contents-All p {font-family: '游ゴシック体', YuGothic, '游ゴシック Medium', 'Yu Gothic', 'メイリオ', sans-serif;}
#Contents-All img {display: block;}
#Contents-All .relative-area {position: relative;}
#Contents-All ul li {list-style: none;}
#Contents-All .futura-font {font-family: futura-pt, sans-serif;font-weight: 400;font-style: normal;}
#Contents-All .scroll-up{opacity: 0; transition: all 2s;}
#Contents-All .scroll-up.done, .scroll-fade.done{opacity : 1;}
/*************************************SP****************************************/
@media screen and ( max-width:560px ) {
    /* #Contents-All {
        background-image: url(../img/sp.jpg);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position-y: -99px;
    } */
    #Contents-All {margin: 0 auto;}
    #Contents-All .pc-only {display: none;}
    #Contents-All .item-flex-sp {display: flex;flex-wrap: wrap;justify-content: center;}
    .footer .footer-inner {
        margin: 0 auto !important;
    }
    /*==========================
    共通項目
    ==========================*/
    #Contents-All .size600 {width: calc(600*(100vw/750));}
    #Contents-All .size670 {width: calc(670*(100vw/750));}
    #Contents-All .size750 {width: calc(750*(100vw/750));}
    /***********フォント *************/
    #Contents-All .credit {
        font-size: calc(22*(100vw/750));
        line-height: 2.3;
        letter-spacing: 0.3px;
        text-align: center;
    }
    #Contents-All .c-tittle1 {
        font-size: calc(38*(100vw/750));
        font-weight: 500 !important;
        letter-spacing: 0.55px;
        text-align: center;
        color: #7c1c23;
    }
    #Contents-All .c-tittle2 {
        font-size: calc(46*(100vw/750));
        font-weight: 500 !important;
        letter-spacing: 0.55px;
        text-align: center;
        color: #7c1c23;
        text-decoration: underline;
    }
    #Contents-All .c-tittle3 {
        font-size: calc(32*(100vw/750));
        font-weight: 500 !important;
        letter-spacing: 0.4px;
        text-align: center;
        color: #7c1c23;
    }
    #Contents-All .c-txt {
        font-size: calc(26*(100vw/750));
        line-height: 2;
        letter-spacing: 1.2px;
        text-align: center;
    }
    /*==========================
    Contents1
    ==========================*/
    #Contents-All .c1-block2 {
        margin: calc(124*(100vw/750)) auto 0;
    }
    #Contents-All .c1-block1 {
        margin: calc(36*(100vw/750)) auto 0;
    }
    #Contents-All .c1-credit {
        margin-top: calc(46*(100vw/750));
    }
    /*==========================
    Contents2
    ==========================*/
    #Contents-All .c2-block1 {
        margin: calc(150*(100vw/750)) auto 0;
    }
    #Contents-All .c2-tittle1 {
        margin-top: calc(60*(100vw/750));
    }
    #Contents-All .c2-tittle2 {
        margin-top: calc(30*(100vw/750));
    }
    #Contents-All .c2-tittle3 {
        margin-top: calc(32*(100vw/750));
    }
    #Contents-All .c2-txt {
        margin-top: calc(54*(100vw/750));
    }
    #Contents-All .c2-txt1 {
        margin-top: calc(20*(100vw/750));
    }
    #Contents-All .c2-flex-area::before {
        content: '';
        display: block;
        width: 100%;
        height: calc(1119*(100vw/750));
        position: absolute;
        top: calc(642*(100vw/750));
        left: 0;
        background-color: rgba(147, 164, 183, 0.2);
        z-index: 999;
    }
    /*==========================
    Contents3
    ==========================*/
    #Contents-All .c3-block1 {
        margin: calc(250*(100vw/750)) auto 0;
    }
    #Contents-All .c3-tittle1 {
        margin-top: calc(56*(100vw/750));
    }
    #Contents-All .c3-tittle2 {
        margin-top: calc(30*(100vw/750));
    }
    #Contents-All .c3-tittle3 {
        margin-top: calc(32*(100vw/750));
    }
    #Contents-All .c3-txt {
        margin-top: calc(54*(100vw/750));
    }
    #Contents-All .c3-txt1 {
        margin-top: 19px;
    }
    #Contents-All .c3-flex-area::before {
        content: '';
        display: block;
        width: 100%;
        height: calc(1066*(100vw/750));
        position: absolute;
        top: calc(640*(100vw/750));
        left: 0;
        background-color: rgba(147, 164, 183, 0.2);
        z-index: 999;
    }
    /*==========================
    Contents4
    ==========================*/
    #Contents-All .c4-block1 {
        margin: calc(207*(100vw/750)) auto 0;
    }
    #Contents-All .c4-block2 {
        margin: calc(40*(100vw/750)) auto 0;
    }
    #Contents-All .c4-credit {
        margin-top: calc(46*(100vw/750));
    }
    /*==========================
    Contents5
    ==========================*/
    #Contents-All .c5-block {
        margin-top: calc(50*(100vw/750));
    }
    /*==========================
    Check-item-all
    ==========================*/
    #Contents-All .check-item-all {
        width: calc(355*(100vw/750));
        border: 1px solid #333333;
        text-align: center;
        margin: calc(120*(100vw/750)) auto calc(116*(100vw/750));
    }
    #Contents-All .check-item-all a {
        display: inline-block;
        font-size: calc(24*(100vw/750));
        line-height: 2.45;
        letter-spacing: 0.3px;
    }
}
/**********************************タブレット*************************************/
@media only screen and (min-width: 561px) and (max-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
    #Contents-All {width: calc(1024*(100vw/1024));margin: calc(80*(100vw/1024)) auto 0;}
    #Contents-All .item-flex{display: flex;flex-wrap: wrap;justify-content: center;}
    #Contents-All .item-flex-reverce{flex-direction: row-reverse;}
    #Contents-All .sp-only {display: none;}
    .main-area::after {
        margin: calc(0*(100vw/1024)) auto !important;
    }
    /*==========================
    ipad size
    ==========================*/
    @media screen and (min-width: 561px) and (max-width: 768px) {
        #Contents-All .credit {font-size: calc(11*(100vw/1024)) !important;}
        #Contents-All .c-tittle1 {font-size: calc(17*(100vw/1024)) !important}
        #Contents-All .c-tittle2 {font-size: calc(20*(100vw/1024)) !important;}
        #Contents-All .c-tittle3 {font-size: calc(15*(100vw/1024)) !important;}
        #Contents-All .c-txt {font-size: calc(13*(100vw/1024)) !important;}
        #Contents-All .check-item-all a {font-size: calc(15*(100vw/1024)) !important;}
        #Contents-All .c2-block2::before {height: calc(437*(100vw/1024)) !important;}
        #Contents-All .c3-block2::before {height: calc(414*(100vw/1024)) !important;}
    }
    /*==========================
    共通項目
    ==========================*/
    #Contents-All .size380 {width: calc(380*(100vw/1024));}
    #Contents-All .size400 {width: calc(400*(100vw/1024));}
    #Contents-All .size480 {width: calc(480*(100vw/1024));}
    #Contents-All .size950 {width: calc(950*(100vw/1024));}
    /***********フォント *************/
    #Contents-All .credit {
        font-size: 11px;
        line-height: 1.75;
        letter-spacing: 0.3px;
    }
    #Contents-All .c-tittle1 {
        font-size: 17px;
        font-weight: 500 !important;
        letter-spacing: 0.55px;
        text-align: center;
        color: #7c1c23;
    }
    #Contents-All .c-tittle2 {
        font-size: 20px;
        font-weight: 500 !important;
        letter-spacing: 0.7px;
        text-align: center;
        color: #7c1c23;
        text-decoration: underline;
    }
    #Contents-All .c-tittle3 {
        font-size: 15px;
        font-weight: 500 !important;
        letter-spacing: 0.4px;
        text-align: center;
        color: #7c1c23;
    }
    #Contents-All .c-txt {
        font-size: 13px;
        line-height: 2;
        letter-spacing: 0.3px;
        text-align: center;
    }
    /*==========================
    Main-Visual
    ==========================*/
    #Contents-All .main-visual-area {
        margin: 0 auto;
    }
    /*==========================
    Contents1
    ==========================*/
    #Contents-All .c1-flex-area {
        margin-top: calc(100*(100vw/1024));
    }
    #Contents-All .c1-credit {
        margin-top: calc(16*(100vw/1024));
        text-align: center;
    }
    /*==========================
    Contents2
    ==========================*/
    #Contents-All .c2-flex-area {
        margin-top: calc(98*(100vw/1024));
    }
    #Contents-All .c2-block2 {
        margin: 0 calc(19*(100vw/1024)) 0 calc(21*(100vw/1024));
    }
    #Contents-All .c2-tittle1 {
        margin-top: calc(106*(100vw/1024));
    }
    #Contents-All .c2-tittle2 {
        margin-top: calc(13*(100vw/1024));
    }
    #Contents-All .c2-tittle3 {
        margin-top: calc(14*(100vw/1024));
    }
    #Contents-All .c2-txt {
        margin-top: calc(21*(100vw/1024));
    }
    #Contents-All .c2-txt1 {
        margin-top: calc(13*(100vw/1024));
    }
    #Contents-All .c2-block2::before {
        content: '';
        display: block;
        width: calc(460*(100vw/1024));
        height: calc(412*(100vw/1024));
        position: absolute;
        top: calc(80*(100vw/1024));
        left: calc(-21*(100vw/1024));
        background-color: rgba(147, 164, 183, 0.2);;
        z-index: 999;
    }
    /*==========================
    Contents3
    ==========================*/
    #Contents-All .c3-flex-area {
        margin-top: calc(55*(100vw/1024));
    }
    #Contents-All .c3-block2 {
        margin: 0 calc(69*(100vw/1024)) 0 calc(70*(100vw/1024));
    }
    #Contents-All .c3-img {
        margin: calc(143*(100vw/1024)) 0 0 calc(50*(100vw/1024));
    }
    #Contents-All .c3-tittle1 {
        margin-top: calc(88*(100vw/1024));
    }
    #Contents-All .c3-tittle2 {
        margin-top: calc(13*(100vw/1024));
    }
    #Contents-All .c3-tittle3 {
        margin-top: calc(14*(100vw/1024));
    }
    #Contents-All .c3-txt {
        margin-top: calc(21*(100vw/1024));
    }
    #Contents-All .c3-txt1 {
        margin-top: calc(13*(100vw/1024));
    }
    #Contents-All .c3-block2::before {
        content: '';
        display: block;
        width: calc(460*(100vw/1024));
        height: calc(386*(100vw/1024));
        position: absolute;
        top: calc(62*(100vw/1024));
        right: calc(-20*(100vw/1024));
        background-color: rgba(147, 164, 183, 0.2);
        z-index: 999;
    }
    /*==========================
    Contents4
    ==========================*/
    #Contents-All .c4-flex-area {
        margin-top: calc(100*(100vw/1024));
    }
    #Contents-All .c4-block1 {
        height: calc(570*(100vw/1024));
    }
    #Contents-All .c4-block2 {
        margin: calc(100*(100vw/1024)) 0 0 calc(20*(100vw/1024));
    }
    #Contents-All .c4-credit {
        margin: calc(-84*(100vw/1024)) 0 0 calc(123*(100vw/1024));
    }
    /*==========================
    Contents5
    ==========================*/
    #Contents-All .c5-block {
        margin: calc(85*(100vw/1024)) auto 0;
    }
    /*==========================
    check-all-item
    ==========================*/
    #Contents-All .check-item-all {
        width: calc(220*(100vw/1024));
        border: 1px solid #333333;
        text-align: center;
        margin: calc(80*(100vw/1024)) auto calc(82*(100vw/1024));
    }
    #Contents-All .check-item-all a {
        display: inline-block;
        width: 100%;
        font-size: 15px;
        line-height: 2.3;
        letter-spacing: 0.2px;
    }
}
/*************************************PC****************************************/
@media screen and ( min-width:1025px ) {
    /* #Contents-All {
        background-image: url(../img/pc.jpg);
        background-size: 100%;
        background-position-y: -178px;
    } */
    #Contents-All {width: 1200px;margin: 80px auto 0;}
    #Contents-All .item-flex{display: flex;flex-wrap: wrap;justify-content: center;}
    #Contents-All .item-flex-reverce{flex-direction: row-reverse;}
    #Contents-All .sp-only {display: none;}
    .main-area::after {
        margin: 0 auto !important;
    }
    /*==========================
    共通項目
    ==========================*/
    #Contents-All .size380 {width: 380px;}
    #Contents-All .size400 {width: 400px;}
    #Contents-All .size480 {width: 480px;}
    #Contents-All .size950 {width: 950px;}
    /***********フォント *************/
    #Contents-All .credit {
        font-size: 11px;
        line-height: 1.75;
        letter-spacing: 0.3px;
    }
    #Contents-All .c-tittle1 {
        font-size: 17px;
        font-weight: 500 !important;
        letter-spacing: 0.55px;
        text-align: center;
        color: #7c1c23;
    }
    #Contents-All .c-tittle2 {
        font-size: 20px;
        font-weight: 500 !important;
        letter-spacing: 0.7px;
        text-align: center;
        color: #7c1c23;
        text-decoration: underline;
    }
    #Contents-All .c-tittle3 {
        font-size: 15px;
        font-weight: 500 !important;
        letter-spacing: 0.4px;
        text-align: center;
        color: #7c1c23;
    }
    #Contents-All .c-txt {
        font-size: 13px;
        line-height: 2;
        letter-spacing: 0.3px;
        text-align: center;
    }
    /*==========================
    Main-Visual
    ==========================*/
    #Contents-All .main-visual-area {
        margin: 0 auto;
    }
    /*==========================
    Contents1
    ==========================*/
    #Contents-All .c1-flex-area {
        margin-top: 100px;
    }
    #Contents-All .c1-credit {
        margin-top: 16px;
        text-align: center;
    }
    /*==========================
    Contents2
    ==========================*/
    #Contents-All .c2-flex-area {
        margin-top: 98px;
    }
    #Contents-All .c2-block2 {
        margin: 0 19px 0 21px;
    }
    #Contents-All .c2-tittle1 {
        margin-top: 106px;
    }
    #Contents-All .c2-tittle2 {
        margin-top: 13px;
    }
    #Contents-All .c2-tittle3 {
        margin-top: 14px;
    }
    #Contents-All .c2-txt {
        margin-top: 21px;
    }
    #Contents-All .c2-txt1 {
        margin-top: 13px;
    }
    #Contents-All .c2-block2::before {
        content: '';
        display: block;
        width: 460px;
        height: 405px;
        position: absolute;
        top: 80px;
        left: -21px;
        background-color: rgba(147, 164, 183, 0.2);
        z-index: 999;
    }
    /*==========================
    Contents3
    ==========================*/
    #Contents-All .c3-flex-area {
        margin-top: 55px;
    }
    #Contents-All .c3-block2 {
        margin: 0 69px 0 70px;
    }
    #Contents-All .c3-img {
        margin: 143px 0 0 50px;
    }
    #Contents-All .c3-tittle1 {
        margin-top: 88px;
    }
    #Contents-All .c3-tittle2 {
        margin-top: 13px;
    }
    #Contents-All .c3-tittle3 {
        margin-top: 14px;
    }
    #Contents-All .c3-txt {
        margin-top: 21px;
    }
    #Contents-All .c3-txt1 {
        margin-top: 13px;
    }
    #Contents-All .c3-block2::before {
        content: '';
        display: block;
        width: 460px;
        height: 378px;
        position: absolute;
        top: 62px;
        right: -20px;
        background-color: rgba(147, 164, 183, 0.2);
        z-index: 999;
    }
    /*==========================
    Contents4
    ==========================*/
    #Contents-All .c4-flex-area {
        margin-top: 100px;
    }
    #Contents-All .c4-block1 {
        height: 570px;
    }
    #Contents-All .c4-block2 {
        margin: 100px 0 0 20px;
    }
    #Contents-All .c4-credit {
        margin: -84px 0 0 210px;
    }
    /*==========================
    Contents5
    ==========================*/
    #Contents-All .c5-block {
        margin: 85px auto 0;
    }
    /*==========================
    check-all-item
    ==========================*/
    #Contents-All .check-item-all {
        width: 220px;
        border: 1px solid #333333;
        text-align: center;
        margin: 80px auto 82px;
    }
    #Contents-All .check-item-all a {
        display: inline-block;
        width: 100%;
        font-size: 15px;
        line-height: 2.3;
        letter-spacing: 0.2px;
    }
}