﻿
body{
width: 100%;
text-align:center;
overflow-x: hidden;
font-family: 
"fot-tsukuardgothic-std",
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
"Yu Gothic UI",}

p
{font-size:0.9rem;
letter-spacing:0.1rem;
line-height:1.2;
 width:95%;
 padding-bottom:5%;
margin:auto;
white-space: pre-wrap;}



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

a:hover
{color:#800000;}

/* ****************ここからヘッダーのレイアウト***************** */
.header
{margin:auto;
padding: 1%;
width: 98%;
}

/* ヘッダー画像の大きさと場所。display:blockしないと位置移動できない */
.header img{width:60%;
display:block;
text-align:left;}

/* ****************トップページ以外のページ題目***************** */

.headtitle{width:100%;
background:#efefff;
}

.headtitle p{
width:94%;
text-align:center;
font-size:1.5rem;
padding:3%;
margin-top:1%;}


/* ****************トップページの写真のレイアウト***************** */
.phototop
{width:100%;
margin: 0 auto;
 }

.phototop img
{width: 100%;}


/* ****************トップページのバナーリンク系のレイアウト***************** */

.phototop2
{width:30%;
margin: 0.5% auto;
font-size:2rem;
display:flex;
}

.phototop2 img
{width: 100%;
 display:block;
 margin: 3% auto;}

/* ****************ここからメニューのレイアウト***************** */

ul#menu {
	list-style-type: none;
	width: 100%;
	background: #f4eaff;
	opacity: 0.9;
	position: absolute;
	left: 0px;
	top: 70px;
	z-index: 990;
	font-size:1rem;
	display: none;
        overflow-x: hidden;
	
}

ul#menu li {
	text-align: center;
}

ul#menu li a {
	text-decoration: none;
	display: block;
	padding: 15px 0;
}

ul#menu li a:hover {
	background: #a9a9a9;
	opacity: 0.7;
}




/* -- div#sp-icon -------------------------------------------------------------------------------- */

div#sp-icon {
	width: 100px;
	height: 80px;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 999;
}



div#sp-icon span,
div#sp-icon span:before,
div#sp-icon span:after {
	display: inline-block;
	width: 30px;/*3本線の長さ*/
	height: 3px;/*3本線の太さ*/
	background: #000000;
	position: absolute;
	transition-property: transform;
	transition-duration: 0.3s;
}

/*ハンバーガーメニューの位置*/
div#sp-icon span {
	left: 50%;
	top: 50%;
	transform: translate( -50%, -50% );
}

div#sp-icon span:before {
	content: "";
	transform: translateY( -10px ) translateX(-15px) rotate( 0deg );
}

div#sp-icon span:after {
	content: "";
	transform: translateY( 10px ) translateX(-15px) rotate( 0deg );
}


div.sp-open span {
	background: transparent !important;
}

div.sp-open span:before {
	transform: rotate( 45deg ) !important;
}

div.sp-open span:after {
	transform: rotate( -45deg ) !important;
}


/* ****************ここからフッターのレイアウト***************** */

/* フッター */
.footer
{
text-align: center ;			/* テキスト、画像の真ん中寄せ */
margin:3% auto;			/* 他のブロックとのスペース */
height:3%;
font-size:0.8rem;
width: 90%;
}

ul.contact li{
	display: flex;
	align-items: center;
	height: 1.5rem;
}

ul.contact span{
	font-size: 1.5rem;
	padding-right: 1%;
}

/* ****************お問合せページのレイアウト***************** */
ul.contact{list-style:none;}

ul.contact li{font-size:0.8rem;}

.contact{width:90%;
margin: auto;
padding:1%;}

.contact img{width:30%;}


/* ****************ここからbannerのレイアウト***************** */

.banner1{width:100%;
display:flex;
margin:1% auto;}

.banner1 img{width:100%;}



/* ****************ここから内容のレイアウト***************** */
.naiyou
{width:95%;
padding:0.5%;
margin: 0.5% auto;
font-size: 0.9rem;
text-align: left;
box-sizing: border-box;
border-bottom:solid 1px #6356a3;
}

/* *個別ページの見出しの設定のレイアウト* */

h1.topic
{padding: 2%;
 margin-bottom:10%;
 font-size:1rem;
 line-height:1.5rem;
border-bottom: solid #6356a3;
}

/* *新着情報* */

