@charset "UTF-8";
*,
*:after,
*:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
	font-variant-ligatures : none;
}
body {
	margin: 0;
	font-family: 'Zen Maru Gothic', 'Lato', '游ゴシック Medium', '游ゴシック体', 'Yu Gothic Medium', YuGothic, 'Noto Sans JP', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	font-weight:400;
	font-size: 16px;
	line-height: 1.0em;
	word-wrap: break-word;
	overflow-wrap: break-word;
/*	background-color: rgba(255,248,244,0.1);*/
}
body::after {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	min-height: 100%;
	background-color:#FFF;  /* 背景カラー #b4d6cc*/
	z-index: 9998;  /* 一番手前に */
	pointer-events: none;  /* 他の要素にアクセス可能にするためにポインターイベントは無効に */
	opacity: 0;  /* 初期値 : 透過状態 */
	-webkit-transition: opacity 1.0s ease;  /* アニメーション時間は 0.8秒 */
	transition: opacity 1.0s ease;
	background-image: url(../img/icon/piano_pagemove.svg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 50px 50px;
}
body.fadeout::after {
	opacity: 1;
}
body::before {
	content: '';
	position: fixed;
	display: block;
	top: calc(50% - 50px);
	left: calc(50% - 50px);
	width: 100px;
	height: 100px;
	z-index: 9999;  /* 一番手前に */
	pointer-events: none;  /* 他の要素にアクセス可能にするためにポインターイベントは無効に */
	opacity: 0;  /* 初期値 : 透過状態 */
	-webkit-transition: opacity 0.8s ease;  /* アニメーション時間は 0.8秒 */
	transition: opacity 0.8s ease;
	border: 5px solid #f3f3f3;
	border-top: 5px solid #b4d6cc;
	border-radius: 50%;
	animation: spin 1.0s ease infinite;
}
@keyframes spin {
	0% { transform: rotate(0deg);}
	/* 25% { transform: rotate(90deg); }
	50% { transform: rotate(180deg); }
	75% { transform: rotate(270deg); } */
	100% { transform: rotate(360deg); }
}
body.fadeout::before {
	opacity: 1;
}
/* IE11だけに適応 */
_:lang(x)::-ms-backdrop, .selector {
	font-family: "Segoe UI", "メイリオ", Meiryo, sans-serif;
}
/* IE11だけに適応 */

a {
    text-decoration: none;
    color: black;
}
h1{
	font-size: 28px;
	line-height: 1.5em;
	font-family: 'EB Garamond', serif;
	font-weight: 500;
	/* font-family: 'Playfair Display', serif; */
}
h2{
	font-size: 20px;
	line-height: 1.5em;
	font-weight: 500;
}
/*p{
	margin: 0;
	padding: 0;
}*/
.fsita{	font-style: italic;}
.fp10{	font-size: 10px;}
.fp12{	font-size: 12px;}
.fp13{	font-size: 13px;}
.fp14{	font-size: 14px;}
.fp15{	font-size: 15px;}
.fp16{	font-size: 16px;}
.fp17{	font-size: 17px;}
.fp18{	font-size: 18px;}
.fp19{	font-size: 19px;}
.fp20{	font-size: 20px;}
.fwnor{	font-weight: normal;}
.fwlig{	font-weight: lighter;}
.fwbol{	font-weight: bold;}
.fwbol500{	font-weight: 500;}
.txt_right{	text-align: right;}
.txt_left{	text-align: left;}
.txt_center{ text-align: center;}
.lihe12{	line-height: 1.2em;}
.lihe14{	line-height: 1.4em;}
.lihe16{	line-height: 1.6em;}
.lihe18{	line-height: 1.8em;}
.lihe20{	line-height: 2.0em;}
.lihe22{	line-height: 2.2em;}
.lihe24{	line-height: 2.4em;}
.lihe26{	line-height: 2.6em;}
.letspa-05{	letter-spacing: -0.5px;}
.letspa-06{	letter-spacing: -0.6px;}
.letspa-07{	letter-spacing: -0.7px;}
.letspa-08{	letter-spacing: -0.8px;}
.letspa-09{	letter-spacing: -0.9px;}
.letspa-1{	letter-spacing: -1.0px;}
.letspa1{	letter-spacing: 1.0px;}
.letspa2{	letter-spacing: 2.0px;}
.letspa3{	letter-spacing: 3.0px;}
.letspa4{	letter-spacing: 4.0px;}
.letspa5{	letter-spacing: 5.0px;}
.mgt0{	margin-top: 0px;}
.mgt5{	margin-top: 5px;}
.mgt10{	margin-top: 10px;}
.mgt15{	margin-top: 15px;}
.mgt20{	margin-top: 20px;}
.mgt25{	margin-top: 25px;}
.mgt30{	margin-top: 30px;}
.mgb0{	margin-bottom: 0px;}
.mgb5{	margin-bottom: 5px;}
.mgb10{	margin-bottom: 10px;}
.mgb15{	margin-bottom: 15px;}
.mgb20{	margin-bottom: 20px;}
.mgb25{	margin-bottom: 25px;}
.mgb30{	margin-bottom: 30px;}
.mgb40{	margin-bottom: 40px;}
.mgb50{	margin-bottom: 50px;}
.pdb5{	padding-bottom: 5px;}
.pdb10{	padding-bottom: 10px;}
.pdb15{	padding-bottom: 15px;}
.pdb20{	padding-bottom: 20px;}
.indent1{
	padding-left: 1em;
	text-indent: -1em;
}
.indent2{
	padding-left: 2em;
	text-indent: -2em;
}
.txgrn{	color: rgba(0,95,115,0.75);}
.txorg{	color: rgba(207,114,34,1.0);}
.txorg_pale{	color: rgba(207,114,34,0.75);}
.txorg_morepale{	color: rgba(207,114,34,0.50);}
.text_narrow { transform: scale(0.8, 1);}

.waku_link{
	margin: 40px 0 40px 0;
	padding: 0 0 0 0;
}
.waku_link p{
	margin: 0;
	padding: 0;
}
.waku_link a{
	color: rgba(25,141,171,1.00);
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
	border: 1px solid rgba(25,141,171,0.60);
	border-radius: 30px;
	padding: 10px 15px;
}
.waku_link a:hover{
	color: rgba(255,255,255,1.00);
	background-color: rgba(25,141,171,1.00);
}
/*----------------------------------------wrapper----------------------------------------*/
.wrapper{
	min-height: 100%;
}
/*----------------------------------------backtotop_btn----------------------------------*/
#page_top{
  width: 90px;
  height: 90px;
  position: fixed;
  right: 0;
  bottom: 0;
  opacity: 0.8;
  z-index: 140;
}
#page_top a{
  position: relative;
  display: block;
  width: 90px;
  height: 90px;
  text-decoration: none;
	-webkit-transition: 0.3s;
	transition: 0.3s;
}
#page_top a:hover{
  opacity: 0.6;
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f102';
  font-size: 25px;
  color: rgba(207,114,34,1.0);
  position: absolute;
  width: 25px;
  height: 25px;
  top: -40px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}
