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

body{
	font-family:"Lucida Grande", "segoe UI", "ヒラギノ丸ゴ ProN W4", "Hiragino Maru Gothic ProN", Meiryo, Arial, sans-serif;
/* 	background:rgba(255, 50, 0, 0.2); */
	background: url(../img/back_img.PNG) no-repeat fixed; background-size: cover; 
	background-color:rgba(255,255,255,0.5);
background-blend-mode:lighten;
	margin: 0;
   padding: 0;
   width: 100%
		}
		
		#wrapper {
	overflow: hidden;
}
		
			
		#header{
			width:100%;
			height: 100vh;
			color: rgb(255, 255, 255);
			font-weight: bold;
			text-align: center;
			padding: 0;
            position: relative;
            top: 10px;
		}
		
		.header{
			width:auto;
			height:50vh;
/* 			color: rgb(255, 255, 255); */
			font-weight: bold;
			text-align: center;
			padding: 0;
            position: relative;
            top: 10px;
/*             background-color: #fef; */
		}
		
		@media screen and (max-width : 820px){
			.header{
				padding-bottom: 20px;
			}
		}
		
		
		#menu{
			width:100%;
			height:15%;
			background-color: #fff;
			padding:0 0 0px 0;
			
			
		}
		
		#menu_list{
			padding-left:0;
			padding-right:1.5em;
			list-style: none;
			position: relative;
			top: 50%;
  			left: 50%;
  			background-color: #fff;
  			transform: translateY(-50%) translateX(-50%);
  			-webkit- transform: translateY(-50%) translateX(-50%);
/*   			background: #aaa; */
		}
		
		#menu_list li{
			width: 120px;
			text-align: center;
			margin-left:auto;
			margin-right:auto;
/* 			background: #333; */
		}
		
		#menu_list li a{
			text-decoration: none;
			color: #333;
			font-size: 0.9em;		/* できるなら1emで */
		}
		#menu_list li a:hover {
			text-decoration:underline;
		}
		
		@media screen and (min-width : 820px){
			#menu_list{
			display: flex;
			  }
		}
		
		@media screen and (max-width : 820px){
			#menu_list li{
				line-height: 2.5em;
				width: 100%;
		  	}
		  	#menu_list{
		  		padding : 0.7em 0;
		  	}
		  	#menu{
		  		margin: 80px 0;
		  	}
  
		}
		


		/* TOPのタイトル */
		.header_title{
			width:100%;
			font-size: 4.5em;
            position: absolute;
            text-shadow: 3px 3px 0 #cd5;
  			-webkit-text-stroke: 1px #888;
 			text-stroke: 1px #888;
 			top: 50%;
  			left: 50%;
  			transform: translateY(-40%) translateX(-50%);
  			-webkit- transform: translateY(-40%) translateX(-50%);
/* 			background:rgba(255, 50, 0, 0.2); */
		}
		
		@media screen and (max-width : 820px){
			.header_title{
				font-size: 2em;
			}
		}
		
		/* TOP以外のタイトル */
		#header_title{
			font-size: 1.5em;
			padding: 10px 10px 10px;
            margin: 10px 0 0 0;
            position: relative;
            text-shadow: 3px 3px 0 #cd5;
  			-webkit-text-stroke: 1px #888;
 			text-stroke: 1px #888;
/* 			background:#333; */
		}
		#header_title a{
			text-decoration: none;
			color: #555;
		}
		
		@media screen and (max-width : 820px){
			#header_title{
				font-size: 1.3em;
		  	}
		}
		

		
		
		
		#content{
/* 			background: url(../img/back_img.PNG) no-repeat fixed; background-size: cover;  */
background:rgba(255, 209, 209);
		}
		
		/* ページタイトル */
		#main1{
			width:auto;
			margin-top:0px;
			padding:50px;
			position:relative;
/* 			background:#ad7; */
			font-size: 2em;
		}
		
		@media screen and (max-width : 820px){
			#main1{
				padding:0px;
				font-size: 1.6em;
			}
			
		}
		
		.under{
			background: linear-gradient(transparent 70%, #f65 70%);
		}
		
		#kaisai{
	position:absolute;
	z-index:1;
	left: auto;
	top: auto;
	height: 168px;
	width: 679px;
		}
		
		
		.snsbtn{
	overflow: hidden;
	position: absolute;
	right: 20px;
	top: 20px;
	height: auto;
	width: auto;
		}
		
		.snsbtn li{
			float:left;
			margin-right:4px;
		}
		
		.snsbtn iframe{
			margin:0px !important;
		}
		
		.sns {
            display: flex;
            position: absolute;
			right: 5%;
            list-style: none;
/*             justify-content: center; */
            padding: 0;
/*             background:#367; */
            bottom: -1.2em;
        }
        .snsIcon img{
            width: 40px;
            height: auto;
            box-sizing: border-box;
            margin: 20px 20px;
        }
        
        
		
		.fb-like{
		}
		
		#main{
