@charset "UTF-8";

#visual {
  min-width: auto;
  min-width: initial;
  position: relative;
}
#visual .inner {
  /*background: url('../images/bg_visual.jpg') no-repeat;
  background-position: center center;
  -webkit-background-size: cover;
  background-size: cover;*/
  min-width: 1280px;
  position: relative;
  width: 100%;
}
#visual .cover img {
  height: auto;
  width: 100%;
  position: absolute;
  margin: 0 auto;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
#visual > img {
  margin: auto;
  padding-right: 490px;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

#visual {
  overflow: hidden;
}
#visual .inner {
  background: url('../images/bg_visual-min.jpg') no-repeat center top;
  background-size: cover;
}
#visual .cover img {
  position: relative;
  visibility: hidden;
}

#products {
  background: #fff;
  padding: 75px 0;
}
#products h2 {
  margin-bottom: 60px;
}
#products h2 span {
  display: block;
  font-size: 13px;
  margin-top: 24px;
}

#products .wrap {
  overflow: hidden;
  padding: 0 80px;
}
#products .item {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  /*float: left;*/
  margin-bottom: 60px;
  text-align: center;
  width: 100%;
  margin: 0 auto 30px;
  position: relative;
}
#products .item .slick-list {
  overflow: visible;
}
#products .item ul li {
  float: left;
  margin: 0 15px 0;
  position: relative;
}
#products .item ul li.new a:before {
  content: '';
  display: block;
  background: url('../images/icon_new.png');
  background-size: contain;
  width: 55px;
  height: 55px;
  position: absolute;
  right: -10px;
  top: -10px;
  z-index: 10;
}
#products .item ul li img {
  opacity: .3;
  height: auto;
  width: 100%;
}
#products .item ul li.slick-active img {
  opacity: 1;
  height: auto;
  width: 100%;
}
#products .item ul li.slick-active a:hover img,
#products .item ul li.slick-active a:active img {
  opacity: .6;
}
#products .item ul button.slick-arrow {
  height: 54px;
  width: 54px;
  z-index: 10;
}
#products .item ul button.slick-prev {
  background: url('../images/arrow-prev.png') no-repeat left center;
  left: 9%;
}
#products .item ul button.slick-next {
  background: url('../images/arrow-next.png') no-repeat left center;
  right: 9%;
}
.slick-prev:before,
.slick-next:before {
  content: none;
}
#products .item dl {
  clear: both;
}
#products .item dl dt {
  font-family: "Arcon-Regular";
  font-size: 24px;
  margin: 0 auto 20px;
}
#products .item dl dt:before {
  background: url('../images/icon_home.png') no-repeat;
  content: '';
  display: inline-block;
  height: 19px;
  margin-right: 15px;
  width: 15px;
}
#products .item dl dd span {
  display: block;
  text-align: center;
}
#products .item dl dd span.copy {
  margin-bottom: 24px;
}
#products .item dl dd span.detail a {
  border: 1px solid #99938a;
  border-radius: 20px;
  display: inline-block;
  font-family: "Arcon-Regular";
  font-size: 14px;
  padding: 12px 0;
  width: 150px;
}
#products .item dl dd span.detail a:hover,
#products .item dl dd span.detail a:active {
  color: #000;
  border: 1px solid #000;
}
#products .item dl dd p {
  color: #99938a;
  display: inline-block;
  font-size: 13px;
  line-height: 1.7;
  margin-bottom: 26px;
  /*text-align: left;*/
}

#story {
  background: url('../images/bg_story.png') no-repeat center center;
  background-size: cover;
  color: #fff;
  padding: 100px 0;
  margin-bottom:100px;
}
#story h2 {
  margin-bottom: 16px;
}
#story h2:before {
  content: '';
  display: block;
  height: 49px;
  width: 41px;
  background: url('../images/icon_st_home.png') no-repeat left center;
  background-size: contain;
  margin: 0 auto 20px;
}
#story p {
  font-weight: bold;
  line-height: 2;
  margin-bottom: 50px;
  text-align: center;
}
#story span {
  display: block;
  text-align: center;
}
#story span a {
  border: 2px solid #fff;
  border-radius: 32px;
  color: #fff;
  display: inline-block;
  font-family: "Arcon-Regular";
  padding: 20px 36px;
}
#story span a:hover {
  background: #fff;
  color: #eaa9c5;
}
#story span.icon {
  margin-top: 50px;
}
#story span.icon img {
  display: inline-block;
  /*max-width: 362px;*/
}

#news {
  background: #fff;
  padding: 75px 0 0;
}
#news .inner {
  min-width: inherit;
  width: auto;
}
#news h2 {
  font-size: 32px;
  margin-bottom: 50px;
}
#news dl {
  margin: 0 auto;
  /*:max-width: 960px;　タイトル長いとき*/
  max-width: 380px;
}
#news dt {
  background: url('../images/arrow_next.png') no-repeat center right;
  float: left;
  font-size: 15px;
  line-height: 1.5;
