@charset "UTF-8";

/* SP用 */


@media screen and (max-width:480px) {
	
	#page_info_wrap{
	width:95%;
	height:auto;
	overflow: auto;
	margin:40px auto;
	
}


#wrapper{
	position:relative;
	width:100%;
	margin:0;
	padding:0;
	padding-top:55px;
	overflow: hidden;
}
#top-wrapper{
	position:relative;
	width:100%;
	margin:0;
	padding:0;
	padding-top:110px;
	overflow: hidden;
}



#common-header{
	margin:0;
	padding:0;
	position:fixed;
	background:#fff;
	height:55px;
}
	
	#common-header h1{
	width:100%;
	height:30px;
	line-height:1;
 }

#h_text{
width:90%;
display: block;
font-size:10px;
line-height:10px;
font-weight:normal;
padding:5px 0;
color:#fff;
}


#header_inner{
	width:100%;
	height:80px;
	position:relative;
	padding:0 0 0 0;
	
}
#header_inner h1{
	width:80%;
	padding:0 0 2% 2%;
	display:block;
	z-index:9999;
	position:absolute;
}

#header_inner h1 a{
	float:left;
display:block;
width:80%;
margin-top:5%;
}

#header_inner h1 img{
	width:100%;
	height:100%;
}
	
#header_inner h1#h_tab{
	position:absolute;
	top:0;
	left:0;
 }

	#h_btn{
		display: none;
	}
#h_logo{
	width:auto;
	text-align: center;
	position:absolute;
	margin:0 auto;
	top:15px;
	bottom:15px;
	left:0;
	right:0;
	z-index: 10000;
}
	
	#h_logo img{
	height:60px;
}

#toggle img,
	.w100 img{
	width:100%;
	display: block;
}


#toggle{
	width:60px;
	height:60px;
display:block;
	z-index: 1000;
position:absolute;
	right:0;}

#toggle img{
	width:100%;
	display: block;
}

#menu{
	width:100%;
    display: none;
	position:absolute;
	top:80px;
	left:0;
	overflow: hidden;
	  }
  #menu li{
	 display:block;
	
  }

 nav {
	  width: 100%;
top:70px;
left:0px;
  padding: 0;
  
 }
 nav ul {
margin: 0;
 padding: 0;
 background:#a87941;

 }
 
  nav ul#menu {
 height:640px;
 overflow: auto;
 -webkit-overflow-scrolling: touch;
 clear:both;
 }
 
nav ul li a {
width:100%;
height:1em;
clear:both;
display: block;
border-bottom: 1px solid #fff;
font-size: 1.4rem;
line-height:1.2em;
padding:1em 0 1em 1em;
text-indent:0;
color:#fff;
text-align:left;
}

nav ul li.nav1 a,
nav ul li.nav2 a,
nav ul li.nav3 a,
nav ul li.nav4 a,
nav ul li.nav5 a,
nav ul li.nav1 a:hover,
nav ul li.nav2 a:hover,
nav ul li.nav3 a:hover,
nav ul li.nav4 a:hover,
nav ul li.nav5 a:hover,
nav li ul li.nav1_1 a,
nav li ul li.nav1_2 a,
nav li ul li.nav1_3 a,
nav li ul li.nav1_4 a,
nav li ul li.nav1_5 a,
nav li ul li.nav1_1 a:hover,
nav li ul li.nav1_2 a:hover,
nav li ul li.nav1_3 a:hover,
nav li ul li.nav1_4 a:hover,
nav li ul li.nav1_5 a:hover,
nav li ul li.nav2_1 a,
nav li ul li.nav2_2 a,
nav li ul li.nav2_3 a,
nav li ul li.nav2_1 a:hover,
nav li ul li.nav2_2 a:hover,
nav li ul li.nav2_3 a:hover,
nav li ul li.nav3_1 a,
nav li ul li.nav3_2 a,
nav li ul li.nav3_3 a,
nav li ul li.nav3_1 a:hover,
nav li ul li.nav3_2 a:hover,
nav li ul li.nav3_3 a:hover,
nav li ul li.nav5_1 a,
nav li ul li.nav5_2 a,
nav li ul li.nav5_1 a:hover,
nav li ul li.nav5_2 a:hover
{
	 background:none;
 }
 
 nav li ul li.nav1_1 a,
