/* CSS Document */

@import url(navi.css);
@import url(common.css);


a:hover img
	{
	opacity:0.6;
	filter: alpha(opacity=60);
	-ms-filter: "alpha( opacity=60 )";
	position:relative;
	top:1px;
	}


#container {
	width:980px;
	margin:0 auto;
	padding:37px 0 0 0;
}

		
#main {
	width:100%;
	height:56px;
	background:url(../img/common/imgb.jpg) repeat-x bottom center;
	margin:0 auto;
	padding:17px 0 0 0;
}

/* 段組み */

#left {
	width:210px;
	float:left;
}

#left h1 {
	width:210px;
	height:130px;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
}


#rcont {
	width:715px;
	float:right;
}



/* ---最新情報ブログ----------------------------------------------------------*/

#blog_left {background:url(../img/news/stitle.jpg) no-repeat;}


#blog {margin-bottom:50px;}

	#blog h1 {
		width:358px;
		height:52px;
		text-indent:100%;
		white-space:nowrap;
		overflow:hidden;
		background:url(../img/news/st1.gif) no-repeat;
	}
	
	#blog h2 {
		width:600px;
		height:49px;
		background:url(../img/news/name.gif) no-repeat left #EDEAE4;
		padding:0 0 0 80px;
		line-height:49px;
		margin:0 0 10px 20px;
	}


/* ---イベント情報----------------------------------------------------------*/

#event_left {background:url(../img/event/stitle.jpg) no-repeat;}


#event {margin-bottom:50px;}

	#event h2 {
		width:358px;
		height:52px;
		text-indent:100%;
		white-space:nowrap;
		overflow:hidden;
	}
	
	#evh21 {background:url(../img/event/st1.gif) no-repeat;}

	#event p.nml {
		padding:0 0 20px 0;
		margin:0 20px 20px 20px;
		border-bottom:1px dotted #999999;
	}
	
		#event p.nml strong {color:#FF6666; font-size:1.4em;}
	
	#event p.nml img.left {
		float:left;
		margin:0 20px 10px 0;
		border:1px #ccc solid;
	}
	
	
.evbtn {
	font-size:1em;
	font-family:"メイリオ",Meiryo,"ＭＳ Ｐゴシック",MS UI Gothic,Osaka,sans-serif;
	font-weight:normal;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	border:1px solid #d83526;
	padding:9px 18px;
	text-decoration:none;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #fc8d83), color-stop(100%, #e4685d) );
	background:-moz-linear-gradient( center top, #fc8d83 5%, #e4685d 100% );
	background:-ms-linear-gradient( top, #fc8d83 5%, #e4685d 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fc8d83', endColorstr='#e4685d');
	background-color:#fc8d83;
	color:#ffffff;
	display:inline-block;
	text-shadow:1px 1px 0px #b23e35;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #f7c5c0;
 	-moz-box-shadow:inset 1px 1px 0px 0px #f7c5c0;
 	box-shadow:inset 1px 1px 0px 0px #f7c5c0;
}
.evbtn:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #e4685d), color-stop(100%, #fc8d83) );
	background:-moz-linear-gradient( center top, #e4685d 5%, #fc8d83 100% );
	background:-ms-linear-gradient( top, #e4685d 5%, #fc8d83 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e4685d', endColorstr='#fc8d83');
	background-color:#e4685d;
}
.evbtn:active {
	position:relative;
	top:1px;
}


/* サウンドクロス　*/

#event_sound {margin-bottom:50px;}

	#event_sound h2 {
		width:358px;
		height:42px;
		text-indent:100%;
		white-space:nowrap;
		overflow:hidden;
		background:url(../img/event/sound/st1.gif) no-repeat;
	}
	#event_sound p.nml {
		padding:0 30px 20px 30px;
		margin:0;
	}
	
	#event_sound img.sp {margin:0 0 0 20px;}

	strong.pple {color:#D12F3F; font-size:1.4em; line-height:250%;}




/* にぎわい市　*/

#event_nigiwai {margin-bottom:50px;}

	#event_nigiwai h2 {
		width:358px;
		height:42px;
		text-indent:100%;
		white-space:nowrap;
		overflow:hidden;
		background:url(../img/event/nigiwai/st1.gif) no-repeat;
	}
	#event_nigiwai p.nml {
		padding:0 30px 20px 30px;
		margin:0;
	}
	
	#event_nigiwai img.sp {margin:0 0 0 20px;}
	
	


/* ---交通案内----------------------------------------------------------*/

