@charset "utf-8";



/* CSS Document */
main section{
	margin: auto;
	max-width: 1050px;
}
@media print,screen and (min-width:769px){main section{width: 90%}}
@media screen and (max-width:768px){

	main section{
		padding: 4vw;
		width: 100%;
	}

}

main h2 {font-family: serif}
main h3 {
	color: #1E55BA;
	font-family: serif;
}
@media print,screen and (min-width:1025px){

	main h2, main h3 {text-align: center}

	main h2 {
		font-size: 300%;
		margin: 0 0 .5em 0;
	}
	main h3 {font-size: 240%}

}
@media print,screen and (max-width:1024px) and (min-width:769px) {

	main h2 {
		font-size: 240%;
		margin: 0 0 .5em;
		text-align: center;
	}

	main h3 {
		font-size: 210%;
		text-align: left;
	}

}
@media screen and (max-width:768px){main h3 {font-size: 5vw}}


.navBar{background: #000}

.navBar ul,
.en_route_nav{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding-top: 2px;
}
.navBar ul li,
.en_route_nav li {
	background: url(../../img/bg_navbar.jpg) center left / contain repeat-x;
	text-align: center;
	border-left: 1px solid #76C476;
	border-right: 1px solid #000;
}
@media print,screen and (min-width:769px){

	.navBar ul,
	.en_route_nav{
		margin: auto;
		max-width: 1050px;
		width: 90%;
	}
	.navBar ul li,.en_route_nav li {width: calc(100% / 4)}

	.en_route_nav li:first-child,
	.en_route_nav li:last-child{
		background:transparent;
		border: none;
	}

}
@media screen and (max-width:768px){

	.navBar ul,.en_route_nav{width: 100%}
	.navBar ul li{width: calc(100% / 4)}
	.en_route_nav li{width: calc(100% / 2)}

	.en_route_nav li:first-child,
	.en_route_nav li:last-child{display: none}

}



.navBar ul li a,
.en_route_nav li a{
	cursor: pointer;
	color: #FFF;
	font-weight: 700;
	display: block;
	text-decoration: none;
}
@media print,screen and (min-width:769px){

	.navBar ul li a,.en_route_nav li a{
		font-size: 119%;
		padding: 7px 0 1px;
	}

}
@media screen and (max-width:768px){

	.navBar ul li a,.en_route_nav li a{
		font-size: 3.75vw;
		padding: 7px 0;
	}

}
.navBar ul li a:hover,
.en_route_nav li a:hover {background: url(../../img/bg_navbar_on.jpg) repeat-x}



@media print,screen and (min-width:769px){.three_columns {padding: 2em}}
@media screen and (max-width:768px){.three_columns {padding: 4vw}}

.three_columns dl{
	display: flex;
	flex-wrap: wrap;
}
.three_columns dl:not(:last-child){margin-bottom: 2.5em}
.three_columns dl dd:last-child{
	align-items: end;
	display: flex;
	justify-content: center;
	position: relative;
}
.three_columns dl dd:last-child a{display: block}
@media print,screen and (min-width:1025px){

	.three_columns dl dt small{font-size: small}
	.three_columns dl dt{width: 27%}
	.three_columns dl dd{
		font-size: 110%;
		padding: 0 1.5em;
		width: 55%;
	}
	.three_columns dl dd:last-child{
		padding: 0;
		width: 18%;
	}
	.three_columns dl dd:last-child a{width: 100%}

}
@media print,screen and (max-width:1024px) and (min-width:769px) {

	.three_columns dl dt{
		margin-right: 5%;
		width: 47.5%;
	}
	.three_columns dl dt small{font-size: small}

	.three_columns dl dd{width: 47.5%}

	.three_columns dl dd:last-child{
		padding-top: .5em;
		width: 100%;
	}
	.three_columns dl dd:last-child a{
		margin: auto;
		width: 30%;
	}
	.three_columns dl dd:nth-child(even){font-size: 1.9vw}

}
@media screen and (max-width:768px){

	.three_columns dl dd:last-child{
		padding-top: .5em;
		width: 100%;
	}
	.three_columns dl dt {padding-bottom: 2%}
	.three_columns dl dt a{display: block}
	.three_columns dl dt small{font-size: x-small}

	.three_columns dl dd:last-child a{
		margin: auto;
		width: 50%;
	}

}






/* ---------------- CONTESNT ---------------- */
.main section:nth-child(3), .main section:nth-child(10), .main section:nth-child(12), .main ul:nth-child(13){background: #FFF}
.bgBlack section{
	color: #FFF;
	text-align: center;
}
.bgBlack section p:nth-child(2) span{color: red}
@media print,screen and (min-width:769px){

	.bgBlack section p:nth-child(2){font: 700 210% sans-serif}
	.bgBlack section p:nth-child(2) span{font-size: larger}

	.bgBlack section figure{padding: 1em 0 2em}
	.bgBlack section figure figcaption{padding-top: 1em}

	.bgBlack section .left{
		display: block;
		text-align: left;
	}

}
@media screen and (max-width:768px){

	.bgBlack section p:nth-child(2){
		font: 700 120% sans-serif;
		text-align: left;
	}
	.bgBlack section p:nth-child(2) big{
		display: block;
		font-size: 150%;
		text-align: center;
	}
	.bgBlack section big:nth-child(3){font-size: small}

}


.tableArea{
	color: #000;
	background: #FFF;
	margin-top: .5em;
	width: 100%;
}
table caption {
	padding: .5em;
	text-align: center;
}

.tableArea table td:only-of-type{
	background: #FFF;
	padding: 0;
}
@media print,screen and (min-width:769px){

	.tableArea table{table-layout: fixed}
	.tableArea table td{white-space: pre-line}

	table caption {font-size: 180%}
	table caption small br{display: none}

}
@media screen and (max-width:768px){

	.tableArea table td{}

	table caption {font-size: 120%}
	table caption small{display: block}

}

.tableArea thead {
	/*background: #F2F2F2;*/
	border: 2px solid #111;
	box-sizing: border-box;
	border-spacing: 0;
	font-size: 91%;
	text-align: center;
}
.tableArea thead td {
	box-sizing: border-box;
	border: 1px solid #111;
	padding: .25em 0;
}

.tableArea .capTable {
	background: #F2F2F2;
	border-top: 2px solid #000;
	margin-top: .25em;
	padding: .15em 0;
	text-align: center;
	width: 100%;
}

.tableArea tbody {background: #FF9}
.tableArea tfoot {background: #C0C0C0}
.tableArea tbody td, 
.tableArea tfoot td{
	border-bottom: 1px solid #111;
	border-left: 2px solid #111;
	border-right: 2px solid #111;
	border-top: 1px solid #111;
	font-size: 100%;
	font-weight: 700;
	padding: 5px;
}

.tableArea tbody tr.tableBgBlue {background: #DDEBF7}
.tableArea tbody tr.tableBgGreen {background: #DCF2C2}
.tableArea tbody tr.tableBgGreen2{background: #E2EFDA}
.tableArea tbody tr.tableBgPink {background: #FFD4CC}
.tableArea tbody tr.tableBgOrange {background: #FFE699}
.tableArea tbody tr.tableBgGray {background: #D9D9D9}
.tableArea tbody td span {font-size: 88%}

.tableArea table td:nth-child(2){text-align: center}
.bgGreen {
	padding: .75em 0;
	text-align: center;
}
.tableArea table tbody td:first-child{text-align: center}
@media print,screen and (min-width:769px){

	.tableArea table thead th br{display: none}
	.tableArea table thead th:first-child {width: 5%}
	.tableArea table thead th:nth-child(2) {width: 10%}
	.tableArea table thead th:nth-child(3) {width: 12%}
	.tableArea table thead th:nth-child(4) {width: auto}
	.tableArea table thead th:nth-child(5) {width: 35%}
	.tableArea table thead th:nth-child(6) {width: 14%}

}
@media screen and (max-width:768px){

	.tableArea table{font-size: small}

	.tableArea table thead th:first-child {width: 5%}
	.tableArea table thead th:nth-child(2) {width: 8%}
	.tableArea table thead th:nth-child(3) {width: 8%}
	.tableArea table thead th:nth-child(4) {display: auto}
	.tableArea table thead th:nth-child(5) {width: auto}
	.tableArea table thead th:nth-child(6) {width: auto}

	.tableArea table tbody td:nth-child(4) {}

}


/* 就職実績 */
@media print,screen and (min-width:769px){.success section{padding: 2em}}
@media screen and (max-width:768px){.success section{padding: 1em}}

.bgYellow div{
	align-items: center;
	justify-content: center;
}
@media print,screen and (min-width:769px){

	.bgYellow div{
		display: flex;
		flex-wrap: wrap;
	}
	.bgYellow div p:first-child{width: 45%}
	.bgYellow div p:last-child{
		font: 700 132% sans-serif;
		order: -1;
		padding-right: 2em;
		width: 55%;
	}

}
@media screen and (max-width:768px){.bgYellow div p:last-child{font-size: small}}



/* 専攻紹介 */
.course{padding: 2em 0}
.course dl:not(:last-child){margin-bottom: 1em}
.course dl:nth-of-type(1){background: #FE0000}
.course dl:nth-of-type(2){background: #C7A359}
.course dl:nth-of-type(3){background: #28A7D2}

.courseBox{padding: .5em}
.courseBox dd{width: 55%}
.courseBox dt h3{color: #000}
.courseBox dd{
	background: #FFF;
	position: relative;
}
.courseBox dd::before{
    background: linear-gradient(to bottom right, rgba(255,255,255,0) 50%, #FFF 50.5%) no-repeat top left / 100% 100%;
	bottom: 0;
	content: '';
	height: 100%;
	position: absolute;
	right: 100%;
	width: 5em;
}
.courseBox dd p{
	font-weight: 700;
	width: calc(100% / 2);
}
.courseBox dd p:first-child{padding-left: 1em}
.courseBox dd p img{width: 100%}
.course .courseLink a, .entrance .entranceLink a{display: block}
.course .courseLink a{
	margin: 0 .5em 0 auto;
}
.entrance .entranceLink a{
	margin: auto;
}
@media print,screen and (min-width:768px){

	.course .courseLink a{width: 25%}
	.entrance .entranceLink a{width: 30%}

}
@media screen and (max-width:767px){

	.course .courseLink a{width: 45%}
	.entrance .entranceLink a{width: 60%}

}

@media print,screen and (min-width:769px){

	.courseBox dt{
		font-size: 1.2rem;
		width: 45%;
	}

	.courseBox, .courseBox dd{
		align-items: center;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}

}
@media print,screen and (max-width:1024px) and (min-width:769px) {

	.courseBox dt{font-size: 1.3vw}
	.courseBox dd p{font-size: 1.5vw}

}
@media screen and (max-width:768px){

	.course h2{
		margin-bottom: .5em;
		text-align: center;
	}
	.courseBox dd{
		align-items: center;
		display: flex;
		flex-wrap: wrap;
		margin-left: auto;
		width: 82.5%;
	}
	.courseBox dd p:first-child{font-size: 3vw}

}
@media screen and (max-width: 480px) {.courseBox dd{width: 79%}}




/* 講師紹介 */
@media print,screen and (min-width:769px){.instructor {padding: 2em}}
@media screen and (max-width:768px){.instructor {padding: 1em}}

.instructor dl{background: #FFF}


.instructor .instructorBox{margin-bottom: 1em}


.instructor div {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.instructor div dl dd{line-height: 1.4}
.instructor div dl dd strong{padding-right: 1em}
.instructor div dl dd p{
	padding-top: .25em;
	text-align: initial;
	text-justify: initial;
	word-break: initial;
}
@media print,screen and (min-width:769px){

	.instructor div dl{
		display: flex;
		flex-wrap: wrap;
		width: calc(99% / 2);
	}
	.instructor div dl:first-child{width: 100%}
	.instructor div dl dt{width: 210px}
	.instructor div dl dt img{
		/*height: 100%;
		object-fit: cover;
		width: 100%;*/
	}

	.instructor div  dl:not(:nth-last-child(-n+2)){margin-bottom: 1%}

	.instructor div dl dd{
		font-size: 90%;
		padding: .5em .5em .5em .75em;
		width: calc(100% - 210px);
	}

}
@media print,screen and (max-width: 980px) {

	.instructor div dl dt{width: 150px}
	.instructor div dl dd{width: calc(100% - 150px)}

}
@media screen and (max-width:768px){

	.instructor div dl{
		font-size: 95%;
		padding: .5em;
		width: 100%;
	}
	.instructor div dl:not(:last-child){margin-bottom: 3%}
	.instructor div dl dt{
		align-items: center;
		display: flex;
		justify-content: start;
		width: 100%;
	}
	.instructor div dl dt img{
		float: left;
		margin-right: .5em;
		width: 50%;
	}
	.instructor div dl dd{
		clear: both;
		width: 100%;
	}
	.instructor div dd{padding-top: .5em}
	.instructor div dt strong, .instructor div dd strong{display: block}

}
@media screen and (max-width:500px){

	.instructor .instructorBox dt{
		margin-right: 5%;
		width: 60%;
	}

}



/* 設備環境 */
.equipment ul li{
	background: #FFF;
	text-align: center;
}
.equipment ul li img{width: 100%}
.equipment ul li p{font-size: medium}
@media print,screen and (min-width:769px){

	.equipment {padding: 2em}
	.equipment ul{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.equipment ul li{width: calc(100% / 2.1)}
	.equipment ul li:not(:nth-last-child(-n+2)){margin-bottom: 3%}

}
@media screen and (max-width:768px){

	.equipment {padding: 1em}
	.equipment ul li{margin-bottom: 1em}

}



/* 学生生活 */



/* 入学関連 */
@media print,screen and (min-width:769px){.entrance{padding: 2em}}
@media screen and (max-width:768px){

	.entrance{padding: 1em}
	.entrance h2{padding-bottom: 1em}

}
.bgBlue h2{color:#FFF}



/* その他 */
.other p{
	border-bottom: 2px solid #999;
	font-size: larger;
	margin-bottom: 2em;
}
.other .linkList{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.other .linkList ul li{text-align: center}
.other .linkList ul li:not(:last-child){margin-bottom: 1.5em}
@media print,screen and (min-width:769px){.other .linkList ul{width: calc(100% / 3.2)}}
@media screen and (max-width:768px){

	.other .linkList ul:not(:last-child){width: calc(100% / 2.1)}
	.other .linkList ul:last-child{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		width: 100%;
	}
	.other .linkList ul:last-child li{width: calc(100% / 2.1)}

}