@charset "utf-8";

/*
Theme Name: 市立小樽病院用オリジナルテーマ
Theme URI:
Description: 市立小樽病院用オリジナルテーマです。
Author: K2
Author URI: http://kxk.co.jp
*/


/* Shortcodes Ultimate → Fork Awesome を vendor パスに差し替え */
@font-face {
  font-family: 'ForkAwesome';
  src: url('/wp-content/plugins/shortcodes-ultimate/vendor/fork-awesome/fonts/forkawesome-webfont.woff2') format('woff2'),
       url('/wp-content/plugins/shortcodes-ultimate/vendor/fork-awesome/fonts/forkawesome-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/*******************************
- 背景色切り替えのスタイル
*******************************/
body.bg-white {
    background: #fff;
}

/*********** グレー背景 ***********/
body.bg-gray {
    background: #ddd;
}

body.bg-gray td,
body.bg-gray th {
    background: #DDD !important;
    color: #000;
}

body.bg-gray a,
body.bg-gray #gmenu ul li a,
body.bg-gray #side-pagelist ul li ul li a,
body.bg-gray #side-pagelist ul>li>a,
body.bg-gray #children-pages a,
body.bg-gray #top-submenu .submenu h3,
body.bg-gray .top-post-list header h3,
body.bg-gray .top-post-list header a,
body.bg-gray #footer,
body.bg-gray #footer a {
    color: #000;
}

body.bg-gray div.previous-post a,
body.bg-gray div.next-post a,
body.bg-gray h2,
body.bg-gray #footer,
body.bg-gray #side ul li,
body.bg-gray a#footer-big-menu-toggle,
body.bg-gray #footer-right-top-menu li a,
body.bg-gray #gmenu ul li a,
body.bg-gray #gmenu ul li a:hover,
body.bg-gray #top-submenu .submenu h3,
body.bg-gray .top-post-list header,
body.bg-gray .dl-posts .cat-pickup,
body.bg-gray .dl-posts .cat-med,
body.bg-gray .dl-posts .cat,
body.bg-gray #side-pagelist ul>li>a,
body.bg-gray #children-pages a,
body.bg-gray #children-pages a:hover {
    background: #DDD;
}

body.bg-gray h1#logo,
body.bg-gray #pict-menu {
    background: #DDD;
}

body.bg-gray a#footer-big-menu-toggle {
    border-bottom-color: #DDD;
}

body.bg-gray .dl-posts .cat-pickup,
body.bg-gray .dl-posts .cat-med,
body.bg-gray .dl-posts .cat {
    border: 1px solid #000;
    color: #000;
}

body.bg-gray #footer-left th img {
    background: #000 !important;
}

body.bg-gray a#footer-big-menu-toggle {
    color: #000;
}

/*********** 黒背景 ***********/
body.bg-black {
    background: #000;
    color: #fff;
}

body.bg-black td,
body.bg-black th,
body.bg-black .float-menu,
body.bg-black #pict-menu {
    background: #000 !important;
}

body.bg-black a,
body.bg-black #side-pagelist ul li ul li a,
body.bg-black #children-pages a,
body.bg-black table td,
body.bg-black table th {
    color: #fff;
}

body.bg-black div.previous-post a,
body.bg-black div.next-post a,
body.bg-black h2,
body.bg-black #footer,
body.bg-black #side ul li,
body.bg-black a#footer-big-menu-toggle,
body.bg-black #footer-right-top-menu li a,
body.bg-black #gmenu ul li a,
body.bg-black #gmenu ul li a:hover,
body.bg-black #top-submenu .submenu h3,
body.bg-black .top-post-list header,
body.bg-black .dl-posts .cat-pickup,
body.bg-black .dl-posts .cat-med,
body.bg-black .dl-posts .cat,
body.bg-black #side-pagelist ul>li>a,
body.bg-black #children-pages a,
body.bg-black #children-pages a:hover {
    background: #000;
}

body.bg-black h1#logo,
body.bg-black #pict-menu {
    background: #fff;
}

body.bg-black a#footer-big-menu-toggle {
    border-bottom-color: #000;
}

