/* clinic detail */ /* クリニックLPページ */ footer #wrap_footer_area_navs { border-top:none; } /* レイアウト */ #wrap_clinic_detail { background-color: var(--color-primary-bg); padding-top: 2.5rem; padding-bottom: 3.75rem; } #wrap_clinic_detail_inner { padding: 0 2.5rem 2.5rem; background-color: white; border-radius: 1.25rem; } @media screen and (max-width:999.99px) { #wrap_clinic_detail_inner { margin: 0 1rem; padding: 0 1.25rem; width: calc(100% - 2rem); } } #wrap_clinic_header { display: grid; grid-template-columns: 1fr 1fr; grid-column-gap:0.625rem; margin-bottom: 1rem; } @media screen and (max-width:767.99px) { #wrap_clinic_header { display: block; } } h1#clinic_name { display: grid; grid-template-columns: 100%; grid-template-rows: 0.625rem 1fr; font-size: clamp(1.125rem, calc(1.125rem + 0.25vw), 1.625rem); padding: 0; align-items: center; justify-items: left; } h1#clinic_name span { display: block; } @media screen and (max-width:767.99px) { h1#clinic_name { display: block; } } /* クリニック名テキスト本体 */ h1#clinic_name b { display: block; width: 100%; text-align: left; padding-left: 0.5rem; padding-right: 0.5rem; margin-top: var(--blank-20px); } #clinic_name_decoration { width: 100%; height: 0.625rem; background-color: var(--color-primary); } #clinic_name_inner { text-align: left; } h1#clinic_name[data-type="silver"] #clinic_name_decoration { background: linear-gradient(to right, var(--color-silver-gradient-start) 0%, var(--color-silver-gradient-end) 100%); } h1#clinic_name[data-type="premium"] #clinic_name_decoration { background: linear-gradient(to right, var(--color-premium-gradient-start) 0%, var(--color-premium-gradient-end) 100%); } h1#clinic_name[data-type="premium"] { background-color: var(--color-premium-bg); background-image: url(/customdir/img/premium_bg.png); } /* 有料インデックス階層アイコン */ h1#clinic_name #index_group_icons { margin-bottom: 0.5rem; } h1#clinic_name i { display: inline-block; line-height: 1.25; padding: 0.125rem; font-style: normal; font-size: 0.875rem; font-weight:normal; color:var(--color-mono-middle); background-color: white; border:1px solid var(--color-mono-middle); border-radius: 0.25rem; } h1#clinic_name i[data-type=premium] { color:var(--color-accent-text); background-color: var(--color-accent-bg); border:1px solid var(--color-accent-text); } h1#clinic_name i[data-type=premium]:before { content:"★"; } /* クリニック概要・上部 */ #clinic_outline_header { padding-top: var(--blank-20px); position: relative; } #clinic_outline_header #update_date { text-align: right; display: block; position: absolute; right: 0; top: 0.25rem; color: var(--color-mono-middle); } /* クリニック詳細見出し */ #wrap_clinic_detail h2 { background-color: var(--color-clinic-headline-bg); color:var(--color-clinic-headline-text); font-size: clamp(1rem, calc(1rem + 0.125vw), 1.25rem); border:none; border-radius: 0.375rem; padding: 1.25rem; margin-top:2rem; margin-bottom: 0.625rem; min-height: 4.07rem; } #wrap_clinic_detail h2:after { /* Lightning装飾削除 */ content: ''; border: 0 solid transparent; } .wrap_outline_title_text h3 { color:var(--color-mono-text2); } .wrap_outline_title_text h3:where(:not(.wp-block-post-title)):after { display: none; } /* クリニック概要（名称の右カラム） */ #wrap_address { margin-bottom: 0; } #wrap_traffics, #wrap_spec_icons { margin-bottom: 0.25rem; } #wrap_spec_icons { font-size: 0.875rem; } #wrap_address, #wrap_traffics, #wrap_spec_icons { position: relative; padding-left: 1.375rem; } #wrap_address:before, #wrap_traffics:before, #wrap_spec_icons:before { content:''; display: inline-block; position: absolute; left: 0; top: 0.375em; width: 1em; height: 1em; background-size: contain; vertical-align: middle; } #wrap_spec_icons:before { top: 0.5em; } #wrap_address:before { background-image: url(/customdir/img/icon/map_clinic_detail.svg); } #wrap_traffics:before { background-image: url(/customdir/img/icon/rail_clinic_detail.svg); } #wrap_spec_icons:before { background-image: url(/customdir/img/icon/spec_internal_clinic_detail.svg); } /* 診療科目タグアイコン */ span.icon-text { display: inline-block; margin-right: 0.25rem; margin-bottom: 0.25rem; padding: 0.125em 0.5em; border:1px solid var(--color-secondary-icon); border-radius: 0.375rem; background-color: white; } /* 症状・特色タグアイコン */ #feels_text span.icon-text, #other_text span.icon-text { border-color:var(--color-primary); background-color: var(--color-primary-bg); } /* キャッチコピー領域 */ #wrap_catch_copy { position: relative; background-color: var(--color-catchcopy-bg); border-radius:0.375rem; padding: 0.25rem 1.25rem 1.25rem; margin-top: 1.75rem; margin-bottom: 2rem; } #wrap_clinic_detail #wrap_catch_copy h2 { position: relative; background-color: transparent; color:var(--color-catchcopy-text); border-bottom:0px solid transparent; font-size:1.375rem; font-size: clamp(1.125rem calc(1.125rem + 0.25vw), 1.375rem); margin-top: 0; padding-top: 1.375rem; padding-bottom: 1.375rem; } @media screen and (max-width:767.99px) { #wrap_clinic_detail #wrap_catch_copy h2 { font-size: 1.125rem; } } #wrap_catch_copy h2:before, #wrap_catch_copy h2:after { content:""; display: inline-block; width: 2rem; height: 1.3125rem; position: absolute; background-size: contain; background-repeat: no-repeat; } #wrap_catch_copy h2:before { top:0; left: 0; background-image: url(/customdir/img/icon/doublequot_head.svg); } #wrap_catch_copy h2:after { bottom:0; right: 0; background-image: url(/customdir/img/icon/doublequot_foot.svg); transform: rotate(180deg); } #wrap_catch_copy p { background-color: white; padding: 1.25rem; border-radius:0.25rem; margin-bottom:0; } /* お知らせ・強調表示 */ #wrap_news_a h3 { font-size: 1rem; background-color: transparent; padding-left: 0; padding-right: 0; border-top:1px solid var(--color-mono-blight); border-bottom:none; border-radius: 0; color:var(--color-mono-text2); } #wrap_news_a h3:where(:not(.wp-block-post-title)):after { border-bottom:none; } #wrap_news_a details { display: block; list-style: none; cursor:pointer; border:none; border-top:1px solid var(--color-mono-blight); border-radius: 0; padding: 0; } #wrap_news_a details h3 { border-top:0; } #wrap_news_a details summary:after { content:none; display: none; } #wrap_news_a details:last-of-type { border-bottom:1px solid var(--color-mono-blight); } #wrap_news_a details::-webkit-details-marker { display:none; } #wrap_news_a details h3 { position: relative; background-color: transparent; color:var(--color-mono-text); } #wrap_news_a details h3:after { content:''; position: absolute; top:1em; right:1em; width: 0.75rem; height: 0.75rem; background-image: url(/customdir/img/icon/link_2_news.svg); background-size: contain; transform:rotate(90deg); border:none; } #wrap_news_a details[open] > summary h3:after { transform:rotate(-90deg); } em { font-style: normal; background-color: #ff8; } b { font-weight: bold; } em b { background-color: #ff0; } /* お知らせ強調表示ここまで */ /* クリニック概要 */ h3 { margin-top: 0; } .outline_title_text.row { margin-left: 0; margin-right: 0; } .outline_title_text { display: grid; grid-template-columns: 208px auto; width: 100%; } @media screen and (max-width:767.99px) { .outline_title_text { display: block; } } .outline_title_text h3, .outline_title_text > p, .outline_title_text > div { margin-bottom: 0; padding: 0.5em; line-height: 1.4em; } .outline_title_text > h3 { padding:1.25rem 1.75rem; font-size: 0.875rem; font-weight:normal; background-color: var(--color-primary-bg); border-top:1px solid var(--color-primary); border-bottom:none; border-radius: 0; } .outline_title_text > p, .outline_title_text > div { padding: 1rem 1.5rem; background-color: white; border-top:1px solid var(--color-mono-blight); } .wrap_outline_title_text .outline_title_text:last-of-type > h3 { border-bottom:1px solid var(--color-primary); } .wrap_outline_title_text .outline_title_text:last-of-type > p { border-bottom:1px solid var(--color-mono-blight); } @media screen and (max-width:767.99px) { .outline_title_text > p, .outline_title_text > div { padding:0.75rem; border-top:0 solid transparent; } .outline_title_text > h3, .wrap_outline_title_text .outline_title_text:last-of-type > h3 { padding:0.5rem; border-bottom:0 solid transparent; } } .outline_title_text > p > span { display: block; } .outline_title_text a { color:var(--color-primary-text); text-decoration: underline; } dt { border-top:1px solid #ccc; } dd + dt { margin-top: 2em; } /* 診療時間 */ #wrap_timetable dl { display: flex; flex-wrap: wrap; align-items: stretch; width: 100%; } #wrap_timetable dt { font-weight: normal; width: 4em; border-top: 0; margin-top: 0; } #wrap_timetable dt:empty { display: none; margin-bottom: 0; } #wrap_timetable dd { width: calc(100% - 4em); margin-bottom: .5em; } #wrap_timetable dt:empty + dd { width:100%; } /* WEBサイトURL */ div[data-group="website_url"] a { word-break: break-all; } p.wrap_url a { display: inline-block;; line-height: 2.25rem; } @media screen and (max-width:767.99px) { p.wrap_url a { padding:1.125rem 0; line-height: 1; } } /* 2025.4.4 診療時間も何も無い場合は注意書きを掲載する */ #ask_schedule { border: 1px solid var(--color-secondary-icon); margin-top: 1rem; margin-bottom: 2.5rem; padding: 1.25rem; border-radius: 0.375rem; } @media screen and (max-width:767.99px) { #wrap_clinic_detail h2#h2_outline { margin-top: 1.25rem; margin-bottom: 2.25rem; } #ask_schedule { margin-bottom: 2.25rem; font-size: 1rem; } } /* 以下は主に有料契約クリニックコンテンツ */ /* 医師紹介 */ #doctors > div { /* border-top: 1px solid #ccc;*/ padding-top: 0.5rem; } .wrap_doctor_img_info { display: grid; grid-template-columns: 33% 66%; grid-column-gap: 0.625rem; } @media screen and (max-width:767.99px) { .wrap_doctor_img_info { display: block; } } #doctors div.doctor_prof, #wrap_c_doctor div.row div.col-md-9, #wrap_i_doctor div.row div.col-md-9 { border:1px solid var(--color-mono-blight); border-radius:0.25rem; } #doctors h3, #wrap_c_doctor h3, #wrap_i_doctor h3 { font-size: 1rem; background-color: transparent; border-bottom:1px solid var(--color-secondary-border); border-radius:0; padding:1em 0.5em; margin-bottom:0; } .doctor_prof h3 { margin-top: 0; color:var(--color-mono-text2); } #doctors h3:where(:not(.wp-block-post-title)):after { border-bottom: none; } #doctors ul, #wrap_c_doctor ul, #wrap_i_doctor ul { font-size: 0.875rem; padding: 1.25rem; margin:0; } #doctors ul li, #wrap_c_doctor ul li, #wrap_i_doctor ul li { list-style: none; list-style-position: outside; } #doctors i, #wrap_c_doctor i, #wrap_i_doctor i { font-style: normal; /* margin-right: 1em;*/ color:var(--color-mono-middle); } /* よくある質問（FAQ）*/ #wrap_faq i { display: inline-block; width: 1.875rem; height: 1.875rem; padding-left: 0.625rem; padding-right: 0.625rem; border-radius:0.375rem; font-style: normal; font-weight:bold; margin-right: 0.75rem; color:white; } #wrap_faq dt i { background-color: var(--color-faq-q-bg); } #wrap_faq dd i { background-color: var(--color-faq-a-bg); } #wrap_faq dt, #wrap_faq dd { line-height: 1.875rem; margin-bottom: 0.625rem; } #wrap_faq dt { padding-top:1.25rem; } #wrap_faq dd + dt { margin-top: 0; } #wrap_faq dd { margin-bottom: 0; padding-bottom: 1.25rem; } #wrap_faq dd:last-of-type { border-bottom:1px solid var(--color-mono-blight); } /* 電話・予約・問診ボタン お知らせ移動ボタン */ /* お知らせ末尾のダウンロード・リンクボタン */ /* 領域レイアウト */ .fix-bottom { padding-top: 0.625rem; padding-bottom: 0.625rem; } /* 2025.2.26 WEB予約フォーム＋ボタンに対応 */ /* .conversion_navs_inner form, .conversion_navs_inner button { display:inline-block; }*/ #head_conversion_navs .conversion_navs_inner { display: grid; } #head_conversion_navs .conversion_navs_inner > a, #head_conversion_navs .conversion_navs_inner > form { display: block; width: 100%; } #foot_conversion_navs { padding: 0.625rem 1rem; } #foot_conversion_navs .conversion_navs_inner { display: grid; justify-items: center; align-items: center; width:100%; max-width: 736px; margin: 0 auto; /* padding: 0 1rem;*/ } .conversion_navs_inner.items_1 { grid-template-columns: 100%;} .conversion_navs_inner.items_2 { grid-template-columns: 1fr 1fr; grid-column-gap: 0.625rem; } .conversion_navs_inner.items_3 { grid-template-columns: 1fr 1fr 1fr; grid-column-gap: 0.625rem; } @media screen and (max-width:767.99px) { #foot_conversion_navs { display: grid; grid-template-columns: 1fr 2.75rem; grid-column-gap: 0.625rem; height: 3.75rem; } #wrap_spec_icons, #head_conversion_navs { margin-bottom: 1rem; } #foot_conversion_navs .conversion_navs_inner { font-size: 0.875rem; } } #head_conversion_navs a, .conversion_navs_inner a, .conversion_navs_inner button, #wrap_jump_2_news a, a.link_from_news { /* min-height: 36px;*/ line-height: 36px; margin-left: 0.25rem; margin-right: 0.25rem; padding: 0; background-color: white; border-radius: 100vw; min-height: 2.45rem; } .conversion_navs_inner a, .conversion_navs_inner button, #wrap_jump_2_news a, a.link_from_news { margin-left: 0.25rem; margin-right: 0.25rem; } #head_conversion_navs a, #head_conversion_navs button { /* width: calc((100% - (0.625rem * 2)) / 3);*/ width: 100%; margin-left: 0; margin-right: 0.625rem; } #head_conversion_navs a:last-of-type, #head_conversion_navs button:last-of-type { margin-right: 0; } .conversion_navs_inner a, .conversion_navs_inner button { width: 100%; } #wrap_jump_2_news a, a.link_from_news { width: 100%; margin-left: 0; margin-right: 0; } a.link_from_news { position: relative; width: 13em; max-width: 75%; } /* 電話等ボタン お知らせ末尾アクション */ #head_conversion_navs a, #head_conversion_navs button, #foot_conversion_navs .conversion_navs_inner a, #foot_conversion_navs .conversion_navs_inner button, a.link_from_news { color:var(--color-accent); border:0.125rem solid var(--color-accent); padding-top: 0.375em; padding-bottom: 0.375em; } @media screen and (max-width:991.99px) { #head_conversion_navs a, #head_conversion_navs button, #foot_conversion_navs .conversion_navs_inner a, #foot_conversion_navs .conversion_navs_inner button, a.link_from_news { padding: 0; } } /* お知らせ末尾アクションボタン 文字色 */ a.btn.link_from_news:hover, a.btn.link_from_news:active, a.btn.link_from_news:visited { color:var(--color-accent); } /* お知らせ移動ボタン */ #wrap_jump_2_news a { position: relative; color:var(--color-secondary-nav); border:0.125rem solid var(--color-secondary-nav); padding-top: 0.375em; padding-bottom: 0.375em; font-size:clamp(0.875rem, calc(0.875rem + 0.125vw), 1.25rem); font-weight: bold; } @media screen and (max-width:991.99px) { #wrap_jump_2_news a { padding: 0; } } @media screen and (max-width:767.99px) { #wrap_jump_2_news a { font-size: 0.875rem; width: 50%; display: block; margin: 0 auto; } } /* お知らせ移動ボタン アイコン */ #wrap_jump_2_news a:after { content:''; position: absolute; top:50%; margin-top: -0.375em; right:1em; width: 0.75rem; height: 0.75rem; background-image: url(/customdir/img/icon/link_2_news.svg); background-size: contain; transform:rotate(90deg); } /* お知らせ末尾のアクションボタン アイコン */ a.link_from_news:after { content: url(/customdir/img/icon/link-pink.svg); width: 0.75em; position: absolute; right: 0.75em; top: 50%; margin-top: -1.0625em; } @media screen and (min-width:768px) and (max-width:991.99px) { a.link_from_news:after { margin-top: -1.125em; } } @media screen and (max-width:767.99px) { a.link_from_news:after { margin-top: -1.325em; } } /* 電話ボタン・お知らせ移動ボタン文字サイズ */ #head_conversion_navs a, .conversion_navs_inner a, .conversion_navs_inner button, a.link_from_news, #head_conversion_navs a.tel span.d-inline , .conversion_navs_inner a.tel span.d-inline { font-size:clamp(0.875rem, calc(0.875rem + 0.25vw), 1.25rem); font-weight: bold; } @media screen and (max-width:767.99px) { #head_conversion_navs a, .conversion_navs_inner a, .conversion_navs_inner button, a.link_from_news, #head_conversion_navs a.tel span.d-inline , .conversion_navs_inner a.tel span.d-inline { font-size: 0.875rem; } } /* 電話ボタン */ #head_conversion_navs a.tel, .conversion_navs_inner a.tel { position: relative; z-index: 2; text-indent: 0.75em; } #head_conversion_navs a.tel span.d-md-inline , .conversion_navs_inner a.tel span.d-md-inline { font-size:clamp(0.875rem, calc(0.875rem + 0.125vw), 1.25rem); } /* 電話ボタン 受話器アイコン */ #head_conversion_navs a.tel:before, .conversion_navs_inner a.tel:before { content:''; position: absolute; top: 50%; margin-top: -0.625em; left: 1rem; width: 1.5rem; height: 1.5rem; background-image: url(/customdir/img/icon/phone.svg); background-size: contain; } @media screen and (max-width:767.99px) { #head_conversion_navs a.tel:before, .conversion_navs_inner a.tel:before { /* top: 0.75rem;*/ /* margin-top: -0.5em;*/ left: 0.625rem; width: 1.25rem; height: 1.25rem; } } /* #foot_conversion_navs a.tel { font-size:0.75rem; } @media screen and (max-width:767.99px) { #head_conversion_navs a.tel, #foot_conversion_navs a.tel { font-size:1rem; } } */ .outline_title_text.row { margin-left: 0; margin-right: 0; } /* クリニック画像ギャラリー */ #wrap_clinic_img div { display: flex; column-gap:1rem; row-gap:1rem; flex-wrap: wrap; } #wrap_clinic_img div div { aspect-ratio: 6 / 4; width: calc(25% - 0.75rem); overflow: hidden; } #wrap_clinic_img img { object-fit: cover; min-width: 100%; min-height: 100%; cursor:pointer; } @media screen and (max-width: 767.99px) { #wrap_clinic_img div div { aspect-ratio: 6 / 4; width: calc(50% - 0.5rem); } } /* ギャラリー拡大表示 */ #wrap_img_modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 10000; display: grid; justify-items: center; align-items: center; background-color: rgba(153,153,153,0.5); } #wrap_img_modal_inner { display: flex; justify-content: center; align-items: center; position: relative; width: 90vmin; height: 90vmin; padding: 5vmin; } #wrap_img_modal_inner img { object-fit: contain; margin: auto; display: block; } #wrap_img_modal_inner p { position: absolute; bottom:0; width: 80vmin; height: 5vmin; line-height: 5vmin; font-size:2.5vmin; border-radius: 2.5vmin; color:#fff; background-color: #555; text-align: center; } #wrap_img_modal_inner button { position: absolute; top:0; left:80vmin; z-index: 10010; border-radius: 50%; background-color: #fff; } /* 診療時間 */ #timetable { display: none; } #timetable, #timetable_sp { width: 100%; } #timetable th, #timetable_sp th { text-align:center; vertical-align: middle; font-size:clamp(0.75rem, calc(0.75rem + 0.3vw), 1rem); } #timetable td, #timetable_sp td { text-align:center; vertical-align: middle; font-size: clamp(1rem, calc(1rem + 1vw), 2.25rem); } #timetable th, #timetable td { padding: 0.5em 0; width:calc(100% / 9); } #timetable_sp {display: table;} #timetable_sp th { padding: 0.5em 0; } #timetable_sp td { padding: 1em 0; } #timetable tr > th:first-of-type { max-width: 3.3em; } #timetable_sp th { max-width: 2.5em; } #timetable_sp tr:first-of-type { background-color: var(--color-mono-offwhite); } #timetable_sp td { color:var(--color-primary); } #timetable_head + div dl { margin-top: 1rem; margin-bottom: 0; } @media screen and (max-width:991.99px) { #timetable { display: none; /* writing-mode: vertical-lr;*/ } #timetable_sp { display: table; } } /* スマホ向け設定 */ @media screen and (max-width:767.99px) { #timetable { writing-mode: vertical-lr; } /* #timetable tr { display: grid; grid-template-columns: 1fr 1fr 1fr; } */ #timetable th, #timetable td { min-height:3.6em; } #timetable th span { display: block; writing-mode: vertical-lr; } #timetable td span { display: block; writing-mode: horizontal-tb; } } @media screen and (max-width:767.99px) { .wrap_bottom_items, .status_user_inputs { display: block; } } @media screen and (max-width:499.99px) { .fix-bottom { width: 100%; } } #wrap_map { position: relative; padding-bottom: 100vmin; height: 0; overflow: hidden; } #wrap_map iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100vmin; } /* plot custom pin */ /* 2025.1.10 フッター固定バーの高さを差し引く */ #map_canvas { width: 100%; height: calc(100vmin - 74px - 72px); } @media screen and (max-width:1199.99px) { #map_canvas { height: calc(100vmin - 38px - 72px); } } @media screen and (max-width:767.99px) { #map_canvas { height: calc(100vmin); } } /* 2025.1.7 GoogleMapsバルーンの高さ確保 */ #map_canvas .gm-style-iw-c { min-height: 4.95rem; } /* ボタン */ button.btn[data-toggle] { border-width:0px; border-color:transparent; border-radius: 1rem; font-weight: bold; margin: 4px; color: #555; } button.btn[data-toggle]:focus, button.btn[data-toggle]:hover, button.btn[data-toggle]:active { outline:none !important; box-shadow: none !important; color: #555 !important; background-color: transparent !important; } /* ボタンアイコン（キーワードリスト） */ #feels_text span.btn, #other_text span.btn { cursor: default !important; } #tel_header { display: block; text-align: center; font-size: 1.13rem; } /* キャッチコピー見出しのみ表示を変える */ #wrap_catch_copy h2 { position: relative; z-index: 2; padding: 0.625rem; margin: 0.625rem 0; border-radius: 0.625rem; background-color: #555; color:#fff; } #wrap_catch_copy h2:after { content: ''; border: 0 solid transparent; } /* ページの先頭に戻るボタン */ #page_top, #page_top_sp { display: none; } @media screen and (max-width:767.99px) { #page_top_sp { display: block; padding: 0.5rem; border: 1px solid var(--color-mono-blight); border-radius: 0.875rem; background-color: white; outline: none; box-shadow: none; } #page_top_sp img { width: 0.75rem; } #page_top_sp:focus { outline: none; box-shadow: none; } } /* 末尾の注意文 */ #detail_footer { font-size: 0.75rem; color: var(--color-mono-middle); } /* 紹介先医療機関 */ /* リストマーク色変更 */ #reference_main li { list-style-type: none; position: relative; padding-left: 0.5em; } #reference_main li:before { content: ""; position: absolute; left: 0; top:50%; width: 0.375rem; height: 0.375rem; margin-left: -0.1875rem; margin-top: -0.1875rem; border-radius: 50%; background-color: var(--color-primary-text) ; } /* 2025.2.27 エラーメッセージ */ small.error { color:var(--color-accent-text); } /* クリニック未公開 or なし */ .not_found { padding-top: 2.5rem; color: var(--color-accent-text); } .search_navs { padding-bottom: 0; } .search_navs a { color: var(--color-primary-text); text-decoration: underline; } @media screen and (max-width: 767.99px) { .search_navs { padding-bottom: 0.5rem; } .search_navs a { display: inline-block; vertical-align: middle; margin-right: 1rem; margin-top: 0.5rem; min-width: 3rem; min-height: 3rem; line-height: 3rem; box-sizing: border-box; } }