@charset "UTF-8";
/* CSS Document */



/* FONT size
---------------------------------------------------------------------
[ px ]	[ % ]
10px 	72  %		19px 	136 %
11px 	79  %		20px 	143 %
12px 	86 %		21px 	150 %
13px 	93 %		22px 	158 %
14px 	100 %		23px 	165 %
15px 	108 %		24px 	172 %
16px 	115 %		25px 	179 %
17px 	122 %		26px 	186 %
18px 	129 %
---------------------------------------------------------------------*/






/* min 801px */
@media screen and (min-width: 801px), print {






/* mainimages
--------------------- */
#mainimages {
	width: 100%;
	min-width: 1000px;
	height: 100vh;
	position: relative;
	overflow: hidden;
}
	#mainimages ul li {
		position: relative;
		overflow: hidden;
		width: 100%;
		height: 100vh;
		text-align: center;
	}
	
	
	#mainimages h2 {
		font-family: 'Oswald', sans-serif;
		font-size: 66px;
		font-weight: 900;
		line-height: 114px;
		letter-spacing: 10px;
		color: #ca5c4d;
		position: absolute;
		top: 20%;
		left: 10%;
		z-index: 3;
	}
	
	
	#mainimages .news {
		width: 1000px;
		height: 60px;
		background: rgba(255,255,255,0.9);
		position: absolute;
		bottom: 40px;
		left: 50%;
		margin-left: -500px;
		z-index: 3;
		display: flex;
		display: -webkit-flex;
		justify-content: space-between;
	}
		#mainimages .news .head {
			width: 65px;
			float: left;
			font-family: 'Oswald', sans-serif;
			font-weight: 900;
			line-height: 60px;
			color: #ca5c4d;
			padding-left: 30px;
		}
	
		#mainimages .news .text {
			width: 905px;
		}
			#mainimages .news .text a {
				width: 905px;
				display: flex;
				display: -webkit-flex;
				justify-content: space-between;
				color: #2b2b2b;
				line-height: 60px;
				background: url(../common/img/icon_arrow_red.png) no-repeat 98% center;
				transition: 0.3s;
				-webkit−transition: 0.3s;
			}
			#mainimages .news .text a:hover {
				color: #ca5c4d;
			}
				#mainimages .news .text a .days {
					font-family: 'Oswald', sans-serif;
					font-size: 86%;
					font-weight: 500;
				}
				#mainimages .news .text a .cat {
				}
					#mainimages .news .text a .cat span {
						font-size: 86%;
						border: solid 1px #2b2b2b;
						line-height: 1;
						padding: 5px;
						color: #2b2b2b;
						transition: 0.3s;
						-webkit−transition: 0.3s;
					}
					#mainimages .news .text a:hover .cat span {
						border: solid 1px #ca5c4d;
						color: #ca5c4d;
					}
				#mainimages .news .text a p {
					width: 730px;
					font-size: 86%;
				}
	
	




/* about
--------------------- */
#about {
	width: 100%;
	min-width: 1000px;
	padding-bottom: 100px;
	background: #fff;
}
	#about .textbox {
		display: flex;	
		display: -webkit-flex;
		justify-content: space-between;
		padding: 100px 0;
	}
		#about .textbox .tit {
			width: 600px;
		}
			#about .textbox .tit .oswald {
				font-size: 129%;
				font-weight: 700;
				color: #ca5c4d;
				margin-bottom: 30px;
			}
			#about .textbox .tit h2 {
				font-size: 32px;
				font-weight: 700;
				line-height: 50px;
			}

		#about .textbox p {
			font-size: 108%;
			line-height: 36px;
			padding-top: 68px;
		}



	#about .phtbox {
		display: flex;	
		display: -webkit-flex;
		justify-content: space-between;
	}
		#about .phtbox dl {
			width: 244px;
			text-align: center;
		}
			#about .phtbox dl dt {
				margin-bottom: 10px;
			}
	
			#about .phtbox dl dd p {
				font-size: 129%;
				font-weight: 500;
				line-height: 1.4em;
				color: #ca5c4d;
			}
			#about .phtbox dl dd span {
				font-family: 'Oswald', sans-serif;
				font-size: 79%;
				color: #26323f;
			}
	
	