#access_left {background:url(../img/access/stitle.jpg) no-repeat;}


.access {margin-bottom:50px;}

	.access h2 {
		width:241px;
		height:52px;
		text-indent:100%;
		white-space:nowrap;
		overflow:hidden;
	}
	
		#ach21 {background:url(../img/access/st1.gif) no-repeat;}
		#ach22 {background:url(../img/access/st2.gif) no-repeat;}
		#ach23 {background:url(../img/access/st3.gif) no-repeat;}
		#ach24 {background:url(../img/access/st4.gif) no-repeat;}
	
	.access #map_canvas2 {
		width:680px;
		height:600px;
		margin:0 0 0 20px;
	}
	
	.access p.nml {
		padding:0 20px 20px 20px;
		margin:0;
	}
	
	.access .oht {
		width: 100%;
		position: relative;
	}
	div.ohtawara-img{
		max-width: 500px;
		width: 100%;
	}
	p.ohtawara-text{
		position: absolute;
		width: 300px;
		right: 0;
		top:0;
	}

.access h3.accs {
	font-size:1.3em;
	line-height:230%;
	color:#999933;
	margin:0 0 0 30px;
}

.access p.acp {
		padding:20px 20px 20px 50px;
		margin:0;
	}
	
.access h4.acs {
	margin:20px 0 5px 40px;
	font-size:1.1em;
}

.access table.acs {
	margin:0 0 0 40px;
	width:660px;
}

.access .eki {
	font-size:1.2em;
	border:1px solid #BE9E9A;
	background-color:#FF9999;
	color:#fff;
	white-space:nowrap;
	padding:5px 8px;
}

.access .yaji {
	padding:20px 18px 20px 8px;
	background:url(../img/access/yaji.gif) no-repeat right;
	line-height:120%;
}


/* ---大田原商店連盟について----------------------------------------------------------*/

#about_left {background:url(../img/aboutus/stitle.jpg) no-repeat;}


#about {
	margin-bottom:50px;
	margin-right: 50px;
}

	#about h1 {
		width:241px;
		height:52px;
		background:url(../img/aboutus/st1.gif) no-repeat;
		text-indent:100%;
		white-space:nowrap;
		overflow:hidden;
	}
	
	#about p.nml {
		margin:0;
		padding:0 20px;
	}
	
#gaiyo {}

	#gaiyo h1 {
		width:241px;
		height:52px;
		background:url(../img/aboutus/st2.gif) no-repeat;
		text-indent:100%;
		white-space:nowrap;
		overflow:hidden;
	}
	
	#gaiyo p.nml {
		margin:0;
		padding:0 20px;
	}


#gaiyo table {
		margin:0 0 60px 20px;
		width:675px;
		border-spacing:1px;
		background-color:#d6d6d6;
	}
	
	#gaiyo table th {
		padding:5px 8px;
		background-color:#EEEBE6;
		font-weight:normal;
		text-align:left;
	}
	
	#gaiyo table td {
		padding:5px 8px;
		background-color:#FFF;
	}


/*　行事予定　*/

#sche {}

	#sche h1 {
		width:241px;
		height:52px;
		background:url(../img/aboutus/sche/st1.gif) no-repeat;
		text-indent:100%;
		white-space:nowrap;
		overflow:hidden;
	}
	
	#sche p.nml {
		margin:0;
		padding:0 20px;
	}


#sche table {
		margin:20px 0 60px 20px;
		width:675px;
		border-spacing:0px;
		border-top:1px dotted #999;
	}
	
	#sche table th {
		padding:5px 8px;
		border-bottom:1px dotted #999999;
		font-weight:normal;
		text-align:left;
	}
	
	#sche table td {
		padding:5px 8px;
		border-bottom:1px dotted #999999;
	}


#sche table th:first-letter {
		color:#CC0000;
		font-size:180%;
	}

/* 会員一覧 */

#mem {}

	#mem h1 {
		width:241px;
		height:52px;
		background:url(../img/aboutus/member/st1.gif) no-repeat;
		text-indent:100%;
		white-space:nowrap;
		overflow:hidden;
	}
	
	#mem p.nml {
		margin:0;
		padding:0 20px;
	}


#mem table {
		margin:20px 0 60px 20px;
		width:675px;
		border-spacing:1px;
		background-color:#d6d6d6;
	}
	
	#mem table th {
		padding:5px 8px;
		background-color:#EEEBE6;
		font-weight:normal;
		text-align:left;
	}
	
	#mem table td {
		padding:5px 8px;
		background-color:#FFF;
	}


