@charset "utf-8";
/* CSS Document */
/****************************************************************************/
/**								夏特集2018 									*/
/****************************************************************************/

.pc { display: block; }
.sp { display: none; }

#head_title {
	margin: 0 auto 5px !important;
}

#summer_path ul {
	list-style-type: none;
	padding-left: 0;
	margin: 0 auto 50px;
	overflow: hidden;
	width: 1028px;
}

#summer_path ul li {
    float: left;
		margin-right: 105px;
    padding: 0;
}

#summer_path ul li:first-child {
	margin-left: 30px;
}

#summer_path ul li:last-child {
	margin-right: 0;
}

#feature_summer2018 {
	font-size: 16px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	word-wrap: break-word;
	padding-top: 20px;
	color: #000;
}

/* 縦書きテキスト*/
.txt_tate {
	-ms-writing-mode: tb-rl; 
	-webkit-writing-mode: vertical-rl;
	writing-mode: vertical-rl;
	font-size: 112%;
	text-align: left;
	text-shadow: 
       1px  1px 0px #ffffff,
      -1px  1px 0px #ffffff,
       1px -1px 0px #ffffff,
      -1px -1px 0px #ffffff,
       1px  0px 0px #ffffff,
       0px  1px 0px #ffffff,
      -1px  0px 0px #ffffff,
       0px -1px 0px #ffffff;
}

.tcy {
  -webkit-text-combine: horizontal;
  -ms-text-combine-horizontal: all;
  text-combine-upright: all;
}
/* 各項目テキスト*/
.lead_box dd {
	line-height: 1.6;
}

/* イベント　*/
.event .ttl_event {
	margin-bottom: 15px;
	text-align: center;
}

.event .txt_event {
	margin-bottom: 20px;
	padding: 0 20px;
	line-height: 1.6;
	text-align: center;
}

/* テーブル　*/


.table_event th {
	width: 170px;
	padding: 8px 0;
	color: #fff;
	font-size: 87%;
}

.table_event th div {
	padding: 13px 0 15px !important;
}

.table_event td {
	padding: 0 30px;
	line-height: 1.4;
	
}

.table_event td a {
	text-decoration: underline;
}

/*　ホタル　*/

#hotal {
	padding-bottom: 90px;
	background: url(../img/feature/summer2018/hotal_bg001.gif) no-repeat center top;
	background-size: cover;
}

#hotal .img-ttl {
	float: left;
	width: 630px;
	margin-top: 5px;
}

#hotal .ttl_box {
	float: right;
	width: 360px;
}

#hotal .ttl_box_ttl {
	float: right;
}

#hotal .ttl_box_lead {
	float: left;
	margin-top: 10px;

}

#hotal .ttl_box .icon_toei {
	margin-bottom: 10px;
	text-align: left;
}

#hotal .lead_box {
	margin-top: -20px;
	color: #fff;
	text-align: left;
	margin-bottom: 35px;
}

#hotal .lead_box dt {
	margin-left: 20px;
	margin-bottom: 30px;
}


#hotal .boxT {
	width: 858px;
	margin: 0 auto;
	padding-top: 25px !important;
	background: url(../img/feature/summer2018/box_bg001.png) no-repeat left top;
}


#hotal .boxM {
	background: url(../img/feature/summer2018/box_bg002.png) repeat-y;
}


#hotal .boxB {
	padding-bottom: 30px;
	background: url(../img/feature/summer2018/box_bg003.png) no-repeat left bottom;
}

#hotal .table_event {
	width: 818px;
	margin: 0 auto;
}

#hotal .table_event th div {
	padding: 11px 0;
	background: url(../img/feature/summer2018/event_bg001.gif) repeat-x left top;
}

#hotal .txt_tate {
	width: 187px;
	height: 445px;
	background: url(../img/feature/summer2018/tate_bg001.png) no-repeat right top;
	line-height: 3.5;
}

#hotal .event_point {
	width: 835px;
	margin: 25px auto 20px;
  padding: 20px 10px 10px;
  border: 2px solid #fc4e20;
  background-color: #ffece5;
}

#hotal .event_point h4 {
  margin-bottom: 20px;
  text-align: center;
}

