@charset "UTF-8";

/* CSS Document */
@media all and (min-width: 481px) and (max-width: 768px) {
}

@media all and (max-width: 768px) {
.float > .leftBox{float:none!important;width:100% !important;}
.float > .rightBox{float:none!important;width:100% !important;}
.float > [class^="mR"],.float > [class*=" mR"]{margin-right:0!important;}
.float > [class^="mL"],.float > [class*=" mL"]{margin-left:0!important;}
.float_r > [class^="mB"],.float_r > [class*=" mB"]{margin-bottom:0!important;}
}
@media all and (min-width: 769px) {
.float_r > .leftBox{float:none!important;width:100% !important;}
.float_r > .rightBox{float:none!important;width:100% !important;}
.float_r > [class^="mR"],.float_r > [class*=" mR"]{margin-right:0!important;}
.float_r > [class^="mL"],.float_r > [class*=" mL"]{margin-left:0!important;}
.float > [class^="mB"],.float > [class*=" mB"]{margin-bottom:0!important;}
}


@media all and (max-width: 480px) {
}

/*===============================================
CONTAINER
===============================================*/
@media all and (max-width: 768px) {
#CONTAINER {
  min-width: inherit;
  padding:80px 0 0 0;
}
}

/*===============================================
HEADER
===============================================*/
@media all and (max-width: 768px) {
#HEADER {
  position:fixed;
  top:0;
  left:0;
  width: 100%;
  padding: 10px;
  background:#000;
  box-sizing:border-box;
  
}
h1 {
  display: none;
}
.logo {
  height: 30px;
}

.header_menu {
  display: none;
}
}

/*===============================================
GNAVI
===============================================*/
@media all and (max-width: 768px) {
  #GNAVI {position:fixed;
  top:54px;
  left:0;
  width: 100%;
  background:#000;
 }
     #GNAVI ul li {
  float: left;
  width:33.3333%;
  border-right:1px solid #333;
    font-family: 'Lustria', serif;
    box-sizing:border-box;
}
     #GNAVI ul li a {display:block;text-decoration:none;text-align:center;font-size:16px;line-height:26px;}
#GNAVI ul li:last-child {border:none;}


}

/*===============================================
KEYVISUAL
===============================================*/
@media all and (max-width: 768px) {
#KEYVISUAL {
}
#KEYVISUAL img {width:100%;}
.key_left {
  display: none;
}
.key_left_content {
  display: none;
}
.key_right {
  display: none;
}
}

/*===============================================
MAIN
===============================================*/
@media all and (max-width:768px) {
#MAIN {
  margin: 20px 0 30px 0;
}
p.ttl01 {
  font-size: 24px;
}
p.ttl02 {
  margin: 0 0 5px 0;
}
.box01 p.txt01 {
  margin: 0 0 5px 0;
}
.box01 {
  float: none;
  width: auto;
  height: 132px;
  padding: 10px 0 0 0;
}
.box02 {
  float: none;
  width: auto;
  padding: 30px 10px;
}
.box02.reservation {
  border: none;
}
.news_list li span {
  display: block;
}
.tel_txt {
  font-size: 34px;
  font-family: 'Lustria', serif;
}
.location {
  padding: 30px 10px;
  background: url(../img/bg03_sp.png) no-repeat center;
  background-size: cover;
}
.location_wrap {
  width: auto;
  margin: 0 auto;
}
.location_txt {
  font-size: 12px;
  line-height: 20px;
}
.recommend {
  width: auto;
  margin: 0 auto;
  padding: 30px 0;
}
.recommend_list {
  padding: 20px 0;
}
.recommend_list li {
  float: none;
  width: auto;
  margin: 0 0 10px 0;
}
.recommend_left img {
  width: 100%;
}
.recommend_right {
  float: left;
  padding: 0 0 0 10px;
}
.recommend_txt01 {
  font-size: 14px;
}
.recommend_txt02 {
  font-size: 13px;
}
.value_wrap {
  padding: 30px 10px;
}
.value_txt {
  width: auto;
  margin: 0 auto;
  font-size: 12px;
  line-height: 20px;
}
.facebook {
  width: auto;
}
.inner {
  width:100%;
  margin: 0 auto;
}
.map{
  width:auto;
  height:245px;
}
.layout{
  text-align:left;
}
.com_ttl{
  font-size:19px;
  margin-bottom:5px;
}
.img_width img{
max-width:100%;
height: auto;
width /****/:auto;
}
.site_menu{
   width : -webkit-calc(100% - 20px) ;
   width : calc(100% - 20px) ;
}
.site_menu li{
  width:100%;
  margin:10px auto;
}
 .pager .prev{
   margin-right:10px;
 }
 .pager .next{
   margin-left:10px; 
  }
.street_view{
  height:300px
}
.news_top li:nth-child(2n){
  float:left;
}
.news_top li{
  width:100%;
}
.news_ttl{
  text-align:left;
}
}
/*===============================================
FOOTER
===============================================*/
@media all and (max-width: 768px) {
#FOOTER_WRAP {
  width: auto;
  padding: 20px 10px 30px;
}
.footer_left {
  float: none;
  font-size: 12px;
}
.footer_right {
  display: none;
}
}

/*===============================================
sp , pc
===============================================*/
@media all and (max-width: 768px) {
.pc {
  display: none !important;
}
.sp {
  display: inherit !important;
}
}

/*===============================================
common
===============================================*/
@media all and (max-width: 768px) {
.column2 > div, .column2_28 > div, .column2_82 >div, .column2_37 > div, .column2_73 > div, .column2_46 > div, .column2_64 > div, .column3 > div {
  float: none;
  width: auto !important;
  margin: 15px 0 0 0;
}
.column4 > div > div {
  width: 48% !important;
}
.column4 > div {
  clear: both;
}
.column6 > div > div {
  width: 31.33% !important;
}
.column6 > div {
  clear: both;
}
}

@media all and (max-width: 480px) {
.column3 > div, .column2_28 > div, .column2_82 > div {
  float: none;
  width: auto !important;
  margin: 15px 0 0 0;
}
}