@charset "UTF-8";

/*==================================================================================================

       リセット

===================================================================================================*/

        figure { margin:0;}
        figure video { max-width: 100%;}

        @media screen and (max-width:1024px) {
        html, body, div, span, applet, object, iframe, strong,
        h1, h2, h3, h4, h5, h6, p, blockquote, pre,
        a, abbr, acronym, address, big, cite, code,
        del, dfn, em, font, img, ins, kbd, q, s, samp,
        small, strike, sub, sup, tt, var,
        dl, dt, dd, ol, ul, li,
        fieldset, form, legend, caption, 
        tbody, tfoot, thead, table, label, tr, th, td{
        margin: 0;
        padding: 0;
        border: 0;
        outline: 0;
        font-style: inherit;
        font-family: inherit;
        vertical-align: baseline;
        list-style:none;
        }
        ul { 
        letter-spacing: -1em;
        word-spacing: -1em;
        }
        :root ul {
        letter-spacing: -1px;
        word-spacing: -1px;
        }
        li { 
        letter-spacing: normal;
        word-spacing: normal;
        *display: inline;
        *zoom: 1;
        }
        a { text-decoration: none; }
        img,iframe	{ vertical-align:bottom;}

        }

/*==================================================================================================

       Movie

===================================================================================================*/

.movie-wrap {
        position: relative;
        box-sizing: border-box;
        max-width:978px;
        width:100%;
        margin-left:auto;
        margin-right:auto;
        z-index:1;
        }
        .movie {
        position: relative;
        width: 100%;
        height:auto;
        background:url("../../movie/index.jpg") center center / cover;
        text-align: center;
        z-index: 1;
        }
        .movie:before {
        content: "";
        display: block;
        padding-top: 40.899796%;
        }
        .movie_inner{
        position: absolute;
        top: 0; left: 0;
        width: 100%;
        height: 100%;
        overflow:hidden;
        z-index: 1;
        }
        .movie_inner video{
        width:100%;
        height:auto !important;
        margin-left:auto;
        margin-right:auto;
        }
        @media screen and (max-width:1024px) {
        .movie-wrap:before { bottom:auto; top:1px;}
        }
        @media screen and (max-width:767px) {
        }

        /* --- 下層用 --- */
        .movie.pages:before { padding-top: 75.675676%; }
        .movie.pages .movie_inner video{ min-width: 0; min-height: 0; left: 0; transform: translateX(0%); -webkit-transform: translateX(0%); }
        


/*==================================================================================================

       共通

===================================================================================================*/

        .img-auto img { max-width: 100% !important; height: auto !important; width /***/:auto; vertical-align:bottom; }
        .max-img img { height: auto !important; width:100%; }
        .margin-auto > img { margin-left:auto; margin-right:auto; }
        .center img { margin-left:auto; margin-right:auto; }

        #side img { max-width: 100% !important; height: auto !important; width /***/:auto; vertical-align:bottom; }

        #side-sp { display: none; }


        @media screen and (max-width:1024px) {
        img { max-width: 100% !important; height: auto !important; width /***/:auto; vertical-align:bottom; }
        figure { margin: 0; }
        .max-img-tablet img { height: auto !important; width:100%; }
        
        #wrap { padding-left:15px; padding-right:15px; box-sizing: border-box; }
        #bnavi { display: none; }
        #container { max-width:725px; width:100%; }
        #content { max-width:511px; width:calc(100% - 210px);}
        #side { width:200px; }
        #gnavi { width:100%; box-sizing: border-box; }
        #footer { max-width:978px; width:100%; }
        }
        @media screen and (max-width:767px) {
        #content { float:none; max-width:360px; margin-left:auto; margin-right: auto; width:100%;  }
        #side { display: none; }
        #side-sp { display: block; max-width:250px; margin-left:auto; margin-right:auto; margin-top:3rem; }
        #footer { min-height: 300px;}
        #footer .box01 { float:none; margin-left:auto; margin-right:auto; padding-top:45px; }
        #footer .box02 { display: none; }
        #footer { background: url("../../img/base/footer_illust_bg-sp.png") center top no-repeat; }
        #page-top { bottom:65px; }
        }


