@charset "utf-8";

@import url("header.css");
@import url("nav.css");
@import url("footer.css");
/*body *{ border:0.02px solid #000000; background:rgba(000,000,000,0.1)}
*/


html,
body { width:100%; overflow-x: hidden; }
body { height:auto; background:#fff; }


/* フォントの指定 */
html { font-size: 62.5%; }
body,input,select,textarea { 
	font-size:16px; font-size:1.6rem; 
	line-height:1.8; 
	letter-spacing:0.05em;
	font-family: "Helvetica Neue", "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic","ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
	font-feature-settings: "palt";
	color:#231815; }
	
a {color:#231815; text-decoration: none;}
p {text-align:justify; text-justify:inter-ideograph; font-size: 14px; font-size: 1.4rem; letter-spacing: 2px; }
p a {color:#231815; text-decoration: underline;}
img {width: 100%;}
/* セレクト時の色指定 */
::selection {
    background: #D0D9E1;
}
::-moz-selection {
    background: ##D0D9E1; /*Firefox*/
} 

.inner { width: 94%; margin: 0 auto;}
.mw100 { max-width: 100%;}
.showPc { }
.showSp { display: none;}
.imgTxt { position:relative;}
.imgTxt p { overflow: hidden;position:absolute; top: 0; left: 0; width: 100%; height: 100%; text-indent:-100vw; font-size: 10px!important; }
@media screen and (max-width:768px){
	html { font-size: 50%; }
	.showPc { display: none ; }
	.showSp { display: block ; }
}



/* --------------------------------------------
						見出し
---------------------------------------------- */ 
.contentTitle { font-size: 25px; font-size: 2.5rem; text-align: center; display: block; position: relative; margin: 2em auto 4em; padding-top: 3em;}
.contentTitle span { font-size: 14px; font-size: 1.4rem; margin-top: .3em; display: block; }
.contentTitle::before { display: block; content: ""; width: 18px; height: 1.5em; margin: 0 auto -.25em; background: url(../img/share/h2icon.png)no-repeat; background-size: contain; top: 0;}


/* --------------------------------------------
						フォント
---------------------------------------------- */ 

.RyuminPr6NL-KL {
	font-family: a-otf-ryumin-pr6n, serif;
	font-weight: 300;
	font-style: normal;
	letter-spacing: 3px;
	}

/* --------------------------------------------
						ボタン
---------------------------------------------- */ 

/* ノーマルボタン */
.btn { display: block; padding: 1em 0; max-width: 300px; width: 85%; margin: 5em auto 0; border: solid 1px; text-align: center; transition: .4s; color: #000; background: #fff;}
.btn:hover { transition: .4s; color: #fff; background: #000; }

/* div サブミット */
.submitbtn { max-width: 300px; margin: 0 auto; }
.submitbtn .btn { width: 100%; }

/* トップへ戻る */
.topScrbtn { width: 16px; position: fixed; bottom: 2em; right: 2%;  z-index: 100; }




.bluegrayback{
	background: #d8dfe7; 
	background: -moz-linear-gradient(-45deg, #d8dfe7 0%, #f8f8f9 100%);
	background: -webkit-linear-gradient(-45deg, #d8dfe7 0%,#f8f8f9 100%);
	background: linear-gradient(135deg, #d8dfe7 0%,#f8f8f9 100%); 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d8dfe7', endColorstr='#f8f8f9',GradientType=1 );
}




/* --------------------------------------------
						フェードインアニメーション
---------------------------------------------- */

/* anime animeFadeInBottomTop" */
.anime,
.animest{
	opacity: 0;
}

.animest.animeFadeInBottomTop{
	animation-name: fadeInBottomTop;
  animation-delay: 0.0s;
  animation-duration: 1.5s;
  animation-fill-mode: forwards;
}

.animest.animeFadeInBottomTop,
.animest .animeFadeInBottomTop{
	animation-name: fadeInBottomTop;
  animation-delay: 0.0s;
  animation-duration: 1.2s;
  animation-fill-mode: forwards;
}

.animest.animeFadeIn {
	animation-name: fadeIn;
  animation-delay: 0.0s;
  animation-duration: 1.2s;
  animation-fill-mode: forwards;
} 

@keyframes fadeInBottomTop {
  0% {
    opacity: 0;
    transform: translateY(20px) translateX(0);
 }
  100% {
    opacity: 1;
    transform: translateY(0) translateX(0);
  }
}
@keyframes fadeInTopBottom {
  0% {
    opacity: 0;
    transform: translateY(-20px) translateX(0);
 }
  100% {
    opacity: 1;
    transform: translateY(0) translateX(0);
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
 }
  100% {
    opacity: 1;
  }
}


@keyframes fadeOut {
  0% {
    opacity: 1;
 }
  100% {
		visibility: hidden;
    opacity: 0;
  }
}









