@charset "UTF-8";

html,body{
	
	overflow-x:hidden;
}
/* BODY
---------------------------------------------------- */

body {
	font-size:13px;
	line-height:1.7;
	letter-spacing:0.2px;
	font-weight:400;
	
	}

p{ font-weight:400; }


/* BASE
----------------------------------------------------- */
#wrapper{
	width:100%;
	}
section,#top{
	width:100%;
	margin:0 auto;
	padding:0px 0px 25% 0px;
	position:relative;
	
	}
.cateTitle{
	margin:0 auto 15% auto;
	text-align:center;
	width:120px;
	font-family: ryo-display-plusn,serif;
	font-weight:700;
	font-size:13px;
	letter-spacing:2px;
	color:#211c17;
	padding-bottom:7px;
	border-bottom:1px solid rgba(33,28,23,0.40);
}



/* FOOTER
----------------------------------------------------- */
footer{
	background:#f5f5f5;
	position:relative;
	text-align:center;
	width:100%;
	z-index:1;
	color:rgba(33,28,23,0.50);
	font-size:9px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	font-weight:500;
	letter-spacing:-0.3px;
	line-height:1.3;
	padding:5%;
}
footer img{
	margin-bottom:10px;
	width:50%;
	max-width:245px;
}
footer p{
	margin-bottom:5px;
}
/* NAVIGATION
----------------------------------------------------- */
#overlay{
	width:100%;
	height:200%;
	background:rgba(0,0,0,.6);
	position:fixed;
	top:0;
	right:-100%;
	opacity:0;
	z-index: 9500 !important;
	}
#overlay.openedBg{
	opacity:1;
	right:0;
	}
#toggle {
	position: fixed !important;
	z-index: 9699 !important;
	width: 44px;
	height: 44px;
	top: 0px;
	right: 0px;
	cursor: pointer;
	padding:20px 0 0 13px;
	background:#0d724c;
	-webkit-transition: 250ms ease all;
	-moz-transition: 250ms ease all;
	transition: 250ms ease all; 
	}


	#toggle span {
	display: block;
	position: absolute;
	width: 19px;
	height: 2px;
	background: #faf5e9;
	-webkit-transition: 250ms ease all;
	-moz-transition: 250ms ease all;
	transition: 250ms ease all;
	}

	#toggle span:before,
	#toggle span:after {
	content: " ";
	position: absolute;
	width: 100%;
	height: 2px;
	background: #faf5e9;
	-webkit-transition: 200ms ease all;
	-moz-transition: 200ms ease all;
	transition: 200ms ease all;
	}
	
	#toggle span:before { margin: -7px 0 0 0; }
	
	#toggle span:after { margin: 7px 0 0 0; }
	
	#toggle.open{ 
	background:transparent;
	 }
	#toggle.open span { background-color: transparent; }
	
	#toggle.open span:before,
	#toggle.open span:after {
	margin: 0;
	background:#0d724c;
	height: 2px;
	}
	#toggle.open span:before {
	-webkit-transform: rotate(135deg);
	-moz-transform: rotate(135deg);
	transform: rotate(135deg);
	}
	#toggle.open span:after {
	-webkit-transform: rotate(-135deg);
	-moz-transform: rotate(-135deg);
	transform: rotate(-135deg);
	}
	
#globalnav {
	position: fixed;
	width: 250px;
	height: 1500px !important;
	top: 0px;
	right: -320px;
    opacity:1;
	background: rgba(255,255,255,0.9);
	 -webkit-transition: all 300ms linear;
	 -moz-transition: all 300ms linear;
	  transition:         all 300ms linear;
      transform:scale(1,1);
	  z-index: 9501 !important;
      visibility:hidden;
	}
	#index #globalnav {
   
    }
	#globalnav.opened {
        visibility:visible;
	top: 0;
	right: 0;
    opacity:1;
     -webkit-transition: all 600ms cubic-bezier(0.165, 0.84, 0.44, 1);
	  -moz-transition: all 600ms cubic-bezier(0.165, 0.84, 0.44, 1);
	  transition:         all 600ms cubic-bezier(0.165, 0.84, 0.44, 1);
	}
	#index #globalnav.opened {
    top: 0;
    }
#globalnav nav > ul{
	position:relative;
	margin-top:80px;
	z-index:9002;
	text-align:center;
	}
#globalnav nav li{
	position:relative;
	clear:both;
	font-weight:600 !important;
	letter-spacing:1.8px;
	
	}

#globalnav nav li.cs{
	position:relative;
	clear:both;
	padding:8px 0 8px 0px;
	font-size:15px;
	opacity:0.8;
	color:rgba(255,252,131,0.3);
	}

#globalnav nav > ul > li a{
	padding:8px 0 8px 0px;
	
	font-weight:600 !important;
	letter-spacing:1.5px;
	
	}
#globalnav nav li a {
	font-size:15px;
	color:#0d724c;
	width:100%;
	height:100%;
	display:block;
	position:relative;
	 background:rgba(255,255,255,0);
	 -webkit-transition: all 200ms linear;
	 -moz-transition: all 200ms linear;
 	 transition:         all 200ms linear;
	
	}
#globalnav nav li a:hover{
	opacity:1;
	background:rgba(255,255,255,1);
	}




#globalnav nav li:nth-child(2) a,
#globalnav nav li:nth-child(8) a{
	
	margin-top:20px;
	}

#globalnav nav li:nth-child(2) a::before,
#globalnav nav li:nth-child(8) a::before {
	content:'';
	width:10px;
	height:1px;
	background:#0d724c;
	opacity:0.5;
	position:absolute;
	top:-10px;
	left:0;
	right:0;
	margin:0px auto;
	}






#pagetopBtn{
	position:fixed;
	bottom:13px;
	right:13px;
	opacity:0;
	text-indent:-9999px;
	display:block;
	width:44px;
	height:44px;
	margin:0 auto;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	transition: 0.3s;
	user-select: none; /* CSS3 */
	-moz-user-select: none; /* Firefox */
	-webkit-user-select: none; /* Safari、Chromeなど */
	-ms-user-select: none; /* IE10かららしい */
	overflow:hidden;
	z-index:8000 !important;
	background:#0d724c;
	border-radius: 40px; 
	-webkit-border-radius: 40px;
	-moz-border-radius: 40px; 
	}
#pagetopBtn:hover{
	bottom:13px;
	right:13px;
	}
#pagetopBtn:after{
	top:18px;
	left:18px;
	width:10px;
	height:10px;
	
	}