/*  margin-right: 18px;*/
  width: 84px;
}
#news dd {
  margin-bottom: 18px;
  /*max-width: 860px;　タイトル長いとき*/
　max-width: 280px;
  padding-left: 96px;
}
#news dd:last-of-type {
  margin-bottom: 0;
}
#news dd a {
  font-size: 13px;
  line-height: 1.7;
  text-decoration: underline;
}
#news dl dd a:hover,
#news dl dd a:active {
  color: #000;
}

#goods {
  padding: 40px 0 80px;
}
#goods .inner {
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
#goods .banner a {
  display: block;
}
#goods .banner a:hover,
#goods .banner a:active {
  opacity: .5;
}
#goods .banner a img {
  height: auto;
  max-width: 100%;
}


#zscamp {
  padding: 50px 0 0;
}
#zscamp .inner {
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
#zscamp .banner a {
  display: block;
}
#zscamp .banner a:hover,
#zscamp .banner a:active {
  opacity: .5;
}
#zscamp .banner a img {
  height: auto;
  max-width: 100%;
}



@media screen and (max-width: 1280px){

    #visual img.only_pc {
      margin: auto;
      padding-right: 0;
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
    }

}



@media screen and (min-width: 960px) and (max-width: 1024px) {

    #products .item dl dd span.copy {
      line-height: 1.5;
    }

}



@media screen and (max-width: 960px){

    #visual {
      min-width: inherit;
    }
    #visual .inner {
      background-size: 100% auto;
      min-width: auto;
      min-width: initial;
      padding: 0;
    }
    #visual .cover img {
      position: relative;
    }
    #visual > img {
      position: absolute;
      margin: auto;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      padding: 0 16px;
    }
    #visual img {
      height: auto;
      width: 100%;
    }

    #products {
      padding: 35px 0;
    }
    #products .inner {
      padding: 0;
    }
    #products h2 {
      font-size: 33px;
      margin-bottom: 30px;
    }
    #products h2 span {
      margin-top: 12px;
    }
    #products .wrap {
      padding: 0;
    }
    #products .item {
      margin-bottom: 40px;
    }
    #products .item ul {
      padding-bottom: 20px;
    }
    #products .item ul li {
      margin: 0 7.5px 0;
    }
    #products .item ul li.new a:before {
      background: url('../images/icon_new.png');
      background-size: contain;
      width: 32px;
      height: 32px;
      top: -5px;
    }
    #products .item ul li img {
      opacity: 1;
    }
    #products .item ul button.slick-arrow {
      background-size: contain;
      height: 27px;
      width: 27px;

      border: 1px solid transparent;
      -webkit-box-sizing: content-box;
      box-sizing: content-box;
    }
    #products .item ul button.slick-next {
      border-width: 20px 40px 20px 0;
      right: 0;
    }
    #products .item ul button.slick-prev {
      border-width: 20px 0 20px 40px;
      left: 0;
    }
    #products .item dl dt {
      font-size: 23px;
      line-height: 1.2;
      margin: 0 auto 10px;
    }
    #products .item dl dt:before {
      margin-right: 10px;
    }
    #products .item dl dd span.copy {
      font-size: 10px;
      margin-bottom: 0;
      /*display: none;*/
    }
    #products .item dl dd span.detail a {
      font-size: 10px;
      padding: 6px 0;
      width: 100px;
    }
    #products .item dl dd p {
      display: none;
    }

    #story {
      padding: 40px 0;
	  margin-bottom:50px;
    }
    #story h2 {
      font-size: 33px;
      margin-bottom: 10px;
    }
    #story h2:before {
      height: 27px;
      width: 23px;
      margin: 0 auto 10px;
    }
    #story p {
      font-size: 13px;
      margin-bottom: 25px;
      text-align: left;
    }
    #story span a {
      border: 1px solid #fff;
      border-radius: 45px;
      font-size: 13px;
      padding: 15px 0;
      width: 140px;
    }
    #story span a:hover {
      background: #fff;
      color: #eaa9c5;
    }
    #story span.icon img {
      max-width: 100%;
    }

    #news {
      padding: 35px 0 0;
    }
    #news h2 {
      font-size: 24px;
      margin-bottom: 25px;
    }
    #news dt {
      background: none;
      float: none;
      font-size: 13px;
      line-height: 1;
      margin: 0 0 15px 0;
      width: auto;
    }
    #news dd {
      background: url('../images/sp/arrow_next.png') no-repeat left 6px;
      background-size: 4px 8px;
      margin-bottom: 18px;
      max-width: inherit;
      padding-left: 12px;
    }
    #news dd a {
      line-height: 1.5;
    }

    #goods {
      padding: 35px 0 40px;
    }
}