/********************
dermatology
********************/
html:has(.bsp.dermatology) {
  scroll-padding-top: calc(80px + 3.75em);
}

@media screen and (max-width: 1023px) {
  html:has(.bsp.dermatology) {
    scroll-padding-top: calc(60px + 3.75em);
  }
}
@media screen and (max-width: 767px) {
  html:has(.bsp.dermatology) {
    scroll-padding-top: calc(60px + 10.67vw);
  }
}
/*
hero
*/
.bsp.dermatology #hero {
  font-size: min(1.25vw, 18px);
}
.bsp.dermatology #hero .hero_wrap {
  position: relative;
  margin-top: 110px;
  text-align: left;
}
.bsp.dermatology #hero .hero_wrap .ly_df {
  justify-content: space-between;
  align-items: flex-start;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_txt {
  display: flex;
  flex-direction: column;
  width: 42.34%;
  padding: 10em 0 0 1.94em;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .hero_lead {
  font-size: min(1.25vw, 18px);
  width: 11.46em;
  max-width: 206.328px;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_txt h1 {
  font-size: min(3.47vw, 50px);
  line-height: 1.7;
  margin-top: 0.3em;
  margin-left: -0.02em;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_txt h1 span {
  display: block;
  font-size: min(1.74vw, 25px);
  line-height: 3;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn {
  margin-top: 3.33em;
  width: 74.46%;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn a, .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn > span {
  position: relative;
  display: block;
  width: 100%;
  border: solid 1px #000;
  font-size: min(1.11vw, 16px);
  padding: 1.03em 0;
  text-align: center;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn a:before, .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn > span:before {
  content: "";
  position: absolute;
  width: 7.91%;
  height: 1px;
  background: #000;
  top: 50%;
  left: 84%;
  transform: translateY(-50%);
  z-index: 1;
  transition: all 0.3s;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn a:after, .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn > span:after {
  content: "";
  position: absolute;
  width: 2.3%;
  height: 1px;
  background: #000;
  top: 49.5%;
  left: 89.2%;
  z-index: 1;
  transform: translateY(-50%) rotate(35deg);
  transform-origin: bottom right;
  transition: all 0.3s;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn a:hover:before, .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn > span:hover:before {
  content: "";
  position: absolute;
  width: 9.91%;
  height: 1px;
  background: #000;
  top: 50%;
  left: 84%;
  z-index: 1;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn a:hover:after, .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn > span:hover:after {
  content: "";
  position: absolute;
  width: 2.3%;
  height: 1px;
  background: #000;
  top: 49%;
  left: 91.5%;
  z-index: 1;
  transform: rotate(35deg);
  transform-origin: bottom right;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn a + a, .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn > span + a {
  margin-top: 0.8em;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn a span, .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn > span span {
  margin-left: -2em;
  letter-spacing: -0.03em;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_img {
  width: 73.31%;
  max-width: 785px;
  position: relative;
  right: -5.65%;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_img .hero_img_l {
  width: 56.05%;
  max-width: 440px;
  margin-top: 3.33em;
  position: relative;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_img .hero_img_l img {
  width: 100%;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_img .hero_img_l .hero_ttl {
  margin-top: 1em;
  position: absolute;
  right: 0;
  width: 118%;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_img .hero_img_l .hero_ttl p {
  font-size: min(3.19vw, 46px);
  line-height: 1.15;
  font-family: "Romie", sans-serif;
  letter-spacing: 0;
  text-align: right;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_img .hero_img_r {
  width: 40.1%;
  max-width: 314.75px;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_img .hero_img_r .thumb {
  width: 100%;
}
.bsp.dermatology #hero .hero_wrap .ly_df .hero_img .hero_img_r .thumb:nth-child(2) {
  width: 84.19%;
  margin-top: 1.67em;
}

@media screen and (max-width: 1400px) {
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_img {
    right: 0;
  }

  .bsp.dermatology #hero .hero_wrap .ly_df .hero_img .hero_img_l .hero_ttl {
    width: 109%;
  }
}
@media screen and (max-width: 1023px) {
  .bsp.dermatology #hero .hero_wrap {
    margin-top: 85px;
  }
}
@media screen and (max-width: 767px) {
  .bsp.dermatology #hero .hero_wrap {
    margin-top: calc(60px + 6.67vw);
  }
  .bsp.dermatology #hero .hero_wrap .ly_df {
    position: relative;
    margin: 0 calc(50% - 50vw) 20vw;
    width: 100vw;
    height: 100%;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt {
    position: absolute;
    width: 89.33vw;
    padding: 0;
    left: 5.33vw;
    top: 52vw;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .hero_lead {
    width: 45.8507vw;
    max-width: 45.8507vw;
    height: auto;
    margin: 0;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt h1 {
    font-size: 8vw;
    line-height: 1.7;
    margin-top: 0.5em;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt h1 span {
    font-size: 4.8vw;
    line-height: 2;
    letter-spacing: 0.02em;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn {
    margin: 86.67vw auto 0;
    width: 86.67vw;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn a, .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn > span {
    font-size: 3.73vw;
    padding: 3.33vw 0;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn a:before, .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn > span:before {
    width: 5.33vw;
    left: 75vw;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn a:after, .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn > span:after {
    width: 1.5vw;
    left: 78.66vw;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn a:hover:before, .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn > span:hover:before {
    width: 5.33vw;
    left: 75vw;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn a:hover:after, .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn > span:hover:after {
    width: 1.5vw;
    left: 78.66vw;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn a + a, .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn > span + a {
    margin-top: 1.33vw;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn a span, .bsp.dermatology #hero .hero_wrap .ly_df .hero_txt .item_btn > span span {
    margin-left: -1em;
    letter-spacing: 0.08em;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_img {
    width: 100%;
    max-width: 100%;
    right: 0;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_img .hero_img_l {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    flex-direction: column-reverse;
    align-items: flex-end;
    width: 100%;
    max-width: 100%;
    margin-top: 22vw;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_img .hero_img_l img {
    width: 44.27vw;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_img .hero_img_l .hero_ttl {
    margin: 0 2.67vw 5.33vw 0;
    width: fit-content;
    position: relative;
    right: unset;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_img .hero_img_l .hero_ttl p {
    font-size: 6.13vw;
    width: 100%;
    line-height: 1.2;
    text-align: left;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_img .hero_img_r {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 52vw;
    max-width: 52vw;
    height: 170.93vw;
    position: relative;
    left: 0;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_img .hero_img_r .thumb {
    width: 30.13vw;
    left: 0;
    position: relative;
  }
  .bsp.dermatology #hero .hero_wrap .ly_df .hero_img .hero_img_r .thumb:nth-child(2) {
    width: 100%;
    margin-top: 0;
  }
}
/*
bg
*/
.bsp.dermatology .bg {
  font-size: min(1.25vw, 18px);
  margin-top: 8.33vw;
}
.bsp.dermatology .bg img {
  width: 74.31vw;
  /*max-width: 1070px;*/
}

@media screen and (max-width: 767px) {
  .bsp.dermatology .bg {
    margin-top: 26.67vw;
  }
  .bsp.dermatology .bg img {
    width: 90.13vw;
  }
}
/*
about
*/
.bsp.dermatology #about {
  font-size: min(1.25vw, 18px);
  margin-top: 8.33em;
}
.bsp.dermatology #about .about_wrap .about_txt {
  text-align: center;
}
.bsp.dermatology #about .about_wrap .about_txt .about_lead {
  width: 18.19em;
  max-width: 327.5px;
  margin: 2.06em auto 0;
}
.bsp.dermatology #about .about_wrap .about_txt h2 {
  font-size: min(2.43vw, 35px);
  line-height: 2.37;
  margin-top: 0.7em;
  margin-left: -0.03em;
}
.bsp.dermatology #about .about_wrap .ly_df {
  justify-content: space-between;
  margin-top: 4.89em;
}
.bsp.dermatology #about .about_wrap .ly_df .about_main_txt {
  width: 46.77%;
  max-width: 580px;
  padding: 0 3%;
  margin-top: -1.2em;
}
.bsp.dermatology #about .about_wrap .ly_df .about_main_txt p {
  font-size: min(1.04vw, 15px);
  line-height: 2.73;
  margin-top: 0.8em;
}
.bsp.dermatology #about .about_wrap .ly_df .about_main_txt p + p {
  margin-top: 2em;
}
.bsp.dermatology #about .about_wrap .ly_df .about_img {
  width: 49.92%;
  max-width: 619px;
}
.bsp.dermatology #about .about_wrap .ly_df .about_img .about_ttl {
  margin-top: 1em;
}
.bsp.dermatology #about .about_wrap .ly_df .about_img .about_ttl p {
  font-size: min(2.78vw, 40px);
  line-height: 1.15;
  font-family: "Romie", sans-serif;
  letter-spacing: 0;
}

@media screen and (max-width: 767px) {
  .bsp.dermatology #about {
    margin-top: 16vw;
  }
  .bsp.dermatology #about .about_wrap .about_txt {
    text-align: center;
  }
  .bsp.dermatology #about .about_wrap .about_txt .about_lead {
    width: 62.38vw;
    max-width: 62.38vw;
    margin: 2.06em auto 0;
  }
  .bsp.dermatology #about .about_wrap .about_txt h2 {
    font-size: 5.33vw;
    line-height: 1.2;
    margin-top: 5.33vw;
    margin-left: -0.03em;
  }
  .bsp.dermatology #about .about_wrap .ly_df {
    flex-direction: column;
    margin-top: 10.67vw;
  }
  .bsp.dermatology #about .about_wrap .ly_df .about_main_txt {
    width: 100%;
    padding: 0;
  }
  .bsp.dermatology #about .about_wrap .ly_df .about_main_txt p {
    font-size: 3.2vw;
    margin-top: 0;
  }
  .bsp.dermatology #about .about_wrap .ly_df .about_main_txt p + p {
    margin-top: 3em;
  }
  .bsp.dermatology #about .about_wrap .ly_df .about_img {
    width: 72vw;
    max-width: 72vw;
    margin-top: 13.33vw;
    position: relative;
    right: -21.33vw;
  }
  .bsp.dermatology #about .about_wrap .ly_df .about_img .about_ttl {
    margin-top: 4vw;
  }
  .bsp.dermatology #about .about_wrap .ly_df .about_img .about_ttl p {
    font-size: 5.33vw;
  }
}
/*
feature
*/
.bsp.dermatology #feature {
  margin-top: 6.67em;
  font-size: min(1.25vw, 18px);
  position: relative;
}
.bsp.dermatology #feature .ly_df {
  justify-content: space-between;
}
.bsp.dermatology #feature .ly_df .thumb_img {
  width: 32.42%;
  max-width: 402px;
}
.bsp.dermatology #feature .ly_df .thumb_img:nth-child(2) {
  margin-top: 19.72em;
  position: relative;
  right: -0.65%;
  width: 37.1%;
  max-width: 460px;
}
.bsp.dermatology #feature .feature_txt {
  position: absolute;
  text-align: center;
  font-size: min(1.25vw, 18px);
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  margin-top: 6.67em;
}
.bsp.dermatology #feature .feature_txt h2 {
  font-size: min(2.43vw, 35px);
  line-height: 1.22;
  letter-spacing: 0.1em;
}
.bsp.dermatology #feature .feature_txt p {
  font-size: min(1.74vw, 25px);
  margin-top: 1.5em;
  line-height: 2;
}
.bsp.dermatology #feature .feature_txt .thumb {
  width: 79.46%;
  max-width: 488px;
  margin: 1.67em auto 0;
}
.bsp.dermatology #feature .feature_wrap {
  margin-top: 3.33em;
  font-size: min(1.25vw, 18px);
}
.bsp.dermatology #feature .feature_wrap .feature_wrap_txt {
  font-size: min(1.25vw, 18px);
}
.bsp.dermatology #feature .feature_wrap .feature_wrap_txt p {
  font-size: min(1.04vw, 15px);
  line-height: 2.73;
  text-align: center;
}
.bsp.dermatology #feature .feature_wrap .feature_wrap_txt p + p {
  margin-top: 2.7em;
}
.bsp.dermatology #feature .feature_wrap .bl_feature_list {
  display: flex;
  justify-content: space-between;
  margin-top: 3.33em;
}
.bsp.dermatology #feature .feature_wrap .bl_feature_list > .thumb {
  display: none;
}
.bsp.dermatology #feature .feature_wrap .bl_feature_list .feature_item {
  width: 31.45%;
  height: 11.33em;
  border: 1px solid #CBC3AC;
  background: #F4F3F0;
  padding: 1.8em 2.2em 2.2em;
}
.bsp.dermatology #feature .feature_wrap .bl_feature_list .feature_item p {
  font-size: min(0.97vw, 14px);
  line-height: 2;
  text-align: left;
  margin-top: 0.5em;
}
.bsp.dermatology #feature .feature_wrap .bl_feature_list .feature_item p.feature_item_ttl {
  font-size: min(1.39vw, 20px);
  text-align: center;
  margin-top: 0;
}

