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

#header{overflow: hidden;background: rgba(255,255,255,0.5);font-weight: bold;}
.header-in{max-width:1200px;margin: 0 auto;overflow: hidden;}
.logo{float: left;max-width:100px;padding: 10px;box-sizing: border-box;}
.logo img{width: 100%;height: auto;}
.header-right{float:right;width:590px;}
.navi{width: 100%;}
.navi ul{overflow: hidden;max-width:1050px;width: 100%; margin: 0 auto;text-align: center;box-sizing: border-box;}
.navi li{float: left;list-style: none;text-align: center;padding:10px;box-sizing: border-box;}
.main-nav ul{width: 100%;}
.main-nav li{width:20%;float: left;}
.main-nav li{border-left:2px #000000 dotted;}
.main-nav li:first-child{border-left:none;}
.navi a{text-decoration: none;color: #000000;display: block;}
.head-sub li{float: right;width:50%;}
.head-sub li a::after{content: ">";font-weight: bold;color:white;margin-left:10px; }
.pc-none{display: none;}
.is-fixed {position: fixed;
  top: 0;  left:0;
  z-index: 2;
	margin: 0 auto;
  width: 100%;}
.sub-head-right{width: 70%;float: right;display: flex;position: relative;background-color: #4B3B30;border-radius: 15px;margin-bottom: 14px;top:-10px;padding-top:10px;}
.sub-head-right a{color: white;}


@media screen and (max-width:700px){
	.sub-head-right{display: none;}
.logo{max-width: 80px;}
.sp-none{display: none;}
.sp-clear{text-indent:100%;white-space:nowrap;overflow:hidden;display: none;}
nav.NavMenu{display: block!important;}
nav.NavMenu{position: fixed;	/*表示位置を固定*/
			z-index: 2;		/*重ね順を変更*/
			top: 0;		/*表示位置を指定*/
			left: 0;	/*表示位置を指定*/
			color: #fff;	/*文字色を黒にする*/
			text-align: center;		/*テキストを中央揃え*/
			width:100%;	/*全幅表示*/
			transform: translateX(100%);	/*ナビを上に隠す*/
			transition: all 0.6s;	/*アニメーションの時間を指定*/
	height: 100vh;}

nav.NavMenu ul{background:white;
width: 100%;
			margin: 0 auto;
			padding: 0;
			margin-top:79px;
		font-weight: bold;/*box-shadow:0px 0px 18px 0px rgba(0,0,0,0.6);*/}
nav.NavMenu ul li{font-size: 1.1em;
			list-style-type: none;
			padding: 0;
			width: 100%;padding:10px;box-sizing: border-box;
	border-bottom: 1px solid  darkseagreen;}
nav.NavMenu ul li:last-child{border-bottom: none;	/*最後のメニュー項目のみ下線を消す*/}
nav.NavMenu ul li a{display: block;		/*クリックできる領域を広げる*/
color:  darkseagreen;text-decoration: none;}
nav.NavMenu.active{transform: translateX(0%);/*ナビを表示する*/}
.Toggle {display: block;
position: fixed;    /* bodyに対しての絶対位置指定 */
right:14px;
top:10px;
width: 50px;
height: 60px;
cursor: pointer;
z-index: 3;
padding: 10px;
box-sizing: border-box;}

.Toggle span {
display: block;
position: absolute;
width: 70%;
margin: 0 auto;
box-sizing: border-box;
border-bottom: solid 3px darkseagreen;
-webkit-transition: .35s ease-in-out;	/*変化の速度を指定*/
-moz-transition: .35s ease-in-out;		/*変化の速度を指定*/
transition: .35s ease-in-out;			/*変化の速度を指定*/
left: 9px;}

		.Toggle span:nth-child(1) {
		    top: 18px;}

		.Toggle span:nth-child(2) {
		    top: 28px;}

		.Toggle span:nth-child(3) {
		    top: 38px;}
		/* 最初のspanをマイナス45度に */
		.Toggle.active span:nth-child(1) {
		    top: 28px;
		    left: 9px;
		    -webkit-transform: rotate(-45deg);
		    -moz-transform: rotate(-45deg);
		    transform: rotate(-45deg);}
/* 2番目と3番目のspanを45度に */
.Toggle.active span:nth-child(2),
.Toggle.active span:nth-child(3) {
top: 28px;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg);

}
	
#fade{display: none;}}

@media screen and (max-width:650px){
nav.NavMenu{text-align: center;		/*テキストを中央揃え*/
			width: 100%;	/*全幅表示*/
			}}