@charset "UTF-8";

@font-face {
    font-family:"anzumoji";
    src:url("font/anzumoji-light.eot") format("eot"), /* for IE */
    url("font/anzumoji-light.woff") format("woff"), /* for IE(>=9), Firefox(>=3.6), Safari(>=5.1), Chrome(>=6), Opera(>=11) */
    url("font/anzumoji-light.ttf") format("truetype");
    font-weight:normal;
    font-style:normal;
    }


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

       リセット

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

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;
	}
figure { margin:0;}
img,iframe	{ vertical-align:bottom;}

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

       メイン設定

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

html,body { width:100%; min-width: 320px; *width:320px; font-size:19px; }
body {
	background:  url("../images/parts/background.jpg") center center repeat;
    font-family: 'anzumoji', "sans-serif";
	letter-spacing:0;
	color: #232323;
    font-weight: 400;
	text-align:left;
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
	line-height:200%;
    font-feature-settings: "palt" 1;
  	}

    .wrapper    { overflow:hidden;}
    article		{ position:relative; width:100%; z-index: 0; }
    section		{ position:relative; }

    .section	{ padding-top:8rem; padding-bottom:8rem; }
    .section-s	{ padding-top:4rem; padding-bottom:4rem; }
    .second	    { padding-top:0 !important; }
    .outer		{ padding-left:50px; padding-right:50px; box-sizing:border-box; position: relative; z-index: 10;}
    .wrap-1600  { width:100%; max-width:1600px; margin-left:auto; margin-right:auto; }
    .wrap-1400  { width:100%; max-width:1400px; margin-left:auto; margin-right:auto; }
    .wrap-1200  { width:100%; max-width:1200px; margin-left:auto; margin-right:auto; }
    .wrap-1100  { width:100%; max-width:1100px; margin-left:auto; margin-right:auto; }
    .wrap-1000  { width:100%; max-width:1000px; margin-left:auto; margin-right:auto; }
    .wrap-900   { width:100%; max-width:900px; margin-left:auto; margin-right:auto; }
    .wrap-750   { width:100%; max-width: 750px; margin-left:auto; margin-right:auto; }


    .row			{ margin-left:auto; margin-right:auto; position: relative;}
    .row .row		{ min-width: 0px; }
    .row:before,
    .row:after      { content:""; display:table; }
    .row:after      { clear: both; }
    .row            { zoom: 1; }

	.center		{ text-align:center;}
    .center-left{ text-align:center;}
    .left-center{ text-align: left;}
	.text-l		{ text-align:left;}
    .text-r		{ text-align:right;}
	.float-l	{ float:left; }
	.float-r	{ float:right; }
    .float-l-c	{ float:left; }
    .float-r-c	{ float:right; }
    .margin-auto { margin-left:auto; margin-right:auto; }

    h1,h2,h3,h4,h5 { font-weight:300; letter-spacing: .05em;}
    
    small { font-size:.75rem; }
    .bold { font-weight:bold;}
    .serif{ font-family: 'Noto Serif JP', serif;}
    .f17 { font-size:1.0625rem;}

@media screen and (max-width: 1239px) {
    html,body, .wrapper	{ font-size:18px; line-height: 180%;}
    }
@media screen and (max-width: 1087px) {
    html,body, .wrapper	{ font-size:18px; line-height: 160%;}
    .outer			   { padding-left:30px; padding-right:30px; }
    .section	       { padding-top:5rem; padding-bottom:5rem; }
    .section-s	       { padding-top:3rem; padding-bottom:3rem; }
    .wrap-1400, .wrap-1200, .wrap-1100, .wrap-1000, .wrap-900 { max-width:770px; }
    }
@media only screen and (max-width: 767px) {
    html,body, .wrapper	{ font-size:18px; line-height: 150%;}
	body			{ -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;}
    .section	    { padding-top:2.5rem; padding-bottom:2.5rem; }
    .section-s	    { padding-top:2rem; padding-bottom:2rem; }
    .outer			{ padding-left:20px; padding-right:20px; }
    .wrap-1400, .wrap-1200, .wrap-1100, .wrap-1000, .wrap-900, .wrap-750  { max-width:480px; }
    .sp-wrap        { max-width:360px; margin-left:auto; margin-right:auto; }
    .center-left    { text-align:left;}
    .left-center    { text-align:center;}
    .float-l-c	{ float:none; }
    .float-r-c	{ float:none; }
    }
