@charset "utf-8";

/* 共通
-------------------------------------*/

body.lower {
  overflow-x: hidden;
}

.lower main {
    letter-spacing: 0.15em;
}

.lower .post_box .inner,
.lower main:not(:has(.post_box)) {
    width: 100%;
    max-width: 1180px;
    padding: 0 20px;
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 960px) {
    .lower main {
/*        padding-top: 30px;*/
        /* width: 90%; */
    }

    .lower .post_box .inner,
    .lower main:not(:has(.post_box)) {
        width: 90%;
    }
}

/* タイトルタグ
-------------------------------------*/

.lower h2 {
  font-size: 28px;
  text-align: center;
  color: hsla(var(--maincolor-hsl), 1);
  color: #fff;
  margin-bottom: 30px;
  font-family: "Zen Maru Gothic", sans-serif;
  font-family: "dnp-shuei-mgothic-std", sans-serif;
  font-family: "Zen Old Mincho", serif;
  font-weight: bold;
  font-size: clamp(28px, calc(100vw - 960px), 38px);
  position: relative;
  padding: 20px 0;
}
.lower h2::before {
  content: "";
  position: absolute;
  left: -20px;
  right: -20px;
  top: 0;
  bottom: 0;
  background: hsla(var(--maincolor-hsl), 0.95);
  z-index: -1;
}
@media (min-width: 960px){ 
  .lower h2 {
    margin-bottom: 40px;
  }
  .lower h2::before {
    left: calc(50% - 50vw);
    right: unset;
    width: 100vw;
  }
}

.lower h3 {
    font-size: 22px;
    text-align: center;
    color: var(--maincolor);
    margin-bottom: 25px;
    font-family: "Zen Maru Gothic", sans-serif;
    font-weight: bold;
    font-size: clamp(22px, calc(100vw - 960px), 26px);
    line-height: 1.7;
}

.lower h4 {
    text-align: center;
    font-weight: bold;
    margin-bottom: 15px;
    font-size: 18px;
    color: rgba(108, 145, 142, 1);
    font-size: clamp(18px, calc(100vw - 960px), 20px);
}

/* 2カラム
-------------------------------------*/

.column2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}

.column2>div {
    margin-bottom: 20px;
}

.column2>div:nth-child(2n+1) {
    padding: 20px;
    background: rgba(145, 197, 192, 0.1);
}

.column2>div:nth-child(2n+0) {
    padding: 20px;
    background: rgba(197, 221, 35, 0.1);
}

.column2>div>ul {
    margin-bottom: 20px;
}

.column2>div>ul:last-child {
    margin-bottom: 0;
}

@media (min-width: 960px) {
    .column2>div {
        margin-bottom: 0;
    }
}

@media (max-width: 767px) {
    .column2.sp_block {
        grid-template-columns: 1fr;
    }
}

/* 3カラム
--------------------------------------- */
.column3 {
    display: grid;
    gap: 30px;
}

.column3>div {
    padding: 24px;
}

@media (min-width: 960px) {
    .column3 {
        grid-template-columns: repeat(3, 1fr);
    }
}


.column3_2 {
    display: grid;
    gap: 30px;
}

.column3_2>div {
    padding: 24px;
}

@media (min-width: 960px) {
    .column3_2 {
        grid-template-columns: repeat(6, 1fr);
    }

    .column3_2>div {
        grid-column: span 2;
    }

    .column3_2>div:nth-child(5n+1) {
        grid-column: 2 / 4;
    }
}

/* スタッフ顔写真
-------------------------------------*/
.staff_comments {
    padding: 20px 20px 20px 100px;
    position: relative;
    display: grid;
    align-items: center;
    min-height: 80px;
    line-height: 1.2;
    font-size: 18px;
    margin-bottom: 30px;
    font-family: "noto sans jp", sans-serif;
}

.staff_comments::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 80px;
    height: 80px;
    border-radius: 50%;
}

.staff_comments_name {
    font-weight: bold;
}

.staff_comments_en {
    font-size: 80%;
    font-family: yuji-syuku;
    letter-spacing: 0.05px;
}

.staff_comments01::before {
    background: url("../../../uploads/2026/05/img_face_takeshima_owner.jpg") 50% 50% / contain no-repeat;
  background-color: hsla(var(--maincolor-hsl), 1);
}
.staff_comments02::before {
    background: url("../../../uploads/2026/05/img_face_takeshima_doctor.jpg") 50% 50% / contain no-repeat;
  background-color: hsla(var(--maincolor-hsl), 1);
}





.staff_comments_ver02  {
  padding: 20px 20px 20px 180px;
  position: relative;
  display: grid;
  align-items: center;
  min-height: 80px;
  line-height: 1.2;
  font-size: 18px;
  margin-bottom: 30px;
  font-family: "noto sans jp", sans-serif;
  font-size: clamp(19px, calc(100vw - 960px), 24px);
  text-box-trim: trim-both;
  min-height: 160px;
}
.staff_comments_ver02::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 160px;
  height: 160px;
  border-radius: 50%;
}
.staff_comments_ver02 .staff_comments_position {
  font-size: 70%;
  display: inline-block;
  margin-bottom: 0.3em;
}
.staff_comments_ver02 .staff_comments_name {
  margin-right: 0.5em;
}
.staff_comments_ver02 .staff_comments_en {
  font-size: 60%;
}

@media (min-width: 560px){
  .ml-20_pc {
    margin-left: -20px;
  }
}
@media (max-width: 559px){
  .staff_comments_ver02  {
      padding: 20px 20px 20px 140px;
      min-height: 120px;
  }
  .staff_comments_ver02::before {
    width: 120px;
    height: 120px;
  }
}

/* 蛍光ペン
-------------------------------------*/
.highlighter {
    background: linear-gradient(180deg, rgba(255, 255, 0, 0) 60%, rgb(255, 255, 0) 60%);
}

/* タブ
------------------------------------------------------------------------------ */

/* 基本設定：ラジオボタン自体は隠す */
input[type="radio"] {
    display: none;
}

