@charset "utf-8";
/* CSS Document */
/****************************************************************************/
/**								東栄町の宿特集 								*/
/****************************************************************************/

@import url('https://fonts.googleapis.com/css?family=Sawarabi+Mincho&display=swap');

.pc { display: block; }
.sp { display: none; }
    
		.break{ word-break: break-all; }


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

#lnav {
	width: 1032px;
	margin: 0 auto 20px;
  background: url("/img/feature/yado/nav_bg.png") no-repeat right top;
  background-size: 0.57% auto;
}

#lnav li {
	box-sizing: border-box;
	float: left;
  width: 11.1%;
	padding: 5px 0 0 0.48%;
  background: url("/img/feature/yado/nav_bg.png") no-repeat left top;
  background-size: 5.1% auto;
  text-align: center;
}

#yado {
	width: 1030px;
	margin: 0 auto;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#yado .box {
  position: relative;
  margin-bottom: 40px;
}

#yado .box-ttl {
  margin-bottom: 15px;
  text-align: center;
}

#yado .box-copy {
  margin-bottom: 35px;
  color: #eb8432;
  font-size: 1.8rem;
  text-align: center;
}

#yado .box-content {
  margin-bottom: 45px;
}

#yado .box-content-img {
  position: relative;
  width: 500px;
}

#yado .box-content-txt {
  position: relative;
  width: 475px;
}

#yado .box-l .box-content-img {
  float: right;
}
#yado .box-l .box-content-txt {
  float: left;
}

#yado .box-r .box-content-img {
  float: left;
}
#yado .box-r .box-content-txt {
  float: right;
}

#yado .box-content-txt p:first-child {
  margin-bottom: 30px;
  color: #404040;
  font-size: 1.8rem;
  line-height: 2;
}

#yado .box-content-btn {
  text-align: center;
}

#yado .box-info {
  padding: 35px 56px 35px 60px;
  border-radius: 12px;
  background-color: #edeae1;
  color: #404040;
}

#yado .box-info-ttl {
  margin-bottom: 25px;
  padding: 0 0 30px 7px;
  background: url("/img/feature/yado/accomodation_border.jpg") no-repeat left bottom;
  font-family: 'Sawarabi Mincho', sans-serif;
  font-size: 3.6rem;
  font-weight: normal;
}

#yado .box-info dl {
  font-size: 1.8rem;
  line-height: 1.5;
}

#yado .box-info dt {
  float: left;
  width: 8em;
  margin-bottom: 5px;
}

#yado .box-info dd {
  margin-left: 8em;
  margin-bottom: 5px;
}

#yado .box-info dd a {
  text-decoration: underline;
}

#yado .box-icon {
  position: absolute;
}

#yado #box01 .box-icon { top: 0; right: 0; margin-top: 10.09%; margin-right: 22.03%; }
#yado #box02 .box-icon { bottom: 0; right: 0; margin-bottom: -3.36%; }
#yado #box02 .box-content-btn { padding-left: 14.1%; text-align: left; }
#yado #box03 .box-icon { bottom: 0; left: 0; margin-bottom: -6.31%; }
#yado #box03 .box-content-btn { padding-right: 6.31%; text-align: right; }
#yado #box04 .box-icon { bottom: -30px; right: 0; margin-right: -31%; }
#yado #box05 .box-icon { bottom: 0; left: 0; margin-left: -18.6%; margin-bottom: -13%; }
#yado #box06 .box-icon { top: 0; right: 0; margin-top: 6.11%; margin-right: 26.69%; }
#yado #box07 .box-icon { top: 0; right: 0; margin-top: 7.66%; margin-right: 12.81%; }
#yado #box08 .box-icon { bottom: 0; right: 0; margin-bottom: -4.63%; margin-right: 3.36%; }
#yado #box08 .box-content-btn { padding-left: 4.21%; text-align: left; }
#yado #box09 .box-icon { bottom: -27%; left: 0; }




@media screen and (max-width:640px){
	
		img, button{
			max-width: 100%;
			height: auto;
			width:auto;
		}
		.pc { display: none !important; }
		.sp { display: block !important; }
		
		.scroll { margin-bottom: 10%; overflow: auto; white-space: nowrap; }
		.scroll::-webkit-scrollbar { height: 5px; }
		.scroll::-webkit-scrollbar-track { background: #F1F1F1; }
		.scroll::-webkit-scrollbar-thumb { background: #BCBCBC; }



	#yado {
			width: 96%;
		}
		
		#head_title {
			width: 100%;
		}
		
		#head_title img {
			width: 96%;
		}
    
		#lnav {
			width: 96%;
		}
    
		#lnav li {
			width: 20%;
			margin-bottom: 5%;
		}
    
		#lnav img {
			width: 85%;
		}

  #yado .box-ttl img {
		width: 80%;
  }

  #yado .box-content-img {
    float: none !important;
    width: 96%;
    margin: 0 auto 30px;
  }

  #yado .box-content-txt {
    float: none !important;
    width: 96%;
    margin: 0 auto;
  }

  #yado .box-info {
    padding: 5% 4% 4%;
  }

  #yado .box-info dt {
	float: none;
	width: 100%;
	margin-bottom: 5px;
  }

  #yado .box-info dd {
	margin: 0 0 5% ;
	word-break: break-all;
  }

  #yado .box-info-ttl {
    font-size: 2.8rem;
  }

  #yado #box01 .box-icon { margin-right: 0; width: 19.37%; }
  #yado #box02 .box-icon { width: 18.59%; }
  #yado #box03 .box-icon { width: 23.9%; }
  #yado #box04 .box-icon { bottom: 0; right: initial; left: 0; margin-right: 0; margin-bottom: -3.36%; width: 25.78%; }
  #yado #box04 .box-content-btn { padding-right: 6.31%; text-align: right; }
  #yado #box05 .box-icon { bottom: 0; left: initial; right: 0; margin-left: 0; margin-bottom: -3.36%; width: 25.15%; }
  #yado #box05 .box-content-btn { padding-left: 6.31%; text-align: left; }
  #yado #box06 .box-icon { margin-right: 6%; width: 19.06%; }
  #yado #box07 .box-icon { margin-right: 0; width: 28%; }
  #yado #box08 .box-icon { width: 18.9%; }
  #yado #box09 .box-icon { bottom: -18%; left: 0; }
}