/* ---逸品一覧ページ----------------------------------------------------------*/

#ippin_left {background:url(../img/ippin/stitle.jpg) no-repeat;}

	p.ippinlist {
		width:210px;
		margin:0;
		line-height:140%;
		border-bottom:1px solid #D2C5BB;
	}
	
	p.ippinlist a {
		width:180px;
		padding:15px 15px;
		display:block;
		margin:0;
		background:url(../img/ippin/b.gif) no-repeat right;
		text-decoration:none;
	}
	
	p.ippinlist a:hover {
		background:url(../img/ippin/bslc.gif) no-repeat right;
	}


	p.ippinslc {
		width:210px;
		margin:0;
		line-height:140%;
		border-bottom:1px solid #D2C5BB;
	}	
	p.ippinslc a {
		width:180px;
		padding:15px 15px;
		display:block;
		margin:0;
		background:url(../img/ippin/bslc.gif) no-repeat right;
		text-decoration:none;
	}


#ippin_list {}

	#ippin_list h1 {
		max-width:715px;
		width: 100%;
		margin: 0 auto;
	}
	
	#ippin_list p {
		padding:0 20px 20px 20px;
		margin:0;
	}
	
.ippn_list2 {}
	.ippin_list2 h2 {
		color:#F60;
		font-weight:normal;
		font-size:1.4em;
		margin:20px 0 10px 20px;
	}
	
	.ippin_list2 table {
		margin:0 0 60px 20px;
		width:675px;
		border-spacing:1px;
		background-color:#d6d6d6;
	}
	
	.ippin_list2 table th {
		padding:5px 8px;
		background-color:#EEEBE6;
		font-weight:normal;
	}
	
	.ippin_list2 table td {
		padding:5px 8px;
		background-color:#FFF;
	}
	


/* ---逸品詳細ページ------------*/
	

#ippin_store {}

	#ippin_store .navi {
		width:695px;
		padding:0 20px 20px 0;
		text-align:right;
		background:url(../img/ippin/store/theme.gif) no-repeat left top;
	}

	#ippin_store h1 {
		width:600px;
		height:49px;
		background:url(../img/ippin/store/name.gif) no-repeat left #EDEAE4;
		padding:0 0 0 80px;
		line-height:49px;
		margin:0 0 10px 20px;
	}
	
	#ippin_store p.sname {
		width:670px;
		line-height:30px;
		border-bottom:1px solid #CCC;
		margin:0 0 20px 20px;
		padding:0 5px;
	}
	
	#ippin_store p.sname strong {font-size:1.6em;}
	
	#ippin_store img.bimg {margin:0 0 20px 20px;}
	#ippin_store img.rimg {float:right;}
	
	#ippin_store p.caption {
		margin:0;
		padding:0 30px 20px 30px;
	}
	
	#ippin_store .prf {
		margin:0 0 20px 20px;
		padding:15px 10px 10px 10px;
		width:660px;
		border:1px solid #d6d6d6;
		background:url(../img/ippin/store/bar.gif) repeat-x top;
	}
	
		#ippin_store .prf table {
			width:600px;
			border-spacing:0;
			margin:0;
		}
		
		#ippin_store .prf table th {
			color:#997E22;
			padding:0px 8px;
			text-align:left;
			font-weight:normal;
		}
		
		#ippin_store .pbox {
	width:200px;
	border:1px solid #d6d6d6;
	padding:10px;
	float:left;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 15px;
		}
		
		#ippin_store .pbox p {
			margin:0;
			padding:0;
		}
		
		#ippin_store #map_canvas {
			width:680px;
			height:600px;
			margin:0 0 20px 20px;
		}
	






/* -----ボタン-----------------------*/