body.bg-black .dl-posts .cat-pickup,
body.bg-black .dl-posts .cat-med,
body.bg-black .dl-posts .cat {
    border: 1px solid #ffffff;
}

/*******************************
- ヘッダー
*******************************/
#header {}

h1#logo {
    padding: 0;
    background: transparent;
}

/* ヘッダー左 */
#header-left {
    width: 200px;
}

/* ヘッダー右 */
#header-right {
    width: 220px;
}

#header-right ul li {
    float: left;
    margin-left: 5px;
}

#header-right ul li:first-child {
    padding-top: 3px;
}

/* 検索フォーム */
#header-search {
    table-layout: auto;
    border: 0 none !important;
}

#header-search th,
#header-search td {
    border: 0 none !important;
    padding: 0;
}

#header-search input[type="text"] {
    height: 10px;
    width: 130px;
}

#header-search input[type="submit"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 0px 15px;
    background: #ccc;
    border: 1px solid #999;
    height: 20px;
    width: 55px;
}

/* ヘッダー中央 */
#header-center {
    margin: 0 270px 8px 300px;
    border-left: 2px solid #ccc;
    border-right: 2px solid #ccc;
}

/* 電話番号 */
p#header-tel {
    background: url(images/ico_tel.png) no-repeat left center;
}

#header-center dl dt {
    float: left;
}

#header-center dl dd {
    margin-left: 7em;
}

/* ヘッダーサブメニュー */
#header-submenu {
    /*        text-align: right 20200622*/
    float: right;
}

#header-submenu ul li {
    /*        float: left;
        margin-left: 10px;*/
    /*        display: inline-block; 20200622*/
}

/*******************************
- グローバルメニュー
*******************************/
#gmenu {
    margin: 0;
    /*	margin-bottom:15px; 20200624*/
    position: relative;
    z-index: 100;
    background: rgb(0, 106, 181);
}

#gmenu .container {}

#gmenu .container ul.inner {
    padding: 0 !important;
    /*		position: absolute; 20200622*/
    width: 960px;
    /*top: -84px; 20200622
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);*/
    border-left: 1px solid #ffffff;
    border-right: 1px solid #ffffff;
}

/*single、page、searchのとき*/
body.single #gmenu .container ul.inner,
body.page #gmenu .container ul.inner,
body.archive #gmenu .container ul.inner,
body.search #gmenu .container ul.inner {
    padding: 0 !important;
    position: initial;
    margin: 0 auto !important;
    -webkit-transform: none;
}

.float-menu {
    position: sticky;
    position: -webkit-sticky;
    top:0;
    z-index:100;
    background:#fff;
}

@media screen and (max-width:568px) {
    .float-menu {
        position:relative;
    }
}

#gmenu ul {
    list-style: none;
}

#gmenu ul li {
    float: left;
    position: relative;
    /* width: 16.6666667%; */
    width: 15.5%;
    text-align: center;
    /*            background: #383838;*/
}

#gmenu ul li#menu-item-64 {
    width: 7%;
}

#gmenu>.container>ul>li>a {
    border-left: 1px solid #ffffff;
}

#gmenu>.container>ul>li:first-child>a {
    border-left: 0;
}

#gmenu ul li a {
    display: block;
    /* padding: 30px 0 0; */
    padding: 12px 0;
    /*
                color: #fff;
                background: #006AB5;*/
    background: rgb(0, 106, 181);
    color: #ffffff;
}

#gmenu ul li a:hover {
    /*background: #2B2B2B;*/
    background: #005693;
    color: #ffffff;
}

/* ===== 多階層に対応 ===== */
#gmenu ul li ul {
    position: absolute;
    width: 100%;
    left: 1px;
    top: 100%;
    display: none;
}

#gmenu ul li ul li {
    width: 100%;
    border-bottom: 1px dotted #ccc;
}

#gmenu ul li ul li a {
    background: #007ed7;
    padding: 12px 0;
    color: #ffffff;
}

/* 孫があれば右向き三角表示 */
#gmenu ul li ul li.menu-item-has-children:after {
    width: 0;
    height: 0;
    content: '';
    border: 5px solid transparent;
    border-left: 5px solid #fff;
    right: 10px;
    top: 17px;
    position: absolute;
}

