/* 全てに適用するCSS */
body {
    background-color: #2a2b3b; /* 背景色 */

    /* Top画像 */
    background-image: url("../img/Header_Back.png");
    background-position: top center;
    background-repeat: no-repeat;

    margin-bottom: 0px;
    margin-top: 0px;
    margin-left: 0px;
    margin-right: 0px;

    /*margin:0 auto;*/
    text-align: center;

    font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','Meiryo UI','メイリオ',Verdana,'ＭＳ Ｐゴシック',sans-serif;
}

h4 {
    margin-top: 0px;
    margin-bottom: 0px;
}

.unUseLinkUnderLine {
    text-decoration: none;
}

/* 幅700px センタリングでレイアウト */
.wrapper {
    width: 700px;
    margin: 0 auto;
    text-align: left;
    /*border: 1px solid #FF0000; /!*テスト用*!/*/
}

.sectionMargin {
    margin-top: 30px;
}

p {
    margin-top: 0px;
}

.headerStyle {
    height : 298px;
    width : auto;
}

.relative {
    position : relative;
}
.absoluteLogo {
    position : absolute;
    top : 12%;
    left : 26%;
}
.absoluteTitle {
    position : absolute;
    color : white;
    top : 32%;
    left : 55%;
    font-size: x-large;
}
.absoluteSite {
    position : absolute;
    color : white;
    top : 42%;
    left : 55%;
    font-size: x-small;
}
.absoluteTags {
    position : absolute;
    top : 70%;
    left : 8%;
}

.titleBanner {
    text-align: left;
    float : left;
}
.titleAdditional {
    height: 10px;
    text-align: right;
}
.additionalMargin {
    margin-top: 10px;
}
.titleDescription {
    margin-top: 60px;
    margin-left: 5%;
    color : white;
}
.additional {
    color : aliceblue;
    font-weight: bold;
    margin-right: 5px;
}
.pStyle {
    margin: 5px 0px;
}

.banners {
    max-width : 100% ;
    height : auto ;
}


.tagLabel {
    margin : 0px 0px;
    color: azure;
    border-style : solid;
    border-color: azure;
}


.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}

.video-container iframe {
    position: absolute;
    top: 5%;
    left: 5%;
    width: 90%;
    height: 95%;
}

.titleFooter {
    margin-left: 5%;
    position : relative;
}
.titleFooterBase {
    width: 94.72%;
    height: 65px;
}
.titleFooterUpperLayer {
    position: absolute;
    top : 12px;
    left: 10px;
    width : 322px;
}
.titleFooterUpperLayerText {
    position: absolute;
    top : 22px;
    left: 348px;
    color : black;
}

.footerMargin {
    margin-top: 40px;
}

.footerInnerMargin {
    margin-top: 10px;
}

.center {
    text-align: center;
}

.copyright {
    color : azure;
}

.storeBadge {
    height : 40px;
    width : auto;
}

/* モバイル用レイアウト // ウィンドウ幅が0〜max-width pxの場合に適用するCSS */
@media screen and ( max-width:699px )
{
    .wrapper {
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
        text-align: left;
        /*border: 1px solid #FF0000;*/
    }

    .articles {
        margin: 0 auto;
        width : 100%;
        max-width: 100%;
    }

    .titleBannerSize {
        height : 25px;
        widht : auto;
    }

    .absoluteLogo {
        position : absolute;
        top : 10%;
        left : 0;
        right : 0;
        margin: 0 auto;
    }

    .absoluteTags {
        position : absolute;
        top : 82%;
        width : 290px;
        right: 0;
        left: 0;
        margin:0 auto;
    }
    .absoluteTitle {
        position : absolute;
        color : white;
        top : 62%;
        width : 170px;
        right: 0;
        left: 0;
        margin:0 auto;
        font-size: x-large;
    }
    .absoluteSite {
        position : absolute;
        color : white;
        top : 73%;
        width : 100px;
        right: 0;
        left: 0;
        margin:0 auto;
        font-size: x-small;
    }

    .tagStyle {
        height : 20px;
        width : auto;
        /*height : auto;*/
    }

    .video-container iframe {
        position: absolute;
        top: 0%;
        left: 0%;
        width: 100%;
        height: 100%;
    }
    .titleFooter {
        margin-left: 0%;
        position : relative;
    }
    .titleFooterBase {
        width: 100%;
        height: 33px;
    }
    .titleFooterUpperLayer {
        position: absolute;
        top : 6px;
        left: 5px;
        width : 166px;
    }
    .titleFooterUpperLayerText {
        position: absolute;
        top : 9px;
        left: 178px;
        color : black;
        font-size : 10px;
    }
    .titleDescription {
        margin-top: 25px;
        margin-left: 5%;
        color : white;
    }
    .storeBadge {
        height : 20px;
        width : auto;
    }
    .additionalMargin {
        margin-top: 0px;
    }
    .additionalMobile {
        font-size: 10px;
        margin: 0 0;
    }
    .additional {
        color : aliceblue;
        font-size: 10px;
        font-weight: bold;
        margin-right: 5px;
    }

}