/* コンテンツは初期状態で非表示 */
.tab-content {
    display: none;
    padding: 24px;
    /* border: 1px solid #ccc; */
    /* margin-top: -1px; */
    background: #fff;
}

/* --- :has() を使った切り替えロジック --- */

/* #tab1がチェックされている時、.content1を表示 */
.tabs-container:has(#tab1:checked) .content1 {
    display: block;
}

/* #tab2がチェックされている時、.content2を表示 */
.tabs-container:has(#tab2:checked) .content2 {
    display: block;
}

/* #tab3がチェックされている時、.content3を表示 */
.tabs-container:has(#tab3:checked) .content3 {
    display: block;
}

/* --- アクティブなタブ（ラベル）の装飾 --- */

.tab-menu {
    display: flex;
    justify-content: center;
    margin: 30px;
    background: #eee;
    max-width: fit-content;
    margin: 30px auto;
    border-radius: 30px;
    padding: 5px;
    font-family: "Zen Maru Gothic", sans-serif;
    font-weight: bold;
}

.tab-menu label {
    padding: 10px 20px;
    cursor: pointer;
    background: #f0f0f0;
    /* border: 1px solid #ccc; */
    border-radius: 30px;
}

/* :has() で選択中のラベルに色をつける */
.tab-menu:has(+ .tab-content) label {
    /* 基本スタイル */
}

.tabs-container:has(#tab1:checked) label[for="tab1"],
.tabs-container:has(#tab2:checked) label[for="tab2"],
.tabs-container:has(#tab3:checked) label[for="tab3"] {
    background: #fff;
    border-bottom-color: transparent;
}


/*========================================================================

ページ毎のcss

========================================================================*/


/* ご挨拶
-------------------------------------*/

/*
.greeting_page {
    position: relative;
    padding-bottom: 40px;
}

.greeting_page::before {
    content: "";
    z-index: -1;
    pointer-events: none;
    left: 50%;
    width: 100vw;
    translate: -50% 0;
    background: hsla(var(--maincolor-hsl), 0.3);
    position: absolute;
    top: -20px;
    bottom: 0;
}

.greeting_page .post_custom_box {
    margin-bottom: 0;
}
*/

.ownername {
    font-size: 110%;
    font-family: "ab-ootori", sans-serif;
}

.ownername .potision {
    font-size: 90%
}

@media (min-width: 960px) {
    .greeting_page {
      padding-bottom: 0;
      margin-top: -40px;
    }

    .greeting_page .post_custom_box .post_custom_content {
        margin-bottom: 20px;
    }

    .greeting_page .post_custom_box .post_custom_img {
        align-self: end;
    }
}
@media (max-width: 959px) {
    .greeting_page {
      padding-top: 30px;
      margin-top: -20px;
    }
}


.kereki {
    border-collapse: collapse;
    border-spacing: 0;
}

.kereki td {
    padding: 8px 4px 8px 0;
    border-bottom: 1px solid #000;
}

.kereki tr:first-child td {
    padding-top: 8px;
}

.kereki tr:last-child td {
    border-bottom: 0;
}

@media (max-width: 959px) {
  .kereki tr td:first-child {
    padding-right: 8px;
    white-space: nowrap;
  }
}

/* グーグルマップ
-------------------------------------*/
.googlemap_container iframe {
    width: 100%;
    height: 400px;
}

.google_map_map_parking {
    position: relative;
    overflow: hidden;
    padding-top: 70%;
}

.google_map_map_parking iframe {
    top: -60px;
    position: absolute;
    height: calc(100% + 60px);
    left: 0;
    right: 0;
}

/* インプラントなど
-------------------------------------*/
.flowstyle01>dl {
    padding-bottom: 90px;
    position: relative;
}

.flowstyle01>dl>dt {
    margin-bottom: 10px;
    color: rgb(141, 165, 160);
    font-weight: bold;
}

.flowstyle01>dl>dd {
    padding: 20px;
    background: rgba(145, 197, 192, 0.2);
}

.flowstyle01>dl::after {
    content: "";
    position: absolute;
    width: 100px;
    height: 40px;
    background: rgb(141, 165, 160);
    left: 50%;
    margin: 0 0 20px -50px;
    bottom: 0;
    clip-path: polygon(0 0, 100% 0%, 50% 100%);
}

.flowstyle01>dl:last-child {
    padding-bottom: 0;
}

.flowstyle01>dl:last-child::after {
    content: none;
}



/* 初診の流れ
-------------------------------------*/
.post_custom_content:has(.flow_box_table) {
    position: relative;
    padding-bottom: 60px;
}

.post_custom_content:has(.flow_box_table)::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 100vw;
    height: 100%;
    translate: -50% 0;
    pointer-events: none;
    background: hsla(var(--maincolor-hsl), 0.2);
    z-index: -1;
}

.post_box:has(.flow_box_table):last-child .post_custom_box {
    margin-bottom: 0;
}

.flow_box_table {
    margin: 0 auto;
    max-width: 500px;
}

.flow_box_table tr {
    position: relative;
}

.flow_box_table tr::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    width: 80px;
    height: 24px;
    clip-path: polygon(0% 0%, 100% 0, 50% 100%);
    background: #fff;
    translate: -50% -1px;
}

.flow_box_table tr::has(.title)::after {
    content: none;
}

.flow_box_table tr:last-child::after {
    content: none;
}

.flow_box_table .title {
    padding-top: 40px;
    color: #000;
    font-size: 20px;
    padding-bottom: 10px;
    color: hsla(var(--maincolor-hsl), 1);
    ;
    font-weight: bold;
    letter-spacing: 0.05em;
}

.flow_box_table .img {
    padding: 20px;
    background: #fff;
    vertical-align: top;
}

.flow_box_table .text {
    background: #fff;
    padding: 0 20px 20px;
    vertical-align: top;
}

@media (min-width: 960px) {
    .flow_box_table {
        max-width: 100%;
    }

    .flow_box_table .img {
        width: 35%;
    }

    .flow_box_table .text {
        width: calc(65% - 20px);
        padding: 20px 20px 20px 0;
    }
}

