@charset "utf-8";
/*
Theme Name: もとまちリウマチ内科クリニック
Description: もとまちリウマチ内科クリニックのテーマ
Author:DCP Solution
Version:1.0
Text Domain:motomachirac
*/

:root {
   /* カラー */
   --txt_color: #3d3730;
   --base_color_1: #EAFDD8;
   --base_color_2: #FFEEDE;
   --base_color_3: #FFFFD4;
   --base_color_4: #F5EADF;
   --base_color_5: #F2F2F2;
   --base_color_6: #F2FFE5;
   --base_color_7: #dddcdc;
   --base_color_8: #F4D593;
   --base_color_9: #F5FFED;
   --main_color_1: #66A42A;
   --main_color_2: #F17F0C;
   --main_color_3: #B6B610;
   --main_color_4: #734B24;
   --main_color_5: #FFFFFF;
   --main_color_6: #666666;
   --main_color_7: #C4BC6B;
   --accent_color_1: #FF9225;
   --caution_color: #EE3E3E;

   /* フォント */
   --serif: "Yu Mincho", YuMincho, 游明朝, 游明朝体, serif;
   --sans_serif: "Yu Gothic", YuGothic, 游ゴシック, 游ゴシック体, sans-serif;
   --zen_maru_gothic: "Zen Maru Gothic", sans-serif;
   --pacifico: "Pacifico", cursive;


   /* フォントの太さ */
   --fontweight_bold: bold;
   --fontweight_normal: normal;


   /* フォントサイズ */
   --fontsize_08: 0.8rem;
   --fontsize_1: 1.0rem;
   --fontsize_12: 1.2rem;
   --fontsize_14: 1.4rem;
   --fontsize_16: 1.6rem;
   --fontsize_18: 1.8rem;
   --fontsize_20: 2rem;
   --fontsize_22: 2.2rem;
   --fontsize_24: 2.4rem;
   --fontsize_26: 2.6rem;
   --fontsize_28: 2.8rem;
   --fontsize_30: 3.0rem;
   --fontsize_32: 3.2rem;
   --fontsize_34: 3.4rem;
   --fontsize_36: 3.6rem;
   --fontsize_38: 3.8rem;
   --fontsize_40: 4.0rem;
   --fontsize_42: 4.2rem;

   /* border-width */
   --border_width_1: 1px;
   --border_width_2: 2px;
   --border_width_3: 3px;
   --border_width_4: 4px;
   --border_width_5: 5px;

   /* border-radius */
   --border_radius_5: 5px;
   --border_radius_10: 10px;

   /* letter-spacing */
   --letterspacing_01: 0.1em;

   --box_shadow_gray: 4px 4px 10px rgba(138, 138, 138, 0.5);
}





/* ホバー時薄くなる　ここから */
.hover_opacity {
   transition: 0.2s;

   &:hover {
      opacity: 0.8;
   }
}

.is-disabled-link {
   color: inherit;
   cursor: default;
   pointer-events: none;
   text-decoration: none;
}

/* ホバー時薄くなる　ここまで */

html {
   color: var(--txt_color);
   font-family: var(--zen_maru_gothic);
   font-weight: 600;
   text-align: justify;
   scroll-behavior: smooth;
}

/* インナー ここから */
.inner0_20 {
   margin: 0 20px;

   @media (min-width: 768px) {
      margin: 0 50px;
   }

   @media (min-width: 1280px) {
      max-width: 1000px;
      margin: 0 auto;
   }
}

/* インナー ここまで */

/* 見出し　ここから */
h1 {
   line-height: 1.6;
}

.page_h1 {
   color: var(--main_color_1);
   text-align: center;
   width: 100%;
}

h2 {
   color: var(--main_color_1);
   line-height: 1.6;
   text-align: center;
   margin-bottom: 30px;
}

.page_h2 {
   img {
      width: 50px;
      margin-right: 2px;
   }
}

h3 {
   line-height: 1.6;
   margin-bottom: 20px;
}

.page_h3 {
   img {
      width: 30px;
   }
}

/* 両端に線　ここから */
.head-border {
   display: flex;
   align-items: center;
}

.head-border:before,
.head-border:after {
   content: "";
   height: 5px;
   flex-grow: 1;
   background-color: var(--main_color_1);
}

.head-border:before {
   margin-right: 1rem;
}

.head-border:after {
   margin-left: 1rem;
}

/* 両端に線　ここまで */

p {
   font-weight: var(--fontweight_normal);
}

/* 見出し　ここまで */

a {
   color: var(--txt_color);
   font-weight: var(--fontweight_normal);
}

/* 注目させたい箇所に　ここから */
.notice {
   color: var(--accent_color_1);
   font-size: var(--fontsize_18);
}

/* 注目させたい箇所に　ここまで */

.web_btn {
   background-color: var(--accent_color_1);
   border-radius: 100px;
   margin: 5px 0;
   padding: 2px;

   @media (min-width: 768px) {
      width: 300px;
      margin: 5px auto;
      padding: 5px;
   }

   a {
      display: flex;
      justify-content: center;
      align-items: center;
      color: var(--main_color_5);
      font-weight: var(--fontweight_normal);
      line-height: 1.3;

      img {
         width: 20px;
         margin-right: 10px;
      }

      p {
         margin: 0;
         display: flex;
         align-items: flex-start;
         flex-direction: column;


         span {
            font-size: var(--fontsize_18);
         }


         .reception {
            position: relative;
            font-size: var(--fontsize_12);

            &:before {
               position: absolute;
               content: '｜';
               font-weight: var(--fontweight_bold);
               left: -11px;
               rotate: calc(-15deg);
            }

            &:after {
               position: absolute;
               content: '｜';
               font-weight: var(--fontweight_bold);
               right: -11px;
               rotate: calc(15deg);
            }
         }
      }
   }
}


.tel_btn {
   background-color: var(--main_color_1);
   border-radius: 100px;
   margin: 5px 0;
   display: flex;
   justify-content: center;
   align-items: center;
   padding: 0px;

   @media (min-width: 768px) {
      width: 300px;
      margin: 5px auto;
      padding: 10px;
      font-size: var(--fontsize_18);
   }

   a {
      display: flex;
      color: var(--main_color_5);
      font-weight: var(--fontweight_normal);

      img {
         width: 22px;
         margin-right: 1px;
      }
   }
}

/* マージン　ここから */
.mblock10_0 {
   margin: 10px 0;
}

.mblock20_0 {
   margin: 20px 0;
}

.mblock30_0 {
   margin: 30px 0;
}

.mblock40_0 {
   margin: 40px 0;
}

