@charset "utf-8";

/* ¥È¥Ã¥×¥á¥¤¥ó¥¤¥á©`¥¸
----------------------------------------------------- */

#topimg {
width: 100%;
height: 300px;
background-image:url(/campus-cms/syusyokushien/images/topimg.jpg);
background-position:center top;
background-repeat:no-repeat;
background-size:cover;
}

.topimgbox {
width:980px;
margin:0 auto;
text-align:center;
padding:36px 0 0 0;
}

.topimgbox h2 {
font-size:32px;
color:#2fadd7;
text-shadow: 2px 2px 1px #FFF,-2px 2px 1px #FFF,2px -2px 1px #FFF,-2px -2px 1px #FFF;
}

.topimgbox p {
font-size:20px;
font-weight:700;
color:#082028;
text-shadow: 2px 2px 1px #FFF,-2px 2px 1px #FFF,2px -2px 1px #FFF,-2px -2px 1px #FFF;
}

@media screen and (min-width: 751px) and (max-width: 970px) {
	#topimg {
	height:235px;
	}
	.topimgbox {
	width:100%;
	padding:150px 0 0 0;
	}
	.topimgbox h2 {
	text-align:center;
	}
	.topimgbox p {
	text-align:center;
	}
}


@media screen and (max-width: 750px) {
	#topimg {
	height:auto;
	}
	.topimgbox {
	width:100%;
	text-align:left;
	padding:90px 0 0 0;
	}
	.topimgbox h2 {
	font-size:18px;
	padding:0 10px;
	}
	.topimgbox p {
	font-size:15px;
	padding:0 10px;
	}
}



/* É϶Î
----------------------------------------------------- */

#index01 {
width:100%;
margin:0 auto;
}

.index01box {
width:980px;
margin:0 auto;
overflow:hidden;
}

.index01box h3 {
margin:0 0 1em 0;
text-align:center;
}

.index01box h3 img {
vertical-align:bottom;
}


.index01box p {
width:90%;
font-size:16px;
color:#000;
line-height:1.8;
margin:0 auto;
text-align:left;
}

.index01box ul {
margin:2em 0 3em 0;
overflow:hidden;
}

.index01box ul li {
float:left;
margin:0 0 0 20px;
text-align:center;
line-height:1.3;
}

.index01box ul li:first-child {
margin:0;
}

.index01box ul li img {
margin:0 0 1em 0;
}

.index01box ul li a {
display:block;
width:180px;
height:170px;
color:#000;
padding:20px 0 0 0 ;
background-color:#F4F4F4;
border:2px solid #2fadd7;
border-radius:6px;
-moz-border-radius:6px;
-webkit-border-radius:6px;
text-decoration:none;
background: linear-gradient(-45deg, #F4F4F4, #FFF);
}

.index01box ul li a:hover {
color :#FFF;
background: linear-gradient(-45deg, #2fadd7, #2fadd7);
}

@media screen and (min-width: 751px) and (max-width: 970px) {
	.index01box {
	width:100%;
	}
	.index01box ul {
	width:98%;
	margin:2em auto;
	}
	.index01box ul li {
	width:18%;
	margin:0 0 0 2%;
	}
	.index01box ul li a {
	width:100%;
	}
	.index01box ul li a img {
	width:54px;
	margin:0 0 0.5em 0;
	}
}


@media screen and (max-width: 750px) {
	.index01box {
	width:96%;
	}
	.index01box p {
	width:96%;
	font-size:14px;
	}
	.index01box ul {
	width:100%;
	margin:2em auto;
	}
	.index01box ul li {
	width:46%;
	margin:0 2% 2% 2%;
	}
	.index01box ul li a {
	width:100%;
	height:150px;
	padding:30px 0 0 0 ;
	}
	.index01box ul li:first-child {
	margin:0 2% 2% 2%;
	}
	.index01box ul li a img {
	width:54px;
	margin:0 0 0.5em 0;
	}
}


/* ¶þ¶Î½M
----------------------------------------------------- */

#index02 {
width:980px;
margin:0 auto;
overflow:hidden;
}

.index02_r {
width:70%;
float:right;
text-align:left;
}


@media screen and (min-width: 751px) and (max-width: 970px) {
	#index02 {
	width:98%;
	}
	.index02_r {
	width:68%;
	}
}


@media screen and (max-width: 750px) {
	#index02 {
	width:96%;
	}
	.index02_r {
	width:96%;
	float:none;
	margin:0 auto 1em auto;
	}
}



