@charset "UTF-8";


@media (min-width: 320px) {
  /* タイトル */
article.page_title {
      background: url("../images/shampoo/head_img.jpg") no-repeat 80% center;;
      background-size: cover;
  }
  article h2.sub_title_shampoo {
      background-position: center 63%;
  }
  article h2.sub_title_shampoo .sub_title_en {
      line-height: 1.3;
  }
  article h2.sub_title_shampoo .sub_title_en br {
      line-height: 1.3;
  }

 /* プレミアムシャンプー＆トリートメント*/
.treatment {
  }
.treatment .treatment_img {
    text-align: center;
    margin-bottom: 20px;
  }
.treatment > div {
    list-style: none;
    padding: 40px;
    position: relative;
  }
.treatment > div:before {
      content: '　';
      display: block;
      width: 80px;
      height: 85px;
      background: url("../images/common/leaf_l1.png") no-repeat left top;
    background-size: contain;
      position: absolute;
      top: 0px;
      left: 0px;
  }
.treatment > div:after {
      content: '　';
      display: block;
      width: 80px;
      height: 94px;
      background: url("../images/common/leaf_r2.png") no-repeat right bottom;
    background-size: contain;
      position: absolute;
      bottom: 0px;
      right: 0px;
  }
.treatment > div p {
	color: #826d45;
  }

  /* 特長*/
article.stoneback .features .features_message {
    background: url("../images/shampoo/shampoo04.png") no-repeat right bottom;
    background-size: contain;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	display: -webkit-box; /* Android4.3以下、Safari3.1～6.0 */
	display: -webkit-flex; /* Safari6.1以降 */
  }
article.stoneback .features .features_message .treatment_img {
    width: 25%;
    margin-top: auto;
  }
article.stoneback .features .features_message .features_txt {
    width: 70%;
    height: 33vw;
    text-align: center;
    padding: 0 2em;
    background: url("../images/shampoo/shampoo03.png") no-repeat center center;
    background-size: 100% 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	display: -webkit-box; /* Android4.3以下、Safari3.1～6.0 */
	display: -webkit-flex; /* Safari6.1以降 */
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -webkit-flex-direction:column;
    -ms-flex-direction:column;
    flex-direction:column;
    -webkit-box-pack:center;
    -webkit-justify-content:center;
    -ms-flex-pack:center;
    justify-content:center;
  }
article.stoneback .features .features_message .features_txt p {
    font-size: 2.8vw;
    line-height: 1.2;
    padding: 0.5em 0;
  }

}

@media (min-width: 360px) {
}

@media (min-width: 400px) {
}

@media (min-width: 520px) {
  /* タイトル */
  article h2.sub_title_shampoo {
      background-position: center 54%;
  }
  article h2.sub_title_shampoo .sub_title_en {
      line-height: 1.8;
  }
  article h2.sub_title_shampoo .sub_title_en br {
      display: none;
  }

  /* 特長*/
article.stoneback .features .features_message .features_txt {
    width: 63%;
  }
article.stoneback .features .features_message .features_txt p {
    font-size: 1.4rem;
  }
}

@media (min-width: 768px) {
  /* プレミアムシャンプー＆トリートメント*/
.treatment {
	display: flex;
	display: -ms-flexbox; /* IE10 */
	display: -webkit-box; /* Android4.3以下、Safari3.1～6.0 */
	display: -webkit-flex; /* Safari6.1以降 */
    -webkit-box-orient:horizontal;
    -webkit-box-direction:reverse;
    -webkit-flex-direction:row-reverse;
    -ms-flex-direction:row-reverse;
    flex-direction:row-reverse;
    -webkit-box-pack:justify;
    -webkit-justify-content:space-between;
    -ms-flex-pack:justify;
    justify-content:space-between;
    -webkit-box-align:center;
    -webkit-align-items:center;
    -ms-flex-align:center;
  }
.treatment .treatment_img {
    width: 40%;
    margin-bottom: 0;
	flex-shrink: 0;
  }
.treatment > div {
    width: 55%;
    padding: 40px;
  }
.treatment > div:before {
      width: 80px;
      height: 85px;
  }
.treatment > div:after {
      width: 80px;
      height: 94px;
  }

  /* 特長*/
article.stoneback .features .features_message {
  }
article.stoneback .features .features_message .treatment_img {
    width: 25%;
  }
article.stoneback .features .features_message .features_txt {
    width: 62%;
    height: auto;
    padding: 0 2em;
  }
article.stoneback .features .features_message .features_txt p {
    font-size: 1.6rem;
    line-height: 1.2;
    padding: 0.8em 0;
  }
}

@media (min-width: 840px) {
}

@media (min-width: 1200px) {
  /* プレミアムシャンプー＆トリートメント*/
.treatment {
    margin-bottom: 50px;
  }
.treatment .treatment_img {
    width: 493px;
  }
.treatment > div {
    width: auto;
	margin-right: 23px;
    padding: 130px 80px 100px;
  }
.treatment > div:before {
      width: 142px;
      height: 151px;
  }
.treatment > div:after {
      width: 145px;
      height: 171px;
  }

  /* 特長*/
article.stoneback .features .features_message {
    -webkit-box-align:end;
    -webkit-align-items:flex-end;
    -ms-flex-align:end;
    align-items:flex-end;
  }
article.stoneback .features .features_message .treatment_img {
    width: 329px;
    margin-right: 20px;
  }
article.stoneback .features .features_message .features_txt {
    width: 55%;
    height: 314px;
    padding: 0 2em;
  }
article.stoneback .features .features_message .features_txt p {
    font-size: 2rem;
    padding: 1em 0;
  }
}

@media (min-width: 1500px) {
}

