@charset "utf-8";

@import url(default.css);
@import url(base.css);



/* メイン画像 */


	#imagemain-wrapper{
		height:605px;
		margin:0 auto;
	}

		#imagemain{
			height:605px;
			overflow:hidden;
		}
		
			#imagemain li{
				width:100%;
				height:605px;
				float:left;
				list-style:none;
				background-repeat:no-repeat;
				background-size:1200px auto;
				background-position:50% 0;
			}

			#imagemain li#mainimg1{background-image:url(../images/img_main1.jpg);}
			#imagemain li#mainimg2{background-image:url(../images/img_main2.jpg);}
			#imagemain li#mainimg3{background-image:url(../images/img_main3.jpg);}

				
	@media screen and (max-width:770px){

	#imagemain-wrapper{
		height:388px;
		margin:0;
	}

		#imagemain{
			position:relative;
			width:770px;
			height:388px;
		}
		
			#imagemain li{
				background-size:770px auto;
				height:388px;
			}
		
		
	}
				
	
	#ttlmain{
		width:830px;
		height:87px;
		margin:0 auto -87px;
		position:relative;
		top:-570px;
		z-index:2000;
	}
	#ttlmain img{width:100%;}

				
	@media screen and (max-width:1420px){

	#ttlmain{
		max-width:830px;
		width:75%;
		height:87px;
		margin:0 auto -87px;
		position:relative;
		top:-354px;
	}
			
	}

				
	@media screen and (max-width:770px){#ttlmain{display:none;}}
				

	#contentlink{
		width:300px;
		margin-bottom:-75px;
		float:right;
		position:relative;
		right:20px;		
	}

		#contentlink li{
			width:150px;
			height:50px;
			padding-top:25px;
			font-size:1.1em;
			font-family:'kozuka-gothic-pr6n','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
			font-weight:500;
			color:#c33;
			text-align:center;
			list-style:none;
			line-height:1.3em;
			float:left;
			background-image:url(../shared/bg_curve-s.png);
			background-repeat:no-repeat;
			background-size:100% auto;
			position:relative;
			z-index:2000;
			top:-40px;			
		}

		#contentlink li a{
			color:#c33;
			text-decoration:none;
		}


				
	@media screen and (max-width:1200px){
			
	#contentlink{
		width:240px;
	}

		#contentlink li{
			width:120px;
			height:50px;
			padding-top:25px;
			font-size:1.0em;
		}

	}
				
	@media screen and (max-width:770px){
			
	#contentlink{
		width:190px;
		height:100px;
		margin:-100px auto 0;
		top:10px;
		float:none;
		right:0;
	}
	
		#contentlink li{
			width:80px;
			height:53px;
			padding-top:27px;
			font-size:0.9em;
			background-image:url(../shared/bg_clear-white.png);
			border-radius:50px;
			z-index:2000;
		}
		#contentlink li:first-child{margin-right:30px;}
	
	}



	/* リンクボタン */

				#link-news,
				#link-events{
					display:block;
					width:290px;
					height:50px;
					margin:45px auto 50px;
					padding-left:10px;
					color:#fff;
					font-family:'kozuka-gothic-pr6n','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
					font-weight:500;
					letter-spacing:0.1em;
					text-align:center;
					text-decoration:none;
					line-height:50px;
					border-radius:5px;
					background-color:#036;
					background-image:url(../images/ico_btn-news.png);
					background-repeat:no-repeat;
					position:relative;
					z-index:2000;
				}

					
			@media screen and (max-width:1000px){
		
				#link-news,
				#link-events{
						margin:20px auto;
						float:none;
						top:0;
					}
		
			}
					
			@media screen and (max-width:770px){

				#link-news,
				#link-events{
					height:50px;
				}
			}
			
			@media screen and (max-width:480px){

				#link-news,
				#link-events{
					width:240px;
				}
			}

		
			