#hotal .event_point_content {
  padding-left: 10px;
}

#hotal .event_point table {
  width: 100% !important;
  margin-top: 10px;
}

#hotal .event_point th div {
	background-image: url(../img/feature/summer2018/event_bg001_2.jpg) !important;
}

/*　鮎釣り　*/

#ayu {
	padding-bottom: 80px;
	background: url(../img/feature/summer2018/ayu_bg001.gif) no-repeat center top;
	background-size: cover;
}


#ayu .img-ttl {
	float: right;
	width: 480px;
}

#ayu .ttl_box {
	float: left;
	width: 495px;
}

#ayu .ttl_box_ttl {
	float: left;
}

#ayu .right_box {
	float: right;
}

#ayu .ttl_box .icon_toei {
	margin: 10px 0 20px;
	text-align: left;
}


#ayu .txt_tate {
	width: 294px;
	height: 509px;
	background: url(../img/feature/summer2018/tate_bg002.png) no-repeat right top;
	line-height: 4.1;
}

#ayu .lead_box_01 {
	float: right;
	width: 695px;
	margin: 85px 0 40px;
	
}

#ayu .lead_box_01 dt {
	margin-bottom: 50px;
}


#ayu .boxT {
	width: 644px;
	padding-top: 25px !important;
	background: url(../img/feature/summer2018/box_bg004.png) no-repeat left top;
}


#ayu .boxM {
	background: url(../img/feature/summer2018/box_bg005.png) repeat-y;
}


#ayu .boxB {
	padding-bottom: 25px;
	background: url(../img/feature/summer2018/box_bg006.png) no-repeat left bottom;
}

#ayu .table_event {
	width: 604px;
	margin: 0 auto;
}


#ayu .table_event th div {
	padding: 11px 0;
	background: url(../img/feature/summer2018/event_bg002.gif) repeat-x left top;
}

#ayu .event_box_01 {
	position: relative;
	margin-bottom: 95px;
}

#ayu .event_box_01 .event {
	 position: relative;
	 z-index: 1;
	 margin-top: 105px;
}

#ayu .event_box_01 .img-event {
	z-index: 0;
	position: absolute;
	top: -105px;
	right: 0;
}

#ayu .event_box_02 {
	position: relative;
}

#ayu .event_box_02 .img-event {
	z-index: 0;
	position: absolute;
	top: 0;
	left: 0;
}
.event_lead {
	position: relative;
	z-index: 1;
}


#ayu .event_box_02 .lead_box_02 {
	 float: right;
	 width: 470px;
	 margin: 20px 65px 75px 0;
}

#ayu .event_box_02 .lead_box_02 dt {
	margin-bottom: 30px;
}

#ayu .event_box_02 .event {
	float: right;
}

#ayu .event_box_02 .event_point {
	width: 835px;
    margin: 25px auto 20px;
    padding: 20px 10px 10px;
    border: 2px solid #e243df;
    background-color: #ffe5f5;
}

#ayu .event_box_02 .event_point h4 {
	 margin-bottom: 20px;
    text-align: center;
}

#ayu .event_box_02 .event_point_content {
    padding-left: 10px;
}

#ayu .event_box_02 .event_point p {
	line-height: 1.3em ;
}	

#ayu .event_box_02 .event_point table {
	width: 100%;
	margin-top: 10px;
}

#ayu .event_box_02 .event_point th div {
    background-image: url(../img/feature/summer2018/event_bg004.jpg) !important;
}

/* 川遊び　*/


#river {
	background: url(../img/feature/summer2018/river_bg001.gif) no-repeat right top;
	background-size: cover;
	
}

#river .container {
	 position: relative;
	 padding-bottom: 760px;
}


#river .img-ttl {
	float: left;
	width: 600px;
	margin-top: 5px;
}

#river .ttl_box {
	float: right;
	width: 400px;
}

#river .ttl_box_ttl {
	float: right;
	margin-top: 35px;
}

#river .ttl_box_lead {
	float: left;
}

#river .ttl_box .icon_toei {
	margin-bottom: 20px;
	text-align: center;
}

#river .txt_tate {
	width: 248px;
	height: 445px;
	background: url(../img/feature/summer2018/tate_bg003.png) no-repeat right top;
	line-height: 3.5;
}

