#header_sub, #brekkie, #facilities {
	background-color: #d5d2c7;
	padding: 50px 0;
}

#brekkie, #facilities {
	background-color: #d5d2c7;
	padding: 50px;
}

/* ---------------------------------------------------------------------------------------------

　   タイトル

--------------------------------------------------------------------------------------------- */
#accommo_t h2 {
    width: 100%;
    text-align: left;
    font-size: 2em;
    font-family: pennsylvania, monospace;
    margin: 0 0 40px 0;
}

.hero_terms_inn h1 {
    font-size: 2em;
    font-family: pennsylvania, monospace;
    color: #f4f4f4;
    background: #6f8310;
    width: 300px;
    /*padding: 0 20px;*/
    text-align: center;
    position: relative;
    top: 60vh;	
}

/* ---------------------------------------------------------------------------------------------

　   ヒーロー

--------------------------------------------------------------------------------------------- */
#hero_terms {
	height: 70vh;
}

 .hero_terms_inn {
     background-image: url("../image/terms/entrance_sign.jpg");
     background-position: center;
     background-size: cover;
     height: 70vh;
}

/* ---------------------------------------------------------------------------------------------

　   SUMMARY

--------------------------------------------------------------------------------------------- */
#header_sub a {
	color: #535761;
	font-size: 0.8em;
    letter-spacing: 0.1em;
}

.summary {
	width: 90%;
    display: flex;
    justify-content: center;
    margin: 0 auto;
}

.summary .l-box {
	padding-right: 10px;
	border-right: solid 1px #f4f4f4;
}

.summary .r-box ul {
	display: flex;
	justify-content: space-around;
	margin: 20px 0 0 0;
}

.summary .r-box ul li {
    width: 100%;
    text-align: center;
    border-right: solid 1px #535761;
	font-family: a-otf-ryumin-pr6n, serif;
	padding: 0 5px;
}

.summary .r-box ul li:nth-child(5n) {
    border-right: none;
}

.summary .l-box p,
.summary .r-box p {
	font-family: a-otf-ryumin-pr6n, serif;
}


/* ---------------------------------------------------------------------------------------------

　   ACCOMMODATION TERMS

--------------------------------------------------------------------------------------------- */
#accommo_t h3 {
    font-family: a-otf-ryumin-pr6n, serif;
    font-weight: bold;
    border-bottom: solid 2px #6f8310;
    width: fit-content;
    margin: 20px 0;
}

#accommo_t ul li,
#accommo_t table,
#accommo_t table.tbl ul li {
    font-size: 0.9em;
}

/*--------------------------------------
table
--------------------------------------*/
table.tableDef {
  width: 100%;
  border: solid 1px #ddd;
  table-layout: fixed;
}
table.tableDef tr {
  border-bottom: solid 1px #ddd;
  font-size: 12px;
  line-height: 1.8em;
}
table.tableDef tr:last-child {
  border-bottom:none;
}
table.tableDef th,
table.tableDef td {
  vertical-align: middle;
  border-left: solid 1px #ddd;
  padding: 12px 15px;
}
table.tableDef th {
  font-weight: normal;
  background: #ECECEC;
  text-align: left;
}
table.tableDef td {
  text-align: center;
}
.tableDef {
  border: 1px solid #DDD;
}
.tableDef dl {
  display: table;
  width: 100%;
  font-size: 12px;
}
.tableDef dl ~ dl {
  border-top: 1px solid #DDD;
}
.tableDef dt {
  display: table-cell;
  width: 200px;
  vertical-align: top;
  background: #ECECEC;
  padding: 10px 20px;
  box-sizing: border-box;
}
.tableDef dd {
  display: table-cell;
  vertical-align: top;
  padding: 10px 20px;
}

.hc-pc-hide {
    display: none !important;
}