/* liの最後の場合で孫があれば左向き三角表示 */
#gmenu ul li:last-child ul li.menu-item-has-children:after {
    border: 5px solid transparent;
    border-right: 5px solid #fff;
    right: 0;
    left: 10px;
}

/* 孫以降右に展開 */
#gmenu ul li ul li ul {
    top: 0;
    left: 100%;
}

/* liの最後の孫以降の場合左に展開 */
#gmenu ul li:last-child ul li ul {
    left: -100%;
}

/* ホバーで下階層表示 */
.pc #gmenu ul li:hover>ul {
    display: block;
}

/* ===== グローバルメニュー表示切り替えボタン ===== */
#gmenu-toggle {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 35px;
    margin: 0 auto;
    background: none;
    border: 0;
    padding: 12px 0;
    outline: none;
    cursor: pointer;
}

#gmenu-toggle span {
    height: 5px;
    background: #FFF;
    width: 100%;
    display: block;
    margin-top: 3px;
    border-radius: 5px;
    border-bottom: 2px solid #000;
}

#gmenu-toggle span:first-child {
    margin-top: 0;
}

/*******************************
- スライダー
*******************************/
/* .n2-section-smartslider{
	margin-bottom: 20px;
} */


/*******************************
- パンくず
*******************************/
#breadcrumbs {
    width: 100%;
    float: left;
    margin-bottom: 15px;
}

#breadcrumbs ul.inner {
    list-style: none;
    margin: 0;
    padding: 5px 10px;
    /*overflow: hidden;*/
}

#breadcrumbs ul li {
    float: left;
    margin-right: 10px;
}

#breadcrumbs ul li.current {
    font-weight: bold;
}

/*******************************
- サブメニュー
*******************************/
#top-submenu .submenu {
    border: 1px solid #ccc;
    height: 214px;
}

#top-submenu .submenu h3 {
    border: 0;
    background-color: #006AB5;
    background-position: 5px center;
    background-repeat: no-repeat;
    ;
    color: #fff;
    padding: 5px 0 5px 35px;
}

#top-submenu .submenu ul {
    margin-left: 35px;
    font-weight: bold;
}

#top-submenu .submenu ul li {
    margin-top: 5px;
    position: relative;
    padding-left: 15px;
}

#top-submenu .submenu ul li:before {
    content: '';
    width: 0;
    height: 0;
    position: absolute;
    border: 5px solid transparent;
    border-left: 8px solid #000;
    top: 50%;
    left: 0;
    margin-top: -6px;
}

#top-submenu .submenu ul li:first-child {
    margin-top: 0;
}

/* 来院される方へ */
#left-submenu h3 {
    background-image: url(images/ico_heart.png);
}

/* 診療科・各部門紹介 */
#center-submenu h3 {
    background-image: url(images/ico_karute.png);
}

/* 健診・ドックのご案内 */
#right-submenu h3 {
    background-image: url(images/ico_check.png);
}

/*******************************
- メイン
*******************************/
#main {
    width: 100%;
    float: left;
}

#main article {}

#main article p,
#main article ol {
    padding-right: 10px;
    padding-left: 10px;
}

#main article ol {
    margin-left: 25px;
    list-style-position: outside;
}

#main article ul {
    margin-left: 25px;
    list-style-position: outside;
}

.post-meta {
    margin-top: 15px;
    padding-top: 7px;
    border-top: 1px solid #CCC;
}

.archive-c {
    border-top: none;
    border-bottom: 1px solid #CCC;
}

p.wp-caption-text {
    text-align: center;
}

/* ===== 前へ・次へリンク ===== */
#post-nav {
    margin-top: 15px;
    clear: both;
}

.previous-post,
.next-post {
    width: 48%;
}

.previous-post {
    float: left;
}

.next-post {
    float: right;
    text-align: right;
}

.previous-post a,
.next-post a {
    background: #f5f5f5;
    padding: 5px 10px;
    border: 1px solid #DADADA;
    border-radius: 5px;
}

