@charset "utf-8";
/* CSS Document */

/* ------------------------------------------  
COMMON
------------------------------------------ */
*{
	margin:0;
	padding:0;
	box-sizing:border-box;
}

html {overflow-y: scroll;}

body {
	height: 100%;
	margin: 0 auto;
	-webkit-text-size-adjust: 100%;
	color:#36696f;
	background:#ece7da;
	text-align:center;
	font-size:medium;
	line-height:1.6em;
	letter-spacing:0.5px;
	font-family:"Noto sans JP","¥Ò¥é¥®¥Î½Ç¥´ Pro W3","Hiragino Kaku Gothic Pro","¥á¥¤¥ê¥ª",Meiryo,"£Í£Ó £Ð¥´¥·¥Ã¥¯",sans-serif;
	font-weight:300;
}

span.sans{
		font-family: "Open Sans","Noto sans JP","¥Ò¥é¥®¥Î½Ç¥´ Pro W3","Hiragino Kaku Gothic Pro","¥á¥¤¥ê¥ª",Meiryo,"£Í£Ó £Ð¥´¥·¥Ã¥¯",sans-serif;
		font-weight:700;}
		
span.num{font-family: 'Work Sans', sans-serif;font-size: 108%; color:#ece7da;}

a			{outline: none; color: #a74c21; text-decoration:none; font-weight: 400;}
a:visited	{color: #813e1f;}
a:hover		{
			-webkit-transition:0.3s;
			-moz-transition: 0.3s;
			-o-transition: 0.3s;
			transition: 0.3s;
			}
a:active	{color: #a74c21;}

img {
	border:none;
	max-width: 96%;
	margin:0 2% 20px;
	width: auto\9;
	height: auto;
	vertical-align:bottom;
}

p img {
	max-width: 100%;
	margin:0;
}

a img:hover	{
	opacity: 0.7;
	-webkit-transition:0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	transition: 0.5s;
}

p{
	margin:0 2% 20px;
	line-height:1.5em;
	letter-spacing:0;
	font-size:95%;
}
	.set.half > div p, .grid2 p, .set.three > div p, .grid3 p, .grid4 p{margin:0 1% 10px;}

em{color:#cb4435;font-style:normal;}
strong{font-weight:700;}

hr{
	clear:both;
	border:#bbab96 solid 1px;
	margin:50px 0;
}

.right	{float:right;}
.left	{float:left;}
.center{text-align:center;}
.aligncenter{
    text-align: center;
    margin: 0 auto;
    display: block;
}

dl{margin:0 2% 10px;}
dl dt{font-size:130%; margin:30px 0 5px; padding-bottom: 5px; border-bottom: 1px dashed #b2a586;}

iframe {width:100%;}
			
.txt_xl{font-size:140%;}
.txt_l{font-size:120%;}
.txt_n{font-size:100%;}
.txt_s{font-size:80%;}
.txt_serif{font-family:"¥Ò¥é¥®¥ÎÃ÷³¯ Pro W3","Hiragino Mincho Pro","£Í£Ó¡¡£ÐÃ÷³¯","MS PMincho",serif;}
	
.mt_0{margin-top:0;}
.pb_0{padding-bottom:0;}


/* ------------------------------------------  
HEADER
------------------------------------------ */
header{
	position:absolute;
	width:100%;
	display:block;
	top:0;
	z-index:99;
}

h1{
	display:block;
	width:96%;
	max-width:980px;
	margin:0 auto;	
}

	h1 a{
		display:block;
		float:left;
		width:120px;
		height:100px;
		margin:30px 0 0;
		text-indent:-99999px;
		background-image:url(/campus/img/h1_img.png);
		background-image/*\**/: url(/campus/img/logo_h1_ie.png)\9;
		background-repeat:no-repeat;
		background-size:contain;
	}
	
	.eyecatch{margin:0;max-width:100%;width:100%;}

	
@media screen and (max-width:768px) {
	h1 a{margin-top:25px;width:110px;}
}

@media screen and (max-width:540px) {
	header{left:2%;width:100px;}
	h1 a{width: 100px;height: 60px;}
}

/* ------------------------------------------  
PC,SP¡¡ÇФê¤ï¤±
------------------------------------------ */
.pc{display:block;}
.sp{display:none;}

@media screen and (max-width: 540px) {
.pc{display:none;}
.sp{display:block;}
.inner > p br{display:none;}
.inner > p .spbr{display:inline;}
}

/* ------------------------------------------  
MOVIE
------------------------------------------ */
#movie{
	width: 100%;
	margin:0;
	padding:0;
	padding-top: 40%;
	position:relative;
	overflow: hidden;
	top: 0;
	left: 0;
	z-index: 2;
	vertical-align: bottom;}

video {
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	position:absolute;
	right: 0;
	top: 0;
	z-index:1;
	vertical-align: bottom;}

/* ------------------------------------------
MENU
------------------------------------------ */
#main_nav{
	width:100%;
	background:#163b3f;
	font-weight:400;
}

	#main_nav ul{
   		display: block;
   		width: 96%;
   		max-width:1026px;
		margin:0 auto;
	}

	#main_nav ul li{
		display:block;
		float:left;
		list-style:none;
	}

		#main_nav ul li a{
			display:block;
			color:#ece7da;
			padding:18px 15px;
		}

		#main_nav ul li#menu1{width:16.15%;}
		#main_nav ul li#menu2{width:17.12%;}
		#main_nav ul li#menu3{width:18.33%;}
		#main_nav ul li#menu4{width:18.33%;}
		#main_nav ul li#menu5{width:14.96%;}
		#main_nav ul li#menu6{width:15.11%;}

		#main_nav ul li a:hover{background:#092426;}
	
.sp_menu{display:none;}

@media screen and (max-width:768px) {
	#main_nav ul{width:100%;}
	#main_nav ul li a{padding:15px 12px;border-bottom:1px solid #ece7da;}
	
	#main_nav ul li#menu1,
	#main_nav ul li#menu2,
	#main_nav ul li#menu3,
	#main_nav ul li#menu4,
	#main_nav ul li#menu5,
	#main_nav ul li#menu6{width:33.33%;}
	
.sp_menu{
	display:block;
	width:100%;
	height:50px;
	background: rgba(53, 97, 92, 0.73);
	position:fixed;
	z-index:20;
	bottom:0;
}

	.sp_menu ul{margin-left:0;}

	.sp_menu li{
		display:block;
		width:22%;
		float:left;
		list-style-type:none;
	}

	.sp_menu li a{
		display:block;
		font-size:85%;
		color: #ece7da;
		line-height:50px;
	}
	
	.sp_menu li a:hover{background:rgba(22, 59, 63, 0.73);}
	
	.sp_menu #sp_menu3,.sp_menu #sp_menu4 {width:28%;}

	.sp_menu #sp_menu1 a:before,
	.sp_menu #sp_menu2 a:before,
	.sp_menu #sp_menu3 a:before,
	.sp_menu #sp_menu4 a:before{
			display: inline-block;
			padding:0 3px 0 0;
			font-family: FontAwesome;
			font-size:100%;
			vertical-align: middle;		
	}
	
	.sp_menu #sp_menu1 a:before{content:"\f015";}
	.sp_menu #sp_menu2 a:before{content:"\f024";}
	.sp_menu #sp_menu3 a:before{content:"\f044";}
	.sp_menu #sp_menu4 a:before{content:"\f08e";}	
}