#page_top a::after{
  content: 'Page Top';
  font-size: 13px;
  position: absolute;
  top: 45px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
  color: rgba(207,114,34,1.0);
}
/*----------------------------------------header----------------------------------------*/
header{
	position: fixed;
	top: 0;
	left: 0;
	z-index: 122;
	width: 100%;
	height: 90px;
	background-color: rgba(207,114,34,0.90);
/*	filter:drop-shadow(0px 0.5px 5px #b4b4b5);*/
}
/* transition */
#top-head,
#top-head.is-animation,
#top-head .ams_pc,
#top-head .ams_sptab,
#navigation li,
#nav_toggle
	{
	-webkit-transition: 0.6s ease-out;
	transition: 0.6s ease-out;
}
/*----------------------------------------logo----------------------------------------*/
.header_first{
	margin: 0 auto;
	width: 100%;
	height: 30px;
	text-align: center;
}
.ams_sptab{
	display:none;
}
.ams_pc{
	margin: 15px 0px 15px 0px;
	z-index: 124;
}
.ams_pc img{
	height: 30px;
	width: auto;
}
.ams_pc:hover {
	opacity: 1;
	-webkit-animation: flash 1.5s;
	animation: flash 1.5s;
}
@keyframes flash {
	0% {
		opacity: .4;
	}
	100% {
		opacity: 1;
	}
}
@-webkit-keyframes flash {
	0% {
		opacity: .4;
	}
	100% {
		opacity: 1;
	}
}
/*--------------------------------------header&logo_tabsp-----------------------------------*/
@media screen and (max-width: 960px){
	header{
		height: 50px;
		background-color: rgba(207,114,34,1.00);
		z-index:131;
	}
	.ams_pc{
		display:none;
		}
	.ams_sptab{
		display:inline-block;
		margin:10px 15px 10px 15px;
		z-index:132;
		transition: 0.6s ease-out;
		-webkit-transition: 0.6s ease-out;
	}
	.ams_sptab img{
		height: 30px;
		width: auto;
		transition: 0.6s ease-out;
		-webkit-transition: 0.6s ease-out;
	}
		/*開閉ボタン*/
	#nav_toggle{
		display: block;
		width: 30px;
		height: 20px;
		position: fixed;
		top: 16px;
		right:20px;
		z-index: 135;
	}
}
/*タブレットと差が必要な時に追記する用
@media screen and (max-width: 560px){}
*/
/*iphone4とか用*/
@media screen and (max-width: 370px){
	.ams_sptab{
		margin:15px 15px 10px 5px;
	}
	.ams_sptab img{
		height: 25px;
	}
}
/*--------------------------------------Navigation-----------------------------------*/
.header_second{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}
#nav_toggle{
	display: none;
	}