.mblock50_0 {
   margin: 50px 0;
}

.mblock60_0 {
   margin: 60px 0;
}

.mblock70_0 {
   margin: 70px 0;
}

.mblock80_0 {
   margin: 80px 0;
}

.mblock90_0 {
   margin: 90px 0;
}

.mblock100_0 {
   margin: 100px 0;
}

/* マージン　ここまで */

/* パディング　ここから */
.pblock10_0 {
   padding: 10px 0;
}

.pblock20_0 {
   padding: 20px 0;
}

.pblock30_0 {
   padding: 30px 0;
}

.pblock40_0 {
   padding: 40px 0;
}

.pblock50_0 {
   padding: 50px 0;
}

.pblock60_0 {
   padding: 60px 0;
}

.pblock70_0 {
   padding: 70px 0;
}

.pblock80_0 {
   padding: 80px 0;
}

.pblock90_0 {
   padding: 90px 0;
}

.pblock100_0 {
   padding: 100px 0;
}

/* パディング　ここまで */


/* 文字の位置　ここから */
.txt_left {
   text-align: left;
}

.txt_center {
   text-align: center;
}

.txt_right {
   text-align: right;
}

/* 文字の位置　ここまで */

/* 文字の大きさ　ここから */
.font_size_s {
   font-size: 0.8rem;
}

.font_size_m {
   font-size: 1.8rem;
}

.font_size_l {
   font-size: 2rem;
}

.font_size_xl {
   font-size: 2.2rem;
}

/* 文字の大きさ　ここまで */

/* 文字の太さ　ここから */
.font_weight_bold {
   font-weight: var(--fontweight_bold);
}

.font_weight_normal {
   font-weight: var(--fontweight_normal);
}

/* 文字の太さ　ここまで */

/* マーカー　ここから */
.marker_underline {
   background: linear-gradient(transparent 60%, #ffed47 60%);
   display: inline;
}

/* マーカー　ここまで */

/* dlリスト　ここから */
dl {
   border: var(--border_width_5) solid var(--base_color_2);
   padding: 0 20px 30px;
   border-radius: var(--border_radius_10);

   dt {
      margin-top: -14px;

      h3 {
         padding: 0 16px 0 10px;
         display: inline-block;
         background-color: var(--main_color_5);
      }
   }

   dd {
      line-height: 1.6;

   }
}

/* dlリスト　ここまで */

/* ulリスト　ここから */
ul {
   font-size: var(--fontsize_18);
   margin: 20px 0;
   border-radius: var(--border_radius_10);
}

.circle_list {
   background-color: var(--main_color_5);
   border: var(--border_width_4) solid var(--main_color_1);
   padding: 20px 30px 30px;

   li {
      position: relative;
      padding-left: 1em;

      &:before {
         position: absolute;
         content: '●';
         color: var(--main_color_4);
         text-indent: -1.3em;
      }
   }
}

/* ulリスト　ここまで */

/* 見出しの横幅いっぱい線　ここから */

.head_border {
   display: flex;
   align-items: center;
   width: 90%;
   margin: 0 auto 30px;
}

.head_border:before,
.head_border:after {
   content: "";
   height: 4px;
   flex-grow: 1;
   background-color: var(--main_color_3);
}

.head_border:before {
   margin-right: 2rem;
}

.head_border:after {
   margin-left: 2rem;
}

/* 見出しの横幅いっぱい線　ここまで */


.access_buss {
   color: var(--main_color_4);

   span {
      font-size: var(--fontsize_18);
   }
}

.header_columns {
   background-color: var(--base_color_6);
   padding: 5px 5px 80px;

   .inner_columns {
      display: flex;
      justify-content: left;
      /* &:before {
      position: absolute;
      content: '';
      width: 100%;
      height: 200px;
      left: 0;
      z-index: -1;
      /* padding-bottom: 50px; */
   }

   .logo {
      width: 150px;
   }

   .center {
      display: none;
   }

   .right {
      /* flex-grow: 1; */
      line-height: 1.5;
      position: relative;
      z-index: 1;
      width: 140px;

      /* margin-right: 75px; */
      /* display: none; */
      .txt_right {
         font-size: var(--fontsize_18);
         display: none;

         .openday {
            font-size: var(--fontsize_20);
         }
      }
   }

}




/*==================================================
スライダーのためのcss　ここから
===================================*/
.slider {
   position: relative;
   z-index: 1;
   /*↑z-indexの値をh1のz-indexの値よりも小さくして背景に回す*/
   // height: 60vh;

   /*スライダー全体の縦幅を画面の高さいっぱい（100vh）にする*/
   // @include mixins.mq(md) {
   //    height: 70vh;
   // }

   margin: 0;
}

@media (min-width: 1280px) {
   .slider {
      /* height: 50vh; */
      margin: 0;
   }
}

.slick-slider .slick-track,
.slick-slider .slick-list {}

/*　背景画像設定　*/
// .slider-item01 {
//    background: url(../img/mv_img_1.webp);
// }

// .slider-item02 {
//    background: url(../img/logo1.svg);
// }

.slider-item {
   width: 100%;
   /*各スライダー全体の横幅を画面の高さいっぱい（100%）にする*/
   // height: 60vh;

   /*各スライダー全体の縦幅を画面の高さいっぱい（100vh）にする*/
   // @include mixins.mq(md) {
   //    height: 70vh;
   // }

   background-repeat: no-repeat;
   /*背景画像をリピートしない*/
   background-position: 70% 0;
   /*背景画像の位置を中央に*/
   background-size: cover;
   /*背景画像が.slider-item全体を覆い表示*/
}

/* @media (min-width: 1280px) {
   .slider-item{
      height: 50vh;
   }
} */
/*矢印の設定*/
/*戻る、次へ矢印の位置*/
.slick-prev,
.slick-next {
   position: absolute;
   /*絶対配置にする*/
   z-index: 3;
   top: 42%;
   cursor: pointer;
   /*マウスカーソルを指マークに*/
   outline: none;
   /*クリックをしたら出てくる枠線を消す*/
   /*border-top: 2px solid #ccc; /*矢印の色*/
   /*border-right: 2px solid #ccc; /*矢印の色*/
   height: 25px;
   width: 25px;
}

.slick-prev {
   /*戻る矢印の位置と形状*/
   left: 2.5%;
   transform: rotate(-135deg);
}

.slick-next {
   /*次へ矢印の位置と形状*/
   right: 2.5%;
   transform: rotate(45deg);
}

/*ドットナビゲーションの設定*/
.slick-dots {
   position: relative;
   z-index: 3;
   text-align: center;
   margin: -50px 0 0 0;
}

.slick-dots li {
   display: inline-block;
   margin: 0 5px;
}

.slick-dots button {
   color: transparent;
   outline: none;
   width: 8px;
   /*ドットボタンのサイズ*/
   height: 8px;
   /*ドットボタンのサイズ*/
   display: block;
   border-radius: 50%;
   background: #ccc;
   /*ドットボタンの色*/
}

.slick-dots .slick-active button {
   background: #333;
   /*ドットボタンの現在地表示の色*/
}

#mv {
   margin-top: -80px;
   position: relative;

   picture {
      .picture_img {
         display: block;
         width: 90%;
         margin: 0 auto;
      }
   }

   ul {
      li {
         img {
            object-fit: cover;
            height: 300px;
         }
      }
   }

   .slider_catchcopy_block {
      position: absolute;
      content: '';
      top: 65px;
      left: calc(5% + 40px);
      z-index: 1;

      .slider_catchcopy {
         .slider_catchcopy_1 {
            writing-mode: vertical-rl;
            font-size: var(--fontsize_18);

            .catchcopy_1_1,
            .catchcopy_1_2 {
               margin: 0 5px;

               span {
                  padding: 8px 2px;
                  background-color: rgba(255, 255, 255, 0.8);
                  border-radius: var(--border_radius_5);
                  font-weight: var(--fontweight_bold);
               }
            }
         }
      }
   }
}

