@charset 'UTF-8';
/* #MqMark
----------------------------------------------------------*/
#MqMark {
  display: none;
}

@media only screen and (min-width: 768px) {
  #MqMark {
    font-family: 'pc';
  }
}

@media only screen and (max-width: 767px) {
  #MqMark {
    font-family: 'sp';
  }
}

@media only screen and (max-width: 374px) {
  #MqMark {
    font-family: 'xs';
  }
}

.preloadImg {
  display: none;
}

/* None
----------------------------------------------------------*/
.pcNone {
  display: none;
}

.pcNone-i {
  display: none;
}

@media only screen and (max-width: 767px) {
  .pcNone {
    display: block;
  }
  .pcNone-i {
    display: inline-block;
  }
  .spNone {
    display: none;
  }
  .spNone-i {
    display: none;
  }
}

/* layout
----------------------------------------------------------*/
html.loading,
html.firstdelay {
  overflow: hidden;
  height: 100%;
}

/*html.loaded {
  overflow:auto;
  height: auto;
}*/
body {
  min-width: 940px;
  background: #ffffff;
  color: #000000;
}

body.pageBlack {
  background: #000000;
  color: #ffffff;
}

#Wrapper {
  width: 100%;
}

img {
  max-width: 100%;
  height: auto;
}

.inner,
.inner860,
.inner800,
.inner640 {
  position: relative;
  margin: 0 auto;
}

.inner {
  width: 940px;
}

.inner860 {
  width: 860px;
}

.inner800 {
  width: 800px;
}

.inner640 {
  width: 640px;
}

@media only screen and (max-width: 767px) {
  body {
    min-width: 320px;
    font-size: 12px;
  }
  #Wrapper {
    min-width: inherit;
  }
  .inner,
  .inner860,
  .inner800,
  .inner640 {
    margin: 0 auto;
    padding: 0 15px;
    width: auto;
  }
}

/*============================
#Overlay
============================*/
#Overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1200;
  display: none;
  width: 100%;
  height: 100%;
  background: url(../images/pause_txt.png) no-repeat center center rgba(0, 0, 0, .75);
}

@media only screen and (min-width: 768px) {
  -webkit-background-size: 60px 60px;
          background-size: 60px;
}