nav li ul li.nav1_2 a,
nav li ul li.nav1_3 a,
nav li ul li.nav1_4 a,
nav li ul li.nav1_5 a,
nav li ul li.nav2_1 a,
nav li ul li.nav2_2 a,
nav li ul li.nav2_3 a,
nav li ul li.nav3_1 a,
nav li ul li.nav3_2 a,
nav li ul li.nav3_3 a,
nav li ul li.nav5_1 a,
nav li ul li.nav5_2 a
{
	 background-color:#4fadea;
 }
 
 nav li ul{
  visibility: visible;
  opacity: 1;
  position:relative;
  left:0;
  }
  
   nav li.nav2 ul,
     nav li.nav3 ul,
	   nav li.nav5 ul{
  left:0;
  }

 nav li ul li a{
width:100%;
height:1em;
clear:both;
display: block;
border-bottom: 1px solid #fff;
font-size: 1.4rem;
line-height:1.2em;
padding:1em 0 1em 1em;
text-indent:0;
color:#fff;
text-align:left;
  visibility: visible;
  opacity: 1;
  transition: 0s;
}

nav li:hover ul li a{
	color:#fff;
	visibility: visible;
  opacity: 1;
}




#h_contact{
	display:none;
}



#h_copy{
	width:90%;
	height:0;
	margin:0 auto 5%;
	background-size:contain;
	padding-top:14%;
}


#h_copy img{
display:none;
}

 .common-contents {
  width: 100%;
  margin: 0 auto 16px;
 }

.common-contents img {

 }
 
 
#common-nav{
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	background:#fff;
}
 
 

article.main {
 width: 100%;
 margin-bottom:2em;
}

  article.main blockquote p {
   margin: 0;
   font-size: 0.9em;
 }
 article {
 width: 100%;
  margin: 0 0 2em;
  border-bottom: none;
}

.supplement{
	font-size:1.2rem;
}

 /*-----------SP footer ----------- */
 
 #common-footer{
	 padding-bottom:10.938%;
	 margin:0;
 }
 
 #common-footer section {
 margin: 0;
}
 
 
#footer_inner{
	 width:100%;
	 position:relative;
	 margin:0;
	 padding:0;
 }

 

  article.top_slider ul{
	  width:100%;
	 margin:0 auto;
 }
 
   article.top_slider ul img{
	  width:100%;
 }
	
	.swiper-button-prev{
		display: none;
	}
		.swiper-button-next{
		display: none;
	}
 
 #footernavi{
	width:100%;
	padding:0;
	margin:0;
}

 
 #footernavi ul{
	text-align:left;
	width:100%;
	margin:0 auto;
	padding:0;
	list-style:none;
	font-size:2.8rem;
	column-count: 1;
}
	
	#footernavi ul:last-child{
		width:100%;
	}

#footernavi li a{
	width: 100%;
	display:block;
	color:#fff;
	background: #a87941;
	 font-size:1.3rem;
	 line-height:1.2em;
	 padding:1em 0 1em 2em;
	 border-bottom:solid 1px #fff;
}
 



#footer_info{
	width:100%;
	margin:0 auto;
	padding:0 1em;
}
	
	#footer_info_text img{
	width:100%;
}

#footer_info_text{
	width:100%;
	margin:20px 0 45px;
	text-align:center;
	font-size:14px;
	line-height:1.4em;
	position:relative;
}	
	
	
	
	#footer_info_text h1{
	margin-top: 20px;
	margin-bottom:10px;
}
	
	#footer_info_text p{
	width:95%;
		padding:2.5%;

}
	
	.f_contact_btn{
		display: none;
	}

#f_contact{
	display:block;
	width:100%;
	position:fixed;
	bottom:0;
	left:0;
	border-top:solid 1px #fff;
	background: #fff;
}

#f_contact ul{
	width:90%;
	padding:0;
	margin:0 auto 10px;
}
	#f_contact li{
	list-style: none;
	margin-top: 10px;
}
	
		#f_contact li img{
	width:100%;
}
	
	#f_contact p a{
	color:#fff;
	font-size:16px;
	display: block;
		padding:0.5em 0;
		text-align: center;
}

#f_contact p img{
	width:100%;
}

#footer_copy{
 padding:1em 0 3em;
 color:#333;
 margin:0;
}

.fnavi_li{
	display:none;
}





 /*-----------TOP ----------- */
	
