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


/* indexBannerArea ------------------------------------*/
#indexBannerArea{
	padding:15px 0 10px 0;
	/*background-color:#56b58d;*/
	background-color:#222;
}

#indexBannerArea ul li{
	display:inline-block;
}

#indexBannerArea ul li{
	margin:0 7px;
}

#indexBannerArea ul li:first-child{
	margin:0 7px 0 0;
}

#indexBannerArea ul li:last-child{
	margin:0 0 0 7px;
}

#indexBannerArea ul li a img{
	/*border:1px solid #fff;*/
}


/* indexTourismNav2 ------------------------------------*/

#indexTourismNav2{
	font-family: 游明朝, 'Yu Mincho', 游明朝体, YuMincho, 'ＭＳ Ｐ明朝', 'MS PMincho', 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', HiraMinProN-W3, HGS明朝E, serif;
	width:100%;
	background-color:#5dc499;
	color:#FFF;
	padding:30px 0 40px 0;
	text-align:center;
}
#indexTourismNav2 #indexTourismNav2Mark{
	text-align:center;
	margin:0 0 10px 0;
}
#indexTourismNav2 h2{
	font-family: 游明朝, 'Yu Mincho', 游明朝体, YuMincho, 'ＭＳ Ｐ明朝', 'MS PMincho', 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', HiraMinProN-W3, HGS明朝E, serif;
	display:block;
	font-size:246.2%;
	text-align:center;
	margin:0 auto;
	letter-spacing:3px;
	line-height:140%;
}
#indexTourismNav2 ul{
	display:block;
	width:880px;
	margin:50px auto 40px auto;
}
#indexTourismNav2 ul li{
	display:inline-block;
	float:left;
	text-align:center;
	margin:0 auto;
	font-size:123.1%;
	width:146px;
}

#indexTourismNav2 ul li a{
	color:#fff;
	display:block;
}

#indexTourismNav2 ul li img{
	display:block;
	text-align:center;
	margin:0 auto 10px auto;
}
#indexTourismNav2 p a{
	display:block;
	margin:0 auto;
	color:#5dc499;
	background-color:#fff;
	border:1px solid #fff;
	border-radius: 25px;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
	width:33%;
	margin:0 auto;
	padding:10px 15px 10px 10px;
	text-align:center;
	font-size:116%;
}
#indexTourismNav2 p a:hover{
	color:#fff;
	background-color:#5dc499;
	border:1px solid #fff;
}


/* indexConventionNav ------------------------------------*/

#indexConventionNav{
	font-family: 游明朝, 'Yu Mincho', 游明朝体, YuMincho, 'ＭＳ Ｐ明朝', 'MS PMincho', 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', HiraMinProN-W3, HGS明朝E, serif;
	letter-spacing:3px;
	width:100%;
	background-color:#5dc499;
	color:#FFF;
	padding:30px 0 40px 0;
	text-align:center;
}

#indexConventionNav #indexConventionNavMark{
	text-align:center;
	margin:0 0 10px 0;
}

#indexConventionNav h2{
	font-family: 游明朝, 'Yu Mincho', 游明朝体, YuMincho, 'ＭＳ Ｐ明朝', 'MS PMincho', 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', HiraMinProN-W3, HGS明朝E, serif;
	display:block;
	font-size:246.2%;
	text-align:center;
	margin:0 auto;
	line-height:140%;
}
#indexConventionNav ul{
	display:block;
	width:880px;
	margin:50px auto 40px auto;
}
#indexConventionNav ul li{
	display:inline-block;
	float:left;
	text-align:center;
	margin:0 auto;
	font-size:123.1%;
	width:220px;
}
#indexConventionNav ul li a{
	display:block;
	color:#fff;
}

#indexConventionNav ul li img{
	display:block;
	text-align:center;
	margin:0 auto 10px auto;
}
#indexConventionNav p a{
	display:block;
	margin:0 auto;
	color:#5dc499;
	background-color:#fff;
	border:1px solid #fff;
	border-radius: 25px;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
	width:33%;
	margin:0 auto;
	padding:10px 15px 10px 10px;
	text-align:center;
	font-size:116%;
}
#indexConventionNav p a:hover{
	color:#fff;
	background-color:#5dc499;
	border:1px solid #fff;
}

/* indexContentsNav_L ------------------------------------*/

#indexContentsNav_L{
	width:100%;
	background-color:#f6f6f6;
	padding:40px 0 30px 0;
	text-align:center;
}

#indexContentsNav_L ul{
	display:block;
	width:980px;
	margin:0px auto;
}

#indexContentsNav_L ul li{
	display:inline-block;
	float:left;
	text-align:center;
	margin:0 auto;
	
	width:33.333%;
}

#indexContentsNav_L ul li p a{
	padding:0 0 0 18px;
	position:relative;
}

#indexContentsNav_L ul li p a::before{
	content:url(../img/arrowRight.svg);
	top:0;
	left:0;
	position:absolute;
}

