@charset "UTF-8";

* {
	margin: 0px;
	padding: 0px;
}

body {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif","Malgun Gothic","Gulim";

	text-align: center;
}

ul,
li {
	list-style-type: none;
	
}

a {
	text-decoration: none;
	color:#0099ff;
}
a:hove {
	text-decoration: underline;
}



/*----------------------------------------------------
page_link
----------------------------------------------------*/
.page_link {
	margin: 40px auto 10px auto;
	padding: 0px;
	height: 66px;
	width:1000px;
}


.page_link .back {
	float: left;
	text-align: left;
}

.page_link a {
	display: block;
	float: left;
	height: 40px;
	box-sizing: border-box;
	display: inline-table;
	text-decoration: none;
}

.page_link a#link01 {background: url(../img/outline/box01_btn.png) left top no-repeat ; width: 332px; background-size: 332px;}
.page_link a#link02 {background: url(../img/outline/box02_btn.png) left top no-repeat ; width: 332px; background-size: 332px;}
.page_link a#link03 {background: url(../img/outline/box03_btn.png) left top no-repeat ; width: 332px; background-size: 332px;}


.page_link a:hover#link01,
.page_link a:hover#link02,
.page_link a:hover#link03 {
	background-position: 0px -40px;
}

.page_link a.off#link01,
.page_link a.off#link02,
.page_link a.off#link03 {
	background-position: 0px -80px;
}

.page_link a.on#link01,
.page_link a.on#link02,
.page_link a.on#link03 {
	background-position: 0px -40px;
}


.clear {	
	clear: both;
		}




/*----------------------------------------------------
container
----------------------------------------------------*/
#container {
	margin: 0px auto 30px auto;
	width: 100%;
	height: auto;
	overflow: hidden;
/*	background:rgba(0, 102, 204, 0.7) url(../img/bg_border.png) top center repeat;*/
	background:rgba(0, 0, 0, 0.6) url(../img/bg_border.png) top center repeat;
	border-top: 1px solid #ccffff;
	border-bottom: 1px solid #ccffff;

}

/*----------------------------------------------------*/
#prologue{
	margin: 0px auto 0px auto;
}

#prologue img{
	margin: 0px auto 0px auto;
}
/*----------------------------------------------------*/
#outline{
	margin: 60px 0px 60px;

}

#outline img{
	margin: 0px auto 0px auto;

}

#outline p{
	margin: 20px auto 0px auto;
	width: 920px;
	height: auto;
	text-align: left;
	color:#ffffff;
}


#outline h3{
	margin: 40px auto 0px auto;
	width: 920px;
	font-size:140%;
	text-align: left;
	color:#ffffff;
	text-shadow: 
	0 0 6px #0099ff, 
	0 0 6px #0099ff, 
	0 0 0.8px #0099ff;
	border-bottom: solid 1px #cccccc;

}



/*-----------------------------------------------------	*/
/*	for - 800px以下の記述　*/
/*-----------------------------------------------------	*/
@media screen and (max-width: 800px) {


/*----------------------------------------------------
page_link
----------------------------------------------------*/
.page_link {
	margin: 40px auto 0px auto;
	padding: 0px;
	height: 334px;
	width: 510px;
}

.page_link img {
	margin-bottom: -7px;
}

.page_link a {
	height: 61px;
	margin-bottom: 15px;
}

.page_link a#link00 {background: url(../img/outline/box00_btn.png) left top no-repeat ; width: 510px;}
.page_link a#link01 {background: url(../img/outline/box01_btn.png) left top no-repeat ; width: 510px;}
.page_link a#link02 {background: url(../img/outline/box02_btn.png) left top no-repeat ; width: 510px;}
.page_link a#link03 {background: url(../img/outline/box03_btn.png) left top no-repeat ; width: 510px;}

.page_link a:hover#link00,
.page_link a:hover#link01,
.page_link a:hover#link02,
.page_link a:hover#link03 {
	background-position: 0px -62px;
}

.page_link a.off#link00,
.page_link a.off#link01,
.page_link a.off#link02,
.page_link a.off#link03 {
	background-position: 0px -124px;
}

.page_link a.on#link00,
.page_link a.on#link01,
.page_link a.on#link02,
.page_link a.on#link03 {
	background-position: 0px -60px;
}




/*----------------------------------------------------
 SNS
----------------------------------------------------*/
#snsbutton li img{
	width: 155px;
}

.snsbutton{
	text-align: center;
	width: 510px;
}

/*----------------------------------------------------
container
----------------------------------------------------*/
#container {
	margin: 0px auto 30px auto;
	width: 100%;
}

/*----------------------------------------------------*/
#prologue img{
	width: 510px;
}
/*----------------------------------------------------*/
#outline{
	margin: 40px 0px 60px;

}

#outline img{
	margin: 0px auto 0px auto;
	width: 510px;
}

#outline p{
	margin: 20px auto 0px auto;
	width: 510px;
	height: suto;
	line-height:180%;
	text-align: left;
	color:#ffffff;
}

#outline h3{
	margin: 40px auto 0px auto;
	width: 510px;
	font-size:140%;
	text-align: left;
	color:#ffffff;
	text-shadow: 
	0 0 6px #0099ff, 
	0 0 6px #0099ff, 
	0 0 0.8px #0099ff;
	border-bottom: solid 1px #cccccc;

}