@charset "UTF-8";
/* ===============================================================
  general-dentistry.css

  目次
  1. ユーティリティ（基本・ブレイクポイント共通）
  2. レイアウト（グリッド・カラム）
  3. ベーススタイル（body・header）
  4. GD イントロセクション
  5. GD アイテム（リスト・カード共通）
  6. タグ・タグフロー
  7. ステップ・治療フロー
  8. 詰め物・被せ物（restoration）
  9. コア（core）
  10. 歯周病（periodontal）
  11. 親知らず（wisdom）
  12. 比較・注意事項

  ルール：
    固定サイズ        → calc(N * var(--px))
    可変フォント      → var(--fN)  ※1680px以下で縮小するもの
    17px固定          → calc(17 * var(--px)) / SP: calc(15 * var(--px))
    clamp()はそのまま維持
    レスポンシブ      → @media screen and (max-width: 834px)
=============================================================== */
/* ---------------------------------------------------------------
  1. ユーティリティ
--------------------------------------------------------------- */
.en {
  font-family: var(--inter);
}

.pc {
  display: block;
}

.sp {
  display: none;
}

@media screen and (max-width: 834px) {
  .pc {
    display: none;
  }
  .sp {
    display: block;
  }
}
/* ---------------------------------------------------------------
  2. レイアウト（グリッド・カラム）
--------------------------------------------------------------- */
/* 2カラム */
.column-2 {
  display: grid;
  grid-template-columns: 47% 47%;
  align-items: center;
  justify-content: space-between;
}

@media screen and (max-width: 834px) {
  .column-2 {
    display: flex;
    flex-direction: column;
  }
}
/* 3カラム カード */
.GD-item__card {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: calc(40 * var(--px));
}

.GD-item__card .card {
  display: flex;
  flex-direction: column;
  list-style: none;
}

.GD-item__card .card .GD-item__picture img {
  width: 100%;
  height: auto;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
}

.GD-item__card .card .GD-item__text-box {
  margin-top: calc(20 * var(--px));
}

.GD-item__card .card .GD-item__sub-title {
  font-size: var(--f20);
  line-height: 1.5;
  font-weight: 400;
  color: #979fd3;
  height: 54px;
}

.GD-item__card .card .GD-item__text {
  margin-top: calc(16 * var(--px));
  font-size: var(--f17);
  line-height: 2;
}

@media screen and (max-width: 834px) {
  .GD-item__card {
    grid-template-columns: 1fr;
    gap: calc(32 * var(--px));
  }
  .GD-item__card .card .GD-item__text-box {
    margin-top: calc(16 * var(--px));
  }
  .GD-item__card .card .GD-item__sub-title {
    font-size: calc(18 * var(--px));
    height: auto;
  }
  .GD-item__card .card .GD-item__text {
    font-size: calc(14 * var(--px));
    line-height: 1.9;
  }
}
/* ステップグリッド */
.step-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: calc(45 * var(--px));
}

@media screen and (max-width: 834px) {
  .step-grid {
    grid-template-columns: 1fr;
    gap: calc(30 * var(--px));
  }
}
/* ステップカード */
.step-card {
  position: relative;
}

.step-card::after {
  content: "";
  position: absolute;
  top: 28%;
  right: calc(-27 * var(--px));
  width: calc(14 * var(--px));
  height: calc(28 * var(--px));
  background: url(../img/general-dentistry/arrow.webp) no-repeat center center/contain;
}

.step-card:last-child::after {
  display: none;
}

.step-card__body {
  margin-top: calc(12 * var(--px));
}

.step-card__body .step-card__title {
  text-align: center;
  font-weight: 500;
  font-size: var(--f20);
  color: #979fd3;
}

.step-card__body .step-card__text {
  font-size: calc(15 * var(--px));
  font-weight: 400;
}

@media screen and (max-width: 834px) {
  .step-card::after {
    top: auto;
    bottom: calc(-25 * var(--px));
    right: 50%;
    transform: translateX(50%) rotate(90deg);
    -webkit-transform: translateX(50%) rotate(90deg);
  }
  .step-card:last-child::after {
    display: none;
  }
  .step-card__body .step-card__title {
    font-size: calc(16 * var(--px));
  }
  .step-card__body .step-card__text {
    font-size: calc(14 * var(--px));
  }
}
/* 背景：紫 */
.ppl-bg {
  background-color: #f3f4fd;
  margin-top: calc(54 * var(--px));
  border-radius: calc(15 * var(--px));
  padding: calc(58 * var(--px)) 5% calc(87 * var(--px));
}

