@charset "UTF-8";

/*  */

.aka{
	background-color:	red;
}


.warappr{
	max-width:	800px;
	margin-right: 	auto;
	margin-left : 	auto;
	padding:	0;
	margin-top:	0;
	text-align:	center;
}

body {
	font-family: "Arial", "メイリオ", sans-serif;
	background-color: #f5f5dc;			/*--　全体背景色　---*/
	margin:		0;
}

.pc-n{
	display:	none;
}

h1{
	text-align:	center;
	margin:		3rem 0 0rem 0;
}

p{
	display: inline-block;
	text-align: left;
	max-width:	800px;
	color:		#583822;
}

	.setumei-dai{
		font-size:	0.9rem;
		margin-top:	0.3rem;
	}

	/*--　文字　色変更　---*/

.iro{
	color:			#993300;
	text-decoration:	none;
}



/*--◆◆-----------------------------　ヘッダー	------------------------------*/

.header{
	text-align:	center;
}

.header img{
	width:		100%;				/* ロゴ　max-widthの前に　width:	100%; をつける　*/
	max-width:	px;
	margin-top:	0rem;
}

.tenji-list{
	margin:		0 1rem 2rem 1rem;
}

	/*--　タイトル文字　設定　---*/


.tyuui{
	font-size:	0.8rem;
}

.daiji{
	margin-bottom:	2rem;
}

.daiji-1 img{
	width:		100%;
	max-width:	950px;
	margin-top:	0rem;
	margin-bottom:	rem;
}

.moji-1 img{
	width:		100%;
	max-width:	950px;
	margin-top:	0rem;
	margin-bottom:	rem;
}


	/*--　くま　---*/

.ugoki-1{
	position:	relative;
	margin:0 auto;
	max-width:	4rem;
	height:	10rem;
}

.ugoki1{
	max-width:	4rem;
	position:	absolute;
}

.ugoki2{
	max-width:	4rem;
	position:	absolute;
}

.ugoki3{
	max-width:	4rem;
	position:	absolute;
}

.ugok4{
	max-width:	4rem;
	position:	absolute;
}


.ugoki1{
	animation: kuma1 3s linear infinite;		/*--　名前　秒　一定の速度で始まって終わる　繰り返し　　---*/
}

@keyframes kuma1 {
	0% {
		opacity: 1 ;
	}
	20% {
		opacity: 1 ;
	}	
	21% {
		opacity: 0 ;
	}
	60% {
		opacity: 0 ;
	}
	61% {
		opacity: 1 ;
	}
	80% {
		opacity: 1 ;
	}
	81% {
		opacity: 0 ;
	}
	100% {
		opacity: 0 ;
	}
}

.ugoki2{
	animation: kuma2 3s linear infinite;		/*--　名前　秒　一定の速度で始まって終わる　繰り返し　　---*/
}

@keyframes kuma2 {
	0% {
		opacity: 0 ;
	}
	20% {
		opacity: 0 ;
	}	
	21% {
		opacity: 1 ;
	}
	40% {
		opacity: 1 ;
	}
	41% {
		opacity: 0 ;
	}
	100% {
		opacity: 0 ;
	}
}

.ugoki3{
	animation: kuma3 3s linear infinite;		/*--　名前　秒　一定の速度で始まって終わる　繰り返し　　---*/
}

@keyframes kuma3 {
	0% {
		opacity: 0 ;
	}
	40% {
		opacity: 0 ;
	}	
	41% {
		opacity: 1 ;
	}
	60% {
		opacity: 1 ;
	}
	61% {
		opacity: 0 ;
	}
	100% {
		opacity: 0 ;
	}
}

.ugoku4{
	animation: kuma4 3s linear infinite;		/*--　名前　秒　一定の速度で始まって終わる　繰り返し　　---*/
}

@keyframes kuma4 {
	0% {
		opacity: 0 ;
	}
	80% {
		opacity: 0 ;
	}
	81% {
		opacity: 1 ;
	}
	100% {
		opacity: 1 ;
	}
}



	/*--　展示写真　設定　---*/

.tenji-syasin img{
	max-width:	20rem;
	margin-top:	0;
}

	/*--　展示文章　設定　---*/

.setumei{
	margin:	2rem 1rem 0 1rem;
}

	/*--　本棚　設定　---*/

.tana-0{	
	margin-bottom:	5rem;
}

.tana{
	border: 	 1rem solid #8b4513;
	background-color:	#deb887;
	width:		25rem;
	margin:0 auto;
}

.syo{
	height:		7rem;
	margin:		1rem 0 0 0;
}

table img{
	height:		7rem;
}

.day{					/* 日付の設定　 */
	font-size:	0.8rem;
	color:		#808080;
}


/*--◆◆-----------------------------　フッター	------------------------------*/


footer{
	position:	fixed;
	width:		100%;
	background-color:	#0070c0;
	bottom:	0;	
}

.hp{
	text-align:	right;		/* トップページのリンク　 */
	margin-top:	1rem;
	margin-bottom:	0rem;
	margin-right:	1rem;
}

.hp a{
	color:		#f5deb3;
}



/*--◆◆-----------------------------　各展示　バックグラウンドカラー　	------------------------------*/