@media screen and (max-width: 767px) {
  .bsp.dermatology #feature {
    margin-top: 16vw;
  }
  .bsp.dermatology #feature .ly_df .thumb_img {
    position: relative;
    width: 37.07vw;
    max-width: 37.07vw;
    left: -6.67vw;
    margin-top: 34.67vw;
  }
  .bsp.dermatology #feature .ly_df .thumb_img:nth-child(2) {
    left: unset;
    right: -6.67vw;
    width: 44.53vw;
    max-width: 44.53vw;
    margin-top: 88.67vw;
  }
  .bsp.dermatology #feature .feature_txt {
    margin-top: 0;
    width: 100%;
  }
  .bsp.dermatology #feature .feature_txt h2 {
    font-size: 5.33vw;
  }
  .bsp.dermatology #feature .feature_txt p {
    font-size: 4.27vw;
    margin-top: 5.33vw;
    line-height: 1.81;
  }
  .bsp.dermatology #feature .feature_txt .thumb {
    width: 75.47vw;
    max-width: 75.47vw;
    margin: 30.66vw auto 0;
  }
  .bsp.dermatology #feature .feature_wrap {
    margin-top: 8vw;
  }
  .bsp.dermatology #feature .feature_wrap .feature_wrap_txt p {
    font-size: 3.2vw;
    line-height: 2.5;
    text-align: left;
  }
  .bsp.dermatology #feature .feature_wrap .bl_feature_list {
    flex-wrap: wrap;
    margin-top: 39vw;
  }
  .bsp.dermatology #feature .feature_wrap .bl_feature_list > .thumb {
    display: block;
    position: absolute;
    z-index: -1;
    left: -6.67vw;
    top: -25.33vw;
    width: 54.67vw;
  }
  .bsp.dermatology #feature .feature_wrap .bl_feature_list .feature_item {
    width: 100%;
    height: 39.2vw;
    padding: 5.33vw 6.67vw 8vw;
  }
  .bsp.dermatology #feature .feature_wrap .bl_feature_list .feature_item p {
    font-size: 3.2vw;
    margin-top: 0.7em;
  }
  .bsp.dermatology #feature .feature_wrap .bl_feature_list .feature_item p.feature_item_ttl {
    font-size: 3.73vw;
  }
  .bsp.dermatology #feature .feature_wrap .bl_feature_list .feature_item + .feature_item {
    margin-top: 2.67vw;
  }
}
/*
introduction
*/
.bsp.dermatology #introduction {
  font-size: min(1.25vw, 18px);
  position: relative;
  margin-top: 8em;
  text-align: left;
}
.bsp.dermatology #introduction .ly_df {
  justify-content: space-between;
}
.bsp.dermatology #introduction .ly_df .introduction_txt {
  width: 38.56%;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .introduction_lead {
  font-size: min(1.25vw, 18px);
  width: 18.05em;
  max-width: 324.92px;
  margin-left: 0;
}
.bsp.dermatology #introduction .ly_df .introduction_txt h2 {
  font-size: min(2.78vw, 40px);
  line-height: 2.13;
  margin-top: 0.73em;
  margin-left: -0.08em;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 4.44em;
  text-align: left;
  width: 100%;
  border-top: 1px solid #CBC3AC;
  padding: 1.67em 0;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item + .introduction_item {
  border-bottom: 1px solid #CBC3AC;
  margin-top: 0;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item > img {
  width: 27.2%;
  max-width: 130px;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_txt {
  margin-left: 8.51%;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_txt p {
  font-size: min(1.74vw, 25px);
}
.bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_txt p span {
  display: block;
  font-size: min(0.97vw, 14px);
  line-height: 2;
  margin-bottom: 0.4em;
  letter-spacing: 0.05em;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_txt .img_wrap {
  align-self: flex-end;
  margin-bottom: 0.4em;
  margin-left: -1em;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_txt .img_wrap img {
  height: 0.57em;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_btn {
  margin-top: 1.56em;
  width: 64.63%;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_btn a, .bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_btn > span {
  position: relative;
  display: block;
  width: 100%;
  border: solid 1px #000;
  font-size: min(1.11vw, 16px);
  padding: 1.03em 0;
  text-align: center;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_btn a:before, .bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_btn > span:before {
  content: "";
  position: absolute;
  width: 7.91%;
  height: 1px;
  background: #000;
  top: 50%;
  left: 84%;
  transform: translateY(-50%);
  z-index: 1;
  transition: all 0.3s;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_btn a:after, .bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_btn > span:after {
  content: "";
  position: absolute;
  width: 2.3%;
  height: 1px;
  background: #000;
  top: 49.5%;
  left: 89.2%;
  z-index: 1;
  transform: translateY(-50%) rotate(35deg);
  transform-origin: bottom right;
  transition: all 0.3s;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_btn a:hover:before, .bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_btn > span:hover:before {
  content: "";
  position: absolute;
  width: 9.91%;
  height: 1px;
  background: #000;
  top: 50%;
  left: 84%;
  z-index: 1;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_btn a:hover:after, .bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_btn > span:hover:after {
  content: "";
  position: absolute;
  width: 2.3%;
  height: 1px;
  background: #000;
  top: 49%;
  left: 91.5%;
  z-index: 1;
  transform: rotate(35deg);
  transform-origin: bottom right;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_btn a + a, .bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_btn > span + a {
  margin-top: 0.8em;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_btn a span, .bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_btn > span span {
  margin-left: -2em;
  letter-spacing: 0.03em;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .item_btn {
  margin-top: 4.44em;
  width: 69.57%;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .item_btn a, .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn > span {
  position: relative;
  display: block;
  width: 100%;
  border: solid 1px #000;
  font-size: min(1.11vw, 16px);
  padding: 1.03em 0;
  text-align: center;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .item_btn a:before, .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn > span:before {
  content: "";
  position: absolute;
  width: 7.91%;
  height: 1px;
  background: #000;
  top: 50%;
  left: 84%;
  transform: translateY(-50%);
  z-index: 1;
  transition: all 0.3s;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .item_btn a:after, .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn > span:after {
  content: "";
  position: absolute;
  width: 2.3%;
  height: 1px;
  background: #000;
  top: 49.5%;
  left: 89.2%;
  z-index: 1;
  transform: translateY(-50%) rotate(35deg);
  transform-origin: bottom right;
  transition: all 0.3s;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .item_btn a:hover:before, .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn > span:hover:before {
  content: "";
  position: absolute;
  width: 9.91%;
  height: 1px;
  background: #000;
  top: 50%;
  left: 84%;
  z-index: 1;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .item_btn a:hover:after, .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn > span:hover:after {
  content: "";
  position: absolute;
  width: 2.3%;
  height: 1px;
  background: #000;
  top: 49%;
  left: 91.5%;
  z-index: 1;
  transform: rotate(35deg);
  transform-origin: bottom right;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .item_btn a + a, .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn > span + a {
  margin-top: 0.8em;
}
.bsp.dermatology #introduction .ly_df .introduction_txt .item_btn a span, .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn > span span {
  margin-left: -2em;
  letter-spacing: -0.03em;
}
.bsp.dermatology #introduction .ly_df .introduction_img {
  width: 59.03%;
  max-width: 732px;
  margin-top: 4.44em;
}
.bsp.dermatology #introduction .ly_df .introduction_img .introduction_img_l {
  width: 34.97%;
  max-width: 256px;
  align-self: flex-end;
}
.bsp.dermatology #introduction .ly_df .introduction_img .introduction_img_l img {
  width: 100%;
}
.bsp.dermatology #introduction .ly_df .introduction_img .introduction_img_r {
  font-size: min(1.25vw, 18px);
  width: 61.61%;
  max-width: 451px;
  margin-bottom: 5.39em;
}
.bsp.dermatology #introduction .ly_df .introduction_img .introduction_img_r .thumb {
  width: 100%;
}
.bsp.dermatology #introduction .ly_df .introduction_img .introduction_img_r .thumb:nth-child(2) {
  width: 84.19%;
  margin-top: 1.67em;
}
.bsp.dermatology #introduction .bl_certificate {
  justify-content: space-between;
  align-items: center;
  margin-top: 5.56em;
  border: 1px solid #CBC3AC;
  padding: 5.65% 4.84%;
}
.bsp.dermatology #introduction .bl_certificate .thumb_img {
  width: 26.5%;
  max-width: 300px;
}
.bsp.dermatology #introduction .bl_certificate .bl_certificate_txt {
  width: 68.3%;
}
.bsp.dermatology #introduction .bl_certificate .bl_certificate_txt h3 {
  font-size: min(1.74vw, 25px);
}
.bsp.dermatology #introduction .bl_certificate .bl_certificate_txt p {
  font-size: min(1.04vw, 15px);
  line-height: 2.73;
  margin-top: 1em;
  letter-spacing: 0.05em;
}

@media screen and (max-width: 767px) {
  .bsp.dermatology #introduction {
    margin-top: 26.67vw;
  }
  .bsp.dermatology #introduction .ly_df {
    flex-direction: column-reverse;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    padding: 0;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt .introduction_lead {
    width: 72.21vw;
    max-width: 72.21vw;
    margin-top: 0;
    margin-left: 0;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt h2 {
    font-size: 5.33vw;
    margin: 5.33vw 0 auto;
    line-height: 1.2;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item {
    margin-top: 97.33vw;
    margin-bottom: 0;
    flex-direction: row-reverse;
    padding: 5.22vw 0;
    justify-content: space-between;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item + .introduction_item {
    margin-top: 0;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item > img {
    width: 25.33vw;
    max-width: 25.33vw;
    margin-right: 4vw;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_txt {
    margin-left: 0;
    flex-direction: column;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_txt p {
    font-size: 4.8vw;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_txt p span {
    font-size: 3.2vw;
    margin-bottom: 0.5em;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_txt .img_wrap {
    width: 100%;
    margin-bottom: 0.4em;
    margin-left: -1em;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt .introduction_item .item_txt .img_wrap img {
    margin-top: 2.2em;
    height: 3.12vw;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn {
    margin: 8vw auto 0;
    width: 86.67vw;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn a, .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn > span {
    font-size: 3.73vw;
    padding: 3.33vw 0;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn a:before, .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn > span:before {
    width: 5.33vw;
    left: 75vw;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn a:after, .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn > span:after {
    width: 1.5vw;
    left: 78.66vw;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn a:hover:before, .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn > span:hover:before {
    width: 5.33vw;
    left: 75vw;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn a:hover:after, .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn > span:hover:after {
    width: 1.5vw;
    left: 78.66vw;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn a + a, .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn > span + a {
    margin-top: 1.33vw;
  }
  .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn a span, .bsp.dermatology #introduction .ly_df .introduction_txt .item_btn > span span {
    margin-left: -1em;
    letter-spacing: 0.08em;
  }
  .bsp.dermatology #introduction .ly_df .introduction_img {
    position: absolute;
    top: 26.66vw;
    left: 0;
    flex-direction: row;
    width: 100%;
    max-width: 100%;
    margin-top: 0;
  }
  .bsp.dermatology #introduction .ly_df .introduction_img .introduction_img_l {
    width: 34.93vw;
    max-width: 34.93vw;
    align-self: flex-start;
    margin: 0 0 0 6.67vw;
  }
  .bsp.dermatology #introduction .ly_df .introduction_img .introduction_img_r {
    width: 55.73vw;
    max-width: 55.73vw;
    margin: 10.67vw 0 0 0;
  }
  .bsp.dermatology #introduction .ly_df .introduction_img .introduction_img_r .thumb {
    width: 100%;
  }
  .bsp.dermatology #introduction .ly_df .introduction_img .introduction_img_r .thumb:nth-child(2) {
    width: 84.19%;
    margin-top: 1.67em;
  }
  .bsp.dermatology #introduction .bl_certificate {
    margin-top: 16vw;
    padding: 8vw 3.478vw;
  }
  .bsp.dermatology #introduction .bl_certificate .thumb_img {
    position: absolute;
    width: 80vw;
    max-width: 80vw;
    top: 26.67vw;
    left: 50%;
    transform: translateX(-50%);
  }
  .bsp.dermatology #introduction .bl_certificate .bl_certificate_txt {
    width: 100%;
    padding: 0 2.67vw;
  }
  .bsp.dermatology #introduction .bl_certificate .bl_certificate_txt h3 {
    font-size: 3.73vw;
    text-align: center;
    line-height: 2;
  }
  .bsp.dermatology #introduction .bl_certificate .bl_certificate_txt p {
    font-size: 3.2vw;
    line-height: 2;
    margin-top: 70.66vw;
  }
}
/*
staff
*/
.bsp.dermatology #staff {
  margin-top: 23.33em;
  font-size: min(1.25vw, 18px);
}
.bsp.dermatology #staff .ly_df {
  position: relative;
  z-index: 0;
}
.bsp.dermatology #staff .ly_df .thumb_img {
  position: absolute;
  right: -7.45%;
  top: -5.83em;
  width: 82.26%;
  max-width: 1020px;
}
.bsp.dermatology #staff .ly_df .staff_ttl {
  position: absolute;
  right: -4.74%;
  top: -11.67em;
  font-size: min(1.25vw, 18px);
  width: auto;
  max-width: unset;
}
.bsp.dermatology #staff .ly_df .staff_ttl p {
  font-size: min(2.78vw, 40px);
  line-height: 1.15;
  font-family: "Romie", sans-serif;
  letter-spacing: 0;
}
.bsp.dermatology #staff .staff_txt {
  position: relative;
  font-size: min(1.25vw, 18px);
  overflow: hidden;
}
.bsp.dermatology #staff .staff_txt .staff_lead {
  font-size: min(1.25vw, 18px);
  width: 2.42em;
  max-width: 43.51px;
}
.bsp.dermatology #staff .staff_txt h2 {
  font-size: min(2.78vw, 40px);
  line-height: 1.2;
  letter-spacing: 0.1em;
  margin-top: 1.2em;
  margin-left: -0.1em;
}
.bsp.dermatology #staff .staff_txt .staff_wrap {
  margin: 8.89em auto 0;
  width: 100%;
  max-width: 1240px;
}
.bsp.dermatology #staff .staff_txt .staff_wrap .ly_df {
  flex-wrap: wrap;
  max-width: 920px;
  width: 74.1935%;
  margin: auto;
}
.bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 30.43%;
  margin-bottom: 2.78em;
  text-align: left;
}
.bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item + .staff_item {
  margin-left: 4.355%;
}
.bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item:nth-child(4) {
  margin-left: 0;
}
.bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_txt p {
  font-size: min(1.74vw, 25px);
  margin-top: 1em;
}
.bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_txt p span {
  display: block;
  font-size: min(1.11vw, 16px);
  margin: 0.2em 0;
}
.bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_txt > img {
  margin-top: 0.8em;
  height: 0.65em;
}
.bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_shoulder {
  display: block;
  font-size: min(0.97vw, 14px);
  line-height: 2;
  margin-top: 1.29em;
  letter-spacing: 0.02em;
  margin-bottom: auto;
}
.bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn {
  margin-top: 1.7em;
}
.bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn a, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn > span {
  position: relative;
  display: block;
  width: 100%;
  border: solid 1px #000;
  font-size: min(1.11vw, 16px);
  padding: 1.03em 0;
  text-align: center;
}
.bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn a:before, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn > span:before {
  content: "";
  position: absolute;
  width: 7.91%;
  height: 1px;
  background: #000;
  top: 50%;
  left: 84%;
  transform: translateY(-50%);
  z-index: 1;
  transition: all 0.3s;
}
.bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn a:after, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn > span:after {
  content: "";
  position: absolute;
  width: 2.3%;
  height: 1px;
  background: #000;
  top: 49.5%;
  left: 89.2%;
  z-index: 1;
  transform: translateY(-50%) rotate(35deg);
  transform-origin: bottom right;
  transition: all 0.3s;
}
.bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn a:hover:before, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn > span:hover:before {
  content: "";
  position: absolute;
  width: 9.91%;
  height: 1px;
  background: #000;
  top: 50%;
  left: 84%;
  z-index: 1;
}
.bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn a:hover:after, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn > span:hover:after {
  content: "";
  position: absolute;
  width: 2.3%;
  height: 1px;
  background: #000;
  top: 49%;
  left: 91.5%;
  z-index: 1;
  transform: rotate(35deg);
  transform-origin: bottom right;
}
.bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn a + a, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn > span + a {
  margin-top: 0.8em;
}
.bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn a span, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn > span span {
  margin-left: -2em;
  letter-spacing: -0.03em;
}
.bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item:nth-child(3) .item_btn {
  margin-top: 1.48em;
}
.bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item:nth-child(1) .item_btn, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item:nth-child(2) .item_btn, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item:nth-child(3) .item_btn {
  min-height: 7.44em;
}
.bsp.dermatology #staff .staff_txt .btn {
  display: block;
  width: 12.38em;
  max-width: 222.32px;
  margin: 3.3em auto 0;
  position: relative;
  padding-bottom: 1em;
}
.bsp.dermatology #staff .staff_txt .btn img {
  width: 10.33em;
  max-width: 185.94px;
}
.bsp.dermatology #staff .staff_txt .btn:before {
  content: "";
  position: absolute;
  width: 96%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 0;
  z-index: 1;
  transition: all 0.3s;
}
.bsp.dermatology #staff .staff_txt .btn:after {
  content: "";
  position: absolute;
  width: 3%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 93%;
  z-index: 1;
  transform: rotate(35deg);
  transition: all 0.3s;
  transform-origin: bottom right;
}
.bsp.dermatology #staff .staff_txt .btn:hover:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 0;
  z-index: 1;
}
.bsp.dermatology #staff .staff_txt .btn:hover:after {
  content: "";
  position: absolute;
  width: 3%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 97%;
  z-index: 1;
  transform: rotate(35deg);
}

