section#dng_btns {
  margin-top: 80px;
  margin-bottom: 0;
}
section#contentsList {
  margin-top: 0;
}

section#contentsList.section_one_point_bg {
  padding-top: 32px;
}
#contentsList.section_one_point_bg {
  background-size: auto, 500px auto;
  background-position: left, calc(50% - 154px) 0px;
  padding-bottom: 60px;
}

#contentsList .appearance.round_box {
  margin: 32px auto 0;
}

#dng_btns + #contentsList > * > * {
  border-top: solid 1px var(--border-color);
}

@media screen and (min-width: 981px) {
  section#contentsList.section_one_point_bg {
    padding-top: 50px;
  }

  #contentsList .appearance.round_box {
    margin-top: 50px;
  }
  #contentsList.section_one_point_bg {
    background-position: left, calc(50% - 314px) 80px;
    padding-bottom: 154px;
  }
  .section_bgw.dng_top {
    margin-top: 0;
  }
}

#dng_btns .button.border span {
  font-size: 12px;
  font-size: 1.2rem;
}
/* 薬について 上部のボタン */
#dng_btns .dng_btns_wrapper .button {
  padding: 8px 12px 8px 8px;
}

#dng_btns .dng_btns_wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  box-sizing: border-box;
}
#dng_btns .dng_btns_wrapper a,
#dng_btns .dng_btns_wrapper .active {
  box-sizing: border-box;
  width: calc(50% - 4px);
  margin: 0;
}
#dng_btns .dng_btns_wrapper a:nth-child(2n) {
  margin-right: 0;
}
#dng_btns .button.border span {
  position: relative;
  padding-left: 42px;
  align-items: center;
  line-height: 1.5;
  text-align: left;
  min-height: 42px;
}
#dng_btns .button.border span::before {
  position: absolute;
  content: "";
  top: calc(50% - 19px);
  left: 0;
  display: block;
  width: 38px;
  height: 38px;
  background-repeat: no-repeat;
  background-size: contain;
}
.icon_dng1::before {
  background-image: url("../img/img_dng_1.png");
}

.icon_dng2::before {
  background-image: url("../img/img_dng_2.png");
}

.icon_dng3::before {
  background-image: url("../img/img_dng_3.png");
}

.icon_dng4::before {
  background-image: url("../img/img_dng_4.png");
}
#dng_btns .icon_r_arrow {
  padding: 0;
}
#dng_btns .icon_r_arrow.pc::after {
  display: none;
}
#dng_btns .button.active {
  background: linear-gradient(47deg, #FFCF91 16.49%, #FFF6B2 65.77%);
  filter: none;
}

#dng_btns .button.active:hover::before {
  transform: none;
}
#dng_btns .button.active:hover {
  background: linear-gradient(47deg, #FFCF91 16.49%, #FFF6B2 65.77%);
  animation: none;
}
#dng_btns .button.border.active:hover {
  border: 1px solid var(--c-chocolate-brown);
}

#dng_btns .wrapper.qa {
  margin-bottom: -40px;
  padding-bottom: 32px;
}

@media screen and (min-width: 981px) {
  .appearance.qa_list > * {
    margin: 50px 0;
  }
  .appearance.qa_list > *:first-child {
    margin-top: 50px;
  }
  /* 薬について 上部のボタン */
  #dng_btns .dng_btns_wrapper {
    gap: 12px;
  }
  #dng_btns .dng_btns_wrapper a,
  #dng_btns .dng_btns_wrapper .active {
    width: calc(50% - 6px);
  }

  #dng_btns .button.border span {
    font-size: 14px;
    font-size: 1.4rem;
  }

  #dng_btns .dng_btns_wrapper .button {
    padding: 16px 12px 16px 16px;
  }

  #dng_btns .button.border span {
    display: grid;
    padding-left: 62px;
    padding-right: 0;
    min-height: 54px;
    width: 100%;
  }
  #dng_btns .button.border span::before {
    display: block;
    top: calc(50% - 27px);
    width: 54px;
    height: 54px;
    background-repeat: no-repeat;
    background-size: contain;
  }
  #dng_btns .icon_r_arrow.pc {
    position: relative;
    padding-right: 32px;
  }
  #dng_btns .icon_r_arrow.pc::after {
    position: absolute;
    content: "";
    display: block;
    background-image: url("../img/icon_arrow-right.svg");
    background-repeat: no-repeat;
    background-position: center;
    width: 24px;
    height: 24px;
  }
  #dng_btns .wrapper.qa {
    margin-bottom: 250px;
    padding-bottom: 50px;
  }
}

@media screen and (min-width: 1120px) {
  #dng_btns .dng_btns_wrapper {
    gap: 12px;
    flex-wrap: nowrap;
  }
  #dng_btns .dng_btns_wrapper a,
  #dng_btns .dng_btns_wrapper .active {
    width: calc(25% - 9px);
  }
}

@media screen and (min-width: 1200px) {
  #dng_btns .dng_btns_wrapper {
    gap: 24px;
  }
  #dng_btns .dng_btns_wrapper a,
  #dng_btns .dng_btns_wrapper .active {
    width: calc(25% - 18px);
  }
}

.contents_wrapper {
  display: flex;
  flex-direction: column;
  gap: 32px;
  padding: 24px 16px;
  border-radius: 24px;
  border: solid 1px var(--border-color);
}

.contents_border > * {
  margin: 0;
}

.accordion-content dl {
  font-size: 14px;
  font-size: 1.4rem;
}
.accordion-content dl.appearance > div {
  margin: 8px 0;
}
.accordion-content dl.appearance > div:last-child {
  margin: 0;
}
.appearance dt {
  margin-bottom: 4px;
}
.contents_box dl {
  font-size: 12px;
  font-size: 1.2rem;
}
.contents_box dl.appearance.num_list > div:nth-child(2) {
  margin: 16px 0;
}
.contents_box dl.appearance.num_list > div:first-child,
.contents_box dl.appearance.num_list > div:last-child {
  margin: 0;
}
p + .contents_wrapper {
  margin: 18px 0;
}

@media screen and (min-width: 981px) {
  p + .contents_wrapper {
    margin: 24px 0;
  }
  .contents_wrapper {
    flex-direction: unset;
    align-items: center;
    padding: 32px;
    border-radius: 30px;
    border: solid 1px var(--border-color);
  }

  .contents_wrapper .img_box {
    max-width: 500px;
    height: auto;
  }

  .contents_wrapper .contents_box {
    max-width: 204px;
  }
}

#dose.section_bgw .img_box:last-child {
  margin: 32px auto 0;
}

@media screen and (min-width: 981px) {
  #dose.section_bgw .img_box:last-child {
    margin: 50px auto 0;
  }
}

/* pc titleの下50px開けたい場合に使用 */
@media screen and (min-width: 981px) {
  .space_large {
    margin-bottom: 50px;
  }
}

/* スマホサイズでパンくずリストに横スクロール発生する場合 */
#dose.section_bgw .img_box.card_img {
  width: 100%;
  margin: 24px auto 0;
}