/*============================
#OpeningWrap
============================*/
#OpeningWrap {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1100;
  display: none;
  width: 100%;
  height: 100%;
  background: #24234b;
  color: #ffffff;
}
#OpeningWrap:before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 50%;
  background: #000000;
  background: #090514;
  /* Old browsers */
  background:    -moz-linear-gradient(top, #090514 0%, #24234b 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #090514 0%, #24234b 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: -webkit-gradient(linear, left top, left bottom, from(#090514), to(#24234b));
  background:         linear-gradient(to bottom, #090514 0%, #24234b 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  content: '';
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#090514', endColorstr='#24234b',GradientType=0 );
  /* IE6-9 */
}
#OpeningWrap .opwrapInner {
  margin: 0 auto;
}
#OpeningWrap .loadingBlock {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  text-align: center;
}
#OpeningWrap .loadingBlock .pList {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transition: -webkit-transform 1.5s ease;
          transition: -webkit-transform 1.5s ease;
          transition:         transform 1.5s ease;
          transition:         transform 1.5s ease, -webkit-transform 1.5s ease;
}
#OpeningWrap .loadingBlock .pList li {
  position: absolute;
  top: 0;
  left: 0;
  padding-bottom: 20px;
  background: url(../images/loading/loading_p_shadow.png) no-repeat center bottom;
  -webkit-transition: opacity 1s ease;
          transition: opacity 1s ease;
  -webkit-transition-delay: .4s;
          transition-delay: .4s;
}
#OpeningWrap .loadingBlock .pList li img {
  max-width: inherit;
  -webkit-transform-origin: 50% 100%;
          transform-origin: 50% 100%;
  -webkit-animation: persons1 1.2s infinite alternate ease-in-out both;
          animation: persons1 1.2s infinite alternate ease-in-out both;
}
#OpeningWrap .loadingBlock .pList li.p02 img {
  -webkit-animation-delay: -1s;
          animation-delay: -1s;
}
#OpeningWrap .loadingBlock .pList li.p03 img {
  -webkit-animation-delay: -1.5s;
          animation-delay: -1.5s;
}
#OpeningWrap .loadingBlock .pList li.p04 img {
  -webkit-animation-delay: -.5s;
          animation-delay: -.5s;
}
#OpeningWrap .loadingBlock .loadTxt {
  line-height: 1;
}
#OpeningWrap .loadingBlock .loadCountBox {
  margin-top: 3px;
  text-align: center;
  line-height: 1;
}
#OpeningWrap .loadingBlock .loadCountBox * {
  vertical-align: bottom;
}
#OpeningWrap .loadingBlock .loadCountBox .loadCount {
  display: inline-block;
}
#OpeningWrap .loadingBlock .loadCountBox .loadCount span {
  display: inline-block;
  overflow: hidden;
  margin-left: 1px;
  width: 15px;
  height: 30px;
  background: url(../images/loading/loading_num.png) no-repeat 0 0;
  -webkit-background-size: 100% auto;
          background-size: 100% auto;
  text-indent: -9999px;
}
#OpeningWrap .loadingBlock .loadCountBox .loadCount span.num0 {
  background-position: 0 0;
}
#OpeningWrap .loadingBlock .loadCountBox .loadCount span.num1 {
  background-position: 0 -30px;
}
#OpeningWrap .loadingBlock .loadCountBox .loadCount span.num2 {
  background-position: 0 -60px;
}
#OpeningWrap .loadingBlock .loadCountBox .loadCount span.num3 {
  background-position: 0 -90px;
}
#OpeningWrap .loadingBlock .loadCountBox .loadCount span.num4 {
  background-position: 0 -120px;
}
#OpeningWrap .loadingBlock .loadCountBox .loadCount span.num5 {
  background-position: 0 -150px;
}
#OpeningWrap .loadingBlock .loadCountBox .loadCount span.num6 {
  background-position: 0 -180px;
}
#OpeningWrap .loadingBlock .loadCountBox .loadCount span.num7 {
  background-position: 0 -210px;
}
#OpeningWrap .loadingBlock .loadCountBox .loadCount span.num8 {
  background-position: 0 -240px;
}
#OpeningWrap .loadingBlock .loadCountBox .loadCount span.num9 {
  background-position: 0 -270px;
}
#OpeningWrap .loadingBlock .loadCountBox .perTxt {
  display: inline-block;
}
#OpeningWrap .loadingBlock .loadCountBox .perTxt img {
  margin-bottom: 1px;
  width: 12px;
}
#OpeningWrap .loadingBlock.loaded1 .pList {
  -webkit-transform: translate(10%, -20%);
          transform: translate(10%, -20%);
}
#OpeningWrap .loadingBlock.loaded1 .pList .p01 {
  opacity: 0;
}
#OpeningWrap .loadingBlock.loaded2 .pList {
  -webkit-transform: translate(35%, -40%);
          transform: translate(35%, -40%);
}
#OpeningWrap .loadingBlock.loaded2 .pList .p01,
#OpeningWrap .loadingBlock.loaded2 .pList .p02 {
  opacity: 0;
}
#OpeningWrap .loadingBlock.loaded3 .pList {
  -webkit-transform: translate(55%, -60%);
          transform: translate(55%, -60%);
}
#OpeningWrap .loadingBlock.loaded3 .pList .p01,
#OpeningWrap .loadingBlock.loaded3 .pList .p02,
#OpeningWrap .loadingBlock.loaded3 .pList .p03 {
  opacity: 0;
}
#OpeningWrap .loadingBlock.loaded4 .pList {
  -webkit-transform: translate(75%, -80%);
          transform: translate(75%, -80%);
}
#OpeningWrap .loadingBlock.loaded4 .pList .p01,
#OpeningWrap .loadingBlock.loaded4 .pList .p02,
#OpeningWrap .loadingBlock.loaded4 .pList .p03,
#OpeningWrap .loadingBlock.loaded4 .pList .p04 {
  opacity: 0;
}
#OpeningWrap .descriptBlock {
  position: relative;
  display: none;
  padding: 10px 0;
  color: #ffffff;
  text-align: center;
}
#OpeningWrap .descriptBlock .blockTit {
  text-align: center;
}
#OpeningWrap .descriptBlock .soundList li {
  display: inline-block;
}

@-webkit-keyframes persons1 {
  0% {
    -webkit-transform: rotate(-8deg);
            transform: rotate(-8deg);
  }
  100% {
    -webkit-transform: rotate(8deg);
            transform: rotate(8deg);
  }
}

@keyframes persons1 {
  0% {
    -webkit-transform: rotate(-8deg);
            transform: rotate(-8deg);
  }
  100% {
    -webkit-transform: rotate(8deg);
            transform: rotate(8deg);
  }
}

@media only screen and (min-width: 768px) {
  #OpeningWrap .opwrapInner {
    width: 400px;
  }
  #OpeningWrap .loadingBlock {
    height: 420px;
  }
  #OpeningWrap .loadingBlock .bgImg {
    margin-top: -50px;
    margin-bottom: 50px;
    min-height: 340px;
  }
  #OpeningWrap .loadingBlock .pList {
    margin: -140px 0 0 -70px;
    width: 200px;
    height: 220px;
  }
  #OpeningWrap .loadingBlock .pList li {
    padding-bottom: 20px;
  }
  #OpeningWrap .loadingBlock .pList li.p01 {
    margin-top: 30px;
    margin-left: -30px;
  }
  #OpeningWrap .loadingBlock .pList li.p02 {
    margin-top: 80px;
    margin-left: -80px;
  }
  #OpeningWrap .loadingBlock .pList li.p03 {
    margin-top: 120px;
    margin-left: -120px;
  }
  #OpeningWrap .loadingBlock .pList li.p04 {
    margin-top: 160px;
    margin-left: -160px;
  }
  #OpeningWrap .descriptBlock .blockTit {
    margin-bottom: 20px;
  }
  #OpeningWrap .descriptBlock .leadTxt {
    margin-bottom: 30px;
  }
  #OpeningWrap .descriptBlock .soundList {
    margin-bottom: 20px;
  }
  #OpeningWrap .descriptBlock .soundList li {
    margin: 0 30px;
  }
}