@media screen and (max-width: 834px) {
  .ppl-bg {
    margin-top: calc(32 * var(--px));
    border-radius: calc(10 * var(--px));
    padding: calc(30 * var(--px)) 5% 0 5%;
  }
}
/* タイトル背景 */
.bg-title {
  background-color: #979fd3;
}

/* menu-c__ttl02 アクセント */
.menu-c__ttl02::before {
  background-color: #979fd3;
}

/* ---------------------------------------------------------------
  3. ベーススタイル（body・header）
--------------------------------------------------------------- */
body {
  font-weight: 400;
}

/* ---------------------------------------------------------------
  4. GD イントロセクション
--------------------------------------------------------------- */
.GD-intro {
  padding: calc(120 * var(--px)) 0;
}

@media screen and (max-width: 834px) {
  .GD-intro {
    padding: calc(40 * var(--px)) 0 calc(30 * var(--px));
  }
}
h2.GD-intro__title {
  font-size: var(--f40);
  font-weight: 500;
  text-align: center;
  font-family: var(--notoserif);
  margin-bottom: calc(37 * var(--px));
}

@media screen and (max-width: 834px) {
  h2.GD-intro__title {
    font-size: var(--f28);
    margin-bottom: calc(20 * var(--px));
  }
}
.GD-intro__box {
  gap: clamp(30px, 7vw, 90px);
}

.GD-intro__picture {
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(20 * var(--px));
}

.GD-intro__picture img {
  max-width: calc(337 * var(--px));
}

@media screen and (max-width: 834px) {
  .intro {
    flex-direction: column-reverse;
  }
  .GD-intro__picture {
    padding: calc(20 * var(--px));
    width: 100%;
  }
  .GD-intro__picture img {
    max-width: 100%;
  }
}
.GD-intro__note {
  margin-top: calc(12 * var(--px));
  font-size: calc(12 * var(--px));
  color: #373030;
}

/* お悩みリスト */
.general-dentistry .menu-c__intro__problem-list {
  gap: calc(30 * var(--px)) 0;
}

.general-dentistry .menu-c__intro__problem-item {
  min-width: auto;
  width: 27%;
}

@media screen and (max-width: 834px) {
  .general-dentistry .menu-c__intro__problem-item {
    min-width: calc(189 * var(--px));
    padding-left: calc(25 * var(--px));
    line-height: calc(20 * var(--px));
  }
}
/* ---------------------------------------------------------------
  5. GD アイテム（リスト・カード共通）
--------------------------------------------------------------- */
.GD-list {
  display: flex;
  flex-direction: column;
  gap: calc(90 * var(--px));
}

@media screen and (max-width: 834px) {
  .GD-list {
    gap: calc(48 * var(--px));
  }
}
.GD-item {
  background-color: #fff;
  border-radius: calc(30 * var(--px));
  padding: calc(60 * var(--px)) 5% calc(90 * var(--px));
}

@media screen and (max-width: 834px) {
  .GD-item {
    border-radius: calc(15 * var(--px));
    padding: calc(30 * var(--px)) 5% calc(40 * var(--px));
  }
}
.GD-item__title {
  background: #979fd3;
}

/* GD アイテム イントロ */
.GD-item__intro {
  grid-template-columns: 46% 48%;
}

.GD-item__intro .GD-item__sub-title {
  font-size: var(--f32);
  line-height: 1.6;
  font-weight: 400;
}

.GD-item__intro .GD-item__text {
  margin-top: calc(30 * var(--px));
}

@media screen and (max-width: 834px) {
  .GD-item__intro {
    gap: calc(24 * var(--px));
  }
  .GD-item__intro .GD-item__sub-title {
    font-size: var(--f24);
  }
  .GD-item__intro .GD-item__text {
    margin-top: calc(16 * var(--px));
    font-size: calc(14 * var(--px));
  }
}
/* ---------------------------------------------------------------
  6. タグ・タグフロー
--------------------------------------------------------------- */
.tag {
  margin-top: calc(30 * var(--px));
  display: flex;
  flex-wrap: wrap;
  gap: calc(10 * var(--px));
}

