/* Common
------------------------------------------------------------------- */
a {
  color:#0000FF;
  text-decoration: none;
  /* ***  for Mac IE hotspot *** */
  outline:underline 0 #0000FF;
}
a:hover {
  color:#c30e23;
  text-decoration: underline;
}
.bg-responsive {
  height: 0;
  background-size: contain;
}

/* ------------------------------------------------------------------- */
@media (max-width: 479px) {
  .container { padding:0; }
}

#Wrapper{
  text-align:center;
  margin:0 auto;
  background:#c7be8d;
  border-left:1px #999 solid;
  border-right:1px #999 solid;
  overflow:hidden;
}

/* Header
------------------------------------------------------------------- */

/*ヘッダー背景*/
#Header { position:relative; }
.H-index {
  background:url(/images/index/header_bg.jpg) top left no-repeat;
  height:0;
  padding-top:74.444%;
  background-size:cover;
}
.H-about {
  background:url(/images/about/header_bg.jpg) left top no-repeat;
  height:0;
  padding-top:65.666%;
  background-size:cover;
}
.H-sub {
  background:url(/images/common/header_bg.jpg) left top no-repeat;
  height:0;
  padding-top:46.555%;
  background-size:cover;
}

/*ヘッダーロゴ*/
#Logo {
  position:absolute;
  top:15px;
  left:0;
  width:234px;
  height:65px;
  z-index:1;
}
#Logo a {
  width:100%;
  background:url(/images/common/title.jpg) left top no-repeat;
  height:0;
  padding-top:27.777%;
  background-size:cover;
  display:block;
  text-indent:100%;
  white-space:nowrap;
  overflow:hidden;
  outline:none;
}
#Logo a:hover { background-position:left bottom; }
#Logo a.top:hover { background-position:left top; }
#Logo H1 { margin:0; }

@media (max-width: 767px) {
  #Logo { top:15px; left:0; width:180px; height:50px; }
}
@media (max-width: 479px) {
  #Logo { top:0; width:126px; height:35px; }
  .container { padding:0; }
}

/*ヘッダーアクセス*/
#AccessHonten {
  position:absolute;
  top:10px;
  right:120px;
  z-index:1;
  width: 240px;
}
#AccessGanda {
  position:absolute;
  top:70px;
  right:120px;
  z-index:1;
  width: 240px;
}
#Access_iizuka {
  position:absolute;
  top:65px;
  right:120px;
  width:240px;
  height:50px;
  background:url(/images/common/access_iizuka.png) left top no-repeat;
  z-index:1;
}
#Access_iizuka p{ text-indent:-9000em; }

@media (max-width: 767px) {
	#AccessHonten { top:10px; right:100px; width:192px; }
  #AccessGanda { top:55px; right:100px; width:192px; }
  .navbar-toggle {
    position: relative;
    float: right;
    margin-right: 15px;
    padding: 5px;
    margin-top: 8px;
    margin-bottom: 8px;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
  }
}
@media (max-width: 479px) {
	#AccessHonten { top:5px; right:60px; width:110px; }
  #AccessGanda { top:30px; right:60px; width:110px; }
}

/*Flash*/
#Flash {
  position:absolute;
  top:231px;
  left:0;
  width:900px;
  height:400px;
  z-index:0;
}
#Flash-slide {
  position:absolute;
  top:35%;
  left:0;
  z-index:0;
  -webkit-transform: translate3d(0,0,0);
}