@media only screen and (max-width: 767px) {
  #OpeningWrap .opwrapInner {
    width: 300px;
  }
  #OpeningWrap .loadingBlock {
    height: 320px;
  }
  #OpeningWrap .loadingBlock .bgImg {
    margin-top: -25px;
    margin-bottom: 40px;
    min-height: 204px;
  }
  #OpeningWrap .loadingBlock .bgImg img {
    width: 240px;
  }
  #OpeningWrap .loadingBlock .pList {
    margin: -90px 0 0 -60px;
    width: 140px;
    height: 140px;
  }
  #OpeningWrap .loadingBlock .pList li {
    padding-bottom: 10px;
  }
  #OpeningWrap .loadingBlock .pList li img {
    width: 80px;
  }
  #OpeningWrap .loadingBlock .pList li.p01 {
    margin-top: -10px;
    margin-left: -10px;
  }
  #OpeningWrap .loadingBlock .pList li.p02 {
    margin-top: 30px;
    margin-left: -40px;
  }
  #OpeningWrap .loadingBlock .pList li.p03 {
    margin-top: 60px;
    margin-left: -70px;
  }
  #OpeningWrap .loadingBlock .pList li.p04 {
    margin-top: 90px;
    margin-left: -100px;
  }
  #OpeningWrap .loadingBlock .loadTxt {
    text-align: center;
  }
  #OpeningWrap .loadingBlock .loadTxt img {
    width: 50px;
  }
  #OpeningWrap .descriptBlock .blockTit {
    margin-bottom: 10px;
  }
  #OpeningWrap .descriptBlock .blockTit img {
    margin: 0 auto;
    width: 235px;
  }
  #OpeningWrap .descriptBlock .leadTxt {
    margin-bottom: 30px;
  }
  #OpeningWrap .descriptBlock .soundList {
    margin-bottom: 20px;
  }
  #OpeningWrap .descriptBlock .soundList li {
    margin: 0 15px;
  }
  #OpeningWrap .descriptBlock .soundList li img {
    width: 30px;
  }
}

/*============================
#GHead
============================*/
#GHead {
  position: relative;
  z-index: 15;
  background: #ffffff;
  color: #000000;
  line-height: 1;
}
#GHead {
  font-family: YuGothic, '游ゴシック','ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', Osaka, sans-serif;
}
#GHead img {
  vertical-align: top;
}
#GHead .inner .logo {
  text-align: center;
}
#GHead .inner .navBlock .gNav li {
  font-weight: bold;
}
#GHead .inner .navBlock .gNav li a {
  text-decoration: none;
}
#GHead .inner .navBlock .gNav .innerNav {
  display: none;
}
#GHead .inner .navBlock .snsNav li {
  width: 32px;
  height: 32px;
}