/* 			width:; */
			height:auto;
			min-height:300px;
			margin-top:0px;
			padding-left:50px;
			padding-right:50px;
/* 			background:#af7; */
		}
		
		#gaiyo{
	width: auto;
	height: auto;
	font-size: 1em;
	line-height: 25px;
	padding: 30px;
	font-style: normal;
/* 	text-indent: 5px; */
	background:rgba(255,255,255,0.6);
	position: relative;
  			left: 50%;
  			transform: translateX(-50%);
  			-webkit- transform: translateX(-50%);
		}
		
		#gaiyo  ul{
			margin:4% 0;
			font-weight: bold;
			font-size: 1.1em
		}
		
		
		#gaiyo ol{
			line-height: 2;
			text-indent:0.5em;
		}
		
		.gaiyo{
	width: auto;
	height: auto;
	font-size: 1em;
	line-height: 25px;
	padding: 30px;
	font-style: normal;
/* 	text-indent: 5px; */
	background:rgba(255,255,255,0.6);
	position: relative;
  			left: 50%;
  			transform: translateX(-50%);
  			-webkit- transform: translateX(-50%);
		}
		
		.gaiyo  ul{
			margin:4% 0;
			font-weight: bold;
			font-size: 1.1em
		}
		
		#gaiyo img{
			max-width: 90%;
		}

		
				
		.text{
			line-height: 2.3;
			margin: 0% 4% 6%;
		}
		
		@media screen and (max-width : 820px){
			#main{
				
				margin-top:10%;
				
			}
			#gaiyo{
				width: 100%;
			}
			#gaiyo  ul{
				padding-top: 6%;
				padding-bottom:6%;
			}
			
			.gaiyo{
				width: 100%;
			}
			.gaiyo  ul{
/* 				background-color: #fcd;  */
				background-color: rgba(205,221,85,0.8);
				padding-top: 6%;
				padding-bottom:6%;
			}
			
			#gaiyo img{
			max-width: 90%;
		}
		
			.text{
				line-height: 2;
				margin: 0%;
			}
		}
		
/* 	イベントマップの画像調整	 */
		.resize{
			width: 40%;
		}
		
		@media screen and (max-width : 820px){
			.resize{
				width: 100%;
			}
		}
		
		/* 	イベント内容の画像調整	 */
		.IventIMG{
			width: 70%;
		}
		
		@media screen and (max-width : 820px){
			.IventIMG{
				width: 100%;
			}
		}

		
		
		
		
		.link{
			width: 100%;
/* 			padding:0px 0 10px; */
	line-height: 3;
	font-size: 90%;
	position: relative;
  			left: 50%;
  			transform: translateX(-50%);
  			-webkit- transform: translateX(-50%);
		}
				.link2 ul{
			width:100%;
			list-style: none;
			padding-top: 1em;
		}
			
		.list_1{
			position:absolute;
		}
		.list_2{
			position:absolute;
			left:36%;
		}
		.list_3{
			position:absolute;
			left:70%;
		}
		
		
		@media screen and (max-width : 850px){
			.link{
				font-size: 0.9em;
				left: 40%;
			}
			.link2{
				margin: -3em 0;
			}
			
			.link2 ul{
			width:100%;
			display: inline-block;
		}
		.list_1{
			position:relative;
		}
		.list_2{
			position:relative;
			left:0%;
		}
		.list_3{
			position:relative;
			left:0%;
		}
		}
		
		
		.eki{
			font-size:20px;
		}
		
		.tizu{
			font-size:20px;
		}
		
		#map{
			text-align:center;
			position:relative;
			width:100%;
			height:0;
			padding-bottom: 56.25%;
		}
		#map iframe{
			position:absolute;
			top:0;
			left:0;
			width:100%;
			height:100%;
		}
		
		
		
		#main2{
			width:auto;
			height:100px;
/* 			background:#afb; */
		}
		
		#footer{
			background-color: #fff;
			width:auto;
/* 			height:180px; */
			padding-bottom:10px;
		}
		
		.fotter{
			text-align: center;
	font-size: 12px;
	padding-left: 10px;
	padding-top: 20px;
	line-height: 22px;
	padding-right:10px;
		}
		
		
		@media screen and (max-width : 820px){
			.fotter{
				font-size:6px;
			}
			.ft-hide{
				display:none;
			}
		}
		
		
		
		/* 820pxより画面が小さい時、改行する
		（820pxより画面が大きい時、改行を無効にする） */
		@media screen and (min-width : 820px){
			.title_hide{
				display:none;
			}
			
			
		
		}
		
		/* 820pxより画面が小さい時、スペースを非表示 */
		@media screen and (max-width : 820px){
			.space{
				display:none;
				
			}
			
			.time{
				line-height: 5;
/* 				border-bottom: solid 3px #cd5; */
			}
			
			.small_br{
				display:none;
				
			}
		}
		
		.kakomu{
			padding:2px 8px;
			margin:0 5px;
			border:3px solid #000000;
		}
		
	
		
		