@media screen and (max-width: 1380px) {
  .bsp.dermatology #staff .ly_df .staff_ttl {
    right: 0;
  }
}
@media screen and (max-width: 767px) {
  .bsp.dermatology #staff {
    margin-top: 118.67vw;
    padding-bottom: 0;
  }
  .bsp.dermatology #staff .ly_df {
    position: relative;
    z-index: 0;
  }
  .bsp.dermatology #staff .ly_df .thumb_img {
    right: -6.67vw;
    top: -92vw;
    width: 60vw;
    max-width: 60vw;
  }
  .bsp.dermatology #staff .ly_df .staff_ttl {
    left: 0;
    top: -82.67vw;
    /*width: 64.86vw; max-width: 64.86vw;*/
    width: auto;
    max-width: unset;
  }
  .bsp.dermatology #staff .ly_df .staff_ttl p {
    font-size: 5.33vw;
    line-height: 1.15;
    font-family: "Romie", sans-serif;
    letter-spacing: 0;
  }
  .bsp.dermatology #staff .staff_txt .staff_lead {
    width: 9.67vw;
    max-width: 9.67vw;
  }
  .bsp.dermatology #staff .staff_txt h2 {
    font-size: 5.33vw;
    margin-top: 5.33vw;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap {
    margin-top: 10.67vw;
    width: 100%;
    max-width: 100%;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df {
    max-width: 100%;
    width: 100%;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item {
    width: 100%;
    margin-bottom: 16vw;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item > picture img {
    width: 34.67vw;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item + .staff_item {
    margin: 0 0 16vw;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_txt {
    width: 45.33vw;
    position: absolute;
    top: 8vw;
    right: 0;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_txt p {
    font-size: 4.8vw;
    margin-top: 0;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_txt p span {
    font-size: 3.2vw;
    margin: 0.5em 0;
    letter-spacing: 0.05em;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_txt > img {
    margin-top: 2vw;
    height: 3.11vw;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_shoulder {
    font-size: 3.2vw;
    margin-top: 5.33vw;
    width: 100%;
    line-height: 1.83;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn {
    margin-top: 6.67vw;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn a, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn > span {
    font-size: 3.73vw;
    padding: 3.33vw 0;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn a:before, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn > span:before {
    width: 5.33vw;
    left: 75vw;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn a:after, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn > span:after {
    width: 1.5vw;
    left: 78.66vw;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn a:hover:before, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn > span:hover:before {
    width: 5.33vw;
    left: 75vw;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn a:hover:after, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn > span:hover:after {
    width: 1.5vw;
    left: 78.66vw;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn a + a, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn > span + a {
    margin-top: 1.33vw;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn a span, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item .item_btn > span span {
    margin-left: -1em;
    letter-spacing: 0.08em;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item:nth-child(3) .item_btn {
    margin-top: 6.67vw;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item:nth-child(1) .item_btn, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item:nth-child(2) .item_btn, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item:nth-child(3) .item_btn {
    min-height: unset;
  }
  .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item:nth-child(5) .item_btn, .bsp.dermatology #staff .staff_txt .staff_wrap .ly_df .staff_item:nth-child(6) .item_btn {
    margin-top: 8vw;
  }
  .bsp.dermatology #staff .staff_txt .btn {
    display: block;
    width: 59.29vw;
    max-width: 59.29vw;
    margin: 0;
    padding-bottom: 4vw;
  }
  .bsp.dermatology #staff .staff_txt .btn img {
    width: 49.58vw;
    max-width: 49.58vw;
  }
  .bsp.dermatology #staff .staff_txt .btn:before {
    width: 100%;
  }
  .bsp.dermatology #staff .staff_txt .btn:after {
    left: 97%;
  }
}
/*
treatment_menu
*/
.bsp.dermatology #treatment_menu {
  font-size: min(1.25vw, 18px);
  margin-top: 19.17em;
  background: #E8E5DC;
  padding: 5.56em 0;
}
.bsp.dermatology #treatment_menu .bl_inner {
  position: relative;
}
.bsp.dermatology #treatment_menu .thumb_img {
  position: absolute;
  right: -6.06%;
  top: -13.89em;
  width: 44.93vw;
  max-width: 647px;
  z-index: 0;
}
.bsp.dermatology #treatment_menu .menu_dermatology {
  position: relative;
  color: #000;
}
.bsp.dermatology #treatment_menu .menu_dermatology .menu_lead {
  position: relative;
  font-size: min(1.25vw, 18px);
  width: 7.69em;
  max-width: 138.43px;
}
.bsp.dermatology #treatment_menu .menu_dermatology h2 {
  font-size: min(2.43vw, 35px);
  line-height: 2;
  margin-top: 0.5em;
  margin-left: -0.03em;
}
.bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap {
  margin-top: 3.6em;
}
.bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list .menu_item {
  width: 33.06%;
}
.bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list .menu_item a {
  display: flex;
  align-items: center;
  background: #F4F3F0;
  background-size: 20px 4px;
  margin-bottom: 0.98%;
  height: 5.56em;
  padding: 0 1.39em;
  position: relative;
}
.bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list .menu_item a:before {
  content: "";
  position: absolute;
  width: 6.328%;
  height: 1px;
  background: #000;
  top: 50%;
  left: 88%;
  z-index: 1;
  transition: all 0.3s;
}
.bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list .menu_item a:after {
  content: "";
  position: absolute;
  width: 2%;
  height: 1px;
  background: #000;
  top: 50%;
  left: 92.2%;
  z-index: 1;
  transform: rotate(45deg);
  transform-origin: bottom right;
  transition: all 0.3s;
}
.bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list .menu_item a:hover:before {
  width: 8%;
}
.bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list .menu_item a:hover:after {
  left: 94%;
}
.bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list .menu_item a > span {
  display: block;
  width: 17.07%;
  margin-right: 1.39em;
}
.bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list .menu_item a > span img {
  width: 100%;
}
.bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list .menu_item a:hover > span img {
  transform: scale(1.1);
}
.bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list .menu_item p {
  font-size: min(1.25vw, 18px);
  padding: 0.8em 0;
  text-align: center;
}
.bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list .menu_item + .menu_item {
  margin-left: 0.37%;
}
.bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list .menu_item:nth-child(5) {
  margin-left: 0;
}
.bsp.dermatology #treatment_menu .menu_dermatology .btn {
  display: block;
  width: 17.33em;
  max-width: 312px;
  margin: 3.61em 0 0 auto;
  position: relative;
  padding-bottom: 1em;
}
.bsp.dermatology #treatment_menu .menu_dermatology .btn img {
  width: 15.2em;
  max-width: 273.56px;
}
.bsp.dermatology #treatment_menu .menu_dermatology .btn:before {
  content: "";
  position: absolute;
  width: 96%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 0;
  z-index: 1;
  transition: all 0.3s;
}
.bsp.dermatology #treatment_menu .menu_dermatology .btn:after {
  content: "";
  position: absolute;
  width: 3%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 93%;
  z-index: 1;
  transform: rotate(35deg);
  transition: all 0.3s;
  transform-origin: bottom right;
}
.bsp.dermatology #treatment_menu .menu_dermatology .btn:hover:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 0;
  z-index: 1;
}
.bsp.dermatology #treatment_menu .menu_dermatology .btn:hover:after {
  content: "";
  position: absolute;
  width: 3%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 97%;
  z-index: 1;
  transform: rotate(35deg);
}
.bsp.dermatology #treatment_menu .treatment_menu_price {
  margin-top: 2.94em;
}
.bsp.dermatology #treatment_menu .treatment_menu_price .treatment_menu_lead {
  position: relative;
  font-size: min(1.25vw, 18px);
  width: 4.58em;
  max-width: 82.48px;
}
.bsp.dermatology #treatment_menu .treatment_menu_price h2 {
  font-size: min(2.43vw, 35px);
  line-height: 2;
  margin-top: 0.5em;
  margin-left: -0.03em;
}
.bsp.dermatology #treatment_menu .treatment_menu_price > .btn {
  display: block;
  width: 15.33em;
  max-width: 276px;
  margin: 3.61em 0 0 auto;
  position: relative;
  padding-bottom: 1em;
}
.bsp.dermatology #treatment_menu .treatment_menu_price > .btn img {
  width: 13.26em;
  max-width: 238.76px;
}
.bsp.dermatology #treatment_menu .treatment_menu_price > .btn:before {
  content: "";
  position: absolute;
  width: 96%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 0;
  z-index: 1;
  transition: all 0.3s;
}
.bsp.dermatology #treatment_menu .treatment_menu_price > .btn:after {
  content: "";
  position: absolute;
  width: 3%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 93%;
  z-index: 1;
  transform: rotate(35deg);
  transition: all 0.3s;
  transform-origin: bottom right;
}
.bsp.dermatology #treatment_menu .treatment_menu_price > .btn:hover:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 0;
  z-index: 1;
}
.bsp.dermatology #treatment_menu .treatment_menu_price > .btn:hover:after {
  content: "";
  position: absolute;
  width: 3%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 97%;
  z-index: 1;
  transform: rotate(35deg);
}