#navigation {
	text-align:center;
	height:10px;
	width:100%;
	position:relative;
	z-index: 123;
	top:0px;
	left:0px;
}
#navigation ul{
	font-size: 0;
	margin: 15px 0 0 0;
	padding: 0 0 0 0;
}
#navigation li {
	font-size: 15px;
	list-style: none;
	text-align: center;
	padding: 0 0 0 0;
	display: inline-block;
	line-height: 1.0em;
}
#navigation a {
	width: 100%;
	font-family: 'EB Garamond', serif;
	/* font-family: 'Playfair Display', serif; */
	font-weight: 500;
	font-size: 16px;
	color: rgba(255,255,255,1.0);
	letter-spacing: 1.5px;
	position: relative;
	display: inline-block;
	margin: 0px 13.0px 0 13.0px;
	padding: 0;
	outline: none;
	text-decoration: none;
	font-weight: lighter;
	transition: color 0.6s;
}
#navigation a:hover,
#navigation a:focus {
	color: rgba(200,200,200,0.9);
	outline: none;
	cursor: pointer;
}
#navigation a:after {
	content: "";
	display: block;
	background: rgba(255,255,255,0.9);
	width: 0;
	height: 5px;
	margin: 10px auto;
	transition: width 0.4s ease;	
}
#top-head.is-animation #navigation a:after {
	background: rgba(255,255,255,0.9);
}
#navigation a:hover:after {
	width: 100%;
}
/*----------------------------------------more-------------------------------------------*/
.more{
	max-width: 1400px;
	margin: 0 auto;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}