/* contents_index
--------------------- */
#contents_index {
	width: 100%;
	min-width: 1000px;
}
	#contents_index ul {
		display: flex;
		-webkit-box-align: stretch;
		-ms-flex-align: stretch;
		align-items: stretch;
		flex-wrap: wrap;
	}
		#contents_index ul li {
			width: 25%;
			background: #ca5c4d;
			height: calc( 100vw / 4);
			text-align: center;
		}
			#contents_index ul li a {
				display: block;
				height: 100%;
				position: relative;
				color: #fff;
				transition: 0.3s;
				-webkit−transition: 0.3s;
			}
			#contents_index ul li:nth-child(2) a {
				background: url(../img/contents_pht19.jpg) no-repeat center;
				background-size: cover;
			}
			#contents_index ul li:nth-child(4) a {
				background: url(../img/contents_pht04.jpg) no-repeat center;
				background-size: cover;
			}
			#contents_index ul li:nth-child(5) a {
				background: url(../img/contents_pht08.jpg) no-repeat center;
				background-size: cover;
			}
			#contents_index ul li:nth-child(7) a {
				background: url(../img/contents_pht12.jpg) no-repeat center;
				background-size: cover;
			}
			#contents_index ul li:nth-child(10) a {
				background: url(../img/contents_pht10.jpg) no-repeat center;
				background-size: cover;
			}
			#contents_index ul li:nth-child(12) a {
				background: url(../img/contents_pht12.jpg) no-repeat center;
				background-size: cover;
			}
			#contents_index ul li a:hover {
				background: #e5afa8;
			}
				#contents_index ul li a .box {
					width: 80%;
					height: 63px;
					background: #e5afa8;
					padding-top: 20px;
					transition: 0.3s;
					-webkit−transition: 0.3s;
					position: absolute;
					top: 80%;
					left: 50%;
					transform: translateY(-50%) translateX(-50%);
					-webkit- transform: translateY(-50%) translateX(-50%);
				}
				#contents_index ul li:nth-child(1) a .box,
				#contents_index ul li:nth-child(3) a .box,
				#contents_index ul li:nth-child(6) a .box,
				#contents_index ul li:nth-child(8) a .box,
				#contents_index ul li:nth-child(9) a .box,
				#contents_index ul li:nth-child(11) a .box {
					width: 80%;
					height: 63px;
					background: #ca5c4d url(../img/border.png) no-repeat center top;
					padding-top: 20px;
					position: absolute;
					top: 50%;
					left: 50%;
					transform: translateY(-50%) translateX(-50%);
					-webkit- transform: translateY(-50%) translateX(-50%);
				}
				#contents_index ul li a:hover .box {
					background: #e5afa8;
				}
					#contents_index ul li a .box h3 {
						font-size: 122%;
						font-weight: 700;
						line-height: 1.5em;
					}
					#contents_index ul li a .box p {
						font-size: 72%;
						font-weight: 700;
						letter-spacing: 2px;
					}
	
	