@media only screen and (max-width:374px) {
    html,body, .wrapper	{ font-size:17px; }
    }

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

       padding margin 設定

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

	.pt-1em		{ padding-top:1rem;}
	.pt-2em		{ padding-top:2rem;}
	.pt-3em		{ padding-top:3rem;}
	.pt-4em		{ padding-top:4rem;}
	.pt-5em		{ padding-top:5rem;}

    .pb-05em	{ padding-bottom:.5rem;}
    .pb-1em		{ padding-bottom:1rem;}
	.pb-2em		{ padding-bottom:2rem;}
	.pb-3em		{ padding-bottom:3rem;}
	.pb-4em		{ padding-bottom:4rem;}
	.pb-5em		{ padding-bottom:5rem;}

    .mt-1em		{ margin-top:1rem;}
	.mt-2em		{ margin-top:2rem;}
	.mt-3em		{ margin-top:3rem;}
	.mt-4em		{ margin-top:4rem;}
	.mt-5em		{ margin-top:5rem;}

	.mb-1em		{ margin-bottom:1rem;}
	.mb-2em		{ margin-bottom:2rem;}
	.mb-3em		{ margin-bottom:3rem;}
	.mb-4em		{ margin-bottom:4rem;}
	.mb-5em		{ margin-bottom:5rem;}

    .pt-2-1		{ padding-top:2rem;}
    .pt-3-2		{ padding-top:3rem;}
    .pb-2-1		{ padding-bottom:2rem;}
    .pb-3-2		{ padding-bottom:3rem;}
    .pb-4-2		{ padding-bottom:4rem;}
    .pb-4-3		{ padding-bottom:4rem;}
    .pb-5-2		{ padding-bottom:4rem;}
    .mb-2-1		{ margin-bottom:2rem;}
    .mb-3-1		{ margin-bottom:3rem;}
    .mb-3-2		{ margin-bottom:3rem;}
    .mb-4-3		{ margin-bottom:4rem;}
    .mb-5-2		{ margin-bottom:5rem;}
    .mb-5-3		{ margin-bottom:5rem;}

@media only screen and (max-width: 1087px) {
    .pt-2-1		{ padding-top:1rem;}
    .pt-3-2		{ padding-top:2rem;}
    .pb-2-1		{ padding-bottom:1rem;}
    .pb-3-2		{ padding-bottom:2rem;}
    .pb-4-2		{ padding-bottom:3rem;}
    .pb-4-3		{ padding-bottom:4rem;}
    .pb-5-2		{ padding-bottom:2rem;}
    .mb-2-1		{ margin-bottom:1rem;}
    .mb-3-1		{ margin-bottom:1rem;}
    .mb-3-2		{ margin-bottom:2rem;}
    .mb-4-3		{ margin-bottom:3rem;}
    .mb-5-2		{ margin-bottom:2rem;}
    .mb-5-3		{ margin-bottom:3rem;}
}

.max500 { max-width:500px; margin-left:auto; margin-right:auto;}

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

       Link

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

a {
	text-decoration:none;
	color:#232323;
	cursor:pointer;
	}
	a:hover {
	color:#888;
	}
	a img {
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	}
	a:hover img {
	opacity:0.6;
	filter: alpha(opacity=60);
	-ms-filter: "alpha( opacity=60 )";
	}

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

       Other

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

    img {
        max-width: 100%;
        height: auto;
        width /***/:auto;
        vertical-align:bottom;
        }
    .radius,
    .radius video,
    .radius img {
        border-radius:         4px;
        moz-border-radius:     4px;
        -webkit-border-radius: 4px;
        -o-border-radius:      4px;
        -ms-border-radius:     4px;
        }
    .shadow	{
        box-shadow:	        0px 3px 5px rgba(0,0,0,0.3);
        -moz-box-shadow:	0px 3px 5px rgba(0,0,0,0.3);
        -webkit-box-shadow: 0px 3px 5px rgba(0,0,0,0.3);
        -o-box-shadow:		0px 3px 5px rgba(0,0,0,0.3);
        -ms-box-shadow:		0px 3px 5px rgba(0,0,0,0.3);
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        }
        a .shadow:hover {
        box-shadow:	        0px 3px 5px rgba(0,0,0,0);
        -moz-box-shadow:	0px 3px 5px rgba(0,0,0,0);
        -webkit-box-shadow: 0px 3px 5px rgba(0,0,0,0);
        -o-box-shadow:		0px 3px 5px rgba(0,0,0,0);
        -ms-box-shadow:		0px 3px 5px rgba(0,0,0,0);
        }
    .youtube {
        position: relative;
        padding-bottom: 56.25%; /* 16:9 */
        height: 0;
        overflow: hidden;
        }
        .youtube iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        }

    .centered-outer { position: relative; height:100%; }
    .centered-inner {
        position: absolute;
        width:100%;
        top: 50%;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
        -webkit-transform: translateY(-50%) translateX(-50%);
        }
    .relative { position: relative;}

.flexslider-wrap {
    position: relative;
    width:100%;
    }
    .flexslider-wrap:after {
        content: "";
        display: block;
        padding-bottom:66.6666666%;
        }
        .flexslider-wrap .flexslider {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        }
.z10    { z-index: 10;}
.anchor { padding-top:130px; margin-top:-130px; z-index: -1;}

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

      　hover_zoom

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

.hover-zoom__image {
    overflow: hidden;
    position: relative;
    width:100%;
    -webkit-transition-duration: 0.5s;
    transition-duration:         0.5s;
    -webkit-transition  : all .5s ease-in;
        -moz-transition : all .5s ease-in;
        -ms-transition  : all .5s ease-in;
            transition  : all .5s ease-in;
    }
    .hover-zoom__image figure {
    -webkit-transition-duration: 0.5s;
    transition-duration:         0.5s;
    -webkit-transition  : all .5s ease-out;
        -moz-transition : all .5s ease-out;
        -ms-transition  : all .5s ease-out;
            transition  : all .5s ease-out;
    }
    .hover-zoom__image:hover figure,
    a:hover .hover-zoom__image figure {
    opacity: 1;
    -moz-transform:    scale(1.2);
    -webkit-transform: scale(1.2);
    -ms-transform:     scale(1.2);
    transform:         scale(1.2);
    }
    .hover-zoom__image a:hover img,
    a:hover .hover-zoom__image img {
	opacity:1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
	}

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

       デバイス

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

    .sp-none        { }
    .sp-inline-none { display:inline-block;}
	.sp-on		    { display:none;}
	.sp_on		    { display:none;}
    .sp-inline-on   { display:none;}
	.tablet-on		{ display:none;}
	.tablet-none	{ }