@media only screen and (min-width: 768px) {
  #GHead {
    min-height: 80px;
    -webkit-box-shadow: 0 5px 5px rgba(0, 0, 0, .1);
            box-shadow: 0 5px 5px rgba(0, 0, 0, .1);
  }
  #GHead .inner .logo {
    padding: 11px 0 7px;
  }
  #GHead .inner .navBlock {
    text-align: center;
  }
  #GHead .inner .navBlock .gNav {
    position: absolute;
    top: 30px;
  }
  #GHead .inner .navBlock .gNav.gNav1 {
    right: 655px;
  }
  #GHead .inner .navBlock .gNav.gNav2 {
    left: 655px;
  }
  #GHead .inner .navBlock .gNav > li {
    float: left;
    margin-left: 30px;
    font-size: 1.4rem;
  }
  #GHead .inner .navBlock .gNav > li:first-child {
    margin-left: 0;
  }
  #GHead .inner .navBlock .gNav > li > a {
    display: block;
    padding: 3px 2px;
    border-bottom: 2px solid #000000;
  }
  #GHead .inner .navBlock .gNav > li > a:hover {
    border-bottom-color: #dc4646;
  }
  #BrandPage #GHead .inner .navBlock .gNav > li.gNavShoplist a,
  #SupportPage #GHead .inner .navBlock .gNav > li.gNavSupport a,
  #FactoryPage #GHead .inner .navBlock .gNav > li.gNavFactory a,
  #JobfindPage #GHead .inner .navBlock .gNav > li.gNavJobfind a,
  #ContactPage #GHead .inner .navBlock .gNav > li.gNavContact a {
    border-bottom-color: #dc4646;
  }
  #GHead .inner .navBlock .gNav .innerNav {
    display: none !important;
  }
  #GHead .inner .navBlock .otherNav {
    position: absolute;
    top: 80px;
    left: 50%;
    z-index: 0;
    overflow: hidden;
    margin-left: -1000px;
    width: 2000px;
    height: 0;
    background: #ffffff;
    text-align: center;
    -webkit-transition: all .3s;
            transition: all .3s;
  }
  #GHead .inner .navBlock .otherNav.active {
    z-index: 1;
    height: 56px;
    -webkit-transition: all .6s;
            transition: all .6s;
  }
  #GHead .inner .navBlock .otherNav.otherShoplist.active {
    height: 132px;
  }
  #GHead .inner .navBlock .otherNav .shopList {
    display: inline-block;
    padding: 10px 0 10px;
  }
  #GHead .inner .navBlock .otherNav .shopList > li {
    display: inline-block;
    width: 90px;
    vertical-align: top;
    font-weight: bold;
    font-size: 11px;
    line-height: 1.4;
  }
  #GHead .inner .navBlock .otherNav .shopList > li img {
    display: block;
    margin: 0 auto 5px;
    width: 70px;
    border: 1px solid #969696;
    border-radius: 70px;
  }
  #GHead .inner .navBlock .otherNav .shopList > li a {
    text-decoration: none;
  }
  #GHead .inner .navBlock .otherNav .shopList > li a:hover {
    opacity: .7;
  }
  #GHead .inner .navBlock .otherNav .shopList > li a:hover img {
    border-color: #dc4646;
  }
  #GHead .inner .navBlock .otherNav .shopList > li sup {
    display: inline-block;
    margin-top: -3px;
    font-size: 10px;
  }
  #GHead .inner .navBlock .otherNav .subNavList {
    padding: 10px 0 10px;
  }
  #GHead .inner .navBlock .otherNav .subNavList li {
    display: inline-block;
    margin: 0 3px;
    width: 150px;
    border: 1px solid #969696;
    border-radius: 20px;
    font-weight: bold;
  }
  #GHead .inner .navBlock .otherNav .subNavList li a {
    display: block;
    padding: 7px 7px 7px 25px;
    background: url(../images/icon_gnav_arrow.jpg) no-repeat 5px center/20px 20px;
    text-decoration: none;
  }
  #GHead .inner .navBlock .otherNav .subNavList li a:hover {
    background-image: url(../images/icon_gnav_arrow_on.jpg);
  }
  .pagePhilosophy #GHead .inner .navBlock .otherNav .subNavList li.navPhilosophy a,
  .pageHistory #GHead .inner .navBlock .otherNav .subNavList li.navHistory a {
    background-image: url(../images/icon_gnav_arrow_on.jpg);
  }
  #GHead .inner .navBlock .snsNav {
    position: absolute;
    top: 24px;
    right: 0;
  }
  #GHead .inner .navBlock .snsNav li {
    display: inline-block;
    margin-left: 5px;
  }
}