/* movie
--------------------- */
#movie {
	width: 100%;
	min-width: 1000px;
	border-top: solid 1px #ffffff;
	background: url(../img/movie_pht.jpg) no-repeat center;
	background-size: cover;
}
#movie .dot {
	background: url(../img/dot_bg.png);
}
	#movie .title {
		padding: 100px 0 100px 0;
		text-align: center;
	}
		#movie .title h2 {
			font-family: 'Oswald', sans-serif;
			font-size: 60px;
			font-weight: 700;
			color: #fff;
			letter-spacing: 7px;
			line-height: 1;
			margin-bottom: 20px;
		}
	
		#movie .title p {
			font-weight: 700;
			color: #fff;
			line-height: 1;
			letter-spacing: 2px;
			margin-bottom: 70px;
		}
	
		#movie .title .btn {
			width: 500px;
			margin: 0 auto;
		}
			#movie .title .btn a {
				display: block;
				height: 60px;
				background: #ca5c4d url(../common/img/icon_arrow_white.png) no-repeat 8% center;
				font-family: 'Oswald', sans-serif;
				font-size: 93%;
				font-weight: 700;
				letter-spacing: 3px;
				color: #fff;
				text-align: center;
				line-height: 60px;
				transition: 0.3s;
				-webkit−transition: 0.3s;
			}
			#movie .title .btn a:hover {
				background: #d3786c url(../common/img/icon_arrow_white.png) no-repeat 10% center;
			}

	




/* news
--------------------- */
#news {
	width: 100%;
	min-width: 1000px;
	background: #fff;
}
	
	#news .bg {
		display: none;
		width: 100%;
		min-width: 1000px;
		height: 450px;
		background: url(../img/news_bg.jpg) no-repeat center;
		background-size: cover;
	}
	#news .inner {
		display: flex;	
		display: -webkit-flex;
		justify-content: space-between;
	}
	
	
	#news .title {
		width: 260px;
		padding: 100px 0 200px 0;
	}
		#news .title h2 {
			font-family: 'Oswald', sans-serif;
			font-size: 60px;
			font-weight: 700;
			color: #ca5c4d;
			letter-spacing: 7px;
			line-height: 1;
			margin-bottom: 20px;
		}
	
		#news .title p {
			font-weight: 700;
			color: #ca5c4d;
			line-height: 1;
			letter-spacing: 2px;
			margin-bottom: 70px;
		}
	
		#news .title .btn {
			width: 260px;
		}
			#news .title .btn a {
				display: block;
				height: 60px;
				background: #ca5c4d url(../common/img/icon_arrow_white.png) no-repeat 8% center;
				font-family: 'Oswald', sans-serif;
				font-size: 93%;
				font-weight: 700;
				letter-spacing: 3px;
				color: #fff;
				text-align: center;
				line-height: 60px;
				transition: 0.3s;
				-webkit−transition: 0.3s;
			}
			#news .title .btn a:hover {
				background: #d3786c url(../common/img/icon_arrow_white.png) no-repeat 10% center;
			}
	
	
	#news .box {
		width: 680px;
		position: absolute;
		top: -50px;
		right: 0;
	}
		#news .box .text {
			margin-bottom: 10px;
		}
			#news .box .text a {
				display: block;
				background: #f9eeed url(../common/img/icon_arrow_red.png) no-repeat 96.5% center;
				color: #2b2b2b;
				padding: 20px;
				transition: 0.3s;
				-webkit−transition: 0.3s;
			}
			#news .box .text a:hover {
				color: #ca5c4d;
				background: #f9eeed url(../common/img/icon_arrow_red.png) no-repeat 97.5% center;
			}
				#news .box .text a .days {
					float: left;
					font-family: 'Oswald', sans-serif;
					font-size: 86%;
					font-weight: 500;
				}
	
				#news .box .text a .cat {
					float: left;
					padding-left: 15px;
					margin-top: -3px;
				}
					#news .box .text a .cat span {
						font-size: 86%;
						border: solid 1px #2b2b2b;
						line-height: 1;
						padding: 2px 8px;
						color: #2b2b2b;
						transition: 0.3s;
						-webkit−transition: 0.3s;
					}
					#news .box .text a:hover .cat span {
						border: solid 1px #ca5c4d;
						color: #ca5c4d;
					}
	
				#news .box .text a p {
					clear: both;
					padding-top: 5px;
				}




}






