/* フォント指定 */
@font-face {
  font-family: 'Noto Serif Japanese';
  font-style: normal;
  font-weight: 200;
  src: url('../lib/notoserif_ss/NotoSerifJP-Regular_ss.woff') format('woff');
}
@font-face {
  font-family: 'Noto Serif Japanese';
  font-style: normal;
  font-weight: 500;
  src: url('../lib/notoserif_ss/NotoSerifJP-SemiBold_ss.woff') format('woff');
}
body { font-family: "Noto Sans Japanese";font-weight: 300; }
.sawarabi { font-family: "Noto Serif Japanese"; }
.sawarabi_b { font-family: "Noto Serif Japanese";font-weight: 500; }

/* 共通クラス */
.clearfix:after {
    content:" ";
    display:block;
    clear:both;
}

/* スマホで非表示 */
	@media screen and (max-width: 480px) {
		.sp_hidden {
			display: none;
		}
	}

/*トップ矢印*/
#back-top-button {
	position: fixed ;
	right: 16px ;
	bottom: 16px ;
	display: none ;
}
#back-top {
	position: relative;
	display: block;
	width: 55px;
	height: 55px;
	background-color: #665e53;
	opacity: 0.7;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px
}
#back-top:hover {
	opacity: 0.85 ;
}
.arrow {
	position: absolute;
	width: 15px;
	height: 15px;
	border: 5px solid #665e53;
	border-left-color: #FFF;
	border-top-color: #FFF;
	top: 20px;
	left: 15px;
	transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	-ms-transform: rotate(45deg)
}


/* ハンバーガーメニュー */
#nav-drawer {
	position: relative;
}
/*チェックボックス等は非表示に*/
.nav-unshown {
	display:none;
}
/*アイコンのスペース*/
#nav-open {
	display: inline-block;
	margin-top: .12rem;
	margin-right: .2rem;
	vertical-align: middle;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
	cursor: pointer;
	font-size: .25rem;
	padding: 10px;
	margin: 0;
	line-height: 0;
	background-color: #eee;
	color: #333;
	border-radius: 10px;
	display: block;
	-webkit-border-radius: 10px;/* for Safari and Chrome 対応*/
	-moz-border-radius: 10px;/* for Firefox 対応*/
}

/*閉じる用の薄黒カバー*/
#nav-close {
	display: none;/*はじめは隠しておく*/
	cursor: pointer;
	position: fixed;
	z-index: 99;
	top: 0;/*全体に広がるように*/
	left: 0;
	width: 100%;
	height: 100%;
	background: black;
	opacity: 0;
	transition: .3s ease-in-out;
}

/*中身*/
#nav-content {
	overflow: auto;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;/*最前面に*/
	width: 90%;/*右側に隙間を作る（閉じるカバーを表示）*/
	max-width: 330px;/*最大幅（調整してください）*/
	height: 100%;
	background: #fff;/*背景色*/
	transition: .3s ease-in-out;/*滑らかに表示*/
	-webkit-transform: translateX(-105%);
	transform: translateX(-105%);/*左に隠しておく*/
}
#nav-content h3 {
	font-size: .18rem;
	font-weight: 700;
	margin-left: .2rem;
	margin-top: .4rem;
	color: rgba(85,11,64,0.9);
}
#nav-content h3 a {
	font-size: .18rem;
	text-decoration: none;
	font-weight: 500;
	color: rgba(85,11,64,0.9);
}
#nav-content p,#nav-content p a {
	color: #333;
	font-weight: 400;
	font-size: .15rem;
	margin-top: .1rem;
	margin-bottom: .1rem;
	margin-left: .25rem;
	display: block;
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
	display: block;/*カバーを表示*/
	opacity: .5;
}

#nav-input:checked ~ #nav-content {
	-webkit-transform: translateX(0%);
	transform: translateX(0%);/*中身を表示（右へスライド）*/
	box-shadow: 6px 0 25px rgba(0,0,0,.15);
}
	
	/* ハンバーガーのはざま */
	@media screen and (min-width:560px) {
		#nav-drawer {
  			display:none;
		}
	}
	@media screen and (max-width:559px) {
		header nav {
			display: none;
		}
	}



/* 各要素の文字サイズなどをとりあえず統一 */

