body{
	width:auto;
	max-width:1200px;
	margin: 0 auto;
	font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", sans-serif;
	color: #333333;
	background-color: whitesmoke
}

header, nav, article, aside, section, footer {
    display:block;  /*←新要素はデフォルトではinline要素なのでこの指定が必要。*/
}

header{
	max-width:1200px;
	width:100%;
	margin: 0 auto;
	text-align: center;
	}

a{
	text-decoration: none;
	color: #333333
}

a:hover{
	color: #C40000;
}

hr{
border:none;
border-top:1px #c0c0c0 dotted;
height:1px;
color:#FFFFFF;
width:auto;
}

#kokusai_img{
	padding-right: 5% ;
	height:auto;
	text-align:right;
}


#zen_gaku_article_1{
	width: 85%;
    padding-left: auto;
    height:auto;
    padding:30px;
}

#zen_gaku_article_1 h1{
	color:#FFFFFF
}

#zen_gaku_article_1 h2{
font-size:30px;
	background-color:#cecece;
	color:#333333;
    margin-top:1em;
margin-bottom:1em;
}

#zen_gaku_article_1 h3{
font-size:15px;
margin-left: 35px;
    margin-top:1em;
margin-bottom:1em;}

h4 {
  padding: 0.25em 0.5em;/*上下 左右の余白*/
  color: #333333;/*文字色*/
  background: transparent;/*背景透明に*/
  border-left: solid 5px #c40000;/*左線*/
}

/* --------------------------------------------------------------------------- */

/* 畫面幅800px以下の設定 */
/* --------------------------------------------------------------------------- */

@media screen and (max-width:1200px){
	#menu-s {
		display: block;overflow: hidden;
		border-top: 1px solid #fff;		/*上の線の幅、線種、色*/
		margin-bottom: 16px;
		padding: 0px 0px;
	}

	#menu-s li{
		list-style: none;
	}

	#menu-s li a {
		display: block;text-decoration: none;
		padding: 3px 10px 20px 20px;	/*上、右、下、左へのメニュー内の余白*/
		border-bottom: 1px solid #fff;	/*下の線の幅、線種、色*/
		background: #666;	/*背景色*/
		color: #fff;	/*文字色*/
		font-size: 16px;
        height:5px
	}

	#menu{
		display: none;
	}
    

}
/* -------------------------------------------------------------------------------- */




/* --- 以下お知らせ欄の設定 --- */

article.news{
	width:90%;
	font-size: 100%;
	margin: auto;
}

h2 {
  border-bottom: solid 3px #c4b1b1;
  position: relative;
}

h2:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #C40000;
  bottom: -3px;
  width: 20%;
}



article.news h2 {
	background-color: whitesmoke;
	color: #333;
	font-size: large;
}


/* --- 新着リスト --- */
article.news 

dl {
width: 100%; /* 新着リストの幅 */
margin: 0;
/*
	border-top: 2px #c0c0c0 dotted; /* 新着リストの上境界線 */
	*/}

/* --- 日付エリア --- */
article.news dt {
width: 6.7em; /* 日付エリアの幅 */
float: left;
padding: 7px 0 6px 3px; /* 日付エリアのパディング（上右下左） */
line-height: 120%;
}

/* --- 本文エリア --- */
article.news dd {
margin: 0;
padding: 7px 3px 6px 6.6em; /* 本文エリアのパディング（上右下左） */
border-bottom: 2px #c0c0c0 dotted; /* 本文エリア下境界線 */
line-height: 150%;
}

article.nittei{
	font-size: auto;
}

article.nittei ul{
	list-style: none;
}

/* --- clearfix --- */
.clearFix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearFix {
min-height: 1px;
}

/* --- 以上お知らせ欄の設定 --- */
/* --- 全学共通授業科目の授業日程等 --- */

#zengaku_article{
	width:90%;
	margin: 0 auto;
}