/* ===== お見舞いメール ===== */
.mw_wp_form table {
    table-layout: auto;
}

#mw_wp_form_mw-wp-form-429 p.form_btn {
    text-align: center;
}

p.disp-comp {
    text-align: center;
}

/* ===== お見舞いメール 入力フォーム時 ===== */
.mw_wp_form_input input.btn_disp_soushin {
    display: none;
}

.mw_wp_form_input p.form_confirm_text {
    display: none;
}

.mw_wp_form_input p.disp-comp {
    display: none;
}

/* ===== お見舞いメール 確認フォーム時 ===== */
.mw_wp_form_confirm input.btn_disp_kakunin {
    display: none;
}

.mw_wp_form_confirm p.form_input_text {
    display: none;
}

.mw_wp_form_confirm p.disp-comp {
    display: none;
}

/* ===== かかりつけ医検索 チェックボックスラベル ===== */
#main .search_chkbox label {
    display: block;
    float: left;
    width: 13em;
}

/* ===== かかりつけ医検索 検索条件テキストボックス ===== */
#main .search_txt {
    margin: 15px 0;
}

/* ===== かかりつけ医検索 検索結果 ===== */
#shisetsu-results li {
    float: left;
    width: 25%;
}

th a {
    color: #E8F071;
}

/*******************************
- ページに表示される子ページ一覧
*******************************/
#children-pages {
    margin-bottom: -20px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
}

#children-pages li {
    width: 29%;
    height: 80px;
    margin: 1% 0.5%;
    text-align: center;
    background-color: #e8f5ff;
    display: table;
    border-radius: 10px;
    /* CSS3草案 */
    -webkit-border-radius: 10px;
    /* Safari,Google Chrome用 */
    -moz-border-radius: 10px;
}

#children-pages li:hover {
    background-color: #006AB5;
    color: #fff;
}

#children-pages a {
    /*            background-color: #e8f5ff;*/
    /*background-image: url(images/ico_circle.png);*/
    /*            background-repeat: no-repeat;*/
    /*            background-position: 15px center;*/
    /*            padding: 20px 35px;*/
    display: block;
    color: #000;
    /*            position: relative;*/
    display: table-cell;
    vertical-align: middle;
    height: 2em;
}

#children-pages a:hover {
    /*            background-color: #006AB5;*/
    color: #fff;
}

/*******************************
- メインバナー
*******************************/
#main-banner aside:first-child {
    /*    margin-top: 0;*/
}

/*******************************
- ピクトメニュー
*******************************/
#pict-menu .box {
    width: 22.5%;
    margin-bottom: 20px;
}


/*******************************
- トップ記事一覧
*******************************/
div#topics {
    display: none;
}

.top-post-list {
    border: 1px solid #ccc;
}

.top-post-list header {
    position: relative;
    background: #006AB5;
}

#topics header {
    position: relative;
    background: #11AE66;
}

.top-post-list header h3 {
    padding: 0;
    color: #fff;
    background: none;
    font-size: 129% !important;
    font-weight: normal;
}

.top-post-list header a {
    position: absolute;
    right: 20px;
    top: 0;
    color: #fff;
}

.top-post-list-inner {
    padding: 10px 35px;
}

/*******************************
- ニュースタブ（PC）
*******************************/
.top-news-tab-wrap {
    /* 961px以上で表示（mq.cssで960px以下は非表示） */
}

.top-news-tab-nav {
    list-style: none;
    margin: 0;
    padding: 4px 0 0 8px;
    display: flex;
    align-items: flex-end;
    background: #fff;
    flex-wrap: nowrap;
    overflow: hidden;
}

.tab-btn {
    position: relative;
    padding: 7px 18px 9px;
    color: #fff;
    cursor: pointer;
    border-radius: 6px 6px 0 0;
    transform: skewX(-10deg);
    margin-right: 3px;
    opacity: 0.6;
    font-size: 87%;
    white-space: nowrap;
    transition: opacity 0.15s;
    user-select: none;
}

.tab-btn span {
    display: block;
    transform: skewX(10deg);
}

.tab-btn:hover {
    opacity: 0.85;
}

