@charset "utf-8";

@import url(https://fonts.googleapis.com/css?family=Open+Sans+Condensed:700);

/* ===== Universal Reset ===== */
html{height:100%;}
body { background:#FFFFFF; height:100%; font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif}
*{
	margin:0;
	padding:0;
}

body > #container  {
    height: auto;
}


img {
	border: none;
}

.bn {
	margin-top: 10px;
}
h1,h2,h3{ padding:0; margin:0; color:#444; font-weight:normal}
a,
a:visited{ text-decoration:none; color:#444;}

ul,li{list-style-type:none;}

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

/*header*/
#header{ width:100%; height:10vh; position:relative; box-sizing:border-box; border-bottom:1px solid #ccc}
#header h1{ height:100%}
#logo{ width:100%; height:100%; margin:0; padding:0; position:relative;float: left;}
#logo a{ display:block; width:50%; height:100%;  margin-left:5px; text-indent: -9999px; background:url(../images/logo.png) no-repeat left center;background-size:100%;}
#header ul.spMenuBox{ position:absolute; right:0; top:0px}
	#header ul.spMenuBox li{}
	#header ul.spMenuBox li a{ display:block;box-sizing:border-box}
	#header ul.spMenuBox li.menu{ position:absolute; width:13vw; right:1vw; top:1vh; height:8vh}
	/*#header ul.spMenuBox li.menu a{ background:#065c40 url(../images/menu_ic.png) no-repeat center center; background-size:50%; height:8vh; text-indent:-9999px; border-radius:9vw}*/
	#header ul.spMenuBox li.menu a,
	#header ul.spMenuBox li.menu span{
		display: inline-block;
		transition: all .4s;
		box-sizing: border-box;
	}
	#header ul.spMenuBox li.menu a{
		position: relative;
		width:100%;
		height:8vh;
		background:#065c40;
		border-radius:9vw;
	}
	#header ul.spMenuBox li.menu span{
	position: absolute;
	left: 0;
	width: 60%;
	height: 4px;
	background-color: #fff;
	border-radius: 4px;
	left:50%;
	margin-left:-30%;
	}
	#header ul.spMenuBox li.menu span:nth-of-type(1) {
		top: 2vh;
	}
	#header ul.spMenuBox li.menu span:nth-of-type(2) {
		top: 3.7vh;
	}
	#header ul.spMenuBox li.menu span:nth-of-type(3) {
	bottom: 2vh;
	}
	
	#header.openNav ul.spMenuBox li.menu span:nth-of-type(1) {
	-webkit-transform: translateY(1.65vh) rotate(-45deg);
	transform: translateY(1.65vh) rotate(-45deg);
	}
	#header.openNav ul.spMenuBox li.menu span:nth-of-type(2) {
	opacity: 0;
	}
	#header.openNav ul.spMenuBox li.menu span:nth-of-type(3) {
	-webkit-transform: translateY(-1.65vh) rotate(45deg);
	transform: translateY(-1.65vh) rotate(45deg);
	}

	
	#header ul.spMenuBox li.oc{ position:absolute; right:16vw; top:1vh; height:8vh;border:1px solid #ccc;box-sizing:border-box;border-radius:5px}
	#header ul.spMenuBox li.oc a{ background:url(../images/oc_form_ic.png) no-repeat center 4px; height:8vh; background-size:18%; padding-top:4vh; text-align:center; font-size:9px; line-height:1.2em; color:#444; width:29vw; }
	#header ul.spMenuBox li.oc a strong{ font-weight:bold; font-size:10px}

@media(max-width:320px){
	#header ul.spMenuBox li.oc a{ padding-top:3.5vh; }
}

#header nav{ display:none}
#header.openNav nav { display:block; position:absolute; top:8vh; z-index:1000; width:100%;}
#header nav ul li{ width:100%; box-sizing:border-box; border-bottom:1px solid #ccc; font-size:14px}
#header nav ul li a{ background:#065c40; display:block; padding:10px; color:white}


#mainImg{ width:100%;padding-bottom:0px;}
#mainImg img{ width:100%;}

