@charset "UTF-8";
img {
	pointer-events: none;
}
html{
/*    background-color : #f3f4f9;*/
    font-size        : 16px;
    height           : 100%
}

img{
    max-width              : 100%;
    height                 : auto;
    -ms-interpolation-mode : bicubic
}

body{
    user-select                 : none;
    -webkit-user-select         : none;
    -moz-user-select            : -moz-none;
    -ms-user-select             : none;
    -o-user-select              : none;
    -webkit-touch-callout       : none;
    -webkit-user-select         : none;
    backface-visibility         : hidden;
    -webkit-backface-visibility : hidden;
    -webkit-font-smoothing      : antialiased;
    -moz-osx-font-smoothing     : grayscale;
    -webkit-user-drag           : none;
    font-family                 : TOSHOHelveticaNeue, Meiryo, "メイリオ";
    margin                      : 0;
    -webkit-text-size-adjust    : 100%;
    word-wrap                   : break-word;
    overflow-wrap               : break-word;
    word-break                  : break-word
}

button{
    cursor : pointer
}

header{
    background-color : #002f7b;
    position         : fixed;
    top              : 0;
    right            : 0;
    left             : 0;
    z-index          : 100;
    margin           : auto
}

header nav{
    position          : relative;
    max-width         : 600px;
    margin            : auto;
    width             : auto;
    display           : -webkit-box;
    display           : -ms-flexbox;
    display           : flex;
    -webkit-box-pack  : justify;
    -ms-flex-pack     : justify;
    justify-content   : space-between;
    -webkit-box-align : center;
    -ms-flex-align    : center;
    align-items       : center;
    padding           : 0.2rem 0.5rem
}

header nav div.btn-back,
header nav div.year{
    width     : 3vw;
    min-width : 2rem;
    max-width : 3rem
}

header nav div.btn-back a{
    padding : 0.1rem 0.5rem
}

header nav div.logo{
    margin : 0 15px
}

header nav div.logo img{
    height : 22px
}

@media screen and (max-width : 1200px){
    header nav div.logo img{
        height : 17px
    }
}

header nav div #back{
    width     : 2vw;
    min-width : 0.8rem;
    max-width : 0.8rem
}

header nav div #new_hoizon{
    width        : 40vw;
    min-width    : 8.2rem;
    max-width    : 13rem;
    margin-right : 0.75em;
    margin-left  : 0.75em
}

header nav div #year{
    width     : 3vw;
    min-width : 2rem;
    max-width : 3rem
}

header ul{
    width             : auto;
    height            : 10vw;
    display           : -webkit-box;
    display           : -ms-flexbox;
    display           : flex;
    -webkit-box-pack  : end;
    -ms-flex-pack     : end;
    justify-content   : flex-end;
    -webkit-box-align : center;
    -ms-flex-align    : center;
    align-items       : center
}

header ul li{
    margin : 0 0.5rem
}

header ul li:last-child{
    margin-right : 1rem
}

.display_wrap .display_title{
    display           : -webkit-box;
    display           : -ms-flexbox;
    display           : flex;
    -webkit-box-pack  : center;
    -ms-flex-pack     : center;
    justify-content   : center;
    -webkit-box-align : center;
    -ms-flex-align    : center;
    align-items       : center;
    width             : 100%;
    text-align        : center;
    font-weight       : 700;
    font-size         : 2rem
}

.display_wrap .display_title .base{
    height     : 7vw;
    max-height : 3.5rem;
    min-height : 3rem
}

.display_wrap .display_title .enjoy_sound{
    max-width : 300px;
    height    : auto
}

.display_wrap .display_title .rabbit{
    height     : 7vw;
    max-height : 4rem;
    min-height : 2rem
}

.display_wrap .display_title .words{
    height     : 7vw;
    max-height : 4.5rem;
    min-height : 3rem;
    margin-top : 0
}

.display_wrap .display_title img{
    vertical-align : middle
}

#contents{
/*    background-color : #f3f4f9;*/
}

.content_inner{
    max-width      : 600px;
    margin         : 0 auto;
    padding-bottom : 7rem
}

@media screen and (max-width : 1200px){
    .content_inner{
        max-width : 85vw
    }
}

@media screen and (max-width : 1200px){
    .content_inner.-fullsize{
        max-width : 95vw
    }
}

@media screen and (max-width : 1200px){
    .content_inner.-unitMenu{
        max-width : 95vw
    }
}

@media screen and (max-width : 1200px){
    .content_inner.-movie,
    .content_inner.-text{
        max-width : 90vw
    }
}

#contents.-unit .content_inner{
    padding-bottom : 8rem
}

footer #footer_wrap{
    border-top         : 1px solid;
    position           : fixed;
    bottom             : 0;
    right              : 0;
    left               : 0;
    background-color   : #fff;
    margin             : auto;
    padding            : 0 0.5rem;
    z-index            : 100;
    visibility         : hidden;
    -webkit-transform  : translateY(100%);
    -ms-transform      : translateY(100%);
    transform          : translateY(100%);
    opacity            : 10;
    -webkit-transition : 0.3s;
    transition         : 0.3s
}

footer #footer_wrap.-active{
    -webkit-transform : translateY(0);
    -ms-transform     : translateY(0);
    transform         : translateY(0);
    opacity           : 1;
    visibility        : visible
}

footer .footer_inner{
    display           : -webkit-box;
    display           : -ms-flexbox;
    display           : flex;
    -webkit-box-align : center;
    -ms-flex-align    : center;
    align-items       : center;
    -webkit-box-pack  : justify;
    -ms-flex-pack     : justify;
    justify-content   : space-between;
    width             : auto;
    margin            : auto;
    max-width         : 600px
}

footer .footer_inner div{
    padding   : 0.2rem;
    font-size : 0.3rem
}

footer .footer_inner div img{
    height : 1.7rem
}

@media screen and (max-width : 1200px){
    footer .footer_inner div{
        padding    : 0.2rem;
        font-size  : 0.9rem !important;
        text-align : left
    }
}

footer .footer_inner .footer_text{
    background      : url('../images/common/copyright.png') center no-repeat;
    background-size : contain;
    height          : 1.7rem;
    width           : 329px;
    margin          : auto 0
}

footer .footer_inner .footer_logo{
    width  : 85px;
    height : 1.7rem
}

body.-m1 header{
    background-color : #002f7b
}

body.-m1 footer #footer_wrap{
    border-color : #002f7b
}

body.-m1 .display_wrap .display_title{
    color            : #002f7b;
    background-color : #465b7a
}

body.-a3 header{
    background-color : #004f97
}

body.-a3 footer #footer_wrap{
    border-color : #004f97
}

body.-a3 .display_wrap .display_title{
    color            : #000;
    background-color : #7fa7cb
}

body.-m3 header{
    background-color : #f0831e
}

body.-m3 footer #footer_wrap{
    border-color : #f0831e
}

body.-m3 .display_wrap .display_title{
    color            : #000;
    background-color : #f7c18e
}


.js-copyright {
	text-align: center;
	margin: -4px 0 21px;
}
.js-copyright a {
	display: inline-block;
}
.js-copyright a:hover {
	opacity: 0.5;
}