@charset "utf-8";


* {
	margin: 0;
	padding: 0;
}

html {
	overflow-y: scroll;
}

html,body {
	height:100%;
	margin:0;
	padding:0;
	overflow: visible;	/*←ボックスからはみ出して表示されます。(初期値)*/
}


p   { line-height: 0.5em;}

	.p-L {text-align: left ; }
	.p-C {text-align: center ; }
	.p-R {text-align: right ; }

img {
	border: none;
}

ul,ol {
	list-style: none;
}

li {
	margin-left:20px;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
	height:100%;
	width:100%
}

	.top { vertical-align: top; }
	.mid { vertical-align: middle; }
	.btm { vertical-align: bottom; }

body {
	color: #333335;
	font-size: 100%;
	line-height: 1.6;
	font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	background: #f5f5f5  url(base_gs16.gif);
}


h1    { color: #000088 ; font-size : 130%; font-family : "Lucida Sans Unicode", HG丸ｺﾞｼｯｸM-PRO, Osaka, Arial ; line-height : 1.4em; }
h2    { color: #000066 ; font-size : 115%; font-family : "Lucida Sans Unicode", HG丸ｺﾞｼｯｸM-PRO, Osaka, Arial ; line-height : 1.4em; }


.t4bl  { color: #4169e1; font-size: 85%; font-weight: 800; font-family: "Lucida Sans Unicode", HG丸ｺﾞｼｯｸM-PRO, Osaka, Arial }

A:link    { color: #111113; text-decoration: none }
A:hover   { color: #da191c; text-decoration: underline }
A:visited { color: #111113; text-decoration: none }
A:active  { color: #111113; text-decoration: none }

A IMG { border: solid 2px #f5f5f5; filter: alpha(opacity=90) }
A:hover IMG { border: ridge 2px #000066; filter: alpha(opacity=100) }


article,aside,details,footer,header,main,menu,nav,section,summary {
	display: block;
}


/*------------------------------------------------------------------*/

/*--layout----------------------------------------------------------*/

/* 0 to 768px */

body {
	-webkit-text-size-adjust: 100%;
}

header {
	overflow: hidden;
	border-bottom: 2px solid #9fb7d4;
}

	header h1 {
		padding: 10px 10px 0 10px;
	}

	header h2 {
		padding: 0 10px 10px 10px;
	}
	
	header p {
		padding: 10px 0 0 0;
	}

#contents nav {
	overflow: hidden;
	margin:0 auto;
	font-size: 85%;
	width: 100%;
}

	#contents nav ul {
		padding: 0px;
		list-style: none;
		overflow: hidden;
		background: #333353;
		color: #f5f5f5;
}

	#contents nav ul li {
		display: block;
		float: left;
		margin: 0;
		width: 50%;
}


	#contents nav ul li A {
		display:block;
		padding: 2px 0 2px;
		text-align: center;
		color: #fff;
		text-decoration: none;
}

	#contents nav ul li A:hover { 
		color:#f5f5f5; background-color:#555575;
}


#contents #main {
	overflow: hidden;
}

	#contents #main article {
		overflow: hidden;
		padding: 5px;
	}

iframe

.iframe-content {
	position: relative;
	width: 100%;
	padding: 0;
}

.iframe-content iframe {
	border:none;
	position: absolute;
	left: 0;
	width: 100%;
	height:100%;
}


#contents aside {
	overflow: hidden;
	background: #eee;
}

	#contents aside p {
		padding: 10px;
	}


/* ** */

@media only screen and (min-width: 410px) {
    #contents nav ul li{
    width: 33%;
  }

/* ** */

@media only screen and (min-width: 1001px) {

header {
	min-width: 1000px;
	overflow: hidden;
	border-bottom: 2px solid #9fb7d4;
}

	header h1 {
		padding: 5px 0 5px 220px;
	}

	header h2 {
		padding: 5px 0 5px 5px;
	}
	
	header p {
		padding: 10px 0 0 220px;
	}


#contents {
	overflow: hidden;
	width: 1000px;
	margin: 0 auto;
}

#contents nav {
	width:220px;
	margin: 0 auto;
	overflow: hidden;
	background: none;
}

	#contents nav ul {
		padding: 5px;
		list-style: none;
		overflow: hidden;
		background:none;
}

	#contents nav ul li {
		margin-left:10px;
		float: left;
		width:220px;
}

	#contents nav ul li A {
		padding: 0;
		text-align: left;
		color: #333353;
		display:block; width:220px; text-decoration:none;
}
	#contents nav ul li A:hover { 
		color:#f5f5f5; background-color:#da191c;
}


#contents #main {
	float:right;  /*←aside（メインブロック）はfloat:rightで右寄せに。*/
	width: 780px;
	overflow: hidden;

}

	#contents #main article {
		overflow: hidden;
		padding: 5px;
	}

iframe

.iframe-content {
	position: relative;
	width: 100%;
	padding: 0;
}

.iframe-content iframe {
	border:none;
	left: auto;
	width: 780px;
	height: 90%;
}

#contents aside {
	position: absolute;
	float:left;  /*←article（メインブロック）はfloat:leftで左寄せに。*/
	width: 220px;
	height:90%;
	overflow: hidden;
	background: none;
}

	#contents aside p {
		padding: 10px;
	}