#tenji-247{
background-image: url(../images/247-bg.jpg);
    background-repeat: repeat;
    background-size: auto;
}

#tenji-244{
background-image: url(../images/244-bg.jpg);
    background-repeat: repeat;
    background-size: auto;
}


#tenji-243{
background-image: url(../images/243-bg.jpg);
    background-repeat: repeat;
    background-size: auto;
}

.p-tenji-243, .p-tenji-244{
	color:			white;
}

#tenji-237, #tenji-246{
	background-color:	white;
}

#tenji-229{
	background-color:	black;
}

.p-tenji-229{
	color:		white;
	margin:		1rem;
}

.229-haikei{
	height: px;
	background-image:url("../images/229-haikei.jpg");
}

.daiji-sita img{
	width:		100%;
	max-width:	950px;
}

.honlist{
	height:		10rem;
}

#tenji-234{
	background-color:	#fff1ce;
}

/*-- ハロウィン　--*/

#tenji-231{
	background-color:	#8b638b;
}

.p-tenji-231 img{
	width:		2rem;

}

.p-tenji-231{
	color:		white;
	margin:		1rem;
}

.img231-s2 img{
	position:	absolute;
	width:		100%;
	max-width:		5rem;
	right:10rem;
	bottom:20rem;
}

.sikake-1{
	max-width:	950px;
	position:	relative;

}

.sikake-1 img{
	width:		100%;
	max-width:	950px;
	margin-top:	0rem;
}

.sikake1{
	width:5rem;
	position:	absolute;
	right:6rem;
}



.sikake1{
	animation: sikake 5s linear infinite;		/*--　名前　秒　一定の速度で始まって終わる　繰り返し　　---*/
}

@keyframes sikake {
	0% {
		transform: translateY(0);
	}
	5%{
		transform: translateY(0);
	}
	10%{
		transform: translateY(0);
	}
	20%{
		transform: translateY(-10px);
	}
	25%{
		transform: translateY(0);
	}
	30%{
		transform: translateY(-10px);
	}
	35%{
		transform: translateY(0);
	}
	40%{
		opacity: 1 ;
	}
	70% {
		opacity: 0 ;
	}
	100% {
		opacity: 1 ;
	}
}

.sikake-2{
	max-width:	950px;
	position:	relative;

}

.sikake-2 img{
	width:		100%;
	max-width:	950px;
	margin-top:	0rem;
}

.sikake2{
	width:5rem;
	position:	absolute;
	right:6rem;
}



.sikake2{
	animation: sikake2 5s linear infinite;		/*--　名前　秒　一定の速度で始まって終わる　繰り返し　　---*/
}

@keyframes sikake2 {
	0% {
		opacity: 1 ;
	}
	50% {
		opacity: 0 ;
	}
	100% {
		opacity: 1 ;
	}
}



.takasa-5{
	height:		5rem;
}

/**********************	********************************	768	************/

@media(max-width: 768px){

.sikake1{
	right:15rem;
}

.sikake2{
	left:15rem;
}

	.warappr{
		max-width:	768px;
		margin:		0;	
		padding:	0;
	}

	main{
		margin:		0;
	}

	.header img{
		max-width:	768px;
	}

	h3{
		line-height:	1.5rem;
	}

	.tenji-syasin img{
		margin-top:	0;
		max-width:	20rem;
	}



}	/* 消しちゃダメ　 */


/******************************************************		415	************/


@media(max-width: 415px){

/*--◆◆-----------------------------　　共通設定	------------------------------*/

	.warappr{
		max-width:	415px;
		width:		100%;
		margin:		0;	
		padding:	0;
	}

	.moji-1{
		width:	100%;
		max-width:	410px;
		margin-top:	1rem;
	}

	.sumaho-n{
		display:	none;
	}

	.setumei{					/*　全体説明　PC用　非表示 */
		margin-top:	0.5rem;
	}

	p{
		font-size:	0.8rem;
		text-align:	left;
		line-height:	1.1rem;		
	}

	h1{
		font-size:	1.2rem;
		margin:		1rem 0 0 0;
	}

	h3{
		line-height:	1.3rem;
		font-size:	1rem;
	}

	.header img{
		max-width:	415px;
	}

	.tenji-syasin img{
		margin-top:	0;
		max-width:	10rem;
	}

	.tenji-syasin1{
		margin-top:	0.5rem;
	}

	.setumei-dai{
		font-size:	0.9rem;
		margin-top:	0.3rem;
	}

	.tyuui{
		font-size:	0.6rem;
	}


	.hp{
		font-size:	0.7rem;
	}

	footer{
		height:		3.5rem;
	}

/*--◆◆-----------------------------　今回のみ	------------------------------*/




	.tana{
		border: 	 0.5rem solid #8b4513;
		width:		17rem;
		margin:0 auto;
	}

	.tana-0{	
		margin-bottom:	4rem;
	}


	.syo{
		height:		5rem;
		margin:		0.5rem 0 0 0;
	}

	.ugoki1{
		max-width:	3rem;
	}

	.ugoki2{
		max-width:	3rem;
	}

	.ugoki3{
		max-width:	3rem;
	}

	.ugok4{
		max-width:	3rem;
	}


	.ugoki-1{
		max-width:	3rem;
		height:	8rem;
	}



}	/* 消しちゃダメ　 */