/*========================================
p06周辺観光css



========================================*/

/*============================== おすすめ周辺観光エリア */
.spotlist{
 margin-top: 80px;
 padding-bottom: 40px;
}

.spotlistInner{
 display: flex;
 flex-wrap: wrap;
 padding: 50px 0 30px 0;
}


figure.spot{
 width: 320px;
 height: 512px;
 margin: 0 35px 50px 35px;
 background: #fff; 
 border: 1px #59963e solid;
}

.spotlistInner figure:nth-of-child(3n){
 margin-right: 0;
}


figure.spot>img{
 width: 100%;
}

.spot dl{padding: 0 3px;}
.spot dt{
 margin: 0 0 8px 0;
 padding: 0 0 3px 0;
 color: #59963e;
 font-size: 2.1rem;
 text-align: center;
 border-bottom: 1px dotted #000;
}

.spot dt+dd{
 padding: 0 5px 0 5px;
 font-size: 1.5rem;
}

.spot dd.hp{
 position: absolute; bottom: 15px;
 width: 100%;
 font-size: 1.5rem;
 text-align: center;
}

.spot dd.hp a{
 display: inline-block;
 width: 240px;
 padding: 3px 0;
 color: #fff;
 text-decoration: none;
 border: 1px #9b7f33 solid;
 transition: 0.3s linear;
}

.spot dd.hp a:link{background: #9b7f33;}
.spot dd.hp a:visited{background: #9b7f33;}
.spot dd.hp a:hover{color: #9b7f33; background: #fff;}


@media all and (-ms-high-contrast:none){
 .spot dt{
  padding: 6px 0 3px 0;
 }
 .spot dd.hp a{
  padding: 6px 0 3px 0;
 }
}


.weather a{transition: 0.3s linear;}
.weather a:hover{opacity: 0.5;}