@charset 'utf-8';
/*
**********************************************************************

* common.css

*********************************************************************
*/
/* =========================================================
base
========================================================= */
* {
  word-wrap: break-word;
}
body {
  font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  font-size: 14px;
  line-height: 1.6;
  color: #000;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}
/* link
----------------------------------------------------------------------*/
a:link {
  text-decoration: underline;
  color: #000;
}
a:visited {
  text-decoration: underline;
  color: #000;
}
a:hover {
  text-decoration: none;
  color: #000;
}
a:active {
  text-decoration: none;
  color: #000;
}
#GHead .inner,
#GFoot,
#Contents .inner {
  position: relative;
  margin: 0 auto;
}
.ie8 #GHead .inner,
.ie8 #GFoot,
.ie8 #Contents .inner {
  min-width: 980px;
}
.ie8 *,
.ie9 *,
.ie8 *:after,
.ie9 *:after {
  -ms-transform: none !important;
  transform: none !important;
  -ms-transform-origin: 50% 50% !important;
  transform-origin: 50% 50% !important;
}
/* =========================================================
汎用class
========================================================= */

/* clear fix
---------------------------*/
.clearfix:after {
  display: block;
  visibility: hidden;
  clear: both;
  height: 0;
  content: '.';
}
/* WinIE7 only */
*:first-child + html .clearfix {
  height: 1%;
}
/* WinIE6 and below */
/* hide \*/
* html .clearfix {
  height: 1%;
}
/* a:hover
---------------------------*/
.ov:hover img {
  opacity: .8;
}
.ovA:hover {
  opacity: .8;
}
/* margin
---------------------------*/
.mgB0 {
  margin-bottom: 0px !important;
}
.mgB10 {
  margin-bottom: 10px !important;
}
.mgB15 {
  margin-bottom: 10px;
}
.mgB20 {
  margin-bottom: 20px;
}
.mgB30 {
  margin-bottom: 30px;
}
.mgB40 {
  margin-bottom: 40px;
}
.mgB50 {
  margin-bottom: 50px;
}
.mgB60 {
  margin-bottom: 60px;
}
.mgB70 {
  margin-bottom: 70px;
}
.mgB80 {
  margin-bottom: 80px;
}
.mgB90 {
  margin-bottom: 90px;
}
.mgB100 {
  margin-bottom: 100px;
}
.mgT10 {
  margin-top: 10px;
}
.mgT20 {
  margin-top: 20px;
}
.mgT30 {
  margin-top: 30px;
}
.mgT40 {
  margin-top: 40px;
}
.mgT50 {
  margin-top: 50px;
}
.mgT60 {
  margin-top: 60px;
}

/* youtube
---------------------------*/
.youtubeManager{
	background: #000;
}
.ytWrapper:after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 100;
  width: 50px;
  height: 50px;
  margin: -25px 0 0 -25px;
  background-image: url("../images/common/weather/map/anim-loading-pc.png");
  background-repeat: repeat;
  opacity: 0;
  -webkit-animation: loading 500ms infinite steps(3);
  -o-animation: loading 500ms infinite steps(3);
  -webkit-animation: loading 500ms infinite steps(3);
  -moz-animation: loading 500ms infinite steps(3);
  -o-animation: loading 500ms infinite steps(3);
  -ms-animation: loading 500ms infinite steps(3);
  animation: loading 500ms infinite steps(3);
  -webkit-transition: opacity 500ms ease-in-out;
  -o-transition: opacity 500ms ease-in-out;
  transition: opacity 500ms ease-in-out;
  pointer-events: none;
}
.ytLoading:after {
  opacity: 1;
}
.ytWrapper iframe {

  opacity: 1;
  -webkit-transition: 500ms ease-in-out;
  -o-transition: 500ms ease-in-out;
  transition: 500ms ease-in-out;
}
.ytWrapper.android iframe{
  height: 150px;	
}

.ytLoading iframe {
  opacity: 0;
}
.youtube .loading,
.keyvWrap .loading{
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 101;
  width: 50px;
  height: 50px;
  margin: -25px 0 0 -25px;
  background-image: url("../images/common/weather/map/anim-loading-pc.png");
  background-repeat: repeat;
  -webkit-animation: loading 500ms infinite steps(3);
  -o-animation: loading 500ms infinite steps(3);
  -webkit-animation: loading 500ms infinite steps(3);
  -moz-animation: loading 500ms infinite steps(3);
  -o-animation: loading 500ms infinite steps(3);
  -ms-animation: loading 500ms infinite steps(3);
  animation: loading 500ms infinite steps(3);
}
@media screen and (max-width: 768px) {
.ytWrapper:after {
  width: 30px;
  height: 30px;
  margin: -15px 0 0 -15px;
  -webkit-background-size: 90px 30px;
  background-size: 90px 30px;
  -webkit-animation: loadingSP 500ms infinite steps(3);
  -o-animation: loadingSP 500ms infinite steps(3);
  -webkit-animation: loadingSP 500ms infinite steps(3);
  -moz-animation: loadingSP 500ms infinite steps(3);
  -o-animation: loadingSP 500ms infinite steps(3);
  -ms-animation: loadingSP 500ms infinite steps(3);
  animation: loadingSP 500ms infinite steps(3);
}
}

/* =========================================================
Wrap
========================================================= */
#Wrap {
  overflow: hidden;
  background: #000;
}
.ie8 #Wrap {
  min-width: 980px;
}
#WrapIn {
  min-width: 320px;
  max-width: 1598px;
  margin: 0 auto;
  border: solid #000;
  border-width: 0 6px;
  background: #fff;
}
#Contents {
}
#MqSpBox,
#MqTbBox {
  position: fixed;
  bottom: 0;
  left: 0;
  display: none;
  width: 1px;
  height: 1px;
}
@media screen and (max-width: 768px) {
#Wrap {
}
#WrapIn {
  border-width: 0 2px;
}
#Contents {
}
#MqSpBox {
  display: block;
}
}
/* =========================================================
GHead
========================================================= */
#GHead {
  position: relative;
  color: #fff;
  border-bottom: 1px solid #fff;
  background: #000;
  z-index: 1;
}
#GHead img {
  vertical-align: top;
}
#GHead a {
  color: #fff;
}
#GHead .inner {
  position: relative;
  z-index: 600;
  padding: 0 2%;
  border-bottom: 1px solid #fff;
  background: #000;
  -webkit-transition: padding 100ms ease-in-out;
  -o-transition: padding 100ms ease-in-out;
  transition: padding 100ms ease-in-out;
}

.ie8 #GHead .inner {
  padding: 0;
}

#GHead .maxWrap {
  position: relative;
  max-width: 980px;
  margin: 0 auto;
  z-index: 0;
}
/*
------------------- */
#GHead .navBlock {
  position: relative;
  padding: 42px 0 12px;
}
#GHead .navBlock .logo a {
  display: block;
  width: 202px;
  height: 55px;
  text-indent: -9999px;
  background: url(../images/common/head-logo.png) no-repeat 0 0;
}
#GHead .navBlock .menuBtn {
  display: none;
}
#GHead .navBlock .gNav {
  position: absolute;
  top: 64px;
  right: 0;
}
#GHead .navBlock .gNav li {
  position: relative;
  display: inline-block;
  height: 24px;
  margin-left: 4px;
}

#GHead .navBlock .gNav li.select:before {
  position: absolute;
  top: 0;
  left: -7px;
  z-index: 0;
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  padding: 0;
  border: 2px solid #fff;
  border-width: 1px 2px;
  -webkit-transform: skewX(-27deg);
  -ms-transform: skewX(-27deg);
  -o-transform: skewX(-27deg);
  transform: skewX(-27deg);
  -webkit-transform-origin: 0% 100%;
  -moz-transform-origin: 0% 100%;
  -ms-transform-origin: 0% 100%;
  -o-transform-origin: 0% 100%;
  transform-origin: 0% 100%;
}

.ie8 #GHead .navBlock .gNav li span{
  left: 0;
  right: auto !important;
}

.ie8 #GHead .navBlock .gNav li .rollover{
  left: -7px !important;
  right: auto;
}

.ie8 #GHead .navBlock .gNav li.select:before{
  left: -14px;
  right: auto;
}

#GHead .navBlock .gNav li a {
  display: block;
  width: 100%;
  height: 100%;
}

#GHead .navBlock .gNav li a span {
  display: block;
  position: absolute;
  top: 50%;
  left: 12px;
  width: 100%;
  text-indent: -9999px;
  text-align: left;
}

#GHead .navBlock .gNav li a span.base {
  z-index: 0;
  margin-top: -6px;
}

#GHead .navBlock .gNav li a span.rollover {
  overflow: hidden;
  left: auto;
  right: 4px;
  z-index: 1;
  width: 0%;
  margin: -12px 0 0 -6px;
  padding: 2px 0;
  background-color: #fff;
  -webkit-transform-origin: 0% 100%;
  -moz-transform-origin: 0% 100%;
  -ms-transform-origin: 0% 100%;
  -o-transform-origin: 0% 100%;
  transform-origin: 0% 100%;
  -webkit-transform: skewX(-27deg);
  -ms-transform: skewX(-27deg);
  -o-transform: skewX(-27deg);
  transform: skewX(-27deg);
  pointer-events: none;
}

#GHead .navBlock .gNav li a.out span.rollover {
  -webkit-animation: leaving 100ms cubic-bezier(0,.7,.3,1);
  -o-animation: leaving 100ms cubic-bezier(0,.7,.3,1);
  animation: leaving 100ms cubic-bezier(0,.7,.3,1);
  -webkit-transform: skewX(-27deg);
  -ms-transform: skewX(-27deg);
  -o-transform: skewX(-27deg);
  transform: skewX(-27deg);
}

#GHead .navBlock .gNav li.on a span.rollover,
#GHead .navBlock .gNav li a.enter span.rollover {
  left: 0;
  right: auto;
  width: 102%;
  margin-right: 6px;
  -webkit-animation: entering 100ms cubic-bezier(0,.7,.3,1);
  -o-animation: entering 100ms cubic-bezier(0,.7,.3,1);
  animation: entering 100ms cubic-bezier(0,.7,.3,1);
}

#GHead .navBlock .gNav li a span.rollover:after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: auto;
  right: 10px;
  margin-top: -7px;
  background-position: center bottom;
  -webkit-transform: skewX(27deg);
  -ms-transform: skewX(27deg);
  -o-transform: skewX(27deg);
  transform: skewX(27deg);
}

#GHead .navBlock .gNav li.on a span.rollover:after,
#GHead .navBlock .gNav li a.enter span.rollover:after {
  left: 12px;
  right: auto;
}

#GHead .navBlock .gNav li a span.base,
#GHead .navBlock .gNav li a span.rollover:after {
  height: 14px;
}

@-webkit-keyframes entering {
  0% {
    width: 0%;
  }
  100% {
    width: 102%;
  }
}
@keyframes entering {
  0% {
    width: 0%;
  }
  100% {
    width: 102%;
  }
}

@-webkit-keyframes leaving {
  0% {
    width: 102%;
  }
  100% {
    width: 0%;
  }
}
@keyframes leaving {
  0% {
    width: 102%;
  }
  100% {
    width: 0%;
  }
}

#GHead .navBlock .gNav li a.enter span.base {
  z-index: 0;
}

#GHead .navBlock .gNav .gNavProduct:after{
	position: absolute;
	left: 50%;
	bottom: -21px;
	content: "";
	background: url(../images/common/gnav2in-icon-balloon-pc.gif) no-repeat;
	background-position: 0 11px;
	width: 6px;
	height: 11px;
	-webkit-transition: all 100ms ease-in-out;
	-o-transition: all 100ms ease-in-out;
	transition: all 100ms ease-in-out;
}
#GHead .navBlock .gNav .gNavProduct.onarrow:after{
	background-position: 0 0px;
}
@media screen and (max-width: 979px) {
#GHead .navBlock .gNav .gNavProduct:after{
	bottom: -45px;
}

}
#GHead .navBlock .gNav .gNavProduct {
  width: 158px;
}
#GHead .navBlock .gNav .gNavHowto {
  width: 126px;
}
#GHead .navBlock .gNav .gNavGallery {
  width: 120px;
}
#GHead .navBlock .gNav .gNavSalon {
  width: 106px;
}
#GHead .navBlock .gNav .gNavSpecial {
  width: 84px;
}
#GHead .navBlock .gNav .gNavSitemap {
  width: 90px;
}