@media screen and (max-width: 767px) {
  .bsp.dermatology #treatment_menu {
    margin-top: 58.67vw;
    padding: 37.33vw 0 26.67vw;
  }
  .bsp.dermatology #treatment_menu .thumb_img {
    right: 0;
    top: -69.33vw;
    width: 74.13vw;
    max-width: 74.13vw;
  }
  .bsp.dermatology #treatment_menu .menu_dermatology {
    width: 100vw;
    margin: 0 calc(50% - 50vw);
  }
  .bsp.dermatology #treatment_menu .menu_dermatology .menu_lead {
    width: 30.76vw;
    max-width: 30.76vw;
    margin: 0 6.67vw;
  }
  .bsp.dermatology #treatment_menu .menu_dermatology h2 {
    font-size: 5.33vw;
    margin: 5.33vw 6.67vw 0;
    line-height: 1.2;
  }
  .bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap {
    margin-top: 9.33vw;
  }
  .bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list {
    flex-wrap: nowrap;
  }
  .bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list .menu_item {
    width: 80vw;
  }
  .bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list .menu_item a {
    margin-bottom: 2.67vw;
    height: 13.33vw;
    padding: 0 2.67vw;
    border: solid 1px #CBC3AC;
  }
  .bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list .menu_item a > span {
    width: 10.13vw;
    height: 10.13vw;
    margin-right: 4vw;
  }
  .bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list .menu_item p {
    font-size: 3.73vw;
    padding: 0.8em 0;
    text-align: center;
  }
  .bsp.dermatology #treatment_menu .menu_dermatology .menu_wrap .splide__list .menu_item + .menu_item {
    margin-left: 0;
  }
  .bsp.dermatology #treatment_menu .menu_dermatology .btn {
    width: 83.21vw;
    max-width: 83.21vw;
    margin: 22.67vw auto 0;
    padding-bottom: 4vw;
  }
  .bsp.dermatology #treatment_menu .menu_dermatology .btn img {
    width: 72.95vw;
    max-width: 72.95vw;
  }
  .bsp.dermatology #treatment_menu .menu_dermatology .btn:before {
    width: 100%;
  }
  .bsp.dermatology #treatment_menu .menu_dermatology .btn:after {
    left: 97%;
  }
  .bsp.dermatology #treatment_menu .menu_dermatology .splide__arrow {
    top: 48%;
  }
  .bsp.dermatology #treatment_menu .menu_dermatology .splide__pagination {
    bottom: -8vw;
  }
  .bsp.dermatology #treatment_menu .treatment_menu_price {
    margin-top: 26.67vw;
  }
  .bsp.dermatology #treatment_menu .treatment_menu_price .treatment_menu_lead {
    width: 18.33vw;
    max-width: 18.33vw;
    transform: translate3d(0, 0, 0);
  }
  .bsp.dermatology #treatment_menu .treatment_menu_price h2 {
    font-size: 5.33vw;
    margin: 5.33vw 0 0;
    line-height: 1.2;
  }
  .bsp.dermatology #treatment_menu .treatment_menu_price > .btn {
    width: 73.6vw;
    max-width: 73.6vw;
    margin: 16vw auto 0;
    padding-bottom: 4vw;
  }
  .bsp.dermatology #treatment_menu .treatment_menu_price > .btn img {
    width: 63.67vw;
    max-width: 63.67vw;
  }
  .bsp.dermatology #treatment_menu .treatment_menu_price > .btn:before {
    width: 100%;
  }
  .bsp.dermatology #treatment_menu .treatment_menu_price > .btn:after {
    left: 97%;
  }
  .bsp.dermatology #treatment_menu .splide__pagination {
    bottom: -10.67vw;
  }
  .bsp.dermatology #treatment_menu .splide__pagination__page {
    border: 1px solid #000;
  }
  .bsp.dermatology #treatment_menu .splide__pagination__page.is-active {
    background: #000;
  }
}




