@charset "UTF-8";
/* ---------------------------------------*/
/*  pagevisual */
/* ---------------------------------------*/
.pagevisual {
  background: url(../img/cosmetic_pagevisual.jpg) no-repeat;
  background-size: cover;
  background-position: center;
}

@media screen and (max-width: 767px) {
  .pagevisual {
    background: url(../img/cosmetic_pagevisual-sp.jpg) no-repeat;
    background-size: 100%;
    background-position: center;
  }
}

/* ---------------------------------------*/
/*  localnavi */
/* ---------------------------------------*/
.local_navi {
  padding: 25px 0;
  background: -webkit-gradient(linear, left top, right top, from(#715E41), to(#B49F80));
  background: -webkit-linear-gradient(left, #715E41, #B49F80);
  background: linear-gradient(90deg, #715E41, #B49F80);
}

.local_navi-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: #fff;
}

.local_navi-list__item {
  font-size: 1.4rem;
  line-height: 1;
  margin: 0 10px;
}

.local_navi-list__item a {
  display: block;
  padding: 12px 55px;
  border: solid 1px;
  border-radius: 20px;
  position: relative;
}

.local_navi-list__item a::after {
  display: block;
  content: '';
  width: 8px;
  height: 8px;
  border-bottom: solid 1px;
  border-right: solid 1px;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  position: absolute;
  top: calc(50% - 5px);
  right: 20px;
}

@media screen and (max-width: 767px) {
  .local_navi-list__item {
    margin: 0 5px;
  }
  .local_navi-list__item a {
    padding: 10px 30px 10px 15px;
  }
  .local_navi-list__item::after {
    right: 10px;
  }
}

/* ---------------------------------------*/
/*  cosme */
/* ---------------------------------------*/
#cosme {
  padding: 60px 0 40px;
}

#cosme .content-heading {
  margin-bottom: 30px;
}

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

.cosme-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  /*-webkit-justify-content: space-around;
      -ms-flex-pack: distribute;
          justify-content: space-around;*/
}

@media screen and (max-width: 767px) {
  .cosme-list {
    display: block;
  }
  .cosme-list figure {
    width: 34%;
    float: left;
  }
}

.cosme-list__item {
  width: 30%;
  text-align: left;
  margin: 0 1.6% 80px;
}

.cosme-list__item figure {
  margin: 0 0 20px;
}

.cosme-list__item p {
  font-size: 1.4rem;
  font-weight: 300;
}

@media screen and (max-width: 767px) {
  .cosme-list__item {
    width: 100%;
    margin: 0 0 40px;
  }
  .cosme-list__item p {
    clear: both;
  }
}

.cosme-product-heading {
  font-size: 1.6rem;
  font-weight: 500;
  color: #AE2256;
  margin: 0 0 20px;
}

@media screen and (max-width: 767px) {
  .cosme-product-heading {
    margin: 0 0 10px 38%;
  }
}

.cosme-product-heading--02 {
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.7;
  margin: 0 0 20px;
}

@media screen and (max-width: 767px) {
  .cosme-product-heading--02 {
    margin: 0 0 10px 38%;
  }
}

.cosme-component {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.2rem;
  font-weight: 300;
  margin: 0 0 30px;
}

@media screen and (max-width: 767px) {
  .cosme-component {
    clear: both;
    margin: 0 0 10px;
  }
}

.cosme-component__term {
  text-align: center;
  color: #AE2256;
}

.cosme-component__term span {
  display: inline-block;
  width: 5em;
  background: #F7E8EE;
}

.cosme-component__description {
  padding: 0 10px;
}

.cosme-component-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.cosme-component-list__item::after {
  content: '・';
}

.cosme-component-list__item:last-child::after {
  content: '';
}

.cosme-price {
  margin: 10px 0 0;
}

@media screen and (max-width: 767px) {
  p.common-button--02 {
    text-align: center;
    clear: both;
    margin: 30px 0 auto;
  }
}

/* ---------------------------------------*/
/*  oral */
/* ---------------------------------------*/
#oral {
  padding: 70px 0;
  background: #F4F1EC;
}

#oral .content-heading {
  margin: 0 0 50px;
}

@media screen and (max-width: 767px) {
  #oral {
    padding: 30px 0;
  }
  #oral .content-heading {
    margin: 0 0 30px;
  }
}

.oral-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

