@charset "utf-8";
/* ******************************************************************
 *	File name		: top.css
 *	Summary			: top css
 * ******************************************************************
 */

/* -----------------------------------------------------------------
   login btn
----------------------------------------------------------------- */

#login_btn{
	position:absolute;
	top:3px;
	right:0px;
	width:220px;
	}
	#login_btn p{
		width:100%;
		margin:0 0 5px;
		font-size:0.87rem;
}
#login_btn #loginbox{
	width:100%;
	}
	#login_btn #loginbox a{
		display:-webkit-flex;
		display:flex;
		justify-content:center;
		align-items:center;
		width:220px;
		height:42px;
		text-decoration:none;
		background:#A0C94F;
		color:#FFF;
		transition-duration:0.5s;
		}
		#login_btn #loginbox a:hover{
			background:#73BE59;
}
/* --- responsive --- */
@media screen and (max-width:767px){
	#login_btn{
		position:absolute;
		top:15px;
		right:10px;
		width:120px;
		}
		#login_btn p{
			display:none;
	}
	#login_btn #loginbox a{
		width:100%;
		height:36px;
		font-size:0.80rem;
		-moz-border-radius:6px;
		-webkit-border-radius:6px;
		border-radius:6px;
	}
}

/* -----------------------------------------------------------------
   main
----------------------------------------------------------------- */

#main_action_disp{
	position:relative;
	width:100%;
	min-height:540px;
	margin:0 0 3px;
	padding:20px 0 0;
	background:url(../../image/base/bg.png) no-repeat center 0;
	}
	#main_action_disp::before{
		content:" ";
		position:absolute;
		top:0px;
		left:calc(50% - 383px);
		width:767px;
		height:100%;
		background:linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,0.7), rgba(255,255,255,0.9), rgba(255,255,255,0.7), rgba(255,255,255,0));
		z-index:0;
	}
	#main_action_disp *{
		position:relative;
		z-index:1;
	}
/* --- responsive --- */
@media screen and (max-width:767px){
	#main_action_disp{
		width:100%;
		height:auto;
		margin:0 0 3px;
		padding:0 15px;
		background:url(../../image/base/bg_sp.png) no-repeat right 0;
		background-size:contain;
	}
	#main_action_disp::before{
		left:0px;
		width:100%;
		height:100%;
		background:rgba(255,255,255,0.7);
	}
}

/* -----------------------------------------------------------------
   section h1 h2h p
----------------------------------------------------------------- */

section{
	display:block;
	position:relative;
	width:1000px;
	max-width:100%;
	margin:0 auto 30px;
	padding:30px 40px;
	text-align:left;
	background:rgba(255,255,255,0.9);
	-moz-box-shadow: 0px 0px 5px rgba(0,0,0,0.4);
	-webkit-box-shadow: 0px 0px 5px rgba(0,0,0,0.4);
	box-shadow: 0px 0px 5px rgba(0,0,0,0.4);
}
section h2{
	position:relative;
	margin:0 0 10px;
	padding:10px 10px 10px;
	text-align:left;
	background:rgba(0,0,0,0.1);
	font-family: 'Zen Maru Gothic', sans-serif;
	font-size:1.4rem;
	background:#A0C94F;
	background:#73BE59;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	color:#FFF;
	}
	section h2 span{
		font-family:inherit;
		font-weight:inherit;
}
section h3{
	position:relative;
	margin:0 0 7px;
	padding:10px 5px 10px;
	text-align:left;
	font-family: 'Zen Maru Gothic', sans-serif;
	font-weight:bold;
	font-size:1.15rem;
	background:url(../../image/base/h2_slash.png) repeat-x 0 bottom;
	border-bottom:1px solid #A0C94F;
	color:#73BE59;
}
section h4{
	position:relative;
	margin:0 0 4px;
	text-align:left;
	font-family: 'Zen Maru Gothic', sans-serif;
	font-weight:bold;
	font-size:1.0rem;
	color:#000;
}
section p{
	font-size:0.87rem;
}

/* --- responsive --- */
@media only screen and (max-width:767px){
	section{
		padding:30px 15px;
	}
	section h2{
		font-size:1.2rem;
	}
	section h3{
		font-size:1.0rem;
	}
	section h4{
		font-size:0.87rem;
	}
	section p{
		font-size:0.77rem;
		line-height:1.5;
	}
}


/* -----------------------------------------------------------------
   contents_pay
----------------------------------------------------------------- */

#contents_pay{
	width:300px;
	max-width:100%;
	margin:0 auto 50px;
	text-align:center;
	}
	#contents_pay a img{
		-moz-box-shadow: 0px 0px 5px rgba(0,0,0,0.4);
		-webkit-box-shadow: 0px 0px 5px rgba(0,0,0,0.4);
		box-shadow: 0px 0px 5px rgba(0,0,0,0.4);
	}
	#contents_pay a:hover{
		transition-duration:0.5s;
		opacity:0.7;
}