﻿/* *（すべての共通設定)*/

*	{
		margin: 0;
		padding: 0;
		border: none;
	}

body	{
			font-family: KaiTi,Times New Roman, Verdana ,sans-serif;			/*字体の仕様設定*/
			font-size: 100%;						/*字体のサイズ設定*/
			background-color: #ffffff;					/*字体背景色設定*/
		}

#page	{
			width: 900px;							/*画面の横幅*/
			margin: 0 auto;							
			/*background-color: rgb(38,35,134)→#262386*/
			background-color:#f4f4f4;					/*背景色設定*/
			padding: 0 25px;						/**/
		}



#wrapper	{
				positon: relative;					/**/
				width: 900px;						/**/
				margin: 20px auto;					/**/
			}
.feilds		{
				position: relactive;
				margin: 15px 45px;
				float: left;
			}

.feilds:hover	{
					-webkit-transform: scale(1.1, 1.1);			/* 上下左右1.1倍拡大させる */
					-ms-transform: scale(1.1, 1.1);			/* IEの場合は -ms-transform: scale(1.1, 1.1); */
					opacity: 0.60;
				}
	



.feilds img	{
				padding-bottom: 10px;
				margin-bottom: 5px;
			}

.feilds p	{
				font: 18px;
				color: #000000;
				margin: 0;
			}

.English	{
				font-size: 13px;
			}

a.noline		{
				text-decoration:none;
			}
/*ナビゲーション*/

#nav{
		margin: 0 auto;								/**/
		background: #aaaaaa;							/**/
		width: 900px;								/**/
		height:70px;								/**/
		}									

#logo img{
		float:left;								/**/
		width: 316px;								/**/
		height:70px;								/**/
		}									

table.table01{										/**/
				/*border: solid 1px #aaaaaa;ｓからeまで枠*/
				background: #ffffff;					/**/
				width: 584px;						/**/
				height:70px;						/**/
				font-weight:bold;					/**/
				float:right;						/**/
				}
				
table.table01 td{
				/*border: solid 1px #aaaaaa;*/				
				text-align:right;					/**/
				height:70px;						/**/
				}


input[type="search"]{
	padding:3px 2px 3px 0;								/**/
	margin:2px;									/**/
	/*background: url('./images/search.png') no-repeat 8px 6px;*/	/*検索マーク*/	/**/
	border-radius:15px;								/**/
	-moz-border-radius:15px;							/**/
	-webkit-border-radius:15px;							/**/
	border: 1px solid #aaaaaa;
	text-align: center;								/**/
	}
	
input[type="submit"]{
		background-color: #aaaaaa;						/**/
		font-size: 15px;							/**/
		color: #ffffff;								/**/
		border: 1px solid #262386;						/**/
		padding: 2px;								/**/
		}	

table.table01 a{
		color: #000000;								/**/
		font-size: 12px;							/**/
		text-decoration: none;							/**/
		}		
		
table.table01 a:hover{
			color:  #ffaa55;						/**/
			}

/* 画像切り替え */
#topimage {
	max-width:960px;
	margin: 0 auto;
	padding-top:20px;
	overflow:hidden;
}
.photo1 {
	margin: 0;									/**/
	background-color: #f4f4f4;							/**/
	position: relative;								/**/
}		


.photo1 img {
	width: 900px;									/**/
	animation-name: photo1;								/**/
	-webkit-animation-name: photo1;							/**/
		/* アニメーション1周の時間 */		
	animation-duration: 15s;							/**/
	-webkit-animation-duration: 15s;						/**/
		/* 無限ループ */
	animation-iteration-count: infinite;						/**/
	-webkit-animation-iteration-count: infinite;					/**/
		/* 待機時間は画像を非表示 */
	opacity: 0;									/**/
}

.photo1 .img1 {
	display: block;									/**/
	margin: 0 auto;									/**/
}