@media (max-width: 959px) {

    .flow_box_table tr,
    .flow_box_table .title,
    .flow_box_table .img,
    .flow_box_table .text {
        display: block;
    }
}


/* お問い合わせ
-------------------------------------*/

.contactForm_box {
    max-width: fit-content;
    margin: auto;
}

.input-box {
    margin-bottom: 30px;
}

.input-box .error-message {
    display: none;
    color: #f00;
    font-size: 90%;
}

.input-box .wpcf7-not-valid-tip {
    display: none;
}

.input-box:has(.wpcf7-not-valid-tip) .error-message {
    display: block;
}

.input-wrappr {
    position: relative;
    width: 100%;
    max-width: 400px;
    border: 1px solid #c8ccd4;
}

.post_custom_content .input-wrappr p {
    margin-bottom: 0;
}

.input-wrappr input[type="text"],
.input-wrappr input[type="email"],
.input-wrappr input[type="tel"],
.input-wrappr input[type="date"] {
    -webkit-appearance: none;
    width: 100%;
    border: 0;
    font-family: inherit;
    padding: 0.5em;
    height: 2.5em;
    font-size: 16px;
    font-weight: 500;
    background: none;
    border-radius: 0;
    transition: all 0.15s ease;
}

.input-wrappr .input-name {
    position: absolute;
    inset: 0em auto auto 1em;
    transform-origin: 0 0;
    transition: all 0.2s ease;
}

.input-wrappr:has(textarea) .input-name,
.input-wrappr:has(select) .input-name,
.input-wrappr:has(input:focus) .input-name,
.input-wrappr:has(input:hover) .input-name,
.input-wrappr:has(input:not(:placeholder-shown)) .input-name {
    font-size: .8em;
    /*    inset -1em; auto auto 1em;*/
    inset: -1em auto auto 1em;
    background: #fff;
    padding: 0 .5em;
}

.input-wrappr select {
    border: 0;
    padding: 15px 0.2em 10px 0.2em;
    width: 100%;
}

.input-wrappr textarea {
    border: 0;
    padding: 15px 0.2em 10px 0.5em;
    width: 100%;
    height: 200px;
}

hr.space {
    border: 0;
    margin: 20px;
}

.input-wrappr:has(input[type="checkbox"]),
.input-wrappr:has(input[type="radio"]) {
    border: 0;
    padding-top: 20px;
}

.wpcf7-checkbox .wpcf7-list-item {
    margin-left: 0;
    display: block;
    margin-bottom: 0.5em;
}

.contactForm_box input[type="checkbox"] {
    display: none;
}

.contactForm_box input[type="checkbox"]+.wpcf7-list-item-label {
    padding-left: 30px;
    position: relative;
}

.contactForm_box input[type="checkbox"]+.wpcf7-list-item-label::before {
    content: "";
    position: absolute;
    left: 0;
    top: 4px;
    width: 20px;
    height: 20px;
    border: 1px solid #ccc;
}

.contactForm_box input[type="checkbox"]+.wpcf7-list-item-label::after {
    content: "";
    position: absolute;
    left: 7px;
    top: 4px;
    width: 8px;
    height: 15px;
    border: 2px solid #000;
    border-top: 0;
    border-left: 0;
    transform: rotate(45deg);
    opacity: 0;
}

.contactForm_box input[type="checkbox"]:checked+.wpcf7-list-item-label::after {
    opacity: 1;
}

.contactForm_box_btn {
    text-align: center;
}

.contactForm_box_btn input {
    -webkit-appearance: none;
    padding: 15px 20px;
    background: hsla(var(--maincolor-hsl), 1);
    ;
    border: 0;
    color: #fff;
    min-width: 200px;
    border-radius: 30px;
    font-size: 18px;
    cursor: pointer;
}

.contactForm_box_btn input:hover {
    opacity: 0.7;
}

.contactForm_box_btn .remove_btn {
    border: 1px solid #333;
    background: #fff;
    color: #333;
    margin-top: 40px;
}

.contactForm_box table {
    margin-bottom: 30px;
}

.contactForm_box table th,
.contactForm_box table td {
    padding: 0.8em 1em;
    text-align: left;
}

.contactForm_box table tr:nth-child(2n+1) th,
.contactForm_box table tr:nth-child(2n+1) td {
    background: #eee;
}

.contactForm_box .wpcf7-spinner {
    position: absolute;
}



/* ================================================
Q&A
================================================ */
.qa_box dl {
    margin-bottom: 1em;
    position: relative;
}

.qa_box dt {
    position: relative;
    padding: 0.7em 2em 1em 4.5rem;
    border-bottom: 1px solid;
    border-bottom-color: currentcolor;
    font-weight: bold;
}

.qa_box dd {
    position: relative;
    background: rgba(141, 165, 160, 0.2);
    overflow: hidden;
    transition: 0.3s;
    height: 0;
}

.qa_box_contens {
    padding: 1.5em 2em 2em 4.5rem;
}

.qa_box dt::before,
.qa_box dt::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 20px;
    height: 2px;
    background: #666;
    transition: 0.3s;
}

.qa_box dt::after {
    transform: translateY(-50%) rotate(90deg);
}

.qa_box dl.active dt::before,
.qa_box dl.active dt::after {
    transform: translateY(-50%) rotate(180deg);
}

.qa_box_title {
    position: relative;
    display: inline-block;
}

.qa_box_title::before {
    content: "Q";
    position: absolute;
    font-size: 20px;
    left: -3rem;
    line-height: 1;
    background: hsla(var(--maincolor-hsl), 1);
    ;
    color: #fff;
    width: 1.5em;
    height: 1.5em;
    border-radius: 50%;
    display: grid;
    justify-content: center;
    align-items: center;
    font-family: 'Tilt Warp', cursive;
    letter-spacing: 0;
    top: 50%;
    transform: translateY(-50%);
}