#zengaku_article h1{
font-size:20px;
	background-color:#cecece;
	color:#fff;
padding:7px 0 6px 3px;
margin-top:3em;}


#zengaku_article h2{
	background-color:whitesmoke;
	color:#333333;
	height: 2em;
	margin-top:3em;
}


#footer_all{
	background-color:#292825;
	width:100%;
    max-width: auto;
	height:auto;
	margin: 0px 0 0 0;
	text-align: right;
}

#footer_nav {
  padding:0;
  margin:0;
  width:100%;
}

#footer_nav ul{
	background:#292825;
	width:100%;
	margin: auto;
	text-align: center;
}

#footer_nav li {
  width:calc(100%/4);
  height:auto;
  float:left;
  padding:0;
  margin:0;
  display:block;
 	font-size:80%;
 	color:whitesmoke;
  background:#292825;
 }

 #footer_nav li a {
 font-size:auto;
 display:block;
 background:#292825;
 color:#fff;
 }

 #footer_nav li a:hover {
   text-color:#C40000;
	 background: #6C6C6C}
#footer_hr{
 color:#292825;
 height:5px;

}
/*文字が点滅*/
.blinkS1 {
	-webkit-animation: blink 1s ease infinite;
	animation: blink 2s ease infinite;
}
@-webkit-keyframes blink {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes blink {
	0% {opacity: 0;}
	100% {opacity: 1;}
}



/*タブリスト（履修方法について）---------------------------------------------------------- */

/*ベース*/
section.typeC{
	display: flex;
	flex-wrap: wrap;
    max-width: 80%;
    margin:auto;
    margin-bottom: 1em;
}
section.typeC::after {
	content: '';
	width: 100%;
	height: 3px;
	order: -1;
	display: block;
	background: rgba(255,59,15,0.5) ;
}
section.typeC .tabLabel {	/* タブ */
	margin-right: 3px;
	padding: 3px 12px;
	flex: 1;
	order: -1;
	border-radius: 3px 3px 0 0;
	color: #444;
	background: rgba(255,59,15,0.5);
	transition: .5s ;
	cursor: pointer;
}
section.typeC .tabLabel:nth-last-of-type(1){ margin-right: 0; }
section.typeC input {		/* ラジオボタン非表示 */
	display: none;
}
section.typeC .content {	/* 本文 */
	width: 100%;
	height: 0;
	overflow: hidden;
	opacity: 0;
}
/*アクティブ設定*/
section.typeC input:checked + .tabLabel {
	color: #fff;
	background: rgba(255,59,15,0.9);
}
section.typeC input:checked + .tabLabel + .content {
	padding: 15px;
	height: auto;
	overflow: auto;
	box-shadow: 0 0 5px rgba(0,0,0,.8);
	transition: .5s opacity;
	opacity: 1;
}

.important {
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 5px;
   margin-bottom: 10px;
   border: 2px solid #444444;
   width: 100%;
}

.important_date {
	font-size: 80%; color: gray;
}

/*ボタンのデザイン*/

a.btn_17 {
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	position: relative;
	width: 300px;
	margin: auto;
	padding: 0.5rem 0.5rem 1rem;
	font-weight:medium;
	color: #333333;
	background: #D8D8D8;
	transition: 0.3s ease-in-out;
}
a.btn_17::before {
  content: '';
  position: absolute;
  top: -5px;
  left: -5px;
  width: calc(100% - 4px);
  height: calc(100% - 4px);
  border: 2px solid #787878;
  transition: 0.2s;
}
a.btn_17:hover {
	background: #C40000;
	color: #fff;
}
a.btn_17:hover::before {
  top: 0;
  left: 0;
}
.button-001 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 350px;
    margin:0 auto;
    padding: .5em 2em;
    border: 1.5px solid gray;
    border-radius: 5px;
    background-color: #cecece;
    color: #424242;
    font-size: 1em;
}