#GHead .navBlock .gNav .gNavProduct a span.base,
#GHead .navBlock .gNav .gNavProduct a span.rollover:after {
  width: 138px;
  background-image: url(/images/common/gnav-product.png);
}
#GHead .navBlock .gNav .gNavHowto a span.base,
#GHead .navBlock .gNav .gNavHowto a span.rollover:after {
  width: 106px;
  background-image: url(/images/common/gnav-howto.png);
}
#GHead .navBlock .gNav .gNavGallery a span.base,
#GHead .navBlock .gNav .gNavGallery a span.rollover:after {
  width: 100px;
  background-image: url(/images/common/gnav-adgallery.png);
}
#GHead .navBlock .gNav .gNavSalon a span.base,
#GHead .navBlock .gNav .gNavSalon a span.rollover:after {
  width: 86px;
  background-image: url(/images/common/gnav-salon.png);
}
#GHead .navBlock .gNav .gNavSpecial a span.base,
#GHead .navBlock .gNav .gNavSpecial a span.rollover:after {
  width: 64px;
  background-image: url(/images/common/gnav-special.png);
}
#GHead .navBlock .gNav .gNavSitemap a span.base,
#GHead .navBlock .gNav .gNavSitemap a span.rollover:after {
  width: 70px;
  background-image: url(/images/common/gnav-sitemap.png);
}

/**************************************************************
GET YOUR STYLE!
**************************************************************/
#GHead .navBlock .gNav .gNavGetyourstyle {
  width: 180px;
  height: 24px;
}
#GHead .navBlock .gNav .gNavGetyourstyle:before {
  content: none;
  display: none;
}

#GHead .navBlock .gNav .gNavGetyourstyle a {
  overflow: hidden;
  position: absolute;
  top: 1px;
  left: 0;
  height: 26px;
  margin: 0;
  background-image: url(/images/common/gnav-getyourstyle.png);
  background-position: 0 0;
}
#GHead .navBlock .gNav .gNavGetyourstyle a:hover {
  background-position: 0 26px;
}
/**************************************************************
GET YOUR STYLE!
**************************************************************/



#GHead .gHeadIn2 .navBlock .gNav .gNavProduct {
  width: 150px;
}
#GHead .gHeadIn2 .navBlock .gNav .gNavHowto {
  width: 118px;
}
#GHead .gHeadIn2 .navBlock .gNav .gNavGallery {
  width: 112px;
}
#GHead .gHeadIn2 .navBlock .gNav .gNavSalon {
  width: 98px;
}
#GHead .gHeadIn2 .navBlock .gNav .gNavSpecial {
  width: 76px;
}
#GHead .gHeadIn2 .navBlock .gNav .gNavSitemap {
  width: 82px;
}
#GHead .gHeadIn2 .navBlock .gNav .gNavGetyourstyle {
  width: 180px;
}
#GHead .gHeadIn2 .navBlock .gNav .gNavGetyourstyle {
  margin-right: -20px;
}
#GHead .gHeadIn2 .navBlock .gNav .gNavGetyourstyle a {
  -webkit-background-size: 180px 52px;
  background-size: 180px 52px;
}

}
/*
------------------- */

@media screen and (min-width: 1610px) {
  #GHead .inner {
    padding: 0;
  }
  #GHead .inner .userinfoBlock {
    right: 0;
  }
  #GHead .gHeadIn2 .inner .userinfoBlock {
    right: 0;
  }
}

/*
------------------- */
.spnavBox {
  display: none;
}
/*
------------------- */
#GHead .userinfoBlock {
  position: absolute;
  top: 25px;
  right: 2%;
}
#GHead .userinfoBlock .infoList {
  float: left;
  position: relative;
  max-width: 470px;
}
@media screen and (max-width: 768px) {
#GHead .userinfoBlock .infoList {
  max-width: none;
}
}
#GHead .userinfoBlock .infoList .loading {
  position: absolute;
  left: -288px;
  top: 0px;
  background: url(../images/common/weather/loading-weather.gif) no-repeat;
  width: 140px;
  height: 18px;
  display: none;
  background-size: 140px;
}
#GHead .userinfoBlock .infoList .prefcode{
  display: none;
}
#GHead .userinfoBlock .infoList ul{
	display: none;
}
#GHead .userinfoBlock .infoList li {
  float: left;
  margin-left: 16px;
}
#GHead .userinfoBlock .infoList li.pref a {
  background: url(../images/common/location.gif) no-repeat left center;
  background-size: 15px;
  -webkit-background-size: 15px;
  padding-left: 20px;
  padding-top: 1px;
}
.ie8 #GHead .userinfoBlock .infoList li.pref a {
  background-image: none;
}
#GHead .userinfoBlock .infoList li.weather {
  margin-top: -5px;
}
#GHead .userinfoBlock .infoList li img {
  width: auto;
  height: 22px;
  margin-right: 2px;
  vertical-align: bottom;
}
#GHead .userinfoBlock .infoList li.weather img {
  height: 30px;
}
#GHead .userinfoBlock .amazonBtn {
  float: left;
  margin-left: 15px;
}
#GHead .userinfoBlock .amazonBtn a {
  display: block;
  width: 65px;
  height: 30px;
  text-indent: -9999px;
  background: url(../images/common/icon-amazon01.png) no-repeat 0 0;
  background-position-y: 4px;
}
#GHead .userinfoBlock .searchBtn {
  float: left;
  margin-left: 15px;
}
#GHead .userinfoBlock .searchBtn > a {
  float: left;
  display: block;
  width: 22px;
  height: 22px;
  text-indent: -9999px;
  background: url(../images/common/icon-search.png) no-repeat 0 0;
}
.ie8 #GHead .userinfoBlock .searchBtn > a {
  display: none !important;
}
#GHead .userinfoBlock .searchBtn .searchBody {
  display: none;
  float: right;
  width: 300px;
  height: 33px;
  margin-top: -4px;
  padding: 2px 10px;
  background-color: #fff;
  overflow: hidden;
  -webkit-transform: skewX(-27deg);
  -ms-transform: skewX(-27deg);
  -o-transform: skewX(-27deg);
  transform: skewX(-27deg);
}
.ie8 #GHead .userinfoBlock .searchBtn .searchBody {
  display: block !important;
  width: 300px !important;
}
#GHead .userinfoBlock .searchBtn .searchBody div,
#GHead .userinfoBlock .searchBtn .searchBody form,
#GHead .userinfoBlock .searchBtn .searchBody table,
#GHead .userinfoBlock .searchBtn .searchBody td {
  margin: 0;
  border: none;
}
#GHead .userinfoBlock .searchBtn .searchBody > div {
  -webkit-transform: skewX(27deg);
  -ms-transform: skewX(27deg);
  -o-transform: skewX(27deg);
  transform: skewX(27deg);
}
#GHead .userinfoBlock .searchBtn .searchBody input {
  display: block;
}
#GHead .userinfoBlock .searchBtn .searchBody .gsc-control-cse {
  padding: 0;
}
.gsc-search-box .gsc-search-button {
  line-height: 1;
}

.gsc-search-box .gsib_a {
  padding-top: 0;
  padding-bottom: 0;
}


/*
------------------- */
#GNav2 .nav2Block {
  border-bottom: 0;
}
#GNav2 .nav2Block .gNav2 {
  display: table;
  width: 100%;
  text-align: center;
}
#GNav2 .nav2Block .gNav2 li {
  position: relative;
  display: table-cell;
  text-align: center;
}
#GNav2 .nav2Block .gNav2 li a {
  position: relative;
  display: block;
  height: 35px;
  margin: 0 auto;
  text-indent: -9999px;
  background: no-repeat center center;
}
#GNav2 .nav2Block .gNav2 .gNav2Newproduct a {
  min-width: 62px;
  background-image: url(../images/common/gnav2-news.png);
}
#GNav2 .nav2Block .gNav2 .gNav2Haircare a {
  min-width: 50px;
  background-image: url(../images/common/gnav2-haircare.png);
}
#GNav2 .nav2Block .gNav2 .gNav2Haircolor a {
  min-width: 61px;
  background-image: url(../images/common/gnav2-haircolor.png);
}
#GNav2 .nav2Block .gNav2 .gNav2Hairstyling a {
  min-width: 99px;
  background-image: url(../images/common/gnav2-hairstyling.png);
}
#GNav2 .nav2Block .gNav2 .gNav2Facecare a {
  min-width: 72px;
  background-image: url(../images/common/gnav2-facecare.png);
}
#GNav2 .nav2Block .gNav2 .gNav2Shaving a {
  min-width: 74px;
  background-image: url(../images/common/gnav2-shaving.png);
}
#GNav2 .nav2Block .gNav2 .gNav2Bodycare a {
  min-width: 61px;
  background-image: url(../images/common/gnav2-bodycare.png);
}
#GNav2 .nav2Block .gNav2 .gNav2Fragrance a {
  min-width: 72px;
  background-image: url(../images/common/gnav2-fragrance.png);
}
#GNav2 .nav2Block .gNav2 .gNav2Other a {
  min-width: 32px;
  background-image: url(../images/common/gnav2-other.png);
}
#GNav2 .nav2Block .gNav2 li:after {
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 6px;
	height: 11px;
	margin: 0 0 0 -0;
	content: '';
	background: url(../images/common/gnav2in-icon-balloon-pc.gif) no-repeat right bottom;
	background-position: 0 11px;
	-webkit-transition: all 100ms ease-in-out;
	-o-transition: all 100ms ease-in-out;
	transition: all 100ms ease-in-out;
}
#GNav2 .nav2Block .gNav2 li.open:after{
	background-position: 0 0px;
}
.ie8 #GNav2 .nav2Block .gNav2 li:after {
  display: none !important;
}

/*
================================ */


/*
================================ */
#GHead .gHeadIn2 {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  width: 100%;
  background: #000;
  border: solid #000;
  border-width: 0 6px;
  box-sizing: border-box;
}
#GHead .gHeadIn2 .inner {
  max-width: 1598px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#GHead .gHeadIn2 .navBlock {
  height: 36px;
  padding: 13px 0 0;
}
#GHead .gHeadIn2 .navBlock .logo a {
  width: 100px;
  height: 27px;
  -webkit-background-size: auto 27px;
  background-size: auto 27px;
}
#GHead .gHeadIn2 .navBlock .logo img {
  width: auto;
  height: 27px;
}
#GHead .gHeadIn2 .navBlock .gNav {
  position: absolute;
  top: 12px;
  right: auto;
  right: 100px;
}
#GHead .gHeadIn2 .navBlock .gNav li {
  display: inline-block;
  margin-left: 10px;
}
#GHead .gHeadIn2 .navBlock .gNav li.select:before {
  left: -3px;
}
#GHead .gHeadIn2 .navBlock .gNav li a.enter span.rollover {
  left: 4px;
}
#GHead .gHeadIn2 .navBlock .gNav li a.enter span.rollover:after {
  left: 8px;
}
#GHead .gHeadIn2 .navBlock .gNav li a.out span.rollover {
  right: 0px;
  left: auto;
}
#GHead .gHeadIn2 .navBlock .gNav li a.out span.rollover:after {
  right: 6px;
  left: auto;
}

#GHead .gHeadIn2 .navBlock .gNav li a {
  -webkit-background-size: auto 12px;
  background-size: auto 12px;
}

.ie8 #GHead .gHeadIn2 .navBlock .gNav {
  right: 130px;
}
.ie8 #GHead .navBlock .gNav li img {
  width: auto;
  height: 12px;
}

.ie8 #GHead .gHeadIn2 .navBlock .gNav li.select:before {
  left: -14px;
}

.ie8 #GHead .gHeadIn2 .navBlock .gNav li span.base {
  left: -7px;
}

#GHead .gHeadIn2 .navBlock .gNav .gNavProduct:after{
	display: none;
}
#GHead .gHeadIn2 .navBlock .gNavToolip .gNavProduct{
	display: none;
}

/*
------------------- */
#GHead .gHeadIn2 .userinfoBlock {
  position: absolute;
  top: 0;
  right: 2%;
  /*width: 258px;*/
  width: 100px;
  height: 50px;
  background: url(../images/common/bg_slash-pc.png) no-repeat left top;
}
#GHead .gHeadIn2 .userinfoBlock .infoList {
  float: left;
  /*width: 180px;*/
  width: 30px;
  padding-top: 9px;
  text-align: right;
}
#GHead .gHeadIn2 .userinfoBlock .infoList li {
  display: none;
  line-height: 1;
  /*display: inline-block;*/
  float: none;
  margin-left: 0;
}
#GHead .gHeadIn2 .userinfoBlock .infoList li.pref {
  display: none;
  float: none;
  margin-left: 0;
  text-align: right;
}
#GHead .gHeadIn2 .userinfoBlock .infoList li.weather {
  display: block;
  position: absolute;
  top: 10px;
  right: -36px;
  margin-top: 0;
}
#GHead .gHeadIn2 .userinfoBlock .infoList li img {
  width: auto;
  height: 13px;
  margin-right: 2px;
  vertical-align: bottom;
}
#GHead .gHeadIn2 .userinfoBlock .infoList li.weather img {
  height: 28px;
}
#GHead .gHeadIn2 .userinfoBlock .amazonBtn {
  position: absolute;
  top: 12px;
  right: -1px;
}
#GHead .gHeadIn2 .userinfoBlock .amazonBtn a {
  display: block;
  width: 26px;
  height: 26px;
  text-indent: -9999px;
  background: url(../images/common/icon-amazon02.png) 0 0 no-repeat;
}
#GHead .gHeadIn2 .userinfoBlock .searchBtn {
  display: none;
}
#GHead .gHeadIn2 .nav2InBlock {
  display: none;
}
@media screen and (max-width: 979px) and (min-width: 769px) {
#GHead .navBlock {
  padding: 73px 0 12px;
}
#GHead .navBlock .gNav {
  top: 67px;
  width: 500px;
  text-align: right;
}
/*#GHead .navBlock .gNav li {
  margin-left: 43px;
}*/
#GHead .gHeadIn2 {
  display: none;
}
}
@media screen and (max-width: 768px) {
#GHead {
  z-index: 2;
  padding-top: 60px;
}
#GHead .inner {
  padding-left: 0;
  padding-right: 0;
  border-bottom: 0;
}
#GHead .navBlock .menuBtn {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 22px;
  height: 22px;
  cursor: pointer;
  display: block;
  text-indent: -9999px;
  background-image: url(../images/common/icon-menu-anim.png);
  background-size: auto 22px;
  background-repeat: no-repeat;
  background-position: 0% 0;
  -webkit-animation: menuAnimOpen 400ms steps(11) 0ms 1;
          animation: menuAnimOpen 400ms steps(11) 0ms 1;
}