@media screen and (max-width: 767px) {
  .oral-list {
    display: block;
  }
}

.oral-list__item {
  width: 100%;
  text-align: left;
  margin: 0 0 50px;
  padding: 0 0 50px;
  border-bottom: solid 1px #CCCAC6;
}

.oral-list__item p {
  font-weight: 1.6rem;
  font-weight: 500;
  margin: 0 0 20px;
}

.oral-list__item:nth-child(3), .oral-list__item:nth-child(4) {
  width: 100%;
  border: none;
  margin: 0;
}
.oral-list__item:nth-child(3) .oral-set-list__item,
.oral-list__item:nth-child(4) .oral-set-list__item{
	width: 47.5%;
}

.oral-list__item:nth-child(3) .oral-set-heading span, .oral-list__item:nth-child(4) .oral-set-heading span {
  display: block;
  margin: 0;
}

.oral-list__item:nth-child(3) p, .oral-list__item:nth-child(4) p {
  font-size: 1.4rem;
  font-weight: 300;
}

@media screen and (max-width: 767px) {
  .oral-list__item {
    margin: 0 0 30px;
    padding: 0 0 30px;
  }
  .oral-list__item p {
    margin: 0 0 30px;
  }
  .oral-list__item p:last-child {
    margin: 0;
  }
  .oral-list__item:nth-child(3), .oral-list__item:nth-child(4) {
    width: 100%;
  }
}

.oral-set-heading {
  font-size: 2.0rem;
  font-weight: 500;
  color: #AE2256;
  margin: 0 0 10px;
}

.oral-set-heading span {
  font-size: 1.4rem;
  font-weight: 300;
  color: #333;
  margin: 0 0 0 20px;
}

.oral-set-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: flex-start;
}

@media screen and (max-width: 767px) {
  .oral-set-list {
    display: block;
  }
}

.oral-set-list__item {
  width: 30%;
	padding:20px;
}

.oral-set-list__item p {
  font-size: 1.4rem;
  font-weight: 300;
}

@media screen and (max-width: 767px) {
  .oral-set-list__item, .oral-list__item:nth-child(3) .oral-set-list__item, .oral-list__item:nth-child(4) .oral-set-list__item {
    width: 100%;
  }
}

.oral-product-heading {
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1;
  border: solid 1px #ccc;
  margin: 0 0 20px;
  padding: 7px;
}

.oral-list__flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 0 0 20px;
}

.oral-list__flex figure {
  width: 46%;
}

.oral-list__flex__text {
  width: 50%;
}

.oral-list__flex__text p {
  font-size: 1.6rem !important;
  font-weight: 500 !important;
}

/* ---------------------------------------*/
/*  topical */
/* ---------------------------------------*/
#topical {
  padding: 70px 0 120px;
}

#topical .content-heading {
  margin: 0 0 40px;
}

@media screen and (max-width: 767px) {
  #topical {
    padding: 30px 0 50px;
  }
}

.topical-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -webkit-justify-content: start;
      -ms-flex-pack: start;
          justify-content: start;
}

@media screen and (max-width: 767px) {
  .topical-list {
    display: block;
  }
}

.topical-list__item {
  text-align: left;
  width: 30%;
}

.topical-list__item:nth-child(2n) {
  margin: 0 5%;
}

.topical-list__item p {
  font-size: 1.4rem;
  margin: 0 0 20px;
}

@media screen and (max-width: 767px) {
  .topical-list__item {
    width: 100%;
    margin: 0 0 30px;
  }
  .topical-list__item:nth-child(2n) {
    margin: 0;
  }
  .topical-list__item:last-child {
    margin: 0;
  }
}

.topical-puroduct-heading {
  font-size: 2.0rem;
  font-weight: 500;
  color: #AE2256;
  margin: 0 0 20px;
}

@media screen and (max-width: 767px) {
  .topical-puroduct-heading {
    font-size: 1.6rem;
    margin: 0 0 5px;
  }
}

.topical-component {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.2rem;
  font-weight: 300;
}

.topical-component__term {
  text-align: center;
  color: #AE2256;
}

.topical-component__term span {
  display: inline-block;
  width: 3em;
  background: #F7E8EE;
}

.topical-component__description {
  padding: 0 10px;
}

.topical-component-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.topical-component-list__item::after {
  content: '・';
}

.topical-component-list__item:last-child::after {
  content: '';
}