.tag li {
  padding: calc(9 * var(--px)) calc(15 * var(--px));
  border-radius: calc(14 * var(--px));
  background: #979fd3;
  color: #fff;
  line-height: 1;
  font-size: calc(15 * var(--px));
  font-weight: 400;
}

@media screen and (max-width: 834px) {
  .tag {
    margin-top: calc(20 * var(--px));
    gap: calc(8 * var(--px));
  }
  .tag li {
    font-size: calc(13 * var(--px));
    padding: calc(7 * var(--px)) calc(12 * var(--px));
  }
}
/* タグフロー共通 */
.tag-flow {
  margin-top: calc(25 * var(--px));
  display: grid;
  gap: calc(25 * var(--px));
}

.tag-flow li {
  position: relative;
  background: #f8f6f1;
  border-radius: calc(10 * var(--px));
  padding: calc(15 * var(--px)) 10%;
  display: flex;
  align-items: center;
  flex-direction: column;
}

.tag-flow li::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: calc(-15 * var(--px));
  width: calc(11 * var(--px));
  height: calc(22 * var(--px));
  background: url(../img/general-dentistry/arrow.webp) no-repeat center center/contain;
}

.tag-flow li:last-child::after {
  content: none;
}

.tag-flow li .number {
  padding: calc(6 * var(--px)) calc(15 * var(--px));
  border-radius: calc(10 * var(--px));
  background: #979fd3;
  color: #fff;
  line-height: 1;
  font-size: calc(14 * var(--px));
  font-weight: 400;
  margin-bottom: calc(21 * var(--px));
}

.tag-flow li .title {
  font-size: calc(16 * var(--px));
  font-weight: 500;
  color: #979fd3;
  text-align: center;
  line-height: 1.6;
}

.tag-flow li .title span {
  font-size: calc(12 * var(--px));
}

/* 3列フロー（詰め物） */
.tag-flow1 {
  grid-template-columns: repeat(3, 1fr);
}

/* 4列フロー（被せ物） */
.tag-flow2 {
  grid-template-columns: repeat(4, 1fr);
}

.tag-flow2 li .number {
  font-size: calc(14 * var(--px));
}

.tag-flow2 li .title {
  font-size: calc(13 * var(--px));
}

.tag-flow2 li .title span {
  font-size: calc(10 * var(--px));
}

@media screen and (max-width: 834px) {
  .tag-flow1,
  .tag-flow2 {
    grid-template-columns: 1fr;
    gap: calc(32 * var(--px));
  }
  .tag-flow li::after {
    top: auto;
    right: 50%;
    bottom: calc(-20 * var(--px));
    transform: translateX(50%) rotate(90deg);
  }
  .tag-flow li {
    padding: calc(15 * var(--px)) 5%;
  }
  .tag-flow2 li .title {
    font-size: calc(16 * var(--px));
  }
  .tag-flow2 li .title span {
    font-size: calc(12 * var(--px));
  }
}
/* ---------------------------------------------------------------
  7. ステップ・治療フロー
--------------------------------------------------------------- */
.step__title {
  font-size: var(--f32);
  font-weight: 400;
  text-align: center;
  color: #979fd3;
  margin-bottom: calc(25 * var(--px));
}

@media screen and (max-width: 834px) {
  .step__title {
    font-size: calc(20 * var(--px));
    margin-bottom: calc(16 * var(--px));
  }
}
.step__sub-title {
  font-size: var(--f24);
  background-color: #979fd3;
  font-family: var(--notosans);
  border-radius: calc(10 * var(--px));
  padding: calc(10 * var(--px));
}

@media screen and (max-width: 834px) {
  .step__sub-title {
    font-size: var(--f18);
    border-radius: calc(8 * var(--px));
    padding: calc(8 * var(--px));
  }
}
.step__text {
  text-align: center;
  font-size: var(--f17);
  margin-bottom: calc(40 * var(--px));
  font-weight: 400;
}

@media screen and (max-width: 834px) {
  .step__text {
    font-size: calc(14 * var(--px));
    margin-bottom: calc(24 * var(--px));
    text-align: left;
  }
}
/* むし歯治療ガイド */
.treatment__figure {
  text-align: center;
  margin-bottom: calc(32 * var(--px));
}