#GHead .navBlock .menuBtn.close {
  background-position: 100% 0;
  -webkit-animation: menuAnimClose 400ms steps(11) 0ms 1;
          animation: menuAnimClose 400ms steps(11) 0ms 1;
}

@-webkit-keyframes menuAnimOpen {
  0% {
    background-position: 100% 0;
  }
  100% {
    background-position: 0% 0;
  }
}
@keyframes menuAnimOpen {
  0% {
    background-position: 100% 0;
  }
  100% {
    background-position: 0% 0;
  }
}

@-webkit-keyframes menuAnimClose {
  0% {
    background-position: 0% 0;
  }
  100% {
    background-position: 100% 0;
  }
}
@keyframes menuAnimClose {
  0% {
    background-position: 0% 0;
  }
  100% {
    background-position: 100% 0;
  }
}


/* .navBlock 
================================================*/
#GHead .navBlock {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  padding: 0 2px;
  background: #000;
}
#GHead .navBlock.open {
  overflow-y: scroll;
  height: 100%;
}
#GHead .navBlock .logo {
  height: 43px;
  padding: 17px 0 0 10px;
}
#GHead .navBlock .logo a {
  width: 103px;
  height: 28px;
  -webkit-background-size: auto 28px;
  background-size: auto 28px;
}
#GHead .navBlock .gNav {
  display: none;
}
#GHead .navBlock .gNav li {
}

/*
------------------- */
#GHead .userinfoBlock {
  position: relative;
  top: auto;
  right: auto;
  height: auto;
  padding: 0 10px;
  padding-top: 0px;
  text-align: right;
  border-top: 1px solid;
  height: 43px;
}
#GHead .userinfoBlock.noweather{
	display: none;
}
#GHead .userinfoBlock .infoList {
  display: block;
  float: none;
  text-align: right;
  padding: 10px 0 8px 0;
}
#GHead .userinfoBlock .infoList li {
  line-height: 1;
  display: inline-block;
  float: none;
  margin-left: 2px;
  vertical-align: middle;
}
#GHead .userinfoBlock .infoList .loading {
  position: absolute;
  left: 0px;
  top: 14px;
  background: url(../images/common/weather/loading-weather.gif) no-repeat;
  width: 120px;
  height: 18px;
  background-size: contain;
  display: none;
}
#GHead .userinfoBlock .infoList .prefcode{
  position: absolute;
  height: 38px;
  left: 0px;
  top: 0;
  opacity: 0;
  z-index: 100;
  display: block;
}
#GHead .userinfoBlock .infoList li.pref a {
  position: absolute;
  top: 14px;
  left: 0;
  display: block;
  margin-left: 0;
  padding-left: 22px;
  -webkit-background-size: 15px;
  background-size: 15px;
}

#GHead .userinfoBlock .infoList li.weather {
  margin-top: 0;
}
#GHead .userinfoBlock .infoList li img {
  height: 16px;
  margin-right: 0;
  vertical-align: middle;
}
#GHead .userinfoBlock .infoList li.weather img {
  height: 25px;
}
#GHead .userinfoBlock .amazonBtn {
  display: none;
}
#GHead .userinfoBlock .searchBtn {
  display: none;
}
#GNav2Detail {
  display: none;
}
/* .nav2Block
================================================*/
#GNav2 .nav2Block {
  display: none;
}
/* .gHeadIn2
================================================*/
#GHead .gHeadIn2 {
  display: none;
}
}




/* =========================================================
GNav2Detail
========================================================= */
#GNav2Detail {
  position: relative;
  left: 0;
  top: 0;
  z-index: 50;
  font-size: 10px;
  line-height: 1.2;
}
.ie8 .gHeadIn1 #GNav2Detail {
  left: 0 !important;
  border: none !important;
}
.ie8 .gHeadIn #GNav2Detail .bgWrap {
  border: none !important;
  left: 0 !important;
}
.ie8 .gHeadIn2 #GNav2Detail .bgWrap {
  border: none !important;
}
#GNav2Detail .bgWrap {
  position: absolute;
  left: 50%;
  top: 0;
  width: 100%;
  max-width: 1598px;
  height: 0;
  overflow: hidden;
  border: 6px solid  #000;
  border-width: 0 6px;
  background: #ffffff; /* Old browsers */
  background: -moz-linear-gradient(top, #ffffff 0%, #e4e4e4 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #e4e4e4)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #ffffff 0%, #e4e4e4 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #ffffff 0%, #e4e4e4 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #ffffff 0%, #e4e4e4 100%); /* IE10+ */
  background: linear-gradient(to bottom, #ffffff 0%, #e4e4e4 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e4e4e4', GradientType=0 ); /* IE6-9 */
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
}
#GNav2Detail .listWrap {
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  overflow: hidden;
}
#GNav2Detail .listWrap .navList {
  padding: 0 120px;
  box-sizing:border-box;
  width: 100%;
  min-height: 130px;
}
.ie8 #GNav2Detail .listWrap .navList,
.ie9 #GNav2Detail .listWrap .navList {
  padding: 0
}
#GNav2Detail .listWrap .navList li {
   position: relative;
 float: left;
  width: 100px;
  overflow: hidden;
  height: 130px;
  margin: -1px 0 0 -1px;
  padding: 0;
  border: solid #808080;
  border-width: 0 1px 1px;
  -webkit-transform: skewX(-27deg);
  -moz-transform: skewX(-27deg);
  -o-transform: skewX(-27deg);
  -ms-transform: skewX(-27deg);
  transform: skewX(-27deg);
}
#GNav2Detail .listWrap .navList li a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: #000;
  text-align: center;
  color: #000;
}
#GNav2Detail .listWrap .navList li a:hover {
  background-color: #000;
  color: #fff;
}
#GNav2Detail .listWrap .navList li span {
  position: relative;
  display: block;
  width: 100%;
  text-decoration: none;
  display: block;
  -webkit-transform: skewX(27deg);
  -moz-transform: skewX(27deg);
  -o-transform: skewX(27deg);
  -ms-transform: skewX(27deg);
  transform: skewX(27deg);
  padding: 86px 0 0 0px;
  text-align: left;
  background: no-repeat 8px 1px;
}
.ie8 #GNav2Detail .listWrap .navList li span,
.ie9 #GNav2Detail .listWrap .navList li span {
  padding-left: 20px;
}

#GNav2Detail .listWrap .navList li.new a:after,
#GNav2Detail .listWrap .navList li.wax a:after {
  position: absolute;
  top: -1px;
  left: -6px;
  display: block;
  width: 50px;
  height: 20px;
  content: '';
  background: no-repeat 0 0;
  -webkit-transform: skewX(27deg);
  -moz-transform: skewX(27deg);
  -o-transform: skewX(27deg);
  -ms-transform: skewX(27deg);
  transform: skewX(27deg);}
#GNav2Detail .listWrap .navList li.new a:after {
  background-image: url(../images/common/gnav2in-icon-new-pc.png);
}
#GNav2Detail .listWrap .navList li.wax a:after {
  background-image: url(../images/common/gnav2in-icon-wax-pc.png);
}
#GNav2Detail .listWrap .navList li.itemSearch {
  /*width: 201px;*/
}
#GNav2Detail .listWrap .navList li.itemSearch a {
  /*background-color: #000;*/
}
#GNav2Detail .listWrap .navList li.itemSearch span {
  /*height: 100%;*/
  /*padding: 0;*/
  /*margin-left: 8px;*/
  /*background-position: center center;*/
  /*background-image: url(../images/common/gnav2in-productsearch-pc.png);*/
  /*text-indent: -9999px;*/
}

/*新製品*/
#GNav2Detail .navNewproduct .navList .item01 span {
  background-image: url(../images/common/gnav2in-new-naturalbleachcolor-pc.png);
}
#GNav2Detail .navNewproduct .navList .item02 span {
  background-image: url(../images/common/gnav2in-new-facialpaper-pc.png);
}
#GNav2Detail .navNewproduct .navList .item03 span {
  background-image: url(../images/common/gnav2in-new-spotdeodrant-pc.png);
}
#GNav2Detail .navNewproduct .navList .item04 span {
  background-image: url(../images/common/gnav2in-new-energyfragrance-pc.png);
}
#GNav2Detail .navNewproduct .navList .item05 span {
  background-image: url(../images/common/gnav2in-bodycare-deodrantspray-pc.png);
}
#GNav2Detail .navNewproduct .navList .item06 span {
  background-image: url(../images/common/gnav2in-new-stylinggrease-pc.png);
}
#GNav2Detail .navNewproduct .navList .item07 span {
  background-image: url(../images/common/gnav2in-new-facialcleansing-pc.png);
}
#GNav2Detail .navNewproduct .navList .item08 span {
  background-image: url(../images/common/gnav2in-new-skinlotion-pc.png);
}
#GNav2Detail .navNewproduct .navList .item09 span {
  background-image: url(../images/common/gnav2in-new-smoothface-pc.png);
}
/*ヘアケア*/
#GNav2Detail .navHaircare .navList .item01 span {
  background-image: url(../images/common/gnav2in-haircare-haircare-pc.png);
}
/*ヘアカラー*/
#GNav2Detail .navHaircolor .navList .item01 span {
  background-image: url(../images/common/gnav2in-haircolor-naturalbleachcolor-pc.png);
}
#GNav2Detail .navHaircolor .navList .item02 span {
  background-image: url(../images/common/gnav2in-haircolor-hairbleach-pc.png);
}
#GNav2Detail .navHaircolor .navList .item03 span {
  background-image: url(../images/common/gnav2in-haircolor-haircolorremake-pc.png);
}
#GNav2Detail .navHaircolor .navList .itemSearch span {
  background-image: url(../images/common/gnav2in-haircolor-productsearch-pc.png);
}
/*ヘアスタイリング*/
#GNav2Detail .navHairstyling .navList .item01 span {
  background-image: url(../images/common/gnav2in-hairstyling-stylinggrease-pc.png);
}
#GNav2Detail .navHairstyling .navList .item02 span {
  background-image: url(../images/common/gnav2in-hairstyling-hairjam-pc.png);
}
#GNav2Detail .navHairstyling .navList .item03 span {
  background-image: url(../images/common/gnav2in-hairstyling-movingrubber-pc.png);
}
#GNav2Detail .navHairstyling .navList .item04 span {
  background-image: url(../images/common/gnav2in-hairstyling-hairstylingmist-pc.png);
}
#GNav2Detail .navHairstyling .navList .item05 span {
  background-image: url(../images/common/gnav2in-hairstyling-perfectholdwax-pc.png);
}
#GNav2Detail .navHairstyling .navList .item06 span {
  background-image: url(../images/common/gnav2in-hairstyling-hairwater-pc.png);
}
#GNav2Detail .navHairstyling .navList .item07 span {
  background-image: url(../images/common/gnav2in-hairstyling-hairspray-pc.png);
}
#GNav2Detail .navHairstyling .navList .item08 span {
  background-image: url(../images/common/gnav2in-hairstyling-hairfoam-pc.png);
}
#GNav2Detail .navHairstyling .navList .item09 span {
  background-image: url(../images/common/gnav2in-hairstyling-hairgel-pc.png);
}
#GNav2Detail .navHairstyling .navList .item10 span {
  background-image: url(../images/common/gnav2in-hairstyling-gbhairselftrimmingkit-pc.png);
}
#GNav2Detail .navHairstyling .navList .itemSearch span {
  background-image: url(../images/common/gnav2in-hairstyling-productsearch-pc.png);
}
/*フェイスケア*/
#GNav2Detail .navFacecare .navList .item01 span {
  background-image: url(../images/common/gnav2in-facecare-facialcleansing-pc.png);
}
#GNav2Detail .navFacecare .navList .item02 span {
  background-image: url(../images/common/gnav2in-facecare-skinlotion-pc.png);
}
#GNav2Detail .navFacecare .navList .item03 span {
  background-image: url(../images/common/gnav2in-facecare-skincream-pc.png);
}
#GNav2Detail .navFacecare .navList .item04 span {
  background-image: url(../images/common/gnav2in-facecare-facialcleansingpaper-pc.png);
}
#GNav2Detail .navFacecare .navList .item05 span {
  background-image: url(../images/common/gnav2in-facecare-oilclearpaper-pc.png);
}
#GNav2Detail .navFacecare .navList .item06 span {
  background-image: url(../images/common/gnav2in-facecare-others-pc.png);
}
#GNav2Detail .navFacecare .navList .item07 span {
  background-image: url(../images/common/gnav2in-facecare-smoothface-pc.png);
}
#GNav2Detail .navFacecare .navList .itemSearch span {
  background-image: url(../images/common/gnav2in-facecare-productsearch-pc.png);
}
/*シェービング*/
#GNav2Detail .navShaving .navList .item01 span {
  background-image: url(../images/common/gnav2in-shaving-wetshavingtype-pc.png);
}
#GNav2Detail .navShaving .navList .item02 span {
  background-image: url(../images/common/gnav2in-shaving-dryshavingtype-pc.png);
}
#GNav2Detail .navShaving .navList .item03 span {
  background-image: url(../images/common/gnav2in-shaving-aftershavingwater-pc.png);
}
/*ボディケア*/
#GNav2Detail .navBodycare .navList .item01 span {
  background-image: url(../images/common/gnav2in-bodycare-deodrantbodywater-pc.png);
}
#GNav2Detail .navBodycare .navList .item02 span {
  background-image: url(../images/common/gnav2in-bodycare-bodywater-pc.png);
}
#GNav2Detail .navBodycare .navList .item03 span {
  background-image: url(../images/common/gnav2in-bodycare-deodrantpaper-pc.png);
}
#GNav2Detail .navBodycare .navList .item04 span {
  background-image: url(../images/common/gnav2in-bodycare-bodypaper-pc.png);
}
#GNav2Detail .navBodycare .navList .item05 span {
  background-image: url(../images/common/gnav2in-bodycare-spotdeodrant-pc.png);
}
#GNav2Detail .navBodycare .navList .item06 span {
  background-image: url(../images/common/gnav2in-bodycare-deodrantspray-pc.png);
}
#GNav2Detail .navBodycare .navList .item07 span {
  background-image: url(../images/common/gnav2in-bodycare-others-pc.png);
}
#GNav2Detail .navBodycare .navList .itemSearch span {
  background-image: url(../images/common/gnav2in-bodycare-productsearch-pc.png);
}
/*フレグランス*/
#GNav2Detail .navFragrance .navList .item01 span {
  background-image: url(../images/common/gnav2in-fragrance-lightcologne-pc.png);
}
#GNav2Detail .navFragrance .navList .item02 span {
  background-image: url(../images/common/gnav2in-fragrance-energyfragrance-pc.png);
}
#GNav2Detail .navFragrance .navList .item03 span {
  background-image: url(../images/common/gnav2in-fragrance-hairbodyfragrance-pc.png);
}
/*その他*/
#GNav2Detail .navOthers .navList .item01 span {
  background-image: url(../images/common/gnav2in-others-weardeodrant-pc.png);
}
#GNav2Detail .navOthers .navList .item02 span {
  background-image: url(../images/common/gnav2in-others-headfreezer-pc.png);
}
@media screen and (max-width: 768px) {
#GNav2Detail{
	display: none;
}
}