@media screen and (max-width: 540px) {
	.sp_menu li a{font-size:78%;}
		
	#main_nav ul li a{font-size:90%;padding:13px 12px;}
	#main_nav ul li#menu1,
	#main_nav ul li#menu2,
	#main_nav ul li#menu3,
	#main_nav ul li#menu4,
	#main_nav ul li#menu5,
	#main_nav ul li#menu6{width:50%;}	
}

/* breadcrumbs */
.breadcrumbs {
	width: 96%;
	max-width: 816px;
	min-height: 1.6em;
	line-height: 1.6em;
	padding: 15px 2% 0;
	margin: 0 auto;
	font-size: 80%;
	text-align: left;
	}

	.breadcrumbs a,
	.breadcrumbs a:visited{color:#36696f;}
	
	.breadcrumbs a:hover{font-weight:500;}
	
	.breadcrumbs a:after{
		font-family: FontAwesome;
		content: "\f105";
		padding: 0 1.0em;
		text-decoration: none;	
	}
	
ul.ul_nav{
	margin:40px 2% 20px;
	text-align:center;
}

	ul.ul_nav li{
		display:inline-block;
		font-size:90%;
		margin-left:0;
		text-indent:0;
		margin:0 5px 0 0;
		list-style:none;
		background-image:none;
		padding-left:0;
	}
	
	ul.ul_nav li a{
		width:auto;
		padding: 6px 14px;
		margin:0 0 8px 0;
		color: #ece7da;
		display:inline-block;
		position:relative;
		overflow:visible;
		background-color: #163b3f;
		font-size:90%;
		font-weight:300;
		}

	ul.ul_nav li a:before{
		display: inline-block;
		padding-right:5px;
		font-family: FontAwesome;
		content:"\f107";
		font-size:110%;
	}
	
	ul.ul_nav li a:hover{opacity:0.8;}
	
@media screen and (max-width: 540px) {
	ul.ul_nav{text-align:left;}

	ul.ul_nav li,ul.ul_nav li a{
		display:block;
		width:100%;
	}
}

/* ------------------------------------------  
footer
------------------------------------------ */
footer{
	width:100%;
	text-align: center;
	color:#ece7da;
	font-weight:100;
	background:#163b3f;
	padding:50px 0 20px;
}

	footer p{letter-spacing:1px;}
	
	footer .copy{
		width:96%;
		padding:0 0 30px;
		margin:0 auto;
		font-size: 80%;
	}	

.inner.bn_box{
	width:92%;
	padding:0 4.5% 30px;
	border-bottom:dotted 1px #ccc;
	margin:0 auto 30px;
	}
	
	.bn_box img{
		float: left;
		display: inline;
		margin:0 2% 20px;
		width: 29.33%;
	}
	
@media screen and (max-width: 768px) {	
	footer .copy{margin: 0 auto 20px;}
}
	
@media screen and (max-width: 540px) {
footer{padding:40px 0 20px;}

	footer .copy{
    	width: 91%;
    	font-size: 90%;
	}
	
		.bn_box img{
			display:block;
			float: none;
			width:80%;
			margin: 10px auto;
		}
}

/* ------------------------------------------  
CONTENTS BASE
------------------------------------------ */
.base{
	width:100%;
	padding:50px 0 40px;
}

	.base.green{
		background:#163b3f;
		color:#ece7da;
		}
	
	.base.pd_0{padding-bottom:0;}
	
	.inner{
		max-width:800px;
		width:96%;
		margin:0 auto;
		position:relative;
		z-index:5;
		text-align:left;
	}

	.mt_100{margin-top:100px;}
	.set.three > div.mb_0{margin-bottom:0;}
		
/* pagemove */		
#pagemove {
    position: fixed;
    bottom: 70px;
    right: 10px;
    width: 60px;
    height: 60px;
    text-indent: -99999px;
    background-image: url(/campus/img/pagemove.png);
    background-image/*\**/: url(/campus/img/pagemove_ie.png)\9;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;
    z-index: 200;
}

	
/* ------------------------------------------  
BOX
------------------------------------------ */
/* grid */
.set.three > div,
.set.popup > div,
.grid2,
.grid3,
.grid4,
.half > div,
.set.popup2 > a,
.grid_full{
	float: left;
	display: inline;
	margin:0 2% 20px;
}