.photo1 .img2 {
	animation-delay: 3.8s;								/**/
	-webkit-animation-delay: 3.8s;							/**/			
	position: absolute;								/**/
	top: 0;										/**/
	left: 0%;									/**/
}

.photo1 .img3 {
	animation-delay: 7.5s;								/**/		
	-webkit-animation-delay: 7.5s;							/**/
	position: absolute;								/**/
	top: 0;										/**/
	left: 0%;									/**/
}

.photo1 .img4 {
	animation-delay: 11.3s;
	-webkit-animation-delay: 11.3s;
	position: absolute;
	top: 0;
	left: 0%;
}


		/* アニメーション1周を100%とすると各画像の表示する時間は25%(画像4つの場合) */
@keyframes photo1 {
	0% {
		opacity: 0;
	}
	
	10% {
		opacity: 1;
	}

	20% {
		opacity: 1;
	}
	25% {
		opacity: 0;
	}
}

@-webkit-keyframes photo1 {
	0% {
		opacity: 0;
	}
	
	10% {
		opacity: 1;
	}

	20% {
		opacity: 1;
	}
	25% {
		opacity: 0;
	}
}


/* フォトギャラリー */
#photo-gallery	{
					background:#f4f4f4;
					width: 900px;
					height: 100px;
					margin: 10px auto;
				}


.photo2	{
			float: left;
			padding-left:10px;
		}
.photo2:nth-child(1){
					padding-left:0;
					}

.photo2 img{
			border: 2px solid #999999;
			border-radius: 10px 10px 10px 10px;
			}


/*グローバルナビゲーション*/
#dropmenu{
		list-style-type: none;					/*箇条書きの点をけす*/
		width: 900px;						/*表示される横幅*/
		height: 40px;						/*表示される縦幅*/
		margin: 0 auto;						/*dropmenuの上側はあけない、左右は真ん中に*/
		padding: 0;						/*文字の周りを開けない(ナビゲーションの大きさ)*/
		/*background:#2b2b55;*/					/*通常時のナビゲーションの色*/
		/*border: 1px solid #aaaaaa;
		/*border-radius: 5px 5px 5px 5px;	*/		/*ナビゲーションの四隅を丸める*/
		}
		
#dropmenu li{
			position: relative;
			width: 25%;					/*たぶん文字が表示されるスペースの幅*/
			float: left;					/*ナビゲーションが左から順に並べれられる*/
			/*margin: 0;					/*書いてない＝デフォルト表示*/
			padding: 0;					
			text-align: center;				/*文字は中央揃え*/
			}
			
#dropmenu li a{
		display: block;						/*テキストじゃないところでもクリックできる*/
		padding: 15px 30px 11px;
		background-color: #262386;				/*通常時のバーの色*/
		color: #ffffff;						/*テキストの色*/
		font-size: 22px;					/*テキストサイズ*/
		font-weight: bold;					/*太字*/
		line-height: 1;						/*テキストのまわり1大きくする(ナビゲーションの大きさにつながる)*/
		text-decoration: none;					/*リンク部分のテキストに線は付かず、点滅もしません。*/
		z-index: 2;
		}
		
#dropmenu li ul{							/*サブメニュー全体のul*/
		list-style: none;					/*箇条書きの点をけす*/
		position: absolute;
		top: 100%;
		left: 0;						/*ドロップダウンリストの左側を、それぞれの"○○向け"のはばに合わせて表示*/
		margin: 0;
		padding: 0;
		z-index: 2;						/*前面に表示する*/
		/*border-radius: 0 0 3px 3px;*/
		}

#dropmenu li:last-child ul{						/*同窓生の方へのドロップダウンリストのみ*/
		/*left: 100%;	*/					/*左のマスにずらす。で、900pxの幅からはみ出ないようにしている*/
		width: 100%						/*ずらす部分の横幅。100%だったらちょうど1マス分の大きさ*/
		}
		