/*
case
*/
.bsp.dermatology #case {
  background: #F4F3F0;
  padding: 5.7em 0 0;
  font-size: min(1.25vw, 18px);
}
.bsp.dermatology #case .case_txt {
  position: relative;
  text-align: center;
}
.bsp.dermatology #case .case_txt .case_lead {
  width: 2.05em;
  max-width: 36.92px;
  margin: auto;
}
.bsp.dermatology #case .case_txt h2 {
  font-size: min(2.78vw, 40px);
  line-height: 1.2;
  letter-spacing: 0.1em;
  margin-top: 1.2em;
}
.bsp.dermatology #case .case_txt .case_wrap {
  margin-top: 3.6em;
}
.bsp.dermatology #case .case_txt .case_wrap .bl_case_list {
  margin: 0 auto;
  position: relative;
  padding-bottom: 2.97em;
  margin-top: 1em;
}
.bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide {
  display: flex;
  flex-direction: column;
  width: 18.06%;
  text-align: left;
  background: #E5E2D9;
}
.bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide > a {
  display: block;
  align-self: start;
  overflow: hidden;
}
.bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide .case_item_txt {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  padding: 1.39em;
  min-height: 11.44em;
}
.bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide .case_item_txt a.tag {
  display: inline-block;
  font-size: min(0.76vw, 11px);
  width: 6.73em;
  height: 1.82em;
  background: #fff;
  border-radius: 2em;
  text-align: center;
}
.bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide .case_item_txt a.tag:hover {
  opacity: 0.7;
  transition: all 0.3s;
}
.bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide .case_item_txt a.txt {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
.bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide .case_item_txt p {
  font-size: min(0.97vw, 14px);
  line-height: 1.86;
  margin-top: 1.29em;
}
.bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide .case_item_txt .more {
  display: block;
  position: relative;
  padding-right: 2em;
  margin-top: auto;
}
.bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide .case_item_txt .more:before {
  content: "";
  position: absolute;
  width: 7.91%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 85%;
  z-index: 1;
  transition: all 0.3s;
}
.bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide .case_item_txt .more:after {
  content: "";
  position: absolute;
  width: 2.5%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 90.2%;
  z-index: 1;
  transform: rotate(45deg);
  transform-origin: bottom right;
  transition: all 0.3s;
}
.bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide .case_item_txt .more img {
  width: 4.96em;
  max-width: 89.33px;
  padding-top: 1.11em;
  margin: auto 5px 0 auto;
}
.bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide:hover > a img {
  transform: scale(1.1);
}
.bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide:hover .case_item_txt .more:before {
  content: "";
  position: absolute;
  width: 9.91%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 85%;
  z-index: 1;
}
.bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide:hover .case_item_txt .more:after {
  content: "";
  position: absolute;
  width: 2.5%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 92%;
  z-index: 1;
  transform: rotate(45deg);
  transform-origin: bottom right;
}
.bsp.dermatology #case .case_txt .btn {
  margin: -1.2em 0 0 auto;
  position: relative;
  padding-bottom: 1em;
}
.bsp.dermatology #case .case_txt .btn img {
  width: 8.86em;
  max-width: 159.56px;
}
.bsp.dermatology #case .case_txt .btn:before {
  content: "";
  position: absolute;
  width: 96%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 0;
  z-index: 1;
  transition: all 0.3s;
}
.bsp.dermatology #case .case_txt .btn:after {
  content: "";
  position: absolute;
  width: 3%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 93%;
  z-index: 1;
  transform: rotate(35deg);
  transition: all 0.3s;
  transform-origin: bottom right;
}
.bsp.dermatology #case .case_txt .btn:hover:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 0;
  z-index: 1;
}
.bsp.dermatology #case .case_txt .btn:hover:after {
  content: "";
  position: absolute;
  width: 3%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 97%;
  z-index: 1;
  transform: rotate(35deg);
}
.bsp.dermatology #case .splide__pagination__page {
  border: 1px solid #000;
}
.bsp.dermatology #case .splide__pagination__page.is-active {
  background: #000;
}

