/* @import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css); */ .weight100 { font-weight: 100; } .weight300 { font-weight: 300; } .weight400 { font-weight: 400; } .weight500 { font-weight: 500; } .weight600 { font-weight: 600; } .weight700 { font-weight: 700; } .weight900 { font-weight: 900; } @media screen and (max-width:575.99px) { .d-xs-none {display:none !important;} } @media screen and (max-width:576px) { .d-sm-inline {display:none !important;} } @media screen and (min-width:768px) { .d-md-inline {display:inline !important;} } @media screen and (min-width:992px) { .d-lg-inline {display:inline !important;} } @media screen and (min-width:1200px) { .d-xl-inline {display:inline !important;} } :root { font-size: 16px; /* 基本配色 */ --color-kk-dark-blue: #4CA0D0; --color-kk-pale-blue: #E5F4FC; --color-kk-light-blue: #7CC7F1; --color-kk-vivid-orange: #EA7B5A; --color-kk-light-orange: #F29174; --color-kk-white: #F4F4F4; --color-kk-pink: #F274A4; --color-kk-light-indigo: #78D8CD; --color-line-bg: #F2FBFA; --color-primary: #7CC7F1; --color-primary-bg: #E5F3FC; --color-primary-headline-bg: #4CA0CF; --color-primary-text: #5A9CC1; --color-primary-text-blight: #629FC1; --color-primary-textlink: #2E5D7A; --color-primary-headline-text: #377295; --color-primary-gradient: #7CC7F1; --color-secondary-gradient: #78D8CD; --color-secondary-border: #78D8CD; --color-secondary-icon: #78D8CD; --color-secondary: #56CFC3; --color-secondary-bg: #F4FDFC; --color-secondary-bg2: #eaf2f0; --color-secondary-nav: #29C6B4; --color-secondary-nav-hover: #4fe2d0; --color-accent: #F274A4; --color-accent-bg: #FFF0F6; --color-accent-text: #D24248; --color-accent-hover: #ff8ebf; --color-accent-rgb: 242, 116, 164; --color-accent-rgba: 242, 116, 164, 0.25; /* LINEへのリンク（WEBサービス名、線ではない） */ --color-line: #00B901; --color-tertiary-headline-bg: #F39174; /* 検索結果、クリニックLP */ --color-catchcopy-blight: #F8BC77; --color-catchcopy-text: #F58210; --color-catchcopy-bg: #FCF7E1; --color-clinic-headline-bg: #DDF5F3; --color-clinic-headline-text: #4CA0D0; --color-faq-q-bg: #7CC7F1; --color-faq-a-bg: #F59ABD; --color-mono-offwhite: #F2F2F2; --color-mono-blight: #DCDCDC; --color-mono-middle: #808080; --color-mono-dark:#555555; --color-mono-text:#222222; --color-mono-text2:#333333; --color-mono-icon-end:#B5B5B5; --color-map-canvas-bg:#D9D9D9; /* 有料契約クリニック配色 */ --color-premium-bg: #FCF7E1; --color-premium-gradient-start: #E5B020; --color-premium-gradient-end: #EDDA6F; --color-premium-before-gradient-start: #BAB54F; --color-premium-before-gradient-end: #E0E0A4; --color-silver-gradient-start: #818D8B; --color-silver-gradient-end: #D4E0DE; --color-silver-bg-gradient-start: #f5faf9; --color-silver-bg-gradient-end: #e1edeb; --color-premium-text: #817d32; --color-silver-text: #555e5c; /* 上部・下部余白 */ --blank-50px: 3.125rem; /* PC */ --blank-20px: 1.25rem; /* SP */ } body, input, select, textarea, button, pre { /* font-family:"Noto Sans JP", 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif */ font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } /* --- 親テーマ対策 --- */ /* テーマクレジット非表示 */ .container.sectionBox.copySection.text-center p:nth-child(2), .container.site-footer-copyright p:nth-child(2) { display:none; } /* メニューアイコンのスクロール追従を無効にする */ .vk-mobile-nav-menu-btn { position: absolute; } /* メニュー非表示 */ .vk-mobile-nav-menu-btn, #main-navigation { display:none; } /* ReCaptureアイコン非表示 */ .grecaptcha-badge { visibility: hidden; } /* --- 親テーマ対策ここまで --- */ /* 全体レイアウト・配色 */ footer, .sitefooter { border-top: none; background-color: white; } footer .widget ul, .siteFooter .widget ul { background-color: var(--color-primary-bg); } /* ロゴ・キャッチコピー */ #site-header h1 a, #site-header h1 img, div.site-header-logo a, div.site-header-logo img { display: inline-block !important; vertical-align: middle; } #catchcopy { max-width: 351px; /* max-height:27px;*/ margin-left: 1rem; } @media screen and (max-width: 767.99px) { #catchcopy { margin-left: 0; } } /* 上部ナビ */ #site-header-container { display: grid; grid-template-columns: 1fr 400px; } .header_scrolled #site-header-container { display: block; } .header_scrolled #wrap_header_nav { text-align: center; } .header_scrolled .site-header { will-change: transform; } @keyframes header_drop_ { 0% { /* top: -63px*/ transform:translateY(-63px); } 100% { /* top: 0*/ transform:translateY(0px); } } @keyframes header_drop_admin_ { 0% { /* top: -31px*/ transform:translateY(-31px); } 100% { /* top: 32px*/ transform:translateY(32px); } } .header_scrolled .site-header { animation: header_drop_ .5s ease-out 0s 1 alternate none running } .header_scrolled.admin-bar .site-header { animation: header_drop_admin_ .5s ease-out 0s 1 alternate none running } @media screen and (max-width: 1199.99px) { #catchcopy { margin-left: 0; } } @media screen and (max-width: 767.99px) { header { height: 100px; } #site-header-container { display: block; } } /* 共通UI 配色 */ a.btn.btn_link, button.btn.btn_send, button.btn.btn_send:hover, button.btn.btn_send:active, .wrap_bottom_items button.btn, .wrap_bottom_items button.btn:hover, .wrap_bottom_items button.btn:active, #wrap_submit_buttons button, #wrap_submit_buttons input[type=submit], #wrap_submit_buttons input[type=button], .submit_buttons button, .submit_buttons input[type=submit], .submit_buttons input[type=button] { border: none; /* border-radius: 1.5em;*/ border-radius: 100vw; background-color: var(--color-accent); color: #fff; font-weight: bold; outline: none; cursor: pointer; } #wrap_submit_buttons button, #wrap_submit_buttons input[type=submit], #wrap_submit_buttons input[type=button], .submit_buttons button, .submit_buttons input[type=submit], .submit_buttons input[type=button] { padding: 0.75em 2em; margin-bottom: 1rem; font-size: 1rem; } #wrap_submit_buttons button.mono, #wrap_submit_buttons input[type=submit].mono, #wrap_submit_buttons input[type=button].mono, .submit_buttons button.mono, .submit_buttons input[type=submit].mono, .submit_buttons input[type=button].mono { background-color: var(--color-mono-middle); } #wrap_submit_buttons { margin-top: 1rem; } #wrap_submit_buttons > span { /* contact form 読込中表示の位置 */ display: block; margin: 0 auto; text-align: center; } #wrap_submit_buttons br { display: none; line-height: 0; } @media screen and (max-width: 767.99px) { #wrap_submit_buttons button, #wrap_submit_buttons input[type=submit], #wrap_submit_buttons input[type=button] { padding-left: 0; padding-right: 0; width: calc(49.5% - 0.5rem); margin-bottom: 1rem; } #wrap_submit_buttons button:nth-of-type(2n), #wrap_submit_buttons input[type=submit]:nth-of-type(2n), #wrap_submit_buttons input[type=button]:nth-of-type(2n) { margin-left: 1rem; } } .fix-bottom { background-color: rgba(var(--color-accent-rgba)) !important; } button.btn[data-toggle] { border-width: 0px; border-color: transparent; border-radius: 1rem; font-weight: normal; margin: 0 0.25rem; padding: 0.25rem 0.75rem; color: var(--color-mono-dark); } @media screen and (max-width: 767.99px) { button.btn[data-toggle] { margin: 0 0.125rem; } } button.btn[data-toggle]:focus, button.btn[data-toggle]:hover, button.btn[data-toggle]:active { outline: none !important; box-shadow: none !important; color: var(--color-mono-dark) !important; background-color: transparent !important; } button:hover, button.btn:hover, input[type=submit]:hover, input[type=button]:hover, a.link_clinic_detail:hover, header a:hover { opacity: 0.66; } p.include_buttons { padding-top: 0.33rem; } @media screen and (max-width: 767.99px) { p.include_buttons { padding-left: 0.125rem; padding-right: 0.125rem; } } ::placeholder { color:var(--color-mono-icon-end); } /* 背景色・レイアウト・余白 */ #wrap_ui_a_b { position: relative; background-color: var(--color-primary-bg); } #wrap_ui_another { background-color: var(--color-secondary-bg); padding-bottom: 2.5rem; padding-top:1.125rem; } #wrap_footer_another_navs { background-color: var(--color-primary-bg) !important; } footer, .siteFooter { background-color: var(--color-primary) !important; } footer div.copySection { color: white; padding-bottom: 72px; } /* 見出し共通 */ h2, .without_top h1 { font-size: clamp(1.125rem, 1.125rem + 0.5vw, 1.625rem); padding-left: 1.1em; font-weight: bold; margin-top: 0; margin-bottom: 0.625rem; padding-top: 0.625rem; border-top-width: 0; border-top-color: transparent; border-bottom-width: 0; border-bottom-color: transparent; } h3, .without_top h2 { background-color: var(--color-clinic-headline-bg); color: var(--color-clinic-headline-text); font-size: clamp(1rem, 1rem + 0.5vw, 1.25rem); border: none; border-radius: 0.375rem; padding: 1.25rem; margin-top: 2rem; margin-bottom: 0.625rem; } /* #wrap_ui_toggles h3, .without_top #wrap_ui_toggles h2 */ #wrap_ui_toggles h2 { font-size: clamp(1rem, 1rem + 0.5vw, 1.125rem); padding: 0.6875rem 0 1.25rem 1.25rem; } @media screen and (max-width:767.99px) { #wrap_ui_toggles h2 { font-size: 0.875rem; padding: 0.3125rem 0 0.4375rem; } } h4, .without_top 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; } /* Lightning見出し装飾無効化 */ .entry-body h3:after, .wrap_main_contents h3:after { content: ""; border-bottom: none; } /* 個別UI配色 */ /* 見出し装飾 */ #wrap_ui_another h2:before { content: "■"; font-size: 0.875rem; display: inline-block; color: var(--color-accent); margin-right: 0.25em; position: relative; top: -2px; } #page_top { display: none; } header nav li { min-width: 10em; } summary { cursor: pointer; } /* テーブル */ table th, table td { border: 1px solid var(--color-mono-blight); } /* 各種フォーム */ form table th { 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-radius: 0; } form table td { margin-bottom: 0; line-height: 1.4em; padding: 1rem 1.5rem; background-color: white; border-top: 1px solid var(--color-mono-blight); } @media screen and (max-width: 767.99px) { form table th, form table td { display: block; } form table th { padding: 0.5rem; border-bottom: 0 solid transparent; text-align: left; } form table th p { margin: 0; padding: 0; } form table td { padding: 0.75rem; border-top: 0 solid transparent; } } /* PC・タブレット向け設定 */ .full-width { margin: 0 calc(50% - 50vw); padding: 0 calc(50vw - 50%); } .container-width { max-width: 1140px; } .wrap_main_contents { background-color: var(--color-primary-bg); padding-top: 2.5rem; padding-bottom: 3.75rem; } .member_only .wrap_main_contents { background-color: var(--color-secondary-bg2); } .wrap_main_contents_inner { background-color: white; width: calc(100% - 2rem); margin-left: 1rem; margin-right: 1rem; padding-left: 1.25rem; padding-right: 1.25rem; padding-bottom: 2.5rem; border-radius: 0.375rem; } .wrap_main_contents_inner h2 { padding-left: 0; color: var(--color-primary-headline-text); } /* トップページ以外 */ .without_top .wrap_main_contents_inner h2 { padding-left: 0.5rem; } .without_top .wrap_main_contents h1 { padding-left: 0; } #footer_links_pref { position: relative; /* background-image: url(/customdir/img/bg_area.png); background-size: contain; background-repeat: no-repeat; background-position: center; */ } #footer_links_pref #bg_area { position: absolute; z-index: 0; top:0; left: calc(50% - 166.25px); } /* スマホ向け設定 */ @media screen and (max-width: 767.99px) { #wrap_ui_a_b:after { display: none; } } /* 段落ヘッダー記号追加 */ .add_attention_mark:before { content:"※"; color: var(--color-accent); display: inline; margin-right: 0.375em; } /* 画像配置 */ .img_cover { object-fit:cover; } .img_contain { object-fit:contain; } .img_scale_down { object-fit:scale-down; } /* --- 共通CSS引用ここまで ---------------------------------- */ /* 以下トップ・検索結果ページ用 */ .siteHeader { height: 72px; } .siteContent { padding-top: 0; } .site-body { padding-top: 0; } .siteContent div.widget { display: none; } .fix-bottom { display: block; position: fixed; bottom: 0; left: 0; width: 100%; height: 72px; padding: 15px 0; z-index: 1000; background-color: rgba(204, 204, 204, 0.5019607843); } #wrap_ui { display: block; margin: 0 auto; max-width: 1000px; } #wrap_ui h2 { padding-left: 0; } @media screen and (max-width: 767.99px) { #wrap_ui h2 { padding-top: 0.25rem; } } #wrap_ui_a_b { grid-row: 1/2; padding-top: 2rem; padding-bottom: 2rem; } #wrap_ui_date, #wrap_ui_a { border-radius: 1rem; padding-left: 0; padding-right: 0; } #wrap_ui_a { max-width: 1000px; margin: 0 auto; } #wrap_ui_d { grid-row: 1/2; /* grid-column:2/3;*/ } #wrap_contents_nav { grid-row: 2/3; /* grid-column:1/3;*/ } #wrap_ui_c { grid-row: 3/4; /* grid-column:1/3;*/ } /* 場所で探す全体 */ #wrap_ui_a { position: relative; z-index: 999; background-color: white; } /* --------------------------------------------------------------------- */ /* 場所で探す エリア #wrap_ui_area { display: grid; grid-template-columns: 200px auto 240px; grid-template-rows: 1fr 1fr; grid-gap: 10px; padding: 2rem 2rem 0.875rem; } 注目のキーワード #hot_keywords { padding: 0 2rem 2rem; } @media screen and (max-width: 767.99px) { #wrap_ui_area { grid-template-columns: 1fr 2fr; grid-gap: 4px; padding: 0.875rem; } #hot_keywords { padding: 0 0.875rem 0.875rem; } } */ #wrap_ui_area_inputs { /* エリア入力囲み */ grid-column: 1/3; grid-row: 1/2; } #wrap_ui_pref_area { /* エリア・都道府県 */ grid-column: 1/2; grid-row: 1/2; } #wrap_ui_city { /* エリア・市区町村 */ grid-column: 2/3; grid-row: 1/2; } #ui_keyword { /* エリア・フリーワード */ grid-column: 1/3; grid-row: 2/3; } #btn_2_map_f_area { /* エリア・地図ボタン */ grid-column: 3/4; grid-row: 1/2; } #btn_2_list_f_area { /* エリア・リストボタン */ grid-column: 3/4; grid-row: 2/3; } /* --------------------------------------------------------------------- */ /* 場所で探す 路線 */ #wrap_ui_rail { display: grid; grid-template-columns: 7em 1fr 1fr 240px; grid-template-rows: 1fr 1fr; grid-gap: 10px; padding: 2rem; } #w_ui_pref_rail { /* 路線駅・都道府県 */ grid-column: 1/2; grid-row: 1/2; } #w_ui_rail { /* 路線駅・路線 */ grid-column: 2/3; grid-row: 1/2; } #w_ui_station { /* 路線駅・駅 */ grid-column: 3/4; grid-row: 1/2; } #ui_keyword_rail { /* 路線駅・フリーワード */ grid-column: 1/4; grid-row: 2/3; } #btn_2_map_f_rail { /* 路線駅・地図ボタン */ grid-column: 4/5; grid-row: 1/2; } #btn_2_list_f_rail { /* 路線駅・リストボタン */ grid-column: 4/5; grid-row: 2/3; } @media screen and (max-width: 767.99px) { #wrap_ui_rail { grid-gap: 4px; padding: 0.875rem; grid-template-columns: 1fr 2fr; grid-template-rows: 1fr 1fr 1fr; } #w_ui_rail { /* 路線駅・路線 */ grid-column: 2/3; grid-row: 1/2; } #w_ui_station { /* 路線駅・駅 */ grid-column: 1/3; grid-row: 2/3; } #ui_keyword_rail { /* 路線駅・フリーワード */ grid-column: 1/3; grid-row: 3/4; } #btn_2_map_f_rail, #btn_2_list_f_rail { grid-column: 1/2; grid-row: 3/4; display: none; } } /* --------------------------------------------------------------------- */ .ui_group_place button { border: 1px solid #999; } #wrap_ui_feel { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 0.6rem; } .action_ui_logout { display: grid; grid-template-columns: 1fr 1fr; -moz-column-gap: 0.5rem; column-gap: 0.5rem; } .action_ui_login { display: grid; grid-template-columns: 1fr 1fr; -moz-column-gap: 0.5rem; column-gap: 0.5rem; } #search_clinic_form { width: 100%; max-width: 30em; margin: 0 auto; } @media screen and (max-width: 767.99px) { #search_clinic_form { width: calc(100% - 0.75rem); } } #search_clinic_form, .wrap_bottom_items, .action_ui_login, .action_ui_logout { height: 100%; } .action_ui_logout button { width: 100%; } .action_ui_login button { font-size: 0.774rem; } img.icon { width: 1em; aspect-ratio: 1/1; } img.icon_s { width: 0.75em; aspect-ratio: 1/1; } details { position: relative; border: 0.0625rem solid #6c757d; border-radius: 0.25rem; padding: 0.375rem 0.75rem; } summary { position: relative; display: block; padding: 0.375rem 0; } summary:after { position: absolute; top: 0.375rem; right: 0.75rem; content: "＋"; font-size: 1rem; } details[open] summary:after { content: "－"; } /* UI group A */ #current_place { margin-bottom: 0; padding: 0 0.75rem; min-height: 36px; line-height: 36px; box-sizing: border-box; } #current_place span { display: inline-block; } #about, #ui_lat { margin-right: 1em; } /* UI group B */ #wrap_ui_b:after { content: ""; display: block; clear: both; } /* UI group C */ #wrap_ui_c h2 span { font-weight: normal; } #wrap_body_map { position: relative; padding-top: 100%; } #wrap_body_map img { position: absolute; top: 0; left: 0; display: block; z-index: 1; } #wrap_body_map button { position: absolute; display: inline-block; z-index: 2; transform: translate(-50%, -50%); border: 1px solid #ccc; } #to_headface { top: 10%; left: 30%; } #to_mouthroat { top: 10%; left: 70%; } #to_upperbody { top: 40%; left: 20%; } #to_lowerbody { top: 70%; left: 25%; } #to_fullbody { top: 70%; left: 75%; } #to_mental { top: 40%; left: 80%; } #wrap_body_map button { font-size: 0.95rem; width: 7em; } #wrap_feel_groups { position: relative; height: 100%; overflow-y: auto; } #wrap_feel_groups_inner { position: absolute; width: 100%; } #wrap_feel_groups_inner details { display: block; width: 100%; } div[data-role=go_results] button { border: 1px solid #666; } div[data-role=go_results] button[disabled] { border: 1px solid #999; } #toggle_feeltype { position: relative; } .toggle_label { display: inline-block; position: absolute; right: 0.5rem; top: 0.4rem; width: 3rem; height: 1.5rem; background: #ccc; border-radius: 1rem; transition: 0.4s; box-sizing: border-box; } .toggle_label:after { content: ""; position: absolute; z-index: 2; right: 1.6rem; top: 0.15rem; width: 1.25rem; height: 1.25rem; /* border-radius: 100%;*/ border-radius: 100vw; background: #fff; box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); transition: 0.4s; } #wrap_other_filter { 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_other_filter_inner { position: relative; width: 90vmin; height: 90vmin; overflow-y: scroll; background-color: #fff; } #wrap_other_filter_inner h3 { font-size: 0.774rem; } #close_filter_ui { position: absolute; right: 0.5rem; top: 0.5rem; z-index: 10001; background-color: #fff; cursor: pointer; } #wrap_filter_card, #wrap_filter_specialty { padding: 0 0.75rem; } /* UI基本設定 */ button, select, input[type=submit], input[type=button], input[type=date], input[type=time], input[type=datetime-local] { min-width: 36px; min-height: 36px; } button.btn[disabled] { border-width: 0; } /* select UI */ .wrap_select, .wrap_date { position: relative; } .wrap_select select, .wrap_main_contents_inner select { margin-bottom: 0; appearance: none; -webkit-appearance: none; -moz-appearance: none; cursor: pointer; background-image: url(/customdir/img/icon/down.svg); background-size: 0.75rem; background-repeat: no-repeat; background-position: calc(100% - 1em) center; } .wrap_select i, .wrap_date i { position: absolute; z-index: -1; width: 0.5rem; height: 0.5rem; border-right: 0.1rem solid #999; border-bottom: 0.1rem solid #999; transform: rotate(45deg); } .wrap_select i { top: 0.875rem; right: 0.875rem; } .wrap_date i { top: 0.7rem; right: 0.6rem; } details button, .include_buttons button, .include_buttons input[type=submit], .include_buttons input[type=button] { margin: 4px; } /* チェックボックス表示ボタン */ .btn.checkbox-ui { border: none !important; } .btn.checkbox-ui:before { content: ""; display: inline-block; margin-right: 0.5em; vertical-align: middle; width: 1em; height: 1em; margin-top: -4px; border-radius: 0.25em; background-color: var(--color-mono-blight); } .btn.checkbox-ui[data-toggle=on]:before { background-color: var(--color-secondary); background-image: url(/customdir/img/icon/check.svg); background-position: center center; background-repeat: no-repeat; background-size: 0.625rem; } button.btn.checkbox-ui, button.btn.checkbox-ui:focus, button.btn.checkbox-ui:hover, button.btn.checkbox-ui:active { outline: none; } /* 共通アコーディオンUI　スマホのみ */ @media screen and (max-width: 767.99px) { div[data-sp_visible=off] { height: 2rem; overflow-y: hidden; } /* 2024.11.18 PageSpeedInsights対策 */ div[data-sp_visible=off] p.include_buttons, div[data-sp_visible=off] div.wrap_feel_category { display: none; } div[data-sp_visible=on] p.include_buttons, div[data-sp_visible=on] div.wrap_feel_category { display: block; } div[data-sp_visible] > h2 { font-size: 0.875rem; position: relative; cursor: pointer; } div[data-sp_visible] > h2:after { position: absolute; top: 0.625rem; right: 0.75rem; font-size: 1rem; } div[data-sp_visible] > h2[data-sp_toggle=off]:after { content: url(/customdir/img/icon/down.svg); width: 0.75em; position: absolute; right: 0; top: 0.375em; } div[data-sp_visible] > h2[data-sp_toggle=on]:after { content: url(/customdir/img/icon/down.svg); width: 0.75em; position: absolute; right: 0; top: 0.375em; transform: rotate(180deg); } } /* コンテンツ領域 */ #wrap_top_contents h2 { border-bottom: 0.1rem solid var(--color-kk-light-blue); padding-bottom: 0; margin-bottom: 1.66rem; } #wrap_top_contents h2 i { font-style: normal; color: var(--color-kk-dark-blue); } @media screen and (max-width: 767.99px) { #wrap_top_contents h2 { font-size: 1rem; margin-left: 1rem; margin-right: 1rem; } } @media screen and (max-width: 767.99px) { #wrap_ui_date { margin-bottom: 0; } #current_place { font-size: 0.875rem; } div.widget.widget_block { margin: 0; } .wrap_sp_2columns { display: grid; grid-template-columns: 1fr 1fr; } .siteHeader { height: 14vmin; max-height: 72px; } .siteFooter { display: none; } .container { padding-left: 0.125rem; padding-right: 0.125rem; } .entry-body .container { padding-bottom: 0; } .wrap_main_contents_inner.container, .entry-body .wrap_main_contents_inner.container { padding-left: 1.25rem; padding-right: 1.25rem; padding-bottom: 1.25rem; } #wrap_ui { grid-template-columns: 1fr; grid-template-rows: auto auto auto auto; } #wrap_ui_a_b { grid-row: 1/2; grid-column: 1/2; } #wrap_ui_c { grid-row: 2/3; grid-column: 1/2; } #wrap_ui_d { grid-row: 3/4; grid-column: 1/2; } #wrap_contents_nav { grid-row: 4/5; grid-column: 1/2; } #wrap_ui_feel { display: block; } #wrap_feel_groups { position: static; height: 100%; overflow-y: visible; } #wrap_feel_groups_inner { position: relative; } .wrap_bottom_items, .status_user_inputs { display: block; } .sm-hide { display: none; } .columns-2 { grid-template-columns: 1fr; max-width: auto; } .columns_2.sm_columns_1 { grid-template-columns: 1fr; } .wrap_search_items { display: grid; grid-template-columns: 33% 67%; justify-items: center; align-items: center; } .wrap_search_items .item_1st img { max-height: 49vmin; } .wrap_search_items .item_1st, .wrap_search_items .item_2nd { height: 50vmin; } .row_summary .item_2nd button { width: calc(100% - 0.75rem); margin: 0.5rem; } #wrap_pickup_doctors, #wrap_clinic_news { display: block; } /* 送信ボタン・スマホ */ .wrap_bottom_items button.btn { font-size: 0.875rem; /* border-radius: 0.875rem;*/ border-radius: 100vw; } } @media screen and (max-width: 767.99px) { /* アコーディオンUI　スマホのみ */ #wrap_ui_another { padding-top: 1rem; } #wrap_ui_toggles, #wrap_ui_keyword { width: calc(100% - 2rem); margin: 0 1rem; padding: 1rem; border-radius: 1rem; background-color: white; box-shadow: 0 0 0.5rem #ccc; } #wrap_ui_toggles > div { border: 1px solid #ccc; border-radius: 0.5rem; margin-bottom: 0.25rem; } #wrap_ui_toggles > div > h2:before { top: 0; } #wrap_ui_toggles > div:last-of-type { margin-bottom: 0; } } #status i { color: #999; } #d_hm, .cointainer input, .cointainer button, .cointainer select, .cointainer textarea { display: inline-block; } /* メイン末尾　お問い合わせボタン */ #link_contact_main_bottom { position: relative; margin-top: 3.25rem; padding: 0.5em 3em; /* border-radius: 1.5em;*/ border-radius: 100vw; font-size: 1rem; font-weight: bold; border: 0.125rem solid var(--color-accent); background-color: transparent; color: var(--color-accent); } #link_contact_main_bottom:after { content: url(/customdir/img/icon/link-pink.svg); width: 0.75em; position: absolute; right: 0.75em; top: 50%; margin-top: -0.75em; } /* 下部固定 ページ上部に戻るボタン（検索・クリニックLP共通） */ #page_top, #page_top_sp { display: none; } @media screen and (max-width: 767.99px) { /* grid-template-columns: 1fr(x numberOfContents) 2.75rem; */ #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; } } /* 独自パンくずリスト */ #wrap_breadcrumb { background-color: white; border-top: 1px solid #ccc; } ul.custom_breadcrumbs { padding: 0.25rem 0; margin: 0 1rem; border: 0px solid transparent; width: calc(100% - 2rem); } ul.custom_breadcrumbs li { position: relative; display: inline-block; list-style: none; margin-top: 0; margin-bottom: 0.25rem; margin-right: 0.25em; padding: 0; } ul.custom_breadcrumbs li a { position: relative; text-decoration: none; margin-right: 0.25em; /* z-index:2;*/ } ul.custom_breadcrumbs li:after { content: "＞"; color: #ccc; } ul.custom_breadcrumbs li:last-child:after { content: none; box-shadow: none; } /* その他設定 */ .map_only { display: none; } .list_only h2 { margin-bottom: 0.5rem; } .section.page-header { display: none; } .section.siteContent { padding-top: 0; } /* テキストアイコン */ i.icon { display: inline-block; font-size: 1em; width: 1em; height: 1em; } /* 読込中（時計型） */ i.icon.loading { position: relative; vertical-align: middle; border:0.0625rem var(--color-mono-icon-end) solid; border-radius: 50%; margin-bottom: 0.125rem; } i.icon.loading:before { content: ''; position: absolute; top: 0; left: calc(0.5em - 0.03125rem); width: 0.0625rem; height: calc(0.5em - 0.03125rem); transform: rotate(0deg); transform-origin: 0% 100%; animation: spClock 1s infinite linear; background-color: var(--color-mono-text2); } @keyframes spClock { from { transform: rotate(0deg); } to { transform: rotate(359deg); } }  .site-header-container { align-items: center; justify-content: center; } #nav_pc_line, #nav_pc_contact { display:inline-block; } header #nav_pc_line:hover, header #nav_pc_contact:hover { opacity: 1; } #nav_pc_line img.for_pc { max-width:188px; max-height:70px; display:inline-block; } #nav_pc_contact img.for_pc { max-width:195px; max-height:70px; display:inline-block; } #nav_pc_line img.for_tablet { max-width:257px; max-height:34px; display: none; } #nav_pc_contact img.for_tablet { max-width:257px; max-height:34px; display: none; } #nav_pc_line { margin-right:0.625rem; } #wrap_nav_main_header_4sp { background-color: white; margin-top: 0 !important; position: sticky; z-index: 1100; } #catchcopy { max-width: 351px; } @media screen and (min-width:992px) and (max-width:1199.99px) { #site-header img#catchcopy {display:none !important;} body.header_scrolled #nav_pc_line img.for_pc, body.header_scrolled #nav_pc_contact img.for_pc { display: none; } body.header_scrolled #nav_pc_line img.for_tablet, body.header_scrolled #nav_pc_contact img.for_tablet { display: inline-block; } } @media screen and (max-width:991.99px) { #site-header-container { display: block; } /* PCヘッダー右のナビ非表示 */ #nav_pc_line, #nav_pc_contact {display:none} /* スマホメイン上部・LINE、掲載希望 */ #nav_main_header_4sp { width: 100%; margin: 0; display: grid; grid-template-columns: 1fr 1fr; grid-column-gap:0.5rem; align-content: center; justify-content: center; padding: 0.5rem 1rem; } #nav_main_header_4sp span { display: block; width: 100%; margin: 0 auto; } #nav_main_header_4sp i { font-style: normal; } #nav_main_header_4sp a { box-sizing: border-box; display: block; width:100%; margin: 0 auto; font-size: 0.875rem; } #nav_main_header_4sp a { line-height: 3em; } #nav_sp_line { color:var(--color-line); border:1px solid var(--color-line); } #nav_sp_contact { color: var(--color-kk-dark-blue); border:1px solid var(--color-kk-dark-blue); } /* 「近くで」の左端消失を抑止 */ /* .site-header-container { overflow: visible; }*/ } @media screen and (max-width:767.99px) { #catchcopy { width: 100%; } }  /* footer contents */ .main-section { margin-bottom: 0; } @media (min-width: 768px) { .site-body { padding-bottom: 0; } } @media (min-width: 992px) { .site-body { padding-bottom: 0; } } footer, .sitefooter, .site-footer { background-color: white; padding-bottom:3.5rem; } footer, .sitefooter, .site-footer, .site-footer-content { border-top: none; } footer .widget ul, .siteFooter .widget ul { background-color: var(--color-primary-bg); } footer .sectionBox, footer .site-footer-content { padding-top:0; padding-bottom: 0; } /* フッターグループ1 */ #wrap_footer_area_navs { display: grid; grid-template-columns: 1fr 3fr; grid-gap:50px; background-color: white; padding-top: 3.125rem; border-top:1px solid var(--color-mono-blight); } /* フッターグループ2 */ #wrap_footer_another_navs { padding-top: 1.5rem; padding-bottom: 1.5rem; background-color: #eee; } #wrap_footer_another_navs a { border-left:1px solid #ccc; padding-left: 0.5em; padding-right: 0.5em; line-height: 2em; } #wrap_footer_another_navs a:first-of-type { border-left:none; padding-left: 0; } footer div.copySection { padding-bottom: 72px; } @media screen and (max-width: 767.99px) { #wrap_footer_another_navs { padding-left: 1rem; padding-right: 1rem; } /* スマホ向けタップターゲット領域確保（フッターリンク） */ #wrap_footer_another_navs a { display: inline-block; vertical-align: middle; min-width: 3rem; min-height: 3rem; line-height: 3rem; margin-right: 1rem; margin-top: 0.5rem; padding: 0; border:none; box-sizing: border-box; } /* #wrap_footer_another_navs a:first-of-type { padding-left: 0; } */ } /* フッターリンク表 */ #wrap_footer_area_navs table, footer .wp-block-table table, .siteFooter .wp-block-table table, footer .wp-block-table th, .siteFooter .wp-block-table th, footer .wp-block-table td, .siteFooter .wp-block-table td { border: 0px solid transparent; } footer .widget ul, .siteFooter .widget ul { list-style:none; list-style-position:outline; padding-left:0; } footer .wp-block-table td a, .siteFooter .wp-block-table td a, footer ul li a, .siteFooter ul li a, footer p a, .siteFooter p a { text-decoration:underline; } footer table, .siteFooter table, footer th, .siteFooter th, footer td, .siteFooter td, footer ul, .siteFooter ul, footer p, .siteFooter p { font-size:0.75rem; } .self-left { justify-self: left; position: relative; top: -1.5rem; } .self-right { justify-self: right; } @media screen and (max-width:767.99px) { .self-left { top: 0; } } #wrap_footer_area_navs table, .footer_area_navs { margin-bottom: 2em; } #wrap_footer_area_navs table td a, #wrap_footer_area_navs p a, .footer_area_navs a { position: relative; z-index: 1; color: var(--color-primary-text); text-decoration: underline; text-shadow: 0 1px 0 white, 1px 0 0 white, 0 -1px 0 white, -1px 0 0 white, 0 0 1px white ; } #wrap_footer_area_navs table td a, .footer_area_navs a, #footer_links_2_capital a { margin-right: 1em; line-height: 2em; } #footer_links_2_capital { text-align: center;; } /* スマホ向けタップターゲット領域確保（下層リスト） */ @media screen and (max-width:767.99px) { #wrap_footer_area_navs table td a, #wrap_footer_area_navs p a, .footer_area_navs a, #footer_links_2_capital a { /* margin-right: 1.5em; line-height: 3em; */ display: inline-block; vertical-align: middle; text-align: center; margin-right: 1rem; margin-top: 0.5rem; min-width: 3rem; min-height: 3rem; line-height: 3rem; box-sizing: border-box; } #footer_links_2_capital { text-align: left; padding: .5rem 1rem; } #footer_links_2_capital span { display: block; } } #wrap_footer_area_navs table th { width: 11em; font-weight: normal; text-align: left; color: var(--color-mono-middle); } @media screen and (max-width:767.99px) { #wrap_footer_area_navs caption { text-align: left; padding-left: 1rem; } #wrap_footer_area_navs caption:before { content: "■"; color: var(--color-accent); } footer div.copySection { padding-bottom: 0; } #wrap_footer_area_navs { display: block; } #wrap_footer_area_navs th, #wrap_footer_area_navs td { display: block; text-align: left; } #wrap_footer_area_navs th { border: none; padding-bottom: 0; width: 100%; } #wrap_footer_area_navs td { border: none; padding-top: 0; padding-left: calc(1rem + 1em); } #wrap_footer_area_navs table:last-of-type { margin-bottom: 0; } } @media screen and (max-width: 767.99px) { #wrap_footer_area_navs .self-left { text-align: center; } #wrap_footer_area_navs .self-left img { width:50%; max-width:220px; } .main-section { margin-bottom: 0; } .site-body { padding-bottom: 0; } #wrap_footer_area_navs { padding-top: 0.5rem; padding-bottom: 0.5rem; } } #wrap_footer_area_links { position: relative; display: block; background-color: white; border-radius: 0.375rem; font-size: 0.75rem; height: auto; max-height: 4rem; overflow-y: hidden; margin-bottom: 2.625rem; } #view_all_footer_links { display: inline-block; position: absolute; bottom: 0; right:0; z-index: 1; padding: 0.25em 0.5em; border-top-left-radius: 0.375rem; box-shadow: -0.125rem -0.125rem 0.375rem #00000030; background-color: white; cursor: pointer; } /* 2024.12.4 tableタグを別のタグに変更 */ .footer_area_navs { display: grid; grid-template-columns: 11em 1fr; } @media screen and (max-width: 767.99px) { .footer_area_navs { display: block; margin-bottom: 0; } } #wrap_footer_area_navs h2.footer_links_header, .footer_area_navs h3 { font-size: 0.75rem; font-weight: normal; margin: 0; color: var(--color-mono); background-color: transparent; border-radius: 0; } #wrap_footer_area_navs h2.footer_links_header { text-align: center; } .footer_area_navs h3 { line-height: 1.9em; color: var(--color-mono-middle); border-bottom: 0 solid transparent; } .footer_area_navs h3:after { content:none; } .footer_area_navs h3, .footer_area_navs p { padding: .5rem 1rem; margin: 0; border-top: 1px solid var(--color-mono-blight); border-left: 1px solid var(--color-mono-blight); } .footer_area_navs p { border-right: 1px solid var(--color-mono-blight); } .footer_area_navs h3:last-of-type, .footer_area_navs p:last-of-type { border-bottom: 1px solid var(--color-mono-blight); } @media screen and (max-width: 767.99px) { #wrap_footer_area_navs h2.footer_links_header { text-align: left; } #wrap_footer_area_navs h2.footer_links_header:before { content:"■"; color: var(--color-accent); } .footer_area_navs h3, .footer_area_navs p { border:none !important; } .footer_area_navs h3 { padding-bottom: 0; } .footer_area_navs p { padding-top: 0; } }