@charset "utf-8";
    /* トップページ向けCSS */
    /* VISUAL
=========================================== */
    
    #page-visual {
        position: relative;
    }
    
    #page-visual .for-pc img {
        display: none;
    }

    #page-visual::after{
		content: "";
		height: 631px;
		background: url("../img/index/top_pc_bg.png") repeat-x;
		position: absolute;
		z-index: -1;
		top: 0;
		width: 100%;
  	}
    
    @media (min-width: 768px) {
        #page-visual .for-pc img {
            display: block;
            position: absolute;
        }
        #page-visual {
            text-align: left;
        }
    }
    
    @media (min-width: 1000px) and (max-width: 1200px) {
        #page-visual {
            max-height: 580px;
        }
    }
    
    @media (min-width: 768px) and (max-width: 999px) {

    }
    
    @media (max-width: 767px) {
        .houou_sp {
            position: absolute;
        }
        .sp_visual .zoomin img {
            position: absolute;
        }
        #page-visual .sp_visual {
            margin: 0;
        }
        .opningtime {
            position: absolute;
            width: 100%;
			top:96%;
            text-align: center;
            padding: 0 15%;
        }
        #page-visual .date,
        #page-visual .slogan1,
        #page-visual .headrightbottom {
            display: none;
        }
        #page-visual .headrightbottom img {
            width: 45px;
            height: auto;
        }
        #page-visual .main_title {
            display: none;
        }
        #page-visual .main_title2 {
            position: relative;
            position: absolute;
            right: -116px;
            bottom: 60px;
        }
        #page-visual .main_title2 img {
            width: 50%;
            height: auto;
        }
    }

/*
COUNTDOWN
*/
/**/

#timer {
    width: 19.0%;
    height: 10.7%;
    text-align: center;
    color: #172244;
/*    border-bottom: 2px solid #172244;*/
    text-shadow: 2px 2px 0 #d3be92;
    position: absolute;
    top: 51%;
    display: inline-block;
    font-size: 2.0vw;
    font-weight: bold;
    float: left;
    margin-left: 40.2%;
}