/* max 800px */
@media only screen and (max-width: 800px) {






/* mainimages
--------------------- */
#mainimages {
	width: 100%;
	height: 100vh;
	position: relative;
	overflow: hidden;
}
	#mainimages ul li {
		position: relative;
		overflow: hidden;
		width: 100%;
		height: 100vh;
		text-align: center;
	}
	
	
	#mainimages h2 {
		font-family: 'Oswald', sans-serif;
		font-size: 172%;
		font-weight: 900;
		line-height: 2em;
		letter-spacing: 5px;
		color: #ca5c4d;
		position: absolute;
		top: 20%;
		left: 10%;
		z-index: 3;
	}
	
	
	#mainimages .news {
		display: none;
	}
	
	




/* about
--------------------- */
#about {
	width: 100%;
	padding: 40px 0;
}
	#about .textbox {
	}
		#about .textbox .tit {
			margin-bottom: 20px;
		}
			#about .textbox .tit .oswald {
				font-size: 115%;
				font-weight: 700;
				color: #ca5c4d;
				margin-bottom: 1;
				margin-bottom: 8px;
			}
			#about .textbox .tit h2 {
				font-size: 143%;
				font-weight: 700;
				letter-spacing: 3px;
				line-height: 1.5em;
			}

		#about .textbox p {
			font-size: 93%;
		}



	#about .phtbox {
	}
	* html #about .phtbox {
		zoom: 100%;
	}
	*:first-child+html #about .phtbox {
		display: inline-block;
	}
	#about .phtbox:after {
		content: "."; 
		clear: both; 
		height: 0; 
		display: block; 
		visibility: hidden;
	}
		#about .phtbox dl {
			width: 50%;
			float: left;
			text-align: center;
			padding-top: 20px;
		}
			#about .phtbox dl dt {
				margin-bottom: 10px;
			}
				#about .phtbox dl dt img {
					width: 100%;
					height: auto;
				}
	
			#about .phtbox dl dd p {
				font-size: 108%;
				font-weight: 500;
				line-height: 1em;
				color: #ca5c4d;
			}
			#about .phtbox dl dd span {
				font-family: 'Oswald', sans-serif;
				font-size: 72%;
				color: #26323f;
			}
	
	




/* contents_index
--------------------- */
#contents_index {
	width: 100%;
}
	#contents_index ul {
		display: flex;
		-webkit-box-align: stretch;
		-ms-flex-align: stretch;
		align-items: stretch;
		flex-wrap: wrap;
	}
		#contents_index ul li {
			width: 50%;
			background: #ca5c4d;
			height: calc( 100vw / 2);
			text-align: center;
		}
			#contents_index ul li a {
				display: block;
				height: 100%;
				position: relative;
				color: #ca5c4d;
				transition: 0.3s;
				-webkit−transition: 0.3s;
			}
			#contents_index ul li:nth-child(2) a,
			#contents_index ul li:nth-child(3) a,
			#contents_index ul li:nth-child(6) a,
			#contents_index ul li:nth-child(7) a,
			#contents_index ul li:nth-child(10) a,
			#contents_index ul li:nth-child(11) a {
				background: #f9eeed;
			}
				#contents_index ul li a .box {
					width: 80%;
					position: absolute;
					top: 50%;
					left: 50%;
					transform: translateY(-50%) translateX(-50%);
					-webkit- transform: translateY(-50%) translateX(-50%);
				}
				#contents_index ul li:nth-child(1) a .box,
				#contents_index ul li:nth-child(4) a .box,
				#contents_index ul li:nth-child(5) a .box,
				#contents_index ul li:nth-child(8) a .box,
				#contents_index ul li:nth-child(9) a .box,
				#contents_index ul li:nth-child(12) a .box {
					width: 80%;
					color: #fff;
					position: absolute;
					top: 50%;
					left: 50%;
					transform: translateY(-50%) translateX(-50%);
					-webkit- transform: translateY(-50%) translateX(-50%);
				}
				#contents_index ul li a:hover .box {
					background: #e5afa8;
				}
					#contents_index ul li a .box h3 {
						font-size: 93%;
						font-weight: 700;
						line-height: 1.5em;
					}
					#contents_index ul li a .box p {
						font-size: 72%;
						font-weight: 700;
						letter-spacing: 2px;
					}