/* イベント */

		#eventlist{
			clear:both;
			max-width:1128px;
			width:100%;
			margin:0 auto -50px;
			padding:120px 0 0;
			position:relative;
			top:-120px;
			/*z-index:2000;*/
		}
				
	@media screen and (max-width:770px){
		
		#eventlist{
			margin-bottom:-50px;
		}
		
	}

			
			#eventlist h2{
				width:242px;
				margin:0 auto -40px;
				padding-top:40px;
				color:#036;
				font-size:1.6em;
				font-family:'kozuka-gothic-pr6n','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
				font-weight:900;
				text-align:center;
				background-image:url(../shared/bg_curve.png);
				background-position:50% 0;
				background-repeat:no-repeat;
				background-size:100% auto;
				position:relative;
				top:-40px;
				z-index:2000;
			}
			#eventlist h2 a{
				color:#036;
				text-decoration:none;
			}

				
		@media screen and (max-width:1200px){
			
			#eventlist h2{
				width:200px;
				font-size:1.4em;
			}

		}

		@media screen and (max-width:770px){
			#eventlist h2{
				padding-top:35px;
			}
			
		}


		@media screen and (max-width:480px){
		
			#eventlist h2{
				width:160px;
				margin-bottom:-15px;
				padding-top:30px;
				font-size:1.2em;
			}
				
		}
	
	
			#eventlist .eventinner{
				width:1120px;
				margin:0 auto;
				padding-top:20px;
				position:relative;
			}

				#eventlist li{
					width:220px;
					padding:20px 30px;
					list-style:none;
					float:left;
				}
				
				#eventlist li:hover{
					border-radius:10px;
					-moz-box-shadow:0 0 0 1px #ccc inset;
					-webkit-box-shadow:0 0 0 1px ccc inset;
					box-shadow:0 0 0 1px #ccc inset;
				}
	
			@media screen and (max-width:480px){
				
				#eventlist li:hover{
					-moz-box-shadow:0 0 0 0 #ccc inset;
					-webkit-box-shadow:0 0 0 0 ccc inset;
					box-shadow:0 0 0 0 #ccc inset;
				}
	
			}
				

					#eventlist li .eventimage{
						width:100%;
					}
					
					#eventlist li .eventimage img{width:100%;}
			

					#eventlist li a{
						color:#036;				
						font-family:'kozuka-gothic-pr6n','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
						font-weight:900;
						text-decoration:none;
						line-height:1.6em;
					}
					
					#eventlist li div.eventdate{
						margin-bottom:3px;
						color:#036;
						font-size:0.9em;
						font-family:'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
						font-weight:normal;
					}										


				#link-events{
					margin:30px auto 0;
					background-image:url(../images/ico_btn-events.png);
					background-position:70px 45%;
					background-size:22px auto;
				}

				
		@media screen and (max-width:1200px){
			#eventlist .eventinner{width:1040px;}
				#eventlist li{padding:20px;}
		}
				
		@media screen and (max-width:1040px){
			#eventlist .eventinner{width:780px;}
			#eventlist li:nth-of-type(4){display:none;}
		}
				
		@media screen and (max-width:780px){
			
		#eventlist{
			margin-bottom:-100px;
		}

			#eventlist .eventinner{
				width:570px;
				margin-bottom:-40px;
			}

				#eventlist li{
					width:150px;
					padding:10px 20px;
				}
				/*#eventlist li:nth-of-type(3){display:none;}*/

					#eventlist li a{
						line-height:1.6em;
					}
					
					.eventtitle{
						font-size:0.9em;
					}
						
				#link-events{
					margin:60px auto 40px;
					position:relative;
				}
				
		}
				
		@media screen and (max-width:570px){
			
		#eventlist{
			margin-bottom:-150px;
		}
			
			#eventlist .eventinner{
				width:92%;
				margin:0 auto 20px;
				padding-top:30px;
			}
			
			#eventlist ul{
				width:100%;
				border-top:1px dashed #ccc;			
			}
			
				#eventlist li{
					width:100%;
					margin:0;
					padding:0;
					float:none;		
					border-bottom:1px dashed #ccc;			
				}
				#eventlist li:nth-of-type(3){display:block;}
				#eventlist li:nth-of-type(4){display:block;}
				
				#eventlist li:after{
					content: "";
					display: block;
					visibility: hidden;
					clear: both;
					height: 0px;
				}
				* html #eventlist li{display: inline-table;}
				/* no ie mac \*/
				* html #eventlist li{height:1%;}
				#eventlist li{display: block; min-height:0;}
				/* */


					#eventlist li .eventimage{
						width:80px;
						margin:0 15px 0 0;
						padding:5px 0;
						float:left;
					}
					
					#eventlist li .eventimage img{width:100%;}
			

					#eventlist li a{
						color:#036;				
						font-family:'kozuka-gothic-pr6n','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
						font-weight:900;
						text-decoration:none;
						line-height:1.6em;
					}
					
					#eventlist li div.eventdate{
						margin:5px 0 3px;
						color:#036;
						font-size:0.9em;
						font-family:'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
						font-weight:400;
					}										

				#link-events{
					top:-40px;
				}
		}
	
				
		@media screen and (max-width:480px){
			
			#eventlist .eventinner{
				padding-top:0;
			}
			
			#link-events{background-position:40px 45%;}
		}