/* Navi
------------------------------------------------------------------- */
#Navi {
  top:60px;
  left:0;
  display:block;
  height:167px;
  position:absolute;
  text-align:left;
}
@media (min-width: 768px) {
  #Navi li { position:absolute; }
  #Navi .Navi01 a {
    position:absolute;
    top:35px;
    left:109px;
    text-indent:-9000em;
    width:130px;
    height:100px;
    margin:0;
    padding:0;
    display:block;
  }
  .H-index #Navi .Navi01 a {
    background:url(/images/index/navi_menu.jpg) left top no-repeat;
  }
  .H-about #Navi .Navi01 a {
    background:url(/images/about/navi_menu.gif) left top no-repeat;
  }
  .H-sub #Navi .Navi01 a {
    background:url(/images/common/navi_menu.jpg) left top no-repeat;
  }
  .H-index #Navi .Navi01 a:hover,
  .H-about #Navi .Navi01 a:hover,
  .H-sub #Navi .Navi01 a:hover {
    background-position:left bottom;
  }
  #Navi .Navi02 a {
    position:absolute;
    top:78px;
    left:284px;
    text-indent:-9000em;
    width:120px;
    height:90px;
    margin:0;
    padding:0;
    display:block;
  }
  .H-index #Navi .Navi02 a {
    background:url(/images/index/navi_about.jpg) left top no-repeat;
  }
  .H-about #Navi .Navi02 a {
    background:url(/images/about/navi_about.webp) left top no-repeat;
  }
  .H-sub #Navi .Navi02 a {
    background:url(/images/common/navi_about.jpg) left top no-repeat;
  }
  .H-index #Navi .Navi02 a:hover,
  .H-about #Navi .Navi02 a:hover,
  .H-sub #Navi .Navi02 a:hover {
    background-position:left bottom;
  }
  #Navi .Navi03 a {
    position:absolute;
    top:0;
    left:430px;
    text-indent:-9000em;
    width:90px;
    height:92px;
    margin:0;
    padding:0;
    display:block;
  }
  .H-index #Navi .Navi03 a,
  .H-about #Navi .Navi03 a,
  .H-sub #Navi .Navi03 a {
    background:url(/images/common/navi_contact.gif) left top no-repeat;
  }
  .H-index #Navi .Navi03 a:hover,
  .H-about #Navi .Navi03 a:hover,
  .H-sub #Navi .Navi03 a:hover {
    background-position:left bottom;
  }
  #Navi .Navi04 a {
    position:absolute;
    top:78px;
    left:514px;
    text-indent:-9000em;
    width:100px;
    height:75px;
    margin:0;
    padding:0;
    display:block;
  }
  .H-index #Navi .Navi04 a {
    background:url(/images/index/navi_blog.gif) left top no-repeat;
  }
  .H-about #Navi .Navi04 a {
    background:url(/images/about/navi_blog.gif) left top no-repeat;
  }
  .H-sub #Navi .Navi04 a {
    background:url(/images/common/navi_blog.jpg) left top no-repeat;
  }
  .H-index #Navi .Navi04 a:hover,
  .H-about #Navi .Navi04 a:hover,
  .H-sub #Navi .Navi04 a:hover {
    background-position:left bottom;
  }
}
@media (max-width: 767px) {
	.navbar-toggle {
    margin-top: 20px;
    background-color: #564139;
    color: #fff;
    border: 1px solid #fff;
    cursor: pointer;
  }  
  .toggle-label {
    font-size: 1.1em;
  }  
  .navbar-toggle .icon-bar {
    background-color: #fff;
  }  
  .navbar-collapse.in {
    position: relative;
    z-index: 10000;
  }  
  .navbar-nav {
    margin-top: 20px;
    width: 170px;
    background-color: #564139;
  }
  .navbar-nav li {
    border-bottom: 1px solid #fff;
    text-align: center;
  }  
  .navbar-nav li a {
    color: #fff;
  }
}
@media (max-width: 479px) {
	.navbar-toggle {
    margin-top: -8px;
    border: 1px solid #fff;
  }
  .navbar-nav {
    margin-top: -8px;
  }
}

/* 【Index】
------------------------------------------------------------------- */

/*ベース*/
#C-index {
  background:url(/images/index/content_bg.jpg) left bottom no-repeat;
}
#C-index-image {
  background:url(/images/index/content_bg2.gif) left top no-repeat;
  padding-top: 30px;
}

/*FB Message*/
#FB-MSG {
  font-size: 0;
  line-height: 0;
  margin-top: 0.8em;
  background-image:url(/images/index/facebook_bg.gif);
  height:0px;
  padding-top:13.720%;
  background-size:cover;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}

#Whatsnew2 {
  width:325px;
  height:345px;
  background:url(/images/index/cont01_bg.jpg) left bottom no-repeat;
}
#Whatsnew2 p {
  width:325px;
  height:54px;
  background:url(/images/index/cont01_tit-.gif) left top no-repeat; 
  display:block;
  text-indent:-9000em;
}
#Whatsnew2 #feed {
  width: 75%;
  margin: 20px auto;
}
#Whatsnew2 #feed dt {
  line-height: 1.8;
}
#Whatsnew2 #feed dd {
  margin-bottom: 5px;
}
#Whatsnew2 a {
  font-size: 15px;
  color:#394E36;
  text-decoration:none;
}
#Whatsnew2 a:hover {
  color:#c30e23;
  text-decoration: underline;
}
@media (max-width: 767px) {  
  #Whatsnew2 { margin: auto; }
}

/*こなやきっのこだわり*/
#Kodawari {
  width:325px;
  height:399px;
  background:url(/images/index/cont02_b.webp) left bottom no-repeat;
  position:relative;
}
#Kodawari p.tit {
  width:325px;
  height:127px;
  background:url(/images/index/cont02_tit.jpg) left top no-repeat;
  display:block;
  text-indent:-9000em;
}
#Kodawari p.a {
  display:block;
  position:absolute;
  top:240px;
  left:160px;
  width:150px;
  height:35px;
  text-align:center;
  color:#F2D132;
}
#Kodawari p.b {
  display:block;
  position:absolute;
  top:290px;
  left:55px;
  width:245px;
  height:90px;
  text-align:left;
  color:#FFF;
}
@media (max-width: 767px) {   
  #Kodawari{ margin: auto; }
}