@media screen and (max-width: 767px) {
  .bsp.dermatology #case {
    padding: 16vw 0 0;
  }
  .bsp.dermatology #case .case_txt .case_lead {
    width: 8.21vw;
    max-width: 8.21vw;
  }
  .bsp.dermatology #case .case_txt h2 {
    font-size: 5.33vw;
    margin-top: 5.33vw;
    line-height: 1.2;
  }
  .bsp.dermatology #case .case_txt .case_wrap {
    margin-top: 10.67vw;
  }
  .bsp.dermatology #case .case_txt .case_wrap .bl_case_list {
    padding-bottom: 25.33vw;
  }
  .bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide {
    width: 69.33vw;
  }
  .bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide .case_item_txt {
    padding: 8vw 6.67vw;
    min-height: 54.67vw;
  }
  .bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide .case_item_txt a.tag {
    font-size: 2.93vw;
    width: 20vw;
    height: 5.33vw;
  }
  .bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide .case_item_txt p {
    font-size: 3.73vw;
    margin-top: 1.29em;
  }
  .bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide .case_item_txt .more {
    padding-right: 8vw;
  }
  .bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide .case_item_txt .more:before {
    width: 5.33vw;
    left: 90%;
  }
  .bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide .case_item_txt .more:after {
    width: 1.5vw;
    left: 97%;
  }
  .bsp.dermatology #case .case_txt .case_wrap .bl_case_list .splide__slide .case_item_txt .more img {
    width: 23.82vw;
    max-width: 23.82vw;
    padding-top: 1.11em;
    margin: auto 0 0 auto;
  }
  .bsp.dermatology #case .case_txt .btn {
    width: 52.53vw;
    max-width: 52.53vw;
    margin: auto;
    padding-bottom: 4vw;
  }
  .bsp.dermatology #case .case_txt .btn img {
    width: 42.55vw;
    max-width: 42.55vw;
  }
  .bsp.dermatology #case .case_txt .btn:before {
    width: 100%;
  }
  .bsp.dermatology #case .case_txt .btn:after {
    left: 97%;
  }
}
/*
flow
*/
.bsp.dermatology #flow {
  padding-top: 11.11em;
  font-size: min(1.25vw, 18px);
}
.bsp.dermatology #flow .bl_inner {
  position: relative;
  padding-bottom: 15.56em;
}
.bsp.dermatology #flow .thumb_img {
  position: absolute;
  left: -6.06%;
  width: 44.84%;
  max-width: 556px;
  z-index: -1;
  top: -7em;
}
.bsp.dermatology #flow .thumb_img:nth-child(2) {
  left: unset;
  top: unset;
  right: -6.06%;
  bottom: 0;
  width: 44.11%;
  max-width: 547px;
}
.bsp.dermatology #flow .flow_txt {
  text-align: center;
  position: relative;
  margin-top: 7em;
}
.bsp.dermatology #flow .flow_txt .flow_lead {
  width: 10.56em;
  max-width: 190.16px;
  margin: auto;
}
.bsp.dermatology #flow .flow_txt h2 {
  font-size: min(2.43vw, 35px);
  line-height: 1.22;
  letter-spacing: 0.1em;
  margin-top: 1.35em;
}
.bsp.dermatology #flow .flow_wrap {
  margin-top: 4.44em;
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: 1px solid #CBC3AC;
  background: #F4F3F0;
  padding: 2.78em;
  position: relative;
  min-height: 11.39em;
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item:after {
  content: "";
  position: absolute;
  z-index: 1;
  display: block;
  width: 6.72em;
  height: 2.67em;
  background: url(/assets/img/dermatology/arrow02.svg);
  background-size: 6.72em 2.67em;
  background-repeat: no-repeat;
  left: 50%;
  top: -1.64em;
  transform: translateX(-50%);
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item + .flow_item {
  margin-top: 0.83em;
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item:first-child:after {
  display: none;
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .flow_item_ttl {
  width: 28.07%;
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .flow_item_ttl p {
  font-size: min(1.25vw, 18px);
  position: absolute;
  top: 0;
  left: 0;
  border-bottom: 1px solid #CBC3AC;
  padding: 1.39em 0.67em 0.89em 1.39em;
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .flow_item_ttl p img {
  font-size: min(1.25vw, 18px);
  height: 0.76em;
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .flow_item_ttl h3 {
  font-size: min(1.39vw, 20px);
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item > p {
  font-size: min(0.9vw, 13px);
  line-height: 2;
  flex: 1;
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .btn_wrap {
  width: 26.32%;
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .item_btn {
  position: relative;
  display: block;
  width: 100%;
  border: solid 1px #000;
  font-size: min(1.11vw, 16px);
  padding: 0.7em 0;
  text-align: center;
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .item_btn:before {
  content: "";
  position: absolute;
  width: 7.91%;
  height: 1px;
  background: #000;
  top: 50%;
  left: 84%;
  transform: translateY(-50%);
  z-index: 1;
  transition: all 0.3s;
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .item_btn:after {
  content: "";
  position: absolute;
  width: 2.3%;
  height: 1px;
  background: #000;
  top: 49.5%;
  left: 89.2%;
  z-index: 1;
  transform: translateY(-50%) rotate(35deg);
  transform-origin: bottom right;
  transition: all 0.3s;
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .item_btn:hover:before {
  content: "";
  position: absolute;
  width: 9.91%;
  height: 1px;
  background: #000;
  top: 50%;
  left: 84%;
  z-index: 1;
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .item_btn:hover:after {
  content: "";
  position: absolute;
  width: 2.3%;
  height: 1px;
  background: #000;
  top: 49%;
  left: 91.5%;
  z-index: 1;
  transform: rotate(35deg);
  transform-origin: bottom right;
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .item_btn + a {
  margin-top: 0.8em;
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .item_btn span {
  letter-spacing: 0.03em;
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .item_txt {
  font-size: min(1.88vw, 27px);
  margin-top: 0.8em;
  letter-spacing: 0.1em;
}
.bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .item_txt span {
  font-size: min(1.11vw, 16px);
  margin-right: 1.2em;
}
.bsp.dermatology #flow .flow_wrap .btn {
  display: block;
  width: 13.17em;
  max-width: 237px;
  margin: 3.44em auto 0;
  position: relative;
  padding-bottom: 1em;
}
.bsp.dermatology #flow .flow_wrap .btn img {
  width: 11.06em;
  max-width: 199.08px;
}
.bsp.dermatology #flow .flow_wrap .btn:before {
  content: "";
  position: absolute;
  width: 96%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 0;
  z-index: 1;
  transition: all 0.3s;
}
.bsp.dermatology #flow .flow_wrap .btn:after {
  content: "";
  position: absolute;
  width: 3%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 93%;
  z-index: 1;
  transform: rotate(35deg);
  transition: all 0.3s;
  transform-origin: bottom right;
}
.bsp.dermatology #flow .flow_wrap .btn:hover:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 0;
  z-index: 1;
}
.bsp.dermatology #flow .flow_wrap .btn:hover:after {
  content: "";
  position: absolute;
  width: 3%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 97%;
  z-index: 1;
  transform: rotate(35deg);
}

@media screen and (max-width: 767px) {
  .bsp.dermatology #flow {
    padding-top: 90.33vw;
  }
  .bsp.dermatology #flow .bl_inner {
    padding-bottom: 0;
  }
  .bsp.dermatology #flow .thumb_img {
    left: 0;
    width: 68.8vw;
    max-width: 68.8vw;
    top: -64vw;
  }
  .bsp.dermatology #flow .thumb_img:nth-child(2) {
    width: 60.27vw;
    max-width: 60.27vw;
    right: 0;
    bottom: 23vw;
  }
  .bsp.dermatology #flow .flow_txt {
    margin-top: 0;
  }
  .bsp.dermatology #flow .flow_txt .flow_lead {
    width: 36.22vw;
    max-width: 36.22vw;
  }
  .bsp.dermatology #flow .flow_txt h2 {
    font-size: 5.33vw;
    margin-top: 5.33vw;
    line-height: 1.2;
  }
  .bsp.dermatology #flow .flow_wrap {
    margin-top: 10.67vw;
  }
  .bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item {
    flex-direction: column;
    padding: 13vw 5.33vw 10.67vw;
    min-height: auto;
  }
  .bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item:after {
    width: 23.2vw;
    height: 9.12vw;
    background: url(/assets/img/dermatology/arrow02.svg);
    background-size: 23.2vw 9.12vw;
    background-repeat: no-repeat;
    top: -5.33vw;
    transform: translateX(-50%);
  }
  .bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item + .flow_item {
    margin-top: 2.67vw;
  }
  .bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .flow_item_ttl {
    width: auto;
  }
  .bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .flow_item_ttl p {
    top: 8vw;
    left: 50%;
    transform: translateX(-50%);
    padding: 0 0 2.67vw 0;
  }
  .bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .flow_item_ttl p img {
    height: 2.91vw;
  }
  .bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .flow_item_ttl h3 {
    font-size: 4.27vw;
    margin-top: 5.33vw;
    text-align: center;
    line-height: 1.75;
  }
  .bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item > p {
    font-size: 3.2vw;
    margin-top: 5vw;
  }
  .bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .btn_wrap {
    width: 100%;
    margin-top: 9.33vw;
  }
  .bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .item_btn {
    font-size: 3.73vw;
    padding: 0.56em 0;
  }
  .bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item + a {
    margin-top: 2.67vw;
  }
  .bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .item_txt {
    font-size: 6.4vw;
    margin-top: 0.4em;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .bsp.dermatology #flow .flow_wrap .bl_flow_list .flow_item .item_txt span {
    font-size: 3.73vw;
    margin-right: 1.2em;
    letter-spacing: 0.05em;
  }
  .bsp.dermatology #flow .flow_wrap .btn {
    display: block;
    width: 59.29vw;
    max-width: 59.29vw;
    margin: 50vw auto 0;
    padding-bottom: 4vw;
  }
  .bsp.dermatology #flow .flow_wrap .btn img {
    width: 49.58vw;
    max-width: 49.58vw;
  }
  .bsp.dermatology #flow .flow_wrap .btn:before {
    width: 100%;
  }
  .bsp.dermatology #flow .flow_wrap .btn:after {
    left: 97%;
  }
}
/*
special
*/
.bsp.dermatology #special {
  font-size: min(1.25vw, 18px);
  margin-top: 11.67em;
}
.bsp.dermatology #special .special_wrap {
  position: relative;
  text-align: left;
}
.bsp.dermatology #special .special_wrap h2 {
  margin-left: 2.67em;
}
.bsp.dermatology #special .special_wrap h2 img {
  display: inline-block;
  width: 25.09em;
  max-width: 451.64px;
}
.bsp.dermatology #special .special_wrap h2 span {
  display: inline-block;
  margin-left: 1em;
  font-size: min(1.74vw, 25px);
  vertical-align: bottom;
}
.bsp.dermatology #special .special_wrap .ly_df {
  justify-content: space-between;
  align-items: flex-start;
  margin-top: 5em;
}
.bsp.dermatology #special .special_wrap .ly_df .special_txt {
  display: flex;
  flex-direction: column;
  width: 44.03%;
  padding: 2.39em 2.67em 0;
}
.bsp.dermatology #special .special_wrap .ly_df .special_txt p {
  font-size: min(0.9vw, 13px);
  line-height: 2.54;
  margin-top: 2em;
  letter-spacing: 0.03em;
}
.bsp.dermatology #special .special_wrap .ly_df .special_txt p.special_lead {
  font-size: min(1.25vw, 18px);
  width: 3.95em;
  max-width: 71.06px;
  margin-top: 0;
}
.bsp.dermatology #special .special_wrap .ly_df .special_txt h3 {
  font-size: min(2.78vw, 40px);
  line-height: 1.7;
  margin-top: 0.3em;
  margin-left: -0.13em;
}
.bsp.dermatology #special .special_wrap .ly_df .special_txt h3 span {
  display: block;
  font-size: min(1.74vw, 25px);
  line-height: 2;
  margin: 1em 0 0.5em 0.1em;
}
.bsp.dermatology #special .special_wrap .ly_df .special_txt .btn {
  display: block;
  width: 12.89em;
  margin: 4.44em 0 0;
  position: relative;
  padding-bottom: 1em;
}
.bsp.dermatology #special .special_wrap .ly_df .special_txt .btn img {
  width: 10.14em;
  max-width: 182.57px;
}
.bsp.dermatology #special .special_wrap .ly_df .special_txt .btn:before {
  content: "";
  position: absolute;
  width: 96%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 0;
  z-index: 1;
  transition: all 0.3s;
}
.bsp.dermatology #special .special_wrap .ly_df .special_txt .btn:after {
  content: "";
  position: absolute;
  width: 3%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 93%;
  z-index: 1;
  transform: rotate(35deg);
  transition: all 0.3s;
  transform-origin: bottom right;
}
.bsp.dermatology #special .special_wrap .ly_df .special_txt .btn:hover:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 0;
  z-index: 1;
}
.bsp.dermatology #special .special_wrap .ly_df .special_txt .btn:hover:after {
  content: "";
  position: absolute;
  width: 3%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 97%;
  z-index: 1;
  transform: rotate(35deg);
}
.bsp.dermatology #special .special_wrap .ly_df .special_img {
  width: 50.81%;
  max-width: 630px;
  margin-top: 0;
  align-items: flex-end;
}
.bsp.dermatology #special .special_wrap .ly_df .special_img .special_img_l {
  width: 59.52%;
  max-width: 375px;
  align-self: flex-start;
}
.bsp.dermatology #special .special_wrap .ly_df .special_img .special_img_l img {
  width: 100%;
}
.bsp.dermatology #special .special_wrap .ly_df .special_img .special_img_l .special_ttl {
  margin-top: 1em;
}
.bsp.dermatology #special .special_wrap .ly_df .special_img .special_img_l .special_ttl p {
  font-size: min(2.78vw, 40px);
  line-height: 1.15;
  font-family: "Romie", sans-serif;
  letter-spacing: 0;
  text-align: right;
}
.bsp.dermatology #special .special_wrap .ly_df .special_img .special_img_r {
  width: 40.48%;
  max-width: 255px;
}
.bsp.dermatology #special .special_wrap .ly_df .special_img .special_img_r .thumb {
  width: 100%;
}
.bsp.dermatology #special .special_wrap .ly_df .special_img .special_img_r .thumb:nth-child(2) {
  width: 90.2%;
  margin-left: auto;
}