.more p{
	margin: 0;
	padding: 0;
}
.more a {
	display: block;
	width: 240px;
	height: 50px;
	margin-top:20px;
	margin-bottom:20px;
	text-align: center;
	line-height: 50px;
	color: rgba(190,168,121,1.00);
	border: 1px solid rgba(190,168,121,1.00);
	border-radius: 3px;
	background-color: #FFF;
	-webkit-transition: 0.4s;
	transition: 0.4s;
	font-size: 15px;
	letter-spacing: 1.0px;
	font-weight: 500;
}
.more a:hover{
	color: #FFF;
	background-color: rgba(190,168,121,1.00);
}
/*----------------------------------------footer----------------------------------------*/
#footer{
	width: 100%;
	border-top: solid 0px rgba(190,168,121,1.00);
	margin: 0 0 0 0;
	padding: 70px 0 15px 0;
	color: rgba(0,0,0,1.00);
	text-align: left;
	line-height: 1.8em;
	z-index: 120;
	background-image: url(../img/footer_cloud_reverse3.png);
	background-size: contain;
	background-color:rgba(255,255,255,0.5);
	background-blend-mode:lighten;
	font-weight:300;
}
#footer a:hover{
	color: rgba(200,200,200,0.9);
	transition: all 0.1s;
}
.footer_flexcontainer{
	max-width: 1200px;
	margin: 0 auto;
	padding: 0px 30px;
	font-size: 15px;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;	
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: start;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-line-pack: start;
	align-content: flex-start;
}
.footerLine{
	display: none;
}
.foot_icons{
	width: calc(100% / 3);
	margin: 0 0 0 0px;
	padding: 0;
}
.foot_icons p{
	display: inline-block;
	width:  40px;
	margin: 0 10px 0 0;
	padding: 0;
}
.foot_icons p:nth-child(4) {
	margin: 0 30px 0 0;
}
.foot_icons img{
	width: 100%;
}
.foot_icons a:hover{
	opacity: 0.6;
}
.foot_menuall{
	width: calc(100% / 3);
}
.foot_menufirst{
	display: inline-block;
	margin: 0 30px 0 0;
	padding: 0 0 0 0;
	vertical-align: top;
}
.foot_menusecond{
	display: inline-block;
	padding: 0 30px 0 0;
	vertical-align: top;
/*	border-right: solid 1px #b4b4b5;*/
}
.foot_addmai{
	width: calc(100% / 3);
	padding: 0px 0px 0px 0px;
/*	border-right: solid 1px #b4b4b5;*/
}
.foot_addmai p{
	margin: 0 0 0 0;
}
.foot_copy{
	width:100%;
	margin: 50px auto 10px auto;
	padding: 0 0 0 0;
	text-align: center;
	color: #b4b4b5;
/*border-top: 1px solid #b4b4b5;*/
}
.foot_copy p{
	display: inline-block;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	vertical-align:middle;
}
.foot_copy img{
	width: 30px;
	margin: 0;
	padding: 0px 5px 2px 0;
	vertical-align:middle;
}
.tabsp_flogo{
	display: none;
}
.tab_br{
	display:none;
}
.sp_br{
	display:none;
}
@media screen and (max-width: 960px){
	#footer{
		box-shadow: 0 40px 10px -10px #FFFFFF inset;
		padding: 50px 15px 15px 15px;
		font-size:100%;
		background-size: auto;
		background-position: bottom;
	}
	.tabsp_flogo{
		display: inline-block;
	}
	.pc_flogo{
		display: none;
	}
	.pc_br{
		display:none;
	}
	.tab_br{
		display:inline;
	}
	.sp_br{
		display:none;
	}
}
@media screen and (max-width: 560px){
	#footer{
		padding: 50px 15px 25px 15px;
	}
	.footer_flexcontainer{
		max-width:  560px;
		margin: 0 auto;
		padding: 0 0px;
	}
	.foot_icons{
		width: 100%;
	}
	.foot_icons p{
		width: 35px;
		margin: 5px 10px 0 0;
		padding: 0;
	}
	.foot_menuall{
		width: 100%;
		margin: 15px 0 0 0;
	}
	.foot_addmai{
		width: 100%;
		margin: 20px 0 10px 0;
	}
	/* .foot_addmai p{
	} */
	.foot_copy{
		text-align: left;
		padding: 0 0 0 0;
		margin: 10px 0 0 0;
	}
	.foot_copy p{
		display: inline-block;
		margin: 0 0 0 0;
		padding: 0 0 0 0;
		vertical-align:middle;
	}
	.foot_copy img{
		width: 40px;
		padding: 0 0 0 0;
		text-align: left;
	}
	.tab_br{
		display:none;
	}
	.sp_br{
		display:inline;
	}
}