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

#header{
	width:100%;margin:0px;padding:0px; padding-top:20px;height:80px;background:white;position:relative; z-index: 99;}
#toplogo{margin:0 auto;padding:0px;width:100%;text-align: left;}
#toplogo img{width:250px;display:block;margin:0 auto;padding:0px;margin-top:20px;margin-bottom:20px;}
#toplogo img{width:250px;display:block;margin:0 auto;padding:0px;margin-top:20px;margin-bottom:20px;}
h2.toptext{
	border-bottom:5px solid #09112c; 
	font-weight: normal; 
	text-align: center;
	margin:0px; 
	padding:0px;
	padding-left:0px;
	color:#09112c;
	margin-bottom:20px;
	margin-top:20px;
	font-size:25px;
	
}
h2.toptext.toptext1{max-width:900px;width:100%;margin:0 auto;margin-top:10px;}
h2.toptext.top1{max-width:1200px;width:100%;margin:0 auto;margin-top:0px;}
#header{height:140px;}
#header #nav{height:60px;background:#091051;}
#header #nav  ul {
  letter-spacing: -.4em;
  width:100%;
	text-align: center;
	margin:0 auto;
	padding:0px;
	margin-top:0px;height:100%;
	line-height: 60px;

}
#header #nav  ul li {
	text-align: center;
  letter-spacing: normal;
  display: -moz-inline-box;
  display: inline-block;
  *display: inline;
  *zoom: 1;
	vertical-align: top;
	margin:0;
	letter-spacing: 3px;
	margin:0px 40px;
}
#header #nav ul li a {
  font-size: 15px;
	margin:0;
  font-weight: bold;
  color: white;
	padding:0px;
	width:100%;
	height:100%;
	text-decoration: none;
	
}
#header #nav ul li a:hover, #header #nav ul li.active{
  border-bottom:1px solid white;
}



@media only screen and (max-width: 1200px) {
	#header #nav  ul li{}
}
@media only screen and (max-width: 800px) {
#header { height:100px;}
	

#header .inner{width:100%;}
	#header #nav{height:20px;width:100%;}
#header #nav  ul {display:none;margin:0 auto; width:100%; padding:0px;position:absolute; top:65px;left:0px; }
#header #nav  ul li{margin:0px; width:100%;}
#header #toplogo {
  margin:0 auto;
  margin-bottom:0px;
  display:block;
	width:200px;
	padding:0px;
	
}
#header #toplogo img{width:100%}


#header #nav  ul.active{display:block;}
#header ul.active li{margin:0px;padding:0px;width:100%; color:black;height:50px; line-height:50px; border-bottom: thin solid white;}
#header ul.active li:first-child{}
#header ul.active li a{font-size:12px;color:white; display:block; width:100%; height:100%;}
	
	
#header #nav ul li {
		background-color:rgba(51,51,51,0.9);
	  background-color:#091051;

		border-bottom:solid white 1px;
		position: relative;
		display:block;
		z-index:100;
		width:100%;
		margin:0;
				}
#header #nav ul li a{
		width: 100%;
	height:100%;
		margin:0;
		color:#FFFFFF;
		font-size:20px;
		letter-spacing:1px;
	
		display: block;
	}
	
#header #nav ul li a:hover, #header #nav ul li.active{
  background-color:white;
	color:#091051;
}
	
	
	
.menu-trigger,
.menu-trigger span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
}
#toggle{position: relative; left:20px;top:-20px;width:40px;height:40px;}
.menu-trigger {
  position: absolute;
  width: 25px;
  height: 25px;
	top:-10px;
	
}
.menu-trigger span {
  position: absolute;
  left:0px;
	top:10px;
  width: 100%;
  height: 2px;
  background-color:#091051;
	
  border-radius: 2px;
}
.menu-trigger span:nth-of-type(1) {
  top: -5px;
}
.menu-trigger span:nth-of-type(2) {
  top: 2px;
}
.menu-trigger span:nth-of-type(3) {
  bottom: 0px;
}
.menu-trigger.active span:nth-of-type(1) {
  -webkit-transform: translateY(7px) rotate(-45deg);
  transform: translateY(7px) rotate(-45deg);
}
.menu-trigger.active span:nth-of-type(2) {
  opacity: 0;
}
.menu-trigger.active span:nth-of-type(3) {
  -webkit-transform: translateY(-7px) rotate(45deg);
  transform: translateY(-7px) rotate(45deg);
}
	
}
@media only screen and (max-width: 500px) {
	#header #toplogo {width:40%;}
	#header #nav ul li a{font-size:12px;}

	
}

	
	





/* header menue↑↑↑↑↑↑↑↑ */






.clearfix:after{
    content: "."; 
    display: block; 
    height: 0; 
    font-size:0;    
    clear: both; 
    visibility:hidden;
}


* html .clearfix{
    height: 1%;
}
.clearfix{
    display:block;
}
html, body{width:100%; margin:0px; padding:0px;}
body {
  font-size: 12px;
  width: 100%;
  margin:0px;
  padding:0px;
	line-height: normal;
  -webkit-text-size-adjust: none;
  -webkit-font-smoothing: antialiased;
  color: black;
  background: #FFFFFF;
	letter-spacing: 2px;
 
  font-family: "Open Sans";
  
}
body a {
	text-decoration:none;
	color:black;
  
}
body a:hover {
  
}
body a img {
  
}
body a img:hover {
 
}