#timer span {
	color: #e3542b;
	font-size: 3.0vw;
}
    @media (max-width: 768px) {
		#timer {
            width: 46%;
            height: 7%;
            font-size: 5vw;
            top: 44.5%;
            margin-left: 26.7%;
            border-bottom: 1px solid #172244;
		}
		
		#timer span{
			font-size: 7vw;
		}
    }

    /* TOPICS
=========================================== */
    
    #page-topics {
        padding: 50px 0;
    }
    
    #page-topics>.container>.title {
        display: none;
    }
    /* page-topicsbanner
========================================== */
    
    #page-topicsbanner .row>div {
        margin-top: 10px;
    }
    /* page-panel
========================================== */
    
    #page-panel.content {
        padding-top: 0;
    }
    
    .content .list-panel {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        margin-left: -5px;
        margin-right: -5px;
        padding-left: 0;
    }
    
    .list-panel li {
        flex: 0 0 50%;
        max-width: 50%;
        padding-left: 5px;
        padding-right: 5px;
        padding-bottom: 10px;
        list-style: none;
        font-size: 14px;
        font-weight: bold;
        letter-spacing: 0.1em;
    }
    
    .list-panel a {
        position: relative;
        display: block;
        width: 100%;
        height: 100%;
        padding: 10px;
        background: rgba(13, 53, 99, 0.3);
        background: -moz-linear-gradient(left, rgba(13, 53, 99, 0.3) 0%, rgba(101, 182, 152, 0.3) 100%);
        /* FF3.6-15 */
        background: -webkit-linear-gradient(left, rgba(13, 53, 99, 0.3) 0%, rgba(101, 182, 152, 0.3) 100%);
        /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to right, rgba(13, 53, 99, 0.3) 0%, rgba(101, 182, 152, 0.3) 100%);
        text-align: center;
        box-shadow: 0 3px 5px 2px rgba(0, 0, 0, 0.2);
        border: 1px solid #e8ce37;
        color: #fff;
    }
    
    .list-panel a:hover {
        text-decoration: none;
        opacity: .75;
        top: 2px;
    }
    
    .list-panel a>span {
        display: inline-block;
        height: 2.5em;
    }
    
    @media (min-width: 768px) {
        .list-panel li {
            flex: 0 0 33.33333%;
            max-width: 33.33333%;
            padding-left: 0;
            padding-bottom: 10px;
        }
        .list-panel a>span {
            height: auto;
        }
    }
    /* Social media tag
=========================================== */
    
    .table-fb {
        width: 100%;
        margin-bottom: 10px;
        box-shadow: 0 3px 5px 2px rgba(0, 0, 0, 0.2);
    }
    
    .fb-tittle {
        position: relative;
        height: 64px;
        background-color: #1877f2;
        color: #fff;
    }
    
    .fb-tittle img {
        max-width: 100%;
    }
    
    .fb-tittle-comment {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        width: 110px;
        height: 64px;
        display: block;
        background-color: #1b2959;
    }
    
    .fb-tittle-comment:after {
        content: "";
        position: absolute;
        top: 0;
        right: 110px;
        display: block;
        border-bottom: 64px solid #1b2959;
        border-left: 40px solid transparent;
    }
    
    .table-fb td {
        width: 100%;
        max-width: 500px;
        background-color: #fff;
        text-align: center;
    }
    
    #pagePlugin {
        margin-left: auto;
        margin-right: auto;
        width: 100%;
    }
    
    .fb-page,
    .fb-page span,
    #pagePlugin iframe {
        width: 100% !important;
        height: 442px !important;
    }
    
    .table-tw {
        width: 100%;
        margin-bottom: 10px;
        box-shadow: 0 3px 5px 2px rgba(0, 0, 0, 0.2);
    }
    
    .tw-tittle {
        position: relative;
        height: 64px;
        background-color: #1da1f2;
        color: #fff;
    }
    
    .tw-tittle-comment {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        width: 110px;
        height: 64px;
        display: block;
        background-color: #1b2959;
    }
    
    .tw-tittle-comment:after {
        content: "";
        position: absolute;
        top: 0;
        right: 110px;
        display: block;
        border-bottom: 64px solid #1b2959;
        border-left: 40px solid transparent;
    }
    
    .table-tw td {
        background-color: #fff;
    }
    
    .tw-tittle img {
        max-width: 100%;
    }
    
    @media (max-width: 767px) {
        .fb-tittle-comment {
            display: none;
        }
    }
    
    @media (max-width: 767px) {
        .tw-tittle-comment {
            display: none;
        }
    }
    /* #section-info  新着情報、注目トピックススライダー領域
=========================================== */
    
    #section-info {
        background-image: url(../img/index/bg_info.jpg);
        padding: 56px 0;
    }
    
    .panel-info {
        margin: 0;
        padding: 20px;
        height: 480px;
        font-size: 1.2em;
        text-decoration: none;
        border: 5px double #d3be92;
        background-color: #232e44;
        border-radius: 8px;
        position: relative;
        overflow: hidden;
        box-shadow: 4px 4px #b28c47;
    }
    
    .panel-info h3 {
        margin-top: 0;
        color: #e1e4ec;
    }

/*
    
    .panel-info::before,
    .panel-info::after {
        content: "";
        position: absolute;
        display: block;
        width: 100%;
        height: 2px;
        background-color: #d3be92;
        border-radius: 8px;
        left: 0;
    }
*/
    
    .panel-info::before {
        top: 0;
    }
    
    .panel-info::after {
        bottom: 0;
    }

@media (max-width: 992px){
    .panel-info {
        height: auto;
        }
    }

    /* 新着情報 リスト */
    
    .updates {
        padding: 0;
        list-style: none;
    }
    
    .updates li {
        margin: 0;
        padding: 8px 0;
        border-bottom: 1px solid #5c6064;
        color: #fff;
    }
    
    .updates li:last-child {
        border-bottom: 0 none;
    }
    
    .updates li .date {
        vertical-align: middle;
        color: #f2f2f2;
    }
    
    .updates a {
        font-weight: bold;
        font-size: 1.1em;
        color: #fff;
        text-decoration: underline;
    }
    
    .updates a:focus,
    .updates a:hover {
        text-decoration: none;
    }
    
    .panel-info .scroll-y {
        overflow-y: auto;
        height: 400px;
    }
    /* 注目トピックススライダー */
    
    .topics {
        padding-bottom: 20px;
    }
    
    .topics .slick-arrow {
        background: transparent none no-repeat scroll center center;
        border: 0 none;
        display: block;
        height: 100%;
        position: absolute;
        top: 0;
        width: 40px;
        z-index: 100;
        text-indent: -9999px;
        overflow: hidden;
    }
    
    .topics .slick-prev {
        background-image: url(../img/btn_prev1.png);
        left: -20px;
    }
    
    .topics .slick-next {
        background-image: url(../img/btn_next1.png);
        right: -20px;
    }
    
    .slick-dots {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        margin: 0;
        padding: 0;
        display: block;
        text-align: center;
        height: 0;
    }
    
    .slick-dots li {
        display: inline-block;
        list-style: outside none;
        padding: 0 4px;
    }
    
    .slick-dots li button {
        display: block;
        background: #ccc;
        border: 0 none;
        overflow: hidden;
        width: 32px;
        height: 0;
        padding-top: 8px;
    }
    
    .slick-dots li.slick-active button {
        background: linear-gradient(to right, #f2e1c2 0%, #b28c47 70%);
    }
    
    @media (max-width: 767px) {
        .topics .slick-arrow {
            -webkit-background-size: 20px 20px;
            background-size: 20px 20px;
            width: 20px;
        }
        .slick-dots {
            display: none !important;
        }
    }
    /*
section
===========================================
*/
    
    #section-menu {
        padding: 56px 0 0 0;
    }

    #section-slider {
        padding: 56px 0;
    }
    
    #section-slider .flags {
        background: linear-gradient(135deg, rgba(92, 96, 100, 1) 0%, rgba(31, 34, 37, 1) 45%, rgba(38, 42, 46, 1) 55%, rgba(38, 42, 46, 1) 100%);
        padding: 20px 105px;
        border-radius: 8px;
        position: relative;
        overflow: hidden;
    }
    