#dropmenu li ul li{
		overflow: hidden;
		width: 100%;						/*親要素(在校生の方への部分)と同じ大きさで開くか(200%だったら倍の大きさ)*/
		height: 0;						/*高さは初期値で*/
		color: #ffffff;						/*文字の色白*/
		-moz-transition: 0.2s;					/*以下いろんなブラウザで開けるように*/
		-webkit-transition: 0.2s;
		-o-transition: 0.2s;
		-ms-transition: 0.2s;
		transition: 0.2s;					/*0.2秒で展開*/
		}

#dropmenu li ul li a{
		padding: 13px 15px;					/*ドロップリスト内の文字の位置*/
		text-align: left;					/*文字を左寄せで表示*/
		font-size: 12px;
		}
		

#dropmenu li:hover a{
		background: rgba(27,82,189,0.8);			/*マウスオーバー時のドロップダウンリストの色*/
		color: #ffffff;						/*マウスオーバー時の文字の色*/
		/*box-shadow: 2px 2px 3px 3px rgba(0,0,0,0.2);*/	/*影つけてみた*/
		}

#dropmenu li:hover ul li{						/*ドロップダウンリスト全体の設定*/
		overflow: visible;					/*ボックスの範囲内に内容が入りきらない時、ボックスからはみだして表示する*/
		height: 38px;						/*1マスの高さ*/
		border-top: 1px solid #ffffff;				/*マスの上側に線を引く*/
		}
/*#dropmenu li:hover ul li:first-child{					/*ドロップダウンリストの最初のマスのみ上にラインを引かない*/
		border-top: 0;
		}*/
#dropmenu li:hover ul li:last-child{
		border-bottom: 0;					/*ドロップダウンリストの最後のマスのみ下にラインを引かない*/
		border-radius: 0 0 3px 3px;
		}
#dropmenu li:hover ul li:last-child a{					/*ドロップダウンリストの最後のマスのみ角を丸める*/
		border-radius: 0 0 3px 3px;
		}



/* タブ切り替え */

ul{
		list-style: none;
		margin: 0;
		padding: 0;
		}

#tab, .tabsetIn	{
		width: 520px;
		}

#tab{ 
	margin: 10px auto 10px;		
	}

.tabsetIn{
		clear: both;
		height:352px;
		position: relative;
		}

.contents{
		background-color: #fff;
		border: 1px solid #999;
		width: 500px;
		min-height: 380px;
		padding: 0;
		}
/*テーブル2*/
table.table02{
		color: #000000;
		}
				
table.table02 td{
		font-size: 8px;
		width: 495px;
		padding: 2px 6px 2px 6px;
		}
				
table.table02 td:nth-child(1){
				width: 90px;
				}
				
table.table02 td:nth-child(2){
				width: 130px;
				}
				
table.table02 tr:nth-child(1){
				background:#c6e2e2;
				}
				
table.table02 tr:nth-child(even){
				background:#ffffff;
				}
				
table.table02 tr:nth-child(odd){
				background:#c6e2e2;
				}




.checktab > li	{
					float:left;
					margin-right: 10px;
				}

.checktab .btn	{
					display: block;
					font-size: 14px;
					text-align: center;
					width: 100px;
					line-height: 18px;
					padding: 10px;
					background-color: #9DB9ED;
					color: #fff;
					cursor:pointer;
				}
				
.checktab .btn:hover{
			background-color: #515388;
			color: #fff;
			}
					
.checktab input[type="radio"]{
				display: none;
				}
								
.checktab input[type="radio"]:checked ~ .contents{
							display: block;
							}

.checktab input[type="radio"]:checked + .btn{
						background-color: #262386;
						cursor: default; 
						color: #fff;
						}
.checktab .contents{
			position: absolute; 
			top: 50px ; 
			left: 0; 
			display: none;
			}

/* アイコン */

#icon{
	width: 900px;
	/*margin: 90px auto;*/
	}
		