.qa_box dd::before {
    content: "A";
    position: absolute;
    font-size: 20px;
    left: 20px;
    top: 1.8rem;
    line-height: 1;
    color: hsla(var(--maincolor-hsl), 1);
    ;
    border: 2px solid hsla(var(--maincolor-hsl), 1);
    ;
    background: #fff;
    width: 1.5em;
    height: 1.5em;
    border-radius: 50%;
    display: grid;
    justify-content: center;
    align-items: center;
    font-family: 'Tilt Warp', cursive;
    letter-spacing: 0;
}

.qa_box dt {
    border-color: hsla(var(--maincolor-hsl), 1);
    ;
    font-size: 110%;
    transition: 0.3s;
}

.qa_box dt:hover {
    color: rgba(141, 165, 160, 0.5);
}

@media (max-width: 559px) {
    .qa_box dl::before {
        top: 50%;
        transform: translateY(-50%);
    }
}


.number_box {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 20px;
    align-items: center;
    line-height: 1.4;
    margin: 0 0 20px;
}

.number_box>dt {
    padding: 20px 20px;
    border-radius: 50%;
    line-height: 1;
    color: #fff;
    background: #000;
    /* aspect-ratio: 1 / 1; */
    letter-spacing: 0;
}

.number_box>dd {
    font-size: 110%;
    font-weight: bold;
}

/* 特徴アイコンなど
--------------------------------------- */

.list_number {
    counter-reset: num;
}

.list_number>li {
    position: relative;
    padding: 0px 0px 0px 50px;
    counter-increment: num;
    margin-bottom: 20px;
    list-style: none;
}

.list_number>li::before {
    content: counter(num);
    position: absolute;
    background: var(--maincolor);
    color: #fff;
    display: grid;
    align-items: center;
    justify-content: center;
    text-align: center;
    left: 0;
    width: 2em;
    height: 2em;
    border-radius: 50%;
    text-align: center;
    top: 50%;
    translate: 0 -50%;
    letter-spacing: 0;
}

.list_number_box {
  counter-reset: num;
  list-style: none;
  padding: 0;
}

.list_number_box>li {
    position: relative;
    padding: 0 0 0 70px;
    border-radius: 5px;
    background: #fff;
    counter-increment: num;
    margin-bottom: 20px;
}

.list_number_box>li::before {
  content: counter(num);
  position: absolute;
  background: var(--maincolor);
  color: #fff;
  display: grid;
  align-items: center;
  justify-content: center;
  text-align: center;
  left: 20px;
  width: 2em;
  height: 2em;
  border-radius: 50%;
  text-align: center;
  top: 0.01em;
  letter-spacing: 0;
}


.list_flow_num {
    counter-reset: flow_num;
}

.list_flow_num>dl {
    counter-increment: flow_num;
    background: hsla(var(--maincolor-hsl), 0.1);
    padding: 20px;
    margin-bottom: 50px;
    position: relative;
}

.list_flow_num>dl>dt {
    font-weight: bold;
    font-size: 120%;
    padding-left: 2.4em;
    position: relative;
    margin-bottom: 16px;
}

.list_flow_num>dl>dt::before {
    content: counter(flow_num);
    position: absolute;
    background: var(--maincolor);
    color: #fff;
    display: grid;
    align-items: center;
    justify-content: center;
    text-align: center;
    left: 0;
    width: 2em;
    height: 2em;
    border-radius: 50%;
    text-align: center;
    top: 50%;
    translate: 0 -50%;
}

.list_flow_num>dl:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 100%;
    margin-top: -5px;
    left: 50%;
    width: 60px;
    height: 60px;
    translate: -50% 0;
    background: var(--maincolor);
    mask: 50% 50% / contain no-repeat;
    mask-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0iY3VycmVudENvbG9yIj48cGF0aCBkPSJNMTIgMTUuNjMxNUwyMC45Njc5IDEwLjg4MzhMMjAuMDMyMSA5LjExNjE5TDEyIDEzLjM2ODVMMy45Njc5IDkuMTE2MTlMMy4wMzIxMiAxMC44ODM4TDEyIDE1LjYzMTVaIj48L3BhdGg+PC9zdmc+');
}

/* 特徴アイコンなど
--------------------------------------- */
.feature_box {
    background: #fff;
    padding: 20px;
    border-radius: 20px;
    margin-bottom: 50px;
}

.feature_box_item {
    position: relative;
    padding-left: 90px;
}

.feature_box_item dt {
    /* font-size: 130%; */
    font-size: 120%;
    font-weight: bold;
    margin-bottom: 10px;
}

.feature_box_item_title {
    min-height: 64px;
    display: grid;
    align-items: center;
    font-size: 100%;
    font-weight: bold;
    margin-bottom: 10px;
    padding-left: 70px;
}


.feature_box_item::before,
.feature_box_item::after {
    content: "";
    position: absolute;
    width: 64px;
    height: 64px;
    left: 0;
    top: 0;
}

.feature_box_item::before {
    z-index: 2;
    display: grid;
    align-items: center;
    justify-self: center;
    line-height: 1;
    color: hsla(var(--maincolor-hsl), 1);
    font-family: remixicon;
    text-align: center;
    font-size: 150%;
}

.feature_box_item::after {
    content: "";
    z-index: 1;
    border-radius: 50%;
    background: hsla(var(--maincolor-hsl), 0.1);
}

.feature_box_item.feature_box_item_vertical {
    padding: 90px 0 0;
}

.feature_box_item.feature_box_item_vertical dt {
    max-width: fit-content;
    margin-left: auto;
    margin-right: auto;
}

.feature_box_item.feature_box_item_vertical::before,
.feature_box_item.feature_box_item_vertical::after {
    top: 0;
    left: 50%;
    translate: -50% 0;
}

.feature_box_item[class*="icon_img"]::before {
    content: "";
    font-family: none;
    background: 50% 50% / contain no-repeat;
    scale: 0.8;
}

.feature_box_item.icon_img_fusso::before {
    background-image: url(../../../uploads/2026/03/ico_fusso.png);
}

.feature_box_item.icon_img_selant::before {
    background-image: url(../../../uploads/2026/03/img_selant.png);
}

.feature_box_item.icon_img_brash::before {
    background-image: url(../../../uploads/2026/03/ippan007.png);
}

