﻿/* CSS Document */

/* 基本構造に関するcss */
body  {
	font-family:'Meiryo', 'Hiragino Maru Gothic Pro', sans-serif;
	margin:0;
	/* 複数の異なるブラウザの初期設定値に対応するため、bodyエレメントのマージンと余白を0 にする */
	padding:0;
	text-align:center;
	/* これによりIE 5ではコンテナが中央揃えになり、テキストは#containerセレクタの初期設定である左揃えに設定される */
	color:#000000;
	-webkit-text-size-adjust:100%;
	/* iPhoneの自動テキストサイズ修正をキャンセル */
	}
img {
	vertical-align:top; /* これにより、IE での画像下方の隙間が解消される。 */
	}
table {
		margin:0;
		border:1px gray solid;
		border-collapse:collapse;
	}
tr {
		border-color:gray;
		border-width:1px;
		border-style:solid;
		border-collapse:collapse;
	}
td {
		padding:2px 10px 2px 5px;
		border-color:gray;
		border-width:1px;
		border-style:solid;
		border-collapse:collapse;
		vertical-align:middle;
	}

	
/* 標準的なリンクに関する設定 文字色を黒としてマウスオーバー時は太字にする */
p {
	line-height: 18px;
	text-decoration:none;
	font-size:12px;
	}
a {
	line-height: 18px;
	text-decoration:none;
	color:white;
	font-size:12px;
	}
a:hover{
	font-weight:bold;
	}

/* 校名, 住所等 */
#basic_information {
	margin: 0;
	background-color: rgba(0, 20, 100, 0.8);
	}
#title_box {
	width:550px;
	height:110px;
	text-align:left;
	margin:0 auto 0 auto;
	}
#title_box img {
	float:left;
	vertical-align:middle;
	width:90px;
	padding: 10px 0 10px 0;
	margin-right: 10px;
	filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.9));
	}
.title {
	font-size:36px;
	font-weight:normal;
	color:white;
	line-height:40px;
	margin:0;
	padding:18px 0 0 0;
	text-shadow:1px 1px 3px black;
	}
.adress {
	font-size:12px;
	font-weight:normal;
	color:white;
	line-height:20px;
	margin:0;
	padding:0;
	text-shadow:1px 1px 5px black;
	}
#basic_information_two {
	margin: 0;
	padding: 5px 0 5px 0;
	background-color: rgba(9, 0, 58, 0.8);
	border-top: 1px solid whitesmoke;
	}

/* 階層メニュー */
.navigation {
	width:100%;
	padding: 3px 0 4px 0;
	margin: 0;
	border-top: 1px solid whitesmoke;
	background-color: rgba(0, 50, 150, 0.85);
	}
.navigation a {
	margin: 0 0 0 8px;
	color:lightgray;
	text-decoration: none;
	}
.level-one > a {
	padding: 0 0 0 6px;		/* 白いブロックボーダーがらの距離 */
	border-left: 4px solid gold;	
	}
.navigation a:hover {
	color:darksalmon;
	}
.menu_item {
    margin: 0;		/* 無いと直上のブロックと隙間が開く */
	}
.menu_item > li {
	display: inline;
    padding: 7px 3px 7px 0px;
    list-style: none;
	}
.menu_item > li a {
	font-size: 12px;
	}
ul.level-two {
    visibility: hidden;
    opacity: 0;
    z-index: 1; 
	padding: 5px 0 5px 30px;
	}
.level-two li {
	color:tomato;
    padding: 2px 25px 2px 0px;
	line-height: 18px;
	}

.level-two li a {
	margin: 0;
	}
.menu_item > li.level-one {
    position: relative;
	}
li.level-one ul.level-two {
	position: absolute;
	margin: 0;
	padding: 0 0 0 -1px;
	width: max-content;
	text-align: left;
	list-style: disc;
	/* list-style-position:inside;*/
	background: rgba(0 ,0 , 0, 0.9);
	/*-webkit-transition: all .6s ease;*/
	/*transition: all .6s ease;*/
	border-radius: 5px;
	/*list-style-positionを無効にしてpaddingを負にすると
	　改行したlist項目のインデントが揃った*/
	}
li.level-one:hover ul.level-two {
	top:30px;
	left:10px;
    visibility: visible;
    opacity: 1;
	}

/* 下矢印をcssで描画 */
.init-bottom:after {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0 0 0 6px;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
	}


/* 中央告知ブロック */

#information {
	font-size:12px;
	font-weight: bold;
	color:white;
	text-align:left;
	line-height:20px;
	width:500px;
	height:auto;
	margin:20px auto auto auto;
	padding:10px 15px 10px 15px;
	background-color:rgba(20, 15, 48, 0.8);
	border-radius: 10px;
	}
#information ul {
	margin:10px 0 0 0 ;
	padding:0 10px 0 10px;
	}
#information li {
	margin:0 0 0 5px;
	padding:0;
	color:white;
	list-style:disc;
	}
#information p {
	/*font-size: 14px; */
	color:white;
	}
#information a {
	/*font-size: 14px; */
	color:white;
	width: 125px;
	margin: 0 0 6px 0;
	padding: 0 0 0 0;
	text-decoration:none;
	}
#information a:hover {
	color: gold;
	}

#news-container {
	height: 150px;
	overflow-y: auto;
	margin-top:5px;
	padding:5px 10px;
	border:1px dotted white;
}
#news-container summary {
	display: flex;
	align-items: flex-start;
    list-style: none;
	cursor: pointer;
}
#news-container .news-date {
	width: 120px;
	flex-shrink: 0;
}
#news-container .news-title {
	flex: 1;
}
#news-container .news-contents {
    margin: 0.5rem;
    padding: 0.5rem 1rem;
    font-size: smaller;
    background-color: rgba(255, 255, 255, 0.9);
    border-radius: 5px;
}
#news-container .news-contents p {
	margin: 0;
	color: #2C2B49;
}
#news-container .news-contents a {
	color: rgba( 0, 50, 150, 0.85 );
	
	text-decoration: underline;
	text-decoration-color: rgba( 0, 50, 150, 0.85 );
	
}

#sub_info {
		/* font-size: 14px;*/
		margin-top: 10px;
	}
#sub_info li {		
		margin:0 0 0 5px;
			}
#sub_info a {
		/* font-size:14px;*/
		margin:0 3px 0 3px;
	}

#links {
	height:auto;
	width:100%;
	margin:0;
	padding:5px 0 15px 0;
	position:fixed;
	bottom:0px;
	left:0px;
	font-size: 12px;
	line-height:20px;
	text-shadow:1px 1px 3px black;
	background-color: rgba( 0, 0, 0, 0.8 );
	}
#links ul {
	margin:0 10px 0 0;
	padding:0;
	}
#links li {
	padding:0;
	display:inline;
	}
#links a {
	color:white;
	width: 125px;
	margin: 0 0 6px 6px;
	padding: 0 0 0 6px;
	border-left: 4px solid gold;
	text-decoration:none;
	}
#links a:hover {
	color: gold;
	}
	
.qrcode {
	float: right;
	width:80px;
	border:0;
	padding:0;
	margin:20px 20px 0 10px;
	}

.note {
	width: 62px;
	}