@media screen and (max-width: 767px) {
  .bsp.dermatology #special {
    margin-top: 28vw;
  }
  .bsp.dermatology #special .special_wrap {
    text-align: center;
  }
  .bsp.dermatology #special .special_wrap h2 {
    margin-left: 0;
    text-align: left;
  }
  .bsp.dermatology #special .special_wrap h2 img {
    width: 60.22vw;
    max-width: 60.22vw;
  }
  .bsp.dermatology #special .special_wrap h2 span {
    display: block;
    margin: 2.67vw 0 0;
    font-size: 3.73vw;
  }
  .bsp.dermatology #special .special_wrap .ly_df {
    flex-direction: column-reverse;
    margin-top: 13.33vw;
  }
  .bsp.dermatology #special .special_wrap .ly_df .special_txt {
    width: 100%;
    padding: 0;
    margin-top: 16vw;
  }
  .bsp.dermatology #special .special_wrap .ly_df .special_txt p {
    font-size: 3.2vw;
    line-height: 2;
    text-align: left;
    margin-top: 8vw;
  }
  .bsp.dermatology #special .special_wrap .ly_df .special_txt p.special_lead {
    width: 14.9vw;
    max-width: 14.9vw;
    margin-left: 0;
  }
  .bsp.dermatology #special .special_wrap .ly_df .special_txt h3 {
    font-size: 8vw;
    text-align: left;
    margin-left: -0.13em;
    margin-top: 4vw;
  }
  .bsp.dermatology #special .special_wrap .ly_df .special_txt h3 span {
    font-size: 5.33vw;
    margin: 0 0 1.33vw 0.07em;
  }
  .bsp.dermatology #special .special_wrap .ly_df .special_txt .btn {
    width: 62.71vw;
    margin: 16vw 0 0;
    position: relative;
    padding-bottom: 4vw;
  }
  .bsp.dermatology #special .special_wrap .ly_df .special_txt .btn img {
    width: 48.69vw;
    max-width: 48.69vw;
  }
  .bsp.dermatology #special .special_wrap .ly_df .special_txt .btn:before {
    width: 100%;
  }
  .bsp.dermatology #special .special_wrap .ly_df .special_txt .btn:after {
    left: 97%;
  }
  .bsp.dermatology #special .special_wrap .ly_df .special_img {
    position: relative;
    width: 100%;
    max-width: 100%;
    margin-top: 0;
    align-items: flex-end;
    flex-direction: row;
  }
  .bsp.dermatology #special .special_wrap .ly_df .special_img .special_img_l {
    width: 52.27vw;
    max-width: 52.27vw;
    align-self: flex-start;
  }
  .bsp.dermatology #special .special_wrap .ly_df .special_img .special_img_l img {
    width: 100%;
  }
  .bsp.dermatology #special .special_wrap .ly_df .special_img .special_img_l .special_ttl {
    margin-top: 1em;
  }
  .bsp.dermatology #special .special_wrap .ly_df .special_img .special_img_l .special_ttl p {
    font-size: 5.33vw;
    margin-top: 0.4em;
  }
  .bsp.dermatology #special .special_wrap .ly_df .special_img .special_img_r {
    width: 37.33vw;
    max-width: 37.33vw;
  }
  .bsp.dermatology #special .special_wrap .ly_df .special_img .special_img_r .thumb {
    width: 37.33vw;
    position: absolute;
    right: -1.25vw;
    top: -0.27vw;
  }
  .bsp.dermatology #special .special_wrap .ly_df .special_img .special_img_r .thumb:nth-child(2) {
    width: 31.73vw;
    position: relative;
    right: unset;
    top: unset;
  }
}
/*
feature_article
*/
.bsp.dermatology #feature_article {
  background: #0F2743;
  padding: 5.7em 0 6.67em;
  font-size: min(1.25vw, 18px);
  margin-top: 11.11em;
}
.bsp.dermatology #feature_article .feature_txt {
  position: relative;
  text-align: center;
  color: #fff;
}
.bsp.dermatology #feature_article .feature_txt .feature_lead {
  width: 7.53em;
  max-width: 135.49px;
  margin: auto;
}
.bsp.dermatology #feature_article .feature_txt h2 {
  font-size: min(2.78vw, 40px);
  line-height: 1.2;
  letter-spacing: 0.1em;
  margin-top: 1.2em;
}
.bsp.dermatology #feature_article .feature_txt .feature_wrap {
  margin-top: 3.6em;
}
.bsp.dermatology #feature_article .feature_txt .feature_wrap .bl_feature_list {
  margin: 0 auto;
  position: relative;
  padding-bottom: 2.97em;
  margin-top: 1em;
}
.bsp.dermatology #feature_article .feature_txt .feature_wrap .bl_feature_list .splide__slide {
  border: 1px solid #002046;
  width: 18.06%;
  text-align: left;
}
.bsp.dermatology #feature_article .feature_txt .feature_wrap .bl_feature_list .splide__slide > img {
  align-self: start;
}
.bsp.dermatology #feature_article .feature_txt .btn {
  display: block;
  width: 10.94em;
  max-width: 197px;
  margin: -1.2em 0 0 auto;
  position: relative;
  padding-bottom: 1em;
}
.bsp.dermatology #feature_article .feature_txt .btn img {
  width: 8.86em;
  max-width: 159.56px;
}
.bsp.dermatology #feature_article .feature_txt .btn:before {
  content: "";
  position: absolute;
  width: 96%;
  height: 1px;
  background: #fff;
  bottom: 0;
  left: 0;
  z-index: 1;
  transition: all 0.3s;
}
.bsp.dermatology #feature_article .feature_txt .btn:after {
  content: "";
  position: absolute;
  width: 3%;
  height: 1px;
  background: #fff;
  bottom: 0;
  left: 93%;
  z-index: 1;
  transform: rotate(35deg);
  transition: all 0.3s;
  transform-origin: bottom right;
}
.bsp.dermatology #feature_article .feature_txt .btn:hover:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  background: #fff;
  bottom: 0;
  left: 0;
  z-index: 1;
}
.bsp.dermatology #feature_article .feature_txt .btn:hover:after {
  content: "";
  position: absolute;
  width: 3%;
  height: 1px;
  background: #fff;
  bottom: 0;
  left: 97%;
  z-index: 1;
  transform: rotate(35deg);
}
.bsp.dermatology #feature_article .splide__arrow {
  top: 38%;
}
.bsp.dermatology #feature_article .splide__arrow--prev {
  left: -1.5em;
}
.bsp.dermatology #feature_article .splide__arrow--next {
  right: -1.5em;
}

@media screen and (max-width: 767px) {
  .bsp.dermatology #feature_article {
    padding: 16vw 0;
  }
  .bsp.dermatology #feature_article .feature_txt .feature_lead {
    width: 30.11vw;
    max-width: 30.11vw;
  }
  .bsp.dermatology #feature_article .feature_txt h2 {
    font-size: 5.33vw;
    margin-top: 5.33vw;
  }
  .bsp.dermatology #feature_article .feature_txt .feature_wrap {
    width: 100vw;
    margin: 10.67vw calc(50% - 50vw) 0;
  }
  .bsp.dermatology #feature_article .feature_txt .feature_wrap .bl_feature_list {
    padding-bottom: 0;
  }
  .bsp.dermatology #feature_article .feature_txt .feature_wrap .bl_feature_list .splide__slide {
    width: 69.33vw;
  }
  .bsp.dermatology #feature_article .feature_txt .btn {
    width: 52.53vw;
    max-width: 52.53vw;
    margin: 25.33vw auto 0;
    padding-bottom: 4vw;
  }
  .bsp.dermatology #feature_article .feature_txt .btn img {
    width: 42.55vw;
    max-width: 42.55vw;
  }
  .bsp.dermatology #feature_article .feature_txt .btn:before {
    width: 100%;
  }
  .bsp.dermatology #feature_article .feature_txt .btn:after {
    left: 97%;
  }
  .bsp.dermatology #feature_article .splide__arrow {
    top: 50%;
  }
  .bsp.dermatology #feature_article .splide__arrow--prev {
    left: 2.67vw;
  }
  .bsp.dermatology #feature_article .splide__arrow--next {
    right: 2.67vw;
  }
  .bsp.dermatology #feature_article .splide__pagination {
    bottom: -10.67vw;
  }
  .bsp.dermatology #feature_article .splide__pagination__page {
    margin: 0 0.8vw;
    width: 1.6vw;
    height: 1.6vw;
  }
}
/*
column
*/
.bsp.dermatology #column {
  background: #F4F3F0;
  padding: 5.7em 0 0;
  font-size: min(1.25vw, 18px);
}
.bsp.dermatology #column .column_txt {
  position: relative;
}
.bsp.dermatology #column .column_txt h2 {
  margin-left: 2.67em;
}
.bsp.dermatology #column .column_txt h2 img {
  display: inline-block;
  width: 11.91em;
  max-width: 214.44px;
}
.bsp.dermatology #column .column_txt h2 span {
  display: inline-block;
  margin-left: 1em;
  font-size: min(1.39vw, 20px);
  vertical-align: baseline;
}
.bsp.dermatology #column .column_txt .column_wrap {
  margin-top: 3.6em;
}
.bsp.dermatology #column .column_txt .column_wrap .bl_column_list {
  margin: 0 auto;
  position: relative;
  padding-bottom: 2.97em;
  margin-top: 1em;
}
.bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide {
  display: flex;
  flex-direction: column;
  width: 24.31%;
  text-align: left;
  background: #E5E2D9;
}
.bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide > a {
  display: block;
  align-self: start;
  overflow: hidden;
}
.bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide .column_item_txt {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  padding: 1.5em;
  min-height: 11.44em;
}
.bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide .column_item_txt span.date {
  font-size: min(0.83vw, 12px);
  margin-right: 1em;
}
.bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide .column_item_txt a.tag {
  display: inline-block;
  font-size: min(0.76vw, 11px);
  width: 6.73em;
  height: 1.82em;
  border: solid 1px #fff;
  text-align: center;
}
.bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide .column_item_txt a.tag:hover {
  opacity: 0.7;
  transition: all 0.3s;
}
.bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide .column_item_txt a.txt {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
.bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide .column_item_txt p {
  font-size: min(0.97vw, 14px);
  line-height: 1.86;
  margin-top: 1.29em;
}
.bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide .column_item_txt .more {
  display: block;
  position: relative;
  padding-right: 2em;
  margin-top: auto;
}
.bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide .column_item_txt .more:before {
  content: "";
  position: absolute;
  width: 7.91%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 91%;
  z-index: 1;
  transition: all 0.3s;
}
.bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide .column_item_txt .more:after {
  content: "";
  position: absolute;
  width: 2.5%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 96.2%;
  z-index: 1;
  transform: rotate(45deg);
  transform-origin: bottom right;
  transition: all 0.3s;
}
.bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide .column_item_txt .more img {
  width: 4.96em;
  max-width: 89.33px;
  padding-top: 1.11em;
  margin: auto 0 0 auto;
}
.bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide:hover > a img {
  transform: scale(1.1);
}
.bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide:hover .column_item_txt .more:before {
  content: "";
  position: absolute;
  width: 9.91%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 91%;
  z-index: 1;
}
.bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide:hover .column_item_txt .more:after {
  content: "";
  position: absolute;
  width: 2.5%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 98%;
  z-index: 1;
  transform: rotate(45deg);
  transform-origin: bottom right;
}
.bsp.dermatology #column .column_txt .btn {
  display: block;
  width: 10.17em;
  max-width: 183px;
  margin: -1.2em 0 0 auto;
  position: relative;
  padding-bottom: 1em;
}
.bsp.dermatology #column .column_txt .btn img {
  width: 8.05em;
  max-width: 144.96px;
}
.bsp.dermatology #column .column_txt .btn:before {
  content: "";
  position: absolute;
  width: 96%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 0;
  z-index: 1;
  transition: all 0.3s;
}
.bsp.dermatology #column .column_txt .btn:after {
  content: "";
  position: absolute;
  width: 3%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 93%;
  z-index: 1;
  transform: rotate(35deg);
  transition: all 0.3s;
  transform-origin: bottom right;
}
.bsp.dermatology #column .column_txt .btn:hover:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 0;
  z-index: 1;
}
.bsp.dermatology #column .column_txt .btn:hover:after {
  content: "";
  position: absolute;
  width: 3%;
  height: 1px;
  background: #000;
  bottom: 0;
  left: 97%;
  z-index: 1;
  transform: rotate(35deg);
}
.bsp.dermatology #column .splide__pagination__page {
  border: 1px solid #000;
}
.bsp.dermatology #column .splide__pagination__page.is-active {
  background: #000;
}