.feature_box_item.icon_alert::before {
    content: "\00EA21";
}

.feature_box_item.icon_arrow-right-double::before {
    content: "\00F2E5";
}

.feature_box_item.icon_bard::before {
    content: "\00F2ED";
}

.feature_box_item.icon_brain::before {
    content: "\00F2F7";
}

.feature_box_item.icon_brush::before {
    content: "\00EB01";
}

.feature_box_item.icon_bubble-chart::before {
    content: "\00EB03";
}

.feature_box_item.icon_calendar-check::before {
    content: "\00EB23";
}

.feature_box_item.icon_drop::before {
    content: "\00EC6A";
}

.feature_box_item.icon_emotion-happy::before {
    content: "\00EC8D";
}

.feature_box_item.icon_emotion-unhappy::before {
    content: "\00EC96";
}

.feature_box_item.icon_eye::before {
    content: "\00ECB5";
}

.feature_box_item.icon_fire::before {
    content: "\00ED33";
}

.feature_box_item.icon_heart::before {
    content: "\00EE0F";
}

.feature_box_item.icon_heart-pulse::before {
    content: "\00EE11";
}

.feature_box_item.icon_hospital::before {
    content: "\00EE37";
}

.feature_box_item.icon_lungs::before {
    content: "\00EEE4";
}

.feature_box_item.icon_microscope::before {
    content: "\00EF56";
}

.feature_box_item.icon_nurse::before {
    content: "\00EFAC";
}

.feature_box_item.icon_restaurant::before {
    content: "\00F084";
}

.feature_box_item.icon_settings-3::before {
    content: "\00F0E6";
}

.feature_box_item.icon_shield-check::before {
    content: "\00F100";
}

.feature_box_item.icon_shield-star::before {
    content: "\00F10A";
}

.feature_box_item.icon_sun::before {
    content: "\00F1BF";
}

.feature_box_item.icon_test-tube::before {
    content: "\00F1FC";
}

.feature_box_item.icon_tools::before {
    content: "\00F21B";
}


.feature_box_item.feature_box_item_red::before {
    color: rgb(244, 63, 94)
}

.feature_box_item.feature_box_item_red::after {
    background: rgb(255, 241, 242);
}

.feature_box_item.feature_box_item_orange::before {
    color: rgb(245, 158, 11);
}

.feature_box_item.feature_box_item_orange::after {
    background: rgb(255, 251, 235);
}


/* 注意文
--------------------------------------- */
.attention_box {
    background: rgba(245, 158, 11, 0.1);
    border-left: 6px solid rgba(245, 158, 11, 1);
    padding: 24px;
}

.lower h3.attention_box_title {
    color: rgba(245, 158, 11, 1);
}

dl.attention_box_list {
    margin-bottom: 20px;
}

dl.attention_box_list dt {
    position: relative;
    padding-left: 1.3em;
    font-size: 110%;
    font-weight: bold;
}

dl.attention_box_list dt::before {
    content: "\00EB80";
    position: absolute;
    left: 0;
    top: 0;
    color: rgba(245, 158, 11, 1);
    font-family: remixicon;
    text-align: center;
}

dl.attention_box_list dd {
    padding-left: 1.5em;
}

ul.attention_box_list>li {
    margin-bottom: 20px;
    position: relative;
    padding-left: 1.3em;
    list-style: none;
}

ul.attention_box_list>li::before {
    content: "\00EB80";
    position: absolute;
    left: 0;
    top: 0;
    color: rgba(245, 158, 11, 1);
    font-family: remixicon;
    text-align: center;
}

/* フレーム
--------------------------------------- */
.box_frame {
    background: hsla(var(--maincolor-hsl), 0.2);
    padding: 24px;
}

.bgw {
    background: #fff;
}

.img_box {
    display: grid;
    grid-template-rows: auto 1fr;
    background: #fff;
    border-radius: 10px 10px 0 0;
    padding: 0 !important;
}

.img_box .img {
    overflow: hidden;
    border-radius: 10px 10px 0 0;
}

.img_box .text {
    padding: 20px;
}

.mg_contents {
    max-width: fit-content;
    margin-left: auto;
    margin-right: auto;
}


/* 定期検診のすすめ
--------------------------------------- */

.regular_checkup_box {
    background: rgb(13, 148, 136);
    color: #fff;
}

.regular_checkup_list {
    padding: 3em 0 3em 4em;
    position: relative;
}

.regular_checkup_list dl::before {
    content: "";
    position: absolute;
    left: 0;
    top: calc(50% - 24px);
    width: 48px;
    height: 48px;
    background: rgba(255, 255, 255, 0.3);
    border-radius: 50%;
}

.regular_checkup_list dl::after {
    content: "\00EB23";
    position: absolute;
    left: 12px;
    top: 50%;
    translate: 0 -50%;
    font-family: remixicon;
    font-size: 120%;
}

.regular_checkup_list dt {
    font-weight: bold;
    font-size: 110%;
}

/* 審美治療
--------------------------------------- */

.column_2_1 {
    display: grid;
    grid-gap: 28px;
}

@media (min-width: 960px) {
    .column_2_1 {
        grid-template-columns: 1fr 1fr;
    }
}


.checklist_green>li,
.checklist_red>li,
.checklist_orange>li {
    position: relative;
    padding-left: 1.5em;
    margin-bottom: 10px;
    list-style: none;
}

.checklist_green>li::before,
.checklist_red>li::before,
.checklist_orange>li::before {
    content: "\00EB80";
    z-index: 2;
    line-height: 1;
    font-family: remixicon;
    text-align: center;
    position: absolute;
    left: 0;
    top: 0.45em;
}

.checklist_red>li::before {
    color: rgb(251, 113, 133);
}

.checklist_orange>li::before {
    color: rgb(251, 191, 36);
}

.checklist_green>li::before {
    color: hsla(177, 40%, 51%, 1);
}

.list_minus>li {
    position: relative;
    padding-left: 1.5em;
    margin-bottom: 10px;
    list-style: none;
}