@media only screen and (max-width: 767px) {
  #GHead {
    min-height: 45px;
    border-bottom: 1px solid #969696;
    -webkit-box-shadow: 0 5px 5px rgba(0, 0, 0, .1);
            box-shadow: 0 5px 5px rgba(0, 0, 0, .1);
  }
  #GHead .inner .logo {
    padding: 6px 0 3px;
  }
  #GHead .inner .logo img {
    width: 86px;
  }
  #GHead .inner .navBlock {
    position: absolute;
    top: 45px;
    left: 0;
    display: none;
    padding: 10px 0;
    width: 100%;
    border-top: 1px solid #969696;
    background: #ffffff;
  }
  #GHead .inner .navBlock .gNav > li {
    clear: both;
    padding: 0 15px;
    font-size: 1.6rem;
  }
  #GHead .inner .navBlock .gNav > li > a {
    display: inline-block;
    padding: 15px 10px 15px 25px;
    background: url(../images/icon_gnav_arrow.jpg) no-repeat left center/20px 20px;
  }
  #GHead .inner .navBlock .gNav > li .acBtn {
    position: relative;
    display: inline-block;
    margin-top: -3px;
    margin-left: 5px;
    width: 20px;
    height: 20px;
    border: 2px solid #787878;
    vertical-align: middle;
    cursor: pointer;
  }
  #GHead .inner .navBlock .gNav > li .acBtn:before,
  #GHead .inner .navBlock .gNav > li .acBtn:after {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    background: #787878;
    content: '';
  }
  #GHead .inner .navBlock .gNav > li .acBtn:before {
    margin: -7px 0 0 -1px;
    width: 2px;
    height: 14px;
  }
  #GHead .inner .navBlock .gNav > li .acBtn.open:before {
    opacity: 0;
  }
  #GHead .inner .navBlock .gNav > li .acBtn:after {
    margin: -1px 0 0 -7px;
    width: 14px;
    height: 2px;
  }
  #GHead .inner .navBlock .gNav > li .innerNav li {
    height: auto !important;
    font-size: 1.2rem;
  }
  #GHead .inner .navBlock .gNav > li .innerNav li a {
    display: inline-block;
    padding: 12px 0;
  }
  #GHead .inner .navBlock .gNav > li .innerNav li a:before {
    display: inline-block;
    margin-top: -2px;
    margin-right: 2px;
    content: '>';
    vertical-align: middle;
    font-size: 10px;
    -webkit-transform: scaleX(.6);
            transform: scaleX(.6);
  }
  #GHead .inner .navBlock .gNav > li .innerNav li br {
    display: none;
  }
  #GHead .inner .navBlock .gNav > li .innerNav .shopList {
    float: left;
    overflow: hidden;
  }
  #GHead .inner .navBlock .gNav > li .innerNav .shopList.shopList01 {
    width: 38%;
  }
  #GHead .inner .navBlock .gNav > li .innerNav .shopList.shopList02 {
    width: 62%;
  }
  #GHead .inner .navBlock .gNav > li .innerNav .shopList li sup {
    vertical-align: top;
  }
  #GHead .inner .navBlock .gNav > li .innerNav li img {
    display: none;
  }
  #GHead .inner .navBlock .otherNav {
    display: none;
  }
  #GHead .inner .navBlock .snsNav {
    display: none;
  }
  #GHead .menuBtn {
    position: absolute;
    top: 8px;
    right: 8px;
    display: block;
    width: 30px;
    height: 30px;
    background: #ffffff;
    cursor: pointer;
    -webkit-transition: all .4s;
            transition: all .4s;
  }
  #GHead .menuBtn span {
    position: absolute;
    left: 7px;
    display: inline-block;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    width: 16px;
    height: 2px;
    border-radius: 2px;
    background-color: #000000;
    -webkit-transition: all .4s;
            transition: all .4s;
  }
  #GHead .menuBtn span.m1 {
    top: 8px;
  }
  #GHead .menuBtn span.m2 {
    top: 14px;
  }
  #GHead .menuBtn span.m3 {
    top: 20px;
    opacity: 1.0;
  }
  .is-menu-open #GHead .menuBtn span.m1 {
    -webkit-transform: translateY(6px) rotate(-405deg);
            transform: translateY(6px) rotate(-405deg);
  }
  .is-menu-open #GHead .menuBtn span.m2 {
    -webkit-transform: translateY(0) rotate(405deg);
            transform: translateY(0) rotate(405deg);
  }
  .is-menu-open #GHead .menuBtn span.m3 {
    opacity: 0;
    -webkit-transform: translateY(-6px) rotate(360deg);
            transform: translateY(-6px) rotate(360deg);
  }
}

/*============================
#Contents
============================*/
#Contents {
  margin: 0 auto;
  padding: 120px 0;
  min-height: 300px;
  max-width: 2000px;
}

@media only screen and (max-width: 767px) {
  #Contents {
    padding: 40px 0;
  }
}

/*============================
#GFoot
============================*/
#GFoot {
  position: relative;
  z-index: 25;
  background: url(../images/foot_bg02.jpg) repeat #000000 center top;
}
#GFoot,
#GFoot a {
  color: #ffffff;
  text-decoration: none;
}
#GFoot a:hover {
  text-decoration: underline;
}
#GFoot .fnavWrap .fnavBlock .fnav li {
  padding-left: 1em;
}
#GFoot .fnavWrap .fnavBlock .fnav li a:before {
  display: inline-block;
  margin-left: -1em;
  width: 1em;
  content: '>';
}
#GFoot .copyright {
  text-align: center;
}

@media only screen and (min-width: 768px) {
  #GFoot {
    margin-top: 150px;
    min-height: 292px;
    font-size: 1.4rem;
  }
  #GFoot .inner860 {
    padding-top: 30px;
    padding-bottom: 10px;
  }
  #GFoot .fnavWrap {
    margin-bottom: 30px;
  }
  #GFoot .fnavWrap .fnavBlock {
    float: left;
  }
  #GFoot .fnavWrap .fnavBlock.fnavBlock1 {
    width: 430px;
  }
  #GFoot .fnavWrap .fnavBlock.fnavBlock1 .fnav {
    float: left;
  }
  #GFoot .fnavWrap .fnavBlock.fnavBlock1 .fnav.navL {
    width: 160px;
  }
  #GFoot .fnavWrap .fnavBlock.fnavBlock1 .fnav.navR {
    width: 270px;
  }
  #GFoot .fnavWrap .fnavBlock.fnavBlock2 {
    width: 135px;
  }
  #GFoot .fnavWrap .fnavBlock.fnavBlock3 {
    width: 135px;
  }
  #GFoot .fnavWrap .fnavBlock.fnavBlock4 {
    width: 160px;
  }
}