html {
	font-size: 625%;
	overflow-x : hidden;
    -webkit-overflow-scrolling: touch;
}
body {
	font-size: .16em;
	overflow-x : hidden;
    -webkit-overflow-scrolling: touch;
}
.wrapper { overflow: hidden; }
a {
	-webkit-transition:all 0.3s ;
	-moz-transition:all 0.3s ;
	transition:all 0.3s ;
}
p {
	font-size: .14rem;
	font-weight: 200;
	line-height: .26rem;
	margin-top: 0;
}
hr {
	display: block;
	width: 100%;
	height: 1px;
	margin-top: .2rem;
	margin-bottom: .2rem;
	background-color: #ddd;
	border: 0;  /*デフォルトデザインでは線がある場合があるので、消しておく。*/
	clear: both;
}
strong {
	font-weight: 800;
}

/* ポイントで大きくしていくスタイル */
.big1 {
	font-size: .25rem;
	font-weight: 300;
	letter-spacing: .018rem;
}
.big1 rt {
	font-size: .1rem;
}
/*フォントサイズ*/
.fs1 { font-size: .08rem; }
.fs2 { font-size: .09rem; }
.fs3 { font-size: .1rem; }
.fs4 { font-size: .11rem; }
.fs5 { font-size: .12rem; }
.fs6 { font-size: .13rem; }
.fs7 { font-size: .14rem; }
.fs8 { font-size: .15rem; }
.fs9 { font-size: .16rem; }
.fs10 { font-size: .17rem; }
.fs11 { font-size: .18rem; }
.fs12 { font-size: .19rem; }
.fs13 { font-size: .2rem; }
.fs14 { font-size: .21rem; }
.fs15 { font-size: .22rem; }
.fs16 { font-size: .23rem; }
.fs17 { font-size: .24rem; }
.fs18 { font-size: .25rem; }
/*フォントウエイト*/
.fw1 { font-weight: 100; }
.fw2 { font-weight: 200; }
.fw3 { font-weight: 300; }
.fw4 { font-weight: 400; }
.fw5 { font-weight: 500; }
.fw6 { font-weight: 600; }
.fw7 { font-weight: 700; }
.fw8 { font-weight: 800; }
.fw9 { font-weight: 900; }
/*フォントカラー*/
.fc1 { color: rgba(85,11,64,0.9); }
.fc2 { color: rgba(85,11,64,0.5); }

/*角丸ボタン*/
.button {
	min-width: 20%;
	max-width: 90%;
	margin-top: .2rem;
	margin-bottom: .2rem;
	margin-left: auto;
	margin-right: auto;
	padding: 8px 0;
	font-size: .14rem;
	font-weight: 400;
	text-decoration: none;
	display: block;
	text-align: center;
	color: rgba(85,11,64,0.9);
	background: #fff;
	border:solid 1px #550B40; 
	border-radius: 10px;
	-webkit-border-radius: 10px;/* for Safari and Chrome 対応*/
	-moz-border-radius: 10px;/* for Firefox 対応*/
}
.button:hover {
	color: #fff;
	background: #550B40;
}

/*ブロック要素ごとのリンク*/
.dllink {
	text-decoration: none;
	color: #111;
	font-weight: 300;
	position: absolute;
	width: 100%;
	height: 100%;
	top:0;
	left: 0;
	cursor: pointer;
	text-indent: 100%; /*テキスト非表示*/
	white-space: nowrap; /*テキスト非表示*/
	overflow: hidden; /*テキスト非表示*/
}
.dllink:hover{
	opacity:0.3;
	filter: alpha(opacity=30);
	-ms-filter: "alpha( opacity=30 )";
	background: #fff;
}
/* flexslider用 */
.flex-caption {
  width: 96%;
  padding: 2%;
  left: 0;
  bottom: 0;
  background: rgba(0,0,0,.8);
  color: #fff;
  text-shadow: 0 -1px 0 rgba(0,0,0,.3);
  font-size: 14px;
  line-height: 18px;
}
/* wordpress共通クラス */
/*--------------------------------------------------------------
3.0 Alignments
--------------------------------------------------------------*/

.alignleft {
	display: inline;
	float: left;
	margin-right: .25rem;
	margin-bottom: .25rem;
}

.alignright {
	display: inline;
	float: right;
	margin-left: .25rem;
	margin-bottom: .1rem;
}
.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: .1rem;
}
.wp-caption {
	background-color: #eee;
	border-radius: 10px;
	-webkit-border-radius: 10px;/* for Safari and Chrome 対応*/
	-moz-border-radius: 10px;/* for Firefox 対応*/
	padding-left: .1rem;
	padding-right: .1rem;
}
.wp-caption p {
	text-align: center;
	font-size: .12rem;
	margin-top: 0px;
	margin-bottom: .15rem;
	line-height: .02rem;
}

	@media screen and (max-width:480px) {
		.alignleft,.alignright {
			float: none;
			clear: both;
			display: block;
			margin-left: auto;
			margin-right: auto;
			margin-bottom: .1rem
		}
}