.icons{
	position: relative;
	float: left;
	padding-right:12px;
				
	}

.icons:hover{
		opacity: 0.65;
		}

.icons img{
		width:140px;
		height:125px;
		/*padding-bottom: 10px;*/
		/*margin-bottom: 5px;*/
				
		}
			
.absolute{
		position: absolute;
		padding: 0 3px;
		bottom: 30px;
		font-size: 18px;
		color: #ffffff;
		background:rgba(0,0,0,0.4);
		width: 130px;
		}	

.icons:last-child{
			padding-right: 0;
			}

.icon1-5{
		margin-top: 10px;
		}
			
			
/*ページフッター(宇佐美)*/
h2{
	font-size: 16px;
	font-weight: normal;
	font-family: KaiTi,Times New Roman, Verdana,sans-serif;
	color: #000000;
	/*padding: 3px 0;*/
	/*padding-left: 10px;*/
	border-bottom: dotted 1px #0000cd;
	}

li a{
	color:#4a4a4a;
	}
li a:hover{
		color:#ffaa55;
		}


/*.sitemap{
		width: 900px;
		height:530px;
		margin:0 auto;
		font-size: 70%;
		background:#999999;
		}*/
.box1{								/*上部分のサイドの空白*/
	background : #262386;
	float: left;
	width: 172.5px;
	height: 220px;
	/*padding:30px;*/
	}
.box2{								/*下部分のサイドの空白*/
	background : #262386;
	float: left;
	width: 172.5px;
	height: 200px;
	/*padding:30px;*/
	border-bottom: solid 1px #ffffff;/*白い線を引いて区切る*/
	}
.section1{
		float: left;					/*順番に左につめる*/
		background : #f4f4f4;
		width: 125px;
		height: 160px;
		padding: 30px;
		}
.section2{
		float: left;					/*順番に左につめる*/
		background : #f4f4f4;
		width: 125px;
		height: 160px;
		padding: 30px;
		}
.section3{
		float: left;					/*順番に左につめる*/
		background : #f4f4f4;
		width: 125px;
		height: 160px;
		padding: 30px;
		}
.section4{
		float: left;					/*順番に左につめる*/
		background : #f4f4f4;
		width: 125px;
		height: 140px;
		padding: 30px;
		border-bottom: solid 1px #ffffff;/*白い線を引いて区切る*/
		}
.section5{
		float: left;					/*順番に左につめる*/
		background : #f4f4f4;
		width: 125px;
		height: 140px;
		padding: 30px;
		border-bottom: solid 1px #ffffff;/*白い線を引いて区切る*/
		}
.section6{
		float: left;					/*順番に左につめる*/
		background : #f4f4f4;
		width: 125px;
		height: 140px;
		padding: 30px;
		border-bottom: solid 1px #ffffff;		/*白い線を引いて区切る*/
		}
.footer{
		font-size: 70%;
		clear: both;					/*横並び解除*/
		background : #f4f4f4;
		width:900px;
		height:50px;
		/*padding: 10px;	*/
		margin: 0 auto;
		}
.under{								/*"li1"だけ線を付ける*/
	display: inline;					/*横並び*/
	border-right:1px solid #000000;
	}
/*#kosen img {
		border:solid 3px #ffffff;			/*画像に枠線*/
		/*float: right;	画像横並び*/
		width: 300px;
}*/
/*#logo img{
		border:solid 3px #ffffff;
		float: right;	
		width: 200px;
		height:30px;
}*/

.under p{
		font-size: 8px;
		color:#ffffff;
		}




/*ページフッター(松本)*/

#pageFoot{
		width: 900px;
		border-top: solid 1px #cccccc;
		clear: both;					/*回り込みを削除*/
		text-align: center;
		font-size: 12px;
		line-height: 1.5;
		}

/*#copyright small{
			font-size: 12px;
			line-height: 1.5;
			}*/