#top_about{
width:90%;
	margin:1em auto 0;
	text-align: center;

}
	

#top_about h2{
	padding:30px 0;
	margin:0 auto;

}
	
#top_about h2 img{
	height:40px;

}

#top_about_wrap{
width:100%;
	text-align: center;
	display:block;
	margin: 20px 0 0 0;
}
	
#top_about_wrap >div{
width:100%;
margin-bottom: 20px;
}

#top_about_wrap >div img{
width:100%;
}



.top_about_table{
	width:100%;
	margin:0 auto;
	border-top:solid 1px #d3bca0;
}

.top_about_table th{
	background: #fbf8f5;
	border-bottom:solid 1px #d3bca0;
	padding:20px 0;
	font-size:14px;
}

.top_about_table td{
	border-bottom:solid 1px #d3bca0;
	padding:20px 0;
	font-size:14px;
}
	
	
#top_reservation{
	width:100%;
	text-align: center;
	background: #fbf8f5;
	
}

#top_reservation_wrap{
	width:90%;
	margin:0 auto;
	background: none;
	text-align: left;
	padding:50px 0;
}

#top_reservation_wrap h2{
	margin:0 auto 22px;
	text-align: center;
	display: block;
}
	
	#top_reservation_wrap h2 img{
	height:20px;
		
}
	


.top_reservation_text dl{

}
.top_reservation_text dt{
	font-size:18px;
	font-weight: bold;
	color:#492c21;
	margin-bottom: 20px;
}

.top_reservation_text dd{
	font-size:16px;
	color:#492c21;
	margin:0 0 40px 0;
	padding:0;
	line-height: 1.6;
}

.top_reservation_btn{
	width:100%;
	border-radius: 8px;
	box-shadow: 0 0 8px gray;
}
	
	.top_reservation_btn img{
	width:100%;
}
	

#top_3column dl{
	width:100%;
	margin:0 auto;

}
	
#top_3column dt{
	width:90%;
	margin:0 auto 2em;

}

#top_3column dt img{
	width:100%;
	

}



 
/*----------- infomation ----------- */

#top_news h2 img{
	height:40px;

	
}
	
#top_news{
	width:100%;
	height:auto;
	padding:40px 0 40px;
	background:#fff;
	position:relative;
	text-align: center;
}

#top_info{
	width:100%;
	margin:0 auto;
	position:relative;
	padding:20px 0;
	display: flex;
	border-bottom:dotted 1px #d2bc9f;
	text-align: center;
}

#top_info_wrap{
	width:95%;
	height:240px;
	overflow: auto;
	margin:20px auto 40px;
	
}
	#top_info{
		display: block;
	}

#top_info dt{
	width:100%;
	display: block;
	color:#492d1f;
	font-size:14px;
	padding:0;
	margin:0;
	text-align: left;
}

#top_info dd{
	width:100%;
	display: block;
	color:#492d1f;
	font-size:14px;
	padding:0;
	margin:0;
	text-align: left;
}

#top_info h2{
	display:block;
	margin:0 auto;
	text-align:center;
	
}

#top_info ul{
	list-style:none;
	padding:0 20px;
	margin:0;
	font-size:1.8rem;
}

#top_info li{
	border-bottom:dotted 1px #fff;
	padding:20px 0 20px 60px;
	position:relative;
}

#top_info li:last-child{
	border-bottom:none;
	
}

#top_info .news_new img{
	
	vertical-align:middle;
}

#top_info .news_new{
	width:50px;
	margin-right:1em;
	position:absolute;
	top:15px;
	left:0;
}

#top_info .date{
	font-size:1.4rem;
	display:inline-block;
	color:#fff;
	font-weight:bold;
	width:10%;
	vertical-align:top;
	text-align:right;
	margin-right:1em;
}

#top_info .top_info_text{
	font-size:1.4rem;
	display:inline-block;
	width:85%;
	vertical-align:top;
}

.top_info_btn a{
	width:200px;
	padding:15px;
	border:solid 2px #ed751f;
	border-radius: 30px;
	color:#ed751f;
	margin:0 auto;
	font-size:16px;
}


/*----------- 3point ----------- */


#top_3column_wrap{
	width:100%;
	padding:40px 0;
	margin:0 auto;
	display: block;
}

#top_3column dl{
	width:90%;
}

