.merit-section {
  overflow: hidden;
  width: 100%;
}
/* merit-head */
.merit-section .merit-head{
  margin: 84px auto 70px;
}
  .merit-section .merit-head-wrap{
    display: flex;
    justify-content:space-between;
    box-sizing: border-box;
    align-items: center;
  }
  .merit-section .merit-head .text{
    width:68%;
    padding-right: 2%;
    padding-left:5%;
    box-sizing: border-box;
  }
  .merit-section .merit-head .image{
    width:32%;
    box-sizing:border-box
  }
  .merit-section .merit-head .tag{
    color: #ccc;
    border: 1px solid #ccc;
    width: fit-content;
    padding: 5px 20px;
    border-radius: 30px;
    font-size: 1.6rem;
    margin-top: 28px;
  }
  .merit-section .merit-head .text h1{
    font-size: 4.8rem;
    line-height: 140%;
    margin: 14px 0 28px;
  }
  .merit-section .merit-head .title-line{
    background: linear-gradient(transparent 77%,#ccc 0%);
    display: inline;
  }
  .merit-section .merit-hair .merit-head-line{
    background: linear-gradient(transparent 77%,#a8c2f5 0%);
  }
  .merit-section .merit-head-text .merit-head-detail{
    color: #4C4C4C;
    line-height: 200%;
  }
@media screen and (max-width: 1180px) {
  .merit-section .merit-head .text h1{
      font-size: 4.2rem;
      margin: 14px 0 14px;
  }
  .merit-section .merit-head .text{
      padding-right:0;
  }
}
@media screen and (max-width: 980px) {
  .merit-section .merit-head{
      margin: 98px auto 70px;
      width: 88%;
  }
  .merit-section .merit-head .text{
      width:60%;
      padding-left:0;
  }
  .merit-section .merit-head .image{
      width:40%;
      padding-left:0;
      margin: 0px;
      position: relative;
      left: 14px;
  }
  .merit-section .merit-head .tag{
      font-size: 1.4rem;
      margin-top: 0px;
      padding: 4px 14px;
  }
  .merit-section .merit-head .text h1{
      font-size: 3.6rem;
      margin: 14px 0;
  }
  .merit-section .merit-head .text p.lead{
      line-height: 1.6;
  }
}
@media screen and (max-width: 830px) {
  .merit-section .merit-head .text h1{
      font-size: 3.4rem;
  }
}
@media screen and (max-width: 768px) {
  .merit-section .merit-head{
      margin: 98px auto 56px;
  }
  .merit-section .merit-head .merit-head-wrap{
      display: block;
      position: relative;
  }
  .merit-section .merit-head .text{
      width: 72%;
      padding-right: 0;
      padding-left:0;
  }
  .merit-section .merit-head  .image{
      position: absolute;
      margin: 0px;
      top: -5.4vh;
      right: -12%;
      z-index: -99;
      width:280px;
      left: auto;
  }
  .merit-section .merit-head .text .tag{
      font-size: 1.2rem;
      margin-top: 0px;
      padding: 4px 14px;
  }
  .merit-section .merit-head .text h1{
      font-size: 3.2rem;
      margin: 14px 0;
  }
}
@media screen and (max-width: 600px) {
  .merit-head-br{
      display: none;
  }
  .merit-section .merit-head .text {
      width: 72%;
  }
  .merit-section .merit-head .image{
      width: 240px;
      top: 0px;
  }
  .merit-section .merit-head .text h1{
      width:100%;
      font-size: 2.8rem;
  }
}
@media screen and (max-width: 480px) {
  .merit-section .merit-head .image{
      width: 62%;
      top: -7.4vh;
      right: -20%;
  }
  .merit-section .merit-head .text {
      width: 100%;
  }
  .merit-section .merit-head .text h1{
      width:72%;
      font-size: 2.8rem;
      margin-bottom: 7px;
  }
  .merit-section .merit-head .text p.lead {
    width: 80%;
  }
  .merit-section .merit-head .text p.lead{
    margin-top: 1.4rem;
  }
}
@media screen and (max-width: 410px) {
  .merit-section .merit-head .image{
      width: 62%;
      top: -7.4vh;
      right: -20%;
  }
  .merit-section .merit-head .text p.lead {
    width: 100%;
  }
}
@media screen and (max-width: 350px) {
  .merit-section .merit-head .image{
      width: 62%;
      top: -6.0vh;
      right: -14%;
  }
}

/* issues */
.merit-section .issues{
  margin: 0px auto 70px;
  }
  .merit-section .issues h3{
      color: #6B5744;
      font-size: 3.2rem;
      text-align: center;
      margin-bottom: 14px;
  }
  .merit-section .issues h2{
      color: #6B5744;
      font-size: 3.2rem;
      text-align: center;
      margin-bottom: 2.8rem;
  }
  .merit-section .issues .box {
      display: grid;
      grid-template-columns: 128px 1fr;
      margin: 0 auto 2.8rem;
      gap: 24px;
      max-width: 890px;
  }
  .merit-section .issues .box  h3{
      font-size: 2.4rem;
      color: #6B5744;
      padding: 14px 0 0 0;
      line-height: 1;
      text-align: left;
  }
  .merit-section .issues .box p{
      line-height: 160%;
  }
  .issues .summary p{
    padding: 0 10px;
  }

    @media screen and (max-width:980px){
      .merit-section .issues .box {
        width: 100%;
        }
      .merit-section .issues .box p{
        padding-right: 10px;
      }
      }
      @media screen and (max-width:768px){
          .merit-section .issues{
          }
          .merit-section .issues h3{
          }
          .merit-section .issues h2{
            font-size: 2.4rem;
          }
          .merit-section .issues .box {
              grid-template-columns: 1fr;
              margin: 0px auto 2.8rem;
              gap: 14px;
          }
          .merit-section .issues .box .box-images{
              width: 38%;
              margin: 0 auto;
              text-align: center;
          }
          .merit-section .issues .box  h3{
              font-size: 2.0rem;
              text-align: center;
          }
          .merit-section .issues .box p{
              line-height: 160%;
          }
          .merit-section .issues .box p{
            padding-right: 0px;
          }
          .issues .summary p{
            padding: 0px;
          }
      }



/* explanation */
.explanation .introduction h2{
  font-size: 3.2rem;
  text-align: center;
  line-height: 160%;
}
.explanation .introduction{
  text-align: center;
}
.explanation .introduction .image{
  width: fit-content;
  margin: 0px auto 14px;
}
.explanation .labor{
  margin-top: 42px;
}
.explanation .labor h2{
  font-size: 2.8rem;
  text-align: center;
  line-height: 1.6;
  margin-bottom: 2.8rem;
}
.explanation .labor .box{
  display: flex;
  justify-content: flex-start;
  gap: 120px;
  align-items: center;
  background: #F9F8F8;
  padding: 14px 24px 28px 60px;
  box-sizing: border-box;
  position: relative;
}
.explanation .labor .box{
  margin-bottom: 2.8rem;
}
.explanation .labor .box:nth-of-type(2){
  padding-top: 28px;
}
.explanation .labor .box .head{
  display: flex;
  align-items: center;
}
  .explanation .labor .box .head .guruguru{
      width: 44px;
      margin-right: 14px;
  }
.explanation .labor .box .text{
  width: 58%;
}
.explanation .labor div:nth-of-type(1) .image{
  width: 180px;
  position: relative;
  top: -42px;
  margin-bottom: -20px;
}
  .merit-nail .explanation .labor div:nth-of-type(1) .image,
  .merit-eye .explanation .labor div:nth-of-type(1) .image{
    width: 320px;
    top: 0px;
    margin-bottom: 0pxx;
  }
.explanation .labor div:nth-of-type(2) .image{
  width: 320px;   
}
  .explanation .labor .text h3{
      font-size: 3.2rem;
      color: #6B5744;
  }
  .explanation .labor .box .subtitle{
      font-size: 2.0rem;
      color: #6B5744;
      font-weight: bold;
      padding: 14px 0 14px;
  }
  .explanation .labor .box p{
      line-height: 1.6;
  }

  @media screen and (max-width:980px) {
  }
  @media screen and (max-width:768px) {

      .explanation .introduction h2{
        font-size: 2.4rem;
        text-align: center;
        line-height: 160%;
      }
      .explanation .labor h2{
        font-size: 2.2rem;
      }
    .explanation .labor .box{
      flex-wrap: wrap;
      gap: 1.4rem;
      padding: 6%;
    }
    .explanation .labor .box .text{
      order: 2;
      width: 100%;
      margin: 0px auto;
    }
    .explanation .labor .text h3 {
      font-size: 2.2rem;
    }
    .explanation .labor .box .head .guruguru{
      width: 28px;
    }
    .explanation .labor .box .image{
      order: 1;
      width: 80%;
      margin: 0px auto;
    }
    .explanation .labor div:nth-of-type(1) .image{
      top: 0px;
      margin-bottom: 0px;
      width: 38%;
    }
    .explanation .labor div:nth-of-type(2) .image{
      width: 62%;
    }
    .explanation .labor .box .subtitle{
      font-size: 1.8rem;
      padding-bottom: 4px;
    }
  }

.reserve-management{
  background: #ccc;
  margin: 42px auto 0;
  padding: 42px 0 0 0;
}
  .reserve-management h2{
      font-size: 3.2rem;
      text-align: center;
      margin-bottom:56px;
  }
  .reserve-management h3{
      text-align: center;
  }
  .reserve-management p{
      text-align: center;
  }
  .reserve-management .box img {
      width: 100%;
      height: auto;
  }
  .reserve-management .box {
      margin-bottom: 5.6rem;
  }
.shift-management{
  margin: 0 auto;
  padding: 28px 0 42px;
}
  .shift-management h3{
      font-size: 3.2rem;
      text-align: center;
      line-height: 1.4;
      margin-bottom: 14px;
      font-weight: bold;
  }
  .shift-management .image{
      margin: 14px auto 14px;
  }
  .shiftt-img-sp1,.shiftt-img-sp2{
      display: none;
  }
  .shift-management p{
      text-align: center;
      line-height: 1.4;
  }
  .shift-management .setting{
      font-size: 2.0rem;
  }
  @media screen and (max-width:980px){
    .reserve-management .image-1{
      margin: 14px auto;
      }
      .reserve-management .image-2{
          margin-bottom: 28px;
      }
      .reserve-management .image-3{
          margin: 0 auto 28px;
      }
      .reserve-management .image-4{
          margin: 14px auto;
          width: fit-content;
      }
  }
  @media screen and (max-width: 768px) {
    .reserve-management h2{
      font-size: 2.8rem;
      margin-bottom: 2.8rem;
    }
    .reserve-management-text-detail{
        text-align: left;
        line-height: 1.4;
        width: 100%;
    }
      .shift-management{
          padding: 21px 0 42px;
      }
      .shift-management h3{
          font-size: 2.4rem;
      }
      .shift-management h4{
          width: 100%;
          margin: 0 auto;
          font-size: 2.2rem;
          line-height: 1.6;
          padding-bottom: 14px;
      }
      .shift-management .image {
          position: relative;
      }
      .shift-img{
          display: none;
      }
      .shift-img-sp1,.shift-img-sp2{
          display: block;
      }
      .shift-img-sp{
          position: relative;
          margin-top: 14px;
      }
      .shift-img-sp1{
          margin: 0 auto;
      }
      .shift-img-sp2{
          position: absolute;
          width: 30%;
          top: 90px;
          right: -20px;
      }
      .shift-management .sp-br{
          display: none;
      }
      .shift-management p{
          text-align: center;
          line-height: 1.6;
      }
      .shift-management p.setting{
          font-size: 1.6rem;
          line-height: 1.4;
          text-align: left;
          width: 72%;
      }
  
  }

/* effect */
.effect{
  padding: 28px 0 56px;
}
.effect1,.effect2,.effect3{
  justify-content: center;
  position: relative;
  display: flex;
  flex-direction: column;
  height: 280px;
  box-sizing: border-box;
  background-position: center;
  padding: 35px;
  text-align: center;
}
.effect1 img,.effect2 img,.effect3 img{
  position: absolute;
  top: -25px;
  left: 0;
  right: 0;
  margin: auto;
  width: 98px;
}
.effect-wrap{
  display: flex;
  justify-content: center;
  gap: 28px;
}
.effect h2{
  color: #ffffff;
  text-align: center;
  font-size: 3.2rem;
  margin-bottom: 42px;
  line-height: 1.4;
  letter-spacing: 0.2em;
}
.effect1 h3,.effect2 h3{
  color: #ccc;
  font-size: 2.4rem;
  margin: 14px 0 14px 0;
  line-height: 55px;
}
.effect3 h3{
  color: #ccc;
  font-size: 2.4rem;
  line-height: 1.2;
  margin: 14px 0 14px 0;
  height: 55px;
}
.effect1 p,.effect2 p,.effect3 p{
  line-height: 1.6;
}

  .merit-esthe .effect{ 
    background: url(../images/merit-salon/merit-esthe-effect_bg.png) no-repeat center/cover;
    margin-bottom: 32px;
  }
  .merit-esthe .effect1,.merit-esthe .effect2,.merit-esthe .effect3{
    background: url(../images/merit-salon/merit-esthe-effectcircle.png) no-repeat;
    background-position: center;
    background-size: contain;
  }
  .merit-eye .effect{
      background: url(../images/merit-salon/merit-eye-effect-bg.jpg) no-repeat center/cover;
      margin-bottom: 32px;
  }
  .merit-eye .effect1,.merit-eye .effect2,.merit-eye .effect3{
      background: url(../images/merit-salon/merit-eye-effect-circle.png) no-repeat;
      background-position: center;
      background-size: contain;
  }

  .merit-nail .effect{
      background: url(../images/merit-salon/merit-nail-effect-bg.jpg) no-repeat center/cover;
  }
  .merit-nail .effect1,.merit-nail .effect2,.merit-nail .effect3{
      background: url(../images/merit-salon/meri-nail-effect-circle.png) no-repeat;
      background-position: center;
      background-size: contain;
  }

	@media screen and (max-width:980px) {
    .effect1 h3,.effect2 h3{
      margin: 0px 0 8px 0;
      line-height: 1.2;
    }
    .effect3 h3{
      line-height: 1.2;
      margin: 0px 0  8px 0;
      height: auto;
    }
    .effect1,.effect2,.effect3{
      width: 35%;
    }
    .effect-wrap{
      gap: 10px;
    }
    .effect1 p,.effect2 p,.effect3 p{
      line-height: 1.4;
      height: 54px;
    }
    .effect1 img,.effect2 img,.effect3 img{
      width: 88px;
    }
	}

  @media screen and (max-width:768px){
  .effect{
      padding: 42px 0;
      margin-bottom: 42px;
  }
    .merit-esthe .effect{
        background: url(../images/merit-salon/merit-esthe-effect_bg_SP.jpg) no-repeat center/cover;
    }
    .merit-eye .effect{
        background: url(../images/merit-salon/merit-eye-effect-bg-sp.jpg) no-repeat center/cover;
    }
    .merit-nail .effect{
        background: url(../images/merit-salon/merit-nail-effect-bg-sp.jpg) no-repeat center/cover;
    }
  .effect-wrap{
      display: flex;
      flex-flow: column;
      gap: 42px;
  }
  .effect1,.effect2,.effect3{
      height: 290px;
      width: auto;
  }
  .effect h2{
      font-size: 2.8rem;
      margin-bottom: 56px;
      letter-spacing: -0.0rem;
  }
  .effect1 img,.effect2 img,.effect3 img{
      top: -20px;
      max-width: 196px;
  }
  .effect1 h3,.effect2 h3{
    margin: 14px 0 14px 0;
    line-height: 55px;
  }
  .effect3 h3{
    line-height: 1.2;
    margin: 14px 0 14px 0;
    height: 55px;
  }
  .effect1 p,.effect2 p,.effect3 p{
    line-height: 1.6;
    height: auto;
  }
  .effect1 img,.effect2 img,.effect3 img{
    width: 98px;
  }
  }

.interview-voice{
  margin: 56px auto 70px;
}
.interview-voice h2{
  color: #ffffff;
  background-color: #ccc;
  font-size: 3.2rem;
  width: fit-content;
  border-radius: 4px;
  margin: 0 auto;
  padding: 5px 25px;
  letter-spacing: 0.2rem;
}
.interview-voice-wrap{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 28px;
}
.interview-voice-frame{
  width: fit-content;
  background: #ccc;
  border-radius: 24px;
  margin: 28px auto 0;
  padding: 7px 28px;
}
.interview-voice-img{
  width: 32%;
  text-align: center;
}
.interview-voice-text{
  width: 68%;
  position: relative;
  padding: 42px 42px;
}
.interview-voice .salonname{
  color: #ccc;
  font-weight: bold;
  text-align: right;
  margin-top: 14px;
}
.interview-voice-text::before,.interview-voice-text::after{
  content: '';
  width: 47.7px;
  height: 42px;
  position: absolute;
  border-radius: 2px;
}
.interview-voice-text::before{
  border-left: solid 4px #ccc;
  border-top: solid 4px #ccc;
  top: 0;
  left: 0;
}
.interview-voice-text::after{
  border-right: solid 4px #ccc;
  border-bottom: solid 4px #ccc;
  bottom: 0;
  right: 0;
}
@media screen and (max-width: 980px) {
  .interview-voice{
    margin-left: 28px;
    margin-right: 28px;
  }
  .interview-voice-frame{
      padding: 0px 14px 40px;
  }
  .interview-voice-wrap{
      flex-flow:column;
      gap: 0px;
  }
  .interview-voice-img{
      width: 40%;
  }
  .interview-voice-text{
      width: 85%;
      padding: 40px 40px;
  }
}
@media screen and (max-width: 768px) {
  .interview-voice{
      margin: 0 auto 56px;
  }
  .interview-voice h2{
    font-size: 2.4rem;
    text-align: center;
  }
  .interview-voice h3{
      font-size: 2.2rem;
      padding: 5px 25px;
      line-height: 1.4;
  }
  .interview-voice-frame{
      padding: 0px 14px 32px;
  }
  .interview-voice-img{
      width: 45%;
  }
  .interview-voice-text{
      width: 80%;
      padding: 28px 28px;
  }
  .interview-voice-text::before,.interview-voice-text::after{
    content: '';
    width: 28px;
    height: 28px;
  }
}
@media screen and (max-width: 600px) {
  .interview-voice-img{
      width: 62%;
  }
}

.merit-summary{
  text-align: center;
  margin-bottom: 4.8rem;

}
  .merit-summary h3{
    margin-bottom: 2.4rem;
  }
    .contribution{
      margin-bottom: 4.2rem;
    }
      .contribution h2{
        font-size: 3.2rem;
        color: #ccc;
        border: 1px solid #ccc;
        width: fit-content;
        margin: 0 auto;
        padding: 5px 40px;
        border-radius: 4px;
      }
      .contribution-inner{
        margin-top: 14px;
      }
      .contribution-inner .box{
        text-align: center;
        padding: 14px 28px;
      
        display: flex;
        flex-direction: column;
        align-items:center;
        justify-content: center;
      }
      .contribution-inner .box > img{
        width: 70%;
      }
      .contribution-inner .box h4{
        font-size: 2.8rem;
        font-weight: bold;
        background: #999;
        line-height: 1;
        margin: 5px auto 14px;
        padding: 14px 0px;
        border-radius: 9999px;
        width: 100%;
      }
      .contribution-inner .box p{
        line-height: 1.6;
        margin-bottom: 28px;
        text-align: left;
      }
      
      .contribution-inner .box .banner-link {
        margin-top: auto;
      }
      @media screen and (max-width:980px) {
        .contribution-inner .box h4{
          font-size: 2.2rem;
        }
      }
      @media screen and (max-width:768px) {
        .contribution h2{
            padding: 10px 20px;
            font-size: 2.2rem;
            line-height: 1.4;
            text-align: center;
            box-sizing: border-box;
            width: 100%;
        }
          .contribution-inner{
              margin-top: 28px;
          }
          .contribution-inner .box{
            padding: 14px 14px;
      
          }
          .contribution-inner .box > img{
            width: 62%;
          }
          .contribution-inner .box h4{
            font-size: 2.0rem;
          }
          .contribution-inner .box p{
          }
      }
      
  /******** hair content *********/
  .merit-hair .yourtrouble p{
    color: #6B5744;
    font-size: 2.8rem;
    margin-top: 1.4rem;
    text-align: center;
    font-weight: bold;
  }
  .merit-hair .bmmanagement{
      margin-top:4.2rem;
      padding-top: 4.2rem;
      padding-bottom: 4.2rem;
      background-color: #f6f9fe;
  }
  .merit-section .bmmanagement .box:nth-of-type(1) {
      text-align: center;
      margin-top: 4.2rem;
  }
  .merit-section .bmmanagement .box:nth-of-type(3) {
      text-align: center;
      margin-top: 4.2rem;
  }
  .merit-hair .bmmanagement .headicon-frame{
      margin: 0px auto 1.4rem;
  }
  .merit-hair .bmmanagement h2{
      background-color: #e5edfc;
      padding-left: 14px;
      padding-right: 14px;
      box-sizing: border-box;
  }
  .merit-hair .bmmanagement h3{
      color: #29486d;
  }
  .merit-hair .bmmanagement .flex-box {
      align-items: center;
      justify-content: space-between;
  }

  .merit-hair .bmmanagement .flex-box .box:nth-child(1){
      width: 280px;
      text-align: right;
      margin-top: 0px;
      margin-right: 20px;
  }
  .merit-hair .bmmanagement .flex-box .box:nth-child(2){
      width: 360px;
      text-align: center;
  }
  .merit-hair .bmmanagement .flex-box .box:nth-child(3){
      width: 280px;
      text-align: left;
      margin-top: 0px; 
      margin-left: 20px;
  }
  @media screen and (max-width:768px) {
  .merit-hair .yourtrouble p {
    font-size: 2.0rem;
  }
  .merit-hair .bmmanagement h2{
    font-size: 1.8rem;
  }
  .merit-hair .bmmanagement .flex-box {
      flex-wrap: wrap;
    }
    .merit-hair .bmmanagement .flex-box .box:nth-child(1){
      width: 100%;
      text-align: center;
      margin-right: 0px;
    }
    .merit-hair .bmmanagement .flex-box .box:nth-child(2){
      width: 80%;
      margin: 0px auto;
      text-align: center;
    }
    .merit-hair .bmmanagement .flex-box .box:nth-child(3){
      width: 100%;
      text-align: center;
      margin-left: auto;
    }
  }
  .merit-hair .inhousereserve {
      text-align: center;
      margin-top: 4.2rem;
  }
  .merit-hair .inhousereserve .box{
      margin-bottom: 8.4rem;
  }

  .merit-hair .inhousereserve .box h2{
      margin-bottom: 2.4rem;
  }
  .merit-hair .inhousereserve .box img{
      margin-bottom: 2.8rem;
  }
  .merit-hair .effect{
    background: url(../images/merit-salon/merit-hair-repeater-bg.jpg) no-repeat center/cover;
      padding: 28px 0 56px;
      position: relative;
      margin-bottom: 4.2rem;
  }
  .merit-hair .effect > .box {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      max-width: 860px;
      position: relative;
      left: 38%;
  }
      @media screen and (max-width:1400px) {
          .merit-hair .effect > .box {
              width: 68%;
              left: 32%;
          }
      }
      @media screen and (max-width:980px) {
          .merit-hair .effect > .box {
              width: 74%;
              left: 26%;
          }
      }
  .merit-hair .effect > .box h2{
      text-align: left;
      letter-spacing: 0;
      margin-bottom: 2.8rem;
      color: #fff;
  }
  @media screen and (max-width:1200px) {
      .merit-hair .effect > .box h2{
          font-size: 2.4rem;
      }
  }
  @media screen and (max-width:980px) {
      .merit-hair .effect > .box h2{
          margin-bottom: 2.0rem;
      }
  }
  .merit-hair .effect .app-img{
      max-width: 294px;
      width: 32%;
  }
  @media screen and (max-width:980px) {
      .merit-hair .effect .app-img{
          width: 42%;
      }
  }
  .merit-hair .effect .text{
      width: 68%;
  }
  .merit-hair .effect .func-box{
      display: flex;
      align-items :flex-start;
      justify-content: flex-start;
      margin-bottom: 1.4rem;
  }
  .merit-hair .effect .func-box .func-icon{
      max-width: 100px;
  }
      @media screen and (max-width:1200px) {
          .merit-hair .effect .func-box .func-icon{
              max-width: 84px;
          }
      }
      @media screen and (max-width:980px) {
          .merit-hair .effect .func-box .func-icon{
              max-width: 70px;
          }
      }
  .merit-hair .effect .func-box .func-txt {
      max-width: 420px;
      padding-left: 1.4rem;
      padding-right: 1.4rem;
  }
  .merit-hair .effect .func-box .func-txt h3{
      text-align: left;
      color: #fff;
      margin-bottom: 0.7rem;
      font-size: 2.0rem;
  }
  .merit-hair .effect .func-box .func-txt p{
      color: #fff;
  }
  @media screen and (max-width:1200px) {
      .merit-hair .effect .func-box .func-txt p{
          font-size: 1.6rem;
      }
  }
  @media screen and (max-width:980px) {
      .merit-hair .effect .func-box .func-txt h3{
          text-align: left;
          color: #fff;
          margin-bottom: 0px;
      }
  }
  @media screen and (max-width:768px) {
      .merit-hair .effect{
        background: url(../images/merit-salon/merit-hair-repeater-bg-sp.jpg) no-repeat center/cover;
        padding: 28px 0 28px;
        position: relative;
      }
      .merit-hair .effect > .box {
          flex-wrap: wrap;
          width: 88%;
          position: relative;
          margin: 0px auto;
          left: auto;
      }
      .merit-hair .effect > .box h2{
          font-size: 2.4rem;
          color: #fff;
      }
      .merit-hair .effect .app-img{
          width: 52%;
          margin: 0px auto;
      }
      .merit-hair .effect .text{
          width: 100%;
      }
      .merit-hair .effect .func-box{
          display: flex;
          align-items :flex-start;
          justify-content: flex-start;
          margin-bottom: 1.4rem;
      }
      .merit-hair .effect .func-box .func-icon{
          max-width: 20%;
      }
      .merit-hair .effect .func-box .func-txt {
          width: 80%;
          padding-right: 0px;
      }
      .merit-hair .effect .func-box .func-txt h3{
          text-align: left;
          color: #fff;
          font-size: 1.8rem;
          margin-bottom: 0px;
          letter-spacing: 0;
      }
      .merit-hair .effect .func-box .func-txt p{
          color: #fff;
          font-size: 1.6rem;
          line-height: 1.4;
      }
  }

  /******** nail content *********/
  .merit-nail .merit-karte{
    margin-top: 4.2rem;
    text-align: center;
    margin-bottom: 5.6rem;
  }
    .merit-nail .merit-karte .image {
      width: 980px;
      margin: 0px auto;
    }
    .merit-nail .merit-karte h3{
    }
    .merit-nail .merit-karte p{
    }
    @media screen and (min-width:769px) and (max-width:980px) {
      .merit-nail .merit-karte .image {
        width: 88%;
      }
      }
    @media screen and (max-width:768px) {
      .merit-nail .merit-karte{
        width: 88%;
        margin: 4.2rem auto;
      }
      .merit-nail .merit-karte .image {
        width: 100%;
        position: relative;
      }
      .merit-nail .merit-karte .image > div:first-child{
        width: fit-content;
        width: 80%;
        margin: 0px auto;
      }
      .merit-nail .merit-karte .image > div:nth-child(2){
        position: absolute;
        width: 42%;
        top: 116px;
        right: -20px;
      }
      .merit-nail .merit-karte p {
        margin-top: 28px;
      }
    }
    .merit-nail .merit-push{
        margin-top: 4.2rem;
        text-align: center;
        margin-bottom: 4.2rem;
      }
        .merit-nail .merit-push .image {
          width: 980px;
          margin: 0px auto;
          display: flex;
          align-items: center;
          justify-content: center;
        }
          .merit-nail .merit-push .image > div:first-child{
            width: 92%;
            padding-left: 6%;
            padding-right: 2%;
          }
          .merit-nail .merit-push .image > div:nth-child(2){
            width: 92%;
            padding-left: 2%;
            padding-right: 6%;
          }
        .merit-nail .merit-push h3{
        }
        .merit-nail .merit-push p{
        }
        @media screen and (min-width:769px) and (max-width:980px) {
          .merit-nail .merit-push .image {
            width: 88%;
          }
          }
        @media screen and (max-width:768px) {
          .merit-nail .merit-push{
            width: 88%;
            margin: 4.2rem auto;
          }
          .merit-nail .merit-push .image {
            width: 100%;
            display: block;
          }
          .merit-nail .merit-push .image > div:first-child{
          }
          .merit-nail .merit-push .image > div:nth-child(2){
            width: 88%;
            margin: 14px auto 0px;
          }
          .merit-nail .merit-push p {
            margin-top: 14px;
          }
        }
        @media screen and (max-width:540px) {
        .merit-nail .merit-karte .image > div:nth-child(2){
          top: 102px;
        }
          
        }

    /* color setting */
    .merit-hair .merit-head .text .tag{
      border-color: #5186ec;
      color: #5186ec;
    }
    .merit-hair .merit-head .title-line {
      background: linear-gradient(transparent 77%,#a8c2f5 0%);
      display: inline;
    }
    .merit-hair .explanation-management {
      background-color: #f9f8fc;
    }
    .merit-hair .interview-voice h2 {
      background-color: #5186ec;
    }
    .merit-hair .interview-voice-frame {
      background: repeating-linear-gradient(-45deg, #ebeaf6, #ebeaf6 2px, #f9f8fc 2px, #f9f8fc 4px);
    }
    .merit-hair .interview-voice-text::before {
      border-top-color: #5186ec;
      border-left-color: #5186ec;
    }
    .merit-hair .interview-voice-text::after {
      border-bottom-color: #5186ec;
      border-right-color: #5186ec;
    }
    .merit-hair .interview-voice .salonname  {
      color: #5186ec;
    }
    .merit-hair .contribution h2{
      color: #5186ec;
      border-color: #5186ec;
    }
    .merit-hair .contribution-inner .box {
      background-color: #f6f9fe;
    }
    .merit-hair .contribution-inner .box h4{
      background-color: #5186ec;
      color: #FFF;
    }
    .merit-hair .support .text h3{ 
      color: #5186ec;
    }
    .merit-hair .faq h4{
      color: #5186ec;
      border-color:  #5186ec;
    }
    .merit-hair .faq .box{
      border-color: #5186ec;
    }
    .merit-hair .faq .box .question{
      color: #5186ec;
    }
    .merit-hair .effect1 h3, .effect2 h3 , .effect3 h3 {
      color: #5186ec;
    }

    /* エステ */
    .merit-esthe .merit-head .text .tag{
      border-color: #51c7d9;
      color: #51c7d9;
    }
    .merit-esthe .merit-head .title-line {
      background: linear-gradient(transparent 77%,#51c7d9 0%);
      display: inline;
    }
    .merit-esthe .reserve-management{
      background-color: #f3fbfc;
    }
    .merit-esthe .headicon{
      background-color: #51c7d9;
    }
    .merit-esthe .interview-voice h2{
        background: #51c7d9;
    }
    .merit-esthe .interview-voice-frame {
        background: repeating-linear-gradient(-45deg, #e8f7fa, #e8f7fa 2px, #f3fbfc 2px, #f3fbfc 4px);
    }
    .merit-esthe .interview-voice .salonname{
        color: #17b4cc;
    }
    .merit-esthe  .interview-voice-text::before{
        border-left: solid 4px #51c7d9;
        border-top: solid 4px #51c7d9;
    }
    .merit-esthe .interview-voice-text::after{
        border-right: solid 4px #51c7d9;
        border-bottom: solid 4px #51c7d9;
    }
      .merit-esthe .contribution h2{
        color: #51c7d9;
        border-color: #51c7d9;
      }
      .merit-esthe .contribution-inner .box {
        background-color: #f3fbfc;
      }
      .merit-esthe .contribution-inner .box h4{
        background-color: #51c7d9;
        color: #FFF;
      }
    .merit-esthe .support .text h3{ 
      color: #51c7d9;
    }
    .merit-esthe .faq h4{
      color: #51c7d9;
      border-color:  #51c7d9;
    }
    .merit-esthe .faq .box{
      border-color: #51c7d9;
    }
    .merit-esthe .faq .box .question{
      color: #51c7d9;
    }
    .merit-esthe .effect1 h3,.merit-esthe .effect2 h3 , .merit-esthe .effect3 h3 {
      color: #51c7d9;
    }
    /* アイ */
    .merit-eye .merit-head .text .tag{
      border-color: #7ca4f1;
      color: #7ca4f1;
    }
    .merit-eye .merit-head .title-line {
      background: linear-gradient(transparent 77%,#d3e1fa 0%);
      display: inline;
    }
    .merit-eye .reserve-management{
      background-color: #eef3fd;
    }
    .merit-eye .headicon{
      background-color: #7ca4f1;
    }
    .merit-eye .interview-voice h2{
        background: #7ca4f1;
    }
    .merit-eye .interview-voice-frame {
        background: repeating-linear-gradient(-45deg, #ebeaf6, #ebeaf6 2px, #eef3fd 2px, #eef3fd 4px);
    }
    .merit-eye .interview-voice .salonname{
        color: #7ca4f1;
    }
    .merit-eye  .interview-voice-text::before{
        border-left: solid 4px #7ca4f1;
        border-top: solid 4px #7ca4f1;
    }
    .merit-eye .interview-voice-text::after{
        border-right: solid 4px #7ca4f1;
        border-bottom: solid 4px #7ca4f1;
    }
      .merit-eye .contribution h2{
        color: #7ca4f1;
        border-color: #7ca4f1;
      }
      .merit-eye .contribution-inner .box {
        background-color: #eef3fd;
      }
      .merit-eye .contribution-inner .box h4{
        background-color: #7ca4f1;
        color: #FFF;
      }
      .merit-eye .support .text h3{ 
        color: #7ca4f1;
      }
      .merit-eye .faq h4{
        color: #7ca4f1;
        border-color:  #7ca4f1;
      }
      .merit-eye .faq .box{
        border-color: #7ca4f1;
      }
      .merit-eye .faq .box .question{
        color: #7ca4f1;
      }
      .merit-eye .effect1 h3, .merit-eye .effect2 h3 , .merit-eye .effect3 h3 {
        color: #7ca4f1;
      }
    /* ネイル */
    .merit-nail .merit-head .text .tag{
      border-color: #a39bd4;
      color: #a39bd4;
    }
    .merit-nail .merit-head .title-line {
      background: linear-gradient(transparent 77%,#c1bce2 0%);
      display: inline;
    }
    .merit-nail .reserve-management{
      background-color: #f9f8fc;
    }
    .merit-nail .headicon{
      background-color: #a39bd4;
    }
    .merit-nail .interview-voice h2{
        background: #a39bd4;
    }
    .merit-nail .interview-voice-frame {
        background: repeating-linear-gradient(-45deg, #ebeaf6, #ebeaf6 2px, #f9f8fc 2px, #f9f8fc 4px);
    }
    .merit-nail .interview-voice .salonname{
        color: #a39bd4;
    }
    .merit-nail  .interview-voice-text::before{
        border-left: solid 4px #a39bd4;
        border-top: solid 4px #a39bd4;
    }
    .merit-nail .interview-voice-text::after{
        border-right: solid 4px #a39bd4;
        border-bottom: solid 4px #a39bd4;
    }
      .merit-nail .contribution h2{
        color: #a39bd4;
        border-color: #a39bd4;
      }
      .merit-nail .contribution-inner .box {
        background-color: #f9f8fc;
      }
      .merit-nail .contribution-inner .box h4{
        background-color: #a39bd4;
        color: #FFF;
      }
      .merit-nail .support .text h3{ 
        color: #a39bd4;
      }
      .merit-nail .faq h4{
        color: #a39bd4;
        border-color:  #a39bd4;
      }
      .merit-nail .faq .box{
        border-color: #a39bd4;
      }
      .merit-nail .faq .box .question{
        color: #a39bd4;
      }
      .merit-nail .effect1 h3,.merit-nail .effect2 h3 , .merit-nail .effect3 h3 {
        color: #a39bd4;
      }