/*おすすめメニュー*/
#Osusume {
  position:relative;
}
#Osusume a.a, #Osusume a.b, #Osusume a.c {
  width:100%;
  height: 0;
  text-indent: 100%;
  white-space: nowrap;
  display:block;
}
#Osusume a.a {
  background:url(/images/index/cont03_a.jpg) left top no-repeat;
  background-size: cover;
  padding-top:32.374%;
}
#Osusume a.b {
  background:url(/images/index/cont03_b.jpg) left top no-repeat;
  background-size: cover;
  padding-top:27.826%;
}
#Osusume a.c {
  background:url(/images/index/cont03_c.jpg) left top no-repeat;
  background-size: cover;
  padding-top:30.260%;
}
#Osusume a.a:hover,
#Osusume a.b:hover,
#Osusume a.c:hover {
  background-position:left bottom;
}
#Osusume p {
  display:block;
  text-align:left;
  color:#DFE773;
}
#Osusume p.tit {
  background:url(/images/index/cont03_tit.gif) left top no-repeat;
  padding-top:9.391%;
  height: 0;
  text-indent: 100%;
  white-space: nowrap;
  background-size: cover;
  display:block;
}
#Osusume p.a { position:absolute; top:138px; left:240px; padding-right: 70px; }
#Osusume p.b { position:absolute; top:298px; left:58px; padding-right: 265px; }
#Osusume p.c { position:absolute; top:460px; left:230px; padding-right: 70px; }

@media (max-width: 767px) {
  #Osusume { margin: auto; }
}
@media (max-width: 479px) {
  #Osusume p.a {top:23%; left:42%; font-size:10px; padding-right: 30px; }
  #Osusume p.b {top:53%; left:9%; font-size:9px; padding-right: 170px; }
  #Osusume p.c {top:82%; left:42%; font-size:9px; padding-right: 30px; }
}

/*当店オリジナル*/
#Original {
  position:relative;
}
#Original a {
  background:url(/images/index/cont04_bg.jpg) left top no-repeat;
  height: 0;
  text-indent: 100%;
  white-space: nowrap;
  padding-top:29.565%;
  background-size: cover;
  display:block;
}
#Original a:hover { background-position:left bottom; }
#Original p {
  display:block;
  position:absolute;
  top:100px;
  left:35px;
  padding-right: 170px;
  text-align:center;
  color:#394E36;
}
@media (max-width: 767px) {   
  #Original { margin: auto; }
}
@media (max-width: 479px) {
  #Original p {
    top:58px;
    left:20px;
    font-size:10px;
    text-align:left;
    padding-right: 207px;
  }
}

/* Footer
------------------------------------------------------------------- */

/*フッター背景*/
#Footer {
  text-align:center;
  color:#000;
  margin:0;
}
.F-index {
  background:url(/images/index/footer_bg.jpg) left top no-repeat;
  padding-top:30px;
}
.F-sub {
  background:url(/images/common/footer_bg.jpg) left bottom no-repeat;
  height:130px;
  padding-top:15px;
}

/*フッターNavi*/
#F-Navi {
  display:block;
  margin:auto;
  text-align:center;
  overflow:hidden;
}
#F-Navi li {
  display:inline;
  text-align:left;
  margin:0;
  padding:0 20px 0 25px;
  border-left:1px solid #333;
}
#F-Navi li:first-child { border:none; }
#F-Navi li a { color:#333; text-decoration:none; }
#F-Navi li a:hover { color:#c30e23; text-decoration:underline; }

@media (max-width: 479px) {
  #F-Navi {
    padding:0;
  }
	#F-Navi li {
    padding:0 10px 0 12px;
    font-size:0.923rem;
  }
}

/*フッターロゴ*/
#Footer img { margin:10px 0; }

/*フッターアクセス*/
#F-Add {
  background:url(/images/common/footer_add.gif) left top no-repeat;
  height:20px;
  text-align:left;
  color:#333;
  position:relative;
  font-size:93%;
}
#F-Add p.a {
  display:block;
  position:absolute;
  top:0;
  left:260px;
  width:280px;
  height:20px;
  text-align:left;
}
#F-Add p.b {
  display:block;
  position:absolute;
  top:0;
  left:558px;
  width:90px;
  height:20px;
  text-align:left;
}
@media (max-width: 479px) {
  #F-Add {
    background:none;
    height:auto;
  }
  #F-Add p.a {
    display:block;
    position:relative;
    left:0;
    width:auto;
    height:auto;
    float:left;
    margin-left:20px;
  }
  #F-Add p.b {
    display:block;
    position:relative;
    left:0;
    width:auto;
    height:auto;
    float:left;
    margin-left:10px;
  }
}