/* ---------------------------------------------------------------------------------------------

　  メディアクエリ

--------------------------------------------------------------------------------------------- */
@media only screen and (max-width: 1440px){
}

 @media only screen and ( max-width : 768px ) {
	#hero_terms {
    		height: 43vh;
	}
	 
	.hero_terms_inn {
		height: 52vh;
		background-repeat: no-repeat;
		background-size: contain;
	}
	
	.hero_terms_inn h1 {
		font-size: 2em;
		position: relative;
		top: 35vh;
	 }
	 
	.summary {
		 display: block;
	}
	
	.summary .l-box {
		border-right: none;
		border-bottom: solid 1px #f4f4f4;
		padding-bottom: 5px;
	}
	 
	 
	 #brekkie .df_box {
		 display: block;
	 }

	 #brekkie .df_box .r-box {
		 margin: 20px 0;
	 }
	 
	 #brekkie .df_box .r-box {
		 display: flex;
		 justify-content: center;
	 }
	 
	 #brekkie .df_box .l-box img {
		width:100%;
	 }

	 #toiletaries .df_box {
		max-width: 100%;
	}
     
    .hc-sp-hide {
        display: none !important;
    }
     
     .hc-sp-show {
        display: block !important;
    }
     
}

 @media only screen and ( max-width : 480px ) {
	 #hero_terms {
		height: 36vh;
	}
	 
	.hero_terms_inn {
		position: relative;
		height: 45vh;
	}
	 
	 .hero_terms_inn h1 {
		top: 35vh;
		width: 100%;
	}	
	 	 
	 .summary .l-box p, .summary .r-box p {
		font-size: 0.8em;
	}
			 
	 .summary .r-box ul {
		flex-wrap: wrap;
		justify-content: center;
		margin: 20px 0 0 0;
	}

	 .summary .r-box ul li {
		width: 100%;
		text-align: left;
		border-right: none;
		padding: 0 5px;
   		margin: 5px;
	}
	 
	 .summary .r-box ul li::before {
		content: '▷';
		margin-right: 0.6em;
	}
	 
	 #accommo_t h2 {
		width: 100%;
		text-align: center;
		font-size: 2em;
		font-family: pennsylvania, monospace;
		margin: 0 0 40px 0;
	}

	 #accommo_t .sub-t {
		padding-right: 10px;	 
	 }
	 
	 #brekkie, #facilities {
		padding: 50px 20px;
	}
	 .room_desc {
		 padding: 0 1px 0 0;
		 width: 100%;
	 }
	 
	 .room_desc dl {
    	font-size: 0.8em;
		padding: 18px;
	}
	 
	 .room_slides ul li.bunk1,
	 .room_slides ul li.bunk2,
	 .room_slides ul li.bunk3,
	 .room_slides ul li.bunk4,
	 .room_slides ul li.bunk5 {
		min-height: 200px;
	}

	.room_slides ul li.gramp1,
	.room_slides ul li.gramp2,
	.room_slides ul li.gramp3,
	.room_slides ul li.gramp4,
	.room_slides ul li.gramp5 {
		min-height: 200px;
	}

	.room_slides ul li.own1,
	.room_slides ul li.own2,
	.room_slides ul li.own3,
	.room_slides ul li.own4,
	.room_slides ul li.own5 {
		min-height: 220px;
	}
	 	 
	 #brekkie .df_box .l-box,
	 #brekkie .df_box .r-box {
		 margin: 0 auto;
		 margin-top: 20px;
		 text-align: center;
		 display: block;
	 }
	 
	 #brekkie .df_box .r-box dl {
		font-size: 0.8em;
	}
	 
	 #brekkie .menu_list .l-box,
	 #brekkie .menu_list .r-box {
			padding: 0;
		}
	 #brekkie .df_box .l-box img {
		 max-width: 200px;
	 }
	 
	 #brekkie .df_box .r-box .df_box {
		 display: block;
		 margin-top: 20px;
	 }
	 
	 #toiletaries .df_box {
		flex-wrap: wrap;
	    max-width: 100%;	 
	}

	 #toiletaries .df_box .icons {
		margin: 0;
	}
	 #toiletaries .df_box .icons img {
		min-width: 100px;
	}
	 
	 #facilities p {
		 font-size: 0.8em;
	 }
	 
}


 @media only screen and ( max-width : 320px ) {
	 #hero_terms {
		height: 52vh;
	 }
	 
	 .hero_terms_inn {
		position: relative;
		top: 14vh;
		height: 30vh;
		background-size: cover; 
	}

	 .hero_terms_inn h1 {
		width: 100%;
		top: 29vh;
	}
	 
	 .summary {
		 width: 100%;
	 }

	 #brekkie {
		padding-bottom: 45vh;
		padding: 30px;
		margin-top: 40px;
		}

	 #accommo_t {
		 padding-bottom: 45vh;
		 padding: 30px;
	 }
	 	 
	 .room_desc dl {
    	font-size: 0.8em;
		padding: 18px;
	}
	 
}