@media screen and (max-width: 1087px) {
    .tablet-on		{ display:inherit !important;}
	.tablet-none	{ display:none;}
    }
@media screen and (max-width: 767px) {
    .sp-none		{ display:none;}
    .sp-inline-none { display:none;}
	.sp-on			{ display:inherit;}
    .sp-inline-on   { display:inline;}
	.sp-text-l		{ text-align:left !important;}
	.sp-center		{ text-align:center;}
    }
@media screen and (max-width: 400px) {
	.sp_on			{ display:inherit;}
    }
/*==================================================================================================

       Flex

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

.flex-wrap {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content:center;
    align-items: center;
    align-content:stretch;
    display: -webkit-flex;
    -webkit-flex-direction: row;
    -webkit-flex-wrap: nowrap;
    }
    .flex-wrap.is-align-stretch { /* 上端揃え */
    align-items: stretch;
    }
    .flex-side-center { /* 子要素の左右の中央揃え IE一部バグあり */
    display: flex;
    justify-content: center;
    }
    .flex-wrap.is-between { /* 子要素の等間隔 + 両端揃え */
    justify-content: space-between;
    }
    .flex {
    flex: none;
    display: block;
    flex-basis: auto;
    flex-grow: 1;
    flex-shrink: 1;
    width: 100%;
    box-sizing: border-box;
    }

    .flex-1   { order: 1; }
    .flex-2   { order: 2; }
    .flex-3   { order: 3; }
    .flex-4   { order: 4; }
    .flex-1-2   { order: 1; }
    .flex-2-1   { order: 2; }

@media screen and (max-width: 1087px) {
    .flex-wrap.is-tablet { -webkit-flex-direction: column; flex-direction: column; flex: none; display: block; }
    }
@media screen and (max-width: 767px) {
    .flex-wrap.is-mobile { -webkit-flex-direction: column; flex-direction: column; flex: none; display: block; }
    .flex-1-2   { order: 2; }
    .flex-2-1   { order: 1; }
    }

/*========================
    Bulmaチューニング
 ========================*/
.column .inner { width:100%;}
.vertical-center { /* columnに付与 直下にinner設置 */
    display: flex;
    align-items: center;
    }
.vertical-side-center { /* IE でバグあり */
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    }
    /* IE でのflex+figure バグ対策 */
    @media all and (-ms-high-contrast: none) {
    .vertical-side-center figure,
    .vertical-side-center img { width:100%; height:100%; }
    }
.reverse-row-order {
    flex-direction: row-reverse;
    }

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

       ヘッダー

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