p.whatsnew{
width:98%;
font-size:1.3rem;
font-weight:bold;
letter-spacing:0.2rem;
padding:1%;
margin:5% auto;
background:#e5e5ff;
border-left:solid 5px #330065;}

/* *<title>（開講科目等）のレイアウト* */

.title
{font-size:1.2rem;
 font-weight: bold;
 padding:2% 0%;
color:#6356a3;
}

/* ****************ここからindexページのお知らせ部分のレイアウト***************** */

table.front{width:100%;
padding-bottom:5%;
border-collapse:collapse;}

td.f1
{border-bottom: 0.1rem solid #000000;
 width:15%;
 font-size:0.8rem;
 text-align:center;
 padding:2%;
 }

td.f2
{border-bottom: 0.1rem solid #000000;
 width:85%;
 font-size:0.8rem;
 text-align: center;
 padding: 2%;}

td.f3
{border-bottom: 0.1rem solid #000000;
 width:15%;
 font-size:0.8rem;
 
 margin:0 auto;
 }

td.f4
{border-bottom: 0.1rem solid #000000;
 width:85%;
 font-size:0.9rem;
letter-spacing:0.1rem;
padding-left: 5%;
 padding-top:10%;
 padding-bottom:10%;}


/* *『過去のお知らせ』文字のレイアウト* */
p.past
{text-align:right;
 padding: 2%;
 font-size:0.9rem;}


/* ****************Youtubeのレイアウト***************** */

.youtube
{
width: 95%;
padding:1%;
margin:auto;
font-size: 0.9rem;
line-height: 1rem;
border:solid 0.1vw #dcdcdc;
box-sizing: border-box;
text-align: left;
}


.video2{width:100%;
margin:0 auto;
text-align:center;
display:flex;
justify-content: space-between;}

/*aspectの部分はいじらないこと */
.video2 iframe{
width:95%;
height: auto;
margin:0 auto;
aspect-ratio:16/9;
padding-top:1%;}

p.ytitle{width:90%;
margin:auto;
font-size:0.9rem;}

.ytitle2{font-size:1rem;
 font-weight: bold;
letter-spacing:0.3rem;
width:90%;
margin: 3% auto;
}

.ytitle2 a{color:#6356a3;}

.ytitle2 a:hover{color:#800000;}

/* ****************ここから科目紹介のレイアウト***************** */

table.subject{width:100%;

margin-bottom:10%;
padding-bottom:10%;
font-size:0.9rem;
border:solid 1px #d3d3d3;
border-collapse:collapse;}

th.hi{
width:20%;
background:#ffdbdb;
border:solid 0.1rem #d3d3d3;
text-align:center;
font-weight:bold;}

th.se{
width:20%;
background:#e5e5ff;
text-align:center;}

caption.grade{font-size:1.2rem;
font-weight:bold;
text-align:left;
padding-bottom:1%;}

table.subject td{
width:80%;
border: solid 0.1rem #d3d3d3;
padding:1%;
}

ul.sub2022{list-style:none;}

ul.sub2022 li{margin-left:15%;
font-size:0.9rem;
letter-spacing:0.1rem;
padding:5% 0;}


p.sup{width:100%;
font-size:0.8rem;
text-align:left;
padding:0;
margin:0;
}

table.classex{width:95%;
margin: 2% auto;
border: solid 0.1rem #bbb;
border-collapse: collapse;
}

table.classex th{width:10%;
padding:2%;
text-align:center;
border: solid 0.1rem #bbb;
background:#f5deb3;}

td.day{width:15%;
padding:3%;
text-align:center;
background:#f5deb3;
font-size:0.9rem;
border: solid 0.1rem #bbb;}

table.classex td{width:15%;
padding:3%;
text-align:center;
font-size:0.8rem;
border: solid 0.1rem #bbb;
word-break: break-all;}

td.hissyu{background:#fafad2;}

/* ****************取得可能な資格の表***************** */

.shikaku1{
width:98%;
box-sizing: border-box;

margin:2%;
padding:2%;}


.shikaku{font-size:0.9rem;
list-style-type:square;
margin-left:2%;}

.shikaku li{padding:2%;
margin-left:4%;}

/* ****************就職率の表***************** */

.photoss{width:100%;
margin:auto;
}

.photoss img
{width:98%;
padding:1%;
}


.etop{width:100%;
border:solid 1px #000000;
border-collapse:collapse;
margin-bottom:5%;
}

.etop th{
border-bottom:solid 1px #000000;
font-size:0.8rem;
background:#d1d1ff;
text-align:center;
padding:1%;}

.etop td{width:20%;
text-align:center;
font-size:0.9rem;
padding:2%;
border-bottom:dotted 1px #000000;}


/* ****************ここから進路・就職先一覧表***************** */


/*〇年度の文字*/
p.stitle{font-size:1.1rem;
letter-spacing:0.1rem;
font-weight:bold;
}

table.shinro1{
width:100%;
margin-bottom:5%;
margin-auto;
border-collapse:collapse;
font-size:0.8rem;}

table.shinro1 th{
width:30%;
background:#e5e5ff;
border:solid 1px #000000;
padding:1%;
letter-spacing:0.1rem;
text-align:center;}

table.shinro1 td{
width:70%;
border:solid 1px #000000;
padding:1%;
letter-spacing:0.1rem;
}

table.shinro1 ul{margin-left:10%;
padding:1%;}

table.shinro1 ul li{padding:1%;
font-size:0.8rem;}

/* ****************ここから教職員紹介のレイアウト***************** */

.profframe{width:100%;
margin:auto;
display:flex;
flex-wrap:wrap;}

ul.prof2023{
width:45%;
margin-left:2%;
margin-bottom:2%;
padding-left:2%;
border:solid 1px #000000;
list-style:none;
letter-spacing:0.1rem;
}

/*役職（教授など）*/
li.p1{
font-size:0.8rem;
padding:2%;}

/*名前*/
li.p2{font-size:1.1rem;
padding:2%;}

/*研究分野*/
li.p3{font-size:0.9rem;
padding:2%;}



/* **********各教員個別のページ********** */

/*先生の名前*/
span.name2{
margin-top:8%;
margin-left:3%;
font-size:1.5rem;
letter-spacing:0.2rem;
font-weight:bold;}

/*職名*/
span.position2{
margin-top:35;
font-size:1.2rem;
letter-spacing:0.2rem;}

/*研究分野、担当科目などのリスト*/
dl.profk{width:90%;
margin-left:3%;}

dl.profk dt{
width:50%;
font-size:0.9rem;
padding:1% 2%;
margin-top:5%;
letter-spacing:0.1rem;
background:#e5e5ff;
}

dl.profk dd{
width:100%;
padding:1%;
margin-left:0%;
margin-top:3%;
font-size:0.9rem;
letter-spacing:0.1rem;
border-bottom:solid 1px #dbdbff;}


/*研究テーマのタイトル*/
p.ptitle{width:95%;
font-size:1.1rem;
font-weight:bold;
letter-spacing:0.2rem;
line-height:1.8;
padding:2%;
margin:5% auto;
background:#e5e5ff;
border-left:solid 5px #330065;}

/*研究テーマの写真*/
.prophoto{
width:95%;
margin:auto;
flex-wrap:wrap;}

.pro2{width:95%;
font-size:0.9rem;
margin:5% auto;}

.pro2 img{width:100%;}


/* ****************大学院ページプログラム配属レイアウト***************** */


ul.master{width:95%;
padding:1%;
margin:auto;
font-size:1rem;}

ul.master li{padding-bottom:3%;}



/* ****************ここから出張講義のレイアウト***************** */

table.lect
{width:95%;
 margin:2% auto;
border-collapse:collapse;
letter-spacing:0.1rem;}

td.le1
{width:25%;
 border: solid 1px #000000;
 background:#d1d1ff;
 padding: 2%;
 text-align: center;
 font-size:0.8rem; }


td.le2
{width:75%;
 border: solid 1px #000000;
 background:#d1d1ff;
 padding: 2%;
 text-align: center;
 font-size:0.8rem; }


td.le3
{width:20%;
 border: solid 1px #000000;
 text-align: center;
 font-size:0.8rem; 
padding: 2%;}

td.le4
{width:80%;
 border: solid 1px #000000;
 padding: 2%;
 font-size:0.8rem; }

p.lec{color:#ff0000;}

/* ****************各ページの写真の設定***************** */

.photod{width:100%;
margin:auto;
}

.photod img{width:98%;
padding:1%;
}

p.blog{white-space:pre-wrap;}

ul.lunchmenu{width:90%;
margin:auto;
letter-spacing:0.1rem;
padding-bottom:3%;
}

ul.lunchmenu li{list-style-position:inside;
padding-top:1%;
padding-bottom:1%;}

p.gtitle{font-size:1.1rem;
letter-spacing:0.1rem;
font-weight:bold;
}


/* ****************事務室より***************** */

.jimu{width:100%;
margin: 10% auto;
padding-top:2%;
padding-bottom:1%;
border:solid 1px #706cae;}

p.jimu1{width:95%;
margin: auto;
white-space: pre-wrap;}

.jimu legend{margin-left:5%;
padding:0 1%;
font-size:1.2rem;
}