#wrapper, #header, #cont{width:100%;margin:0px; padding:0px;}
.inner{max-width:1200px;width:100%; padding:0px;margin:0 auto;}

.cont{text-align: center; width:100%;margin:0px; padding:0px;overflow:hidden;padding-bottom:30px;}
#main{max-width:1200px;width:100%; position:relative;z-index:1;margin:0 auto;padding:0px;height:600px;}
#main div img{width:100%;display:block;text-align: center;margin:0 auto;}
#main div.sp img{width:100%;display:none;text-align: center;margin:0 auto;}
.cont .box{width:90%;max-width:150px; padding:0px;margin-top:20px;}
.cont .box a{width:100%;display:block;}
.cont .box a img{width:100%;display:block;}


dl.event {
	width:100%;
  max-width:900px;
	margin:0 auto;
	margin-top:40px;
	font-size:14px;
	overflow: hidden;
}
dt,dd{height:40px;border-bottom:solid 1px lightgray;line-height:40px;}
dt {
  float:left;
	text-align: left;
	
	
}
dd {
  padding-left:200px;
	text-align: left;
	
}
h3.eventbutton a{width:350px;display:block; font-size:16px;margin:0 auto;padding:5px 8px;margin-top:30px; background:#091051;color:white;}
h3.eventbutton a span{color:red;}
.cont .inner p{font-size:15px;line-height:25px;width:100%; max-width:900px;margin:0 auto;margin-top:20px;text-align: left;}
.cont .inner p span{font-weight: bold;}
#cont4 .inner{max-width:900px;}

#footer{background:#091051;overflow: hidden;padding:0px;padding-top:40px;padding-bottom:40px;}
#footer .inner{width:100%;max-width:900px;margin:0 auto;}
#footerlogo{float:left;width:200px;display:block;}
#footer ul{float:left;margin-left:100px;}
#footer ul li{list-style: none; float:left;margin-right:10px;}
#footer ul li a{color:white;}
#main {position:relative;}
#main #twitter{width:300px; height:400px;  position:absolute;left:20px; top:150px;}
#main #twitter .twitter-timeline{height:400px;}
@media only screen and (max-width: 1200px) {
		.inner{padding:0px;overflow: hidden;}

}
@media only screen and (max-width: 1200px) {
	
}
@media only screen and (max-width: 800px) {
dt {margin-left:10px;}


}


@media screen and (max-width: 500px) {
	body{background:#091051;}
	#main div.sp img{width:100%;display:block;text-align: center;margin:0 auto;}
	#main div.pc img{width:100%;display:none;text-align: center;margin:0 auto;}
	#main{height:340px;}
	#main #twitter{display:block; margin:0 auto; width:90%; height:300px;  position:absolute;left:5%; top:20px;overflow: scroll;}
#main #twitter .twitter-timeline{height:300px;}

	.cont{background:white;width:98%; margin:0 auto;}
.cont{text-align: center; width:100%;margin:0px; padding:0px;padding-top:80px;margin-top:-80px;overflow:hidden;padding-bottom:80px;}
	h2.toptext{font-size:18px;margin:0px;font-weight: bold;}
	dl.event{width:98%; margin:0 auto; padding:0px;margin-top:20px; overflow: hidden;border:solid 1px #091051;font-size:12px;}
	dt,dd{height:auto;min-height:40px;border:none;line-height: normal;}
dt {
  float:none;
	text-align: center;
	width:100%;
	background:#091051;
	color:white;
	margin:0px;
	padding:0px;
	line-height:40px;
	
	
}
dd {
  padding:0px;
	margin:0px;
	padding-top:10px;
	padding-bottom:5px;
	text-align: center;
	width:100%;
	
}
	.cont .inner p{font-size:14px;line-height:25px;width:96%; max-width:900px;margin:0 auto;margin-top:20px;text-align: left;}

	.cont .inner p.br br{display:none;}
	h3.eventbutton a{
		width:80%;
		display:block; 
		font-size:16px;
		margin:0 auto;
		padding:10px 8px;
		margin-top:30px; 
		background:#091051;
		color:white;
		border-radius: 5px;
	}

	.cont .box{margin:0 auto;margin-top:25px;margin-bottom:25px;}
	#footer{width:100%;}
	#footer .inner{width:100%;}


	#footerlogo{float:none;width:100px;display:block;margin:0 auto;}
	#footerlogo a{width:100%; display:block;}
	#footerlogo a img{width:90%; display:block; margin:0 auto;}
#footer ul{float:none;margin:0px;margin-top:10px;padding:0px;width:100%;}
	#footer ul li{margin:0px;text-align: center; width:25%;}
	#footer ul li a{font-size:8px;}

}

@media screen and (max-width: 320px){
	#main #twitter{display:block; margin:0 auto; width:90%; height:280px;  position:absolute;left:5%; top:20px;overflow: scroll;}
#main #twitter .twitter-timeline{height:280px;}
	
}