header {
	position:relative;
	height:150px;
	width:100%;
	z-index:9999;
    background: url("../images/parts/bg-content.jpg") bottom center repeat-x;
	}
	.header-wrap {
        height:150px;
        width:100%;
        position: fixed;
        z-index:9999;
        background: url("../images/parts/bg-content.jpg") bottom center repeat-x;
        box-sizing: border-box;
        -webkit-transition:  all 0.5s ease;
            -moz-transition: all 0.5s ease;
            -o-transition:   all 0.5s ease;
        }
        
        .hata {
            top: 0px;
            left: 50%;
            margin-left:-886px;
            position: absolute;
            width: 1773px;
            height: 130px;
            animation: anime01 2s steps(2) infinite;
            background-image: url(../images/parts/header-cover.png);
            background-repeat: no-repeat;
            z-index: 1;
            }
            @keyframes anime01 {
            to { background-position-y: -260px; }
            }

        .navigation-wrap {
        width:100%;
        max-width:1260px;
        margin:0 auto;
        padding:0 30px;
        box-sizing:border-box;
        position:relative;
        z-index: 1000;
        }
        .logo {
            position:relative;
            float:left;
            padding-top:41px;
            width:360px;
            line-height:1;
            z-index:100;
            font-size:0;
            -webkit-transition:  all 0.5s ease;
                -moz-transition: all 0.5s ease;
                -o-transition:   all 0.5s ease;
            }
		.navigation {
            float:right;
            width:100%;
            max-width:780px;
            position:relative;
            padding-top:72px;
            z-index: 100;
            -webkit-transition:  all 0.5s ease;
                -moz-transition: all 0.5s ease;
                -o-transition:   all 0.5s ease;
            }
            .main-nav {
                float:right;
                margin-right:178px;
                position: initial;
                text-align: justify;
                text-justify: distribute-all-lines;
                }
                .main-nav li {
                float:left;
                line-height:1;
                font-size:1.05263158rem;
                padding:0 0 0 1.5rem;
                text-align: center;
                -webkit-transition:  all 0.3s ease;
                    -moz-transition: all 0.3s ease;
                    -o-transition:   all 0.3s ease;
                }
                .main-nav li:first-child {
                padding-left:0 !important;
                }

            .reservation {
                position:absolute;
                right:0px;
                top:61px;
                z-index: 99999;
                font-weight:300;
                font-size:1.05263158rem;
                -webkit-transition:  all 0.5s ease;
                    -moz-transition: all 0.5s ease;
                    -o-transition:   all 0.5s ease;
                }
                .reservation a {
                color:#FFF;
                width:150px;
                height:44px;
                text-align: center;
                line-height:44px;
                background: #0E654D;
                white-space: nowrap;
                text-decoration:none !important;
                position: relative;
                z-index: 1;
                -webkit-transition: color 0.3s ease;
                -moz-transition: color 0.3s ease;
                -ms-transition: color 0.3s ease;
                -o-transition: color 0.3s ease;
                transition: color 0.3s ease;
                display: inline-block;
                }
                .reservation a:after {
                position: absolute;
                content: "";
                width: 0;
                height: 100%;
                top: 0;
                right: 0;
                z-index: -1;
                -webkit-transition: all 0.3s ease;
                -moz-transition: all 0.3s ease;
                -o-transition: all 0.3s ease;
                transition: all 0.3s ease;
                background: #5A9583;
                }
                .reservation a:hover {}
                .reservation a:hover:after { left: 0; width: 100%; }
                .reservation a:active { top: 0px; }
            .phone {
                position: absolute;
                right:0px;
                top:16px;
				text-align: right;
                line-height: 0.8;
                font-size:1.05263158rem;
                -webkit-transition:  all 0.5s ease;
                    -moz-transition: all 0.5s ease;
                    -o-transition:   all 0.5s ease;
                }
			 .phone a{letter-spacing: 0.8px;}
                .phone span { font-size:1.5em;}
				.phone span.span2 { font-size:0.7em;letter-spacing: -1px;}

    /*=================================================
            hover bar
    ==================================================*/

    .main-nav li a {
        position: relative;
        display: inline-block;
        transition: .3s;
        padding-bottom:10px;
        }
        .main-nav li a:after {
        position:absolute;
        bottom:5px;
        left:50%;
        content:'';
        width:0;
        height:2px;
        background-color:#0E654D;
        transition:.3s;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%); 
        }
        .main-nav li a:hover:after {
        width:80%;
        }
        .main-nav li a:hover {
        color:#0E654D;
        }

    /*=================================================
            Fixed
    ==================================================*/

    .header-wrap.fixed {
        margin-left:0;
        margin-top:0;
        top: 0;
        width:100%;
        height:70px;
        position:fixed;
        box-shadow:	        0px 3px 5px rgba(0,0,0,0.2);
        -moz-box-shadow:	0px 3px 5px rgba(0,0,0,0.2);
        -webkit-box-shadow: 0px 3px 5px rgba(0,0,0,0.2);
        -o-box-shadow:		0px 3px 5px rgba(0,0,0,0.2);
        -ms-box-shadow:		0px 3px 5px rgba(0,0,0,0.2);
        }
        .header-wrap.fixed .hata { top: -65px; }
        .header-wrap.fixed:before { background: url("../images/parts/header-cover.png") center bottom no-repeat; height:70px; }
        .header-wrap.fixed .logo { width:232px; padding-top:16px;}
        .header-wrap.fixed .groups { display:none;}
        .header-wrap.fixed .navigation { padding-top:27px;}
        .header-wrap.fixed .phone { display:none;}
        .header-wrap.fixed .reservation { top:15px;}

    /*=================================================
            スマホ ハンバーガーメニュー
    ==================================================*/

    .nav-toggle { display: none; position: absolute; right:17px; top:23px; width: 20px; height:20px; cursor:pointer; z-index:999; }
	.nav-toggle div { position: relative; }
	.nav-toggle span { display: block; position: absolute; height: 2px; width:100%; background: #111; -moz-border-radius:2px; -webkit-border-radius:2px; -o-border-radius:2px; -ms-border-radius:2px;
	left: 0; -webkit-transition: .35s ease-in-out; -moz-transition: .35s ease-in-out; transition: .35s ease-in-out; }
	.nav-toggle span:nth-child(1) { top: 0; }
	.nav-toggle span:nth-child(2) { top: 6px; }
	.nav-toggle span:nth-child(3) { top: 12px; }


    @media screen and (max-width: 1300px) {
        .navigation-wrap { padding:0 15px; }
    }

    @media screen and (max-width: 1200px) {
        .logo { padding-top:54px; width:240px; }
        .main-nav li { padding-left:1.25em; }
        .navigation { max-width:740px; }
    }

    @media screen and (max-width: 1087px) {
        header { position: fixed; top:0; height:60px; width:100%;}
        .header-wrap { margin-left:0; margin-top:0; top: 0; width:100%;  height:60px;}
        .navigation-wrap { padding:0; height:60px; }
        .sp-navigation { position: relative; width:100%;min-width:320px; height:60px; z-index: 10;border-bottom:1px solid #777; background: url("../images/parts/bg-content.jpg") bottom center repeat;}
        .logo { position: absolute; width:232px; left: 14px; padding-top:14px; z-index: 10;}

        .navigation { position: absolute; z-index: 1; top:-740px; width:100%; max-width:100%; text-align:center; padding:0;
            -webkit-transition:.5s ease-in-out;-moz-transition:.5s ease-in-out;transition:.5s ease-in-out;}
        .main-nav { max-width: 100%; margin:0;}
        .main-nav:after { display: block;}
        .main-nav li img { height:18px; }

        .reservation { position: relative; border-top:1px solid #777; top:0; text-align: left; line-height: 1; }
            .reservation a { display: block; width: 100%; height: 100%; padding: 1em 0; text-align: left; line-height: 1; padding-left:1.5rem; box-sizing: border-box;}
            .reservation img { height:18px; width:auto;}
        .phone { position: relative; border-top:1px solid #777; border-bottom:1px solid #777; top:0; right:0; text-align: left; line-height: 1; padding-left:1.5rem; background: url("../images/parts/bg-content.jpg") center center repeat;}
            .phone a { display: block; width: 100%; height: 100%; padding: 1.2em 0;}
            .phone span { font-size:1em;}

        .main-nav li a:after { display:none; }
        .navigation ul { position:static; height:auto; border:none; float: none; padding:0; background: url("../images/parts/bg-content.jpg") bottom center repeat;}
        .navigation li { float:none; position:static; width:100%; padding:0; margin:0; border-top:1px solid #777; font-size:17px; line-height:1; text-align: left;}
        .navigation li:hover { background: rgba(255,255,255,.15); }
        .main-nav li span { padding-left:1rem;}

        .header-wrap.fixed { box-shadow:none; padding-top: 0; height: 60px;}
        .header-wrap.fixed .logo { padding-top:14px;}
        .header-wrap.fixed .navigation { width:100%; padding-top:0;}
        .header-wrap.fixed .navigation-wrap { height:60px; padding:0;}
        .header-wrap .navigation li a,
        .header-wrap.fixed .navigation li a { width: 100%; display: block; padding: 17px 0; text-indent:1.5em;}
        .header-wrap.fixed .reservation { top:0;}
        .header-wrap.fixed .phone { top:0; display: block;}

        .nav-toggle { display: block;}
        .open .nav-toggle span:nth-child(1) {top: 6px;-webkit-transform: rotate(315deg);-moz-transform: rotate(315deg);transform: rotate(315deg);}
        .open .nav-toggle span:nth-child(2) {width: 0;left: 50%;}
        .open .nav-toggle span:nth-child(3) {top: 6px;-webkit-transform: rotate(-315deg);-moz-transform: rotate(-315deg);transform: rotate(-315deg);}
        .open .navigation {-moz-transform: translateY(800px);-webkit-transform: translateY(800px);transform: translateY(800px);}
    }

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

       Movie

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

.movie-wrap {
    position: relative;
    z-index: 0;
    }
    .movie{
        position: relative;
        width: 100%;
        height: auto;
        background:url(../movie/top.jpg) no-repeat center;
        background-size:cover;
        text-align: center;
        }
        .movie:before {
        content: "";
        display: block;
        padding-top: 45%; /* 調整ください */
        }
        .movie_inner{
            position: absolute;
            top: 0; left: 0;
            width: 100%;
            height: 100%;
            overflow:hidden;
            z-index: 0;
            }
            .movie_inner video{
            width:100%;
            height:auto !important;
            margin-left:auto;
            margin-right:auto;
            /*object-fit: cover;*/
            }
        /*
            .movie_inner:after {
            content:"";
            display: block;
            position: absolute;
            top:0;
            left:0;
            width:100%;
            height:100%;
            background: rgba(0,0,0,.3);
            z-index: 1;
            }
        */
@media screen and (max-width: 1087px) {
    .movie-wrap { top:60px; margin-bottom:60px; }
    .movie{ top:0px; }
}

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

      　pace

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

.intro_bg{position:fixed; background:#FFF; width:100%; height: 100vh; z-index: 10000;}
.intro_bg .intro_logo{ position: absolute; width:220px;  bottom:50%; left:50%; margin:0 0 10px -110px; }

.pace {
    -webkit-pointer-events: none;
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    z-index: 20000;
    position: fixed;
    margin: auto;
    top: 55%;
    left: 50%;
    margin-top:20px;
    margin-left:-100px;
    height: 2px;
    width: 200px;
    background: #fff;
    border: 1px solid #808080;
    overflow: hidden;
    }
.pace .pace-progress {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    max-width: 200px;
    position: fixed;
    z-index: 20000;
    display: block;
    position: absolute;
    top: 0;
    right: 100%;
    height: 100%;
    width: 100%;
    background: #808080;
    }
.pace.pace-inactive {display: none;}

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

       背景

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

.section-bg {
    position: relative;
    background: url("../images/parts/bg-content.jpg") center center repeat;
    padding:6rem 0 4rem;
    }
    .section-bg.section-bg-normal { padding:4rem 0;}

.bg-gray { background: #282B21; }

@media screen and (max-width: 959px) {
    .section-bg { padding:3rem 0; }
    .section-bg.section-bg-normal { padding:3rem 0;}
}
@media screen and (max-width: 767px) {
    .section-bg { padding:2rem 0; }
    .section-bg.section-bg-normal { padding:2rem 0;}
}

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

       動く要素

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

.section-leaf {
    top: 0px;
    left: 50%;
    margin-left:-800px;
    position: absolute;
    width: 1600px;
    height: 370px;
    animation: anime02 2.5s steps(2) infinite;
    background-image: url("../images/parts/contents-cover.png");
    background-repeat: no-repeat;
    z-index: 0;
    }
    @keyframes anime02 {
    to { background-position-y: -740px; }
    }
.yama-wrap {
    position: relative;
    width:100%;
    height:75px;
    }
    .yama {
    top: 0px;
    left: 50%;
    margin-left:-160px;
    position: absolute;
    width: 320px;
    height: 70px;
    animation: anime03 2.2s steps(2) infinite;
    background-image: url("../images/img/school/yama.png");
    background-repeat: no-repeat;
    z-index: 0;
    }
    @keyframes anime03 {
    to { background-position-y: -140px; }
    }
.isu-wrap {
    position: relative;
    width:100%;
    height:160px;
    }
    .isu {
    top: 0px;
    left: 50%;
    margin-left:-80px;
    position: absolute;
    width: 160px;
    height: 160px;
    animation: anime04 2.6s steps(2) infinite;
    background-image: url("../images/img/school/isu.png");
    background-repeat: no-repeat;
    z-index: 0;
    }
    @keyframes anime04 {
    to { background-position-y: -320px; }
    }

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

       見出し

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

.f36    { font-size:36px; font-weight:600; color:#B37D2D;}

.th30 img  { height: 30px; }
.th38 img  { height: 38px; }
.th60 img  { height: 60px; }
.th82 img  { height: 82px; }
.th134 img { height:134px; }
.th162 img { height:162px; }
.th176 img { height:176px; }
.th200 img { height:200px; }
.th216 img { height:216px; }

.under-bar { padding-bottom:.5rem; border-bottom:2px solid #62655C;}
.small-title { font-size:1.10526316rem; color:#B37D2D; font-weight: 600;}

@media screen and (max-width: 1087px) {
    .f36       { font-size:27px; }
    .th30 img  { height: 23px; }
    .th38 img  { height: 29px; }
    .th60 img  { height: 46px; }
    .th82 img  { height: 62px; }
    .th134 img { height:101px; }
    .th162 img { height:122px; }
    .th176 img { height:132px; }
    .th200 img { height:150px; }
    .th216 img { height:162px; }

}
@media screen and (max-width: 767px) {
    .f36       { font-size:22px; }
    .th30 img  { height: 18px; }
    .th38 img  { height: 23px; }
    .th60 img  { height: 36px; }
    .th82 img  { height: 49px; }
    .th134 img { height: 80px; }
    .th162 img { height: 97px; }
    .th176 img { height:106px; }
    .th200 img { height:120px; }
    .th216 img { height:130px; }

}

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

       ボタン

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

a.move-btn figure {
    position: relative;
    z-index: 1;
    }
    a.move-btn figure:before {
        content:"";
        display: block;
        position: absolute;
        left:0;
        top:0;
        width:100%;
        height:100%;
        background: #111;
        z-index: 0;
        }
    a.move-btn figure img {
        position: relative;
        -webkit-transition : all 0.2s ease;
            -moz-transition: all 0.2s ease;
            -o-transition  : all 0.2s ease;
                 transition: all 0.2s ease;
        z-index: 1;
        }
    a.move-btn:hover figure img {
        margin-top:-5px;
        margin-left:-5px;
        padding-bottom:5px;
        }
        a.move-btn:hover img {
            opacity:1;
            filter: alpha(opacity=100);
            -ms-filter: "alpha( opacity=100 )";
            }

.btn {
        position:relative;
        font-weight:500;
        font-size:1.05263158rem;
        width:270px;
        }
        .btn a {
        color:#FFF;
        width:270px;
        height:46px;
        text-align: center;
        line-height:46px;
        background: url("../images/parts/btn-green.jpg") center center repeat;
        white-space: nowrap;
        text-decoration:none !important;
        position: relative;
        z-index: 1;
        -webkit-transition: color 0.3s ease;
        -moz-transition: color 0.3s ease;
        -ms-transition: color 0.3s ease;
        -o-transition: color 0.3s ease;
        transition: color 0.3s ease;
        display: block;
        }

        .btn a:after {
        position: absolute;
        content: "";
        width: 0;
        height: 100%;
        top: 0;
        right: 0;
        z-index: -1;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
        background: url("../images/parts/btn-green-hover.jpg") center center repeat;
        }
        .btn a:hover { }
        .btn a:hover:after { left: 0; width: 100%; }

@media screen and (max-width: 767px) { /* 55% */
    .btn { width:220px; }
        .btn a { width:220px;letter-spacing: 0; }
}

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

      　おススメプラン

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

a .plan-img-wrap {
    margin-bottom:1rem;
    overflow: hidden;
    }
    a .plan-title {
    font-size:1rem;
    font-weight:600;
    position: relative;
    padding-bottom:.75rem;
    line-height: 150%;
    }
.plan-btn {
        position:relative;
        font-weight:300;
        font-size:15px;
        }
        a .plan-btn {
        color:#151515;
        border: 2px solid #ADADAA;
        background: rgba(255,255,255,.25);
        width:100%;
        max-width:360px;
        margin:0 auto;
        height:46px;
        text-align: center;
        line-height:46px;
        border-radius: 4px;
        white-space: nowrap;
        text-decoration:none !important;
        position: relative;
        z-index: 1;
        -webkit-transition: color 0.3s ease;
        -moz-transition: color 0.3s ease;
        -ms-transition: color 0.3s ease;
        -o-transition: color 0.3s ease;
        transition: color 0.3s ease;
        letter-spacing: .15em;
        display: inline-block;
        }
        a .plan-btn:after {
        background: #345548;
        border-radius: 2px;
        position: absolute;
        content: "";
        width: 0;
        height: 100%;
        top: 0;
        right: 0;
        z-index: -1;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
        }
        a:hover .plan-btn {
        color: #FFF;
        }
        a:hover .plan-btn:after {
        left: 0;
        width: 100%;
        }

@media only screen and (max-width: 767px) {
    .plan-wrap { width:100%; max-width:360px; margin:0 auto; }
}

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

       空室検索 レスポンシブ

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

.search {
    width:100%;
    min-height:112px;
    background: #282B21;
    color:#111;
    box-sizing:border-box;
    padding:15px;
    }
.search-wrap {
    width:100%;
    max-width:1200px;
    height:auto;
    margin:0 auto;
    box-sizing:border-box;
    }
    .search-title-wrap {
        text-align: center;
        width:100%;
        height:100%;
        min-height:70px;
        position: relative;
        }
        .search-title {
        font-size:24px;
        line-height:100%;
        letter-spacing: .05em;
        }
        .search-title span {
        font-size:11px;
        }
	.search-form{
        width:100%;
        padding:15px ;
        box-sizing:border-box;
        background: rgba(255,255,255,.85);
        color:#111;
        }
        .search-content {
            }
            .search-content div {
            float: left;
            padding:3px 10px;
            font-size:1rem;
            height:32px;
            line-height:1;
            display: inline-table;
            }
            .search-content div p {
            float: left;
            padding-top:8px;
            }
            .search-content div p span {
            font-size:.8em;
            }
            .search-content div input,
            .search-content div select {
            margin-left:10px;
            vertical-align: middle;
            height: 28px;
            border: 1px solid #999;
            }
            .search-content div.check input {
            height: 23px;
            }
	.search-btn {
        margin-top:13px;
        }
        .submit_btn {
            border: 0px;
            width:90px;
            height:90px;
            margin: 0 auto;
            -webkit-transition: all 0.3s ease;
            -moz-transition: all 0.3s ease;
            -o-transition: all 0.3s ease;
            background: url("../images/img/top/search-btn.jpg") top left / cover;
            }
            .submit_btn:hover {
            cursor: pointer;
            opacity:0.6;
            }
    .flex-search-title {
        min-width:200px;
        width:200px;
        }
    .flex-search-btn {
        min-width:158px;
        width:158px;
        }
@media screen and (max-width: 1087px) {

    .flex-wrap.is-search { -webkit-flex-direction: column; flex-direction: column; flex: none; display: block; }
    .flex-search-title { min-width:100%; flex: none; display: none; }
    .search-form { max-width:870px; margin-left:auto; margin-right:auto; padding:15px 18px ;}
    }
@media only screen and (max-width: 767px) {
    .search { padding:3px;}
    .search-wrap { max-width: 480px; padding:0;}
    .flex-search-btn { min-width:100%; flex: none; display: block;}
    .search-form { padding:5px 0px;}
    .search-content { max-width:310px; }
    .search-content div { font-size:.825rem;}
    .search-btn { min-height: 40px;}
    .search-content div p { padding-top:2px; }
    .search-content div input, .search-content div select { font-size: .75rem;}
    .submit_btn { width:240px; height:42px; background: url("../images/img/top/search-btn-sp.jpg") top left / cover; }
    }

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

       NEWS

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

.news-list {
    width:100%;
    padding-bottom:1rem;
    }
    .news-list li {
    line-height:145%;
    padding:.25rem;
    font-size:1rem;
    }
    .news-list li a {
    border-bottom:1px solid rgba(0,0,0,.0);
    -webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
    }
    .news-list li a:hover {
    border-bottom:1px solid rgba(0,0,0,.5);
    margin-left:1rem;
    }
    .news-list span {
    display:inline-block;
    padding-right:1rem;
    }


.trip {
 /*   background: #F2F2F2;
    border:2px solid #111;
    padding:1rem;
    box-sizing:border-box;*/

    }

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

       下層

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

.page-header-wrap {
    position: relative;
    z-index: 0;
    width:100%;
    overflow: hidden;
    }
    .page-header {
        position: relative;
        width: 100%;
        height: 300px;
        text-align: center;
        }
    
    .school { background: url("../images/img/school/header.jpg") center center / cover; }
    .loghouse { background: url("../images/img/loghouse/header.jpg") center center / cover; }
    .activity { background: url("../images/img/activity/header.jpg") center center / cover; }
    .contact    { background: url("../images/img/contact/header.jpg") center center / cover; }
    .plan       { background: url("../images/img/plan/header.jpg") center center / cover; }
    .access     { background: url("../images/img/access/header.jpg") center center / cover; }

	.page-header-wrap h1 {
	position: absolute;
	width:100%;
    margin-top:-81px;
    top:50%;
    left:0;
    text-align: center;
    z-index: 10;
	}
    .page-header-wrap h1 {
    text-align: center;
    line-height:1;
    }

@media screen and (max-width: 1087px) {
    .page-header-wrap {padding-top:60px; } 
    .page-header { height: 200px; }
    .page-header-wrap h1 { margin-top:-27px;}
}
@media only screen and (max-width: 767px) {
    .page-header { height: 150px; }
    .page-header-wrap h1 { margin-top:-15px;}
}


@media screen and (max-width: 1087px) {
    .tablet-max-200 { max-width:200px; width:100%;}
    .tablet-max-450 { max-width:450px; width:100%;}
}

.table {
    width:100%;
    line-height: 150%;
    box-sizing:border-box;
    border-collapse: collapse;
    border-spacing:0;
    margin-bottom:1em;
    font-size:1rem;
    }
    .table tr {
    border-top:2px dotted #333;
    }
    .table tr:last-child {
    border-bottom:2px dotted #333;
    }
    .table th {
    vertical-align: top;
    text-align: left;
    padding:.25em;
    font-weight:600;
    }
    .table td {
    text-align: right;
    vertical-align: top;
    padding:.25em;
    }
    .table td.text-l { text-align: left;  }
    .table.tr-center th,.table.tr-center td { text-align: center; vertical-align: middle;}
    .w7em { width:7em; }
    .w9em { width:9em; }
    .w12em { width:12em; }

@media screen and (max-width: 767px) {
    .table { border:none; }
    .table tr,.table tr:last-child { border:none; }
    .table th { width:100% !important; display: block !important; padding:.25em 1em; box-sizing: border-box; border-right:none; background: rgba(0,0,0,.1);}
    .table td { width:100% !important; display: block !important; padding:.25em 1em .5em; box-sizing: border-box; background: none; text-align: left;}
}



.dotted-list {
    border-top:2px dotted #888;
    }
    .dotted-list li {
    border-bottom:2px dotted #888;
    line-height:135%;
    padding:.35em 0;
    }

.access-list {
    border-top:2px dotted #888;
    }
    .access-list li {
    border-bottom:2px dotted #888;
    line-height:120%;
    padding:.5em 0 .5em 2em;
    position: relative;
    }
    .access-list li:before {
    content:"●";
    display:block;
    position: absolute;
    left:0;
    font-size:1rem;
    top:.5em;
    color:#6BA345;
    }

.map {
    position: relative;
    padding-bottom: 45%;
    margin-bottom:1em;
    height: 0;
    border: 5px solid #333;
    overflow: hidden;
    }
    .map iframe,
    .map object,
    .map embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    }
@media screen and (max-width: 767px) {
    .map { padding-bottom: 90%;
    height: 0;
    border: 3px solid #333;
    overflow: hidden;
    }
}

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

       contact

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

.kome { font-size:12px; color:#C96789; font-weight:bold;}
.form {
    width:100%;
    max-width:600px;
    position: relative;
    }
.button, .input, .textarea, .select select, .file-cta, .file-name, .pagination-previous, .pagination-next, .pagination-link, .pagination-ellipsis { border-radius: 2px; }

.input, .textarea {
    background-color: #FFF;
    }

html>/**/body #submit_button {
	cursor: pointer;
	display: block;
	color:#FFF;
    margin: 0 auto;
    width: 100%;
	max-width: 300px;
	height: 50px;
	border: none;
	border-radius: 2px;
	background-color:#0E654D;
    -webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
    font-family: 'Noto Serif JP', serif;
	}
    html>/**/body #submit_button:hover {
	background-color:#599381;
	}
html>/**/body #reset_button {
	cursor: pointer;
	display: block;
	color:#FFF;
    margin: 0 auto;
    width: 100%;
	max-width: 300px;
	height: 50px;
	border: none;
	border-radius: 2px;
	background-color:#71706F;
    -webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
    font-family: 'Noto Serif JP', serif;
	}
    html>/**/body #reset_button:hover {
	background-color:#CFC3AB;
	}

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

       フッター

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

.footer-nav {
    padding:1rem 0 .5rem;
    position: relative;
    z-index: 100;
    }
    .footer-menu {
        width:100%;
        text-align:center;
        }
        .footer-menu li {
        display: inline-block;
        line-height: 1;
        font-size:1rem;
        }
        .footer-menu li a {
        display: block;
        padding:10px 10px 1rem;
        color:#131211;
        }
        .footer-menu li a:hover {
        color:#999;
        text-decoration:underline;
        }

footer {
    width:100%;
    position: relative;
    background: url("../images/parts/bg-content.jpg") center center repeat;
    font-size:1rem;
    line-height: 150%;
    }
    .footer-logo img {
        width:100%;
        max-width:300px;
        }

.copyright {
    height:60px;
    line-height: 60px;
	text-align:center;
	letter-spacing:0;
    background: #32432B;
	z-index:10;
	position:relative;
	color:#FFF;
	font-size:.8rem;
	}
    .copyright img { vertical-align: middle; }

@media only screen and (max-width: 767px) {
    .footer-nav { padding:2rem 0 0; }
    .footer-menu li { display: block; width:100%; text-align: left; border-top:1px dotted #999; }
    .footer-menu li:last-child { border-bottom:1px dotted #999; }
    .footer-menu li a { padding:.75rem 1rem; display: block; }
    footer { font-size:14px; }
    .footer-text { max-width:240px; }
    .footer-logo img { max-width:180px; }
    }


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

		ページトップ

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

#totop {
	display:none;
	*display:block; /* IE 7 and below */
	position:fixed;
	bottom:60px;
	right:0px;
	z-index:999;
	}
    :root *> #totop { display:none;	}
    #totop { display:block9; }
    *+html #totop { display:block; }
    #totop.open { display:block; }
    a.totop{ background: url("../images/parts/totop.png") no-repeat center top; background-size:cover;width:90px;height:25px;display:block;cursor:pointer;}
    a.totop:hover{ background-position:center bottom;}
@media only screen and (max-width: 767px) {
    #totop { bottom:40px; right:0;}
	a.totop{ background: url("../images/parts/totop-sp.png") no-repeat center top; background-size:cover;width:45px;height:45px;}
}

.pc_on{display:block;}
.sp_on{display:none;}
.tent_site_p.pc_on {margin-top:20px;}

@media screen and (max-width: 767px) {
	.pc_on{display:none;}
	.sp_on{display:block;}
}