/*
    #section-slider .flags::before,
    #section-slider .flags::after {
        content: "";
        display: block;
        height: 1px;
        background: linear-gradient(to right, #f2e1c2, #b28c47);
        position: absolute;
        left: 0;
        width: 100%;
    }
*/
    
    #section-slider .flags::before {
        top: 0;
    }
    
    #section-slider .flags::after {
        bottom: 0;
    }
    
    #section-slider .flags .slick-slide {
        margin: 8px;
    }
    
    #section-slider .flags .slick-slide>a {
        display: block;
    }
    
    #section-links {
        background-image: url(../img/index/bg_links.jpg);
        background-position: top center;
        background-repeat: no-repeat;
        background-size: cover;
        background-attachment: fixed;
        padding: 56px 0;
    }
    /* slick */
    
    .slick-slider {
        display: none;
    }
    
    .slick-slider.slick-initialized {
        display: block;
    }
    
    .flags .slick-arrow {
        background: transparent none no-repeat scroll center center;
        border: 0 none;
        display: block;
        height: 100%;
        position: absolute;
        top: 0;
        width: 48px;
        z-index: 100;
        text-indent: -9999px;
        overflow: hidden;
    }
    
    .flags .slick-prev {
        background-image: url(../img/btn_prev2.png);
        left: 45px;
    }
    
    .flags .slick-next {
        background-image: url(../img/btn_next2.png);
        right: 45px;
    }
    
    @media (max-width: 767px) {
        #section-slider .flags {
            margin: 0 auto;
            padding: 10px 20px;
            border-radius: 10px;
        }
        #section-slider .flags .slick-slide {
            margin: 3px;
        }
        .flags .slick-arrow {
            -webkit-background-size: 20px 20px;
            background-size: 20px 20px;
            width: 20px;
        }
        .flags .slick-prev {
            left: 5px;
        }
        .flags .slick-next {
            right: 5px;
        }
    }
    /*
movie
===========================================
*/
    
    #section-movie {
        position: relative;
        background-color: rgba(255, 255, 255, 0.6);
        padding: 56px 0;
    }
    
    #section-movie::before {
        content: "";
        position: absolute;
        bottom: 0;
        display: block;
        border-left: 100vw solid transparent;
        border-bottom: 248px solid #d3be92;
    }
    
    .panel-movie {
        position: relative;
        display: block;
        width: 100%;
        height: 100%;
        text-decoration: none;
        font-weight: 700;
        text-align: center;
        line-height: 1.2;
        background-color: rgba(255, 255, 255, 0.8);
        border: 5px double #e3542b;
        border-radius: 4px;
        letter-spacing: 0;
        overflow: hidden;
        padding: 20px;
        margin-bottom: 7px;
        box-shadow: 3px 3px #f2b7aa;
    }
    
/*
    .panel-movie::before,
    .panel-movie::after {
        content: "";
        position: absolute;
        display: block;
        width: 100%;
        height: 2px;
        background-color: #e3542b;
        border-radius: 8px;
        left: 0;
    }
*/
    
    .panel-movie::before {
        top: 0;
    }
    
    .panel-movie::after {
        bottom: 0;
    }
    
    .panel-movie-text {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 3em;
        padding: 5px;
    }