@charset "UTF-8"; /*! Theme Name: ebara Theme URI: Description: bcool-bootstrap4.5の子テーマ Author: BCOOL Inc. Author URI: Template: bcool-bootstrap4.5 License: License URI: Tags: Text Domain: Version: 2020-10-29 */ /*-------------------------------------------------------------- # Bootstrapの変数とミックスインを使う --------------------------------------------------------------*/ /*-------------------------------------------------------------- # 変数 # from _variables.scss --------------------------------------------------------------*/ /*-------------------------------------------------------------- # スペース --------------------------------------------------------------*/ /*-------------------------------------------------------------- # オプション # # Quickly modify global styling by enabling or disabling optional features. --------------------------------------------------------------*/ /*-------------------------------------------------------------- # カラーシステム --------------------------------------------------------------*/ /*-------------------------------------------------------------- # Body # # Settings for the `` element. --------------------------------------------------------------*/ /*-------------------------------------------------------------- # Links # # Style anchor elements. --------------------------------------------------------------*/ /*-------------------------------------------------------------- # フォント # # Font, line-height, and color for body text, headings, and more. --------------------------------------------------------------*/ @font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 100; } @font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 200; } @font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 300; } @font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 400; } @font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Bold"); font-weight: bold; } @font-face { font-family: "Helvetica Neue"; src: local("Helvetica Neue Regular"); font-weight: 100; } @font-face { font-family: "Helvetica Neue"; src: local("Helvetica Neue Regular"); font-weight: 200; } @media all and (-ms-high-contrast: none) { body, tooltip, popover { font-family: Verdana, Meiryo, sans-serif; } } /*-------------------------------------------------------------- # 各種変数 --------------------------------------------------------------*/ /*-------------------------------------------------------------- # 各種変数 --------------------------------------------------------------*/ .fa_style, .fa-sup:before, .fa-sup:after, .btn-arrow::after { display: inline-block; font: normal normal normal 14px/1 "Font Awesome 5 pro"; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .cleartype, .font-serif { -webkit-transform-origin: 0 0; -webkit-transform: scale(1, 1.01); -moz-transform-origin: 0 0; -moz-transform: scale(1, 1.01); -ms-transform-origin: 0 0; -ms-transform: scale(1, 1.02); /* IE9だけ1.02 */ -o-transform-origin: 0 0; -o-transform: scale(1, 1.01); } .bg-gradient-primary { background: #0056d2 -webkit-gradient(linear, left top, right top, from(#207bff), to(#0056d2)) !important; background: #0056d2 -o-linear-gradient(left, #207bff, #0056d2) !important; background: #0056d2 linear-gradient(90deg, #207bff, #0056d2) !important; } .bg-gradient-secondary { background: #f9de00 -webkit-gradient(linear, left top, right top, from(#ffeb47), to(#f9de00)) !important; background: #f9de00 -o-linear-gradient(left, #ffeb47, #f9de00) !important; background: #f9de00 linear-gradient(90deg, #ffeb47, #f9de00) !important; } .bg-gradient-success { background: #315b34 -webkit-gradient(linear, left top, right top, from(#4c8d50), to(#315b34)) !important; background: #315b34 -o-linear-gradient(left, #4c8d50, #315b34) !important; background: #315b34 linear-gradient(90deg, #4c8d50, #315b34) !important; } .bg-gradient-info { background: #3f445b -webkit-gradient(linear, left top, right top, from(#5e6688), to(#3f445b)) !important; background: #3f445b -o-linear-gradient(left, #5e6688, #3f445b) !important; background: #3f445b linear-gradient(90deg, #5e6688, #3f445b) !important; } .bg-gradient-warning { background: #f9de00 -webkit-gradient(linear, left top, right top, from(#ffeb47), to(#f9de00)) !important; background: #f9de00 -o-linear-gradient(left, #ffeb47, #f9de00) !important; background: #f9de00 linear-gradient(90deg, #ffeb47, #f9de00) !important; } .bg-gradient-danger { background: #9e1035 -webkit-gradient(linear, left top, right top, from(#e3174c), to(#9e1035)) !important; background: #9e1035 -o-linear-gradient(left, #e3174c, #9e1035) !important; background: #9e1035 linear-gradient(90deg, #e3174c, #9e1035) !important; } .bg-gradient-light { background: #f9f8ea -webkit-gradient(linear, left top, right top, from(white), to(#f9f8ea)) !important; background: #f9f8ea -o-linear-gradient(left, white, #f9f8ea) !important; background: #f9f8ea linear-gradient(90deg, white, #f9f8ea) !important; } .bg-gradient-dark { background: #343a40 -webkit-gradient(linear, left top, right top, from(#56606a), to(#343a40)) !important; background: #343a40 -o-linear-gradient(left, #56606a, #343a40) !important; background: #343a40 linear-gradient(90deg, #56606a, #343a40) !important; } .img-indent-primary { position: relative; } .img-indent-primary::before { content: ""; display: block; position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); border-style: solid; border-width: 40px 40px 0 40px; border-color: #0056d2 transparent transparent transparent; } .img-indent-secondary { position: relative; } .img-indent-secondary::before { content: ""; display: block; position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); border-style: solid; border-width: 40px 40px 0 40px; border-color: #f9de00 transparent transparent transparent; } .img-indent-success { position: relative; } .img-indent-success::before { content: ""; display: block; position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); border-style: solid; border-width: 40px 40px 0 40px; border-color: #315b34 transparent transparent transparent; } .img-indent-info { position: relative; } .img-indent-info::before { content: ""; display: block; position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); border-style: solid; border-width: 40px 40px 0 40px; border-color: #3f445b transparent transparent transparent; } .img-indent-warning { position: relative; } .img-indent-warning::before { content: ""; display: block; position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); border-style: solid; border-width: 40px 40px 0 40px; border-color: #f9de00 transparent transparent transparent; } .img-indent-danger { position: relative; } .img-indent-danger::before { content: ""; display: block; position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); border-style: solid; border-width: 40px 40px 0 40px; border-color: #9e1035 transparent transparent transparent; } .img-indent-light { position: relative; } .img-indent-light::before { content: ""; display: block; position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); border-style: solid; border-width: 40px 40px 0 40px; border-color: #f9f8ea transparent transparent transparent; } .img-indent-dark { position: relative; } .img-indent-dark::before { content: ""; display: block; position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); border-style: solid; border-width: 40px 40px 0 40px; border-color: #343a40 transparent transparent transparent; } .img-indent-white { position: relative; } .img-indent-white::before { content: ""; display: block; position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); border-style: solid; border-width: 40px 40px 0 40px; border-color: #fff transparent transparent transparent; } .img-indent-black { position: relative; } .img-indent-black::before { content: ""; display: block; position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); border-style: solid; border-width: 40px 40px 0 40px; border-color: #000 transparent transparent transparent; } .img-indent-left::before { left: 20%; } .img-indent-right::before { left: auto; right: 20%; } /*-------------------------------------------------------------- # WordPressに搭載されている基本クラス --------------------------------------------------------------*/ /*-------------------------------------------------------------- # WordPressに搭載されている基本クラス --------------------------------------------------------------*/ /* Galleries */ .gallery { margin-bottom: 1.5em; } .gallery-item { display: inline-block; text-align: center; vertical-align: top; width: 100%; } .gallery-columns-2 .gallery-item { max-width: 50%; } .gallery-columns-3 .gallery-item { max-width: 33.33%; } .gallery-columns-4 .gallery-item { max-width: 25%; } .gallery-columns-5 .gallery-item { max-width: 20%; } .gallery-columns-6 .gallery-item { max-width: 16.66%; } .gallery-columns-7 .gallery-item { max-width: 14.28%; } .gallery-columns-8 .gallery-item { max-width: 12.5%; } .gallery-columns-9 .gallery-item { max-width: 11.11%; } .gallery-caption { display: block; } /* Captions */ .wp-caption { margin-bottom: 1.5em; max-width: 100%; } .wp-caption img[class*=wp-image-] { display: block; margin: 0 auto; } .wp-caption-text { text-align: center; } .wp-caption .wp-caption-text { margin: 0.8075em 0; } /* Alignments */ .alignleft { display: inline; float: left; margin-right: 1.5em; } .alignright { display: inline; float: right; margin-left: 1.5em; } .aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; } /* Media */ img, video { height: auto; /* Make sure images are scaled correctly. */ max-width: 100%; /* Adhere to container width. */ } img.alignleft, img.alignright { float: none; margin: 0 auto 1rem; } @media screen and (min-width: 576px) { /* Fix image alignment */ img.alignleft { float: left; margin-right: 1.5em; } img.alignright { float: right; margin-left: 1.5em; } } /* 引用 */ blockquote { color: #666; font-size: 18px; font-size: 1.125rem; font-style: italic; line-height: 1.7; margin: 0; overflow: hidden; padding: 0; } blockquote cite { display: block; font-style: normal; font-weight: 600; margin-top: 0.5em; } address { margin: 0 0 1.5em; } pre { background: #eee; font-family: "Courier 10 Pitch", Courier, monospace; font-size: 15px; font-size: 0.9375rem; line-height: 1.6; margin-bottom: 1.6em; max-width: 100%; overflow: auto; padding: 1.6em; } code, kbd, tt, var { font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; font-size: 15px; font-size: 0.9375rem; } abbr, acronym { border-bottom: 1px dotted #666; cursor: help; } mark, ins { background: #eee; text-decoration: none; } big { font-size: 125%; } blockquote { quotes: "" ""; } q { quotes: "“" "”" "‘" "’"; } blockquote:before, blockquote:after { content: ""; } :focus { outline: none; } /* wordpress 標準投稿関連 */ body.single .entry-content, body.blog .entry-content { line-height: 2rem; } body.single .entry-content h2, body.blog .entry-content h2 { margin: 3rem 0 1rem; border-top: double #d9d9d9; border-bottom: 1px dotted #d9d9d9; padding: 1rem; } body.single .entry-content h3, body.blog .entry-content h3 { margin: 2.5rem 0 1rem; } body.single .entry-content ul li, body.single .entry-content ol li, body.blog .entry-content ul li, body.blog .entry-content ol li { line-height: 1.6; } .entry-meta { margin: 1rem 0; padding: 1rem; border-top: 1px solid #d9d9d9; border-bottom: 1px solid #d9d9d9; } .entry-meta time:before { font-family: "Font Awesome 5 Pro"; content: ""; margin-right: 0.5rem; display: inline-block; } .entry-meta .post-category:before { font-family: "Font Awesome 5 Pro"; content: ""; margin-right: 0.5rem; display: inline-block; } .entry-footer { margin: 3rem 0; } .entry-footer .tags { padding: 1rem; border-top: 1px solid #d9d9d9; border-bottom: 1px solid #d9d9d9; } .entry-footer .tags:before { font-family: "Font Awesome 5 Pro"; content: ""; margin-left: -0.2rem; margin-right: 0.4rem; display: none; } /* calendar widget */ #wp-calendar { width: 100%; max-width: 37.5rem; background: #1d3789; margin-left: auto; margin-right: auto; font-family: "A1 mincho"; } #wp-calendar caption { background: #1d3789; color: #fff; padding: 1rem; text-align: center; caption-side: top; border: 1px solid #d9d9d9; } #wp-calendar thead tr { border-right: 1px solid #d9d9d9; } #wp-calendar thead th { padding: 0.5rem; background: #fffbc7; text-align: center; font-size: 0.7rem; border: 1px solid #d9d9d9; border-top: none; line-height: 1.25; } #wp-calendar tbody td { font-size: 0.7rem; position: relative; padding: 0.5rem; text-align: center; border: 1px solid #d9d9d9; background: #fff; line-height: 1.25; } #wp-calendar tbody td.pad { opacity: 0.9; } #wp-calendar tbody td#today { font-weight: bold; } #wp-calendar tbody td#today#today:after { content: ""; position: absolute; top: 0; right: 0; width: 0; height: 0; border-top: 10px solid #dee2e6; border-left: 10px solid transparent; } #wp-calendar tbody td a { display: block; background: rgba(0, 55, 134, 0.2); } #wp-calendar tbody td a:hover { background: #003786; color: #fff; } #wp-calendar tfoot tr { background: rgba(255, 255, 255, 0.9); border: 1px solid #d9d9d9; } #wp-calendar tfoot tr td { border: 0; padding: 0; } #wp-calendar tfoot tr a { display: block; padding: 0.25rem 0.75rem; } #wp-calendar tfoot tr a:hover { background: #fff; } #wp-calendar tfoot tr #prev { text-align: left; } #wp-calendar tfoot tr #next { text-align: right; } .wp-block-table table { border-collapse: collapse; margin-bottom: 1rem; } .wp-block-table table thead th { color: #fff; border-bottom: 1px solid #d9d9d9; } .wp-block-table table th, .wp-block-table table td { padding: 0.25rem; border-collapse: collapse; border: 1px solid #d9d9d9; } .wp-block-table table tr td:nth-child(1) { white-space: nowrap; } .wp-block-table .is-style-stripes { border-spacing: 0; border-collapse: inherit; background-color: transparent; border: none; } .wp-block-table .is-style-stripes td, .wp-block-table .is-style-stripes th { border-bottom: 1px solid #d9d9d9; } .wp-block-table .is-style-stripes.has-subtle-light-gray-background-color tr:nth-child(odd), .wp-block-table .is-style-stripes tr:nth-child(odd) { background-color: #fffbc7; } /*--------------------- IE 11 grid fix -----------------------*/ .wp-block-media-text { display: -webkit-box; display: -ms-flexbox; display: flex; } .wp-block-media-text .wp-block-media-text__media { -webkit-box-flex: 1; -ms-flex: 1 0 28%; flex: 1 0 28%; } .wp-block-media-text.has-media-on-the-right { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media { -webkit-box-flex: 1; -ms-flex: 1 0 28%; flex: 1 0 28%; } @supports (display: grid) { .wp-block-media-text { display: -ms-grid; display: grid; } .wp-block-media-text .wp-block-media-text__media { -webkit-box-flex: 0; -ms-flex: none; flex: none; } .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media { -webkit-box-flex: 0; -ms-flex: none; flex: none; } } @supports (display: -ms-grid) { .wp-block-media-text { display: -webkit-box; display: -ms-flexbox; display: flex; } .wp-block-media-text .wp-block-media-text__media { -webkit-box-flex: 1; -ms-flex: 1 0 28%; flex: 1 0 28%; } .wp-block-media-text.has-media-on-the-right { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media { -webkit-box-flex: 1; -ms-flex: 1 0 28%; flex: 1 0 28%; } } /*-------------------------------------------------------------- # よく使う便利なクラスの詰め合わせ --------------------------------------------------------------*/ /*-------------------------------------------------------------- # よく使う便利なクラスの詰め合わせ --------------------------------------------------------------*/ /*スマホのときだけ*/ .smart__only { display: none; } /* クリックエリアを広げる */ .linkbox { cursor: pointer; } .linkbox:hover { cursor: pointer; } /*-------------------------------------------------------------- 文字 --------------------------------------------------------------*/ /* Web Font ------------------------------------- */ .font-sans { font-family: "Hiragino Kaku Gothic ProN", -apple-system, BlinkMacSystemFont, "游ゴシック Medium", "メイリオ", meiryo, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; } .font-serif { font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "HGMinchoE", "ＭＳＰ明朝", "MS PMincho", "メイリオ", Meiryo, "Roboto Slab", Garamond, Georgia, Cambria, "Times New Roman", serif; } .font-serif span { font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "HGMinchoE", "ＭＳＰ明朝", "MS PMincho", "メイリオ", Meiryo, "Roboto Slab", Garamond, Georgia, Cambria, "Times New Roman", serif; } /* 装飾 ------------------------------------- */ .text-shadow-white { text-shadow: 2px 2px 3px rgba(255, 255, 255, 0.5), -2px 2px 3px rgba(255, 255, 255, 0.5), 2px -2px 3px rgba(255, 255, 255, 0.5), -2px -2px 3px rgba(255, 255, 255, 0.5), 0px 0px 7.3px rgba(255, 255, 255, 0.82); } .text-shadow-black { text-shadow: 2px 2px 3px #000, -2px 2px 3px #000, 2px -2px 3px #000, -2px -2px 3px #000, 0px 0px 8px #000, 0px 0px 16px #000; } .text-shadow-black2 { text-shadow: 0px 0px 8px #000, 0px 0px 16px #000; } .kerning { -webkit-font-feature-settings: "palt" 1; font-feature-settings: "palt" 1; } /* Google Font ------------------------------------- */ .font-lato { font-family: "Lato", sans-serif !important; } .font-roboto { font-family: "Roboto Condensed", serif !important; } .font-anton { font-family: "Anton", sans-serif; } .font-roboto { font-family: "Roboto Condensed", sans-serif; } .font-oswald { font-family: "Oswald", sans-serif; } .font-oswald span { font-weight: 200; } .font-crimson { font-family: "Crimson Text", cursive; } /* Morisawa Font ------------------------------------- */ .font-a1mincho { font-family: "A1 Mincho", serif !important; } .font-a1gothic { font-family: "A1 Gothic R", sans-serif !important; } .font-midashigo { font-family: " Midashi Go MB31", sans-serif !important; } .font-koburina1 { font-family: "Koburina Gothic W1 JIS2004", sans-serif !important; } .font-koburina3 { font-family: "Koburina Gothic W3 JIS2004", sans-serif !important; } .font-koburina6 { font-family: "Koburina Gothic W6 JIS2004", sans-serif !important; } .font-ud-shingo-l { font-family: "UD Shin Go NT Light", sans-serif !important; } .font-ud-shingo-r { font-family: "UD Shin Go NT Regular", sans-serif !important; } .font-ud-shingo-db { font-family: "UD Shin Go NT DemiBold", sans-serif !important; } .font-ud-shingo-h { font-family: "UD Shin Go NT Heavy", sans-serif !important; } .font-cinema { font-family: "Cinema Letter", sans-serif !important; } .font-maru-folk { font-family: "Maru Folk Medium", sans-serif !important; } /*-------------------------------------------------------------- ボタン --------------------------------------------------------------*/ .btn-solid { border-radius: 0; } .btn-pill { border-radius: 50em; } .btn-arrow { text-align: left; white-space: normal; } .btn-arrow::after { float: right; font-family: "Font Awesome 5 Pro"; content: ""; padding: 0.175rem 0 0 2rem; margin: 0; font-size: 1.25em; opacity: 0.9; } .btn-rounded { border-radius: 20px; } /*-------------------------------------------------------------- 画像 --------------------------------------------------------------*/ .img-full { width: 100%; height: auto; display: block; } .bg-cover-center { background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; } .bg-cover-right { background-position: right center; background-size: cover; background-repeat: no-repeat; } .bg-cover-left { background-position: left center; background-size: cover; background-repeat: no-repeat; } .img-border { border: 4px solid #fffbc7; } .bg-black { background-color: #000; } .bg-white { background-color: #fff; } /*-------------------------------------------------------------- リスト --------------------------------------------------------------*/ /* .list-bordered ------------------------------------- */ .list-bordered { padding-left: 0; list-style-position: inside; } .list-bordered li { padding-bottom: 0.25em; border-bottom: 1px solid #fffbc7; padding-left: 0.25em; margin-top: 0.5em; } /* .dl-bordered ------------------------------------- */ .dl-bordered dd { border-bottom: 1px solid #fffbc7; } /* .dl-bordered ------------------------------------- */ /*-------------------------------------------------------------- テーブル --------------------------------------------------------------*/ /*-------------------------------------------------------------- ボーダー --------------------------------------------------------------*/ .border-all { border: 1px solid #fffbc7 !important; } .border-top { border-top: 1px solid #fffbc7 !important; } .border-right { border-right: 1px solid #fffbc7 !important; } .border-bottom { border-bottom: 1px solid #fffbc7 !important; } .border-left { border-left: 1px solid #fffbc7 !important; } .border-x { border-top: 1px solid #fffbc7 !important; border-bottom: 1px solid #fffbc7 !important; } .border-y { border-right: 1px solid #fffbc7 !important; border-left: 1px solid #fffbc7 !important; } .row-bordered > [class^=" col-"], .row-bordered > [class*=col-] { border-bottom: 1px solid #4D4D4D; } .row-bordered dt { font-weight: normal; } .row-bordered dd { font-weight: bold; } .row-bordered dt, .row-bordered dd { font-size: 0.875rem; padding-bottom: 0.8rem; padding-top: 0.4rem; margin-bottom: 0; margin-top: 0.4rem; line-height: 1.25; } /*-------------------------------------------------------------- アイコン --------------------------------------------------------------*/ .before-caret-right:before, .after-caret-right:after { font-family: "Font Awesome 5 Free Solid"; content: " "; } .before-caret-up:before, .after-caret-up:after { content: " "; } .before-caret-down:before, .after-caret-down:after { content: " "; } .before-angle-right:before, .after-angle-right:after { content: " "; } /*-------------------------------------------------------------- BCOOL TAKA UTILITY --------------------------------------------------------------*/ table { width: 100%; } table th { font-weight: 100; } hr { content: "."; display: block; height: 0; font-size: 0; clear: both; width: 100%; margin: 1rem 0; } @media (min-width: 576px) { hr { margin: 1rem 0; } } @media (min-width: 768px) { hr { margin: 2rem 0; } } @media (min-width: 992px) { hr { margin: 3rem 0; } } @media (min-width: 1200px) { hr { margin: 4rem 0; } } /* dl疑似テーブル --- */ dl.table { margin: 0 0 1.5em; /* border-left: 1px solid #ccc; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #f5f5f5;*/ } dl.table dt { margin: 0; margin-right: -30%; padding: 10px; float: left; clear: both; display: inline; width: 30%; border-top: 1px solid #ccc; } dl.table dd { margin-left: 30%; padding: 10px; border-left: 1px solid #ccc; border-top: 1px solid #ccc; /* background-color: #fff; */ } dl.table { /*\*/ min-height: 1px; _height: 1%; /* */ /*\*/ /*/ overflow: hidden; /**/ } dl.table::after { height: 0; visibility: hidden; content: "."; display: block; clear: both; } @media screen and (max-width: 767px) { dl.table dt { float: none; margin: 0; display: block; width: 100%; } dl.table dd { margin: 0; border-left: none; } } /* table 縦段組み換え */ table.tandem, table.tandem th, table.tandem td { border-collapse: collapse; border: 1px solid #d9d9d9; } table.tandem th { background-color: #f2f2f2; white-space: nowrap; } @media screen and (max-width: 767px) { table.tandem { border: none; border-top: 1px solid #d9d9d9; } .tandem thead { display: none; } table.tandem tr { display: block; } table.tandem th { display: block; text-align: center; font-weight: bold; border-top: none; width: 100%; } table.tandem td { display: block; padding: 10px; text-align: right; border-top: none; } table.tandem td.tandem-title { text-align: center; font-weight: bold; border-top: double #d9d9d9; } table.tandem td::before { content: attr(data-label); float: left; font-weight: bold; } } /* table thead固定/tbody横スクロール　*/ @media screen and (max-width: 480px) { table.scroll { display: block; position: relative; } table.scroll thead { display: block; float: left; } table.scroll thead th { border: 1px solid #d9d9d9; } table.scroll tbody { display: block; width: auto; position: relative; overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; } table.scroll th { background-color: #fafafa; color: #124681; display: block; border: 1px solid #d9d9d9; } table.scroll td { background-color: #FFFFFF; display: block; border: 1px solid #d9d9d9; } table.scroll tr { display: inline-block; } table.scroll tbody tr { margin-right: -5px; } } /*ソーシャルリンク*/ #sns__share li:not(:first-child) { margin-left: 0.2rem; } #sns__share .share__facebook { background: #3b5998; color: #fff; border-radius: 10px; padding-left: 0.4rem; padding-right: 0.4rem; } #sns__share .share__twitter { background: #5ea9dd; color: #fff; border-radius: 10px; } #sns__share .share__email { background: #1f4c76; color: #fff; border-radius: 10px; } #sns__share .share__line { background: #00b900; color: #fff; border-radius: 10px; } #sns__share a { color: #fff; } #sns__share a:hover { text-decoration: none; } /* ●に数字のdl */ ol.number-list { counter-reset: my-counter; list-style: none; padding: 0; } ol.number-list li { margin-bottom: 1rem; padding-left: 2.1rem; position: relative; } ol.number-list li:before { content: counter(my-counter); counter-increment: my-counter; background-color: #0056d2; color: white; display: block; float: left; line-height: 1.8; margin-left: -2rem; text-align: center; height: 1.8rem; width: 1.8rem; border-radius: 50%; } /*----------------------- フル幅 -----------------------*/ .full-width, .wp-block-cover { width: 100vw; position: relative; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .youtube { position: relative; width: 100%; padding-top: 56.25%; } .youtube iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important; } /*-------------------------------------------------------------- # ベース --------------------------------------------------------------*/ /*-------------------------------------------------------------- # ベース --------------------------------------------------------------*/ /* noto sans @import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css); */ /*navbar fixed-top の場合*/ body { line-height: 1.75; font-weight: 300; overflow-x: hidden; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif; } body p { line-height: 1.75; } small { font-weight: 100; } /* メインコンテンツエリアのマージン @include media-breakpoint-up(xs) { body:not(.page-front):not(.page-template-page-full) .site-content { padding:1rem 0;} } @include media-breakpoint-up(sm) { } @include media-breakpoint-up(md) { body:not(.page-front):not(.page-template-page-full):not(.post-type-archive-works) .site-content { padding:3rem 0;}} @include media-breakpoint-up(lg) { body:not(.page-front):not(.page-template-page-full):not(.post-type-archive-works) .site-content { padding:4rem 0;}} @include media-breakpoint-up(xl) { body:not(.page-front):not(.page-template-page-full):not(.post-type-archive-works) .site-content { padding:4rem 0;}}*/ body.home .site-content { padding: 0 0 3rem; } /* ヘディングタグ */ .site-content .h1, .site-content h1, .site-content .h2, .site-content h2, .site-content .h3, .site-content h3, .site-content .h4, .site-content h4, .site-content .h5, .site-content h5, .site-content .h6, .site-content h6 { margin-top: 0; margin-bottom: 0; line-height: 1.15; font-weight: 100; font-family: "UD Shin Go Medium", sans-serif !important; -webkit-font-feature-settings: "palt" 1; font-feature-settings: "palt" 1; } .site-content h1 { font-size: 1.75rem; position: relative; padding: 0.75rem 0; margin-bottom: 1.5rem; font-family: "UD Shin Go Medium", sans-serif !important; } .site-content h1 span.big { font-size: 3rem; } .site-content h1 small { display: inline-block; font-size: 1.2rem; padding-left: 1rem; } .site-content h2 { text-align: center; font-weight: bold; font-size: 2.25rem; position: relative; padding: 0.75rem 0; margin-top: 2.5rem; margin-bottom: 1.25rem; font-family: "Helvetica Neue", sans-serif !important; line-height: 1.3; } .site-content h2 span.big { font-size: 3rem; } .site-content h2 small { display: block; font-size: 1.5rem; font-family: "UD Shin Go Medium", sans-serif !important; } .site-content h2 span { display: block; font-size: 1rem; } .site-content h3 { text-align: center; padding-top: 2rem; margin-bottom: 2.25rem; font-size: 1.5rem; font-family: "UD Shin Go Medium", sans-serif !important; position: relative; padding-bottom: 1.5rem; } .site-content h3::after { position: absolute; content: ""; background-color: #f9de00; width: 60%; height: 4px; display: block; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); bottom: 0; } .site-content h3 span { display: block; font-size: 1rem; } .site-content h4 { margin-top: 1.75rem; margin-bottom: 0.5rem; font-size: 1.1rem; } .site-content h6 { border-left: 6px solid #ccc; padding-left: 0.5rem; margin-top: 0.5rem; margin-bottom: 0.5rem; } .site-content section { padding: 2rem 0; } .site-content .tel-link { font-family: "Oswald", sans-serif; } .site-content .line-link { font-family: "Oswald", sans-serif; } .site-content .price { text-align: right; } .site-content .row > [class*=col] { margin-bottom: 1rem; } .btn-primary { color: #fff; } /*背景ユーティリティ*/ .bg-light-img { background: url(img/bg-light.jpg); } .bg-dark-img { background: url(img/bg-dark.png); } .bg-gradient { background: -webkit-gradient(linear, left top, left bottom, from(#007bf8), to(#0056d2)); background: -o-linear-gradient(top, #007bf8 0%, #0056d2 100%); background: linear-gradient(to bottom, #007bf8 0%, #0056d2 100%); } .bg-work { background: #fffbc7; } .menu-box { border: 5px double #d9d9d9; padding: 1rem; } .menu { padding: 0.25rem 1rem; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border-bottom: 2px dotted #d9d9d9; } .menu .item { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .menu .price, .menu .discount { text-align: right; font-weight: 100; } .menu .discount::before { font-family: "Font Awesome 5 Pro"; font-weight: 400; content: ""; margin: 0 0.5rem; position: relative; top: 1.75rem; } /*table { background: $white; th, td { text-align: center; padding: 1rem; } .price { text-align: right; } } */ /*-------------------------------------------------------------- # ヘッダー --------------------------------------------------------------*/ /*-------------------------------------------------------------- # ヘッダ用 --------------------------------------------------------------*/ .navbar-brand { min-height: 100px; } #navbar-toggler { padding: 0.3rem; font-size: 1rem; line-height: 1; background: white; border: none; border-radius: 0; width: 60px; height: 60px; margin: -0.5rem -1rem -0.5rem 0; } /* メインタイトル*/ .mainimageback { background: -webkit-gradient(linear, left top, left bottom, from(#007bf8), to(#0056d2)); background: -o-linear-gradient(top, #007bf8 0%, #0056d2 100%); background: linear-gradient(to bottom, #007bf8 0%, #0056d2 100%); /*background: url(img/mainimg_default_sm.jpg) no-repeat center center; @include media-breakpoint-up(md) { background: url(img/mainimg_default.jpg) no-repeat center center; background-size: cover; } background-size: cover;*/ margin-bottom: 2rem; padding-top: 3rem; height: 30vh; min-height: 200px; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; /* 子要素をflexboxで揃える */ -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; /* 子要素をflexboxにより縦方向に揃える */ -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; /* 子要素をflexboxにより中央に配置する */ -webkit-box-align: center; -ms-flex-align: center; align-items: center; /* 子要素をflexboxにより中央に配置する */ } .mainimageback h1 { font-size: 2rem; position: relative; padding: 0.75rem 0; margin-bottom: 1.5rem; font-family: "UD Shin Go Medium", sans-serif !important; color: #FFF; } /* パンくずリスト p#breadcrumbs { padding: 1rem 0;} */ #headerlogo { margin-top: 2rem; margin-bottom: -2rem; } /*ヘッダーナビ固定化*/ #masthead { position: absolute; z-index: 99999; width: 100%; margin: 0 auto; padding: 0; line-height: 1; top: 0; border-top: 5px solid #0056d2; } #masthead .logobar { z-index: 100; position: relative; margin-right: -15px; } #masthead .logo { -webkit-filter: drop-shadow(0px 0px 4px black); filter: drop-shadow(0px 0px 4px black); } #masthead .logo_fixed { display: none; } #masthead a, #masthead { text-decoration: none; } #masthead .container-fluid { position: relative; } /* transition */ #masthead, #masthead:after, #masthead .button_container, #masthead .btn-call, #masthead { transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } /* Fixed */ #masthead.fixed { background: #fff; position: fixed; z-index: 100000; -webkit-box-shadow: 0px 0px 14px 3px rgba(0, 0, 0, 0.3); box-shadow: 0px 0px 14px 3px rgba(0, 0, 0, 0.3); } #masthead.fixed #headerlogo { margin-top: 0; margin-bottom: 0; } #masthead.fixed .logo { display: none; } #masthead.fixed .logo_fixed { display: block; } #masthead.fixed .button_container small { color: #000; } @media (min-width: 992px) { #masthead.fixed .navbar-nav li a { color: #000; text-shadow: none; } #masthead.fixed .navbar-nav li:not(:first-of-type) a { border-left: 1px solid #000; } } #masthead.fixed:after { width: 100%; } /* overlay nav */ .button_container { cursor: pointer; z-index: 100; -webkit-transition: opacity 0.25s ease; -o-transition: opacity 0.25s ease; transition: opacity 0.25s ease; position: relative; width: 35px; height: 30px; } .button_container:hover { opacity: 0.7; } .button_container span:nth-of-type(1) { top: 0; background-color: #f9de00; } .button_container span:nth-of-type(2) { bottom: 0; background-color: #f9de00; } .button_container small { position: absolute; bottom: 0; left: 0; font-size: 0.88rem; color: #fff; font-weight: 900; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: 100%; text-align: center; } .button_container, .button_container span { display: inline-block; -webkit-box-sizing: border-box; box-sizing: border-box; } .button_container span { position: absolute; left: 0; width: 100%; height: 3px; -webkit-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; } .button_container.active span:nth-of-type(1) { -webkit-transform: translate(0, 8px) rotate(45deg); -ms-transform: translate(0, 8px) rotate(45deg); transform: translate(0, 8px) rotate(45deg); background-color: #f9de00; } .button_container.active span:nth-of-type(2) { bottom: auto; top: 9px; -webkit-transform: translate(0, 0px) rotate(135deg); -ms-transform: translate(0, 0px) rotate(135deg); transform: translate(0, 0px) rotate(135deg); background-color: #f9de00; } .button_container.active small { display: none; } @media (max-width: 991.98px) { .overlay { position: fixed; background: #0056d2; top: 0; left: 0; width: 100%; height: 0%; opacity: 0; visibility: hidden; -webkit-transition: opacity 0.35s, visibility 0.35s; -o-transition: opacity 0.35s, visibility 0.35s; transition: opacity 0.35s, visibility 0.35s; overflow: scroll; } .overlay.open { opacity: 1; visibility: visible; height: 100%; padding-top: 63px; } .overlay.open .overlay_logo { padding: 1.25rem 15px; position: fixed; width: 100%; top: 0; left: 0; background-color: #0056d2; z-index: 1; -webkit-box-shadow: 0px 0px 14px 3px rgba(0, 0, 0, 0.3); box-shadow: 0px 0px 14px 3px rgba(0, 0, 0, 0.3); } .overlay.open .icon-menu-wrapper, .overlay.open .sns_menu, .overlay.open .nav_search, .overlay.open li { -webkit-animation: fadeInRight 0.5s ease forwards; animation: fadeInRight 0.5s ease forwards; -webkit-animation-delay: 0.35s; animation-delay: 0.35s; } .overlay.open .icon-menu-wrapper:nth-of-type(2), .overlay.open .sns_menu:nth-of-type(2), .overlay.open .nav_search:nth-of-type(2), .overlay.open li:nth-of-type(2) { -webkit-animation-delay: 0.4s; animation-delay: 0.4s; } .overlay.open .icon-menu-wrapper:nth-of-type(3), .overlay.open .sns_menu:nth-of-type(3), .overlay.open .nav_search:nth-of-type(3), .overlay.open li:nth-of-type(3) { -webkit-animation-delay: 0.45s; animation-delay: 0.45s; } .overlay.open .icon-menu-wrapper:nth-of-type(4), .overlay.open .sns_menu:nth-of-type(4), .overlay.open .nav_search:nth-of-type(4), .overlay.open li:nth-of-type(4) { -webkit-animation-delay: 0.5s; animation-delay: 0.5s; } .overlay.open .icon-menu-wrapper:nth-of-type(5), .overlay.open .sns_menu:nth-of-type(5), .overlay.open .nav_search:nth-of-type(5), .overlay.open li:nth-of-type(5) { -webkit-animation-delay: 0.55s; animation-delay: 0.55s; } .overlay.open .icon-menu-wrapper:nth-of-type(6), .overlay.open .sns_menu:nth-of-type(6), .overlay.open .nav_search:nth-of-type(6), .overlay.open li:nth-of-type(6) { -webkit-animation-delay: 0.6s; animation-delay: 0.6s; } .overlay.open .icon-menu-wrapper:nth-of-type(7), .overlay.open .sns_menu:nth-of-type(7), .overlay.open .nav_search:nth-of-type(7), .overlay.open li:nth-of-type(7) { -webkit-animation-delay: 0.65s; animation-delay: 0.65s; } .overlay.open .icon-menu-wrapper:nth-of-type(8), .overlay.open .sns_menu:nth-of-type(8), .overlay.open .nav_search:nth-of-type(8), .overlay.open li:nth-of-type(8) { -webkit-animation-delay: 0.7s; animation-delay: 0.7s; } .overlay nav { position: relative; padding: 0; font-size: 1.75rem; text-align: center; font-family: "UD Shin Go Medium", sans-serif !important; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; } } @media (max-width: 991.98px) and (max-width: 991px) { .overlay nav { font-size: 1.25rem; } } @media (max-width: 991.98px) { .overlay ul { list-style: none; padding: 0; margin: 0 auto; display: inline-block; position: relative; height: 100%; width: 100%; text-align: left; } .overlay ul li { display: block; min-height: 50px; position: relative; opacity: 0; border-bottom: 1px solid rgba(255, 255, 255, 0.4); } .overlay ul li.active2 { z-index: 1; } .overlay ul li .sub-menu { left: 0; right: 0; display: block; background-color: #fff; opacity: 1; z-index: 9999; height: auto; } .overlay ul li .sub-menu a { color: #0056d2; } } @media (max-width: 991.98px) and (max-width: 991px) { .overlay ul li .sub-menu li { min-height: 44px; } } @media (max-width: 991.98px) { .overlay ul li .accordionBtn { display: block; width: 15%; /* height: 50px; */ position: absolute; top: 1.25rem; text-align: center; right: 0; } } @media (max-width: 991.98px) { .overlay ul li .accordionBtn:before { content: ""; font-family: "Font Awesome 5 Pro"; font-weight: 900; color: #fff; } } @media (max-width: 991.98px) { .overlay ul li .accordionBtn.active2:before { content: ""; font-family: "Font Awesome 5 Pro"; font-weight: 900; } } @media (max-width: 991.98px) { .overlay ul li a { padding: 1.25rem 1rem; display: block; position: relative; color: #fff; text-decoration: none; overflow: hidden; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; } .overlay ul li a:hover:after, .overlay ul li a:focus:after, .overlay ul li a:active2:after { width: 100%; } .overlay ul li a:after { content: ""; position: absolute; bottom: 0; left: 50%; width: 0%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); height: 2px; background: #6c757d; -webkit-transition: 0.35s; -o-transition: 0.35s; transition: 0.35s; } } @media (max-width: 991.98px) { .overlay ul > .menu-item-has-children { position: relative; } .overlay ul > .menu-item-has-children > a { max-width: 85%; border-right: 1px solid rgba(255, 255, 255, 0.4); } .overlay ul > .menu-item-has-children > .sub-menu > .menu-item-has-children > a { max-width: 85%; border-right: 1px solid #eee; } .overlay ul > .menu-item-has-children > .sub-menu > .menu-item-has-children .accordionBtn { top: 1.25rem; } .overlay ul > .menu-item-has-children > .sub-menu > .menu-item-has-children .accordionBtn::before { color: #0056d2; } .overlay ul > .menu-item-has-children > .sub-menu > .menu-item-has-children > .sub-menu { border-top: 1px solid #eee; } .overlay ul > .menu-item-has-children > .sub-menu > .menu-item-has-children > .sub-menu li a { padding-left: 2.125rem; } .overlay ul > .menu-item-has-children > .sub-menu > .menu-item-has-children > .sub-menu > .menu-item-has-children > a { max-width: 85%; border-right: 1px solid #eee; } .overlay ul > .menu-item-has-children > .sub-menu > .menu-item-has-children > .sub-menu > .menu-item-has-children > .sub-menu li a { padding-left: 3.25rem; } } @media (min-width: 992px) { .overlay .navbar-nav li a { color: #fff; font-family: "UD Shin Go Medium", sans-serif !important; text-shadow: 0 0 5px #000; padding-left: 10px; padding-right: 10px; display: inline-block; } .overlay .navbar-nav li a span { display: none; } .overlay .navbar-nav li:not(:first-of-type) a { border-left: 1px solid #fff; } } @-webkit-keyframes fadeInRight { 0% { opacity: 0; left: 20%; } 100% { opacity: 1; left: 0; } } @keyframes fadeInRight { 0% { opacity: 0; left: 20%; } 100% { opacity: 1; left: 0; } } #masthead.open { position: fixed; } #masthead.open .container-fluid { background: -webkit-gradient(linear, right top, left top, from(#19120a), to(#5b4129)); background: -o-linear-gradient(right, #19120a 0%, #5b4129 100%); background: linear-gradient(to left, #19120a 0%, #5b4129 100%); } #masthead.open .button_container.active span { background-color: #fff; } #masthead.open .button_container.active small { color: #fff; } #masthead .icon-menu-wrapper { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; -ms-flex-wrap: wrap; flex-wrap: wrap; opacity: 0; } #masthead .icon-menu-wrapper .icon-menu { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; text-align: center; border-top: 1px solid rgba(255, 255, 255, 0.4); border-bottom: 1px solid rgba(255, 255, 255, 0.4); width: 50%; } #masthead .icon-menu-wrapper .icon-menu:nth-of-type(2) { border-left: 1px solid rgba(255, 255, 255, 0.4); } #masthead .icon-menu-wrapper .icon-menu a { color: #fff; display: block; padding: 1.25rem; } #masthead .icon-menu-wrapper .icon-menu i { color: #f9de00; font-size: 30px; margin-bottom: 0.75rem; } #masthead .icon-menu-wrapper .icon-menu p { margin-bottom: 0; font-size: 14px; -webkit-font-feature-settings: "palt" 1; font-feature-settings: "palt" 1; } #masthead .sns_menu { opacity: 0; position: relative; padding: 1rem 15px 0.75rem; width: 100%; } #masthead .sns_menu_inner { background-color: #fff; border-radius: 10px; padding: 1rem; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; } #masthead .sns_menu i { font-size: 30px; } #masthead .sns_menu i.fa-facebook { color: #305097; } #masthead .sns_menu i.fa-instagram { background: #d6249f; background: -o-radial-gradient(30% 107%, circle, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%); background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%); background-clip: text; -webkit-background-clip: text; color: transparent; } #masthead .sns_menu i.fa-twitter { color: #00aced; } #masthead .sns_menu i.fa-youtube { color: #da1725; } #masthead .nav_search { opacity: 0; padding: 0 15px 2rem; width: 100%; } .scroll-prevent { overflow: hidden; height: 100%; } .slider-caption { background-color: #000; color: #fff; font-family: "A1 Mincho", serif; text-align: center; font-size: 1.125rem; padding: 1rem 0; line-height: 1.4; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; } @media (min-width: 768px) { .slider-caption { font-size: 1.25rem; } } /*-------------------------------------------------------------- # サイドバー --------------------------------------------------------------*/ /*-------------------------------------------------------------- # サイドバー用 --------------------------------------------------------------*/ /*-------------------------------------------------------------- サイドバー --------------------------------------------------------------*/ .widget-area a { color: #343a40; } .widget-area > .widget:not(:first-child) { margin-top: 2rem; } .widget-area ul { padding-left: 0; } .sidebar__widget > .widget { margin-bottom: 3rem; } .widget-title { font-size: 1rem !important; } h2.widget-title { background: #0056d2; padding: 1rem; color: #fff; margin-bottom: 0; } /* カテゴリーウィジェット */ .widget_categories h2:before { font-family: "Font Awesome 5 Pro"; content: ""; margin-right: 0.5rem; display: inline-block; } .widget_categories ul > li { padding: 0.5rem; list-style: none; border-bottom: 1px solid #d9d9d9; border-left: 1px solid #d9d9d9; border-right: 1px solid #d9d9d9; } .widget_categories ul > li a:before { font-family: "Font Awesome 5 Pro"; content: ""; margin-left: -0.2rem; margin-right: 0.4rem; font-size: 0.6rem; display: inline-block; } .widget_categories ul > li a { display: inline-block; padding: 0.5rem; } /* アーカイブウィジェット */ .widget_archive h2:before { font-family: "Font Awesome 5 Pro"; content: ""; margin-right: 0.5rem; display: inline-block; } .widget_archive ul > li { padding: 0.5rem; list-style: none; border-bottom: 1px solid #d9d9d9; border-left: 1px solid #d9d9d9; border-right: 1px solid #d9d9d9; } .widget_archive ul > li a:before { font-family: "Font Awesome 5 Pro"; content: ""; margin-left: -0.2rem; margin-right: 0.4rem; font-size: 0.6rem; display: inline-block; } .widget_archive ul > li a { display: inline-block; padding: 0.5rem; } /* 最新投稿 */ .widget_recent_entries h2:before { font-family: "Font Awesome 5 Pro"; content: ""; margin-right: 0.5rem; display: inline-block; } .widget_recent_entries ul > li { padding: 0.5rem; list-style: none; border-bottom: 1px solid #d9d9d9; border-left: 1px solid #d9d9d9; border-right: 1px solid #d9d9d9; } .widget_recent_entries ul > li a:before { font-family: "Font Awesome 5 Pro"; content: ""; margin-left: -0.2rem; margin-right: 0.4rem; font-size: 0.6rem; display: inline-block; } .widget_recent_entries ul > li a { display: inline-block; padding: 0.5rem; } .widget img { max-width: 100%; height: auto; } /* 最新投稿サムネ付きオリジナル */ .widget_recent_entry__item { border-bottom: 1px solid #d9d9d9; border-left: 1px solid #d9d9d9; border-right: 1px solid #d9d9d9; padding: 1rem; } /* ページローカルナビ（孫まで対応） */ #localNav ul > li { padding: 0.5rem; list-style: none; border-bottom: 1px solid #d9d9d9; border-left: 1px solid #d9d9d9; border-right: 1px solid #d9d9d9; } #localNav ul > li a:before { font-family: "Font Awesome 5 Pro"; content: ""; margin-left: -0.2rem; margin-right: 0.4rem; font-size: 0.6rem; display: inline-block; } #localNav ul > li a { display: inline-block; padding: 0.5rem; } #localNav ul > li ul > li { border: none; } #localNav ul > li ul > li a:before { font-family: "Font Awesome 5 Pro"; content: ""; margin-left: -0.2rem; margin-right: 0.4rem; font-size: 0.6rem; display: inline-block; color: #0056d2; } /*-------------------------------------------------------------- # フッター --------------------------------------------------------------*/ /*-------------------------------------------------------------- # フッタ用 --------------------------------------------------------------*/ /* footer widget */ /* footer info */ #footer__contact { background: #003786; color: white; } #footer__contact .fa-phone { font-size: 2rem; } #footer__contact .tel__no { font-size: 2rem; font-family: "Oswald", sans-serif; } #footer__contact .tel__no a { color: #fff !important; } .footer__info address { line-height: 1.3; } /* footer nav */ .footer-menu ul { list-style: none; margin-bottom: 0; padding-left: 0; padding-top: 1rem; /* @include media-breakpoint-up(md) { li { display: inline-block; } }*/ } .footer-menu ul li { display: inline-block; } .footer-menu ul a { display: block; color: #eee; padding: 1rem; text-align: center; } /* footer__address */ #footer__logo { padding: 10rem; font-size: 0.8rem; /* background-image: url(img/footer-bg.jpg); background-repeat: no-repeat; background-position: center bottom; background-size: cover;*/ } #footer__logo p { margin-bottom: 0; } /* footer copyright */ #footer__copyright { padding: 1rem; font-size: 0.8rem; border-top: 1px solid #fffbc7; } #footer__copyright p { margin-bottom: 0; } .goPageTop { color: #FFF; background: #212529; font-size: 1.5em; line-height: 0.5; padding: 10px; border-radius: 50%; position: fixed; right: 5px; bottom: 5px; z-index: 100000; } .goPageTop:hover { background-color: #212529; color: #fff; } /*-------------------------------------------------------------- # 各ページ用 --------------------------------------------------------------*/ /*-------------------------------------------------------------- # 各ページ用 Bootstrap4 メディアクエリの書き方 @include media-breakpoint-up(xs) { ... } @include media-breakpoint-up(sm) { ... } @include media-breakpoint-up(md) { ... } @include media-breakpoint-up(lg) { ... } @include media-breakpoint-up(xl) { ... } --------------------------------------------------------------*/ /* TOP */ .top_backmovie { position: relative; margin-bottom: 0; } .top_backmovie video { width: 100%; height: auto; animation: fadeIn 2s ease 0s 1 normal; -webkit-animation: fadeIn 2s ease 0s 1 normal; } .top_backmovie figurecaption { animation: fadeIn 4s ease 0s 1 normal; -webkit-animation: fadeIn 4s ease 0s 1 normal; z-index: 10; position: absolute; top: 100px; left: 50px; } .top_backmovie figurecaption img { width: 250px; } @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } .site-content h1 span.top-logo { font-family: "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, sans-serif !important; font-weight: 500; font-size: 2rem; padding-right: 0; } .site-content h1 small { padding-left: 0 !important; } .bg-white.linkbox:hover { background-color: #9e1035 !important; color: white; } .bg-white.linkbox:hover a { color: white; } .page-front .wp-block-buttons { text-align: center; } .page-front .wp-block-columns.img-bg.full-width .wp-block-column, .page-front .wp-block-columns.img-bg.wp-block-cover .wp-block-column { margin-left: 0; } /*共通利用*/ .info { background: rgba(255, 255, 255, 0.9); padding: 1rem 2rem; } .img-bg figure, .img-bg figure { position: relative; overflow: hidden; width: 100%; margin: 0; } .img-bg figure > img, .img-bg figure > img { width: 100%; } .img-bg figure figcaption, .img-bg figure figcaption { position: absolute; top: 0; left: 0; z-index: 2; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.1); -webkit-transition: 0.3s; -webkit-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; opacity: 1; display: table-cell; vertical-align: middle; text-align: center; margin: 0; display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .img-bg figure figcaption div, .img-bg figure figcaption div { width: 100%; } .img-bg figure figcaption a, .img-bg figure figcaption a { background: rgba(255, 255, 255, 0.8); padding: 0.25rem 0.5rem; } .img-bg figure figcaption a:hover, .img-bg figure figcaption a:hover { text-decoration: none; } .img-bg figure:hover figcaption, .img-bg figure:hover figcaption { background: rgba(0, 0, 0, 0.4); } .post__list { border-bottom: 1px dotted #CCC; list-style: none; padding-bottom: 0.4rem; } /* biz Calendar 設定*/ #biz_calendar { max-width: 100%; margin: auto; margin-bottom: 1rem; } #biz_calendar table.bizcal { margin: 0 0 10px; width: 100%; background-color: #ffffff; table-layout: fixed; border: 1px #fffbc7 solid; line-height: 1.6; cursor: default; vertical-align: middle; } #biz_calendar table.bizcal td, #biz_calendar table.bizcal th { border: 1px #fffbc7 solid; } #biz_calendar p span.boxholiday { background-color: #9e1035; padding-left: 25px; margin-right: 10px; } #biz_calendar table.bizcal .holiday { background-color: #9e1035; color: #ffffff; } /*店舗営業日*/ #biz_calendar p span.boxeventday { background-color: #315b34; padding-left: 25px; margin-right: 10px; } #biz_calendar table.bizcal .eventday { background-color: #315b34; color: #ffffff; } #biz_calendar p { margin: 0; line-height: 170%; display: inline-block; padding-right: 1rem; } #biz_calendar table.bizcal .calmonth { text-align: left; font-weight: bold; padding: 1rem; border: none; } .emp-support li { padding-bottom: 1rem; position: relative; } .emp-support li::after { position: absolute; width: 1px; height: 100%; content: ""; background: #ccc; top: 0; left: 0; z-index: -1; } .emp-support li .th { color: #0056d2; padding: 0.5rem; border-left: 8px solid #0056d2; } .emp-support li .td { padding: 1rem; } .emp-support li .td + .td { padding-top: 0; } @media (min-width: 992px) { .emp-support li { padding-bottom: 0; display: -webkit-box; display: -ms-flexbox; display: flex; } .emp-support li::after { content: none; } .emp-support li .th { border-left: none; padding: 1rem; width: 20%; vertical-align: top; border-right: 2px solid #ccc; position: relative; font-weight: 300; -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; } .emp-support li .th::after { position: absolute; content: ""; width: 15px; height: 15px; background-color: #0056d2; top: 1.25rem; right: -0.5rem; } .emp-support li .td { vertical-align: top; } .emp-support li .td + .td { vertical-align: middle; width: 35%; -webkit-box-flex: 1; -ms-flex: 1 0 35%; flex: 1 0 35%; padding-top: 1rem; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: self-start; -ms-flex-align: self-start; align-items: self-start; -ms-flex-wrap: wrap; flex-wrap: wrap; } } /*# sourceMappingURL=style.css.map */