@charset "UTF-8";
@import url(./base-style.css);

/* ------------------------------
section_h2
------------------------------ */
.h2_block {
  background-image: url(../images/about_bg.jpg);
}

/* ------------------------------
コンセプト
------------------------------ */
.concept_text {
  background-color: var(--bgcolor_3);
  padding: 10px;
  margin: 0 50px;
}

/* ------------------------------
スタッフ section_h3
------------------------------ */
/* section_h3 */
#staff {
  background-color: var(--bgcolor_3);
}
.staff_list li {
  padding: 0 0 10px;
  margin: 0 5px 70px;
}

/* ------------------------------
スタッフ setting_bgimage
------------------------------ */
.staff_list li:nth-of-type(1) .set_bgimage {
  background-image: url(../images/stylist_1.jpg);
}
.staff_list li:nth-of-type(2) .set_bgimage {
  background-image: url(../images/stylist_2.jpg);
}


/* section_h4 */
.section_h4 {
  background-color: #fff;
}
.prof_block {
  padding: 10px 5px;
}
/* h4 */
.section_h4 h4 {
  display: flex;
  justify-content: space-between;
  background-color: var(--bgcolor_3);
  padding: 10px;
  border-left: solid 3px #888;
}
.section_h4 h4 > span {
  display: block;   /* diaplay:flex の都合 */
}
/* プロフィール部分 */
.prof_block dl {
  padding: 0;   /* 上書き */
}
.prof_block .prof_item {
  padding: 10px 0;
  border-bottom: solid 1px var(--borderBottom_color);
}
.prof_block .prof_item > dt {
  color: var(--accent_color);
}
.prof_block .dd_block {
  display: flex;
}
.prof_block dd::before {
  content: ",";
  display: inline-block;
  width: 1em;
}
.prof_block dd:first-of-type:before {
  display: none;    /* 上書き */
}


/* ------------------------------
画面幅1001px以上
------------------------------ */
@media screen and (min-width: 1001px) {

  /* ------------------------------
  スタッフ
  ------------------------------ */
  /* setting_bgimage */
  .setting_bgimage .sec_h4_block {
    flex: 1;
  }
  .setting_bgimage .set_bgimage {
    flex: 0 0 50%;
  }
  /* section_h4 */
  .section_h4 {
    margin: 0;
  }
}