.treatment__figure img {
  max-width: 100%;
  height: auto;
}

@media screen and (max-width: 834px) {
  .treatment__figure {
    border-radius: 5px;
    overflow-x: auto;
    white-space: nowrap;
    scroll-snap-type: x mandatory;
    margin: 8rem auto 0;
    flex-direction: row;
    row-gap: 20px;
    margin-top: 20px;
    padding: 2rem 3%;
    max-width: none;
  }
  .treatment__figure img {
    max-width: 100%;
    min-width: 600px;
    vertical-align: top;
  }
}
/* 治療フロー */
.treatment__flow {
  margin-top: calc(64 * var(--px));
  position: relative;
}

.treatment__flow .flow-bar {
  position: absolute;
  height: 90%;
  width: calc(70 * var(--px));
  z-index: 10;
  left: 0%;
  top: 50%;
  transform: translateY(-50%);
}

.treatment__flow .flow-bar img {
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.treatment__flow .flow__list {
  display: flex;
  flex-direction: column;
}

.treatment__flow .flow__item {
  display: flex;
  align-items: flex-start;
  gap: calc(20 * var(--px));
  border-bottom: 2px dotted #dddddd;
  padding: calc(50 * var(--px)) 5% calc(44 * var(--px)) 15%;
}

.treatment__flow .flow__item:first-child {
  border-top: 2px dotted #dddddd;
}

.treatment__flow .flow__item:last-child {
  border-bottom: none;
}

.treatment__flow .flow__item-picture {
  border-radius: calc(10 * var(--px));
  background: #ffffff;
  padding: calc(10 * var(--px)) calc(10 * var(--px)) 0;
  width: 22%;
}

.treatment__flow .flow__item--text-box {
  width: 78%;
}

.treatment__flow .flow__item-title {
  font-size: var(--f24);
  font-weight: 400;
  font-family: var(--notoserif);
  margin-bottom: calc(20 * var(--px));
}

.treatment__flow .flow__item-title span {
  padding: calc(3.5 * var(--px)) calc(15 * var(--px));
  border-radius: calc(10 * var(--px));
  background: #979fd3;
  color: #fff;
  line-height: 1;
  font-size: calc(15 * var(--px));
  font-weight: 400;
  font-family: var(--notosans);
  margin-right: calc(10 * var(--px));
}

.treatment__flow .flow__item-text {
  font-weight: 400;
  font-size: var(--f17);
}

.treatment__flow .flow__item-button.button {
  color: #979fd3;
}
.treatment__flow .flow__item-button.button .link-arrow:after {
  transform: rotate(90deg);
}
.treatment__flow .flow__item-button.button:hover .link-arrow {
  background: var(--brown);
}
.treatment__flow .flow__item-button.button:hover .link-arrow:after {
  animation: arrow-slide-down 0.5s ease-out forwards;
  transform: rotate(0deg) translate(100%, 100%);
  background-color: rgb(255, 255, 255);
}

.treatment__flow .flow__item-button.button.pc {
  display: flex;
}

@media screen and (max-width: 834px) {
  .treatment__flow {
    margin-top: calc(32 * var(--px));
  }
  .treatment__flow .flow__item {
    padding: calc(24 * var(--px)) 3% calc(44 * var(--px)) 17%;
    flex-wrap: wrap;
    justify-content: space-between;
    flex-direction: row;
    gap: calc(7 * var(--px));
  }
  .treatment__flow .flow__item-picture {
    width: 40%;
    border-radius: calc(5 * var(--px));
  }
  .treatment__flow .flow__item--text-box {
    width: 55%;
  }
  .treatment__flow .flow__item-text.sp {
    width: 100%;
  }
  .treatment__flow .flow__item-button.button.pc {
    display: none;
  }
  .treatment__flow .flow__item-button.button.sp {
    width: 100%;
    padding: 0;
    font-size: 12px;
    display: flex;
  }
  .treatment__flow .flow__item-title {
    font-size: calc(15 * var(--px));
    line-height: 1.5;
  }
  .treatment__flow .flow__item-title span {
    font-size: calc(10 * var(--px));
    width: -moz-fit-content;
    width: fit-content;
    display: block;
    margin-bottom: 10px;
  }
  .treatment__flow .flow__item-text {
    font-size: calc(12 * var(--px));
    line-height: 1.6;
  }
  .treatment__flow .flow-bar {
    height: 90%;
    width: calc(35 * var(--px));
    left: -3%;
    top: 10px;
    transform: none;
  }
}
/* 根管治療ステップ */
.GD-item__step .step__text {
  width: 71%;
  text-align: left;
  margin: 0 auto calc(40 * var(--px));
}

@media screen and (max-width: 834px) {
  .GD-item__step .step__text {
    width: 100%;
    margin: 0 0 calc(24 * var(--px));
  }
}
/* feature テキスト */
.feature__text {
  margin-bottom: calc(30 * var(--px));
}

/* ppl-bg 内の sub-title */
.ppl-bg .GD-item__sub-title {
  color: #979fd3;
  font-family: var(--notosans);
}

/* ---------------------------------------------------------------
  8. 詰め物・被せ物（restoration）
--------------------------------------------------------------- */
.restoration .GD-item__sub-title {
  color: #979fd3;
}

/* 被せ物セクション区切り */
.crown {
  border-top: 2px dotted #dddddd;
  margin-top: calc(60 * var(--px));
  padding-top: calc(65 * var(--px));
}

@media screen and (max-width: 834px) {
  .crown {
    margin-top: calc(40 * var(--px));
    padding-top: calc(40 * var(--px));
  }
}
/* ---------------------------------------------------------------
  9. コア（core）
--------------------------------------------------------------- */
.core {
  margin-bottom: calc(78 * var(--px));
}

@media screen and (max-width: 834px) {
  .core {
    margin-bottom: calc(40 * var(--px));
  }
}
.GD-item__core-bottom {
  gap: calc(30 * var(--px));
}

.GD-item__core-bottom li {
  align-items: flex-start;
  grid-template-columns: 45% 49%;
}

@media screen and (max-width: 834px) {
  .GD-item__core-bottom li {
    grid-template-columns: 1fr;
    gap: calc(16 * var(--px));
  }
  .GD-item__core-bottom .GD-item__picture {
    margin: 0 auto;
  }
}
.GD-item__core-bottom-title {
  color: #6370c4;
  font-size: var(--f20);
  font-weight: 400;
  border-bottom: 2px dotted #e1ded8;
}

.core-bottom__sub-title {
  display: flex;
  align-items: center;
  margin-top: calc(15 * var(--px));
  margin-bottom: calc(10 * var(--px));
}

.core-bottom__sub-title img {
  width: calc(30 * var(--px));
  margin-right: calc(5 * var(--px));
}

.core-bottom__text {
  font-size: calc(15 * var(--px));
}

/* ---------------------------------------------------------------
  10. 歯周病（periodontal）
--------------------------------------------------------------- */
/* 進行度グリッド */
.periodontal-step {
  margin-top: calc(38 * var(--px));
  grid-template-columns: repeat(5, 1fr);
}

.periodontal-step .GD-item__picture {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  text-align: center;
}

.periodontal-step .GD-item__picture img {
  aspect-ratio: 16.5/17.4;
  max-height: calc(170 * var(--px));
  -o-object-fit: contain;
     object-fit: contain;
}

.periodontal-step .GD-item__sub-title {
  margin: calc(23 * var(--px)) 0 calc(10 * var(--px));
  border-radius: calc(5 * var(--px));
  padding: calc(3.5 * var(--px)) 0;
  text-align: center;
  font-weight: 700;
  line-height: 1.2;
  font-size: var(--f20);
}

.periodontal-step .GD-item__text {
  font-size: calc(15 * var(--px));
}

/* 進行度ラベル色 */
.periodontal-step li.step-card:first-child .GD-item__sub-title {
  color: #979fd3;
  background: #ebedfb;
}

.periodontal-step li.step-card:nth-child(2) .GD-item__sub-title {
  color: #979fd3;
  background: #d9ddf6;
}

.periodontal-step li.step-card:nth-child(3) .GD-item__sub-title {
  color: #fff;
  background: #c5cae9;
}

.periodontal-step li.step-card:nth-child(4) .GD-item__sub-title {
  color: #fff;
  background: #afb5de;
}

.periodontal-step li.step-card:nth-child(5) .GD-item__sub-title {
  color: #fff;
  background: #979fd3;
}

@media screen and (max-width: 834px) {
  .periodontal-step {
    gap: calc(20 * var(--px)) calc(20 * var(--px));
    grid-template-columns: 47% 47%;
  }
  .periodontal-step .GD-item__picture img {
    max-height: calc(120 * var(--px));
  }
  .periodontal-step .GD-item__sub-title {
    font-size: calc(14 * var(--px));
    margin: calc(12 * var(--px)) 0 calc(8 * var(--px));
  }
  .periodontal-step .step-card::after {
    content: "";
    position: absolute;
    top: 28%;
    right: calc(-14 * var(--px));
    width: calc(10 * var(--px));
    height: calc(23 * var(--px));
    transform: none;
    -webkit-transform: none;
  }
}
/* スケーリング・ルートプレーニング イントロ */
.priodontal-treatment__intro {
  margin-bottom: calc(50 * var(--px));
}

.priodontal-treatment__intro .GD-item__sub-title {
  font-size: var(--f28);
  color: #373030;
  line-height: 1.5;
  margin-bottom: calc(20 * var(--px));
  font-weight: 400;
}

@media screen and (max-width: 834px) {
  .priodontal-treatment__intro {
    margin-bottom: calc(32 * var(--px));
    gap: calc(20 * var(--px));
  }
  .priodontal-treatment__intro .GD-item__sub-title {
    font-size: var(--f20);
  }
}
/* スケーリング・ルートプレーニング リスト */
.priodontal-treatment__list {
  margin-bottom: calc(58 * var(--px));
  align-items: flex-start;
}

.priodontal-treatment__list .GD-item__sub-title {
  font-size: var(--f20);
  padding: calc(10 * var(--px)) 0;
  font-weight: 400;
}

.priodontal-treatment__list .GD-item__text {
  font-size: calc(15 * var(--px));
}

@media screen and (max-width: 834px) {
  .priodontal-treatment__list {
    margin-bottom: calc(32 * var(--px));
    gap: calc(24 * var(--px));
  }
  .priodontal-treatment__list .GD-item__sub-title {
    font-size: var(--f18);
  }
}
/* 歯周組織再生療法 */
.regenerative__title {
  text-align: center;
  font-size: var(--f28);
  font-weight: 400;
  margin-bottom: calc(23 * var(--px));
}

.regenerative__text {
  width: 71%;
  text-align: left;
  margin: 0 auto calc(40 * var(--px));
}

.regenerative__grid {
  margin-top: calc(54 * var(--px));
  grid-template-columns: repeat(5, 1fr);
}

.regenerative__grid .step-card::after {
  top: 38%;
}

.regenerative__grid .step-card__image {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  text-align: center;
}

.regenerative__grid .step-card__image img {
  -o-object-fit: contain;
     object-fit: contain;
}

@media screen and (max-width: 834px) {
  .regenerative__title {
    font-size: var(--f22);
  }
  .regenerative__text {
    width: 100%;
    margin: 0 0 calc(24 * var(--px));
  }
  .regenerative__grid {
    gap: calc(20 * var(--px)) calc(20 * var(--px));
    grid-template-columns: 47% 47%;
    margin-top: calc(32 * var(--px));
  }
  .regenerative__grid .step-card::after {
    content: "";
    position: absolute;
    top: 28%;
    right: calc(-14 * var(--px));
    width: calc(10 * var(--px));
    height: calc(23 * var(--px));
    transform: none;
    -webkit-transform: none;
  }
}
/* ---------------------------------------------------------------
  11. 親知らず（wisdom）
--------------------------------------------------------------- */
/* 特徴リスト */
.GD-item__feature-list {
  align-items: flex-start;
}

.GD-item__feature-list .GD-item__feature-item {
  align-items: flex-start;
  grid-template-columns: 45% 49%;
}

.GD-item__feature-list .GD-item__sub-title {
  font-size: var(--f20);
  font-weight: 400;
  color: #979fd3;
  margin-bottom: calc(34 * var(--px));
}

.GD-item__feature-list .GD-item__text {
  font-size: calc(15 * var(--px));
  margin-bottom: calc(15 * var(--px));
}

@media screen and (max-width: 834px) {
  .GD-item__feature-list {
    gap: calc(32 * var(--px));
  }
  .GD-item__feature-list .GD-item__feature-item {
    grid-template-columns: 1fr;
    gap: calc(16 * var(--px));
  }
  .GD-item__feature-list .GD-item__sub-title {
    font-size: var(--f18);
    margin-bottom: calc(20 * var(--px));
  }
  .GD-item__feature-list .GD-item__picture {
    margin: 0 auto;
  }
}
/* 抜歯の流れ */
.GD-item__OB .step__text {
  width: 71%;
  text-align: left;
  margin: 0 auto calc(40 * var(--px));
}

.GD-item__OB .step-card::after {
  top: 36%;
}

@media screen and (max-width: 834px) {
  .GD-item__OB .step__text {
    width: 100%;
    margin: 0 0 calc(24 * var(--px));
  }
}
/* ---------------------------------------------------------------
  12. 比較・注意事項
--------------------------------------------------------------- */
/* 比較リスト（抜歯する・しない） */
.comparison__list {
  margin-top: calc(66 * var(--px));
  align-items: flex-start;
}

.comparison__list .comparison__title {
  display: flex;
  align-items: center;
  gap: calc(10 * var(--px));
  font-size: var(--f24);
  border-bottom: 2px dotted #e1ded8;
  font-weight: 400;
  margin-bottom: calc(10 * var(--px));
}

.comparison__list .comparison__title img {
  width: calc(30 * var(--px));
}

.comparison__list .comparison__c-list {
  display: flex;
  flex-direction: column;
  gap: calc(10 * var(--px));
}

.comparison__list .comparison__c-item {
  position: relative;
  font-weight: 500;
  padding-left: 20px;
}

.comparison__list .comparison__c-item::before {
  content: "";
  width: calc(10 * var(--px));
  aspect-ratio: 1/1;
  background-color: #979fd3;
  border-radius: 50%;
  margin-right: calc(10 * var(--px));
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}

@media screen and (max-width: 834px) {
  .comparison__list {
    margin-top: calc(40 * var(--px));
    gap: calc(24 * var(--px));
  }
  .comparison__list .comparison__title {
    font-size: var(--f20);
  }
  .comparison__list .comparison__c-list {
    padding-left: 25px;
  }
  .comparison__list .comparison__c-item {
    font-size: calc(14 * var(--px));
    padding-left: 0px;
  }
  .comparison__list .comparison__c-item::before {
    top: 15px;
    left: -19px;
  }
}
/* 注意事項 */
.GD-item__notion {
  background: #f6f6f6;
  border-radius: calc(15 * var(--px));
  padding: calc(75 * var(--px)) 6% calc(50 * var(--px));
  margin-top: calc(45 * var(--px));
}

.GD-item__notion .notion__title {
  color: #df0000;
  text-align: center;
  margin-bottom: calc(30 * var(--px));
  font-weight: 500;
  font-family: var(--notoserif);
  font-size: var(--f28);
}

.GD-item__notion .notion__list {
  display: flex;
  flex-direction: column;
  gap: calc(30 * var(--px));
}

.GD-item__notion .notion__item {
  position: relative;
  font-weight: 500;
  text-indent: -23px;
}

.GD-item__notion .notion__item::before {
  content: "";
  width: calc(10 * var(--px));
  aspect-ratio: 1/1;
  background-color: #979fd3;
  border-radius: 50%;
  margin-right: calc(10 * var(--px));
  display: inline-block;
}

@media screen and (max-width: 834px) {
  .GD-item__notion {
    border-radius: calc(10 * var(--px));
    padding: calc(40 * var(--px)) 5% calc(32 * var(--px));
    margin-top: calc(32 * var(--px));
  }
  .GD-item__notion .notion__title {
    font-size: var(--f22);
    margin-bottom: calc(20 * var(--px));
  }
  .GD-item__notion .notion__list {
    gap: calc(20 * var(--px));
    padding-left: calc(20 * var(--px));
  }
  .GD-item__notion .notion__item {
    font-size: calc(14 * var(--px));
    text-indent: calc(-19 * var(--px));
  }
  .GD-item__notion .notion__item::before {
    margin-right: calc(7 * var(--px));
  }
}
.under .access-block {
  padding-bottom: clamp(50 * var(--px), 6.7261904762vw, 113 * var(--px));
}

.footer {
  margin-top: 0;
}

.access-block__parking-map img {
  height: auto;
}/*# sourceMappingURL=general-dentistry.css.map */