#wrapper ul.topNav{}
#wrapper ul.topNav li{ width:50%; float:left}
#wrapper ul.topNav li a{ display:block; position:relative}
#wrapper ul#banner.topNav li.long{ width:100%;}

#wrapper ul.topNav li a img{width:100%}
#wrapper ul.topNav li a p{
	position:absolute; bottom:0; left:0;
	background-color:rgba(231,249,240,0.9);
	background-image:url(../images/menuBackBorder.png);
	padding:15px 0;
	text-align:center;
	font-size:16px;
	color:#444;
	width:100%;
	line-height:1.2em;
}
#wrapper ul#banner.topNav li.long a p{ padding:10px 0; line-height:1.4em}
#wrapper ul.topNav li a p.att{background-color:rgba(249,231,234,0.9);}
#wrapper ul.topNav li a p strong{ font-size:18px}
#wrapper ul.topNav li a p.sp{background-color:rgba(4,155,161,0.9);background-image:none; color:white; background-image:url(../images/menuBackBorder_sp.png);}


#news{ color:#444;}
#news h2{ border-bottom:1px dotted #ccc; padding:20px 0; text-align:center; font-size:24px;}
#news ul li{ padding:10px; border-bottom:1px dotted #ccc; background:url(../images/sp_news_arrow.png) no-repeat 2% 2vh; background-size:4%; padding-left:7%;}
#news ul li a{ display:block; color:#444;}
#news ul li div.news_date{ font-size:12px; padding-bottom:5px}
#news ul li div.news_headline{ font-size:14px}
#news ul li div.news_headline a.important{ display:inline; background:#fcff00; padding:2px;}
#news a.list{ display:block; padding:10px 0; background:#e1e1e1; text-align:center; font-size:14px}

#recommend{ padding:10px 0; background:#e7f9f0}
#recommend h2{ padding:20px 0; text-align:center; font-size:24px;}
#recommend ul li{ width:50%; float:left}
#recommend ul li a{ display:block; text-align:center; padding-bottom:20px}
#recommend ul li a img{ width:70%; padding-bottom:10px}
#recommend ul li a p{ font-size:16px;}

#footmenu ul{ border-top:2px solid #ccc;}
#footmenu ul li{ width:50%; box-sizing:border-box; float:left}
#footmenu ul li a{ display:block; background:#f9f9e1; padding:10px; text-align:center; border-bottom:2px solid #ccc}
#footmenu ul li a img{ width:40%; padding-bottom:0px;}
#footmenu ul li:nth-child(odd) a{ border-right:1px solid #ccc}
#footmenu ul li:nth-child(even) a{ border-left:1px solid #ccc}
#footmenu ul li a p{ font-size:14px;}

