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

body{
	-webkit-text-size-adjust: 100%;
	margin:0;
	padding:0;
	width:100%;height:100%;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	position: absolute;
	top: 0;
}

img{
	vertical-align:top;
	border:none;
	margin:0;
	padding:0;
}
ul,li,dl,dd,dt,div,a{
	margin:0;
	padding:0;
	font-weight:normal;
	text-decoration:none;
	list-style-type:none;
}

h1,h2,h3,h4,h5{
	margin:0;
	padding:0;
	font-weight:normal;
}
p{
	margin:0;
	padding:0;
}

.sp_only{
	display:none !important;
}

#wrapper {
	padding-top: 90px;
}

/*
header
*******************************/
header {
	box-sizing: border-box;
    width: 100%;
	min-width: 1060px;
    padding: 30px 30px 25px;
	position: absolute;
    top: 0;
    z-index: 10;
    height: 90px;
    background-color: #fff;

}
header.fixed {
	position: fixed;
	padding: 15px 30px 15px;
    height: 65px;
	-webkit-transform: translateY(-100%);
	-ms-transform: translateY(-100%);
	transform: translateY(-100%);
}
header.fixed.show {
	-webkit-transition: -webkit-transform 0.2s ease-out;
	-ms-transition: -webkit-transform 0.2s ease-out;
	transition: -webkit-transform 0.2s ease-out;
	-webkit-transform: translateY(0%);
	-ms-transform: translateY(0%);
	transform: translateY(0%);
}
header.fixed.show.hide {
	-webkit-transform: translateY(-100%);
	-ms-transform: translateY(-100%);
	transform: translateY(-100%);
}


header .main_logo {
	float: left;
	margin-top: -5px;
}
header .main_logo img {

}
header .pc_nav {
	float: right;
    width: auto;
}
header .pc_nav ul {
	height: 35px;
	position: relative;
	overflow: hidden;
}
header .pc_nav li {
	float: left;
    margin-right: 60px;
	text-align: center;
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
header .pc_nav li:last-child {
	margin-right: 0;
}
header .pc_nav li a {
	color: #13201a;
	line-height: 1;
	display: block;
}
header .pc_nav li a:hover {
	color: #389bf4;
}
header .pc_nav li a img {
	position: absolute;
	-webkit-transition: opacity 0.3s ease-out;
	-ms-transition: opacity 0.3s ease-out;
	transition: opacity 0.3s ease-out;
	opacity: 1;
}
header .pc_nav li a img.hover_img {
	opacity: 0;
	position: relative;
}
header .pc_nav li a:hover img,
header .pc_nav li a.on img {
	opacity: 0;
}
header .pc_nav li a:hover img.hover_img,
header .pc_nav li a.on img.hover_img {
	opacity: 1;
}



/*
main
*******************************/
#main{
	background-color:#389bf4;
	min-width: 1060px;
}

#main .contents_wrap{
	box-sizing:border-box;
	padding:30px;
}

#main .contents_wrap>[id^='block']{
	background-image:url(../images/common/main_bg.jpg);
	padding:80px 0;
	border-radius:2px;
	border-radius: 10px;
	margin-bottom:30px;

}

#main .contents_wrap>[id^='block'] .contents_inner{
	width:100%;
	margin:0 auto;
	position:relative;
	width:1000px;
}

#main .contents_wrap>[id^='block'] .section_block{
	position:relative;
	background-image:url(../images/common/section_bg.png);
	background-repeat:no-repeat;
	padding: 4.4% 0px;
	max-width:880px;
	margin:0 auto;
	background-size:100%;
}

#main .contents_wrap>[id^='block'] h1{
	text-align:center;
	color:#13201a;
	margin:0 auto;
}

#main .contents_wrap>[id^='block'] h1 img{
	width:100%;
	height:auto;
}

#main .contents_wrap>[id^='block'] .section_block .section_fuki{
	position:absolute;
	left: 9.8%;top: -30%;
	width: 15.22%;
}

#main .contents_wrap>[id^='block'] .section_block .section_fuki img{
	width:100%;
	height:auto;
}

#main .contents_wrap>[id^='block'] h2{
	text-align:center;
	color:#8b9e95;
}



/*
footer
*******************************/

footer{
	background-color:#389bf4;
	padding-bottom: 1em;
	min-width: 1060px;
}

footer .page_top{
	cursor:pointer;
	max-width:43px;
	margin:0 auto;
}

footer p{
	color:#fff;
	text-align:center;
	font-size: 0.65em;
	margin-top: 5.8em;
}


