/*Google Fontsの読み込み
---------------------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c&display=swap');

body * {box-sizing:content-box;}
.igakutenmoushikomi{
	margin:5%;
}
#header_image {
    width: 100%;
    padding: 0px;
    z-index: 0;
}
body{
    min-height: 100vh;
	font-family: "M PLUS Rounded 1c", "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;	/*フォント種類*/
	background-image: url(/~gakusei/gakusai/46th/design/haikei7.png);
	background-size: cover;
	text-align: center;
	background-repeat: no-repeat;
	
}
.commingsoon{
	font-size: 50px;
	margin-top: 10%;
	margin-bottom: 100%;
}
#menubar a{
	color:#022d46;
}
/* ページタイトルを決めるCSS */
#page-title{
    font-size: xx-large;
    color:#022d46;
    padding-bottom: 10px;
	padding-top: 20px;
}

#page-title1{
	font-size: xx-large;
    color:#022d46;
    padding-bottom: 30px;
}

/* footer関連のCSS */

/*フッター設定
---------------------------------------------------------------------------*/
small {font-size: 100%;}
footer {
	/*文字サイズ*/
	text-align: center;		/*内容をセンタリング*/
	padding: 1rem;			/*ボックス内の余白*/
	background-color:#6d7b89;	/*背景色。css冒頭で指定しているprimary-colorを読み込みます*/
	color:#fff; /*文字色。
	margin-left: calc(-1 * var(--global-space));	/*変更不要。css冒頭で指定しているglobal-spaceを読み込みます。マイナスをつけてネガティブマージンに。*/
	margin-right: calc(-1 * var(--global-space));	/*変更不要。css冒頭で指定しているglobal-spaceを読み込みます。マイナスをつけてネガティブマージンに。*/
	width:100%;
	margin-bottom:10px;

	
}
p{
	text-align: center;
}
.menu-container {
  display: flex;
  justify-content: center; /* or space-around / center */
  gap: 20px; /* セクション間の余白 */
  flex-wrap: wrap; /* 画面が狭くなったら折り返す */
  padding: 20px;
}

.menu-section {
  width: 20%; /* 各カテゴリの幅（必要に応じて調整） */
  min-width: 180px; /* 最小幅を確保して見崩れ防止 */
}

.menu-section h2 {
  margin-bottom: 10px;
  font-size: 20px;
}

.menu-section ul {
  list-style: none;
  padding-left: 0;
  color: #fff;
}

.menu-section li {
  margin-bottom: 6px;
  font-size: 14px;
  color: #fff;
}

section{
    z-index: 1;
}
ul.icon {
	list-style: none;
	margin: 0;padding: 0;
	text-align: center;
}

/*アイコン１個あたりの設定*/
ul.icon li {
	display: inline-block;	/*リストタグを横並びにさせる指定*/
	padding: 0 10px;
}

/*アイコン画像の設定*/
ul.icon img {
	width: 30px;	/*アイコン画像の幅*/
}

/*画像のマウスオン時*/
ul.icon img:hover {
	opacity: 0.8;	/*透明度。0.8は色が80%出た状態の事。*/
}
.medical-labos-title {
    display: flex;
    text-align: left;
    margin-left: 0;
    width: fit-content;
    border-bottom: 6px solid #022d46;
    /* 下線の上の隙間↓ */
    padding-bottom: 10px;
    /* 下線の下の隙間 */
    margin-bottom: 50px;
    margin-top: 60px;
    position: absolute;
    transform: translateY(-250%);
    top: 0;
    height: 1.8rem;
}

.medical-labos-title img {
    /* 医学科講座　の大きさに合わせる */
    height: 3rem;
    transform: translateY(-20%);

}

.medical-labos-title h2 {
    font-size: xx-large;
    color: #022d46;
    height: fit-content;
}


/*メニューブロック初期設定
---------------------------------------------------------------------------*/
/*メニューをデフォルトで非表示*/
#menubar {display: none;}
#menubar ul {list-style: none;margin: 0;padding: 0;}

/*上で非表示にしたメニューを表示させる為の設定*/
.small-screen #menubar.display-block {display: block;}

/*3本バーをデフォルトで非表示*/
#menubar_hdr.display-none {display: none;}


/*小さな端末用の開閉ブロック
---------------------------------------------------------------------------*/
/*メニューブロック設定*/
.small-screen #menubar.display-block {
	position: fixed;z-index: 100;
	left: 0px;top: 0px;
	width: 100%;
	height: 100vh;
	background: url("") repeat center center / 500px;	/*背景画像の読み込み。最後の数字は画像幅。このサイズでリピートします。*/
	animation: animation1 0.2s both;	/*animation1を実行する。0.2sは0.2秒の事。*/
	display: flex;
	justify-content: center;
}

@keyframes animation1 {
	0% {left: -200px;}
	100% {left: 0px;}
}