.policy{ padding:10px; text-align:center; font-size:12px; background:#e1e1e1}

footer{ font-size:12px; text-align:center; padding:10px;}

/*modalカレンダー*/
div.kobetsu{ width:95%; margin:0 auto}
div.kobetsu h1{ font-size:20px; padding:30px 0 10px 0; color:white}
div.kobetsu p.lead{ color:white}
div.kobetsu table{ width:100%; table-layout:fixed; border-collapse:collapse; border-top:1px solid #ccc; border-left:1px solid #ccc; margin-bottom:20px}
div.kobetsu table caption{ font-size:20px; text-align:center; color:white}
div.kobetsu table caption a.month{
    background: #848484;
    color: white;
    padding: 0;
    text-align: center;
    border-radius: 14px;
    -moz-border-radius: 14px;
    -webkit-border-radius: 14px;
    width: 2.1em;
    height: 1.2em;
    display: inline-block;
    font-size: 1.5em;
    line-height: 1em;
    margin: 0 0 0.4em;
}
div.kobetsu table caption a.month:hover{ opacity:0.7}
div.kobetsu table th,
div.kobetsu table td{ padding:0px; text-align:center; border-bottom:1px solid #ccc; border-right:1px solid #ccc; background:white}
div.kobetsu table th{ background:#848484; color:white}
div.kobetsu table td.saturday{ background:#cde7f4}
div.kobetsu table td.holiday{ background:#ffdcdc}
div.kobetsu table td.active{ position:relative; background:#d3d554; font-weight:bold; cursor:pointer}
div.kobetsu table td a{ display:block; font-weight:bold}
div.kobetsu table td a:hover{ opacity:0.7; cursor:pointer}
div.kobetsu table td a,
div.kobetsu table td span{
	padding:10px;
	display:inline-block;
}
div.kobetsu table td.today{ border:2px solid #065c40; padding:8px}
div.kobetsu p span{ display:inline-block; background:#d3d554; padding:10px; margin-right:20px}
div.kobetsu p span.today{ display:inline-block;border:2px solid #065c40; padding:8px 10px; background:white}

div.soudanDate{ width:95%; margin:0 auto}
div.soudanDate h1{ font-size:20px; padding:30px 0 10px 0; color:white}

div.soudanDate ul li{ width:100%; padding-bottom:10px}
div.soudanDate ul li a{ display:block; padding:7px 10px; margin-right:3px; background:#d3d554;border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	margin-bottom:5px; font-weight:bold; font-size:18px; color:white; text-align:center}
div.soudanDate a{ color:white; font-size:16px}


body.rsTable  {
    font-family: "メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",sans-serif;
    font-size: 13px;
}
body.rsTable .notice{
	color:#FF0000;
}
.rsTable table{
	border:1px solid #999999;
	border-collapse:collapse;
}
.rsTable table th,
.rsTable table td{
	border:1px solid #999999;
	color: #666666;
	font-weight:normal;
	text-align:left;
}
.rsTable table th{
   background-color:#fbffd8;
}
#calendarBlock{
	opacity:1;
	transition:opacity 0.3s linear;
	min-height:270px;
}
#calendarBlock.calendarHidden{
	opacity:0;
}
@media (max-width: 420px){
	.rsTable table{
		width:100%;
	}
.rsTable table th,
.rsTable table td{
	display:block;
}
.rsTable table hr{
	border:0;
}
input[type="text"],
input[type="tel"],
input[type="email"] {
    width: 95%;
    display: block;
    margin: 0.5em auto;
}
input[name="school_name"], 
input[name="university_name"], 
input[name="other_name"] {
    width: 10em;
    display: inline;
    margin: 0;
}
input[type="submit"] {
    width: 95%;
    display: block;
    margin: 0.5em auto;
    height: 2.5em;
}
input#returnbutton, input#submitbutton {
    width: 46%;
    margin: 0.5em 1.5%;
    height: 2.5em;
}	
}


a.column2.borders{ display:block; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; border:1px solid #ccc; width:auto; margin:0 10px 10px 10px; min-height:17vh; padding:10px 1%}

a.column2.borders h3{ background:url(../image/arrow_boxlink.gif) no-repeat right center; margin:0 0 10px 0; font-size:16px; padding:0 0 3px 5px; color:#8ab100;}
#common_content h3.line{ border-bottom:1px dotted #ccc}
a.column2.borders p{ color:#555; padding:0 0 0 2px; font-size:14px}


.indexBanner{}
.indexBanner a.column2 img{ width:20%; float:right; margin:0 10px 0 0}
	

#wrapper h1{
		height:18vh;
		/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#04432f+0,087551+100 */
		background: #04432f; /* Old browsers */
		background: url(../image/border.png),-moz-linear-gradient(top, #04432f 0%, #087551 100%); /* FF3.6-15 */
		background: url(../image/border.png),-webkit-linear-gradient(top, #04432f 0%,#087551 100%); /* Chrome10-25,Safari5.1-6 */
		background: url(../image/border.png),linear-gradient(to bottom, #04432f 0%,#087551 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04432f', endColorstr='#087551',GradientType=0 ); /* IE6-9 */
		margin:0 0 20px 0;
		color:white;
		border-bottom:5px solid #ccc;
	}
#wrapper h1 img{ width:38%; top:10px; right:5px; margin:0;}
#wrapper h1 strong{ font-size:18px; position:relative; padding:3vh 0 5px 10px; left:auto; top:auto; display:inline-block}
#wrapper h1 p{ font-size:12px; padding-left:10px; width:50%; left:auto; top:auto; font-weight:normal}