@media screen and (max-width: 750px) {
	.sp_only{
		display:block !important;
	}

	.pc_only{
		display:none !important;
	}

	#wrapper {
		padding-top: 0;
	}

	header {
		min-width: 0;
		padding: 4% 0;
		z-index: 5;
    	background-color: #fff;
		position: fixed;
		box-sizing: border-box;
		height: auto;
	}
	.menuopen header {
		border-bottom: 1px solid #dadada;
	}
	header .main_logo {
		width: 48%;
		position: relative;
		float: left;
		margin-left: 4%;
		margin-top: 0;
	}
	header .main_logo img {
		width: 100%;
		height: auto;
	}
	.burger {
		position: relative;
		width: 7.1%;
		float: right;
		margin-right: 4%;
	}
	.burger img {
		width: 100%;
		position: absolute;
    	margin-top: 14%;
		-webkit-transition: opacity 0.2s ease-out;
		-ms-transition: opacity 0.2s ease-out;
		transition: opacity 0.2s ease-out;
	}
	.burger img.close {
		width: 75.51%;
		margin-left: 12.24%;
		margin-top: 12%;
		opacity: 0;
	}

	.sp_nav {
		position: fixed;
		height: 100%;
		width: 100%;
		box-sizing: border-box;
		top: 0;
		z-index: 4;
		background-color: #fff;
		padding-top: 15.5%;
		box-sizing: border-box;
		overflow-y: scroll;
		overflow-x: hidden;

		-webkit-transform: translateY(-100%);
		-ms-transform: translateY(-100%);
		transform: translateY(-100%);

		-webkit-overflow-scrolling: touch;
		overflow-scrolling: touch;

		-webkit-transition: transform 0.3s ease-out;
		-ms-transition: transform 0.3s ease-out;
		transition: transform 0.3s ease-out;
	}

	.burger.open img {
		opacity: 0;
	}
	.burger.open img.close {
		opacity: 1;
	}
	.menuopen .sp_nav {
    	-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		transform: translateY(0);
	}

	.sp_nav li {
		border-bottom: 1px solid #dadada;
		padding: 6.2% 4%;
	}
	.sp_nav li a {
		display: block;
		position: relative;
		text-align: center;
	}
	.sp_nav li a img {
		position: absolute;
		-webkit-transition: opacity 0.3s ease-out;
		-ms-transition: opacity 0.3s ease-out;
		transition: opacity 0.3s ease-out;
		opacity: 1;
	}
	.sp_nav li a img.hover_img {
		opacity: 0;
		position: relative;
	}
	.sp_nav li a:hover img {
		opacity: 0;
	}
	.sp_nav li.movie_and_join a:hover img {
		opacity: 1;
	}
	.sp_nav li a:hover img.hover_img {
		opacity: 1;
		position: relative;
	}

	.sp_nav li.movie_and_join {
		padding: 4%;
	}
	.sp_nav li.movie_and_join a {
		display: block;
		float: left;
		width: 47.82%;
	}
	.sp_nav li.movie_and_join a img {
		width: 100%;
		position: relative;
	}
	.sp_nav li a.movie {
		margin-top: -1.01%;
	}
	.sp_nav li a.join {
		float:right;
		top: 1.2vw;
	}
	.sp_nav li a.goto0 img { width: 9.28%; }
	.sp_nav li a.goto1 img { width: 25.07%; }
	.sp_nav li a.goto2 img { width: 54.06%; }
	.sp_nav li a.goto3 img { width: 47.25%; }
	.sp_nav li a.goto4 img { width: 30.87%; }
	.sp_nav li a.goto5 img { width: 53.91%; }



	#main{
		min-width:inherit;
	}

	#main .contents_wrap{
		padding: 2.4em 4.9% 1.5em;
	}

	#main .contents_wrap>[id^='block']{
		box-sizing: border-box;
		padding: 4.8em 6.6%;
		border-radius: 0.5em;
		margin-bottom: 2.5em;
	}

	#main .contents_wrap>[id^='block'] .contents_inner{
		width:auto;
	}

	#main .contents_wrap>[id^='block'] h1{
		width: 100%;
		max-width: inherit;
	}

	#main .contents_wrap>[id^='block'] h1 p{
		font-size: 1em;
		letter-spacing: 0.1em;
		line-height: 1.2;
		position:absolute;
		width:100%;
		top:50%;
		-webkit-transform:translateY(-50%);
		transform:translateY(-50%);
		font-weight: 600;
	}

	#main .contents_wrap>[id^='block'] h1 strong{
		background-color: #389bf4;
		color: #fff;
		font-weight: normal;
		padding: 0.2em;
		font-weight: 600;
		margin-right: 0.25em;
	}

	#main .contents_wrap>[id^='block'] h1 p span{
		color: #8b9e95;
		font-size: 0.65em;
		letter-spacing: 0;
	}

	#main .contents_wrap>[id^='block'] .section_block{
		max-width:inherit;
		margin-bottom: 4em;
		background-image: none;
		padding: 0;
		position: relative;
	}

	#main .contents_wrap>[id^='block'] .section_block .section_fuki{
		width: 22.71%;
		left: -10%;top: -37%;
	}

	footer{
		min-width:inherit;
		padding-bottom: 2em;
	}

	footer .page_top{
		max-width:inherit;
		width:7.3%;
	}

	footer .page_top img{
		width:100%;
		height:auto;
	}

	footer p{
		margin-top: 4em;
	}
}

/********************************/


.blink:hover {
	animation: blink 0.3s ease-out;
	-webkit-animation:blink 0.3s ease-out;
}

@keyframes blink{
	0%{opacity:0}
	100%{opacity:1}
}
@-webkit-keyframes blink{
	0%{opacity:0}
	100%{opacity:1}
}

@media screen and (max-width: 750px) {
	.blink:hover {
		animation:none;
		-webkit-animation:none;
	}
}


/********************************/


.clear_fix{
	zoom:1;
}

.clear_fix:after{
	content:"";
	display:block;
	clear:both;
	font-size:0;
	line-height:0;
	visibility:hidden;
}

/********************************/