#top_3column dl dd h3{
	color:#ed751e;
	font-weight: bold;
	font-size:18px;
	text-align: center;
	margin:20px auto;
}

#top_3column dl dd {
	margin:0;
	padding:0;
	
}
#top_3column dl dd p{
	font-size:14px;
	line-height:1.6em;
	color:#472d22;
}

.top_3columns_btn{
	margin-top:40px;
	margin-bottom:40px;
	text-align: center;
}

.top_3columns_btn a{
	width:200px;
	padding:15px;
	border:solid 2px #ed751f;
	border-radius: 30px;
	color:#ed751f;
	margin:0 auto;
	font-size:16px;
}


#top_qa{
	width: 100%;
	margin: 0 auto;
	padding:40px 0;
	text-align: center;
}

#top_qa_wrap{
	width:90%;
	padding:40px 0 0;
	margin:0 auto;
	display: block;

}
	
	#top_qa h2 img{
	height:40px;
}
	
		#top_qa dl dt img{
	height:20px;
}

#top_qa dl{
width:100%;
padding:20px 0;
border-left:none;
border-top:solid 1px #d3bca0;
}

#top_qa dl:last-child{
border-right:none;
border-bottom:solid 1px #d3bca0;
}

#top_qa dd{
	margin: 20px 0 0 0;
	text-align: left;

}

#top_qa dd ul li{
	list-style: none;
margin: 0 0 10px 0;
font-size:16px;
padding:10px 10px 10px 40px;
background: url(https://www.hakusanhifuka.com/img/top_qa_icn.png) no-repeat left center;
}
#top_qa dd ul li a
{
	
color:#492b20
}

/*----------- SP 下層ページ ----------- */

	.page_header{
	padding:3em 0;
	background: #fff5df;
}

.page_header h2{
	text-align: center;
	font-size:2.4rem;
	color:#a87941;
	letter-spacing:0.5em;
	font-weight: normal;
}
 
#page_common{
	 width:95%;
	 margin:1rem auto;
	font-size: 1.6rem;
	color: #492c20;
 }

#page_common p{
	font-size: 16px;
	color:#492c20;
 }

#page_common h3{
	font-size:2rem;
	text-align: center;
	color:#ed771d;
	letter-spacing: 0.25em;
	margin-bottom: 60px;
}
 
.common_page_wrap{
	margin:1em auto 0px;
	font-size:16px;
	display: block;
	justify-content: space-between;
}


.common_page_wrap p{

	font-size:16px;
color:#492c20;
}

#page_common h4{
	font-size:2rem;
	text-align: left;
	color:#a87941;
	letter-spacing: 0.15em;
	border-bottom:dotted 1px #a87941;
	padding:0.25em 0 0.25em 1em;
	position:relative;
	margin-bottom: 0.5em;
}

#page_common h4:before{
	content: "■";
	position:absolute;
	color: #ed771d; 
	left:0px;
	top:30%;
	font-size:16px;
}

#page_common h5{

	font-size:20px;
	color:#ed771d; 
	font-weight: bold;
	letter-spacing: 0.25em;
	padding:0.25em 0 0.25em;
	margin: 0 auto;

}

#page_common h6{
	font-size:18px;
	text-align: left;
	font-weight: bold;
	letter-spacing: 0.25em;
	padding:0;
}

.wrap_68per{
	width:100%;
}


.wrap_58per{
	width:100%;
}

.wrap_48per{
	width:100%;
}

.wrap_38per{
	width:100%;
}

.wrap_28per{
	width:100%;
}
 
 
.wrap_58per img,
.wrap_48per img,
.wrap_38per img,
.wrap_28per img{
	width:100%;
}

.box01{
	background: #fbf8f5;
	padding:1em;
	margin-bottom: 2em;
}

.box01 dt{
	font-size:18px;
	font-weight: bold;
	padding:0 0 0.5em 0;
	margin-bottom: 0.5em;
	border-bottom:dotted 1px #a87941;
}

.box01 dd{
padding:0;
margin:0;
line-height: 1.6;
}

.box02{
	border:5px solid #fbf8f5;
	padding:1em;
	margin-top: 2em;
	margin-bottom: 2em;
}

