@charset "utf-8";
/*-------- 全ページのスタイルcss --------*/

body{
	padding:0; margin:0;
	font-family: メイリオ, Meiryo,"Hiragino Kaku Gothic ProN","ヒラギノ角ゴ ProN W3","ＭＳ Ｐゴシック","MS PGothic","MS UI Gothic", Helvetica, Arial, sans-serif;
	font-size:17px;	line-height:1.8em;
}

/*----------------------------------------------------------------------
 コンテンツ 表示アニメーション
----------------------------------------------------------------------*/
.zoomin {  animation: zoomIn 0.8s cubic-bezier(0.25, 1, 0.5, 1) 1 forwards;}
@keyframes zoomIn {
  0% {    transform: scale(0.8);    opacity: 0;}
  100% {    opacity: 1;    transform: scale(1);}
}


/*----------------------------------------------------------------------
 ページトップへ
----------------------------------------------------------------------*/
/*リンクを右下に固定*/
#page-top {	display:none;}
/*　上に上がる動き　*/
#page-top.UpMove{	animation: UpAnime 0.5s forwards;}
@keyframes UpAnime{
  from {	opacity: 0;	transform: translateY(150px);}
  to {	opacity: 1;	transform: translateY(0);}
}
/*　下に下がる動き　*/
#page-top.DownMove{	animation: DownAnime 0.5s forwards;}
@keyframes DownAnime{
  from {	opacity: 1;	transform: translateY(0);}
  to {	opacity: 1;	transform: translateY(150px);}
}

/*----------------------------------------------------------------------
 スマホのみ隠す
----------------------------------------------------------------------*/
@media print, screen and (max-width: 640px) {
.spNone{ display:none;}
}


/* タブレットレイアウト : 768 px～。モバイルレイアウトからスタイルを継承。 */
@media print, screen and (min-width: 768px) {

body{
  width: 100%;
  min-width:1000px;
}

/*----------------------------------------------------------------------
 ページトップへ
----------------------------------------------------------------------*/
/*リンクを右下に固定*/
#page-top {
	display:block;
	margin:2%;
	position: fixed;
	right: 10px;
	bottom:10px;
	z-index: 2;
	opacity: 0;/*はじめは非表示*/
	transform: translateY(150px);
}
/*リンクの形状*/
#page-top a img{
	opacity:1;
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
	#page-top a:hover img{
		opacity:0.6;
	}

/*----------------------------------------------------------------------
 画像リンク
----------------------------------------------------------------------*/
a.opacity img{
	opacity:1;
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
	a:hover.opacity img{
		opacity:0.6;
	}

/* 背景色あり */
a.opacity2 {	background:#FF9; display:inline-block;}
a.opacity2 img {
	opacity: 1;
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
	a.opacity2 img:hover{opacity:0.6;}

/*画像拡大*/
a.largeImg{	display:block;	width:640px;}
a.largeImg img{
	opacity:1;
	-webkit-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	transform: scale(1);
}
	a:hover.largeImg img{
		opacity:0.6;
		transform: scale(1.2);/*拡大アニメーション*/
	}
	.mask{
		display: block;
		line-height: 0;
		overflow: hidden;/*拡大してはみ出る要素を隠す*/
	}

/*----------------------------------------------------------------------
 PCのみ隠す
----------------------------------------------------------------------*/
.pcNone{ display:none;}

}