#indexContentsNav_L ul li img{
	display:block;
	text-align:center;
	margin:0 auto 10px auto;
}

/* indexContentsNav_S ------------------------------------*/

#indexContentsNav_S{
	width:100%;
	padding:40px 0 10px 0;
	text-align:center;
	background-color:#f6f6f6;
}

#indexContentsNav_S ul{
	display:block;
	width:980px;
	margin:0px auto;
}

#indexContentsNav_S ul li{
	display:inline-block;
	float:left;
	text-align:center;
	margin:0 auto 20px auto;
	box-sizing:border-box;
	width:25%;
}

#indexContentsNav_S ul li p a{
	
	padding:0 0 0 18px;
	position:relative;
	box-sizing:border-box;
}

#indexContentsNav_S ul li p a::before{
	content:url(../img/arrowRight.svg);
	top:2px;
	left:0;
	position:absolute;
}

#indexContentsNav_S ul li img{
	display:block;
	text-align:center;
	margin:0 auto 10px auto;
}

/* topics ------------------------------------*/

#topics{
	margin:30px 0;
}

#newsArea{
	width:510px;
	margin:0;
}

#newsArea h2{
	font-size:123.1%;
	padding:0 0 15px 30px;
	background:url(../img/naganoblogIcon.gif) no-repeat left top;
	border-bottom:1px dotted #ccc;
}

#newsArea ul li a h3{
	padding:3px 0 0 18px;
	font-size:108%;
	position:relative;
}

#newsArea ul li a h3::before{
	content:url(../img/arrowRight.svg);
	top:4px;
	left:0;
	position:absolute;
}

#newsArea ul li{
	border-bottom:1px dotted #CCC;
	margin:0;
	padding:15px 0;;
}

#newsArea ul{
	margin:0 0 10px 0;
	
}
#newsArea ul li p{
	font-size:93%;
	line-height:150%;
}

.newsMore{
	text-align:right;
	margin:0 0 20px 0;
}

#bannerArea{
	display:block;
	width:425px;
	float:right;
}

#bannerArea p{
	margin:0 0 10px 0;
}

#bannerArea div a{
	padding:0 0 0 18px;
	position:relative;
}

#bannerArea div a::before{
	content:url(../../common/img/arrowRight.svg);
	top:0;
	left:0;
	position:absolute;
}

#bannerArea p.bannerS{
	float:left;
	margin:20px 0 0 15px;
}

#bannerArea .indexYoutube{
	position: relative;
  	width: 100%;
 	padding-top: 56.25%;
	margin:0 0 30px 0;
}

#bannerArea .indexYoutube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}


/* indexTourismNav / wideslider ------------------------------------*/

#indexTourismNav{
	margin:0;
	min-height:500px;
}

.wideslider {
	padding-bottom:0px;
	width: 100%;
	text-align: left;
	position: relative;
	overflow: hidden;
}

.wideslider ul,
.wideslider ul li {
	float: left;
	display: inline;
	overflow: hidden;
}

.wideslider ul li img {
	width: 100%;
	display: none;
}

.wideslider_base {
	top: 0;
	position: absolute;
}
.wideslider_wrap {
	top: 0;
	position: absolute;
	overflow: hidden;

}
.slider_prev,
.slider_next {
	top: 0;
	overflow: hidden;
	position: absolute;
	z-index: 100;
	cursor: pointer;
}
.slider_prev {background: #fff url(../img/prev.jpg) no-repeat right center;}
.slider_next {background: #fff url(../img/next.jpg) no-repeat left center;}

.pagination{
	display:none;
}

/*.pagination {
	bottom: 20px;
	left: 0;
	width: 100%;
	height: 30px;
	text-align: center;
	position: absolute;
	z-index: 200;
}

.pagination a {
	margin: 0 5px;
	width: 30px;
	height: 30px;
	display: inline-block;
	overflow: hidden;
}
.pagination a.pn1 {background: transparent url(../img/pn1.jpg) no-repeat left top;}
.pagination a.pn2 {background: transparent url(../img/pn2.jpg) no-repeat left top;}
.pagination a.pn3 {background: transparent url(../img/pn3.jpg) no-repeat left top;}
.pagination a.pn4 {background: transparent url(../img/pn4.jpg) no-repeat left top;}
.pagination a.pn5 {background: transparent url(../img/pn5.jpg) no-repeat left top;}

.pagination a.active {
	filter:alpha(opacity=100)!important;
	-moz-opacity: 1!important;
	opacity: 1!important;
}
*/

/* =======================================
	ClearFixElements
======================================= */
.wideslider ul:after {
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
}

.wideslider ul {
	display: inline-block;
	overflow: hidden;
}

/* insta  ------------------------------------*/

.instaPhoto{
	background:#f2f2f2;
	padding:0 5px 40px 5px;
	box-sizing:border-box;
}

.instaPhoto ul#instafeed li{
	display:inline-block;
	width:25%;
	padding:10px 5px 20px 5px;
	box-sizing:border-box;
	letter-spacing: -.40em;
	vertical-align:top;
	text-align:center;
}


ul#instafeed {
    /*display:-webkit-box;
    display:-moz-box;
    display:-ms-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:-ms-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
	display:table;
    width:100%;*/
}