.list_minus>li::before {
    content: "\00F1AF";
    z-index: 2;
    line-height: 1;
    font-family: remixicon;
    text-align: center;
    position: absolute;
    left: 0;
    top: 0.45em;
    color: rgb(244, 63, 94);
}





.price_box {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #eee;
    font-size: 14px;
    color: #818181;
}

.price_box>p {
    margin-bottom: 5px;
}

.price_box dl {
    color: #000;
    font-size: 16px;
    display: grid;
    grid-template-columns: auto auto;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 5px;
}

.notice_list_gray {
    margin-top: 60px;
    padding: 20px;
    background: #fff;

}

.notice_list_gray_title {
    font-weight: bold;
    padding-left: 1.8em;
    position: relative;
    margin-bottom: 20px;
}

.notice_list_gray_title::before {
    content: "\00ECA1";
    position: absolute;
    z-index: 2;
    line-height: 1;
    font-family: remixicon;
    text-align: center;
    left: 0;
    top: 0.35em;
    color: rgb(156, 163, 175);
    font-size: 130%;
}

.notice_list_gray_list {
    display: grid;
    gap: 5px;
}

.notice_list_gray_list>li {
    position: relative;
    padding-left: 1.3em;
    list-style: none;
}

.notice_list_gray_list>li::before {
    content: "\00ECA1";
    position: absolute;
    z-index: 2;
    line-height: 1;
    font-family: remixicon;
    text-align: center;
    left: 0;
    top: 0.45em;
    color: rgb(156, 163, 175);
}

.whiteing_box .subtitle {
    background: hsla(var(--maincolor-hsl), 0.1);
    color: hsla(var(--maincolor-hsl), 1);
    display: block;
    max-width: fit-content;
    font-size: 12px;
    padding: 5px 9px;
    line-height: 1;
    border-radius: 15px;
    letter-spacing: 0.1em;
}

.whiteing_box h4 {
    color: #000;
}

.whitening_box_inner {
    display: grid;
    gap: 20px;
}

@media (min-width: 960px) {
    .whitening_box_inner {
        grid-template-columns: 1fr 1fr;
        gap: 20px;
    }

    .whitening_box_inner .whitening_box_title {
        grid-column: 1 / 3;
    }

    .whitening_box_inner .whitening_box_price {
        grid-column: 1 / 3;
    }
}

/* 流れ 親知らずの抜歯
------------------------------------------------------------------------------ */

.flow_style {
    display: grid;
    padding-left: 90px;
}

/* 医療費控除テーブル
------------------------------------------------------------------------------ */
:root {
    --th-bg-color: var(--maincolor);
    --inputbtn-bg: var(--maincolor);
}

.disIB {
    display: inline-block !important;
}

.page__deduction .inner {
    max-width: 1420px;
    margin: auto;
    padding: 0 5%;
}

.page__deduction .inner>.post_box>article {
    margin-bottom: 40px;
}

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



.line3>li {
    margin-bottom: 3%;
}