/* ¶þ¶Î½M£ºÓÒ£ºÖØ´ó¤Ê¤ªÖª¤é¤»
----------------------------------------------------- */

#important {
margin:0 0 2em 0;
}

#important h3 {
width:220px;
font-weight:normal;
font-size:20px;
color:#FFF;
padding:4px 0 0 0;
background-color:#2fadd7;
text-align:center;
border-top-left-radius:6px;
border-top-right-radius:6px;
}

.importantbox {
border:2px solid #2fadd7;
padding:30px 36px 16px 36px;
}

.importantbox h2 {
font-size:22px;
font-weight:700;
line-height:1.3;
color :#F03748;
padding:0 0 0 36px;
background-image:url(/campus-cms/syusyokushien/images/icon_important.jpg);
background-position:0 0;
background-repeat:no-repeat;
margin:0 0 0.6em 0;
}

.importantbox p {
margin-left:36px;
color:#000;
line-height:1.8;
}

@media screen and (min-width: 751px) and (max-width: 970px) {
	.importantbox{
	padding:30px 20px 16px 20px;
	}
}

@media screen and (max-width: 750px) {
	.importantbox{
	padding:30px 20px 16px 20px;
	}
	.importantbox h2 {
	font-size:22px;
	background-position:0 0em;
	}
	.importantbox p {
	margin-left:0;
	}
}


/* Inforomation
----------------------------------------------------- */

.information {
margin:0 0 3em 0;
overflow:hidden;
}

.information h3 {
font-size:20px;
border-bottom:2px solid #555;
margin:0 0 1em 0;
}

.information dl {
overflow:hidden;
padding:8px 0;
border-bottom:1px dotted #333;
}

.information dl dt {
width:30%;
float:left;
}

.information dl dt span {
font-size: 13px;
color:#FFF;
padding:0 13px;
margin:0 14px 0 0;
background-color: #F1546A;
}

.information dl dt span.publications {
padding:0 10px;
background-image: url(/campus-cms/syusyokushien/images/bg_green.jpg);
}

.information dl dt span.schedule {
display:block;
padding:0 4px;
margin:0;
background-color: #1e9b3d;
display:block;
}

.information dl dt span.report {
display:block;
padding:0 4px;
margin:0 12px 0 0;
background-color: #2fadd7;
}

.information dl dd {
width:70%;
float:right;
}


@media screen and (max-width: 750px) {
	.information dl dt {
	width:100%;
	float:none;
	}
	.information dl dd {
	width:100%;
	float:none;
	}
	.information dl dt span.schedule,
	.information dl dt span.report {
	display:inline-block;
	}
}


/* indexbn
----------------------------------------------------- */

#indexbn {
border:1px solid #AAA;
background-color:#CCC;
padding:2px;
}

.indexbnbox {
width:100%;
background-color:#FFF;
display:table;
}

.indexbn_l {
display:table-cell;
width:72%;
padding:14px 20px 8px 30px;
}

.indexbnbox h3 {
font-size:26px;
font-weight:700;
line-height:1.3;
letter-spacing:0.2em;
}

.indexbnbox p {
font-size:18px;
margin:0;
}

.indexbn_r {
width:28%;
display:table-cell;
vertical-align:middle;
padding:10px 0 0 0;
background-image:url(/campus-cms/syusyokushien/images/bg_green.jpg);
}

.indexbn_r a {
color:#FFF;
display:block;
font-size:20px;
font-weight:700;
line-height:1.3;
text-decoration:none;
padding:0 0 0 60px;
background-image:url(/campus-cms/syusyokushien/images/arrow_ten.png);
background-repeat:no-repeat;
background-position:left top;
}

.indexbn_r a:hover {
color:#FFFF00;
}

@media screen and (min-width: 751px) and (max-width: 970px) {
	.indexbn_l {
	width:66%;
	padding:14px 4px 8px 14px;
	}
	.indexbnbox h3 {
	font-size:20px;
	}
	.indexbnbox p {
	font-size:14px;
	}
	.indexbn_r {
	}
	.indexbn_r a {
	color:#FFF;
	font-size:16px;
	padding:0 0 0 50px;
	}
}


@media screen and (max-width: 750px) {
	.indexbnbox h3 {
	font-size:20px;
	}
	.indexbnbox p {
	font-size:13px;
	}
	.indexbn_l {
	width:100%;
	padding:10px 12px;
	display:block;
	}
	.indexbn_r {
	width:100%;
	display:block;
	}
	.indexbn_r a {
	color:#FFF;
	font-size:18px;
	padding:6px 0 10px 60px;
	}
	.spnone {
	display:none;
	}
}