/* おしらせ */

		#newslist{
			max-width:1200px;
			width:100%;
			margin:0 auto -30px;
			padding-bottom:50px;
			background-color:#e6f5ff;
			position:relative;
			z-index:2000;
		}
			
			#newslist h2{
				width:242px;
				margin:0 auto;
				padding-top:40px;
				color:#036;
				font-size:1.6em;
				font-family:'kozuka-gothic-pr6n','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
				font-weight:900;
				text-align:center;
				background-image:url(../shared/bg_curve-b.png);
				background-position:50% 0;
				background-repeat:no-repeat;
				background-size:100% auto;
				position:relative;
				top:-40px;
				z-index:2000;
			}


		#newslist .inner{
			width:96%;
			margin:30px auto 0;
			position:relative;
			z-index:2000;
		}

			#newswrapper{
				border-top:1px dashed #ccc;
				float:left;
				position:relative;
				left:2%;
			}

				#newslist ul{
					width:100%;
					z-index:2000;
				}
	
					#newslist li{
						padding:15px 5px 15px 25px;
						list-style:none;
						line-height:1.5em;
						border-bottom:1px dashed #ccc;
						background-image:url(../shared/bg_list.gif);
						background-repeat:repeat-y;
					}
					
					#newslist li:after{
						content: "";
						display: block;
						visibility: hidden;
						clear: both;
						height: 0px;
					}
					* html #newslist li{display: inline-table;}
					/* no ie mac \*/
					* html #newslist li{height:1%;}
					#newslist li{display: block; min-height:0;}
					/* */
	
		
						#newslist li a{
							display:block;
							text-decoration:none;
							float:left;							
						}
					
						#newslistt li a:hover{
							text-decoration:underline;
						}
			
			
						#newslist li div.entrydate{
							width:115px;
							color:#666;
							float:left;							
						}

						#triggers{
							width:180px;
							margin:15px auto 0;
						}

						.trigger{
							display:none;
							width:180px;
							height:30px;
							margin:0 0 -32px;
							font-size:0.9em;
							text-align:center;
							line-height:30px;
							border:1px solid #ccc;
							border-radius:5px;
							cursor:pointer;
							position:relative;
							float:left;
							background-color:#fff;
							-webkit-transition:background-color 0.3s ease-out;
							-moz-transition:background-color 0.3s ease-out;
							-ms-transition:background-color 0.3s ease-out;
							transition:background-color 0.3s ease-out;
						}
						
						.trigger:hover{
							background-color:#eee;
						}
							
						#trigger{
							margin-right:-182px;
							z-index:1;
						}
						
						.nolist{
							padding:10px 15px;
							border-bottom:1px dotted #ccc;
							text-align:center;
						}


				
			@media screen and (max-width:1200px){
				
		#newslist{padding-bottom:20px;}
			
			#newslist h2{
				width:200px;
				font-size:1.4em;
			}

			#newslist .inner{margin:10px auto 0;}
				
			}
				
			@media screen and (max-width:770px){
			
			#newslist{
				width:100%;
				/*padding-bottom:140px;*/
				padding-bottom:40px;
			}

			#newslist .inner{margin:10px auto;}

				#newslist h2{
					width:200px;
					margin-bottom:-20px;
					padding-top:35px;
					font-size:1.4em;
				}
	
				#newswrapper{
					width:96%;
					margin:0 auto 50px;
					float:none;
					left:0;
				}

				#newslist ul:nth-of-type(2){
					display:none;
				}
				
				.trigger{display:block;}
			
			}


			@media screen and (max-width:480px){

			#newslist .inner{margin-top:0;}
		
				#newslist h2{
					width:160px;
					margin-bottom:-15px;
					padding-top:30px;
					font-size:1.2em;
				}
		
						#newslist li a{
							float:none;							
						}
			
						#newslist li div.entrydate{
							width:auto;
							margin-bottom:3px;
							font-size:0.9em;
							color:#999;
							float:none;							
						}										
	
					#newslist li{
						padding:10px 5px 10px 25px;
					}

			}
	
				
				#link-news{
					background-size:21px auto;
					background-position:70px 45%;
				}
				
			@media screen and (max-width:480px){

				#link-news{
					background-position:45px 45%;
				}
			}



			#fbbox{
				width:340px;
				height:510px;
				float:right;
				/*border:1px solid #ccc;*/
			}

		@media screen and (max-width:770px){

			#fbbox{
				display: none;
			}

		}

				#link-snsentry{
					display:block;
	display:none;
					width:300px;
					height:50px;
					margin:45px auto 50px;
					color:#036;
					font-size:1.0em;
					font-family:'kozuka-gothic-pr6n','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
					font-weight:500;
					text-align:center;
					text-decoration:none;
					line-height:50px;
					border-radius:5px;
					background-color:#cce6f5;
					position:relative;
					z-index:2000;
				}
				
				#link-snsentry:first-letter{color:#f00;}

					
			@media screen and (max-width:1000px){
		
				#link-snsentry{
						margin:20px auto;
						float:none;
						top:0;
					}
		
			}
					
			@media screen and (max-width:770px){
			
				#link-news{
					margin:0 auto 85px;
					position:relative;
					top:45px;
				}
				
				#fbbox{
					float:none;
					margin:0 auto;
				}

				
				#link-snsentry{
					margin:40px auto 0;
					position:relative;
				}

			}
			
			@media screen and (max-width:480px){

			#link-snsentry{
					width:260px;
					font-size:0.9em;
				}
			}
			