/* =========================================================
GSpNav
========================================================= */
#GSpNav {
	display: none;
}
@media screen and (max-width: 768px) {

#GSpNav {
  /*position: absolute;*/
  top: 0;
  left: 0;
  z-index: 9;
  display: block;
  width: 100%;
}

#GSpNav .bg {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 0;
  display: none;
  width: 200%;
  height: 200%;
  background-color: #000;
  opacity: 0;
  -webkit-transform-origin: 0% 0%;
  -moz-transform-origin: 0% 0%;
  -ms-transform-origin: 0% 0%;
  -o-transform-origin: 0% 0%;
  transform-origin: 0% 0%;
}

#GSpNav .boxMain {
  position: relative;
  z-index: 100;
  display: none;
  width: 100%;
}
#GSpNav .boxMain.open{
  /*position: absolute;	*/
}
#GSpNav .spnavList {
  z-index: 2;
  /*padding-bottom: 1px;*/
  border: 1px solid #fff;
  border-width: 1px 0 1px;
  /*background: #fff;*/
}
#GSpNav .spnavList > li {
  position: relative;
  z-index: 300;
}
#GSpNav .spnavList > li > a {
  position: relative;
  display: block;
  height: 59px;
  border-bottom: 1px solid #fff;
  text-indent: -9999px;
  background: #000 no-repeat 0 0;
  -webkit-background-size: 250px 59px;
  background-size: 250px 59px;
}
#GSpNav .spnavList > li:last-child > a {
  border-bottom: 0;
}
#GSpNav .spnavList > li > a:before {
  position: absolute;
  top: 0;
  right: 50px;
  display: block;
  width: 19px;
  height: 59px;
  content: '';
  border-right: 1px solid #fff;
  background: #000 url(../images/common/icon-navlist-arrow-sp.png) no-repeat 0 50%;
  -webkit-background-size: 10px 15px;
  background-size: 10px 15px;
}
#GSpNav .spnavList > li > a > .btn {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 50px;
  height: 59px;
  content: '';
  background: url(../images/common/icon-navlist-state-sp.png) no-repeat 0 0;
  -webkit-background-size: 50px auto;
  background-size: 50px auto;
}
#GSpNav .spnavList > li > a.open > .btn {
  background-position: 0 bottom;
}
#GSpNav .spnavList > li.noChild > a:before {
  right: 10px;
  border-right: 1px solid #000;
}
#GSpNav .spnavList > li.noChild > a:after {
  display: none;
}
#GSpNav .spnavList > li.noArrow > a:before {
  display: none;
}
#GSpNav ul {
 /*
  -webkit-transition: height 100ms ease-in-out;
  -o-transition: height 100ms ease-in-out;
  transition: height 100ms ease-in-out;
  */
}
#GSpNav .spnavList .innerList1 {
  margin-bottom: 1px;
  display: none;
  overflow: hidden;
}
#GSpNav .spnavList .innerList1 > li {
  position: relative;
  z-index: 200;
}
#GSpNav .spnavList .innerList1 > li > a {
  position: relative;
  display: block;
  height: 59px;
  border-bottom: 1px solid #fff;
  text-indent: -9999px;
  background: no-repeat 0 0 #727171;
  -webkit-background-size: 250px 59px;
  background-size: 250px 59px;
}
#GSpNav .spnavList .innerList1 > li > a:before {
  position: absolute;
  top: 0;
  right: 50px;
  display: block;
  width: 20px;
  height: 59px;
  content: '';
  background: url(../images/common/icon-innerlist1-arrow-sp.png) no-repeat 0 0;
  -webkit-background-size: 20px 59px;
  background-size: 20px 59px;
}
#GSpNav .spnavList .innerList1 > li > a > .btn {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 50px;
  height: 59px;
  content: '';
  background: url(../images/common/icon-innerlist1-state-sp.png) no-repeat 0 0;
  -webkit-background-size: 50px auto;
  background-size: 50px auto;
}
#GSpNav .spnavList .innerList1 > li > a.open > .btn {
  background-position: 0 bottom;
}
#GSpNav .spnavList .innerList2 {
  position: relative;
  z-index: 100;
  margin-bottom: 1px;
  display: none;
  -webkit-transition: 0ms linear;
  -o-transition: 0ms linear;
  transition: 0ms linear;
  overflow: hidden;
}
#GSpNav .spnavList .innerList2 li a {
  position: relative;
  display: block;
  height: 49px;
  text-indent: -9999px;
  border-top: 1px solid #000;
  background: no-repeat 0 0 #fff;
  -webkit-background-size: 250px 49px;
  background-size: 250px 49px;
}
#GSpNav .spnavList .innerList2 li:first-child a {
  border-top: none;
}
#GSpNav .spnavList .innerList2 li a:before {
  position: absolute;
  top: 0;
  right: 40px;
  display: block;
  width: 30px;
  height: 49px;
  content: '';
  background: no-repeat 0 0;
  -webkit-background-size: 30px 49px;
  background-size: 30px 49px;
}
#GSpNav .spnavList .innerList2 .itemSearch a:before {
  width: 38px;
  -webkit-background-size: 38px 49px;
  background-size: 38px 49px;
}
#GSpNav .spnavList .innerList1 .innerList2 li.itemSearch a {
  background-image: url(../images/common/spgnav-product-productsearch-sp.png);
}
#GSpNav .spnavList .innerList2 li a:after {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 40px;
  height: 49px;
  content: '';
  background: #000 url(../images/common/icon-innerlist2-arrow-sp.png) no-repeat -2px 0;
  -webkit-background-size: 40px 49px;
  background-size: 40px 49px;
}
#GSpNav .spnavList .innerList2 li.new span:after,
#GSpNav .spnavList .innerList2 li.wax span:after {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 35px;
  height: 15px;
  content: '';
  background:no-repeat 0 0;
  -webkit-background-size: auto 15px;
  background-size: auto 15px;
}

