/*
 * /routes/achimura のページ別CSS。
 *
 * もとはWPBakeryの「ページ設定」にDBで持っていたもの（postmeta の _wpb_post_custom_css）。
 * プラグインを消して管理画面から編集できなくなったため、テーマのファイルへ移した。
 *
 * 移すときに、画面のどの要素にも当たらないルールのうち
 * WPBakeryの部品用・ブロックエディタ既定・アイコン用のものを落としている。
 *
 *   4,491字 → 4,154字（ルール 42件を残し 0件を削除）
 *
 * 読み込みは inc/wpbakery-legacy-css.php。元と同じ wp_head 優先度1000の位置に出す。
 */
.test { background: rgb(245, 230, 220); }
#detailContents { background: rgb(245, 230, 220); padding-bottom: 60px; }
#detailCourse { position: relative; counter-reset: count 0; padding-left: 2em; }
.wrap div + div { margin-top: 0em; }
.day-one { margin-top: 2em !important; }
button.slick-next.slick-arrow, button.slick-prev.slick-arrow { margin: 0px 10px; }
.wpcp-slide-image img { max-height: 495px; object-fit: cover; height: 330px !important; }
@media (max-width: 767px){.wpcp-slide-image img { height: 210px !important; }}
#detailContents .date { display: inline-block; position: relative; margin: 0px; padding: 0.8em 2em 0.8em 3.8em; background: rgb(255, 255, 255); border: 2px solid rgb(15, 136, 118); color: rgb(15, 136, 118); fill: rgb(15, 136, 118); font-weight: bold; line-height: 1em; }
#detailCourse::before { content: ""; position: absolute; top: -2em; left: calc(2em - 1px); width: 2px; height: calc(100% + 4em); background: rgb(15, 136, 118); z-index: 1; }
#detailCourse .date { position: relative; margin-left: -2em; z-index: 1; }
#detailCourse .move { position: relative; padding-left: 3.5em; line-height: 1.4em; color: rgb(26, 26, 26); }
#detailCourse > * { margin: 2em 0px; }
#detailCourse .move::before { content: ""; position: absolute; top: calc(50% - 0.5em); left: 0px; border-width: 0.5em; border-style: solid; border-color: transparent transparent transparent rgb(15, 136, 118); border-image: none; }
#detailCourse h3 { color: rgb(61, 61, 61); font-size: 16px; margin-bottom: 10px; }
#detailCourse h3::before { counter-increment: count 1; content: counter(count); position: absolute; left: -1em; width: 2em; height: 2em; margin-top: -0.3em; background: rgb(15, 136, 118); border-radius: 100%; color: rgb(255, 255, 255); text-align: center; line-height: 2em; z-index: 2; }
#detailCourse h3 + div { margin-top: 10px; padding-top: 10px; border-top: 1px solid rgb(180, 180, 180); }
.subTitle { font-size: 14px; color: rgb(61, 61, 61); }
#detailContents .date img { position: absolute; top: calc(50% - 0.8em); left: calc(1.5em - 2px); }
.date img { height: 24px; vertical-align: middle; }
#detailCourse .move img { position: absolute; left: 0.5em; top: calc(50% - 0.5em); fill: rgb(15, 136, 118); font-size: 1.8em; }
.move img { height: 24px; vertical-align: middle; }
#detailCourse section { position: relative; background: rgb(255, 255, 255); padding: 2em 2em 2em 3em; }
@media (max-width: 767px){#detailCourse section { padding: 1em 1em 1em 1.8em; }}
figure { display: block; margin: 0px; }
@media (max-width: 767px) and (orientation: portrait){#detailCourse figure { margin-bottom: 1em; }}
#detailCourse .thumb { padding-top: 66.66%; }
.thumb:not(img) { position: relative; display: block; width: 100%; margin: 0px; padding: 100% 0px 0px; background-size: cover; background-position: center center; background-repeat: no-repeat; object-fit: cover; object-position: center center; overflow: hidden; }
.thumb img { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; object-fit: inherit; object-position: inherit; }
.spotInfo { width: 70%; }
@media (max-width: 767px){.spotInfo { width: 100%; }}
.spotButton { display: block; margin: 12px 0px 0px !important; }
.spotButton a { display: inline-block; width: 100%; color: rgb(255, 255, 255); font-weight: 700; text-align: center; text-decoration: none; padding: 10px 20px; }
.website { border: 4px solid rgb(15, 136, 118); background: rgb(15, 136, 118); border-radius: 100px; }
.map { border: 4px solid rgb(61, 61, 61); background: rgb(61, 61, 61); border-radius: 100px; }
.tabelog { border: 4px solid rgb(240, 153, 11); background: rgb(240, 153, 11); border-radius: 100px; }
.website:hover, .map:hover, .tabelog:hover { opacity: 0.8; }
#detailCourse h4 + div { display: flex; flex-wrap: wrap; justify-content: space-between; }
@media (max-width: 767px) and (orientation: portrait){#detailCourse h4 + div { display: block; }}
#detailCourse h4 + div > * { width: calc(50% - 0.75em); }
@media (min-width: 1200px){#detailCourse h4 + div > * { width: calc(50% - 0.75em); }}
@media (max-width: 767px) and (orientation: portrait){#detailCourse h4 + div > * { width: 100%; }}