@media screen and (max-width: 767px) {
  .bsp.dermatology #column {
    padding: 17.33vw 0 0;
  }
  .bsp.dermatology #column .column_txt h2 {
    margin-left: 0;
  }
  .bsp.dermatology #column .column_txt h2 img {
    width: 42.89vw;
    max-width: 42.89vw;
  }
  .bsp.dermatology #column .column_txt h2 span {
    font-size: 4.27vw;
  }
  .bsp.dermatology #column .column_txt .column_wrap {
    margin-top: 10.67vw;
  }
  .bsp.dermatology #column .column_txt .column_wrap .bl_column_list {
    padding-bottom: 25.33vw;
  }
  .bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide {
    width: 69.33vw;
  }
  .bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide .column_item_txt {
    padding: 8vw 6.67vw;
    min-height: 54.67vw;
  }
  .bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide .column_item_txt a.tag {
    font-size: 2.93vw;
    width: 20vw;
    height: 5.33vw;
  }
  .bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide .column_item_txt p {
    font-size: 3.73vw;
    margin-top: 1.29em;
  }
  .bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide .column_item_txt .more {
    padding-right: 8vw;
  }
  .bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide .column_item_txt .more:before {
    width: 5.33vw;
    left: 90%;
  }
  .bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide .column_item_txt .more:after {
    width: 1.5vw;
    left: 97%;
  }
  .bsp.dermatology #column .column_txt .column_wrap .bl_column_list .splide__slide .column_item_txt .more img {
    width: 23.82vw;
    max-width: 23.82vw;
    padding-top: 1.11em;
    margin: auto 0 0 auto;
  }
  .bsp.dermatology #column .column_txt .btn {
    width: 48.8vw;
    max-width: 48.8vw;
    margin: auto;
    padding-bottom: 4vw;
  }
  .bsp.dermatology #column .column_txt .btn img {
    width: 38.6vw;
    max-width: 38.6vw;
  }
  .bsp.dermatology #column .column_txt .btn:before {
    width: 100%;
  }
  .bsp.dermatology #column .column_txt .btn:after {
    left: 97%;
  }
}
/*
sns
*/
.bsp.dermatology #sns {
  font-size: min(1.25vw, 18px);
  margin: 8.33em 0 11.11em;
}
.bsp.dermatology #sns .sns_txt .sns_lead {
  width: 1.46em;
  max-width: 26.21px;
  margin: auto;
}
.bsp.dermatology #sns .sns_txt h2 {
  font-size: min(2.78vw, 40px);
  line-height: 1.2;
  letter-spacing: 0.1em;
  margin-top: 1.2em;
  text-align: center;
}
.bsp.dermatology #sns .sns_wrap {
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 4.13em;
}
.bsp.dermatology #sns .sns_wrap .btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: min(0.97em, 14px);
  border: 1px solid #000;
  width: 23.79%;
  height: 4.29em;
  margin-top: 1.43em;
  padding: 0;
}
.bsp.dermatology #sns .sns_wrap .btn img {
  position: absolute;
  left: 1.84em;
  width: 2.14em;
  margin-right: auto;
}
.bsp.dermatology #sns .sns_wrap .btn span {
  margin-left: 3em;
  letter-spacing: 0.05em;
}
.bsp.dermatology #sns .sns_wrap .btn:nth-child(5), .bsp.dermatology #sns .sns_wrap .btn:nth-child(6), .bsp.dermatology #sns .sns_wrap .btn:nth-child(7), .bsp.dermatology #sns .sns_wrap .btn:nth-child(8), .bsp.dermatology #sns .sns_wrap .btn:nth-child(9) {
  height: 9.36em;
  text-align: center;
  flex-direction: column;
  align-items: center;
  /*width: 18.71%;*/
}
.bsp.dermatology #sns .sns_wrap .btn:nth-child(5) img, .bsp.dermatology #sns .sns_wrap .btn:nth-child(6) img, .bsp.dermatology #sns .sns_wrap .btn:nth-child(7) img, .bsp.dermatology #sns .sns_wrap .btn:nth-child(8) img, .bsp.dermatology #sns .sns_wrap .btn:nth-child(9) img {
  position: relative;
  top: unset;
  left: unset;
  margin: 0;
}
.bsp.dermatology #sns .sns_wrap .btn:nth-child(5) span, .bsp.dermatology #sns .sns_wrap .btn:nth-child(6) span, .bsp.dermatology #sns .sns_wrap .btn:nth-child(7) span, .bsp.dermatology #sns .sns_wrap .btn:nth-child(8) span, .bsp.dermatology #sns .sns_wrap .btn:nth-child(9) span {
  margin: 1em 0 0;
}
.bsp.dermatology #sns .sns_wrap .btn:nth-child(3) {
  padding: 0;
}
.bsp.dermatology #sns .sns_wrap .btn:nth-child(3) img {
  width: 1.43em;
  left: 2.13em;
}

@media screen and (max-width: 767px) {
  .bsp.dermatology #sns {
    margin: 26.67vw 0;
  }
  .bsp.dermatology #sns .sns_txt .sns_lead {
    width: 5.82vw;
    max-width: 5.82vw;
  }
  .bsp.dermatology #sns .sns_txt h2 {
    font-size: 5.33vw;
    margin-top: 5.33vw;
  }
  .bsp.dermatology #sns .sns_wrap {
    margin-top: 10.67vw;
    flex-wrap: wrap;
  }
  .bsp.dermatology #sns .sns_wrap .btn {
    font-size: 3.2vw;
    width: 42.13vw;
    height: 10.67vw;
    margin-top: 2.67vw;
  }
  .bsp.dermatology #sns .sns_wrap .btn img {
    position: absolute;
    left: 5.33vw;
    width: 5.33vw;
  }
  .bsp.dermatology #sns .sns_wrap .btn span {
    margin-left: 2em;
  }
  .bsp.dermatology #sns .sns_wrap .btn:nth-child(5), .bsp.dermatology #sns .sns_wrap .btn:nth-child(6), .bsp.dermatology #sns .sns_wrap .btn:nth-child(7), .bsp.dermatology #sns .sns_wrap .btn:nth-child(8), .bsp.dermatology #sns .sns_wrap .btn:nth-child(9) {
    height: 13.33vw;
    flex-direction: row;
    align-items: center;
    width: 100%;
  }
  .bsp.dermatology #sns .sns_wrap .btn:nth-child(5) img, .bsp.dermatology #sns .sns_wrap .btn:nth-child(6) img, .bsp.dermatology #sns .sns_wrap .btn:nth-child(7) img, .bsp.dermatology #sns .sns_wrap .btn:nth-child(8) img, .bsp.dermatology #sns .sns_wrap .btn:nth-child(9) img {
    position: absolute;
    left: 5.33vw;
    width: 5.33vw;
  }
  .bsp.dermatology #sns .sns_wrap .btn:nth-child(5) span, .bsp.dermatology #sns .sns_wrap .btn:nth-child(6) span, .bsp.dermatology #sns .sns_wrap .btn:nth-child(7) span, .bsp.dermatology #sns .sns_wrap .btn:nth-child(8) span, .bsp.dermatology #sns .sns_wrap .btn:nth-child(9) span {
    margin: 0 0 0 1em;
  }
  .bsp.dermatology #sns .sns_wrap .btn:nth-child(3) {
    padding: 0;
  }
  .bsp.dermatology #sns .sns_wrap .btn:nth-child(3) img {
    width: 4vw;
    left: 5.33vw;
  }
}



.treatment_menu_head {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  font-size: min(1.25vw, 18px);
  margin-top: 3.33em;
}
.treatment_menu_head .btn {
  width: 11.1111111111%;
  background-color: #959083;
  color: #fff;
  font-size: min(1.04vw, 15px);
  letter-spacing: -0.03em;
  line-height: 1.6;
}
.treatment_menu_head .btn > img {
  display: none;
}
.treatment_menu_head .btn.active {
  background-color: #F4F3F0;
  color: #000;
}
.treatment_menu_head .btn + .btn {
  border-left: #F4F3F0 solid 1px;
}
.treatment_menu_head .btn span.btn_inner {
  display: flex;
  text-align: center;
  align-items: center;
  justify-content: center;
  height: 4em;
  flex-direction: column;
}
.treatment_menu_head .btn span.br {
  display: block;
  flex-direction: row;
}

@media screen and (max-width: 767px) {
  .treatment_menu_head {
    flex-direction: column;
    margin-top: 10.67vw;
  }
  .treatment_menu_head .btn {
    width: 100%;
    background-color: #fff;
    color: #000;
    height: 3em;
    font-size: 3.73vw;
    position: relative;
  }
  .treatment_menu_head .btn > img {
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 4vw;
    width: 5.33vw;
    height: 5.33vw;
  }
  .treatment_menu_head .btn + .btn {
    border-top: #F4F3F0 solid 1px;
  }
  .treatment_menu_head .btn.active {
    background-color: #fff;
  }
  .treatment_menu_head .btn span.btn_inner {
    display: flex;
    text-align: left;
    align-items: center;
    justify-content: flex-start;
    height: 3em;
    flex-direction: row;
    font-size: 3.73vw;
    padding: 4vw;
  }
  .treatment_menu_head .btn span.br {
    display: block;
  }
  .treatment_menu_head .btn span.br:before {
    content: "・";
  }
}
.treatment_menu_body {
  position: relative;
  padding: 3em;
  background-color: #F4F3F0;
}
.treatment_menu_body .list {
  display: none;
}
.treatment_menu_body .list.active {
  display: block;
}
.treatment_menu_body ul {
  list-style: none;
}
.treatment_menu_body li {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  font-size: min(1.04vw, 15px);
  height: 4em;
  border-bottom: #CBC3AC solid 1px;
}
.treatment_menu_body li .tags {
  display: flex;
  flex-wrap: wrap;
  width: 15.35%;
  max-width: 175px;
}
.treatment_menu_body li .tag {
  background-color: #0f2743;
  color: #fff;
  width: 6.31em;
  height: 1.92em;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: min(0.9vw, 13px);
  border-radius: 2px;
}
.treatment_menu_body li .tag + .tag {
  margin-left: 0.33em;
}
.treatment_menu_body li .tag.unsupported {
  background-color: #B9BFC4;
}
.treatment_menu_body li .title {
  width: 29.82%;
  max-width: 340px;
  padding-right: 1em;
}
.treatment_menu_body li .parts {
  width: 39.47%;
  max-width: 450px;
  padding-right: 1em;
}
.treatment_menu_body li .price {
  width: 15.35%;
  max-width: 175px;
}
.treatment_menu_body #btn_modal_sp {
  display: none;
}
.treatment_menu_body.js_on {
  transform: none;
}

@media screen and (max-width: 767px) {
  .treatment_menu_body {
    padding: 0;
  }
  .treatment_menu_body .list.active {
    display: none;
  }
  .treatment_menu_body .list.js_on {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    background-color: rgba(0, 0, 0, 0.8);
    display: block;
    z-index: 9999;
    padding: 10.6667vw 5.3vw;
  }
  .treatment_menu_body .list.js_on .list_inner {
    background-color: #F4F3F0;
    padding: 6.4vw;
    height: 100%;
    overflow: auto;
  }
  .treatment_menu_body .list.js_on .list_inner * {
    font-size: 3.7333vw;
    letter-spacing: 0.05em;
  }
  .treatment_menu_body .list.js_on .list_inner li {
    flex-direction: column;
    height: auto;
    align-items: flex-start;
    padding: 1em 0;
  }
  .treatment_menu_body .list.js_on .list_inner li .tags {
    width: 100%;
    max-width: none;
    margin: 1em 0;
    justify-content: flex-end;
  }
  .treatment_menu_body .list.js_on .list_inner li .title {
    width: 100%;
    max-width: none;
    margin-top: 0.7em;
  }
  .treatment_menu_body .list.js_on .list_inner li .parts {
    width: 100%;
    max-width: none;
    margin-top: 0.7em;
  }
  .treatment_menu_body .list.js_on .list_inner li .price {
    width: 100%;
    max-width: none;
    margin-top: 0.7em;
    text-align: right;
  }
}