/* お問い合わせ */

		#contact{
			background-color:#fff;
		}
			
			#contact h2{
				background-image:url(../shared/bg_curve.png);
			}



		#mailcontact{
			padding:10px 30px 0;
		}

		#maillabel{
			padding-left:45px;
			font-size:2.0em;
			font-family:'kozuka-gothic-pr6n','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
			font-weight:500;
			color:#147ecc;
			letter-spacing:0.1em;
			background-image:url(../images/ico_mail.png);
			background-position:0 0;
			background-repeat:no-repeat;
		}

			#mailcontact .remarks{
				margin:0 0 5px 45px;
				color:#f63;
				font-weight:500;
				letter-spacing:0.05em;
				position:relative;
				top:-15px;
			}
				
	@media screen and (max-width:1200px){
		
		#maillabel{
			font-size:1.8em;
		}
	}
					
	@media screen and (max-width:640px){
		
		#maillabel{
			font-size:1.5em;
		}
	}


	@media screen and (max-width:480px){

		#telnum,
		#maillabel{
			padding-left:30px;
			font-size:1.2em;
			background-position:0 2px;
			background-size:20px auto;
		}
		
		#tel .remarks,
		#mailcontact .remarks{
			margin-left:30px;
			font-size:0.9em;
		}
			
		
	}



/* アクセス */

		#access{
			max-width:1200px;
			width:100%;
			margin:0 auto -80px;
			padding-top:80px;
			padding-bottom:50px;
			position:relative;
			top:-80px;
		}

			#access h2{
				width:130px;
				height:86px;
				margin:0 auto -130px;
				padding-top:44px;
				color:#fff;
				font-size:1.2em;
				font-family:'kozuka-gothic-pr6n','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
				font-weight:900;
				text-align:center;
				border-radius:65px;
				background-image:url(../shared/bg_clear-orange.png);
				position:relative;
				top:26px;
				z-index:3000;
			}


		#mapwrap{
			max-width:1200px;
			width:100%;
			margin:0 auto;
			position:relative;
		}
		
		
		#gmap{
			width:100%;
			height:540px;
			margin-bottom:40px;
		}
		
	@media screen and (max-width:770px){
		#gmap{
			height:400px;
			margin-bottom:30px;
		}
	}
		

			#access .remarks{
				width:92%;
				margin:15px auto;
			}

				#access .remarks .imagebox{
					padding:15px 15px 5px;
					margin-left:30px;
					float:right;
					display:block;
					border:1px solid #ccc;
					border-radius:4px;
				}

				#access .remarks a{color:#04c;}
				#access .remarks a:hover{color:#c33;}

				.lpattern{display:none;}


	@media screen and (max-width:770px){

				#access .remarks .imagebox{
					margin-left:15px;
					padding:10px 10px 0;
				}

				#access .remarks .imagebox img{
					width:120px;
				}

	}

	@media screen and (max-width:480px){
				.rpattern{display:none;}
				.lpattern{display:inline;}
				
				#access .remarks .imagebox{
					width:160px;
					margin:0 auto 25px;
					padding:10px 0 0;
					text-align:center;
					float:none;
				}

	}




		.banbox{
			max-width:700px;
			width:90%;
			margin:0 auto 45px;
		}
		.banbox img{width:100%;}

	@media screen and (max-width:420px){

		.banbox{
			margin:0 auto 30px;
		}

	}

		.banbox img{
			margin-bottom:15px;
		}