.gr_btn {
	font-family:"メイリオ",Meiryo,"ＭＳ Ｐゴシック",MS UI Gothic,Osaka,sans-serif;
	font-weight:normal;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
	border:1px solid #dcdcdc;
	padding:6px 11px;
	text-decoration:none;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ededed), color-stop(100%, #dfdfdf) );
	background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
	background:-ms-linear-gradient( top, #ededed 5%, #dfdfdf 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
	background-color:#ededed;
	color:#333;
	display:inline-block;
	text-shadow:1px 1px 0px #ffffff;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #ffffff;
 	-moz-box-shadow:inset 1px 1px 0px 0px #ffffff;
 	box-shadow:inset 1px 1px 0px 0px #ffffff;
}.gr_btn:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #dfdfdf), color-stop(100%, #ededed) );
	background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
	background:-ms-linear-gradient( top, #dfdfdf 5%, #ededed 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');
	background-color:#dfdfdf;
}.gr_btn:active {
	position:relative;
	top:1px;
}
div.aisatu-photo{
	float: left;
	width: 150px;
	height: auto;
	margin-right: 10px;
	margin-bottom: 10px;
}
div.access-map-image{
	width: 100%;
	max-width: 676px;
	height: auto;
	margin: 0 auto;
}
.access p.access-text{
	margin-left: 4em;
}
ul.smartphone-nav{
	display: none;
}
/*-------------------------------980px以下---------------------------------------------*/
@media screen and (max-width: 980px) {
	#main{
		display: none;
	}
	#container{
		max-width: 980px;
		width: 100%;
		padding-top: 20px;
	}
	#left{
		float: none;
		padding: 0 20px;
		width: 100%;
		box-sizing: border-box;
		margin-bottom: 20px;
	}
	#left h1{
		width: 210px;
		margin: 0 auto 30px;
	}
	#left p{
		display: none;
	}
	ul.smartphone-nav{
		margin-bottom: 40px;
		background:url(../img/ippin/b.gif) repeat top;
		padding: 20px 0px;
		box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
		display: flex;
	}
	ul.smartphone-nav li{
		border-right: 1px solid #000;
		box-sizing: border-box;
		text-align: center;
		font-size:1.2em;
		padding: 0 10px;
	}
	ul.smartphone-nav li:last-child{
		border: 0;
	}
	ul.smartphone-nav li a{
		text-decoration: none;
		transition-duration: .4s;
	}
	ul.smartphone-nav li a:hover{
		color: #999;
	}
	ul.about-nav li{
		width: 33.333%;
	}
	ul.event-nav li{
		width: 100%;
	}
	#rcont{
		float:none;
		width: 100%;
		box-sizing: border-box;
		padding: 0 20px;
	}
	#about{
		margin-right: 0;
	}
	#gaiyo table {
		max-width: 675px;
		width: 100%;
		margin: 0;
	}
	#sche table{
		max-width: 980px;
		width: 100%;
		box-sizing: border-box;
		margin: 20px 0;
	}
	#mem table{
		max-width: 980px;
		width: 100%;
		box-sizing: border-box;
		margin: 20px 0;
	}
	#mem table tbody tr th:nth-child(n+2){
		display: none;
	}
	#mem table tbody tr td{
		display: block;
	}
	#mem table tbody tr td:first-child{
		background-color: #666;
		color: #fff;
	}
	#mem table tbody tr td:nth-child(n+2){
		border-bottom: 1px dotted #999;
	}
	#mem table tbody tr td:last-child{
		border: 0;
	}
	div.ippin-booklet{
		width: 100%;
		margin: 10px auto;
		box-sizing: border-box;
		padding: 0 20px;
	}
	#event h2{
		max-width: 358px;
		width: 100%;
		height: auto;
		margin-bottom: 30px;
	}
	#evh21{
		background-size: cover; ;
	}
	div.ippin-booklet img{
		height: auto;
		width: 50%;
		max-width: 305px;
	}
	.evbtn{
		margin: 10px 0;
	}
	.access #map_canvas2{
		width: 100%;
		margin: 0;
	}
	div.mejirushi{
		width: 201px;
		margin: 0 auto;
	}
}
/*-------------------------------767px以下---------------------------------------------*/
@media screen and (max-width: 767px) {
	.access p.access-text{
		margin-left: 0;
	}
	div.ohtawara-img{
		margin: 0 auto;
	}
	p.ohtawara-text{
		position: relative;
		top: auto;
		right: auto;
		width: 100%;
		margin: 20px 0!important;
		box-sizing: border-box;
	}
	.access h3.accs{
		margin-left: 0;
	}
	.access h4.acs{
		margin-left: 0;
	}
	.access table.acs{
		width: 100%;
		margin: 0;
	}
	.access p.acp{
		padding: 20px 0;
	}
	.access .eki{
		width: 100%;
		display: block;
		margin: 4px 0;
		box-sizing: border-box;
	}
	.access .yaji{
		width: 100%;
		display: block;
		box-sizing: border-box;
		margin: 0;
		background: none;
		margin-left: 1em;
		text-indent: -1em;
		padding: 4px;
	}
	.access .yaji:before{
		content: "↓";
	}
	div.mejirushi{
		display: none;
	}
}