@charset "utf-8";

/*=================================================================================================================================*/
/** 個別指定 for スマートフォン
/*=================================================================================================================================*/

/*---------------------------------------------
 ** 740px
---------------------------------------------*/
@media screen and (max-width: 770px) {

/*---------------------------------------------
	body
---------------------------------------------*/
html { scroll-behavior: smooth; }
body { font-size: 15px; line-height: 1.8;
}
p    {font-size: 15px;}

.only_pc_none {display:block!important; }
.only_sp_none {display:none!important; }
.sp_br{display: inline;}

/*画像*/
img{max-width:100%; height:auto;}

/*---------------------------------------------
 ** ヘッダー記述
---------------------------------------------*/

header{
  width:100%;
  min-height:600px;
  background-size:auto 100%;
}
#sake header{
  background:url(../img/main/main_sake.jpg) no-repeat top right -100px;
  background-size:auto 100%;
}
#hometown header{
  background:url(../img/main/main_hometown.jpg) no-repeat top left;
  background-size:auto 100%;
}
.header_in h1 a{
  width:150px;
  height:150px;
  top:15px;
}
.header_in h2{
  font-size:3.0rem;
  height:400px;
  top:120px;
  right:5px;
}
#hometown .header_in h2{
  font-size:2.6rem;
}

/*---------------------------------------------
 ** 共通 コンテンツ
---------------------------------------------*/

#content h2{
  font-size:2.8rem;
  line-height: 2.0;
  margin-top:20px;
}
#info #content h2{
  font-size:2.4rem;
  letter-spacing: 0em;
}

.read{
  width:90%;
  max-width:520px;
  margin:3% auto 8%;
}

#index .read{
  margin:5% auto 10%;
}

.read p {
	padding: 3% 8%;
	position: relative;
  line-height: 2.2;
  font-size:1.4rem;
}

#content h3{
  font-size:2.4rem;
}

#sake #content h3{
  font-size:2.0rem;
}


/*---------------------------------------------
 ** 共通カラム
---------------------------------------------*/
.column_2 > dl{
  width:100%;
  margin-bottom:10%;
}
.column_2 > dl dt{
  width:90%;
  margin:0 auto 2%;
}
.column_2 > dl dd{
  margin-bottom:2%;
}

.column_2 > li{
  width:100%;
  margin-bottom:10%;
}

.column_2 > div{
  width:100%;
  margin-bottom:10%;
}


#index .column_2 > dl dt{
  margin-bottom:30px;
}

#index .column_2 > dl:nth-child(1) dt::after,
#index .column_2 > dl:nth-child(2) dt::after{
  width:60%;
}

.res_col{
}
.res_col div{
  width:90%!important;
  margin:0 auto 10%;
}

#restaurant .res_col div:nth-child(1)::after,
#restaurant .column_2 > dl:nth-child(1) dt::after,
#restaurant .column_2 > dl:nth-child(2) dt::after,
#restaurant .column_2 > dl:nth-child(3) dt::after{
  width:60%;
}
#restaurant .column_2 dd{
  width:90%!important;
  margin:0 auto;
}

#menu .column_2 > dl dt{
  width:100%;
}

.sake_list div dl{
  font-size:100%;
}
.sake_list div dl dt{
  width:64%;
  padding:5px 3%;
}
.sake_list div dl dd{
  width:24%;
  padding:5px 3%;
}
.sake_list div ul{
  font-size:100%;
}
.sake_list div ul li{
  margin-right:15px;
}

.info_col{
  margin: 5% auto;
  display: block;
}
.info_col > div:nth-child(1){
  width:100%;
}
.info_col > div:nth-child(2){
  width:80%;
  margin:5px auto 20px;
}
.info_col .info_data{
  margin-left:0;
  margin-bottom:20px;
  border-left:none;
  padding:3% 0;
  font-size: 100%;
}
.info_col .info_data dl{
  display: block;
  text-align: center;
  margin-bottom:30px;
}