#GSpNav .spnavList .innerList2 li.new span:after {
  background-image:url(../images/common/spgnav-icon-new-sp.png);   
}
#GSpNav .spnavList .innerList2 li.wax span:after {
  background-image:url(../images/common/spgnav-icon-wax-sp.png);   
}
/************ background setting ************/
    /* .navList
------------------------ */
#GSpNav .spnavList .navProduct a {
  background-image: url(../images/common/spgnav-product-sp.png);
}
#GSpNav .spnavList .navHowto a {
  background-image: url(../images/common/spgnav-howto-sp.png);
}
#GSpNav .spnavList .navGallery a {
  background-image: url(../images/common/spgnav-gallery-sp.png);
}
#GSpNav .spnavList .navAbout a {
  background-image: url(../images/common/spgnav-about-sp.png);
}
#GSpNav .spnavList .navSalon a {
  background-image: url(../images/common/spgnav-salon-sp.png);
}
#GSpNav .spnavList .navSpecial a {
  background-image: url(../images/common/spgnav-special-sp.png);
}
#GSpNav .spnavList .navSitemap a {
  background-image: url(../images/common/spgnav-sitemap-sp.png);
}
#GSpNav .spnavList .navGetyourstyle a {
  height: 90px;
  background-image: url(../images/common/spgnav-getyourstyle-sp.png);
  -webkit-background-size: 280px 40px;
  background-size: 280px 40px;
  background-position: 50%;
}
/* .innerList1
------------------------ */
#GSpNav .spnavList .navProduct .innerList1 .cat01 a {
  background-image: url(../images/common/spgnav-product-newproduct-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat02 a {
  background-image: url(../images/common/spgnav-product-haircare-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat03 a {
  background-image: url(../images/common/spgnav-product-haircolor-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 a {
  background-image: url(../images/common/spgnav-product-hairstyling-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat05 a {
  background-image: url(../images/common/spgnav-product-facecare-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat06 a {
  background-image: url(../images/common/spgnav-product-shaving-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat07 a {
  background-image: url(../images/common/spgnav-product-bodycare-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat08 a {
  background-image: url(../images/common/spgnav-product-fragrance-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat09 a {
  background-image: url(../images/common/spgnav-product-others-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat01 a {
  background-image: url(../images/common/spgnav-howto-haircolor-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat02 a {
  background-image: url(../images/common/spgnav-howto-hairstyling-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat03 a {
  background-image: url(../images/common/spgnav-howto-facecare-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat04 a {
  background-image: url(../images/common/spgnav-howto-bodycare-sp.png);
}
/* .innerList2 text
------------------------ */
/*新商品*/
#GSpNav .spnavList .navProduct .innerList1 .cat01 .innerList2 .item01 a {
  background-image: url(../images/common/spgnav-product-haircolor-naturalbleachcolor-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat01 .innerList2 .item02 a {
  background-image: url(../images/common/spgnav-product-bodycare-shielddeodrant-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat01 .innerList2 .item03 a {
  background-image: url(../images/common/spgnav-product-bodycare-deodrantspray-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat01 .innerList2 .item04 a {
  background-image: url(../images/common/spgnav-product-bodycare-deodrantbodypaper-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat01 .innerList2 .item05 a {
  background-image: url(../images/common/spgnav-product-haircolor-naturalbleachcolor-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat01 .innerList2 .item06 a {
  background-image: url(../images/common/spgnav-product-facecare-facialpaper-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat01 .innerList2 .item07 a {
  background-image: url(../images/common/spgnav-product-bodycare-spotdeodorant-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat01 .innerList2 .item08 a {
  background-image: url(../images/common/spgnav-product-bodycare-deodrantspray-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat01 .innerList2 .item09 a {
  background-image: url(../images/common/spgnav-product-fragrance-energyfragrance-sp.png);
}

#GSpNav .spnavList .navProduct .innerList1 .cat02 .innerList2 .item01 a {
  background-image: url(../images/common/spgnav-product-haircare-haircare-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat03 .innerList2 .item01 a {
  background-image: url(../images/common/spgnav-product-haircolor-naturalbleachcolor-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat03 .innerList2 .item02 a {
  background-image: url(../images/common/spgnav-product-haircolor-hairbleach-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat03 .innerList2 .item03 a {
  background-image: url(../images/common/spgnav-product-haircolor-haircolorremake-sp.png);
}

#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item01 a {
  background-image: url(../images/common/spgnav-product-hairstyling-stylinggrease-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item02 a {
  background-image: url(../images/common/spgnav-product-hairstyling-hairjam-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item03 a {
  background-image: url(../images/common/spgnav-product-hairstyling-movingrubber-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item04 a {
  background-image: url(../images/common/spgnav-product-hairstyling-hairstylingmist-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item05 a {
  background-image: url(../images/common/spgnav-product-hairstyling-perfectholdwax-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item06 a {
  background-image: url(../images/common/spgnav-product-hairstyling-hairwater-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item07 a {
  background-image: url(../images/common/spgnav-product-hairstyling-hairspray-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item08 a {
  background-image: url(../images/common/spgnav-product-hairstyling-hairfoam-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item09 a {
  background-image: url(../images/common/spgnav-product-hairstyling-hairgel-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item10 a {
  background-image: url(../images/common/spgnav-product-hairstyling-gbhairselftrimmingkit-sp.png);
}

#GSpNav .spnavList .navProduct .innerList1 .cat05 .innerList2 .item01 a {
  background-image: url(../images/common/spgnav-product-facecare-facialcleansing-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat05 .innerList2 .item02 a {
  background-image: url(../images/common/spgnav-product-facecare-skinlotion-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat05 .innerList2 .item03 a {
  background-image: url(../images/common/spgnav-product-facecare-skincream-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat05 .innerList2 .item04 a {
  background-image: url(../images/common/spgnav-product-facecare-oilclearpaper-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat05 .innerList2 .item05 a {
  background-image: url(../images/common/spgnav-product-facecare-facialcleansingpaper-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat05 .innerList2 .item06 a {
  background-image: url(../images/common/spgnav-product-facecare-others-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat05 .innerList2 .item07 a {
  background-image: url(../images/common/spgnav-product-facecare-smoothface-sp.png);
}

#GSpNav .spnavList .navProduct .innerList1 .cat06 .innerList2 .item01 a {
  background-image: url(../images/common/spgnav-product-shaving-wetshavingtype-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat06 .innerList2 .item02 a {
  background-image: url(../images/common/spgnav-product-shaving-dryshavingtype-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat06 .innerList2 .item03 a {
  background-image: url(../images/common/spgnav-product-shaving-aftershavingwater-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat07 .innerList2 .item01 a {
  background-image: url(../images/common/spgnav-product-bodycare-deodrantbodywater-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat07 .innerList2 .item02 a {
  background-image: url(../images/common/spgnav-product-bodycare-bodywater-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat07 .innerList2 .item03 a {
  background-image: url(../images/common/spgnav-product-bodycare-deodrantbodypaper-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat07 .innerList2 .item04 a {
  background-image: url(../images/common/spgnav-product-bodycare-bodypaper-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat07 .innerList2 .item05 a {
  background-image: url(../images/common/spgnav-product-bodycare-spotdeodorant-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat07 .innerList2 .item06 a {
  background-image: url(../images/common/spgnav-product-bodycare-deodrantspray-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat07 .innerList2 .item07 a {
  background-image: url(../images/common/spgnav-product-bodycare-others-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat08 .innerList2 .item01 a {
  background-image: url(../images/common/spgnav-product-fragrance-lightcologne-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat08 .innerList2 .item02 a {
  background-image: url(../images/common/spgnav-product-fragrance-hairbodyfragrance-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat08 .innerList2 .item03 a {
  background-image: url(../images/common/spgnav-product-fragrance-energyfragrance-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat09 .innerList2 .item01 a {
  background-image: url(../images/common/spgnav-product-others-weardeodrant-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat09 .innerList2 .item02 a {
  background-image: url(../images/common/spgnav-product-others-headfreezer-sp.png);
}

#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item01 a {
  background-image: url(../images/common/spgnav-howto-hairstyling-stylinggrease-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item02 a {
  background-image: url(../images/common/spgnav-howto-hairstyling-hairjam-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item03 a {
  background-image: url(../images/common/spgnav-howto-hairstyling-antilockspray-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item04 a {
  background-image: url(../images/common/spgnav-howto-hairstyling-movingrubber-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item05 a {
  background-image: url(../images/common/spgnav-howto-hairstyling-movinglockspray-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item06 a {
  background-image: url(../images/common/spgnav-product-hairstyling-hairstylingmist-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item07 a {
  background-image: url(../images/common/spgnav-howto-hairstyling-gbhairselftrimmingkit-sp.png);
}
	/*basic styling*/
	#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item08 a {
	  background-image: url(../images/common/spgnav-howto-hairstyling-basic-dryer-sp.png);
	}
	#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item09 a {
	  background-image: url(../images/common/spgnav-howto-hairstyling-basic-hairiron-sp.png);
	}
	

#GSpNav .spnavList .navHowto .innerList1 .cat03 .innerList2 .item01 a {
  background-image: url(../images/common/spgnav-howto-facecare-facecare-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat03 .innerList2 .item02 a {
  background-image: url(../images/common/spgnav-howto-facecare-gbeyebrowkit-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat03 .innerList2 .item03 a {
  background-image: url(../images/common/spgnav-howto-facecare-smoothface-sp.png);
}

#GSpNav .spnavList .navHowto .innerList1 .cat01 .innerList2 .item01 a {
  background-image: url(../images/common/spgnav-howto-haircolor-naturalbleachcolor-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat01 .innerList2 .item02 a {
  background-image: url(../images/common/spgnav-howto-haircolor-hairbleach-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat01 .innerList2 .item03 a {
  background-image: url(../images/common/spgnav-howto-haircolor-haircolorremake-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat04 .innerList2 .item01 a {
  background-image: url(../images/common/spgnav-howto-bodycare-gbbodyhairtrimmer-sp.png);
}
#GSpNav .spnavList .navGallery .innerList2 .item01 a {
  background-image: url(../images/common/spgnav-gallery-tvcm-sp.png);
}
#GSpNav .spnavList .navGallery .innerList2 .item02 a {
  background-image: url(../images/common/spgnav-gallery-webmovie-sp.png);
}
#GSpNav .spnavList .navGallery .innerList2 .item03 a {
  background-image: url(../images/common/spgnav-gallery-graphics-sp.png);
}
#GSpNav .spnavList .navGallery .innerList2 .item04 a {
  background-image: url(../images/common/spgnav-gallery-actprofile-sp.png);
}
#GSpNav .spnavList .navSpecial .innerList2 .item01 a {
  background-image: url(../images/common/spgnav-special-no1-sp.png);
}
#GSpNav .spnavList .navSpecial .innerList2 .item08 a {
  background-image: url(../images/common/spgnav-special-getyourstyle-sp.png);
  -webkit-background-size: 272px 49px;
  background-size: 272px 49px;
}
#GSpNav .spnavList .navSpecial .innerList2 .item09 a {
  background-image: url(../images/common/spgnav-special-seishunasebodypaper-sp.png);
  -webkit-background-size: 280px 49px;
  background-size: 280px 49px;
}
#GSpNav .spnavList .navSpecial .innerList2 .item10 a {
  background-image: url(../images/common/spgnav-special-pluska-sp.png);
  -webkit-background-size: 271px 49px;
  background-size: 271px 49px;
}
#GSpNav .spnavList .navSpecial .innerList2 .item02 a {
  background-image: url(../images/common/spgnav-special-otokonokamikore-sp.png);
}
#GSpNav .spnavList .navSpecial .innerList2 .item03 a {
  background-image: url(../images/common/spgnav-special-hairjamru-sp.png);
}
#GSpNav .spnavList .navSpecial .innerList2 .item04 a {
  background-image: url(../images/common/spgnav-special-gakuseicmtaisho-sp.png);
}
#GSpNav .spnavList .navSpecial .innerList2 .item05 a {
  background-image: url(../images/common/spgnav-special-dancecompetition-sp.png);
}
#GSpNav .spnavList .navSpecial .innerList2 .item06 a {
  background-image: url(../images/common/spgnav-special-paperkyodai-sp.png);
}
#GSpNav .spnavList .navSpecial .innerList2 .item07 a {
  background-image: url(../images/common/spgnav-special-unlimited-sp.png);
}
/* .innerList2 icon
------------------------ */
/*新商品*/
#GSpNav .spnavList .navProduct .innerList1 .cat01 .innerList2 .item01 a:before {
  background-image: url(../images/common/spgnav-product-newproduct-naturalbleachcolor-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat01 .innerList2 .item02 a:before {
  background-image: url(../images/common/spgnav-product-bodycare-shielddeodrant-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat01 .innerList2 .item03 a:before {
  background-image: url(../images/common/spgnav-product-newproduct-deodrantspray-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat01 .innerList2 .item04 a:before {
  background-image:url(../images/common/spgnav-product-newproduct-deodrantbodypaper-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat01 .innerList2 .item05 a:before {
  background-image:url(../images/common/spgnav-product-newproduct-naturalbleachcolor-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat01 .innerList2 .item06 a:before {
  background-image:url(../images/common/spgnav-product-newproduct-facialpaper-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat01 .innerList2 .item07 a:before {
  background-image:url(../images/common/spgnav-product-newproduct-spotdeodorant-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat01 .innerList2 .item08 a:before {
  background-image: url(../images/common/spgnav-product-bodycare-deodrantspray-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat01 .innerList2 .item09 a:before {
  background-image:url(../images/common/spgnav-product-newproduct-energyfragrance-icon-sp.png);
}

#GSpNav .spnavList .navProduct .innerList1 .cat02 .innerList2 .item01 a:before {
  background-image: url(../images/common/spgnav-product-haircare-haircare-icon-sp.png);
}

#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item01 a:before {
  background-image: url(../images/common/spgnav-product-hairstyling-stylinggrease-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item02 a:before {
  background-image: url(../images/common/spgnav-product-hairstyling-hairjam-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item03 a:before {
  background-image: url(../images/common/spgnav-product-hairstyling-movingrubber-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item04 a:before {
  background-image: url(../images/common/spgnav-product-hairstyling-hairstylingmist-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item05 a:before {
  background-image: url(../images/common/spgnav-product-hairstyling-perfectholdwax-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item06 a:before {
  background-image: url(../images/common/spgnav-product-hairstyling-hairwater-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item07 a:before {
  background-image: url(../images/common/spgnav-product-hairstyling-hairspray-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item08 a:before {
  background-image: url(../images/common/spgnav-product-hairstyling-hairfoam-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item09 a:before {
  background-image: url(../images/common/spgnav-product-hairstyling-hairgel-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .item10 a:before {
  background-image: url(../images/common/spgnav-product-hairstyling-gbhairselftrimmingkit-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat04 .innerList2 .itemSearch a:before {
  background-image: url(../images/common/spgnav-product-hairstyling-productsearch-icon-sp.png);
}

#GSpNav .spnavList .navProduct .innerList1 .cat03 .innerList2 .item01 a:before {
  background-image: url(../images/common/spgnav-product-haircolor-naturalbleachcolor-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat03 .innerList2 .item02 a:before {
  background-image: url(../images/common/spgnav-product-haircolor-hairbleach-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat03 .innerList2 .item03 a:before {
  background-image: url(../images/common/spgnav-product-haircolor-haircolorremake-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat03 .innerList2 .itemSearch a:before {
  background-image: url(../images/common/spgnav-product-haircolor-productsearch-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat07 .innerList2 .item01 a:before {
  background-image: url(../images/common/spgnav-product-bodycare-deodrantbodywater-icon-sp.png);
}

#GSpNav .spnavList .navProduct .innerList1 .cat07 .innerList2 .item02 a:before {
  background-image: url(../images/common/spgnav-product-bodycare-bodywater-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat07 .innerList2 .item03 a:before {
  background-image: url(../images/common/spgnav-product-bodycare-deodrantbodypaper-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat07 .innerList2 .item04 a:before {
  background-image: url(../images/common/spgnav-product-bodycare-bodypaper-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat07 .innerList2 .item05 a:before {
  background-image: url(../images/common/spgnav-product-bodycare-spotdeodorant-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat07 .innerList2 .item06 a:before {
  background-image: url(../images/common/spgnav-product-bodycare-deodrantspray-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat07 .innerList2 .item07 a:before {
  background-image: url(../images/common/spgnav-product-bodycare-others-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat07 .innerList2 .itemSearch a:before {
  background-image: url(../images/common/spgnav-product-bodycare-productsearch-icon-sp.png);
}

#GSpNav .spnavList .navProduct .innerList1 .cat05 .innerList2 .item01 a:before {
  background-image: url(../images/common/spgnav-product-facecare-facialcleansing-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat05 .innerList2 .item02 a:before {
  background-image: url(../images/common/spgnav-product-facecare-skinlotion-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat05 .innerList2 .item03 a:before {
  background-image: url(../images/common/spgnav-product-facecare-skincream-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat05 .innerList2 .item04 a:before {
  background-image: url(../images/common/spgnav-product-facecare-oilclearpaper-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat05 .innerList2 .item05 a:before {
  background-image: url(../images/common/spgnav-product-facecare-facialcleansingpaper-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat05 .innerList2 .itemSearch a:before {
  background-image: url(../images/common/spgnav-product-facecare-productsearch-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat05 .innerList2 .item06 a:before {
  background-image: url(../images/common/spgnav-product-facecare-others-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat05 .innerList2 .item07 a:before {
  background-image: url(../images/common/spgnav-product-facecare-smoothface-icon-sp.png);
}

#GSpNav .spnavList .navProduct .innerList1 .cat06 .innerList2 .item01 a:before {
  background-image: url(../images/common/spgnav-product-shaving-wetshavingtype-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat06 .innerList2 .item02 a:before {
  background-image: url(../images/common/spgnav-product-shaving-dryshavingtype-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat06 .innerList2 .item03 a:before {
  background-image: url(../images/common/spgnav-product-shaving-aftershavingwater-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat08 .innerList2 .item01 a:before {
  background-image: url(../images/common/spgnav-product-fragrance-lightcologne-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat08 .innerList2 .item02 a:before {
  background-image: url(../images/common/spgnav-product-fragrance-hairbodyfragrance-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat08 .innerList2 .item03 a:before {
  background-image: url(../images/common/spgnav-product-newproduct-energyfragrance-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat09 .innerList2 .item01 a:before {
  background-image: url(../images/common/spgnav-product-others-weardeodrant-icon-sp.png);
}
#GSpNav .spnavList .navProduct .innerList1 .cat09 .innerList2 .item02 a:before {
  background-image: url(../images/common/spgnav-product-others-headfreezer-icon-sp.png);
}

#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item01 a:before {
  background-image: url(../images/common/spgnav-howto-hairstyling-stylinggrease-icon-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item02 a:before {
  background-image: url(../images/common/spgnav-howto-hairstyling-hairjam-icon-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item03 a:before {
  background-image: url(../images/common/spgnav-howto-hairstyling-antilockspray-icon-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item04 a:before {
  background-image: url(../images/common/spgnav-howto-hairstyling-movingrubber-icon-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item05 a:before {
  background-image: url(../images/common/spgnav-howto-hairstyling-movinglockspray-icon-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item06 a:before {
  background-image: url(../images/common/spgnav-product-hairstyling-hairstylingmist-icon-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item07 a:before {
  background-image: url(../images/common/spgnav-howto-hairstyling-gbhairselftrimmingkit-icon-sp.png);
}
	/* basic styling */
	#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item08 a:before {
	  background-image: url(../images/common/spgnav-howto-hairstyling-basic-dryer-icon-sp.png);
	}
	#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item09 a:before {
	  background-image: url(../images/common/spgnav-howto-hairstyling-basic-hairiron-icon-sp.png);
	}
	/*ベーシックスタイル*/
	#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item08 a:before,
	#GSpNav .spnavList .navHowto .innerList1 .cat02 .innerList2 .item09 a:before {
	  width: 55px;
	  background-size: 55px 49px;
	}

#GSpNav .spnavList .navHowto .innerList1 .cat03 .innerList2 .item01 a:before {
  background-image: url(../images/common/spgnav-howto-facecare-facecare-icon-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat03 .innerList2 .item02 a:before {
  background-image: url(../images/common/spgnav-howto-facecare-gbeyebrowkit-icon-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat03 .innerList2 .item03 a:before {
  background-image: url(../images/common/spgnav-howto-facecare-smoothface-icon-sp.png);
}

#GSpNav .spnavList .navHowto .innerList1 .cat01 .innerList2 .item01 a:before {
  background-image: url(../images/common/spgnav-howto-haircolor-naturalbleachcolor-icon-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat01 .innerList2 .item02 a:before {
  background-image: url(../images/common/spgnav-howto-haircolor-hairbleach-icon-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat01 .innerList2 .item03 a:before {
  background-image: url(../images/common/spgnav-howto-haircolor-haircolorremake-icon-sp.png);
}
#GSpNav .spnavList .navHowto .innerList1 .cat04 .innerList2 .item01 a:before {
  background-image: url(../images/common/spgnav-howto-bodycare-gbbodyhairtrimmer-icon-sp.png);
}
/*
------------------- */
#GSpNav .searchBlock {
  position: relative;
  z-index: 300;
  display: block;
  padding: 25px 0 40px;
  border-bottom: 1px solid #fff;
  background: #000;
}
#GSpNav .searchBlock .blockTit {
  height: 20px;
  margin-bottom: 13px;
  margin-left: 8px;
  text-indent: -9999px;
  background: url(../images/common/title-search-sp.jpg) no-repeat 0 0;
  -webkit-background-size: auto 18px;
  background-size: auto 18px;
}
#GSpNav .searchBlock .blockMain {
  padding: 0 10px;
}
#GSpNav .searchBlock .blockMain .search {
  position: relative;
}
  /*#GSpNav .searchBlock .blockMain .search .inputTxt {
    font-size: 14px;
    line-height: 1;
    display: block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    height: 40px;
    padding: 0 66px 0 10px;
    vertical-align: middle;
    border: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
  }
  #GSpNav .searchBlock .blockMain .search .searchBtn {
    position: absolute;
    top: 0;
    right: 0;
    width: 56px;
    height: 100%;
    padding: 0;
    cursor: pointer;
    border: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    background: url(../images/common/btn-search-sp.jpg) no-repeat center center #727171;
    -webkit-background-size: auto 18px;
    background-size: auto 18px;
  }*/
#GSpNav .searchBlock .blockMain .search .gsib_a {
  padding-top: 0;
}
/*
------------------- */
#GSpNav .weatherBlock {
  position: relative;
  z-index: 300;
  border-bottom: 1px solid #fff;
  background: #000;
}
#GSpNav .weatherBlock .prefcode{
  width: 100%;
  height: 74px;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 100;
  opacity: 0;
}
#GSpNav .weatherBlock .blockTit {
}
#GSpNav .weatherBlock .blockTit a {
  position: relative;
  display: block;
  height: 74px;
  text-indent: -9999px;
  background: url(../images/common/spgnav-weather-sp.png) no-repeat 0 0;
  -webkit-background-size: auto 74px;
  background-size: auto 74px;
}
#GSpNav .weatherBlock .blockTit a:after {
  position: absolute;
  top: 50%;
  right: 12.5px;
  display: block;
  width: 25px;
  height: 25px;
  margin: -12.5px 0 0 0;
  content: '';
  background: url(../images/common/spgnav-weather-icon-sp.png) no-repeat 0 0;
  -webkit-background-size: auto 25px;
  background-size: auto 25px;
}
/*
------------------- */
#GSpNav .snsBlock {
  position: relative;
  z-index: 300;
  padding: 25px 0 50px;
  border-bottom: 1px solid #fff;
  background: #000;
}
#GSpNav .snsBlock .blockTit {
  height: 26px;
  margin-left: 8px;
  text-indent: -9999px;
  background: no-repeat 0 0;
  background-image: url(../images/common/title-sns-sp.png);
  -webkit-background-size: auto 18px;
  background-size: auto 18px;
}
#GSpNav .snsBlock .blockMain {
}
#GSpNav .snsBlock .blockMain .itemList {
  text-align: center;
}
#GSpNav .snsBlock .blockMain .itemList li {
  display: inline-block;
  margin: 0 8px 0;
}
#GSpNav .snsBlock .blockMain .itemList li a {
  height: 32px;
  text-indent: -9999px;
}
#GSpNav .snsBlock .blockMain .itemList li a span {
  display: block;
  height: 32px;
  background: no-repeat 0 0;
  -webkit-background-size: auto 32px;
  background-size: auto 32px;
}
#GSpNav .snsBlock .blockMain .itemList .itemInstagram span {
  width: 35px;
  background-image: url(../images/common/sns-instagram-sp.png);
}
#GSpNav .snsBlock .blockMain .itemList .itemYoutube span {
  width: 35px;
  background-image: url(../images/common/sns-youtube-sp.png);
}
#GSpNav .snsBlock .blockMain .itemList .itemFacebook span {
  width: 35px;
  background-image: url(../images/common/sns-facebook-sp.png);
}
#GSpNav .snsBlock .blockMain .itemList .itemTwitter span {
  width: 35px;
  background-image: url(../images/common/sns-twitter-sp.png);
}
#GSpNav .snsBlock .blockMain .itemList .itemVine span {
  width: 35px;
  background-image: url(../images/common/sns-vine-sp.png);
}
/*
------------------- */
#GSpNav .amazonBlock {
  position: relative;
  z-index: 300;
  display: block;
  padding: 20px 0;
  border-bottom: 1px solid #fff;
  background: #000;
}
#GSpNav .amazonBlock .amazonBtn {
}
#GSpNav .amazonBlock .amazonBtn a {
  display: block;
  width: 88px;
  height: 31px;
  margin: 0 auto;
  text-indent: -9999px;
  background: url(../images/common/btn-amazon-sp.jpg) no-repeat 0 0;
  -webkit-background-size: auto 31px;
  background-size: auto 31px;
}
/*
------------------- */
#GSpNav .copyBlock {
  position: relative;
  z-index: 300;
  padding: 20px 0;
  background: #000;
}
#GSpNav .copyBlock .copylead {
  font-size: 9px;
  text-align: center;
}

}



/* =========================================================
MapWrap
========================================================= */
#MapWrap {
  overflow: hidden;
  position: absolute;
  top: 109px;
  left: 50%;
  z-index: 500;
  width: 100%;
  max-width: 1598px;
  padding: 50px 0 112px;
  background-color: #000;
  visibility: hidden;
  -webkit-transition: 200ms ease-in-out;
  -moz-transition: 200ms ease-in-out;
  -o-transition: 200ms ease-in-out;
  -ms-transition: 200ms ease-in-out;
  transition: 200ms ease-in-out;
  -webkit-transform: translate(-50%, -30px);
  -moz-transform: translate(-50%, -30px);
  -o-transform: translate(-50%, -30px);
  -ms-transform: translate(-50%, -30px);
  transform: translate(-50%, -30px);
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  pointer-events: none;
}
#MapWrap:before,
#MapWrap:after {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background-repeat: repeat;
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -o-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
}
#MapWrap:before {
  background-image: url("../images/common/weather/map/bg-map1-pc.png");
  -webkit-transform: translate(355px, -697px);
  -moz-transform: translate(355px, -697px);
  -o-transform: translate(355px, -697px);
  -ms-transform: translate(355px, -697px);
  transform: translate(355px, -697px);
}
#MapWrap:after {
  background-image: url("../images/common/weather/map/bg-map2-pc.png");
  -webkit-transform: translateX(-100%);
  -moz-transform: translateX(-100%);
  -o-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  transform: translateX(-100%);
}
#MapWrap .imgMap{
	margin: 0 auto;
}
#MapWrap .titMap,
#MapWrap .imgMap,
#MapWrap .closeBtn {
  -webkit-transition: 200ms ease-in-out;
  -moz-transition: 200ms ease-in-out;
  -o-transition: 200ms ease-in-out;
  -ms-transition: 200ms ease-in-out;
  transition: 200ms ease-in-out;
  -webkit-transform: translate(14px, -30px);
  -moz-transform: translate(14px, -30px);
  -o-transform: translate(14px, -30px);
  -ms-transform: translate(14px, -30px);
  transform: translate(14px, -30px);
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
}
#MapWrap .mapIn {
  position: relative;
  z-index: 100;
  width: 95%;
  margin: 0 auto;
  padding: 60px 0 0;
}
#MapWrap .mapHead {
  position: relative;
  top: 0;
  left: 0;
  z-index: 200;
  width: 92.74%;
  margin: 0 auto;
}
#MapWrap .titMap {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 300px;
  height: 58px;
  background-image: url("../images/common/weather/map/title-selectpref-pc.png");
  background-repeat: no-repeat;
  text-indent: -9999px;
}
#MapWrap .closeBtn {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 18px;
  height: 32px;
  background-image: url("../images/common/weather/map/btn-close-pc.png");
  background-repeat: no-repeat;
  text-indent: -9999px;
}
#MapWrap .mapIn .tooltip {
  display: none;
  position: absolute;
}
#MapWrap .mapIn .imgMap area {
  outline: none !important;
}
#MapWrap.open {
  visibility: visible;
  -webkit-transition: 200ms ease-in-out;
  -moz-transition: 200ms ease-in-out;
  -o-transition: 200ms ease-in-out;
  -ms-transition: 200ms ease-in-out;
  transition: 200ms ease-in-out;
  -webkit-transform: translate(-50%, 0px);
  -moz-transform: translate(-50%, 0px);
  -o-transform: translate(-50%, 0px);
  -ms-transform: translate(-50%, 0px);
  transform: translate(-50%, 0px);
  opacity: 1;
  -ms-filter: none;
  filter: none;
  pointer-events: auto;
}
#MapWrap.open:before,
#MapWrap.open:after {
  -webkit-transition: 200ms ease-in-out;
  -moz-transition: 200ms ease-in-out;
  -o-transition: 200ms ease-in-out;
  -ms-transition: 200ms ease-in-out;
  transition: 200ms ease-in-out;
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -o-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
}
#MapWrap.open:before {
  -webkit-transition-delay: 300ms;
  -moz-transition-delay: 300ms;
  -o-transition-delay: 300ms;
  -ms-transition-delay: 300ms;
  transition-delay: 300ms;
}
#MapWrap.open .titMap,
#MapWrap.open .imgMap,
#MapWrap.open .closeBtn {
  -webkit-transition: 200ms ease-in-out;
  -moz-transition: 200ms ease-in-out;
  -o-transition: 200ms ease-in-out;
  -ms-transition: 200ms ease-in-out;
  transition: 200ms ease-in-out;
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -o-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  opacity: 1;
  -ms-filter: none;
  filter: none;
}
#MapWrap.open .titMap {
  -webkit-transition-delay: 100ms;
  -moz-transition-delay: 100ms;
  -o-transition-delay: 100ms;
  -ms-transition-delay: 100ms;
  transition-delay: 100ms;
}
#MapWrap.open .imgMap {
  margin: 0 auto;
  -webkit-transition-delay: 200ms;
  -moz-transition-delay: 200ms;
  -o-transition-delay: 200ms;
  -ms-transition-delay: 200ms;
  transition-delay: 200ms;
}
#MapWrap.loading img,
#MapWrap.loading canvas,
#MapWrap.loading area {
  display: none;
}
.gHeadIn2 #MapWrap {
  top: 50px;
}
@-moz-keyframes loading {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -150px 0;
  }
}
@-webkit-keyframes loading {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -150px 0;
  }
}
@-o-keyframes loading {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -150px 0;
  }
}
@keyframes loading {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -150px 0;
  }
}

@-moz-keyframes loading2 {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -252px 0;
  }
}
@-webkit-keyframes loading2 {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -252px 0;
  }
}
@-o-keyframes loading2 {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -252px 0;
  }
}
@keyframes loading2 {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -252px 0;
  }
}

@-moz-keyframes loadingSP {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -90px 0;
  }
}
@-webkit-keyframes loadingSP {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -90px 0;
  }
}
@-o-keyframes loadingSP {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -90px 0;
  }
}
@keyframes loadingSP {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -90px 0;
  }
}

@media screen and (max-width: 979px) and (min-width: 769px) {
#MapWrap {
	top: 141px;
}
}


/* =========================================================
Contents
========================================================= */

#Contents {
  position: relative;
  z-index: 0;
  overflow: hidden;
  width: 100%;
  margin: 0 auto;
  background: #fff;
}
/* mainTit
===============================*/
.mainTit {
  height: 100px;
  text-indent: -9999px;
  color: #fff;
  background: no-repeat left center #000;
}
@media screen and (max-width: 768px) {
.mainTit {
  height: 75px;
  -webkit-background-size: auto 75px;
  background-size: auto 75px;
}
}

/* lineupList
===============================*/
.lineupList {
  width: 100.6%;
  margin-left: -.3%;
}
.lineupList li {
  position: relative;
  z-index: 0;
  float: left;
  overflow: hidden;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 33.33%;
  height: 0;
  margin-left: -1px;
  padding-top: 25%;
  border: solid #000;
  border-width: 0 0 4px 4px;
  background: no-repeat center top;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
}

/********************************************
  ↓LIST ITEM ANIMATION↓
********************************************/

.lineupList li a,
/*.lineupList li a:after,*/
.lineupList li a:before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  text-indent: -9999px;
  background: no-repeat center top;
  -webkit-background-size: auto 200%;
  background-size: auto 200%;
}
.lineupList li a {
  z-index: 10;
}

.lineupList li a span {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  background: no-repeat center top;
  -webkit-background-size: auto 200%;
  background-size: auto 200%;
}

.lineupList li.searchItemCs a span {
  -webkit-background-size: auto 100%;
  background-size: auto 100%;
}

.lineupList li a[href]:before/*,
.lineupList li a[href]:after*/ {
  content: "";
}
.lineupList li a[href]:before {
  opacity: 0;
  z-index: 0;
  width: 140%;
  background-color: #000;
  -webkit-transform: translateX(-80%) skewX(-27deg);
  -ms-transform: translateX(-80%) skewX(-27deg);
  -o-transform: translateX(-80%) skewX(-27deg);
  transform: translateX(-80%) skewX(-27deg);
  -webkit-transform-origin: 0% 0%;
  -moz-transform-origin: 0% 0%;
  -ms-transform-origin: 0% 0%;
  -o-transform-origin: 0% 0%;
  transform-origin: 0% 0%;
}
.lineupList li a[href].out span {
  background-position: 0 top;
}
.lineupList li a[href].enter span {
  background-position: 0 bottom;
}
.lineupList li a[href].out:before {
  -webkit-animation: listItemLeaving 500ms  cubic-bezier(0,1,.5,1);
  -o-animation: listItemLeaving 500ms  cubic-bezier(0,1,.5,1);
  animation: listItemLeaving 500ms  cubic-bezier(0,1,.5,1);
}
.lineupList li a[href].enter:before {
  opacity: 1;
  -webkit-transform: translateX(0%) skewX(-27deg);
  -ms-transform: translateX(0%) skewX(-27deg);
  -o-transform: translateX(0%) skewX(-27deg);
  transform: translateX(0%) skewX(-27deg);
  -webkit-animation: listItemEntering 500ms cubic-bezier(0,1,.5,1);
  -o-animation: listItemEntering 500ms cubic-bezier(0,1,.5,1);
  animation: listItemEntering 500ms cubic-bezier(0,1,.5,1);
  -webkit-transform-origin: 100% 0%;
  -moz-transform-origin: 100% 0%;
  -ms-transform-origin: 100% 0%;
  -o-transform-origin: 100% 0%;
  transform-origin: 100% 0%;
}

/*.lineupList li a:after {
  opacity: 0;
  background-position: 0% 100%;
  -webkit-transition: none;
  -o-transition: none;
  transition: none;
}*/
/*
.lineupList li a.enter:after {
  opacity: 1;
}
*/
@-webkit-keyframes listItemLeaving {
  0% {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translate3d(30%, 0, 0) skewX(-27deg);
    -ms-transform: translate3d(30%, 0, 0) skewX(-27deg);
    transform: translate3d(30%, 0, 0) skewX(-27deg);
  }
  100% {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translate3d(100%, 0, 0) skewX(-27deg);
    -ms-transform: translate3d(100%, 0, 0) skewX(-27deg);
    transform: translate3d(100%, 0, 0) skewX(-27deg);
  }
}

@keyframes listItemLeaving {
  0% {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translate3d(30%, 0, 0) skewX(-27deg);
    -ms-transform: translate3d(30%, 0, 0) skewX(-27deg);
    transform: translate3d(30%, 0, 0) skewX(-27deg);
  }
  100% {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translate3d(100%, 0, 0) skewX(-27deg);
    -ms-transform: translate3d(100%, 0, 0) skewX(-27deg);
    transform: translate3d(100%, 0, 0) skewX(-27deg);
  }
}

@-webkit-keyframes listItemEntering {
  0% {
    -webkit-transform: translate3d(-80%, 0, 0) skewX(-27deg);
    -ms-transform: translate3d(-80%, 0, 0) skewX(-27deg);
    transform: translate3d(-80%, 0, 0) skewX(-27deg);
  }

  100% {
    -webkit-transform: translateX(0%) skewX(-27deg);
    -ms-transform: translateX(0%) skewX(-27deg);
    transform: translateX(0%) skewX(-27deg);
  }
}

@keyframes listItemEntering {
  0% {
    -webkit-transform: translate3d(-80%, 0, 0) skewX(-27deg);
    -ms-transform: translate3d(-80%, 0, 0) skewX(-27deg);
    transform: translate3d(-80%, 0, 0) skewX(-27deg);
  }

  100% {
    -webkit-transform: translateX(0%) skewX(-27deg);
    -ms-transform: translateX(0%) skewX(-27deg);
    transform: translateX(0%) skewX(-27deg);
  }
}
/********************************************
  ↑LIST ITEM ANIMATION↑
********************************************/


.ie8 .lineupList li a {
  overflow: hidden;
  text-indent: 0;
  background: none;
}
.ie8 .lineupList li img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
}
.ie8 .lineupList li a:hover img {
  top: auto;
  bottom: 0;
}
/*.lineupList li a:hover {
  background-color: #000;
  background-position: center 100%;
}*/
.lineupList li:last-of-type {
  /*-webkit-box-shadow: 4px 0 0 #000;*/
  /*box-shadow: 4px 0 0 #000;*/
}
.lineupList li.tbItem {
  display: none;
}
.lineupList li.searchItem {
  /*background-color: #000;*/
}
.lineupList li.searchItem a {
  /*background-image: url(../images/product/list-productsearch-pc.jpg);*/
}
.lineupList li.searchItemCs a {
}
.lineupList li.backItem {
  display: none;
}
.lineupList li.backItem a {
  background-color: #000;
}
.lineupList li .icon {
  position: absolute;
  top: 0;
  left: 0;
  width: 69px;
  height: 21px;
  background: no-repeat 0 0;
  -webkit-background-size: auto 20px;
  background-size: auto 20px;
}
.lineupList li.new .icon {
  background-image: url(../images/common/list-icon-new.png);
}
.lineupList li.wax .icon {
  background-image: url(../images/common/list-icon-wax.png);
}
.lineupList li.tbItem {
  display: none;
}
.lineupList li.showAt3 {
  display: block;
}
@media screen and (max-width: 999px) and (min-width: 980px) {
.lineupList li .icon {
  -webkit-background-size: auto 18px;
  background-size: auto 18px;
}
}
@media screen and (max-width: 979px) and (min-width: 769px) {
.lineupList li {
  width: 50%;
  margin-left: -1px;
  padding-top: 37.4%;
}
.lineupList li.tbItem {
  display: none;
}
.lineupList li.showAt2 {
  display: block;
}
}
@media screen and (max-width: 768px) {
.lineupList {
  width: auto;
  margin-left: 0;
}
.lineupList li {
  float: none;
  width: auto;
  height: 75px;
  padding-top: 0;
  border-width: 0 0 2px;
}
.lineupList li:first-child {
}
.lineupList li.large {
    height: 98px;
}
.lineupList li a {
  top: 0;
  left: 0;
  display: block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  padding: 0 8px;
  background-position: 8px center;
  -webkit-background-size: auto 73px;
  background-size: auto 73px;
}
.lineupList li a:hover {
  background-color: transparent;
  background-position: 8px center;
}
.lineupList li a:before,
.lineupList li a:after {
  display: none;
}
.lineupList li .item,
.lineupList li .enter .item,
.lineupList li .out .item {
  display: block;
  height: 100%;
  background: no-repeat right center;
  -webkit-background-size: auto 73px;
  background-size: auto 73px;
}
.lineupList li.large {
    height: 98px;
}
.lineupList li.large a,
.lineupList li.large .item,
.lineupList li.large .enter .item,
.lineupList li.large .out .item {
  -webkit-background-size: auto 98px;
  background-size: auto 98px;
}
.lineupList li.searchItem {
  z-index: 1;
  margin-top: -2px;
  border: 0;
}
.lineupList li.searchItem a {
  z-index: 1;
  background-image: url(../images/product/list-productsearch-sp.jpg);
}
.lineupList li.searchItem .item {
  background-image: url(../images/product/list-productsearch-icon-sp.png);
  -webkit-background-size: auto 75px;
  background-size: auto 75px;
}

.lineupList li.noItem {
  display: none;
}
.lineupList li .icon {
  height: 16px;
  -webkit-background-size: auto 16px;
  background-size: auto 16px;
}
}
/* =========================================================
GFoot
========================================================= */
.fb_edge_widget_with_comment span.fb_edge_comment_widget {
    display: none !important;
}

#GFoot {
  position: relative;
  color: #fff;
  background: #000;
  margin-top: 100px;
}
#GFoot a {
  color: #fff;
}
#GFoot .maxWrap {
  position: relative;
  max-width: 980px;
  margin: 0 auto;
  padding: 25px 0;
}
#GFoot .pathBlock {
  position: relative;
  min-height: 40px;
  background: #4d4d4d;
}
#GFoot .pathBlock .pagetop {
  position: absolute;
  top: 0;
  right: 40px;
}
#GFoot .pathBlock .pagetop a {
  display: block;
  width: 40px;
  height: 40px;
  text-indent: -9999px;
  background: url(../images/common/btn-pagetop-pc.png) no-repeat 0 0;
}
#GFoot .pathBlock .pagetop a:hover {
  background-position: 0 -40px;
}
#GFoot .pathBlock .topicPath {
  padding-left: 20px;
}
#GFoot .pathBlock .topicPath li {
  line-height: 40px;
  float: left;
  height: 40px;
  padding-left: 30px;
  vertical-align: middle;
  background: url(../images/common/icon-topicpath-pc.png) no-repeat 0 center;
  font-size: 12px;
  letter-spacing: 0.1em; 
}
#GFoot .pathBlock .topicPath li.current {
  padding-left: 34px;
}
#GFoot .pathBlock .topicPath li:first-child {
  padding-left: 0;
  background: none;
}
#GFoot .pathBlock .topicPath li a {
  display: block;
  padding-right: 15px;
  text-decoration: none;
  ;
}
#GFoot .pathBlock .topicPath li a:hover {
  color: #808080;
}
#GFoot .infoBlock {
  position: relative;
  margin-bottom: 17px;
}
#GFoot .infoBlock .blockTit.typeSp {
  display: none;
}
#GFoot .infoBlock .blockTit.typeSpMap {
  display: none;
}
#GFoot .infoBlock .blockTit a {
  display: block;
  float: right;
  width: 78px;
  height: 14px;
  margin: 0 20px 0 auto;
  padding: 0 6px;
  text-indent: -9999px;
  background: url(../images/common/btn-langnav-pc.png) no-repeat center 0;
}
#GFoot .infoBlock .blockTit a:hover {
  background-position: center -14px;
}
#GFoot .infoBlock .typePcMap a {
  display: block;
  width: 78px;
  height: 14px;
  margin: 0 0 0 auto;
  padding: 0 6px;
  text-indent: -9999px;
  background: url(../images/common/btn-sitemap-pc.png) no-repeat center 0;
}
#GFoot .infoBlock .langList {
  position: absolute;
  right: 0;
  bottom: 39px;
  display: none;
  width: 90px;
  background: #000;
}
#GFoot .infoBlock .langList li a {
  position: relative;
  display: block;
  height: 20px;
  text-indent: -9999px;
  background-color: #000;
  ;
}
#GFoot .infoBlock .langList li a:hover {
  background-color: #fff;
}
#GFoot .infoBlock .langList li a:after {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 72px;
  height: 10px;
  margin: -5px 0 0 -36px;
  content: '';
  text-indent: -9999px;
  background: no-repeat 0 0;
}
#GFoot .infoBlock .langList li a:hover:after {
  background-position: 0 -10px;
}
#GFoot .infoBlock .langList .langGlobal a:after {
  background-image: url(../images/common/langnav-global-pc.png);
}
#GFoot .infoBlock .langList .langChina a:after {
  background-image: url(../images/common/langnav-china-pc.png);
}
#GFoot .infoBlock .langList .langHongkong a:after {
  background-image: url(../images/common/langnav-hongkong-pc.png);
}
#GFoot .infoBlock .langList .langIndia a:after {
  background-image: url(../images/common/langnav-india-pc.png);
}
#GFoot .infoBlock .langList .langIndonesia a:after {
  background-image: url(../images/common/langnav-indonesia-pc.png);
}
#GFoot .infoBlock .langList .langKorea a:after {
  background-image: url(../images/common/langnav-korea-pc.png);
}
#GFoot .infoBlock .langList .langMalaysia a:after {
  background-image: url(../images/common/langnav-malaysia-pc.png);
}
#GFoot .infoBlock .langList .langPhilippines a:after {
  background-image: url(../images/common/langnav-philippines-pc.png);
}
#GFoot .infoBlock .langList .langSingapore a:after {
  background-image: url(../images/common/langnav-singapore-pc.png);
}
#GFoot .infoBlock .langList .langTaiwan a:after {
  background-image: url(../images/common/langnav-taiwan-pc.png);
}
#GFoot .infoBlock .langList .langThailand a:after {
  background-image: url(../images/common/langnav-thailand-pc.png);
}
#GFoot .infoBlock .langList .langUsa a:after {
  background-image: url(../images/common/langnav-usa-pc.png);
}

#GFoot .fnavBlock .logo {
  float: left;
  width: 60px;
  height: 56px;
  margin-top: -27px;
  text-indent: -9999px;
  background: url(../images/common/foot-logo.png) no-repeat 0 0;
  -webkit-background-size: 60px auto;
  background-size: 60px auto;
}
.ie8 #GFoot .fnavBlock .logo {
  width: 74px;
}
#GFoot .fnavBlock .fnavBox{
  width: 92.5%;
  margin: 0 0 0 auto;
}
#GFoot .fnavBlock .fnavList {
  line-height: 1.8;
  float: right;
  margin-bottom: 10px;
  text-align: right;
}

#GFoot .fnavBlock .fnavList li {
  font-size: 10px;
  display: inline-block;
  margin-left: 21px;
}
#GFoot .fnavBlock .fnavList li.navHead {
  margin-left: 0;
}
#GFoot .fnavBlock .fnavList li:first-child {
  margin-left: 0;
}
#GFoot .fnavBlock .fnavList li a {
  text-decoration: none;
}
#GFoot .fnavBlock .fnavList li a:hover {
  color: #808080;
}
#GFoot .fnavBlock .fnavList li.fnavListGlobal {
  display: none;
}
#GFoot .copyBlock .snsList {
  position: absolute;
  top: 22px;
  right: 240px;
}
#GFoot .copyBlock .snsList li {
  line-height: 1;
  float: left;
  margin-left: 20px;
}
#GFoot .copyBlock .snsList li iframe,
#GFoot .copyBlock .snsList li img {
  vertical-align: middle;
}
#GFoot .copyBlock .snsList .line {
  display: none;
}
#GFoot .copyBlock .copylead {
  height: 14px;
  text-align: center;
  /* text-indent: -9999px; */
  /* background: url(../images/common/foot-copylead-pc.png) no-repeat center 0; */
  font-size: 10px;
}
#GFoot .copyBlock .copyright {
  height: 14px;
  text-align: center;
  /* text-indent: -9999px; */
  /* background: url(../images/common/foot-copyright-pc.png) no-repeat center 0; */
  margin-bottom: 15px;
  font-size: 10px;
}
@media screen and (max-width: 979px) and (min-width: 769px) {
#GFoot .fnavBlock .logo {
  margin-top: 0;
  margin-right: 20px;
}
#GFoot .fnavBlock {
  width: 550px;
  margin: 0 auto;
  padding-left: 20px;
}
#GFoot .fnavBlock .fnavBox{
  width: 100%;
}
#GFoot .fnavBlock .fnavList {
  width: 85%;
  text-align: left;
}
#GFoot .fnavBlock .fnavList li {
  margin-left: 18px;
}
#GFoot .fnavBlock .fnavList li.navHead {
  margin-left: 0;
}
}
@media screen and (max-width: 768px) {
#GFoot {
  margin-top: 50px;
}
#GFoot .maxWrap {
  z-index: 0;
  padding: 0 0 25px;
}
#GFoot .pathBlock {
  z-index: 1;
  min-height: inherit;
  background: transparent;
  display: block;
}
#GFoot .pathBlock .pagetop {
  top: 0;
  right: 0;
  border-left: 1px solid #fff;
}
#GFoot .pathBlock .pagetop a {
  background-image: url(../images/common/btn-pagetop-sp.png);
  -webkit-background-size: 40px auto;
  background-size: 40px auto;
}
#GFoot .pathBlock .pagetop a:hover {
  background-position: 0 0;
}
#GFoot .pathBlock .topicPath {
  display: none;
}
#GFoot .infoBlock {
  height: 40px;
  margin-bottom: 0;
}
#GFoot .infoBlock .blockTit {
  margin-right: 42px;
  text-align: center;
}

#GFoot .infoBlock .blockTit.typeSp {
  display: block;
}
#GFoot .infoBlock .blockTit.typeSpMap {
  display: block;
}
#GFoot .infoBlock .splocalNavSelect {
  font-size: 13px;
  display: none;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 44px;
  padding: 0 50px 0 10px;
  text-indent: .01px;
  text-overflow: '';
  color: #666;
  border-top: 2px solid #000;
  background: url(../images/common/btn-selectbox-sp.png) no-repeat right center #fff;
  -webkit-background-size: 40px auto;
  background-size: 40px auto;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-border-radius: 0;
  border-radius: 0;
}
#GFoot .infoBlock .blockTit.typePc,
#GFoot .infoBlock .blockTit.typePcMap {
  display: none;
}
#GFoot .infoBlock .blockTit a {
  width: auto;
  height: 40px;
  margin: 0 auto;
  padding: 0 6px;
  background: url(../images/common/btn-langnav-sp.png) no-repeat center center;
  -webkit-background-size: auto 12px;
  background-size: auto 12px;
}
#GFoot .infoBlock .blockTit a:hover {
  background-position: center center;
}
#GFoot .infoBlock .typeSpMap a {
  clear: both;
  float: none;
  width: 68px;
  margin: 0 auto;
  background: url(../images/common/btn-sitemap-sp.png) no-repeat center center;
  -webkit-background-size: 68px 12px;
  background-size: 68px 12px;
}
#GFoot .infoBlock .langList {
  display: none;
}
#GFoot .fnavBlock {
  margin-bottom: 15px;
}
#GFoot .fnavBlock .logo {
  position: absolute;
  bottom: 15%;
  left: 50%;
  width: 37px;
  height: 28px;
  margin-top: 0;
  margin-left: -128px;
  -webkit-background-size: 37px auto;
  background-size: 37px auto;
}
#GFoot .fnavBlock .fnavBox {
  width: 100%;
  margin: 0 auto;
}
#GFoot .fnavBlock .fnavList {

   float: none;
  overflow: hidden;
  width: 100%;
  margin-bottom: 0;
  border-top: 1px solid #fff;
  border-bottom: 2px solid #fff;
}
#GFoot .fnavBlock .fnavList li {
  font-size: 12px;
  position: relative;
  display: block;
  float: left;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 50%;
  margin-left: 0;
  -webkit-transform: skewX(-27deg);
  -ms-transform: skewX(-27deg);
  -o-transform: skewX(-27deg);
  transform: skewX(-27deg);
  text-align: left;
}
#GFoot .fnavBlock .fnavList li.line1 {
  width: 100%;
}

#GFoot .fnavBlock .fnavList li.even {
  text-align: right;
  border-left: 1px solid #fff;
}
#GFoot .fnavBlock .fnavList li:first-child {
}
#GFoot .fnavBlock .fnavList li a,
#GFoot .fnavBlock .fnavList li span {
  display: block;
  padding: 9px 10px;
  -webkit-transform: skewX(27deg) translateX(0px);
  -ms-transform: skewX(27deg);
  -o-transform: skewX(27deg);
  transform: skewX(27deg);
  border-bottom: 1px solid #fff;
}
#GFoot .fnavBlock .fnavList li.last a,
#GFoot .fnavBlock .fnavList li.last span {
  border-bottom: 0;
}
#GFoot .fnavBlock .fnavList li.even a,
#GFoot .fnavBlock .fnavList li.even span {
  margin-left: -1px;
}
#GFoot .fnavBlock .fnavList li.fnavListGlobal {
  display: block;
}
#GFoot .fnavBlock .fnavList li.fnavListGlobal a {
  overflow: hidden;
  text-indent: -100%;
  background: url(../images/common/btn-langnav-sp.png) no-repeat center center;
  -webkit-background-size: auto 12px;
  background-size: auto 12px;
}
#GFoot .copyBlock {
  position: relative;
}
#GFoot .copyBlock .snsList {
  position: relative;
  top: auto;
  right: auto;
  clear: both;
  padding: 0 0 30px;
  text-align: center;
}
#GFoot .copyBlock .snsList li {
  display: inline-block;
  float: none;
  margin: 0 3px;
}
#GFoot .copyBlock .snsList li iframe,
 #GFoot .copyBlock .snsList li img {
  vertical-align: bottom;
}
#GFoot .copyBlock .snsList .tw {
}
#GFoot .copyBlock .snsList .fb {
}
#GFoot .copyBlock .snsList .line {
  display: inline-block;
}
#GFoot .copyBlock .copylead {
  margin: 20px 0;
  padding: 0 20px;
}
#GFoot .copyBlock .copyright {
  margin-left: 55px;
  margin-bottom: 0;
  -webkit-background-size: auto 12px;
  background-size: auto 12px;
}
}


#ModalWrap, #ModalWrap .bg {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2000;
  width: 100%;
  height: 100%;
}

#ModalWrap {
  display: none;
}

#ModalWrap.open {
  display: block;
}

#ModalWrap .modalHead {
  position: relative;
  height: 100px;
}

#ModalWrap .modalHead .modalTit {
  position: absolute;
  bottom: 12px;
  color: #fff;
  font-size: 16px;
}

#ModalWrap .modalContent {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2100;
  display: block;
  width: 768px;
  height: 532px;
  margin: -266px 0 0 -384px;
}

#ModalWrap .modalContent .youtube {
  width: 100%;
  height: 432px;
  background: #fff;
}

#ModalWrap .modalContent .closeBtn {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 18px;
  height: 32px;
  background-image: url(../images/common/modal/btn-close-pc.png);
  background-repeat: no-repeat;
  text-indent: -9999px;
}

#ModalWrap .bg {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  background: #000\9;
  background: rgba(0,0,0,.8);
  text-indent: -9999px;
}