/*メニュー本体が記載されているボックス*/
.small-screen #menubar > div {
	position: relative;overflow: auto;
	background: #fff;	/*背景色*/	/*ボックス内の余白*/
	padding:10vw;
	max-width: 70%;		/*最大幅*/
}

/*nav要素*/
.small-screen #menubar nav {
	font-size: 1.5rem;	/*文字サイズを130%に*/
	width:100%;
	margin-top:7vw;
}

/*メニュー１個あたりの設定*/
.small-screen #menubar a {
	display: block;text-decoration: none;
	padding: 1rem;	/*上下、左右へのメニュー内の余白*/
	width:90%;
}


.pagetop-show {display: block;}

/*ボタンの設定*/
.pagetop a {
	display: block;text-decoration: none;text-align: center;z-index: 99;
	position: fixed;	/*スクロールに追従しない(固定で表示)為の設定*/
	right: 20px;		/*右からの配置場所指定*/
	bottom: 20px;		/*下からの配置場所指定*/
	color: #fff;		/*文字色*/
	font-size: 1.5rem;	/*文字サイズ*/
	background: rgba(0,0,0,0.2);	/*背景色。0,0,0は黒の事で0.2は色が20%出た状態。*/
	width: 60px;		/*幅*/
	line-height: 60px;	/*高さ*/
	border-radius: 50%;	/*円形にする*/
}

.dosei{
	display:inline-block;
	width:10%;
}



/*３本バー（ハンバーガー）アイコン設定
---------------------------------------------------------------------------*/
/*３本バーブロック*/
#menubar_hdr {
	display: block;
	position: fixed;z-index: 100;
	top: 20px;		/*上からの配置場所*/
	right: 20px;	/*左からの配置場所*/
	width: 50px;	/*幅*/
	height: 50px;	/*高さ*/
	cursor: pointer;
	background: rgba(0,0,0,0.6) url(/~gakusei/gakusai/46th/images/icon_menu.png) no-repeat center top/50px;	/*背景色、背景画像の読み込み、画像の上半分（３本マーク）を表示。幅は50px。*/
}

/*×印が出ている状態の設定。*/
#menubar_hdr.close {
	background: #2c5defd7 url(/~gakusei/gakusai/46th/images/icon_menu.png) no-repeat center bottom/50px;	/*背景色、背景画像の読み込み、画像の下半分（×マーク）を表示。幅は50px。*/
}

/*メニューの設定
---------------------------------------------------------------------------*/
#menubar ul {list-style: none;}

/*ボックス全体の設定*/
#menubar {
	display: none;				/*デフォルトで非表示にしておく*/
	animation-name: opa1;		/*@keyframesの指定*/
	animation-duration: 1S;		/*アニメーションの実行時間*/
	animation-fill-mode: both;	/*アニメーションの待機中は最初のキーフレームを維持、終了後は最後のキーフレームを維持。*/
	position: fixed;overflow: auto;z-index: 99;	/*fixedはスクロールしても動かない為の指定*/
	left: 0px;top: 0px;
	width: 100%;
	height: 100%;
	padding: 50px;		/*ボックス内の余白*/
	text-align: center;	/*テキストをセンタリング*/
	background: rgba(0,0,0,0.8);	/*背景色*/
	font-size: 1.2rem;	/*文字サイズ。remの単位についてはテンプレート内の解説をお読み下さい。*/
}

/*メニュー１個あたりの設定*/
#menubar li {
	margin-bottom: 20px;	/*下に空けるスペース*/
}

#menubar a {
	display: block;text-decoration: none;
	text-align: center;	/*テキストをセンタリング*/
	background: #fff;	/*背景色*/
	color: #000;		/*文字色*/
	border-radius: 5px;	/*角丸の指定*/
	box-shadow: 0px 0px 50px 10px rgba(95, 186, 243, 0.409);	/*ボックスの影。右へ、下へ、ぼかし幅、範囲。255,255,255は白の事で0.4は色が40%出た状態の事。*/
	padding: 5px;	/*余白*/
}

/*メニュー内のspanタグ（小さい日本語部分）*/
#menubar span {
	display: block;
	font-size: 0.7rem;	/*文字サイズ。remの単位についてはテンプレート内の解説をお読み下さい。*/
}

/*以下変更不要*/
#menubar_hdr div span:nth-child(1) {top: 0;}
#menubar_hdr div span:nth-child(2) {top: 50%;transform: translateY(-50%);}
#menubar_hdr div span:nth-child(3) {bottom: 0;}
#menubar_hdr.ham div span:nth-child(1) {top: 50%;transform: translateY(-50%) rotate(45deg);}
#menubar_hdr.ham div span:nth-child(2) {opacity: 0;}
#menubar_hdr.ham div span:nth-child(3) {top: 50%;transform: translateY(-50%) rotate(-45deg);}