@media only screen and (max-width: 767px) {
  #GFoot {
    margin-top: 90px;
    min-height: 292px;
    background-image: url(../images/foot_bg02-sp.jpg);
    -webkit-background-size: 965px auto;
    -webkit-background-size: 375px 100%;
            background-size: 965px auto;
            background-size: 375px 100%;
    font-size: 1.2rem;
  }
  #GFoot .inner860 {
    padding-top: 30px;
    padding-bottom: 10px;
    max-width: 420px;
  }
  #GFoot .fnavWrap {
    margin-bottom: 10px;
  }
  #GFoot .fnavWrap .snsNav {
    margin-bottom: 20px;
    text-align: center;
  }
  #GFoot .fnavWrap .snsNav li {
    display: inline-block;
    margin: 0 8px;
    width: 40px;
    height: 40px;
  }
  #GFoot .fnavWrap .fnavBlock {
    margin-bottom: 20px;
  }
  #GFoot .fnavWrap .fnavBlock .parentLink {
    margin-bottom: 8px;
    font-weight: bold;
    font-size: 1.3rem;
  }
  #GFoot .fnavWrap .fnavBlock .fnav li {
    margin-bottom: 8px;
  }
  #GFoot .fnavWrap .fnavBlock.fnavBlock1 .fnav {
    float: left;
  }
  #GFoot .fnavWrap .fnavBlock.fnavBlock1 .fnav.navL {
    width: 40%;
  }
  #GFoot .fnavWrap .fnavBlock.fnavBlock1 .fnav.navR {
    width: 60%;
  }
  #GFoot .fnavWrap .fnavBlock.fnavBlock2 {
    float: left;
    width: 40%;
  }
  #GFoot .fnavWrap .fnavBlock.fnavBlock3 {
    float: left;
    width: 60%;
  }
  #GFoot .fnavWrap .fnavBlock.fnavBlock4 {
    clear: both;
  }
}

/*============================
#FixFoot
============================*/
#FixFoot {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 30;
  width: 100%;
}
#FixFoot.btmFix {
  position: absolute;
  top: 0;
  bottom: auto;
}
#FixFoot .staffBg {
  position: absolute;
  left: 50%;
  overflow: hidden;
  pointer-events: none;
}
#FixFoot .staffBg span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: url(../images/staff.png) repeat-y center 100%/100% auto;
  -webkit-transition: -webkit-transform .5s ease;
          transition: -webkit-transform .5s ease;
          transition:         transform .5s ease;
          transition:         transform .5s ease, -webkit-transform .5s ease;
  -webkit-transition-delay: .4s;
          transition-delay: .4s;
}
#FixFoot.staffSet .staffBg span {
  background-position: center 0;
  -webkit-transform: translateY(0px);
          transform: translateY(0px);
}
#FixFoot .bgWrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../images/foot_bg01.jpg) repeat-x center top #000000;
  -webkit-background-size: auto 100%;
          background-size: auto 100%;
}
#FixFoot .bgWrap:before,
#FixFoot .bgWrap:after {
  left: 50%;
  z-index: 0;
  background-image: url(../images/foot_bg_yakumi.png);
}
#FixFoot .bgWrap:before,
#FixFoot .bgWrap:after {
  position: absolute;
  display: block;
  background-position: 0 0;
  -webkit-background-size: 100% auto;
          background-size: 100% auto;
  background-repeat: no-repeat;
  content: '';
}
#FixFoot .itemList {
  position: relative;
  z-index: 1;
  margin: 0 auto;
  text-align: center;
}
#FixFoot .itemList li {
  position: relative;
  z-index: 0;
  float: left;
  vertical-align: bottom;
  opacity: 0;
  -webkit-transition: .2s ease;
          transition: .2s ease;
  -webkit-transition-property: opacity,-webkit-transform;
          transition-property: opacity,-webkit-transform;
          transition-property: transform,opacity;
          transition-property: transform,opacity,-webkit-transform;
  -webkit-transform: translateY(-25%);
          transform: translateY(-25%);
}
#FixFoot .itemList li:nth-child(2n) {
  z-index: 1;
}
#FixFoot .itemList li img {
  position: relative;
  z-index: 1;
}
#FixFoot .itemList li img.large {
  z-index: 0;
  max-width: inherit;
}
#FixFoot .itemList li .btn {
  position: relative;
  display: block;
  cursor: pointer;
}
#FixFoot .itemList li .btn:before {
  position: absolute;
  top: 0;
  left: 50%;
  display: block;
  background: url(../images/fever/menu/food_item_pop.png) no-repeat center center/100% auto;
  content: '';
  opacity: 0;
  -webkit-transition: .6s ease;
          transition: .6s ease;
  -webkit-transition-property: opacity,-webkit-transform;
          transition-property: opacity,-webkit-transform;
          transition-property: transform,opacity;
          transition-property: transform,opacity,-webkit-transform;
  -webkit-transform: scale(0) translateY(0);
          transform: scale(0) translateY(0);
  -webkit-transform-origin: 50% 80%;
          transform-origin: 50% 80%;
}
#FixFoot .itemList li.active {
  opacity: 1;
  -webkit-transition-duration: .5s;
          transition-duration: .5s;
  -webkit-transform: translateY(0%);
          transform: translateY(0%);
}
#FixFoot .itemList li.eating {
  z-index: 2;
}
#FixFoot .itemList li.eating .btn {
  -webkit-animation: foodjump 1s infinite alternate ease-in both;
          animation: foodjump 1s infinite alternate ease-in both;
}
#FixFoot .itemList li.eating .btn:before {
  display: none;
}
#FixFoot .itemList li.eating .btn:after {
  position: absolute;
  top: 20%;
  right: 25px;
  z-index: 1;
  display: block;
  width: 24px;
  height: 24px;
  background: url(../images/fever/menu/foot_item_close.png) no-repeat 0 0/100% auto;
  content: '';
}
#FixFoot .itemList li.popCaution .btn:before {
  -webkit-animation: popCaution 4s 1 ease both;
          animation: popCaution 4s 1 ease both;
}
#FixFoot .itemList li.popInOut .btn:before {
  -webkit-animation: popCaution 4s 1 ease both;
          animation: popCaution 4s 1 ease both;
  -webkit-animation-delay: .5s;
          animation-delay: .5s;
}
#FixFoot .hideList {
  display: none;
}
#FixFoot .menuItem {
  position: absolute;
  left: 50%;
}
#FixFoot .menuItem a {
  position: relative;
  display: block;
}
#FixFoot .menuItem a:before {
  position: absolute;
  left: 50%;
  display: block;
  background: url(../images/foot_bg_menu_pop.png) no-repeat center center/100% auto;
  content: '';
  -webkit-animation: menujump 1s infinite alternate ease-in-out both;
          animation: menujump 1s infinite alternate ease-in-out both;
}
#FixFoot .soundItem {
  position: absolute;
  left: 50%;
}
#FixFoot .soundItem .soundOn {
  display: block;
}
#FixFoot .soundItem .soundOff {
  display: none;
}
body.soundActive #FixFoot .soundItem .soundOn {
  display: none;
}
body.soundActive #FixFoot .soundItem .soundOff {
  display: block;
}

