@charset "UTF-8";
.l-container #feature {
  width: 990px;
  margin: 0 auto 70px;
  padding:0;
  text-align: center;
  background: #FFF;
}
.l-container #feature *,
.l-container #feature *::after,
.l-container #feature *::before {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.l-container #feature img {
  max-width: 100%;
  height: auto;
}
.l-container #feature a {
  display: block;
   transition: opacity 0.2s;
  &:hover {
      opacity: 0.7;
      text-decoration: none;
  } 
}


.l-container #feature .title {
  width:960px;
  height: 525px;
  position: relative;
  background-image: url("../img/title_bg.png");
  background-size: contain;
  display: flex;
  justify-content:center;
  align-items:flex-end;
  padding: 0 0 24.2px;
  margin: 0 auto;
  
}

.l-container #feature .title-txt {
  width:728px;
  position: absoute;
}

.l-container #feature .style-block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width:877px;
  margin: 26.6px auto 0;
}
.l-container #feature .style-block .style {
  width: 410px;
  position: relative;
}
.l-container #feature .style-block .item-btn {
  z-index: 10;
  display: flex;
  align-items: flex-end;
  width:28px;
}

.l-container #feature .style-block .item-btn a{
  margin-bottom: -8px;
}

.l-container #feature .style-block .style .ttl {
  text-align: center;
  font: 700 22px/1 "Yu Gothic", "游ゴシック", "YuGothic", "游ゴシック体", sans-serif;
  color:#5C5C5B;
}
.l-container #feature .style-block .style .item-btn a {
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;
}
.l-container #feature .style-block .style .item-btn a:hover {
  opacity: 0.85;
  text-decoration: none;
}
.l-container #feature .style-block .style .ph {
  width: 361px;
  height: 384px;
  position: relative;
  z-index: 0;
  margin: 17px auto 0;
}

.l-container #feature .style-block .slick {
  width: 365px;
  margin: 0 auto;
}
.l-container #feature .style-block .slick img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.l-container #feature .style-block .slick .slide-arrow {
  position: absolute;
  top: 50%;
  width: 37.4px;
  height: 37.4px;
  z-index: 10;
  transform: translateY(-50%);
}
.l-container #feature .style-block .slick .prev-arrow {
  left: -10px;
  -webkit-transform: scale(-1, 1);
          transform: scale(-1, 1);
  cursor: pointer;
}
.l-container #feature .style-block .slick .next-arrow {
  right: 22.4px;
  cursor: pointer;
}
.l-container #feature .style-block .slick .dots-class {
  position: relative;
  z-index: 10;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: -40px;
}
.l-container #feature .style-block .slick .dots-class button {
  display: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: none;
  padding: 0;
  border: none;
  background-color: transparent;
}
.l-container #feature .style-block .slick .dots-class li {
  width: 11px;
  height: 11px;
  background-color: #fff;
  border-radius: 50%;
  margin-right: 0.8vw;
  cursor: pointer;
  -webkit-transition: background-color 0.5s ease;
  transition: background-color 0.5s ease;
}
.l-container #feature .style-block .slick .dots-class-casual li {border: 1px solid #53C053;}
.l-container #feature .style-block .slick .dots-class-casual li.slick-active {background-color: #DEF3DE;}

.l-container #feature .style-block .slick .dots-class-beauty li {border: 1px solid #FF989C;}
.l-container #feature .style-block .slick .dots-class-beauty li.slick-active {background-color: #FFDADB;}


.l-container #feature .style-block .slick .dots-class li:hover {
  background-color: #a3b6c8;
}
.l-container #feature .style-block .slick .dots-class li:last-child {
  margin-right: 0;
}


.l-container #feature .fadeUp {
  opacity: 0;
  -webkit-transform: translate(0, 50%);
          transform: translate(0, 50%);
  -webkit-transition: 2s;
  transition: 2s;
}
.l-container #feature .fadeUp.is-show {
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
  opacity: 1;
}
.l-container #feature .delay1 {
  -webkit-transition-delay: 0.2s;
          transition-delay: 0.2s;
}
.l-container #feature .delay2 {
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}

/* ----- item-search ----- */
.item-search-contents {
  width: 990px;
  margin: 0 auto;
}