.info_col .info_data dl dt{
  background:#333;
  color:#fff;
  padding:2px 0;
  width:100px;
  margin-bottom:10px;
  margin-right:0;
  font-size:14px;
}
.info_col .info_data dl dd{
  font-size:120%;
  line-height: 1.6;
}
.info_col .phone{
  text-align: center;
}
.info_col .phone span{
  background:#333;
  color:#fff;
  padding:2px 0;
  width:150px;
  margin: 0 auto 5px;
  font-size:14px;
  line-height: 2.2;
}
.info_col .manager{
  margin-bottom:0;
}
.info_col .manager{
  font-size:100%;
  text-align: center;
}
.info_col .manager span{
  font-size:110%;
  display: block;
}

/*---------------------------------------------
 ** 共通ボックス
---------------------------------------------*/
.w_box{
  margin:-10px auto 20%;
}
.w_box p{
  padding:30px 30px;
}


.room-ttl{
position:absolute;
width:130px;
top:3%;
left:2%;
text-align:left !important;
z-index:100;
}

.room-ttl img{
width:130px !important;
height:auto !important;
}



.photo01-img{
position:absolute;
left:2%;
bottom:2%;
z-index:30;
}

.photo02-img{
position:absolute;
right:2%;
bottom:2%;
z-index:30;
}


.photo01-img img,
.photo02-img img{
width:130px !important;
height:auto !important;
}


/*---------------------------------------------
 ** 共通パララックス
---------------------------------------------*/

#index #content:before{
content:"";
display:block;
position:fixed;
top:0;
left:0;
z-index:-1;
width:100%;
height:100vh;
background:url(../img/top/top_bg.jpg) no-repeat top 100px center;
background-size:220% auto;
}
#info #content:before{
content:"";
display:block;
position:fixed;
top:0;
left:0;
z-index:-1;
width:100%;
height:100vh;
background:url(../img/info/info_bg.jpg) no-repeat top 100px center;
background-size:220% auto;
}

#index .pallax, #info .pallax{
  height:200px;
}
#index .pallax_w2, #info .pallax_w2{
  padding-bottom:3%;
}
/*---------------------------------------------
 ** 共通バナー
---------------------------------------------*/
.ban ul li{
  width:100%;
  margin:0 auto 3px;
}
.ban ul li:last-child{
  width:100%;
  margin:0 auto 3px;
}
.ban ul li a{
  display: block;
  width:100%;
  height:100px;
  text-align: center;
  padding-top:70px;
  font-size:150%;
  color: #fff;
  letter-spacing: 0.5em;
}

/*---------------------------------------------
 ** 共通フッター
---------------------------------------------*/

.footer_in{
  padding:10% 0 110px;
}
.footer_in > div{
  width:100%;
  margin-bottom:20px;
}
.footer_in .add span{
  display:block;
  margin-right:0;
}

.footer_in > div:nth-child(2){

  margin:0 auto;
}
.sp_tel{
  display: block;
  width:100%;
  background:rgba(0, 0, 0, 0.9);
  text-align: center;
  position: fixed;
  bottom:0;
  display: flex;
  justify-content: space-between;
}
.sp_tel p.phone{
  width:63%;
  margin-bottom:0;
}
.sp_tel p.phone a{
  color:#fff;
  display: block;
  padding:15px 0 20px;
  line-height: 1.4;
}
.sp_tel p.phone span{
  display: block;
  font-size:11px;
}
.sp_tel p.map{
  width:30%;
  margin-right:5%;
}
.sp_tel p.map a{
  padding:5px 10px;
  color:#fff;
  margin-top:20px;
  display: block;
  background:rgba(145, 13, 0, 0.9);
  border:1px solid #fff;
  font-size:18px;
  text-align:center;
}

/*---------------------------------------------
 **  ページトップ
---------------------------------------------*/

#pageTop {
  position: fixed;
  bottom: 87px;
  right: 0px;
  z-index: 999;
}
#pageTop a {
  width: 50px;
  height: 50px;
  opacity: 0.9;
}
#pageTop a:hover {
  opacity: 0.9;
}

}

/*---------------------------------------------
 ** 360px
---------------------------------------------*/
@media screen and (max-width: 360px) {

  .sp_tel .phone{
    font-size:140%;
  }
  .sp_tel p.map a{
    padding:5px 10px;
    font-size:14px;
  }
}




/* スマホのときのみ電話をかける */
@media (min-width: 770px) {
a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}