/*==================================================================================================

       PLAN

===================================================================================================*/

        @media screen and (max-width:1024px) {
        #plan_box .box img.bt_go { float: right; }
        }
        @media screen and (max-width:767px) {
        #plan_box .box { width:100%; max-width:300px; margin-left:auto; margin-right:auto; }
        #plan_box .box img.photo { float:none; width:100%; box-sizing: border-box; }
        #plan_box .box h4 { margin:12px 0 5px 0; }
        #plan_box .box p { margin:0; }
        }

/*==================================================================================================

       トップページ

===================================================================================================*/

        @media screen and (max-width: 1024px) {
        #top_wrap { margin-top:80px; position: relative; z-index: 0; }
        #top_home { max-width: 978px; width:100%; height: auto; }
        #intoro .greeting .tx { max-width:420px; width:92%; padding-bottom:5rem; }
        #intoro .girl01 { top:238px; width:100px; }
        #intoro { background: none; }
        #intoro .greeting { z-index: 0; }
        #intoro .greeting:after {content:"";display: block;position: absolute; bottom:-35px; right:50px;width:450px; height: 230px; background: url("../../img/home/index_bg01.png") center center / cover; z-index: -1; }
        .growup-img { float:left;width:calc(100% - 350px); }
        #intoro .boy01 { top:110px; }
        #intoro .growup h3 { margin-bottom:35px; }
        #intoro .detail .conte { min-height: 780px; background: url("../../img/home/index_bg02-sp.png") top center / cover; }
        #intoro .detail .conte ul:nth-child(2) { top:215px; left:auto; right:0; }
        #intoro .detail .conte ul:nth-child(3) { top:540px; right:auto; left:0; }
        #intoro .detail .toy01 { top:550px; left:auto; right:30px; }
        }
        @media screen and (max-width:767px) {
        #intoro .greeting:after { opacity: .5; width:350px;  }
        #intoro .greeting .tx { padding-bottom:8rem; }
        #intoro .girl01 { top:auto; bottom: 0;}
        #intoro .growup h3 { margin-right:-20px; }
        #intoro .boy01 { right:220px; top:100px;}
        .growup-img { float:none; width:80%; margin-left:auto; margin-right:auto; }
        #intoro .detail { margin-top:0; }
        #intoro .detail .conte { min-height:0; }
        #intoro .detail .conte ul { position: relative; margin-left: auto; margin-right: auto; margin-bottom:2rem; }
        #intoro .detail .conte ul:nth-child(1),
        #intoro .detail .conte ul:nth-child(2),
        #intoro .detail .conte ul:nth-child(3) { top:auto; left:auto; right:auto; bottom: auto; }
        #intoro .conte .illu { display: none; }
        
        }

/*==================================================================================================

       キッズ

===================================================================================================*/

        @media screen and (max-width: 1024px) {
        #top { max-width: 978px; width:100%; height:auto; margin-left:auto; margin-right:auto; }
        #kidspace .title_01 { width:511px; height:238px; box-sizing: border-box; background: url("../../img/kids/kid_t_01_bg-tab.png") no-repeat; }
        #kidspace .title_01 p { width:340px; }
        #kidspace .title_01 h2 { width:330px; }
        #kidspace .cercle { width:100%; max-width:511px; height:0; padding-bottom:83.477011%; background: url("../../img/kids/kid_01_bg01.png")  center center / cover; }
        #kidspace .cercle li:nth-child(1) { width: 14.367816%; top: 2%; left: 20%; }
        #kidspace .cercle li:nth-child(2) { width: 22.413793%; top: 22%; }
        #kidspace .cercle li:nth-child(3) { width: 28.87931%; top: 51%; }
        #kidspace .cercle li:nth-child(4) { width: 22.844828%; top: 74%; left: 39%; }
        #kidspace .cercle li:nth-child(5) { width: 26.293103%; top: 51%; right: 2%; }
        #kidspace .cercle li:nth-child(6) { width: 14.224138%; top: 33%; right: 8%; }
        #kidspace .cercle li:nth-child(7) { width: 23.132184%; top: 2%; right: 7%; }
        #exprience { background: url("../../img/kids/kid_02_bg-tab.png") top right no-repeat; min-height: 0; }
        #exprience .text { margin-bottom:15px; }
        }
        @media screen and (max-width: 767px) {
        #kidspace .title_01 { width:auto; height:auto; padding:12px; border:4px solid #FFF; background: #FCFCFC; border-radius:6px; margin-bottom: 2rem; }
        #kidspace .title_01 p { width:90%; margin:0 auto; }
        #kidspace .title_01 h2 { width:94%; margin: 0 auto 1rem; }
        #exprience { background: url("../../img/kids/kid_02_bg-sp.png") top right no-repeat; }
        #exprience h2 img:nth-child(2) { padding-left:70px; }
        }