.button-001::after {
    transform: rotate(45deg);
    width: 5px;
    height: 5px;
    margin-left: 10px;
    border-top: 2px solid #424242;
    border-right: 2px solid #424242;
    content: '';
}
.button-001:hover {
	background: #C40000;
	color: #fff;
	
	
}
.button-002 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 350px;
    margin:0 auto;
    padding: .5em 2em;
    border: 1.5px solid black;
    border-radius: 5px;
    background-color: #C40000;
    color: white;
    font-size: 1em;
}

.button-002::after {
    transform: rotate(45deg);
    width: 5px;
    height: 5px;
    margin-left: 10px;
    border-top: 2px solid #424242;
    border-right: 2px solid #424242;
    content: '';
}
.button-002:hover {
	background: #000;
	color: #fff;
	
	
}
.list-012 {
    list-style-type: none;
    padding: 1em;
}

.list-012 li {
    display: flex;
    align-items: center;
    gap: 0 10px;
    position: relative;
    padding: .3em .3em .3em 1.5em;
}

.list-012 li::before,
.list-012 li::after {
    position: absolute;
    content: '';
}

.list-012 li::before {
    left: 0;
    width: 1.1em;
    height: 1.1em;
    border-radius: 50%;
    background-color: gray;
}

.list-012 li::after {
    left: .6em;
    transform: translateX(-75%) rotate(-45deg);
    width: .3em;
    height: .3em;
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
}

.bottom-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  display: flex;
  justify-content: space-around;
  background-color: #fff;
  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
  padding: 10px 0;
  z-index: 1000;
}

/* 各ナビゲーションアイテムのスタイル */
.nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
  color: #333;
  font-size: 14px;
}

/* アイコン画像のスタイル */
.nav-item img {
  width: 40px;
  height: 40px;
  margin-bottom: 5px;
  transition: transform 0.3s;
}

/* ホバー時の効果 */
.nav-item:hover img {
  transform: scale(1.1);
}

/* アイテムテキストのスタイル */
.nav-item p {
  margin: 0;
  font-size: 12px;
  font-weight: 500;
  color: #333;
}

/* --- レスポンシブ対応 --- */

/* スマートフォン (480px以下) 用 */
@media (max-width: 480px) {
  .bottom-nav {
    padding: 15px 0; /* スマホで余裕を持たせる */
  }
  .nav-item img {
    width: 30px; /* アイコンサイズを小さくする */
    height: 30px;
  }
  .nav-item p {
    font-size: 10px; /* テキストサイズを小さくする */
  }
}

/* タブレット (768px以下) 用 */
@media (max-width: 768px) {
  .bottom-nav {
    padding: 12px 0;
  }
  .nav-item img {
    width: 35px; /* アイコンサイズを調整 */
    height: 35px;
  }
  .nav-item p {
    font-size: 11px; /* テキストサイズを調整 */
  }
}

/* デスクトップ (768px以上) 用 */
@media (min-width: 769px) {
  .bottom-nav {
    padding: 10px 0;
  }
  .nav-item img {
    width: 40px; /* 標準のアイコンサイズ */
    height: 40px;
  }
  .nav-item p {
    font-size: 12px; /* 標準のテキストサイズ */
  }
}

.button-container {
        text-align: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 10px auto;
    max-width: 800px;
}

.modern-button {
    display: inline-block;
    width: 20%; /* 全てのボタンの幅を統一 */
    padding: 10px 10px;
    font-size: 0.9em;
    color: #424242; /* カラーコードには # をつける */
    background-color: #cecece;
    border: none;
    border-radius: 5px;
    text-align: center;
    text-decoration: none;
    transition: background-color 0.3s ease;
    margin: 5px; /* 隙間を追加 */
}

.modern-button:hover {
    background-color: #C40000;
    color: #ffffff; /* 文字色を白に設定 */
}
.modern-button:active {
    background-color: #fff;
}