@media (min-width: 560px) {
  .deduction__table {
    width: 90%;
    margin: auto;
  }
}
@media (min-width: 960px) {
    .deduction__table {
        width: 900px;
        max-width: 100%;
    }

    .line3>li {
        width: 33.33%;
        float: left;
        box-sizing: border-box;
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .line3>li:nth-child(3n+1) {
        padding-right: 2%;
        clear: left;
    }

    .line3>li:nth-child(3n+2) {
        padding-left: 1%;
        padding-right: 1%;
    }

    .line3>li:nth-child(3n+0) {
        padding-left: 2%;
    }

    .page__deduction .inner>.post_box>article {
        margin-bottom: 60px;
    }

}

.deduction__table th,
.deduction__table td {
    padding: 10px;
    border: 1px solid var(--th-bg-color);
}

.deduction__table th {
    background: var(--th-bg-color);
    color: #fff;
}

.deduction__table tr:nth-last-child(n+2) th {
    border-bottom-color: #fff;
}

.deduction__table td {
  border: 1px solid var(--th-bg-color);
}

.deduction__table input {
  padding: 10px;
  width: calc(100% - 5em);
  font-size: inherit;
}

.price__button {
  text-align: center;
  padding: 20px;
}

.price__button button {
  -webkit-appearance: none;
  border: 0;
  padding: 10px 20px;
  font-size: 16px;
  cursor: pointer;
  background: var(--inputbtn-bg);
  box-shadow: inset 0 0 0 1px var(--inputbtn-bg), inset 0 0 0 2px #000;
  color: #fff;
}

.price__button button:hover {
    opacity: 0.7;
}


/*============================================================

 カスタム投稿用のCSS

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

/* 画像がダミー画像の際の高さ調整(jsでページ内リンクをスクロールする際にずらさないように指定) */
.post_custom_img img[src$="dummy.png"] {
    box-sizing: content-box;
    height: 0 !important;
}

.post_custom_img img.lazyloaded {
    padding-top: 0 !important;
}

.post_box {
    margin-bottom: 60px;
}

.post_custom_img_setting_type02 .post_custom_img {
    text-align: center;
}

.post_custom_img_inner {
    display: inline-block;
}

@media (min-width: 960px) {

    .post_custom_type03 .post_custom_content,
    .post_custom_type04 .post_custom_content {
        text-box-trim: trim-start;
        text-box-edge: cap alphabetic;
    }
}

.post_custom_box {
    display: grid;
    width: 100%;
    justify-content: space-between;
    grid-template-columns: 1fr;
}

/*============================================================

 テキスト画像の縦並び

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

@media (min-width: 960px) {

    .post_custom_type01 .post_custom_img,
    .post_custom_type02 .post_custom_content {
        order: 1;
        width: 100%;
        margin-bottom: 20px;
    }

    .post_custom_type01 .post_custom_content,
    .post_custom_type02 .post_custom_img {
        order: 2;
        width: 100%;
    }
}

/*============================================================

 テキスト画像の横並び

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

@media (min-width: 960px) {
    .post_custom_colume_type01 {
        grid-template-columns: 60% 35%;
    }

    .post_custom_colume_type02 {
        grid-template-columns: 50% 45%;
    }

    .post_custom_colume_type03 {
        grid-template-columns: 50% 30%;
    }

    .post_custom_colume_type04 {
        grid-template-columns: 70% 25%;
    }

    .post_custom_colume_type05 {
        grid-template-columns: 47.5% 47.5%;
    }

    .post_custom_colume_type03.post_custom_type03 .post_custom_img {
        margin-left: 10%;
    }

    .post_custom_colume_type03.post_custom_type04 .post_custom_content {
        margin-left: 10%;
    }

    .post_custom_type03 .post_custom_img,
    .post_custom_type04 .post_custom_content {
        order: 1;
    }

    .post_custom_type03 .post_custom_content,
    .post_custom_type04 .post_custom_img {
        order: 2;
    }
}

@media (max-width: 959px) {
    .post_custom_box>div+div {
        margin-top: 20px;
    }

    .post_custom_img {
        text-align: center;
    }

    .post_box {
        margin-bottom: 40px;
    }
}

/*============================================================

 テキスト画像の表示幅

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
@media (min-width: 960px) {

    .post_custom_width_type02,
    .post_custom_width_type03,
    .post_custom_width_type04,
    .post_custom_width_type_short {
        margin-left: auto;
        margin-right: auto;
    }

    .post_custom_width_type02 {
        width: 90%;
    }

    .post_custom_width_type03 {
        width: 75%;
    }

    .post_custom_width_type04 {
        width: 50%;
    }
}

.post_custom_width_type_short {
    max-width: fit-content;
    margin-left: auto;
    margin-right: auto;
}

@media (max-width: 959px) {

    .post_custom_width_type_short.post_custom_type01 .post_custom_img,
    .post_custom_width_type_short.post_custom_type02 .post_custom_img,
    .post_custom_width_type_short.post_custom_type03 .post_custom_img,
    .post_custom_width_type_short.post_custom_type04 .post_custom_img {
        width: 100%;
    }

    .post_custom_width_type_short.post_custom_img_width_sp_type02 .post_custom_img img {
        max-width: 50%;
    }
}

/*============================================================

 スマホでの画像の表示幅

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
@media (max-width: 959px) {
    .post_custom_img_width_sp_type02 .post_custom_img {
        width: 50%;
        margin-left: auto;
        margin-right: auto;
    }
}

/*==========================================
fade 調整
==========================================*/
.fadein {
    opacity: 0.01;
    visibility: hidden;
    transition: opacity 1s, visibility 0s, transform 1s;
    transform: translateZ(0);
}

.is-fadein {
    opacity: 1;
    visibility: visible;
    transform: translate(0, 0);
}

.fadeinTop {
    transform: translateY(-50px);
}

.fadeinBottom {
    transform: translateY(50px);
}

.fadeinLeft {
    transform: translatex(-50px);
}

.fadeinRight {
    transform: translatex(50px);
}

.fadeinLeftTop {
    transform: translate(-50px, -50px);
}

.fadeinTop.is-fadein,
.fadeinBottom.is-fadein,
.fadeinLeft.is-fadein,
.fadeinRight.is-fadein,
.fadeinLeftTop.is-fadein {
    transform: translate(0, 0);
}

.post_box_bg[style*="background"] {
    padding-top: 40px;
    padding-bottom: 40px;
}



.flow_num_list {
	counter-reset: flow_num;
	word-break: break-all;
}
.flow_num_list li {
	counter-increment: flow_num;
	position: relative;
	padding-left: 3.5em;
	padding-bottom: 30px;
	list-style: none;
}
.flow_num_list li::before {
	content: counter(flow_num);
	position: absolute;
	border-radius: 50%;
	width: 1.7em;
	height: 1.7em;
	color: #fff;
	text-align: center;
	line-height: 1.7em;
	font-size: 140%;
	left: 0;
	letter-spacing: 0;
	background: hsl(var(--maincolor-hsl),1);
    font-family: 'Noto Serif JP', serif;
}
.flow_num_list li::after {
	content: "";
	position: absolute;
	left: 1.1em;
	width: 4px;
	top: 2.3em;
	bottom: 0;
  background: hsl(var(--maincolor-hsl),1);
}
.flow_num_list li:last-child::after {
  content: none;
}
.flow_num_list_title {
	font-size: 110%;
	font-weight: bold;
	padding: 0 0 6px;
	color: hsl(var(--maincolor-hsl),1);
    font-family: 'Noto Serif JP', serif;
}


@media (max-width: 767px){
  .dl_table > dl > dt {
    font-weight: bold;
    color: var(--maincolor);
    font-size: 110%;
  }
  .dl_table > dl {
    padding: 20px 0;
    border-top: 1px solid hsla(var(--maincolor-hsl), 1);
  }
  .dl_table > dl:last-child {
    border-bottom: 1px solid hsla(var(--maincolor-hsl), 1);
  }
}
@media (min-width: 768px){
  .dl_table {
    display: table;
  }
  .dl_table > dl {
    display: table-row;
  }
  .dl_table > dl > dt,
  .dl_table > dl > dd {
    display: table-cell;
    padding: 20px;
    border-bottom: 1px solid hsla(var(--maincolor-hsl), 1);
  }
  .dl_table > dl:last-child > dt,
  .dl_table > dl:last-child > dd {
    border-bottom: 0px solid hsla(var(--maincolor-hsl), 1);
  }
  .dl_table > dl > dt {
    min-width: 10em;
    vertical-align: middle;
/*    border-right: 1px solid hsla(var(--maincolor-hsl), 1);*/
    font-weight: bold;
    color: var(--maincolor);
  }
}

.dl_table_img {
  display: grid;
  justify-content: flex-start;
  max-width: fit-content;
  margin: 0 auto;
}
.dl_table_img > dl {
  display: grid;
  grid-template-columns: subgrid;
  grid-column: span 2;
  gap: 0 20px;
  align-items: start;
  margin-bottom: 20px;
}
.dl_table_img > dl > dt {
  grid-column: 2 / 3;
  grid-row: 1 / 2;
  font-weight: bold;
  color: var(--maincolor);
}
.dl_table_img > dl > dd.text {
  grid-column: 2 / 3;
  grid-row: 2 / 3;
}
.dl_table_img > dl > dd.img {
  width: 80px;
  height: 80px;
  object-fit: cover;
  grid-column: 1 / 2;
  grid-row: 1 / 3;
}
@media (max-width: 559px){
  .dl_table_img > dl > dt {
    text-box-trim: trim-start;
    margin-top: -0.3em;
  }
}


.frame_box_red {
	background: rgb(254,242,242);
	border: 1px solid rgb(254,226,226);
	padding: 20px;
}
.frame_box_yellow {
	background: rgb(255,251,235);
	border: 1px solid rgb(254,243,199);
	padding: 20px;
}
.frame_box_gray {
	background: #ececec;
	padding: 20px;
}

.dl_attantion {
	position: relative;
	margin-bottom: 20px;
	padding: 0 20px 0 30px;
}
.dl_attantion > dt {
	font-weight: bold;
	margin-bottom: 10px;
}
.dl_attantion > dt::before {
	content: "";
	position: absolute;
	left: 0;
	width: 20px;
	top: -4px;
	height: 40px;
	background: rgb(248,113,113);
	mask: 50% 50% / contain no-repeat;
	mask-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0iY3VycmVudENvbG9yIj48cGF0aCBkPSJNMTIuODY1OSAzLjAwMDE3TDIyLjM5MjIgMTkuNTAwMkMyMi42Njg0IDE5Ljk3ODUgMjIuNTA0NSAyMC41OTAxIDIyLjAyNjIgMjAuODY2MkMyMS44NzQyIDIwLjk1NCAyMS43MDE3IDIxLjAwMDIgMjEuNTI2MiAyMS4wMDAySDIuNDczNjNDMS45MjEzNSAyMS4wMDAyIDEuNDczNjMgMjAuNTUyNSAxLjQ3MzYzIDIwLjAwMDJDMS40NzM2MyAxOS44MjQ2IDEuNTE5ODQgMTkuNjUyMiAxLjYwNzYxIDE5LjUwMDJMMTEuMTMzOSAzLjAwMDE3QzExLjQxIDIuNTIxODcgMTIuMDIxNiAyLjM1OCAxMi40OTk5IDIuNjM0MTRDMTIuNjUxOSAyLjcyMTkxIDEyLjc3ODIgMi44NDgxNSAxMi44NjU5IDMuMDAwMTdaTTQuMjA1NjggMTkuMDAwMkgxOS43OTQxTDExLjk5OTkgNS41MDAxN0w0LjIwNTY4IDE5LjAwMDJaTTEwLjk5OTkgMTYuMDAwMkgxMi45OTk5VjE4LjAwMDJIMTAuOTk5OVYxNi4wMDAyWk0xMC45OTk5IDkuMDAwMTdIMTIuOTk5OVYxNC4wMDAySDEwLjk5OTlWOS4wMDAxN1oiPjwvcGF0aD48L3N2Zz4=');
}
.dl_attantion:last-child {
	margin-bottom: 0;
}


.dl_attantion_yellow {
	position: relative;
	margin: 20px 0;
	padding: 0 20px 0 30px;
}
.dl_attantion_yellow > dt {
	font-weight: bold;
	margin-bottom: 10px;
}
.dl_attantion_yellow > dt::before {
	content: "";
	position: absolute;
	left: 0;
	width: 20px;
	top: -4px;
	height: 40px;
	background: rgb(251,191,36);
	mask: 50% 50% / contain no-repeat;
	mask-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0iY3VycmVudENvbG9yIj48cGF0aCBkPSJNMTIuODY1OSAzLjAwMDE3TDIyLjM5MjIgMTkuNTAwMkMyMi42Njg0IDE5Ljk3ODUgMjIuNTA0NSAyMC41OTAxIDIyLjAyNjIgMjAuODY2MkMyMS44NzQyIDIwLjk1NCAyMS43MDE3IDIxLjAwMDIgMjEuNTI2MiAyMS4wMDAySDIuNDczNjNDMS45MjEzNSAyMS4wMDAyIDEuNDczNjMgMjAuNTUyNSAxLjQ3MzYzIDIwLjAwMDJDMS40NzM2MyAxOS44MjQ2IDEuNTE5ODQgMTkuNjUyMiAxLjYwNzYxIDE5LjUwMDJMMTEuMTMzOSAzLjAwMDE3QzExLjQxIDIuNTIxODcgMTIuMDIxNiAyLjM1OCAxMi40OTk5IDIuNjM0MTRDMTIuNjUxOSAyLjcyMTkxIDEyLjc3ODIgMi44NDgxNSAxMi44NjU5IDMuMDAwMTdaTTQuMjA1NjggMTkuMDAwMkgxOS43OTQxTDExLjk5OTkgNS41MDAxN0w0LjIwNTY4IDE5LjAwMDJaTTEwLjk5OTkgMTYuMDAwMkgxMi45OTk5VjE4LjAwMDJIMTAuOTk5OVYxNi4wMDAyWk0xMC45OTk5IDkuMDAwMTdIMTIuOTk5OVYxNC4wMDAySDEwLjk5OTlWOS4wMDAxN1oiPjwvcGF0aD48L3N2Zz4=');
}
.dl_attantion_yellow:last-child {
	margin-bottom: 0;
}

.list-dot {
  margin-left: 20px;
}


.grid-column2 {
  display: grid;
  gap: 20px;
  max-width: fit-content;
  margin: auto;
}
@media (min-width: 960px){
  .grid-column2 {
    grid-template-columns: 1fr 1fr;
  }
}

.grid-column2_list {
    margin-left: 20px;
    margin-bottom: 40px;
}
@media (min-width: 960px){
  .grid-column2_list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 20px;
    margin-bottom: 40px;
    margin-left: 80px;
  }
}

@media (max-width: 959px) {
.line3 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 20px;
}
.line3 > li {
  list-style: none;
}
}