.tab-btn.is-active {
    opacity: 1;
    padding-bottom: 13px;
}

/* タブ色 */
.tab-btn--info       { background: #006AB5; }
.tab-btn--topics     { background: #11ae66; }
.tab-btn--pickup     { background: #75bb2a; }
.tab-btn--latestnews { background: #08AECC; }
.tab-btn--med        { background: #0a695b; }
.tab-btn--formp      { background: #214271; }

/* パネル */
.top-news-tab-panel {
    display: none;
}
.top-news-tab-panel.is-active {
    display: block;
}

/* パネルヘッダー色（選択タブ色に連動） */
.tab-header--info       { background: #006AB5; }
.tab-header--topics     { background: #11ae66; }
.tab-header--pickup     { background: #75bb2a; }
.tab-header--latestnews { background: #08AECC; }
.tab-header--med        { background: #0a695b; }
.tab-header--formp      { background: #214271; }

/* モバイル用の全カテゴリ一覧はPCでは非表示 */
.top-news-mobile {
    display: none;
}

/*******************************
- サイドバー
*******************************/
#side {
    width: 100%;
    float: left;
    /*
	padding-right: 10px;
    padding-left: 10px;
*/
}

#side ul {
    list-style: none;
    margin: 0;
}

#side ul li {
    background: #e8f5ff;
}

#side ul li a {
    padding: 5px;
    display: block;
    border-bottom: 1px dashed #ccc;
}

/* サイドバナーウィジェット */
.lh-none {
    line-height: 0;
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

#pict-menu.lh-none {
    justify-content: flex-start;
}

#side-banner.lh-none {
    justify-content: space-between;
}


#side-banner aside:first-child {
    /*        margin-top: 0;*/
}

#side-banner aside {
    padding-right: 0;
    padding-left: 0;
    display: flex;
    flex-direction: row;
    width: 300px;
    flex-wrap: wrap;
    justify-content: space-between;
}

#side-banner a[target="_blank"] {
    padding-right: 0;
}

/* ===== サイドメニューページ一覧（カレントページの子をどんどん開いていく） ===== */
/* 第一階層の見出し */
#side-pagelist ul>li>a {
    background: #006AB5;
    padding-top: 15px;
    padding-bottom: 15px;
    color: #ffffff;
}

/* 第二階層以下を非表示（初期化） */
#side-pagelist ul li ul {
    display: none;
    margin-left: 10px;
}

/* カレントページ強調 */
#side-pagelist ul li.current_page_item>a {
    font-weight: bold;
}

/* 表示設定 */
#side-pagelist ul li.current_page_item>ul,
#side-pagelist ul li.current_page_parent>ul,
#side-pagelist ul li.current_page_ancestor>ul {
    display: block;
}

/* 第二階層以下のスタイル */
#side-pagelist ul li ul li a {
    background: #e8f5ff;
    padding-top: 5px;
    padding-bottom: 5px;
    color: #004271;
}


span.post-date {
    padding: 5px;
}

/*******************************
- フッタービッグメニュー
*******************************/
/* 開閉ボタン */
a#footer-big-menu-toggle {
    background: #006AB5;
    color: #fff;
    text-shadow: 1px 1px 1px #000;
    border-bottom: 5px solid #002e4f;
    display: block;
}

a#footer-big-menu-toggle.w568-show {
    display: none;
}

#footer-big-menu h3 {
    padding-left: 0;
    border-bottom: 3px solid #ccc;
    border-left: none;
    background: none;
    font-size: 100% !important;
    color: inherit;
    padding: 15px 0px 5px;
}

#footer-big-menu h4 {
    border: 0;
    padding: 0;
    margin: 20px 0 0 0;
    background: none;
}

#footer-big-menu h4:first-child {
    margin-top: 0;
}

#footer-big-menu ul {
    margin: 0;
    list-style: none;
}

#footer-big-menu a {
    text-decoration: underline;
    color: #000;
}

.bg-black #footer-big-menu a {
    color: #fff;
}

#footer-big-menu ul.sub-menu {
    margin-bottom: 20px;
    font-size: 90%;
}

