@charset "utf-8";
/* CSS Document */

/* OPEN / CLOSE BTNS */

.box-spmenu{}
.spmenu{ display:none;}
.spmenu-title{ display:none;}

/* RESPONSIVE */
	
.box-spmenu{ display:block; width:100%; height:60px; background-color:#301D02; text-align: left;}
.menu-btn {
	    position: fixed;
    /*position: absolute;*/
    top: 20px;
    right: 20px;
    z-index: 9999;
    display: none;
    font-size: 32px;
	display:inline;
	/*background-color:#301D02;*/
}
.menu-btn a {
    display: inline-block;
    text-decoration: none;
	-moz-background-size:40px 40px;
	background-size:40px 40px;
	background-repeat:no-repeat;
	width:40px;
	height:40px;
}
.btn-open{ background-image:url(../img/sp-menu.png);}
.btn-open:after {
    color: #fff;
	content: "MENU";
	font-size:14px;
	display:inline-block;
	margin:60px 0 0 0;
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
	/*font-family: 'Open Sans', sans-serif;*/
	/*font-family: 'Material Icons';
    -webkit-transition: all .2s linear 0s;
    -moz-transition: all .2s linear 0s;
    -o-transition: all .2s linear 0s;
    transition-property: all .2s linear 0s;*/
}

.btn-open:hover:after { color: #fff; }
.btn-close{ background-image:url(../img/sp-menu-close.png);}
.btn-close:after {
    color: #fff;
	content: "CLOSE";
	font-size:14px;
	display:inline-block;
	margin:60px 0 0 0;
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
	/*font-family: 'Open Sans', sans-serif;*/
    /*-webkit-transition: all .2s linear 0s;
    -moz-transition: all .2s linear 0s;
    -o-transition: all .2s linear 0s;
    transition-property: all .2s linear 0s;*/
}
.btn-close:active:after { color: #000; }
.btn-close:hover:after { color: #fff;}


/* OVERLAY */

.overlay {
    position: fixed;
    top: 0;
    z-index: 1000;
    display: none;
    overflow-y: hidden;
	overflow-x:hidden;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
	/*width: 100vw;
	height:100vh;*/
	background: rgba(0, 0, 0, 0.8);
    /*background: #000000;
	opacity:0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";*/
}

/*.site-overlay  {
display: block;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 9998;
    background-color: rgba(0, 0, 0, 0.5);
    -webkit-animation: fade 500ms;
    animation: fade 500ms;}*/

.spmenu {
	width: 100%;
	height:100%;
	display:inline;
}
.spmenu-cont{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 80%;
	/*width: 100%;
	height:100%;
	background-position:center center;
	background-size: cover;
	display: flex;*/
	align-items: center;
	justify-content: center;
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
	margin:0 auto;
}
.spmenu-cont .spmenu-cont-01{ display:block;}
.spmenu-cont .spmenu-cont-01 ul{
	overflow:hidden;
	width:100%; /*height:2000px !important;*/ /*margin:0 auto;*/
	/*background-color: rgba(51, 51, 51, 0.55);*/
	display:block;
	margin:0 auto 24px;
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;}
.spmenu-cont .spmenu-cont-01 ul li{ width:27%; margin:0 3% 0 0; float:left;}
.spmenu-cont .spmenu-cont-01 ul li:last-child{ width:10%; margin:0 0 0 0;}

.spmenu-cont .spmenu-cont-02{ display:block; margin: 24px 0 0 0;}
.spmenu-cont .spmenu-cont-02 ul{
	overflow:hidden;
	width:100%;
	margin:0 auto;
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;}
.spmenu-cont .spmenu-cont-02 ul li{ width:27%; margin:0 3% 0 0; float:left;}
.spmenu-cont .spmenu-cont-02 ul li:last-child{ width:10%; margin:0 0 0 0;}
.spmenu-cont .spmenu-cont-02 ul li.spmenu-cont-02-center{ width:57%; padding: 0 0 0 0; }
.spmenu-cont .spmenu-cont-02 ul li:last-child{ padding: 6px 0 0 0; }
.spmenu-cont .spmenu-cont-02 ul li:last-child p{ border-bottom: solid 1px rgba(255, 255, 255, 0.5);}
.spmenu-cont .spmenu-cont-02 ul li:last-child p:first-child{ border-top: solid 1px rgba(255, 255, 255, 0.5); }
.spmenu-cont .spmenu-cont-02 ul li:last-child p a{
	font-size: 15px;
	position:relative;
	padding: 9px 0 7px 0;
    margin: 0 auto 6px;
    color: #fff;
    display: block;
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;}
/*.spmenu-right-cont{ position: relative; height: 80vh;}
.spmenu-right-cont-child{
	position: absolute;
	bottom: 0;}

.spmenu ul {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
}

.spmenu li {
    display: table;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 20%;
    list-style: none;
    text-align: center;
    -webkit-transition: all .2s linear 0s;
    -moz-transition: all .2s linear 0s;
    -o-transition: all .2s linear 0s;
    transition-property: all .2s linear 0s;
}

.spmenu li a {
    display: table-cell;
    color: #fff;
    vertical-align: middle;
	font-family: 'Quattrocento', serif;
	text-decoration:none;
	font-size:26px;
	border-bottom: solid 1px rgba(255, 255, 255, 0.3);
}*/

.spmenu li a:last-chird{ border-bottom:0px;}
.spmenu li:hover {
	/*background: #584931;*/
}

/*-----アコーディオンメニュー-----*/

.js-ac{ color:#fff;}
.js-ac-trigger{ font-size:20px; position:relative; letter-spacing:2px;}
.js-ac-trigger-obi{ margin:0 auto 24px;}
.js-ac-trigger-obi img{ width:100%;}
.js-ac .js-ac-target{ font-size:15px;}
/*.js-ac .js-ac-target p a:first-child{ border-top:solid 1px #fff;}*/
.js-ac-target p{ border-bottom: solid 1px rgba(255, 255, 255, 0.5) ; margin: 0 auto 6px;}
.js-ac-target p a{
	position:relative;
	padding: 14px 0 12px 0;
    margin: 0 auto 6px;
    color: #fff;
    display: block;
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;}
.js-ac-target p a.noaction{ pointer-events: none; }
.js-ac-target p a:after{
	content: '';
    background-image: url(../img/nav-yaji01.png);
    background-size: 100%;
    background-repeat: no-repeat;
    position: absolute;
    display: inline-block;
    width: 10px;
    height: 14px;
    right: 0;
    top: 21px;
	}
	
.spmenu-cont .spmenu-cont-02 ul li.spmenu-cont-02-center .js-ac-target{ overflow:hidden; margin:0 -5% 0 0;}
.spmenu-cont .spmenu-cont-02 ul li.spmenu-cont-02-center .js-ac-target p{ width:45%; margin:0 5% 0 0; float:left;}

@media only screen and (max-width: 1440px) {

.spmenu-cont .spmenu-cont-01 ul{ margin: 0 auto 12px; }
.js-ac-trigger { font-size: 15px;}
.js-ac-target p a { padding: 7px 0 5px 0; margin: 0 auto 4px;}
.js-ac .js-ac-target { font-size: 12px;}
.js-ac-target p a:after {
    width: 6px;
    height: 8px;
    top: 16px;}
.spmenu-cont .spmenu-cont-02 ul li:last-child {
    padding: 44px 0 0 0;
}
.spmenu-cont .spmenu-cont-02 ul li:last-child p a {
    font-size: 12px;
    padding: 6px 0 4px 0;
    margin: 0 auto 2px;}

}

@media only screen and (max-width: 768px) {

.menu-btn {
    top: 10px;
    right: 10px;}

.overlay { overflow-y: visible; }

.spmenu-title{ 
    display: block;
    font-size: 24px;
    font-family: 'Open Sans', sans-serif;
    color: #fff;
    margin: 0 auto 16px; }

.menu-btn a {
	-moz-background-size:30px 30px;
	background-size:30px 30px;
	width:30px;
	height:30px;
}

.spmenu-cont{
	height: auto;
    margin: 40px 0 0 0;
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%, 0);}
.spmenu-cont .spmenu-cont-01 ul{ height:auto; margin: 0 auto 0; }
.spmenu-cont .spmenu-cont-01 ul li{ width:100%; margin:0 0 0 0; float:none;}
.spmenu-cont .spmenu-cont-01 ul li:last-child{ width:0%; margin:0 0 0 0;} 
.btn-open:after{ display:none;}
.btn-close:after{ display:none;}
.spmenu-cont .spmenu-cont-02 {
    margin: 0 0 0 0;
}
.spmenu-cont .spmenu-cont-02 ul li{ width:100%;}
.spmenu-cont .spmenu-cont-02 ul li.spmenu-cont-02-center{ width:100%; padding:0; }
.spmenu-cont .spmenu-cont-02 ul li:last-child{ width:100%; padding: 40px 0 40px 0;}
.spmenu-cont .spmenu-cont-02 ul li:last-child p a{ font-size: 12px;}
.spmenu-cont .spmenu-cont-02 ul{ margin:0 0 0 0;}
.spmenu-cont .spmenu-cont-02 ul li.spmenu-cont-02-center .js-ac-target p{ width:100%; /*margin: 0 0 0 0;*/ margin: 0 auto 6px; float: none;}
.spmenu-cont .spmenu-cont-02 ul li.spmenu-cont-02-center .js-ac-target p a:after{
	right:0px;
    width: 6px;
    height: 10px;
    top: 10px;
}
.menu-movie-photo{ margin:0 auto 12px;}

/*-----アコーディオンメニュー-----*/

.js-ac-trigger-obi{ display:none;}

.js-ac-trigger{
	/*background-color: #000;*/
	padding: 8px;
    font-size: 13px;
    cursor: pointer;
    border: solid 1px rgba(255, 255, 255, 0.6);
    margin: 0 auto 10px;
}
.js-ac .js-ac-trigger:after {
	content: '＋';
	position: absolute;
    right: 10px;
  }
.js-ac-target p:last-child{ border:none;}
  .js-ac .js-ac-target {
	  font-size:12px;
    display: none;
  }
  .js-ac.is-active .js-ac-trigger:after {
    content: 'ー';
	position: absolute;
    right: 10px;
  }
  .js-ac.is-active .js-ac-target {
    display: block;
	    margin: 0 0% 0 0 !important;
  }
.js-ac-target p a{
	padding: 3px 0 5px 0;
	margin: 0 auto 6px;}
.js-ac-target p a:after{
    width: 6px;
    height: 10px;
    top: 10px;
	}
}


@media only screen and (max-width: 480px) {
	
.spmenu-cont .spmenu-cont-02 ul li:last-child {
    width: 100%;
    padding: 20px 0 0 0;
}

}