/*==================================================================================================

       食事

===================================================================================================*/

        #cui_01 { width:370px; }
        @media screen and (max-width: 1024px) {
        #cui_01 { float:none; margin:0 auto 2rem auto; }
        .ryouri .box03 { margin: 30px 30px 0 12px;}
        .ryouri .box03_r { margin: 30px 0 0 0;}
        }
        @media screen and (max-width:767px) {
        .ryouri .box01 h2 { float:none; text-align: center; }
        .ryouri .box01 p { margin:1rem 0 0 ;}
        #cui_01 { width:270px; }
        .ryouri .box03, .ryouri .box03_r { float:none; width:280px; margin:30px auto 0 auto; text-align: center; }
        .ryouri .box03 p, .ryouri .box03_r p { text-align: left; }
        }


/*==================================================================================================

       館内

===================================================================================================*/

        .photo-wrap {
        margin: 0 0 10px 0;
        padding: 8px;
        background: #FFF;
        border: 1px dotted #666;
        }

        /*==================================================================================================
               slick slider
        ===================================================================================================*/

        .slickslider figure { position: relative; z-index: 0; }
        .slick-dots li { margin:0 !important;}
        .slick-dotted.slick-slider { margin-bottom: 0 !important;}
        .slickslider .slick-dots { bottom: 2%; z-index: +1; }

        .slide-caption {
        position: absolute;
        bottom:0;
        left:0;
        width:100%;
        padding:.75rem 1rem;
        box-sizing: border-box;
        background: rgba(0,0,0,.4);
        color:#FFF;
        text-align: right;
        line-height: 125%;
        z-index: 1;
        }
        .slick-wrap {
        position: relative;
        width:100%;
        z-index: 0;
        }
        .slick-wrap.h64p:after {
        content: "";
        display: block;
        padding-bottom:64.02439%;
        }
        .slick-wrap .slick-inner {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        }

        @media screen and (max-width: 1024px) {
        .kannai .box02 .mini01, .kannai .box02 .mini02 { margin:30px 10px 0 0; width:250px; }
        .kannai .box02 img.photo { box-sizing: border-box; float:none; width:100%; }
        .kannai .box02 .mini02 { margin-right:0; }
        .kannai .box03 img.photo { float:none; margin:0; }
        .kannai .box04 h3 { width:100%; max-width:348px; margin-left:auto; margin-right:auto; }
        .kannai .box04 p { width:100%; max-width:348px; margin-left:auto; margin-right:auto; }
        }
        @media screen and (max-width: 1024px) {
        .kannai .box01 h2 { float:none; text-align: center; }
        .kannai .box01 p { margin:1rem 0 0; }
        .kannai .box02 .mini01, .kannai .box02 .mini02 { margin:30px 0 0 ; width:100%; }
        }

/*==================================================================================================

       周辺

===================================================================================================*/

        @media screen and (max-width:767px) {
        .syuhen .box01 { text-align: center; padding-bottom:20px; }
        .syuhen h3 { width:100%; min-height: 30px; height: auto; background: url("../../img/syuhen/bg_title.png") bottom left no-repeat; padding-bottom:.25rem; box-sizing: border-box; font-size:17px; }
        .syuhen .box01 p { text-align: left; margin:15px 0 0;}
        .syuhen .box01 img { float:none;width:290px; margin-left:auto; margin-right:auto;  box-sizing: border-box; }
        }

/*==================================================================================================

       

===================================================================================================*/

        @media screen and (max-width:767px) {
        .qa dl dt { width:100%; min-height: 30px; height: auto; background: url("../../img/qa/bg_q.png") bottom left no-repeat; padding-bottom:.25rem; box-sizing: border-box; font-size:16px; }
        .qa dl dd { margin: 10px 0 30px 0; padding: 5px 0 0 30px; box-sizing: border-box; min-height: 30px; }
        }