@media only screen and (min-width: 768px) {
  #FixFoot {
    height: 150px;
  }
  #FixFoot.btmFix {
    top: -150px;
  }
  #FixFoot .staffBg {
    top: -250px;
    margin-left: -400px;
    width: 210px;
    height: 340px;
  }
  #FixFoot .staffBg span {
    -webkit-transform: translateY(250px);
            transform: translateY(250px);
  }
  #FixFoot .bgWrap:before,
  #FixFoot .bgWrap:after {
    top: 40px;
    width: 140px;
    height: 60px;
  }
  #FixFoot .bgWrap:before,
  #FixFoot .bgWrap:after {
    position: absolute;
    display: block;
    background-position: 0 0;
    -webkit-background-size: 100% auto;
            background-size: 100% auto;
    background-repeat: no-repeat;
    content: '';
  }
  #FixFoot .bgWrap:before {
    margin-left: -600px;
  }
  #FixFoot .bgWrap:after {
    margin-left: 500px;
  }
  #FixFoot .itemList {
    padding-left: 10px;
    width: 590px;
  }
  #FixFoot .itemList li {
    margin-top: -15px;
    margin-left: -10px;
    min-height: 50px;
    width: 200px;
  }
  #FixFoot .itemList li .btn:before {
    margin-left: -56px;
    width: 112px;
    height: 112px;
  }
  #FixFoot .itemList li .btn:hover:before {
    opacity: 1;
    -webkit-transform: scale(1) translateY(-65%);
            transform: scale(1) translateY(-65%);
  }
  #FixFoot .itemList li img.large {
    margin-left: -15px;
    width: 230px;
  }
  #FixFoot .itemList li.eating .btn:after {
    top: 15%;
    right: 25px;
    width: 24px;
    height: 24px;
  }
  #FixFoot .menuItem {
    top: -13px;
    margin-left: 275px;
    width: 140px;
  }
  #FixFoot .menuItem a:before {
    top: -75px;
    margin-left: -60px;
    width: 120px;
    height: 70px;
  }
  #FixFoot .soundItem {
    top: 67px;
    margin-left: 379px;
  }
}