.box02 dt{
	position: relative;
	display: block;
	font-size:18px;
	font-weight: bold;
	padding:0.25em 0 1em 2.5em;
	
	margin-bottom: 0.5em;
	border-bottom:dotted 1px #a87941;
	vertical-align: middle;
}

.box02 dt:after{
	display: block;
	width:30px;
	height:30px;
	position:absolute;
	content:"Q";
	background: #ed751e;
	color:#fff;
	border-radius: 30px;
	top:0;
	right:0;
	bottom:0;
	left:0;
	text-align: center;
	vertical-align: middle;
	line-height: 30px;
	
	
}

.box02 dd{
	position: relative;
	display: block;
	font-size:16px;
	line-height: 1.6;
	padding:0 0 0 2.5em;
	
	margin:0;
	vertical-align: middle;
}

.box02 dd:after{
	display: block;
	width:30px;
	height:30px;
	position:absolute;
	content:"A";
	background: #f6ab00;
	color:#fff;
	border-radius: 30px;
	top:0;
	right:0;
	bottom:0;
	left:0;
	text-align: center;
	vertical-align: middle;
	line-height: 30px;
	font-weight: bold;
	font-size:18px;
}

.box02 ul{
	margin-top: 1em;
}

.box02 li{
	list-style: outside;
	margin-left: 1.5em;
	line-height: 1.6;
	margin-bottom: 0.5em;
}

.box03{
	border:5px solid #ffe3a4;
	padding:1em;
	margin-top: 2em;
	margin-bottom: 2em;
}

.box03 dt{
	position: relative;
	display: block;
	font-size:18px;
	font-weight: bold;
	padding:0.25em 0 1em;
	
	vertical-align: middle;
}



.box03 dd{
	position: relative;
	display: block;
	font-size:16px;
	line-height: 1.6;
	padding:0 0 0 0;
	
	margin:0;
	vertical-align: middle;
}




.page_info_btn a{
	display: block;
	width:50%;
	padding:15px;
	border:solid 2px #ed751f;
	border-radius: 30px;
	color:#ed751f;
	margin:1.5em auto;
	font-size:16px;
	text-align: center;
}
 
 #bread{
	 font-size:12px;
	 padding:20px 0;
	 line-height:1em;
 }
 
 #bread a{
	 color:#e31414;
	 text-decoration:underline;
 }
 
  #bread a:hover{
	text-decoration:none;
 }








 




#q01,#q02,#q03,#q04,#q05,#q06,#q07,#q08#q09{
	
}
	.page_info_box{
	width:95%;
  display:block;
	margin:0 auto 40px;
  position: relative;
  font-size: 16px;
	
}
	
	.page_info_box li a{
		display: block;
		width:90%;
		text-align: center;
		margin:0 auto 0.5em auto;
	
	}

.sp_none{
	display: none;
}
	
.pc_none{
	display: block;
}
	
	

.biyou_table2{
	background: #fbf8f5;
	border-top:solid 1px #d3bb9f;
border-left:solid 1px #d3bb9f;
	border-right:solid 1px #d3bb9f;
	border-bottom:solid 1px #d3bb9f;
	color:#4a2c21;
}


.biyou_table2 th{
	display: block;
	font-size:18px;
	padding:0;
	border-bottom:dotted 1px #d3bb9f;
	border-right:none;
	text-align: center;
	width:100%;
}
	
.biyou_table2 th img{
	width:100%;
}	
	
	.biyou_table2 td{
	display: block;
width:90%;
padding:5%;
border-right:solid 1px #d3bb9f;
}

.biyou_table2 tr:last-child{
	font-size:18px;
	padding:15px 0;
	border-bottom:none;
	border-right:none;
	text-align: center;
}


.biyou_table2 td:last-child{
display: block;
width:90%;
	padding:5%;
	
}
	
	.ninniku_box{
	width: 100%;
	margin:0 auto 2em;
	display: block;
	justify-content:space-around;
}
	
		.ninniku_box img{
	width: 100%;

}


	.sp_none{
		display: none;
	}
	.pc_none{
		display: block;
	}
	.text-box{
	display: block;
	width:100%;
}

.text-box ul{
	order:1;
	width:100%;
}
 
.text-box-r{
	order:2;
	width:90%;
}
	.ifrm-container {
width:100vw;
height: 1400px;
overflow:auto;
-webkit-overflow-scrolling:touch;
}
.ifrm {
width:100%;
height:100%;
border:none;
}

}