/* グローバルーメニュー ここから */
.global_menu {
   display: none;
}

/* ハンバーガーメニュー ここから */
.menu_toggle {
   position: fixed;
   top: 18px;
   right: 18px;
   z-index: 1001;
   width: 52px;
   height: 52px;
   padding: 13px 11px;
   border: 0;
   border-radius: var(--border_radius_10);
   background-color: var(--main_color_5);
   cursor: pointer;
}

.menu_toggle span {
   display: block;
   height: 2px;
   margin: 5px 0;
   background-color: var(--txt_color);
   transition: transform 0.2s, opacity 0.2s;
}

.menu_toggle[aria-expanded="true"] span:nth-child(1) {
   transform: translateY(7px) rotate(45deg);
}

.menu_toggle[aria-expanded="true"] span:nth-child(2) {
   opacity: 0;
}

.menu_toggle[aria-expanded="true"] span:nth-child(3) {
   transform: translateY(-7px) rotate(-45deg);
}

.menu_overlay {
   position: fixed;
   inset: 0;
   z-index: 998;
   background-color: rgba(38, 34, 30, 0.45);
   opacity: 0;
   pointer-events: none;
   transition: opacity 0.25s;
}

.site_menu {
   position: fixed;
   top: 0;
   right: 0;
   z-index: 999;
   width: min(420px, 88vw);
   height: 100dvh;
   overflow-y: auto;
   background-color: var(--main_color_5);
   box-shadow: -8px 0 30px rgba(38, 34, 30, 0.16);
   transform: translateX(100%);
   transition: transform 0.25s ease;
}

.menu_is_open .site_menu {
   transform: translateX(0);
}

.menu_is_open .menu_overlay {
   opacity: 1;
   pointer-events: auto;
}

.menu_is_open {
   overflow: hidden;
}

.site_menu_inner {
   min-height: 100%;
   box-sizing: border-box;
   padding: 34px 32px 40px;
}

.site_menu_header {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding-bottom: 50px;
   border-bottom: 1px solid var(--base_color_4);
}

.site_menu_header p {
   margin: 0;
   color: var(--main_color_1);
   font-family: var(--pacifico);
   font-size: var(--fontsize_20);
   font-weight: var(--fontweight_normal);
   letter-spacing: 0.05em;
}

.menu_close {
   width: 40px;
   height: 40px;
   border: 0;
   background: transparent;
   color: var(--txt_color);
   font-size: 3.2rem;
   line-height: 1;
   cursor: pointer;
   display: none;
}

.menu_list,
.menu_sublist {
   margin: 0;
   padding: 0;
   list-style: none;
}

.menu_list>li {
   border-bottom: 1px solid var(--base_color_4);
}

.menu_list a,
.menu_parent_toggle {
   display: block;
   color: var(--txt_color);
   font-size: var(--fontsize_16);
   font-weight: var(--fontweight_bold);
   text-decoration: none;
}

.menu_parent_header {
   display: flex;
   align-items: center;
}

.menu_parent_header>a {
   flex: 1;
   padding: 18px 8px;
}

.menu_list>li>a,
.menu_parent_toggle {
   width: 100%;
   padding: 18px 8px;
   border: 0;
   background: transparent;
   font-family: inherit;
   text-align: left;
   cursor: pointer;
}

.menu_parent_toggle {
   flex: 0 0 52px;
}

.menu_list>li>a::after {
   float: right;
   color: var(--main_color_1);
   content: '›';
   font-size: var(--fontsize_20);
   line-height: 1;
}

.menu_parent_toggle::after {
   float: right;
   color: var(--main_color_1);
   content: '+';
   font-size: var(--fontsize_20);
   line-height: 1;
}

.menu_parent_toggle[aria-expanded="true"]::after {
   content: '-';
}

.menu_sublist {
   margin: -4px 0 14px;
   padding-left: 20px;
   border-left: 2px solid var(--base_color_1);
}

.menu_sublist a {
   padding: 8px 0;
   color: var(--main_color_4);
   font-size: var(--fontsize_14);
   font-weight: var(--fontweight_normal);
}

.menu_sublist a::before {
   margin-right: 8px;
   color: var(--main_color_2);
   content: '-';
}

.menu_actions {
   display: grid;
   gap: 12px;
   margin-top: 28px;
}

.menu_actions a {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 10px;
   padding: 14px 16px;
   border-radius: var(--border_radius_10);
   color: var(--main_color_5);
   font-size: var(--fontsize_16);
   font-weight: var(--fontweight_bold);
   text-align: center;
   text-decoration: none;
}

.menu_actions img {
   flex: 0 0 auto;
   width: 34px;
   height: 34px;
}

.menu_actions a>span {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   line-height: 1.3;
}

.menu_actions small {
   font-size: var(--fontsize_12);
   font-weight: var(--fontweight_normal);
}

.menu_web_btn {
   background-color: var(--accent_color_1);
}

.menu_tel_btn {
   background-color: var(--main_color_1);
}

@media (min-width: 768px) {
   .menu_toggle {
      top: 24px;
      right: 24px;
   }
}

/* ハンバーガーメニュー ここまで */