/* movie
--------------------- */
#movie {
	width: 100%;
	border-top: solid 1px #ffffff;
	background: url(../img/movie_pht.jpg) no-repeat center;
	background-size: cover;
}
#movie .dot {
	background: url(../img/dot_bg.png);
	padding: 60px 0;
}

	
	#movie #youtube-movie {
		display: none;
	}
	
	#movie .title {
		padding: 30px 0 0 0;
		text-align: center;
	}
		#movie .title h2 {
			font-family: 'Oswald', sans-serif;
			font-size: 200%;
			font-weight: 700;
			color: #fff;
			letter-spacing: 5px;
			line-height: 1;
			margin-bottom: 10px;
		}
	
		#movie .title p {
			font-size: 86%;
			font-weight: 700;
			color: #fff;
			line-height: 1;
			letter-spacing: 2px;
			margin-bottom: 60px;
		}
	
		#movie .btn {
			width: 100%;
			max-width: 400px;
			margin: auto;
		}
			#movie .btn a {
				display: block;
				height: 50px;
				background: #ca5c4d url(../common/img/icon_arrow_white.png) no-repeat 5% center;
				font-family: 'Oswald', sans-serif;
				font-size: 86%;
				font-weight: 700;
				letter-spacing: 3px;
				color: #fff;
				text-align: center;
				line-height: 50px;
			}




/* news
--------------------- */
#news {
	width: 100%;
	padding-bottom: 40px;
}
	#news .bg {
		display: none;
		width: 100%;
		height: 150px;
		background: url(../img/news_bg.jpg) no-repeat center;
		background-size: cover;
	}
	
	
	#news .title {
		padding: 30px 0 30px 0;
	}
		#news .title h2 {
			font-family: 'Oswald', sans-serif;
			font-size: 200%;
			font-weight: 700;
			color: #ca5c4d;
			letter-spacing: 5px;
			line-height: 1;
			margin-bottom: 10px;
		}
	
		#news .title p {
			font-size: 86%;
			font-weight: 700;
			color: #ca5c4d;
			line-height: 1;
			letter-spacing: 2px;
		}
	
		#news .title .btn {
			display: none;
		}
	
	
	#news .box {
		margin-bottom: 30px;
	}
		#news .box .text {
			margin-bottom: 10px;
		}
			#news .box .text a {
				display: block;
				background: #f9eeed url(../common/img/icon_arrow_red.png) no-repeat 95% 20px;
				color: #2b2b2b;
				padding: 20px;
			}
				#news .box .text a .days {
					float: left;
					font-family: 'Oswald', sans-serif;
					font-size: 79%;
					font-weight: 500;
				}
	
				#news .box .text a .cat {
					float: left;
					padding-left: 15px;
					margin-top: -3px;
				}
					#news .box .text a .cat span {
						font-size: 72%;
						border: solid 1px #2b2b2b;
						line-height: 1;
						padding: 1px 8px;
						color: #2b2b2b;
					}
	
				#news .box .text a p {
					clear: both;
					font-size: 79%;
					padding-top: 5px;
				}
	
		#news .btn {
			width: 100%;
			max-width: 400px;
			margin: auto;
		}
			#news .btn a {
				display: block;
				height: 50px;
				background: #ca5c4d url(../common/img/icon_arrow_white.png) no-repeat 5% center;
				font-family: 'Oswald', sans-serif;
				font-size: 86%;
				font-weight: 700;
				letter-spacing: 3px;
				color: #fff;
				text-align: center;
				line-height: 50px;
			}







}





.fadeInDown {
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:1s;
	-ms-animation-duration:1s;
	animation-duration:1s;
}
@-webkit-keyframes fadeInDown {
	0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); }
	100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}
@keyframes fadeInDown {
	0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); }
	100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}
.fadeInDown {
	-webkit-animation-name: fadeInDown;
	animation-name: fadeInDown;
	visibility: visible !important;
}