@media only screen and (max-width: 767px) {
  #FixFoot {
    height: 90px;
  }
  #FixFoot.btmFix {
    top: -90px;
  }
  #FixFoot .staffBg {
    top: -200px;
    margin-left: -180px;
    width: 157px;
    height: 255px;
  }
  #FixFoot .staffBg span {
    -webkit-transform: translateY(200px);
            transform: translateY(200px);
  }
  #FixFoot .bgWrap {
    background-image: url(../images/foot_bg01-sp.jpg);
    -webkit-background-size: 375px 90px;
            background-size: 375px 90px;
  }
  #FixFoot .bgWrap:before,
  #FixFoot .bgWrap:after {
    top: 20px;
    width: 70px;
    height: 30px;
  }
  #FixFoot .bgWrap:before,
  #FixFoot .bgWrap:after {
    position: absolute;
    display: block;
    background-position: 0 0;
    -webkit-background-size: 100% auto;
            background-size: 100% auto;
    background-repeat: no-repeat;
    content: '';
  }
  #FixFoot .bgWrap:before {
    margin-left: -345px;
  }
  #FixFoot .bgWrap:after {
    margin-left: 220px;
  }
  #FixFoot .itemList {
    padding-left: 10px;
    width: 270px;
  }
  #FixFoot .itemList li {
    margin-top: 8px;
    margin-left: -5px;
    min-height: 5px;
    width: 90px;
  }
  #FixFoot .itemList li .btn:before {
    margin-left: -28px;
    width: 56px;
    height: 56px;
  }
  #FixFoot .itemList li img.large {
    margin-left: -5px;
    width: 100px;
  }
  #FixFoot .itemList li.eating .btn:after {
    top: 10%;
    right: 5px;
    width: 15px;
    height: 15px;
  }
  #FixFoot .menuItem {
    top: 0;
    margin-left: 90px;
  }
  #FixFoot .menuItem img {
    width: 70px;
  }
  #FixFoot .menuItem a:before {
    top: -40px;
    margin-left: -30px;
    width: 60px;
    height: 35px;
  }
  .soundItemSp {
    position: fixed;
    bottom: 10px;
    left: 10px;
    z-index: 102;
  }
  .soundItemSp .soundOn {
    display: block;
  }
  .soundItemSp .soundOff {
    display: none;
  }
  .soundItemSp img {
    width: 30px;
  }
  body.soundActive .soundItemSp .soundOn {
    display: none;
  }
  body.soundActive .soundItemSp .soundOff {
    display: block;
  }
}

@-webkit-keyframes popInOut {
  0% {
    opacity: 0;
    -webkit-transform: scale(0) translateY(0%);
            transform: scale(0) translateY(0%);
  }
  50%,
  100% {
    opacity: 1;
    -webkit-transform: scale(1) translateY(-65%);
            transform: scale(1) translateY(-65%);
  }
}

@keyframes popInOut {
  0% {
    opacity: 0;
    -webkit-transform: scale(0) translateY(0%);
            transform: scale(0) translateY(0%);
  }
  50%,
  100% {
    opacity: 1;
    -webkit-transform: scale(1) translateY(-65%);
            transform: scale(1) translateY(-65%);
  }
}

@-webkit-keyframes popCaution {
  0% {
    opacity: 0;
    -webkit-transform: scale(0) translateY(0%);
            transform: scale(0) translateY(0%);
  }
  20%,
  80% {
    opacity: 1;
    -webkit-transform: scale(1) translateY(-65%);
            transform: scale(1) translateY(-65%);
  }
  99% {
    opacity: 0;
    -webkit-transform: scale(1) translateY(-80%);
            transform: scale(1) translateY(-80%);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0) translateY(0%);
            transform: scale(0) translateY(0%);
  }
}

@keyframes popCaution {
  0% {
    opacity: 0;
    -webkit-transform: scale(0) translateY(0%);
            transform: scale(0) translateY(0%);
  }
  20%,
  80% {
    opacity: 1;
    -webkit-transform: scale(1) translateY(-65%);
            transform: scale(1) translateY(-65%);
  }
  99% {
    opacity: 0;
    -webkit-transform: scale(1) translateY(-80%);
            transform: scale(1) translateY(-80%);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0) translateY(0%);
            transform: scale(0) translateY(0%);
  }
}

@-webkit-keyframes foodjump {
  0%,
  50% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
  }
  75% {
    -webkit-transform: translateY(-12%);
            transform: translateY(-12%);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

@keyframes foodjump {
  0%,
  50% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
  }
  75% {
    -webkit-transform: translateY(-12%);
            transform: translateY(-12%);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

@-webkit-keyframes menujump {
  0% {
    -webkit-transform: translateY(-12%);
            transform: translateY(-12%);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

@keyframes menujump {
  0% {
    -webkit-transform: translateY(-12%);
            transform: translateY(-12%);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

/*============================
#Loading
============================*/
#Loading {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 1000;
  display: none;
  background: #000000;
  line-height: 1;
  opacity: .95;
}
#Loading img {
  vertical-align: top;
}
html.loading #Loading {
  display: block;
}
html.loaded #Loading {
  display: none;
}

@media only screen and (min-width: 768px) {
  #Loading {
    margin: -22px 0 0 -22px;
    padding: 10px;
    border-radius: 6px;
  }
  #Loading img {
    width: 24px;
  }
}

@media only screen and (max-width: 767px) {
  #Loading {
    margin: -13px 0 0 -13px;
    padding: 5px;
    border-radius: 3px;
  }
  #Loading img {
    width: 16px;
  }
}

/*============================
#PreloadCont
============================*/
#PreloadCont {
  display: none !important;
}