#river .lead_box {
	margin-top: -30px;
}

#river .lead_box dt {
	margin-bottom: 20px;
}

#river .event_lead {
  float: left;
  width: 350px;
	padding-left: 20px;
  line-height: 1.6;
}

#river .event {
	float: right;
	position: relative;
	z-index: 2;
}

#river .boxT {
	width: 644px;
	padding-top: 25px !important;
	background: url(../img/feature/summer2018/box_bg007.png) no-repeat left top;
}


#river .boxM {
	background: url(../img/feature/summer2018/box_bg008.png) repeat-y;
}


#river .boxB {
	padding-bottom: 25px;
	background: url(../img/feature/summer2018/box_bg009.png) no-repeat left bottom;
}

#river .table_event {
	width: 604px;
	margin: 0 auto;
}


#river .table_event th div {
	padding: 11px 0;
	background: url(../img/feature/summer2018/event_bg003.gif) repeat-x left top;
}


#river .img_river_01 {
	position: absolute;
	bottom: 560px;
	left:0;
	z-index: 1;
}

#river .img_river_02 {
	position: absolute;
	bottom: 360px;
	left: 410px;
	z-index: 0;
}




/* 注意事項　*/
#caution {
	position:relative;
	width: 1027px;
	margin: -120px auto 120px;
	background: url(../img/feature/summer2018/caution_bg001.png) no-repeat left top;
	padding-top: 35px;
}

#caution .boxM {
	background: url(../img/feature/summer2018/caution_bg002.png) repeat-y;
}

#caution .boxB {
	background: url(../img/feature/summer2018/caution_bg003.png) no-repeat left bottom;
	padding-bottom: 35px;
}

#caution .img_caution_01 {
	 position: absolute;
	  top: 130px;
		left: 85px;
}

#caution .img_caution_02 {
	 position: absolute;
	  top: 120px;
		right: 105px;
}

#caution .ttl_caution {
	padding: 40px 0 30px;
	text-align: center;
}

#caution .caution_lead {
	margin-bottom: 45px;
	text-align: center;
	font-size: 112%;
	line-height: 1.6;
}

#caution ol {
	width: 630px;
	margin: 0 auto;
}

#caution ol li {
	margin-bottom: 10px;
	padding: 5px 0 10px 45px;
	line-height: 1.6;
}

#caution ol li:nth-child(1) {
	background: url(../img/feature/summer2018/caution_i001.gif) no-repeat left top 0.2em;
}

#caution ol li:nth-child(2) {
	background: url(../img/feature/summer2018/caution_i002.gif) no-repeat left top 0.2em;
}

#caution ol li:nth-child(3) {
	background: url(../img/feature/summer2018/caution_i003.gif) no-repeat left top 0.2em;
}

#caution ol li:nth-child(4) {
	background: url(../img/feature/summer2018/caution_i004.gif) no-repeat left top 0.2em;
}

#caution ol li:nth-child(5) {
	background: url(../img/feature/summer2018/caution_i005.gif) no-repeat left top 0.2em;
}

#caution ol li:nth-child(6) {
	padding-bottom: 45px;
	margin-bottom: 0;
	background: url(../img/feature/summer2018/caution_i006.gif) no-repeat left top 0.2em;
}


@media screen and (max-width:640px){
	
		img, button{
			max-width: 100%;
			height: auto;
			width:auto;
		}
		.pc { display: none !important; }
		.sp { display: block !important; }
    
		#head_title {
			width: 100%;
		}
		
		#head_title img {
			width: 96%;
			margin: 0 auto;
		}
		#summer_path ul {
			width: 100%;
      margin-bottom: 4%
		}
		
		#summer_path ul li {
				width: 35%;
				padding: 0;
				margin: 0 5% 5% 0;
		}
		
		#summer_path ul li:first-child{
			margin: 0 5% 0 10%;
		}
		#summer_path ul li:nth-child(3){
			margin: 0 5% 0 10%;
		}

		/* 縦書きテキスト*/
		.txt_tate {
			-ms-writing-mode: lr-tb; 
			-webkit-writing-mode: horizontal-tb;
			writing-mode: horizontal-tb;
			
			text-shadow: none;
			font-size: 100%;
		}

		/* イベント　*/
		.event .ttl_event {
			margin-bottom: 15px;
			text-align: center;
		}

		/* テーブル　*/

		.table_event th {
			width: 100%;
			display: block;
			padding: 2% 0;
			color: #000;
			font-size: 100%;
		}

		.table_event th div {
			padding: 0 !important;
		}

		.table_event td {
			width: 100%;
			display: block;
			padding: 0 0 5%;
			word-break : break-all;
			
		}

