@charset "UTF-8";
/* Body */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
   margin: 0;
   padding: 0;
   border: 0;
   outline: 0;
   font-size: 100%;
   vertical-align: baseline;
   background: transparent;
}

html{}

body {
	font-family: 'Noto Sans JP', "YuGothic" , "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	margin: 0;
	font-size:14px;
	color: #000;
}

body .serif {
	font-family:  "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}

h1{
	font-size:2rem;
	text-align: center;
}



p{

}

a{
	text-decoration: none;
	color: #505050;
}

a.fade{-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all  0.3s ease;}
a.fade:hover{opacity: 0.7;}

.clear{
	content:"";display:block;clear:both
}

.bold{
	font-weight: bold;
}

.red{
	color: #ff0000;
}

.pc-block{
	display: block;
}

.sp-block{
	display: none;
}

.shadow{filter:drop-shadow(0 3px 5px rgba(0,0,0,0.2));}

/* Container */
.container {
  	width: 100%;
    background: url(../img/outer-bg.png)no-repeat;
    background-size: cover;
    background-position: center top;
    /*background: #80cca1;
    background-size:100vw 100vh;*/
    background-attachment: fixed;
}

.container img{max-width: 100%;}

.container.page-yoyaku{}

.container p{}




/* Header */
header {position: fixed;width: 100%;height: 70px;z-index: 999;}

.head_contents	{/*width: 960px;*/margin:0 0 0 5%;}
.head_contents h1{font-size: 0.8rem;color: #ffffff;text-align: left;padding-left: 5px;}
.head_contents:after{content:"";display:block;clear:both}
.head_logo {float:left;}
.head_logo img{height: 60px;margin-top: 10px;margin-left: 10px;}
.head_logo a {text-decoration: none;}

#head_menu	{float:right;width:auto;height: 70px;}
#head_menu ul	{display: flex;align-items: center;height: 100%;}
#head_menu li{list-style: none;height: 100%;}
#head_menu li a{font-size:1rem;letter-spacing: 0.1rem;padding:0 30px;color:#000;text-decoration:none;font-weight: bold;display: flex;align-items: center;height: 100%;}
#head_menu li.head-reserve a{background: #013461;color: #fff;}
#head_menu li.head-reserve.kobetsu a{background: #fff;color: #013461;border:1px solid;}
#head_menu li.reserve-event a{background: #FF885C;color: #fff;}
#head_menu li a:hover	{background-color:#bbbbbb;color: #ffffff;transition: 0.5s;}

/*footer設定*/
footer {background: #009944;color: #fff;padding: 30px 0;}
footer .f-links {display: flex;flex-wrap: wrap;justify-content: center;}
footer .f-links li {margin: 15px;list-style: none;}
footer .f-links li a {color: #fff;font-size: 1rem;}
footer .f-links li a:hover {text-decoration: underline;}
.copyright {text-align: center;}

/* pagetop button */
#pageTop {position: fixed;bottom: 20px;right: 75px;z-index: 999;}
#pageTop img {width: 60px;}
#pageTop a:hover {text-decoration: none;opacity: 0.7;}

#fixed-btn {position: fixed;bottom: 80px;right: 40px;z-index: 999;}
#fixed-btn a {display: block;margin: 10px auto;}
#fixed-btn a:hover {text-decoration: none;opacity: 0.7;}
#fixed-btn a img {width: 135px;}



/*下層ページヘッダー*/
/*標準ボタン*/
.btn-basic{text-align: center;}
.btn-basic a{display: inline-block;padding: 10px 50px;background: #fff;color: #000;border-radius: 30px;}
.btn-basic a:hover{background-color:#ddd;transition: 0.2s;}

/*予約ボタン*/
.entry-btn{margin: 50px auto;}
.entry-btn a{background: #fff;color: #000;display: flex;align-items: center;justify-content: space-between;max-width: 96%;margin: auto;padding: 20px 40px;border-radius: 80px;}
.entry-btn a .icon{margin: 0;}
.entry-btn a .icon img{height: 2rem;}
.entry-btn a .text{font-size: 1.1rem;font-weight: bold;margin: 0;text-align: left!important;}
.entry-btn a:hover{background-color:#ddd;transition: 0.2s;}
.entry-btn .attention{margin: 5px auto;}

#fixed-entry{background: #002B51;color: #fff;text-align: center;padding: 1px 0;position: fixed;bottom: 0;left: 0;right:0;width: 100%;max-width: 500px;margin: auto;z-index: 10;}
#fixed-entry p{margin: 10px auto;font-size: 1rem;}
#fixed-entry a{background: #fff;color: #002B51;max-width: 96%;width: 250px;margin: 10px auto;padding: 10px;border-radius: 30px;display: block;text-align: center;font-size: 1.1rem;font-weight: bold;}
#fixed-entry a p{margin: 0;}

/*main contents*/
/*共通設定*/
.contents{
	margin: 30px;
}

.contents h2{font-size:2rem;font-weight: 900;margin: 30px auto;color: #009944;}
.contents h3{font-size:1.6rem;font-weight: 900;margin: 15px auto;color: #009944;}
.contents h4{font-size:1.2rem;font-weight: 700;margin: 15px auto;}
.contents p{font-size: 1rem;line-height: 1.8rem;margin: 15px auto;}
.contents img{max-width: 100%;vertical-align: middle;}
.contents h2.line span{display: inline-block;position: relative;}
.contents h2.line span:before{position: absolute;bottom:0;left: -3rem;display: block;content:"";width: 3rem;height: 3rem;background: url(../img/line-l.svg)no-repeat;background-size: auto 100%;background-position: center;}
.contents h2.line span:after{position: absolute;bottom:0;right: -3rem;display: block;content:"";width: 3rem;height: 3rem;background: url(../img/line-r.svg)no-repeat;background-size: auto 100%;background-position: center;}

.ribbon {display: block;width: 90%;position: relative;height: 50px;line-height: 50px;text-align: center;padding: 0 30px;background: #009944;color: #FFF;box-sizing: border-box;}
.ribbon:before, .ribbon:after {position: absolute;content: '';width: 0px;height: 0px;z-index: 1;}
.ribbon:before {top: 0;left: 0;border-width: 25px 0px 25px 15px;border-color: transparent transparent transparent #edf1b0;border-style: solid;}
.ribbon:after {top: 0;right: 0;border-width: 25px 15px 25px 0px;border-color: transparent #edf1b0 transparent transparent;border-style: solid;}
h3.ribbon{color: #fff;}

.flex-two{display: flex;justify-content: space-between;margin: 30px auto;}
.flex-two .flexitem{width: 48%;list-style: none;}
.flex-two.rev-flex{flex-direction: row-reverse;}

.flex-three{display: flex;justify-content: space-between;margin: 30px auto;}
.flex-three .flexitem{width: 31%;list-style: none;}

/* アコーディオン */
.accordion{margin: 30px auto;}
.ac-header {cursor: pointer;display: flex;justify-content: space-between;align-items: center;padding: 10px 15px;}
.ac-header .arrow{margin: 0;width: 25px;}
.ac-header .arrow img{height: 25px;opacity: 0.8;transition: 0.2s;}

.ac-inner {display: none;padding: 10px 15px;}

/*.ac-header.active .arrow img{transform: rotate(90deg);transition: 0.2s;}*/

/* TOPコンテンツ */
.main-section{position: relative;}
.outer-contents.left{position: fixed;top:100px;right: calc(50vw + 280px);max-height: calc(100vh - 100px);max-width: 450px;width: calc(50% - 300px);overflow-y: scroll;scrollbar-width: none;}
.outer-contents.right{position: fixed;top:100px;left: calc(50vw + 280px);max-height: 100vh;max-width: 450px;width: calc(50% - 300px);overflow-y: scroll;scrollbar-width: none;}

.inner-wrap{position: relative;background: #edf1b0;max-width: 500px;margin: 0 auto;}

@media (max-width:1200px){
  .main-section{display: block;}
  .outer-contents{display: none;}
  .head_logo{display: none;}
}

/* Outer Contents */
.outer-contents .contents{text-align: center;}
.outer-contents .contents h2{font-size: 1.3rem;margin-top: 0;}
.outer-contents .btn-basic a{background: #003461;color: #fff;font-weight: bold;font-size: 1rem;}

#outer-yoyaku{}
#outer-yoyaku a:hover{opacity: 0.8;}
#outer-links{}
#outer-links ul{}
#outer-links li{list-style: none;font-size: 1.5rem;font-weight: bold;text-align: left;margin: 30px auto;}
#outer-links li a{color: #000;border-bottom:5px solid #faf6c5;display: inline-block;padding: 0 5px 5px 0;}
#outer-links li a span{display: inline-flex;justify-content: center;align-items: center;font-size: 1.3rem;width: 1.6rem;height: 1.6rem;background: #faf6c5;color: #009944;margin-right: 5px;}
#outer-links li a:hover{opacity: 0.8;}

.bg-leaf{background: url(../img/bg-leaf.png);background-size: 100%;}

#firstview{}
#firstview img{width: 100%;vertical-align: middle;}

#sec1 p{text-align: center;}

#sec2{text-align: center;}
#sec2 h3{color: #009944;font-size: 1.5rem;}
#sec2 h3 span{display: inline-block;background: linear-gradient(transparent 60%,#bedf9a 60%);}
#sec2 p{font-weight: 700;font-size: 1.1rem;line-height: 2rem;margin: 30px auto;}
#sec2 .house-img{display: flex;justify-content: space-between;flex-wrap: wrap;margin-bottom: 50px;}
#sec2 .house-img img{width: 48%;margin: 5px auto;}

#sec3{}
#sec3 .naiyou{margin: 50px auto;}
#sec3 .naiyou h3{font-size: 1.2rem;}
#sec3 .flexitem p{margin-top: 0;}

#sec3 .naiyou-wrap{display: flex;flex-wrap: wrap;justify-content: space-between;}
#sec3 .naiyou-wrap .naiyou{width: 48%;margin: 15px auto;}
#sec3 .naiyou-wrap .naiyou .ribbon {width: 100%;height: 70px;line-height: 25px;padding: 0 30px;display: flex;align-items: center;justify-content: center;font-size: 1.1rem;}
#sec3 .naiyou-wrap .naiyou .ribbon:before {top: 0;left: 0;border-width: 35px 0px 35px 15px;border-color: transparent transparent transparent #edf1b0;border-style: solid;}
#sec3 .naiyou-wrap .naiyou .ribbon:after {top: 0;right: 0;border-width: 35px 15px 35px 0px;border-color: transparent #edf1b0 transparent transparent;border-style: solid;}

#head-search{padding: 10px 0;}
#search-main{position: relative;}
#search-main .kazari1{position: absolute;top:20px;right:30px;width: 110px;}
.event-search {background: #bedf9a;padding: 50px 0;}
.event-search h2{text-align: center;}
.event-search .search-box {margin: 30px auto;}
.event-search .search-box p {font-size: 1.1rem;margin: 10px auto;font-weight: bold;}
.event-search .search-box .input-section{display: flex;flex-direction: column;align-items: center;margin-bottom: 15px;}
.event-search .search-box .input-section .select-area {text-align: center;margin: 10px auto;display: flex;}
.event-search .search-box .input-section .select-date {text-align: center;margin: 10px auto;}
.event-search .search-box .input-section .select-event {text-align: center;margin: 10px auto;display: flex;}
.event-search .search-box .input-section .select-area p,
.event-search .search-box .input-section .select-event p{width: 130px;}
.event-search .search-box .input-section select {position: relative;padding: 10px 10px;font-size: 1rem;border-radius: 10px;margin-left: 10px;width: 200px;}

.event-search .search-box .btn-section{display: flex;align-items: center;justify-content: center;}
.event-search .search-box .btn-section .btn-search {text-align: center;margin: 15px;}
.event-search .search-box .btn-section .btn-search input {padding: 10px 50px;font-size: 1.2rem;font-weight: bold;border-radius: 15px;background: #009944;color: #faf6c5;border:none;}
.event-search .search-box .btn-section .btn-search input:hover {background: #aaa;}
.event-search .search-box .btn-section .btn-reset {text-align: center;margin: 15px;}
.event-search .search-box .btn-section .btn-reset input {padding: 15px;font-size: 1.2rem;font-weight: bold;background: none;color: #333;outline: none;border: none;border-bottom: 1px dotted #333;}


#event-list {margin: 50px auto;position: relative;}
#event-list .kazari2{position: absolute;top:-90px;left: 10px;height: 90px;z-index: 10;}
#event-list .kazari2 img{height: 100%;}
#event-list .kazari3{position: absolute;bottom:-90px;right: 10px;height: 110px;z-index: 10;}
#event-list .kazari3 img{height: 100%;}
.event-box {background: #fff;list-style: none;}
.event-box .type {background: #009944;color: #faf6c5;padding: 5px;text-align: center;font-size: 1.3rem;}
.event-box .event-main{padding: 0 15px 15px 15px;}
.event-box .event-image{margin-bottom: 15px;}
.event-box .event-image img{width: 100%;}
.event-box .flex-two {display: flex;justify-content: space-between;}
.event-box .flex-two .left {width: 48%;}
.event-box .flex-two .right {width: 50%;}
.event-box h4.name {font-size: 1.2rem;margin: 0 auto 15px auto;}
.event-box dl {font-size: 1rem;display: flex;flex-wrap: wrap;align-items: flex-start;}
.event-box dl dt {font-weight: bold;width: 100px;background: #003461;color: #fff;padding: 2px 5px;text-align: center;margin-bottom: 10px;}
.event-box dl dd {color: #000;width: calc(100% - 120px);padding: 0 5px;margin-bottom: 10px;}
.event-box .detail .date-wrap {display: inline-block;margin-right: 10px;}
.event-box .icon {text-align: right;margin: 15px auto 5px auto;}
.event-box .icon img {height: 40px;}
.event-box .btn_event {text-align: center;margin: 30px auto;position: relative;}
.event-box .btn_event img{width: 250px;}


#event-area {margin: 50px auto;}
#event-area h2 {display: flex;justify-content: center;align-items: center;margin-bottom: 30px;font-size: 1.7rem}
#event-area h2 .icon {margin-right: 5px;}
#event-area h2 .icon img {height: 50px;}
.area-wrap {margin: 30px auto;font-size: 1.1rem;border-spacing: 15px;}
.area-wrap th,.area-wrap td{display: block;width: 100%;}
.area-wrap th {text-align: left;color: #009944;}
.area-wrap ul {display: flex;flex-wrap: wrap;}
.area-wrap ul li {margin: 5px;list-style: none;box-sizing: border-box;border:1px solid #009944;width: calc(25% - 10px);}
.area-wrap ul li a {background: #fff;color: #333;width: calc(100% - 10px);text-align: center;display: inline-block;padding: 5px;font-weight: bold;}
.area-wrap ul li a.all {background: #009944;color: #fff;}
.area-wrap ul li a:hover {background: #aaa;}


#sec4{}

#sec5{background: #bedf9a;padding: 30px 0;}
#sec5 h2{text-align: center;}
#sec5 .ac-header{}
#sec5 .qa-box{background: #fff;margin: 15px auto;position: relative;}
#sec5 .qa-box .kazari4{position: absolute;top:-90px;left: 10px;height: 90px;z-index: 10;}
#sec5 .qa-box .kazari4 img{height: 100%;}
#sec5 .qa-box h3{font-size: 1rem;margin: 5px 0 0 0;}
#sec5 .qa-box .q-text{display: flex;width: calc(100% - 28px);}
#sec5 .qa-box .q-text:before{display: block;content:"Q.";color:#009944;font-size: 1.3rem;margin-right: 5px;font-weight: 900;}
#sec5 .qa-box .ac-inner p{margin-left: 30px;position: relative;margin: 5px auto 5px 30px;font-weight: 700;}
#sec5 .qa-box .ac-inner p:before{display: block;content:"A.";color:#009944;font-size: 1.3rem;font-weight: 900;position: absolute;top:0;left: -27px;}
#sec5 .lead{text-align: center;font-size: 1rem;font-weight: bold;}

#sns {margin: 50px auto;text-align: center;}
#sns h2{font-size: 2rem;}
#sns h3{font-weight: 700;}
#sns .sns-wrap {display: flex;justify-content: center;}
#sns .sns-wrap li {margin: 15px auto;list-style: none;}
#sns .sns-wrap li img {height: 50px;}

#event-detail {background: #bedf9a;padding: 50px 0;}
#event-detail h2 {text-align: center;font-size: 1.5rem;font-weight: normal;margin: 15px auto;color: #111;}
#event-detail p {font-size: 1rem;margin: 15px auto;}

#event-list.area-page{position: relative;}
#event-list.area-page .kazari5{position: absolute;top:-50px;left: 0;right:0;width: 100%;}
.area-title{text-align: center;}
.area-title .area-name {margin: 10px auto;font-size: 2rem;display: inline-block;padding: 10px 50px;background: #fff;border:1px solid;border-radius: 50px;}
.area-title .date {margin: 0 15px;font-size: 1.5rem;display: block;}
.area-title .event-type {margin: 0 15px;font-size: 1.3rem;display: block;}



/*tablet*/
@media (min-width:431px) and (max-width:960px){
/*共通設定*/

.container {
	width: 100%;
}

}

/* Mobile */
@media (max-width: 431px) {
html{font-size: 14px;}

h1{
	text-align: center;
}



p{
}

.pc-block{
	display: none;
}

.sp-block{
	display: block;
}


/* Container */
.container {
	width: 100%;
}

.container p{}


/* Header */
header {height: 60px;}
.head_contents	{width: 100%;margin: 0;}
.head_logo img{height: 40px;margin-left: 10px;margin-top: 10px;}

/*footer設定*/
/*footer{padding-bottom: 120px;}*/

#fixed-bnr{position: fixed;bottom:5px;right: 5px;}
#fixed-bnr img{max-width: 100%;width: 130px;}


/*main contents*/
/*共通設定*/

.contents{
	margin: 30px 15px;
}

.more_info{
	float: right;
	text-decoration: underline;
	padding: 5px;
}

//*予約ボタン*/
.reserve-btn a .icon{margin: 10px 10px 0 10px;}
.reserve-btn a .icon img{height: 2.5rem;}
.reserve-btn a .text{font-size: 1.3rem;padding: 0 10px 10px 10px;margin: 15px 0;}
.contents p.goyoyaku{font-size: 1rem;}

/*TOP~HOME*/
.head-space{width: 100%;height: 60px;}

/* pagetop button */
#pageTop {position: fixed;bottom: 20px;right: 40px;}
#pageTop img {width: 40px;}
#fixed-btn {position: fixed;bottom: 60px;right: 10px;}
#fixed-btn a img {width: 100px;}

}

#sp-phone {
    position: absolute;
    right: 70px;
    top: 5px;
    width: 34px;
    height: 36px;
    cursor: pointer;
    z-index: 100;
	font-size:38px;
}

/* トグルメニュー */
#nav-toggle {
    display: block;
    position: absolute;
    right: 20px;
    top: 13px;
    width: 28px;
    height: 36px;
    cursor: pointer;
    z-index: 100;
}
#nav-toggle div {
    position: relative;
}
#nav-toggle span {
    display: block;
    position: absolute;
    height: 2px;
    width: 100%;
    background: #777; /*トグルボタン色設定*/
    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: 9px;
}
#nav-toggle span:nth-child(3) {
    top: 18px;
}

#nav-toggle p{font-size: 10px;position: absolute;top:22px;}

/*#toggle_menu{display: none;}*/


 #toggle_menu {
        display: block;
        position: absolute;
        /* 開いてないときは画面外に配置 */
        top: -110vh;
        left: 0;
        background: rgba(255,255,255,0.9);
        width: 100vw;
        height: 100vh;
        text-align: center;
        -webkit-transition: .5s ease-in-out;
        -moz-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
	 	margin: 0;
    float: none;
    padding-top: 0vh;
    }

    #toggle_menu .yoyaku-list{justify-content: center;margin: 15px auto;}

    #toggle_menu h2{color: #173763;font-size: 2rem;margin: 0 auto 30px auto;text-align: center;font-weight: bold;}
    #toggle_menu h2 span{display: inline-block;border:2px solid;padding: 5px 15px;font-size: 1.5rem;margin: 15px auto;background: #fff;}
    #toggle_menu p{text-align: center;color: #173763;font-weight: bold;letter-spacing: 0.1rem;font-size: 1rem;}


    #nav-toggle {
        display: block;
    }


    /* #nav-toggle 切り替えアニメーション */
    .open #nav-toggle span:nth-child(1) {
        top: 11px;
        -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: 11px;
        -webkit-transform: rotate(-315deg);
        -moz-transform: rotate(-315deg);
        transform: rotate(-315deg);
    }
    /* #global-nav スライドアニメーション */
    .open #toggle_menu {
        /* #global-nav top + #mobile-head height */
        -moz-transform: translateY(110vh);
        -webkit-transform: translateY(110vh);
        transform: translateY(110vh);
    }

    #toggle_menu .midashi-links{max-width: 960px;margin: auto;}
    #toggle_menu .midashi-links li{font-size: 1.5rem;text-align: left;padding: 15px;list-style: none;border-bottom: 1px solid;font-weight: bold;}



/* 共通：ページ内リンク先にこのクラスをつける */
.anchor-target {scroll-margin-top: 80px;}
