/* ******************************************************************
 *	File name		: top.css
 *	Summary			: page layout
 * ******************************************************************
 */

.line{
	border-bottom:1px dotted #7ECEF4;
}

/* -----------------------------------------------------------------
   contents
----------------------------------------------------------------- */

main::after{
	height:340px;
}
#main_contents{
	position:relative;
	width:950px;
	max-width:100%;
	margin:0 auto;
	padding:360px 0 30px 250px;
	font-size:0.95em;
	text-align:center;
	z-index:15;
}
/* --- responsive --- */
@media only screen and (max-width:950px){
	#main_contents{
		padding:0px 0 30px 0px;
	}
}

/* --- responsive --- */
@media only screen and (max-width:1000px){
	#main_contents main{
	}
}
@media only screen and (max-width:550px){
	#main_contents main{
	}
}

h2{
	position:relative;
	margin:0 0 15px;
	padding-left:19px;
	font-weight:bold;
	font-size:1.1rem;
	text-align:left;
	color:#FFF;
	}
	h2:after{
		content:" ";
		position:absolute;
		top:3px;
		left:0px;
		width:14px;
		height:14px;
		background:#007BC7;
}
h3{
	position:relative;
	margin:0 0 7px;
	font-weight:bold;
	font-size:1.0rem;
	text-align:left;
	color:#FFF;
}


/* -----------------------------------------------------------------
   lr_list
----------------------------------------------------------------- */
.lr_list{
	column-count:2;
	list-style:none;
	}
	.lr_list li{
		position:relative;
		margin:0 0 5px;
		font-size:0.9rem;
		padding-left:17px;
		line-height:1.3;
	}
	.lr_list li::before{
		content:" ";
		position:absolute;
		top:7px;
		left:0px;
		width:7px;
		height:7px;
		background:#7ECEF4;
		-moz-border-radius:50%;
		-webkit-border-radius:50%;
		border-radius:50%;
}
/* --- responsive --- */
@media only screen and (max-width:950px){
	.lr_list li{
		font-size:0.77rem;
		line-height:1.2;
	}
}

/* -----------------------------------------------------------------
   zoom_btn
----------------------------------------------------------------- */

#zoom_btn{
	position:relative;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	margin:0 0 25px;
	padding:7px;
	background:rgba(126,206,244,0.2);
	}
	#zoom_btn a{
		position:relative;
		display:block;
		height:60px;
		padding:12px 7px 10px;
		font-size:0.87rem;
		text-align:center;
		text-decoration:none;
		border:1px solid rgba(255,255,255,0.5);
		background:rgba(126,206,244,0.3);
		background:url(../../image/base/slash_w.png) repeat 0 0 rgba(1,15,39,0.9);
		-moz-border-radius:6px;
		-webkit-border-radius:6px;
		border-radius:6px;
		line-height:1.3;
		transition-duration:0.5s;
	}
	#zoom_btn a:hover{
		background:url(../../image/base/slash_w.png) repeat 0 0 rgba(1,15,39,0.3);
	}
	#zoom_btn a::after{
		content:" ";
		position:absolute;
		bottom:-10px;
		right:-10px;
		border:15px solid transparent;
		border-left:15px solid rgba(255,255,255,0.4);
		transition-duration:0.5s;
		transform:rotate(45deg);
		}
		#zoom_btn a:hover::after{
			bottom:calc(50% - 15px);
			right:0px;
			border:15px solid transparent;
			border-left:12px solid rgba(255,255,255,1);
			transform:rotate(0deg);
}

/* --- responsive --- */
@media only screen and (max-width:950px){
	#zoom_btn a{
		padding:15px 7px 10px;
		font-size:0.72rem;
	}
}

/* -----------------------------------------------------------------
   invited_list
----------------------------------------------------------------- */

.invited_list{
	display:-webkit-flex;
	display:flex;
	-webkit-box-pack:justify;
	-ms-flex-pack:justify;
	justify-content:space-between;
	flex-wrap:wrap;
	position:relative;
	list-style:none;
	}
	.invited_list li{
		display:inline-block;
		position:relative;
		width:49%;
		margin:0 0 10px;
		padding:10px;
		border:1px solid rgba(255,255,255,0.3);
		line-height:1.35;
	}
	.invited_list li span{
		font-size:0.75rem;
}
/* plus_photo */
	.invited_list.plus_photo li{
		width:33%;
		margin:0 0 5px;
		text-align:center !important;
	}
	.invited_list.plus_photo li figure{
		display:inline-block;
		position:relative;
		max-width:100%;
		margin:0 auto 7px;
	}
	.invited_list.plus_photo li span{
		font-size:0.70rem;
	}

/* --- responsive --- */
@media only screen and (max-width:950px){
	.invited_list.plus_photo li{
		width:49%;
		margin:0 0 10px;
		line-height:1.1;
	}
}

/* -----------------------------------------------------------------
   important_dates
----------------------------------------------------------------- */

#important_dates{
	position:relative;
	margin-bottom:40px;
}
#important_dates ul{
	position:relative;
	list-style:none;
	}
	#important_dates ul li{
		position:relative;
		margin:0 0 5px;
		padding:5px 20px 5px 20px;
		font-size:0.95rem;
		background:rgba(255,255,255,0.2);
		z-index:10;
	}
	#important_dates ul li span{
		display:inline-block;
		position:absolute;
		top:0px;
		right:20px;
		padding:5px 0;
		font-weight:inherit;
		color:inherit;
	}
	#important_dates ul li b{
		color:inherit;
}

/* --- responsive --- */
@media only screen and (max-width:640px){
	#important_dates ul li{
		font-size:0.84rem;
		}
		#important_dates ul li span{
			position:relative;
			top:0px;
			right:0px;
			width:auto;
			padding:0 0 0 10px;
			border-bottom:none;
	}
}
@media only screen and (max-width:480px){
	#important_dates{
		margin-bottom:0px !important;
	}
	#important_dates ul li span{
		display:block;
		padding:0px;
	}
}





