/*　ホタル　*/

		#hotal {
			padding-bottom: 90px;
			background: none;
		}

		#hotal .img-ttl {
			float: none;
			width: 100%;
			margin-bottom: 3%;
		}
		
		#hotal .img-ttl img {
			width: 100%;
		}

		#hotal .ttl_box {
			float: none;
			width: 100%;
		}
		
		#hotal .ttl_box_ttl {
			float: none;
		}
		
		#hotal .ttl_box_ttl_sp {
			float: none;
			display: table-cell;
			width: 30%;
			margin-left: 5%;
		}

		#hotal .ttl_box_lead_sp {
			float: none;
			display: table-cell;
			vertical-align: middle;
			margin: 0;
			padding-left: 5%;
		}
		
		#hotal .ttl_box_lead {
			float: none;
			width: 100%;
			margin: 0;

		}
		
		#hotal .lead_box {
			margin-top: 5%;
			color: #000;
		}

		#hotal .lead_box dt {
			margin-left: 0;
			margin-bottom: 2%;
		}

		#hotal .txt_tate {
			width: 100%;
			height: auto;
			background: none;
			line-height: 1.6;
		}


		#hotal .boxT {
			width: 100%;
			padding-top: 2% !important;
			background-size: contain;
		}
		
		#hotal .boxM {
			background-size: contain;
		}
		
		#hotal .boxB {
			padding-bottom: 2%;
			background-size: contain;
		}

		#hotal .table_event {
			width: 94%;
			margin: 0 auto;
		}

		#hotal .table_event th div {
			padding: 0;
			background: none;
		}

    #hotal .event_point {
      width: 90%;
      margin: 5% auto 20px;
      border: 2px solid #fc4e20;
      background-color: #ffece5;
    }

    #hotal .event_point h4 {
      margin-bottom: 20px;
      text-align: center;
    }

    #hotal .event_point_content {
      padding-left: 10px;
    }

    #hotal .event_point table {
      width: 100% !important;
      margin-top: 10px;
    }

    #hotal .event_point th div {
      background: none !important;
      color: #fc4e20;
    }

		/*　鮎釣り　*/
		
		#ayu {
			background: none;
		}

		
		#ayu .img-ttl {
			float: none;
			width: 100%;
			margin: 5% auto;
		}
		
		#ayu .img-ttl img {
			width: 100%;
		}
		
		#ayu .ttl_box {
			float: none;
			width: 100%;
		}

		#ayu .ttl_box_ttl {
			float: none;
			margin-left: 0;
		}

		#ayu .ttl_box_ttl_sp {
			display: table-cell;
			width: 30%;
		}

		#ayu .right_box {
			float: none;
			display: table-cell;
			vertical-align: middle;
			padding-left: 5%;
		}

		#ayu .icon_toei {
			margin-bottom: 10px;
		}

		#ayu .txt_tate {
			width: 100%;
			height: auto;
			background: none;
			line-height: 1.6;
		}

		#ayu .lead_box_01 {
			float: none;
			width: 100%;
			margin: 5% 0;
			
		}

		#ayu .lead_box_01 dt {
			margin-bottom: 2%;
		}

		#ayu .lead_box_01 .img-event img {
			width: 100%;
			margin-bottom: 2%;
		}

		#ayu .boxT {
			width: 100%;
			padding-top: 1.8% !important;
			background-size: contain;
		}


		#ayu .boxM {
			background-size: contain;
		}

		#ayu .boxB {
			padding-bottom: 2% !important;
			background-size: contain;
		}

		#ayu .table_event {
			width: 94%;
			margin: 0 auto;
		}


		#ayu .table_event th div {
			padding: 0;
			background: none;
		}
		
		#ayu .event_box_01 {
			margin-bottom: 5%;
		}
		
		#ayu .event_box_01 .event {
			 margin-top: 0;
		}


		#ayu .event_box_02 .img-event {
			position: static;
			margin-bottom: 2%;
		}
		
		#ayu .event_box_02 .img-event img {
			width: 100%;
		}
		
		#ayu .event_box_02 .lead_box_02 {
			 float: none;
			 width: 100%;
			 margin: 0 0 5%;
		}
		
		#ayu .event_box_02 .lead_box_02 dt {
			margin-bottom: 2%;
		}

		#ayu .event_box_02 .event {
			float: none;
		}
		
		#ayu .event_box_02 .event_point {
			width: 90%;
		}
		
		#ayu .event_box_02 .event_point th div {
			background: none !important;
			color: #e243df;
		}


		/* 川遊び　*/


		#river {	
			background: none;
		}

		#river .container {
			 padding-bottom: 10%;
		}


		#river .img-ttl {
					float: none;
					width: 100%;
					margin-bottom: 3%;
		}
		#river .img-ttl img {
			width: 100%;
		}
		#river .ttl_box {
			float: none;
			width: 100%;
		}

		#river .ttl_box_ttl {
			float: none;
			margin-top: 0;
		}
		#river .ttl_box_ttl_sp {
			float: none;
			display: table-cell;
			width: 30%;
			margin-left: 5%;
		}
		#river .ttl_box_lead {
			float: none;
		}
		#river .ttl_box_lead_sp {
			float: none;
			display: table-cell;
			vertical-align: middle;
			margin: 0;
			padding-left: 5%;
		}
		
		#river .icon_toei {
			margin-bottom: 10px;
		}

		#river .txt_tate {
			width: 100%;
			height: auto;
			background: none;
			line-height: 1.6;
		}


		#river .lead_box {
			margin: 5% 0 2%;
		}

		#river .lead_box dt {
			margin-bottom: 2%;
		}

		#river .lead_box dd {
			padding-left: 0;
		}
		
		#river .lead_box dd ul li{
			float: left;
			width: 49%;
			margin-right: 1%;
		}
		
		#river .lead_box dd ul li:last-child {
			margin: 0;
		}
		
		#river .lead_box dd ul li img {
			width: 100%;
		}

    #river .event_lead {
      float: none;
      width: 100%;
			margin-bottom: 5%;
      padding-left: 0;
    }

		#river .event {
			float: none;
		}

		#river .boxT {
			width: 100%;
			padding-top: 2% !important;
			background-size: contain;
		}


		#river .boxM {
			background-size: contain;
		}


		#river .boxB {
			padding-bottom: 2%;
			background-size: contain;
		}

		#river .table_event {
			width: 94%;
			margin: 0 auto;
		}


		#river .table_event th div {
			padding: 0;
			background: none;
		}



/* 注意事項　*/
		#caution {	
			width: 100%;
			margin: 0 auto 10%;
			background-size: contain;
			padding-top: 2%;
		}

		#caution .boxM {
			background-size: contain;
		}

		#caution .boxB {
			background-size: contain;
			padding-bottom: 2%;
		}
		
		.caution_box_sp {
			width: 85%;
			margin: 0 auto;
		}


		#caution .ttl_caution {
			padding: 8% 0 5%;
		}

		#caution .caution_lead {
			margin-bottom: 5%;
			text-align: center;
			font-size: 100%;
		}

		#caution ol {
			width: 100%;
		}

		#caution ol li {
			padding: 5px 0 10px 10%;
		}
		
		#caution ol li:nth-child(1) {
			background-size: 7.5% auto;
		}
		
		#caution ol li:nth-child(2) {
			background-size: 7.5% auto;
		}
		
		#caution ol li:nth-child(3) {
			background-size: 7.5% auto;
		}
		
		#caution ol li:nth-child(4) {
			background-size: 7.5% auto;
		}
		
		#caution ol li:nth-child(5) {
			background-size: 7.5% auto;
		}
		
		#caution ol li:nth-child(6) {
			background-size: 7.5% auto;
		}


}