/*ul#instafeed li{
	display:table-cell;
    width:20%;
	box-sizing:border-box;
	border-right:1px solid #000;
	border-bottom:1px solid #000;
}*/

.instaPhoto ul#instafeed li a{
    width:100%;
	display:block;
}

.instaPhoto ul#instafeed li img{
	width:100%;
	height:auto;
	box-sizing:border-box;
}

.instaPhoto ul#instafeed li span{
	display:block;
	letter-spacing: normal;
	padding:5px 10px 0 10px ;
	box-sizing:border-box;
	font-size:100%;
	text-align:left;
	line-height:140%;
	word-wrap:break-word;
	color:#333;
}

/* -------------------------------------------------------*/
/* max-width: 768px ------------------------------------*/
/* -------------------------------------------------------*/

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


/* indexBannerArea ------------------------------------*/


#indexBannerArea ul li{
	text-align:center;
	display:block;
}

#indexBannerArea ul li{
	margin:0 0 20px 0;
}

#indexBannerArea ul li:first-child{
	margin:0 0 20px 0;
}

#indexBannerArea ul li:last-child{
	margin:0 0 20px 0;
}

#indexBannerArea ul li img{
	max-width:100%;
	height:auto;
}

#indexTourismNav2{
	
}

#indexTourismNav2 #indexTourismNav2Mark img{
	max-width:100%;
	height:auto;
}

#indexTourismNav2 h2{
	font-size:200%;
}

#indexTourismNav2 ul{
	width:100%;
	margin:20px auto 0 auto;
}

#indexTourismNav2 ul li{
	display:inline-block;
	width:50%;
	text-align:center;
	margin-bottom:30px;
}

#indexTourismNav2 p a{
	width:100%;
	box-sizing:border-box;
}


#indexConventionNav #indexConventionNavMark img{
	max-width:100%;
	height:auto;
}

#indexConventionNav h2{
	font-size:200%;
}

#indexConventionNav ul{
	width:100%;
	margin:20px auto 0 auto;
}

#indexConventionNav ul li{
	display:inline-block;
	width:50%;
	text-align:center;
	margin-bottom:30px;
}

#indexConventionNav p a{
	width:100%;
	box-sizing:border-box;
}

#indexContentsNav_L{
	margin-bottom:30px;
}

#indexContentsNav_L ul{
	width:100%;
}

#indexContentsNav_L ul li{
	display:block;
	float:none;
	width:100%;
	margin-bottom:30px;
}

#indexContentsNav_L ul li img{
	max-width:100%;
	height:auto
}

#indexContentsNav_S ul{
	width:100%;
	letter-spacing: -.40em; /* 文字間を詰めて隙間を削除する */
}

#indexContentsNav_S ul li{
	display:inline-block;
	vertical-align:top;
	width:49%;
	padding:10px 5px 10px 5px;
	box-sizing:border-box;
	margin:0;

	float:none;
	text-align:left;
	letter-spacing: normal;
}

#indexContentsNav_S ul li a{
	display:block;
	box-sizing:border-box;
	line-height:150%;
	text-align:left;
}


#indexContentsNav_S ul li img{
	width:100%;
	height:auto
}


/* topics ------------------------------------*/

#topics{
	margin:0;
}

#newsArea{
	width:100%;
	margin:0;
}

#newsArea a.newsAreaBn{
	display:inline-block;
	float:left;
	width:32%;
	margin:0 2px 0 0;
}

#newsArea a.newsAreaBn img{
	max-width:100%;
	height:auto;
}

#bannerArea{
	width:100%;
	float:none;
	margin:20px auto;
}

#bannerArea p{
	margin:0 0 10px 0;
}

#bannerArea div a{
	padding:0 0 0 18px;
	position:relative;
}

#bannerArea div a::before{
	content:url(../../common/img/arrowRight.svg);
	top:0;
	left:0;
	position:absolute;
}
	
#indexTourismNav{
	width:100%;
	height:350px;
	min-height:350px;
	overflow:hidden;
}

#indexTourismNav img{
	width:100%;
	max-width:100%;
	height:auto;
}
	
.wideslider {
	margin-top:-75px;
}

.wideslider ul,
.wideslider ul li {
	height:350px;
}

.wideslider ul li img {
	width: 100%;
	height:auto;
	display: none;
}

.wideslider_base {
	height:350px;
	top: 0;
	position: absolute;
}
.wideslider_wrap {
	height:350px;
	top: 0;
	position: absolute;
	overflow: hidden;

}
	
/* insta  ------------------------------------*/

.instaPhoto ul{
	text-align:center;
}


.instaPhoto ul#instafeed li{
    width:49%;
}

	
}