.set.three > div,
.set.popup > div{width: 29.33%;}
.grid2,.set.three > div.grid2	{width: 62.67%;}
.grid3	{width: 29.33%;}
.grid4	{width: 21.00%;}
.half > div,.set.popup2 > a	{width: 46%;}
.grid_full {width: 96%;}

.popup img, .point img, .three div img{margin-bottom:10px;}

.set{margin-top: 20px;}
	.set .set{margin-top: 0;}

.box{margin:0 0.5%;}
.set.box div{
	background: #cad3cd;
	padding:12px 10px 10px;
	margin-bottom: 30px;
}
	.set.three.box div h3{
		margin-bottom:5px;
		font-weight:400;
		font-size:110%;
	}
	.set.box div img{margin-bottom:8px;}
	
.border{border:1px solid #36696f;}

.box_gray{
    background: #f4f2ed;
    width: 96%;
    margin: 0 auto 20px;
	padding: 10px 2% 1px;
}

@media screen and (max-width: 540px) {
.inner{padding:20px 0;margin:0 auto;}	

.set.three > div,
.set.popup > div,
.grid2,
.set.three > div.grid2,
.grid3,
.half > div,
.set.popup2 > a,
.grid_full{
	display:block;
	float: none;
	width: 96%;
	clear:both;
	margin:0 2% 30px;
}
}


/* ------------------------------------------  
TITLE
------------------------------------------ */
h2{
	clear:both;
	width:96%;
	height:auto;
	margin:0 auto 40px;
	text-align:center;
	color:#163b3f;
	font-size:180%;
	font-weight:400;
    line-height: 1.3em;
}
	h2 span{
		font-family: "Open Sans","Noto sans JP","¥Ò¥é¥®¥Î½Ç¥´ Pro W3","Hiragino Kaku Gothic Pro","¥á¥¤¥ê¥ª",Meiryo,"£Í£Ó £Ð¥´¥·¥Ã¥¯",sans-serif;
		display:block;
		font-size:51%;
		font-weight:800;
		margin-top: 5px;
		line-height: 1.5em;
	}

	.green h2{color:#ece7da;font-weight:300;}

h3{
	color:#143b3f;
	clear:both;
	width:96%;
	line-height:1.4em;
	margin:30px auto 10px;
	font-size: 120%;
}

	.set.half > div h3, .set.three > div h3, .grid2 h3, .grid3 h3, .grid4 h3{margin:0 1% 15px;}
	.set.half > div h4, .set.three > div h4, .grid2 h4, .grid3 h4, .grid4 h4{margin:0 2% 10px;}
	.box_gray h3{    margin: 15px auto 10px;}

h3 a{color:#78aba9;}
h3 a:visited{color:#78aba9;}

h4{
	clear:both;
	width:96%;
	line-height:1.4em;
	margin: 30px auto 12px;
	font-size: 105%;
	font-weight: 400;
	border-bottom:double 4px #ccc;
	padding-bottom:5px;
}
	div h4{margin:10px auto;}

/* hirosaki */
.point h4{
	font-size:120%;
	font-weight:600;
	letter-spacing:1px;
}

	.point h4 span{
		font-family: "Open Sans","Noto sans JP","¥Ò¥é¥®¥Î½Ç¥´ Pro W3","Hiragino Kaku Gothic Pro","¥á¥¤¥ê¥ª",Meiryo,"£Í£Ó £Ð¥´¥·¥Ã¥¯",sans-serif;
		font-weight:700;
		font-size:100%;
		padding-right: 10px;
		padding-left: 5px;
		margin-right: 10px;
		letter-spacing:0.5px;
		background-image: url(/campus/img/point_bg.png);
		background-image/*\**/: url(/campus/img/point_bg_ie.png)\9;
		background-position:bottom center;
		background-repeat:no-repeat;
		background-size: contain;
	}


/* ------------------------------------------  
table
------------------------------------------ */
table{
	border-collapse: collapse;
	border-spacing: 0;
	width:98%;
	margin:0 1% 40px;
}
	table th,
	table td{
		padding:12px;
		line-height:1.6em;
		text-align:left;
		border:none;
		border-top: #ffffff 2px solid;border-left: #ffffff 2px solid;
	}
	table th{ background-color: #caddd2;font-weight:normal;}
	table td{ background-color:#e7f3ec;}


/* ------------------------------------------  
BUTTON
------------------------------------------ */
a.btn{
	display:block;
	width: 98%;
	color:#36696f;
	font-weight:500;
	font-size:90%;
	letter-spacing:0;
	text-align:center;
	border:solid 1px #36696f;
	padding:6px 1em;
	margin: 25px 1% 0;
}

	a.btn:hover,
	.btn a:hover{
		color:#ece7da;
		background:#163b3f;
	}

div.btn{
	width:100%;
	text-align: center;
	margin: 20px auto;
	clear:both;
}

	.btn a{
		color:#36696f;
		position: relative; 
		overflow: visible; 
		display: inline-block;
		padding: 8px 4em; 
		margin: 10px auto;
		text-decoration: none;
		cursor: pointer;
		border:solid 1px #36696f;
		font-weight:500;
		font-size:90%;
		letter-spacing:0;
		line-height:1.3em;
		max-width:96%;
	}
		.btn.comment a{margin-top:0;}
		
	.green a.btn,
	.green .btn a{
		font-weight:100;
		font-size:105%;
		letter-spacing:1px;
		border:solid 2px #d8a93e;
		color:#e0ad3b;
		padding: 15px 1.7em;
	}
	
	.green .btn a{margin-top:20px;}

		.green a.btn:hover,
		.green .btn a:hover{
			color:#163b3f;
			font-weight:400;
			background:#e0ad3b;
		}
	
	.btn span{
		font-size:85%;
		font-weight:400;
	}
		
/* list */
ul{list-style-position:inside;margin-left: 2%;}
ol{margin: 0 3.5% 40px 3em;}
	ol li{line-height:1.45em;}

/* calender */
.calender{
	width:96%;
	margin:0 auto;}
	
@media screen and (max-width:540px) {
	.btn a{padding: 8px 2.5em;}
	div.btn,.btn a{margin-bottom:0;margin-top:2px;}
}
	
/* a before */
a:before{
	display: inline-block;
	font-family: FontAwesome;
	vertical-align: baseline;
}

a.arrow:before{
	padding:0 5px 0 0;
	content:"\f138";
}
a.pdf:before{
	padding:0 8px 0 0;
	content:"\f1c1";
}
a.blank:before{
	padding:0 8px 0 0;
	content:"\f08e";
}
a.map:before{
	padding: 0 8px 0 3px;
	content:"\f041";
}

/* ×Ó¥Ú©`¥¸ */
.inner .comment{
	width:96%;
	text-align:center;
	font-size: 100%;
	font-weight:400;
	padding: 17px 0;
	border-top: 4px double #bbab96;
	border-bottom: 4px double #bbab96;
	margin-top: 20px;
}

.source{
	font-size:75%;
	margin:15px 1% 20px;
	padding-top:7px;
	border-top:dotted 1px ;
}

.facility.three .half div{margin:0 1%;width:48%;}

.monument{margin-bottom:30px;}
	.monument div{
		float:right;
		width:45%;
		margin:0 1% 1% 2%;
	}
	.set.half > div .monument p{margin:0 2% 10px;}
		
/* ------------------------------------------  
for - 768px
------------------------------------------ */
@media screen and (max-width:768px) {
	body {font-size:92%;}
	.inner{width:94%;}
}

/* ------------------------------------------  
for - 540px
------------------------------------------ */
@media screen and (max-width:540px) {
body,p{line-height:1.7em;}

dl dt{margin-top:20px;}
ol{margin-left:2.5em;}
hr{margin: 20px 1% 30px;}

#pagemove{width: 50px;height:50px;}

/* title */	
h2{font-size:200%; /*margin-bottom: 15px;*/}

h3{font-size:140%;
    margin: 40px auto 10px;}

.set.half > div h3, .set.three > div h3, .grid2 h3, .grid3 h3, .grid4 h3,.set.half > div h4, .set.three > div h4, .grid2 h4, .grid3 h4, .grid4 h4,.set.half > div h5, .set.three > div h5, .grid2 h5, .grid3 h5, .grid4 h5{margin:0 auto 20px;}

/* table */
table{margin-bottom:20px;}
table.resp th,table.resp td{display:block;}
table.resp thead{display:none;}

/* page */
.facility.three .half div{margin:0;width:100%;}
.three.pamph div{margin-bottom:10px;}
.monument div{
	float:none;
	width:96%;
	margin:0 2%;
}

}

/*===CLEARFIX===*/
header:after,
#main_nav:after,
.base:after,
.inner:after,
.set:after,
h3:after,
.ul_nav:after,
.clearfix:after
{
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;}
	
header,
#main_nav,
.base,
.inner,
h3,
.set,
.ul_nav,
.clearfix
{display:inline-block;
vertical-align:bottom;/*϶ég¤Ê¤¯¤¹¤¿¤á*/}

/*Hides from IE-mac \*/
* html header,
* html #main_nav,
* html .base,
* html .inner,
* html h3,
* html .set,
* html .ul_nav,
* html .clearfix
{height:1%;}

header,
#main_nav,
.base,
.inner,
h3,
.set,
.ul_nav,
.clearfix
{display:block;}
/*End hide from IE-mac */