#footer-big-menu>div>div>ul>li>a {
    font-weight: bold;
    text-decoration: none;
}

/*******************************
- フッター
*******************************/
#footer {
    background: #006AB5;
    padding: 15px 0;
    color: #fff;
}

#footer table {
    table-layout: auto;
}

#footer a {
    color: #fff;
}

#footer ul li {
    float: left;
}

#footer ul li:first-child {
    margin-left: 0;
}

/* ===== フッター左 ===== */
#footer-left ul li {
    margin-left: 10px;
}

#footer-left td,
#footer-left th {
    border: 0 !important;
    padding: 0 !important;
    /*vertical-align: bottom;*/
}

#footer-left td {
    line-height: 130%;
}

#footer-left td.insta img {
    width: 50px;
    height: 50px;
}

#footer-left td.insta a[target="_blank"]{
    background:none;
}

#footer-left th {
    text-align: left !important;
    width: 330px;
    background: none;
    text-shadow: none;
    font-weight: normal;
    padding-right: 20px;
}

/* ===== フッター右 ===== */
/* フッター右上メニュー */
#footer-right-top-menu li {
    margin-left: 5px;
    position: relative;
}

#footer-right-top-menu li a {
    padding: 5px 10px 5px 25px;
    /*padding: 5px 5px 5px 15px;*/
    border-radius: 5px;
    position: relative;
    background: #002e4f;
}

#footer-right-top-menu li a:before {
    content: '';
    width: 0;
    height: 0;
    position: absolute;
    border: 5px solid transparent;
    border-left: 10px solid #fff;
    top: 50%;
    left: 10px;
    margin-top: -6px;
}

/* フッター右下メニュー */
#footer-right-bottom-menu {
    clear: both;
}

#footer-right-bottom-menu li {
    margin-left: 5px;
}

#footer-right-bottom-menu li a {
    border-left: 1px solid #fff;
    padding-left: 10px;
}

#footer-right-bottom-menu li:first-child a {
    border: 0;
    padding: 0;
}

/*******************************
- 施設情報
*******************************/
.renkei-list {
    table-layout: auto;
}

#shop-info {
    /*line-height: 0;*/
    position: relative;
    clear: right;
}

.shop-info-img {
    /*width: 48%;*/
    margin: 0 0 10px 0;
}

.shop-info-img img {
    border: 1px solid #ccc;
    margin-top: 2px;
}

.shop-info-meta {
    /*width: 48%;*/
    line-height: normal;
    margin: 20px 0;
}

#shop-info table.shisetsu-table {
    width: 100%;
    /*position: absolute;*/
    bottom: 0;
    margin: 0;
    table-layout: fixed;
}

#shop-info table td.link {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

#shop-info table th {
    width: 9em;
}

#shop-info .simplemap {
    margin: 20px 0;
}

/*******************************
- 同意します画面
*******************************/
.tbrightcontent {
    left: 10% !important;
    width: 80% !important;
}

h3.termstitle {
    background: rgba(0, 106, 181) !important;
}

/*******************************
- スライダー動画コンテンツ追加
*******************************/
.header-slider {
    margin-bottom: 20px;
}

.header-slider__inner {
    display: flex;
}

.header-slider-movie {
    width: 300px;
    background: #e1eef5;
    padding: 15px 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.header-slider-movie__heading {
    margin: 0;
    font-size: 26px;
    font-weight: bold;
    color: #005da9;
}

.header-slider-movie .widget_media_video {
    margin: 20px 0 10px;
}

.header-slider-movie .widget_text .textwidget p {
    margin-bottom: 0;
    color: #666767;
    font-weight: bold;
}

.header-slider-movie__img {
    line-height: 0;
    margin-top: 20px;
}

.header-slider-movie__txt {
    margin: 10px 0 0;
    color: #666767;
    font-weight: bold;
}

.header-slider-movie__btn {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 107px;
    color: #fff;
    background: #005da9;
    font-size: 20px;
    font-weight: bold;
    padding: 0 8px;
    text-align: center;
    margin-top: 20px;
}

.header-slider__wrap {
    flex: 1;
}