/* お悩み ここから */
.index_worries_sec {

   .inner0_20 {
      border: 7px solid var(--main_color_3);
      margin-top: 100px;
      border-radius: 30px;
   }

   .index_h2_block {
      background-color: var(--main_color_5);
      width: 80%;
      margin: -50px auto 0;
      padding: 10px;
      text-align: center;

      h2 {
         margin-bottom: 0;
      }

   }

   .worries_block_columns {
      padding: 30px;

      .worries_block {
         display: flex;
         flex-direction: column;
         align-items: center;
         margin: 60px 0;

         h3 {
            color: var(--main_color_3);
            margin: 10px 0 0;
         }

         span {
            color: var(--main_color_3);
            font-weight: var(--fontweight_bold);
            font-size: var(--fontsize_18);
         }

         .img_1 {
            position: relative;

            &:before {
               position: absolute;
               content: '';
               background-image: url(../motomachirac/assets/img/worries_no1_img.svg);
               background-position: center;
               background-size: cover;
               background-repeat: no-repeat;
               width: 90px;
               height: 90px;
               top: -40px;
               left: -40px;
            }

            img {
               width: 200px;
               height: 200px;
               object-fit: cover;
               /* 画像の比率を保つ */
               clip-path: url(#rounded-pentagon);
            }
         }

         .img_2 {
            position: relative;

            &:before {
               position: absolute;
               content: '';
               background-image: url(../motomachirac/assets/img/worries_no2_img.svg);
               background-position: center;
               background-size: cover;
               background-repeat: no-repeat;
               width: 90px;
               height: 90px;
               top: -40px;
               left: -40px;
            }

            img {
               width: 200px;
               height: 200px;
               object-fit: cover;
               /* 画像の比率を保つ */
               clip-path: url(#rounded-pentagon);
            }
         }

         .img_3 {
            position: relative;

            &:before {
               position: absolute;
               content: '';
               background-image: url(../motomachirac/assets/img/worries_no3_img.svg);
               background-position: center;
               background-size: cover;
               background-repeat: no-repeat;
               width: 90px;
               height: 90px;
               top: -40px;
               left: -40px;
            }

            img {
               width: 200px;
               height: 200px;
               object-fit: cover;
               /* 画像の比率を保つ */
               clip-path: url(#rounded-pentagon);
            }
         }

         .img_4 {
            position: relative;

            &:before {
               position: absolute;
               content: '';
               background-image: url(../motomachirac/assets/img/worries_no4_img.svg);
               background-position: center;
               background-size: cover;
               background-repeat: no-repeat;
               width: 90px;
               height: 90px;
               top: -40px;
               left: -40px;
            }

            img {
               width: 200px;
               height: 200px;
               object-fit: cover;
               /* 画像の比率を保つ */
               clip-path: url(#rounded-pentagon);
            }
         }

         .img_5 {
            position: relative;

            &:before {
               position: absolute;
               content: '';
               background-image: url(../motomachirac/assets/img/worries_no5_img.svg);
               background-position: center;
               background-size: cover;
               background-repeat: no-repeat;
               width: 90px;
               height: 90px;
               top: -40px;
               left: -40px;
            }

            img {
               width: 200px;
               height: 200px;
               object-fit: cover;
               /* 画像の比率を保つ */
               clip-path: url(#rounded-pentagon);
            }
         }

         .img_6 {
            position: relative;

            &:before {
               position: absolute;
               content: '';
               background-image: url(../motomachirac/assets/img/worries_no6_img.svg);
               background-position: center;
               background-size: cover;
               background-repeat: no-repeat;
               width: 90px;
               height: 90px;
               top: -40px;
               left: -40px;
            }

            img {
               width: 200px;
               height: 200px;
               object-fit: cover;
               /* 画像の比率を保つ */
               clip-path: url(#rounded-pentagon);
            }
         }

         p {
            text-align: center;
         }
      }

      .txt_center {
         font-size: var(--fontsize_18);
      }

      .notice {
         color: var(--main_color_2);
         font-weight: var(--fontweight_bold);
      }
   }
}

/* お悩み ここまで */

/* 二つの柱で健康を支えます ここから */
.index_supporting_health_sec {
   .colums {
      display: flex;
      flex-direction: column;
      gap: 20px;
      margin: 30px 0;

      .subject_01,
      .subject_02 {
         border-radius: 20px 20px 60px 20px;
         padding: 20px 20px 40px;

         ul {
            li {
               background-color: var(--main_color_5);
               margin: 10px 0;
               padding: 5px;
               border-radius: var(--border_radius_5);

               a {
                  display: block;
               }
            }
         }
      }

      .subject_01 {
         background-color: var(--base_color_1);
         border-left: 8px solid var(--main_color_1);
      }

      .subject_02 {
         background-color: var(--base_color_2);
         border-left: 8px solid var(--main_color_2);
      }
   }
}

.main_btn {
   display: inline-flex;
   border-bottom: var(--border_width_3) solid var(--accent_color_1);
   padding: 15px 5px 10px;
   margin: 10px 0;
   font-size: var(--fontsize_18);
   gap: 4px;

   img {
      width: 25px;
      transition: transform 0.25s ease;
   }

   &:hover img {
      transform: translateX(2px);
   }
}



/* 二つの柱で健康を支えます ここまで */
/* 当院の特徴 ここから */
.index_feature_sec {
   background: url(../motomachirac/assets/img/feature_bg_img.webp);
   background-size: auto;
   background-position: center;
   background-repeat: repeat;

   h2 {
      font-size: var(--fontsize_28);
      position: relative;

      &:before {
         position: absolute;
         content: '';
         background: url(../motomachirac/assets/img/logo_opacity.svg);
         background-position: center;
         background-size: cover;
         background-repeat: no-repeat;
         width: 240px;
         height: 120px;
         top: 50%;
         left: 50%;
         transform: translate(-50%, -60%);
      }
   }

   .columns_block_1,
   .columns_block_2,
   .columns_block_3 {
      display: flex;
      flex-direction: column;
      align-items: center;

      .feature_img {
         img {
            width: 240px;
         }
      }



      .img {
         width: 200px;
         margin: 10px 0;

         img {
            width: 200px;
            height: 200px;
            object-fit: cover;
            border-radius: 50% 50% 0 0;
            box-shadow: 4px 4px 6px rgb(49, 69, 36, 0.2);
         }
      }
   }

   .columns_block_1 {
      h3 {
         color: var(--main_color_1);
         text-align: center;
      }
   }

   .columns_block_2 {
      h3 {
         color: var(--main_color_2);
         text-align: center;
      }
   }

   .columns_block_3 {
      h3 {
         color: var(--main_color_3);
         text-align: center;
      }
   }

   .medical_devices {
      background-color: var(--base_color_1);
      padding: 20px;
      border-radius: var(--border_radius_10);
      margin: 20px 0 0;

      ul {
         font-weight: var(--fontweight_normal);
         margin: 10px 0;
      }
   }
}

/* 当院の特徴 ここまで */

/* 院長あいさつ ここから */
.index_greeting_sec {
   background: url(../motomachirac/assets/img/greeting_bg_img.webp);
   background-position: center;
   background-size: cover;
   background-repeat: no-repeat;

   .columns {
      display: flex;
      flex-direction: column-reverse;
      gap: 30px;

      .doctor_img {
         img {
            width: 80%;
            /* 長い方のサイズ */
            height: 170px;
            /* 短い方のサイズ */
            border-radius: 9999px;
            object-fit: cover;
            outline: 16px solid var(--base_color_8);
            outline-offset: -16px;
         }

         figcaption {
            margin-top: 20px;
         }
      }

      h3 {
         color: var(--main_color_1);

         span {
            font-size: var(--fontsize_18);
         }
      }
   }
}

/* 院長あいさつ ここまで */

/* お知らせ ここから */
.index_news_sec {
   .news_item {
      margin-bottom: 20px;

      a {
         position: relative;

         &:after {
            position: absolute;
            right: 0;
            bottom: -6px;
            left: 0;
            height: 3px;
            background-image: radial-gradient(circle, var(--main_color_1) 1px, transparent 1.5px);
            background-position: left center;
            background-size: 8px 3px;
            content: '';
         }

         .news_ttl {
            margin-top: 0;
         }
      }
   }
}

/* お知らせ ここまで */

/* フッター ここから */

footer {
   margin-top: 150px;
   padding-bottom: 30px;
   background-color: var(--base_color_9);

   .logo {
      position: relative;
      width: 250px;
      margin: 0 auto;

      &:before {
         position: absolute;
         content: '';
         background-color: var(--base_color_9);
         width: 100%;
         height: 180px;
         top: 50%;
         left: 50%;
         transform: translate(-50%, -70%);
         border-radius: 50% 50% 0 0;
         z-index: -1;
      }

      img {
         margin-top: -30px;
      }
   }

   .columns {
      display: flex;
      flex-direction: column;
      gap: 20px;
      margin: 20px 0;

      ul {
         text-indent: -1em;
         padding-left: 1em;
         font-weight: var(--fontweight_normal);
         margin: 10px 0;

         .buss_img,
         .car_img {
            width: 30px;
            margin-right: 5px;
         }

         li {
            line-height: 1.2;
         }

         li:last-of-type {
            margin-top: 15px;
         }
      }
   }

   .footer_bottom {
      display: grid;
      grid-template-columns: 1fr;
      gap: 32px;
      align-items: start;
      margin-top: 50px;
      padding: 30px 24px;
      border-radius: var(--border_radius_10);
      background-color: var(--main_color_5);
   }

   .footer_menu {
      display: grid;
      grid-template-columns: 1fr;
      gap: 28px;
      align-items: start;
   }

   .footer_menu_column {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 16px;
   }

   .footer_menu a {
      color: var(--txt_color);
      font-size: var(--fontsize_14);
      font-weight: var(--fontweight_normal);
      line-height: 1.5;
      text-decoration: none;
   }

   .footer_menu_column>a {
      font-weight: var(--fontweight_bold);
   }

   .footer_menu ul {
      display: flex;
      flex-direction: column;
      gap: 0px;
      margin: -9px 0 0;
      padding: 0 0 0 16px;
      list-style: none;
   }

   .footer_menu li,
   .footer_menu li span {
      font-weight: var(--fontweight_normal);
   }

   .footer_menu li a::before {
      margin-right: 2px;
      content: '・';
   }

   .footer_actions {
      display: flex;
      flex-direction: column;
      gap: 12px;
      min-width: 170px;
      width: min(100%, 260px);
      margin: 0 auto;

      .tel_btn {
         a {
            flex-direction: row;
         }
      }
   }

   .footer_actions a {
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 54px;
      padding: 5px 18px;
      box-sizing: border-box;
      border-radius: 100px;
      color: var(--main_color_5);
      font-weight: var(--fontweight_normal);
      line-height: 1.3;
      text-align: center;
      text-decoration: none;
   }


   .link_block {
      text-align: center;
      margin-top: 30px;

      a {
         text-decoration: underline;
      }
   }

   .copyright {
      margin-top: 20px;
   }
}

.postlink {
   display: flex;
   justify-content: space-between;
   margin: 20px 0;

   .previous,
   .next {
      small {
         display: flex;
         flex-direction: column;
      }
   }
}

#sidebar {
   h2 {
      text-align: left;
   }
}

.single_block {
   h1 {
      color: var(--main_color_1);
   }
}

.archive_block {
   .archive_item {
      a {
         position: relative;

         &:after {
            position: absolute;
            right: 0;
            bottom: -6px;
            left: 0;
            height: 3px;
            background-image: radial-gradient(circle, var(--main_color_1) 1px, transparent 1.5px);
            background-position: left center;
            background-size: 8px 3px;
            content: '';
         }
      }
   }
}

.wp-pagenavi {
   clear: both;
   text-align: center;
   margin: 50px 0;
}

.wp-pagenavi a,
.wp-pagenavi span {
   color: var(--main_color_1);
   background-color: #FFFFFF;
   padding: 8px 15px;
   margin: 0 2px;
   white-space: nowrap;
   -webkit-transition: 0.2s ease-in-out;
   -moz-transition: 0.2s ease-in-out;
   -o-transition: 0.2s ease-in-out;
   transition: 0.2s ease-in-out;
   text-align: center;
   text-decoration: none;
   border: thin dotted var(--main_color_1);
}

.wp-pagenavi a:hover {
   color: #fff;
   background-color: var(--main_color_1);
}

.wp-pagenavi span.current {
   color: #fff;
   background-color: var(--main_color_1);
}

/* フッター ここまで */

/* モバイル固定予約ボタン ここから */
.mobile_fixed_actions {
   display: none;
}

@media (max-width: 767px) {
   body {
      padding-bottom: 64px;
   }

   .mobile_fixed_actions {
      position: fixed;
      right: 0;
      bottom: 0;
      left: 0;
      z-index: 996;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      height: 64px;
      box-shadow: 0 -2px 10px rgb(0 0 0 / 12%);
      display: none;
   }

   .mobile_fixed_action {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      min-width: 0;
      color: var(--main_color_5);
      font-size: var(--fontsize_16);
      font-weight: var(--fontweight_bold);
      line-height: 1.2;
      text-decoration: none;
   }

   .mobile_fixed_action img {
      width: 24px;
      height: 24px;
   }

   .mobile_fixed_web {
      background-color: var(--accent_color_1);
      border-radius: 5px 0 0 0;
   }

   .mobile_fixed_web span {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
   }

   .mobile_fixed_web small {
      font-size: var(--fontsize_12);
      font-weight: var(--fontweight_normal);
   }

   .mobile_fixed_tel {
      background-color: var(--main_color_1);
      border-radius: 0 5px 0 0;
      border-left: var(--border_width_2) solid var(--main_color_5);
   }

   .back_to_top {
      bottom: 78px;
   }
}

/* モバイル固定予約ボタン ここまで */

/* ページトップへ戻るボタン ここから */
.back_to_top {
   position: fixed;
   right: 14px;
   bottom: 80px;
   width: 46px;
   height: 46px;
   z-index: 997;
   display: grid;
   padding: 0;
   border: 2px solid var(--main_color_1);
   border-radius: 50%;
   background-color: var(--main_color_5);
   color: var(--main_color_1);
   cursor: pointer;
   opacity: 0;
   pointer-events: none;
   place-items: center;
   transform: translateY(10px);
   transition: opacity 0.2s, transform 0.2s, background-color 0.2s;
}

.back_to_top.is_visible {
   opacity: 1;
   pointer-events: auto;
   transform: translateY(0);
}

.back_to_top:hover,
.back_to_top:focus-visible {
   background-color: var(--base_color_1);
}

.back_to_top span {
   font-size: 24px;
   line-height: 1;
}

@media (min-width: 768px) {
   .back_to_top {
      right: 20px;
      bottom: 20px;
      width: 52px;
      height: 52px;
   }
}

/* ページトップへ戻るボタン ここまで */

/* 診療時間表 ここから */
.clinic_hours {
   overflow: hidden;
   border-radius: var(--border_radius_10);
   background-color: var(--base_color_2);
}

.clinic_hours_table {
   width: 100%;
   border-collapse: collapse;
   table-layout: fixed;
}

.clinic_hours_table thead {
   background-color: var(--main_color_2);
   color: var(--main_color_5);
}

.clinic_hours_table th,
.clinic_hours_table td {
   height: 58px;
   padding: 4px;
   text-align: center;
   vertical-align: middle;
}

.clinic_hours_table thead th {
   font-size: var(--fontsize_18);
   font-weight: var(--fontweight_bold);
}

.clinic_hours_table thead th:first-child {
   width: 38%;
}

.clinic_hours_table tbody th {
   color: var(--txt_color);
   font-size: var(--fontsize_16);
   font-weight: var(--fontweight_normal);
   white-space: nowrap;
}

.clinic_hours_table tbody td {
   color: var(--main_color_6);
}

.clinic_hours_table tbody tr+tr {
   border-top: var(--border_width_3) solid var(--main_color_5);
   border-bottom: var(--border_width_3) solid var(--main_color_5);
}

.clinic_hours_table td {
   font-size: var(--fontsize_22);
   line-height: 1;
}

.clinic_hours_table .is_open {
   color: var(--txt_color);
}

.clinic_hours_table .is_closed {
   color: var(--txt_color);
   font-size: var(--fontsize_20);
   font-weight: var(--fontweight_normal);
}

.clinic_hours_note,
.clinic_hours_notice {
   margin: 12px 8px 0;
   color: var(--txt_color);
   font-size: var(--fontsize_16);
   font-weight: var(--fontweight_normal);
}

.clinic_hours_notice {
   margin-top: 0;
}

.clinic_hours_notice span {
   color: var(--caution_color);
   font-size: var(--fontsize_20);
}

/* 診療時間表 ここまで */

/* ヒーローヘッダー ここから */
.hero_img {
   position: relative;
   margin: 30px 20px 0;

   .page_h1 {
      position: absolute;
      content: '';
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
   }

   img {
      object-fit: cover;
      height: 180px;
      border-radius: 50px;
   }
}

.header_columns.header_columns_subpage {
   padding: 5px 5px 10px;
}

/* ヒーローヘッダー ここまで */
/* 院長あいさつ ここから */
.p_greeting {
   .left {
      .doctor_img {
         img {
            border-radius: 9999px;
            outline: 16px solid var(--base_color_8);
            outline-offset: -16px;
         }
      }
   }

   .doctor_name {
      margin-top: 20px !important;
   }
}


/* 院長あいさつ ここまで */

/* 診療案内 ここから */
.p_medical_services {
   .policy_block {
      .columns {
         display: grid;
         gap: 30px;

         .left,
         .center,
         .right {
            display: flex;
            flex-direction: column;
            align-items: center;
            background: url(../motomachirac/assets/img/p_medical_services_bg_img.webp);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            border-radius: 10px 10px 35px 10px;
            padding: 30px;

            .img {
               margin: 0 auto;
               width: 180px;
               margin-bottom: 30px;

               img {
                  width: 180px;
                  filter: drop-shadow(0px 4px 0px #73C46B);
               }
            }
         }
      }
   }

   .medical_subjects_block {
      .columns {
         display: grid;
         gap: 30px;

         h3 {
            margin-bottom: 0;
            color: var(--main_color_1);
         }

         .left,
         .right {
            display: flex;
            flex-direction: column;
            align-items: center;
            border-radius: var(--border_radius_10);
            padding: 40px;
            transition: transform 0.2s ease;

            &:hover {
               transform: rotate(-1deg);
            }
         }

         .left {
            background: url(../motomachirac/assets/img/p_medical_services_img_4.webp);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
         }

         .right {
            background: url(../motomachirac/assets/img/p_medical_services_img_5.webp);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
         }
      }
   }

   .first_visit_information_block {
      .columns {
         display: grid;
         gap: 30px;
         margin: 30px 0;

         h3 {
            position: relative;
            margin-left: 20px;
            padding-left: 30px;
            margin-bottom: 15px;
            display: flex;
            align-items: center;
         }

         .order_1 {
            h3 {
               &:before {
                  position: absolute;
                  content: '1';
                  width: 40px;
                  height: 40px;
                  left: -20px;
                  background-color: var(--main_color_1);
                  color: var(--main_color_5);
                  border-radius: 50%;
                  display: flex;
                  align-items: center;
                  justify-content: center;
               }
            }
         }

         .order_2 {
            h3 {
               &:before {
                  position: absolute;
                  content: '2';
                  width: 40px;
                  height: 40px;
                  left: -20px;
                  background-color: var(--main_color_1);
                  color: var(--main_color_5);
                  border-radius: 50%;
                  display: flex;
                  align-items: center;
                  justify-content: center;
               }
            }

            ul {
               li:first-of-type {
                  margin-bottom: 10px;

                  &:before {
                     display: none;
                  }
               }
            }
         }

         .caution {
            color: var(--caution_color);
         }

         .order_3 {
            h3 {
               &:before {
                  position: absolute;
                  content: '3';
                  width: 40px;
                  height: 40px;
                  left: -20px;
                  background-color: var(--main_color_1);
                  color: var(--main_color_5);
                  border-radius: 50%;
                  display: flex;
                  align-items: center;
                  justify-content: center;
               }
            }
         }

         .order_4 {
            h3 {
               &:before {
                  position: absolute;
                  content: '4';
                  width: 40px;
                  height: 40px;
                  left: -20px;
                  background-color: var(--main_color_1);
                  color: var(--main_color_5);
                  border-radius: 50%;
                  display: flex;
                  align-items: center;
                  justify-content: center;
               }
            }
         }

         .order_5 {
            h3 {
               &:before {
                  position: absolute;
                  content: '5';
                  width: 40px;
                  height: 40px;
                  left: -20px;
                  background-color: var(--main_color_1);
                  color: var(--main_color_5);
                  border-radius: 50%;
                  display: flex;
                  align-items: center;
                  justify-content: center;
               }
            }
         }

         .order {
            background: url(../motomachirac/assets/img/p_medical_services_bg_img_2.webp);
            background-size: auto;
            background-position: center;
            background-repeat: repeat;
            padding: 30px;
            border-radius: var(--border_radius_10)
         }
      }
   }
}

/* 診療案内 ここまで */
/* 院内案内 ここから */

.facility_guide_block {
   .columns {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 20px;

      .img {
         /* width: calc(100% / 2 - 10px); */

         img {
            border-radius: var(--border_radius_10);
            box-shadow: var(--box_shadow_gray);
         }
      }
   }
}

/* 院内案内 ここまで */
/* 診療案内 ここから */
.p_symptoms {
   h3 {
      margin-bottom: 0;
   }

   .p_symptoms_block {
      .left {
         img {
            border-radius: var(--border_radius_10);
            box-shadow: var(--box_shadow_gray);
         }
      }

      .columns {
         display: grid;
         gap: 30px;
      }
   }

   .rheumatology_symptoms_block {
      .head_border {

         &:before,
         &:after {
            background-color: var(--main_color_2);
         }
      }
   }
}

/* 診療案内 ここまで */
/* よくあるご質問 ここから */

.p_qa {
   .columns {
      display: grid;
      gap: 30px;

      .qa_block {
         background-color: var(--base_color_2);
         padding: 30px;
         border-radius: var(--border_radius_10);
         border-bottom: 4px solid var(--main_color_7);

         .qa_block_inner {
            h2 {
               position: relative;
               text-align: left;
               padding-left: 2em;

               &:before {
                  position: absolute;
                  content: 'Q';
                  width: 40px;
                  height: 40px;
                  line-height: 40px;
                  display: flex;
                  justify-content: center;
                  align-items: center;
                  color: var(--main_color_5);
                  background-color: var(--main_color_1);
                  border-radius: 50%;
                  font-family: var(--pacifico);
                  font-size: var(--fontsize_18);
                  margin-left: -50px;
               }
            }

            p {
               position: relative;
               padding-left: 3em;

               &:before {
                  position: absolute;
                  content: 'A';
                  width: 40px;
                  height: 40px;
                  line-height: 40px;
                  display: flex;
                  justify-content: center;
                  align-items: center;
                  color: var(--main_color_5);
                  background-color: var(--main_color_2);
                  border-radius: 50%;
                  font-family: var(--pacifico);
                  font-size: var(--fontsize_18);
                  margin-left: -50px;
               }
            }
         }

         .web_btn {
            p {
               &:before {
                  display: none;
               }
            }
         }
      }
   }
}

/* よくあるご質問 ここまで */

/* パンくずここから */
#breadcrumb {
   margin: 10px 20px;
}

/* パンくずここまで */





@media (min-width: 768px) {
   .header_columns {
      padding: 5px 5px 80px;

      .right {
         /* margin-right: 100px; */
      }
   }

}



@media (min-width: 1024px) {

   .menu_toggle,
   .site_menu,
   .menu_overlay {
      display: none;
   }

   .header_columns {
      padding: 10px 10px 100px;

      .inner_columns {
         display: flex;
         gap: 20px;
         justify-content: center;
      }

      .logo {
         width: 260px;
      }

      .center {
         display: block;
         /* order: 3; */

         p {
            line-height: 1.5;
            margin-top: 5px;
         }
      }

      .right {
         margin-right: 0;
         width: auto;

         .txt_right {
            font-size: var(--fontsize_18);
            display: block;

            .marker_underline {
               font-size: var(--fontsize_20);
            }
         }

         .web_btn {
            padding: 10px;
            margin-bottom: 10px;
            max-width: 320px;

            img {
               width: 30px;
            }

            span {
               font-size: var(--fontsize_24);
            }

            .reception {
               font-size: var(--fontsize_16);

               &:before {
                  left: -15px;
               }

               &:after {
                  right: -15px;
               }
            }
         }

         .tel_btn {
            padding: 10px;
            font-size: var(--fontsize_22);
            max-width: 320px;

            img {
               width: 30px;
            }
         }
      }
   }

   #mv {
      margin-top: -110px;

      picture {
         .picture_img {
            width: 1000px;
         }
      }

      .slider_catchcopy_block {
         top: 85px;
         left: calc((100% - 1000px) / 2 + 80px);

         .slider_catchcopy_1 {
            font-size: var(--fontsize_24) !important;
         }
      }
   }

   /* グローバルーメニュー ここから */
   .global_menu {
      display: block;
      position: relative;
      z-index: 2;
      /* background-color: var(--main_color_5); */
      padding: 0 50px;
   }

   .global_menu_list {
      position: relative;
      display: flex;
      justify-content: center;
      max-width: 1000px;
      margin: 0 auto;
      padding: 0;
      list-style: none;

   }

   .global_menu_list::before,
   .global_menu_list::after {
      position: absolute;
      top: 24%;
      bottom: 24%;
      width: 3px;
      background-color: var(--main_color_1);
      content: '';
   }

   .global_menu_list::before {
      left: 0;
   }

   .global_menu_list::after {
      right: 0;
   }

   .global_menu_list>li {
      position: relative;
      flex: 1 1 0;
   }

   .global_menu_list>li:nth-child(4) {
      flex-grow: 1.35;
   }

   .global_menu_list>li+li::before {
      position: absolute;
      top: 28%;
      bottom: 28%;
      left: 0;
      width: 2px;
      background-color: var(--main_color_1);
      content: '';
   }

   .global_menu_list>li>a {
      display: block;
      padding: 16px 4px;
      color: var(--main_color_1);
      font-size: var(--fontsize_16);
      font-weight: var(--fontweight_bold);
      white-space: nowrap;
      text-align: center;
      text-decoration: none;
   }

   .global_menu_parent>a::after {
      display: inline-block;
      width: 7px;
      height: 7px;
      margin: 0 0 3px 10px;
      color: var(--main_color_1);
      border-right: 2px solid var(--main_color_1);
      border-bottom: 2px solid var(--main_color_1);
      content: '';
      transform: rotate(45deg);
   }

   .global_menu_sublist {
      position: absolute;
      top: 100%;
      left: 0;
      visibility: hidden;
      opacity: 0;
      width: 180px;
      margin: 0;
      padding: 8px 0;
      background-color: var(--base_color_1);
      border-radius: var(--border_radius_10);
      list-style: none;
      box-shadow: 0 8px 16px rgba(38, 34, 30, 0.12);
      pointer-events: none;
      transform: translateY(12px);
      transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
   }

   .global_menu_parent:hover .global_menu_sublist,
   .global_menu_parent:focus-within .global_menu_sublist {
      visibility: visible;
      opacity: 1;
      pointer-events: auto;
      transform: translateY(0);
   }

   .global_menu_sublist a {
      position: relative;
      display: block;
      margin: 0 14px;
      padding: 10px 4px;
      color: var(--main_color_1);
      font-size: var(--fontsize_16);
      font-weight: var(--fontweight_normal);
      text-decoration: none;
   }

   .global_menu_sublist a::after {
      position: absolute;
      right: 0;
      bottom: 0;
      left: 0;
      height: 3px;
      background-image: radial-gradient(circle, var(--main_color_1) 1px, transparent 1.5px);
      background-position: left center;
      background-size: 8px 3px;
      content: '';
   }

   .global_menu_sublist li:last-child a::after {
      display: none;
   }

   /* グローバルーメニュー ここまで */


   .openday_display_smartphone {
      display: none;
   }

   .hero_img {
      img {
         height: 300px;
      }
   }

   .index_worries_sec {
      .worries_block_columns {
         padding-top: 60px;

         .worries_block_columns_inner {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 20px;

            .worries_block {
               margin: 30px 0;

               .img_2,
               .img_5 {
                  margin-top: -40px;
               }
            }
         }
      }
   }

   .index_supporting_health_sec {
      .colums {
         flex-direction: row;

         .subject_01,
         .subject_02 {
            width: calc(100% - 20px);

            ul {
               display: grid;
               grid-template-columns: repeat(2, 1fr);
               gap: 10px;
               margin: 10px 0;

               li {
                  margin: 0;
               }
            }
         }

         .subject_01 {
            display: flex;
            flex-direction: column;

            .main_btn {
               align-self: flex-start;
               margin-top: auto;
            }
         }
      }
   }

   .index_supporting_health_sec {
      .head-border {
         width: 850px;
         margin: 0 auto;
      }
   }

   .index_feature_sec {
      .columns {
         display: grid;
         grid-template-columns: repeat(3, 1fr);
         gap: 20px;
         margin: 50px 0;
      }
   }

   .index_greeting_sec {
      padding: 150px 0;
      margin: 150px 0 0;
      background-position: left;

      .columns {
         flex-direction: row;
         gap: 40px;

         .left {
            width: 350px;

            .doctor_img {
               width: 350px;

               img {
                  height: 550px;
                  width: 100%;
               }
            }

            figcaption {
               text-align: center;
            }
         }

         h2 {
            text-align: left;
         }
      }
   }


   .index_news_sec {

      .columns {
         display: flex;
         gap: 30px;

         .left {
            width: 300px;
         }

         .right {
            flex-grow: 1;
         }
      }

      .news_item {
         a {
            display: flex;
            gap: 10px;

            .news_date {
               margin-top: 0;
            }
         }
      }
   }

   footer {
      .logo {
         width: 350px;

         &:before {
            transform: translate(-50%, -90%);
         }
      }

      .columns {
         flex-direction: row;
         gap: 30px;

         .left {
            width: 42%;
         }

         .right {
            width: 58%;
         }
      }

      .footer_bottom {
         grid-template-columns: minmax(0, 1fr) auto;
         gap: 20px;
         margin-top: 70px;
         padding: 42px 7.5%;
      }

      .footer_menu {
         grid-template-columns: repeat(3, minmax(130px, 1fr));
         gap: 15px;
      }

      .footer_menu_column_rheumatism {
         padding-top: calc(var(--fontsize_14) * 1.5 + 16px);
      }

      .footer_actions {
         width: auto;
         margin: 0;

         .web_btn,
         .tel_btn {
            width: 200px;
         }
      }
   }

   .clinic_hours_table thead th:first-child {
      width: 30%;
   }

   .p_greeting {
      .columns {
         overflow: hidden;

         .left {
            float: left;
            margin-right: 30px;

            img {
               object-fit: cover;
               width: 400px;
               height: 560px;
            }
         }

         .right {
            p {
               margin-top: 0;
            }
         }
      }
   }

   .p_medical_services {
      .policy_block {
         .columns {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
         }
      }

      .medical_subjects_block {
         .columns {
            grid-template-columns: repeat(2, 1fr);

            a {
               display: grid;
            }
         }
      }
   }

   .facility_guide_block {
      .columns {
         grid-template-columns: repeat(1, 1fr);

         .img {
            width: 700px;
            margin: 0 auto;

            img {
               width: 700px;
            }
         }
      }
   }

   .p_symptoms {
      .p_symptoms_block {
         .columns {
            display: flex;

            .left {
               img {
                  width: 300px;
               }
            }
         }
      }
   }
}

@media (min-width: 1280px) {
   .header_columns {
      .inner_columns {
         width: 1100px;
         margin: 0 auto;
         gap: 60px;
      }

      .logo {
         width: 280px;
      }
   }

   #mv {
      picture {
         .picture_img {
            width: 1200px;
         }
      }

      .slider_catchcopy_block {
         top: 100px;

         .slider_catchcopy_1 {
            font-size: var(--fontsize_28) !important;
         }
      }
   }

   .global_menu_list>li>a {
      font-size: var(--fontsize_18);
      padding-right: 2px;
      padding-left: 2px;
   }

   .hero_img,
   #breadcrumb {
      width: 1300px;
      margin: 30px auto 0;
   }
}