@charset "UTF-8";

/*!
Theme Name: Cocoon Child x Fiache
Template: cocoon-master
Version: 1.0.6
*/

/* 子テーマ用のスタイル
** PC main幅 704px
** 切替: 0px - 480px / 481px - 834px / 835px以上
*/

/* 基本表示 ============================== */

:root {
  --cafelatte: #f8f5f4;
  --navy: #28455c;
  --orange: #ffab24;
  --pink: #fa9cae;
  --blue: #5dbcc7;
  --basic-shadow: 0 0 .3em rgba(40, 69, 92, .1);
  --cocoon-text-color: #28455c;
  --cocoon-current-background-color: #e7e6e7;
  --cocoon-basic-border-radius: 9px;
  --cocoon-default-font: 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', 'BIZ UDPGothic', Meiryo, sans-serif;
  --cocoon-badge-border-radius: 5px;
}

body {
  font-feature-settings: 'pkna';
  letter-spacing: .07em;
}

a {
  transition: all .3s 0s ease;
}

@media (hover: hover) {
  a:hover {
    color: var(--pink);
    transition: all .3s 0s ease;
  }
}

a:active {
  color: #bf566d;
}

.text-center {
  text-align: center;
}

.fa-tiktok::before {
  content: '\e07b';
}

button {
  font-family: var(--cocoon-default-font);
}

/* ページ内リンク */
h3.anchor,
nav.anchor {
  display: block;
  padding-top: 100px;
  margin-top: -100px;
}

/* 非表示 */
.fa-folder-open::before, /*カテゴリ名のアイコン*/
.post-date::before, /*投稿日のアイコン*/
.widget-entry-card-date .new-entry-card-update-date, /*新着ウィジェットの記事更新日*/
.popular-entry-card-date.widget-entry-card-date, /*ランキングウィジェットの投稿日と更新日*/
#fiache-recommend .widget-entry-card-update-date, /*おすすめ記事ウィジェットの記事更新日*/
.eye-catch .cat-label, /*アイキャッチのカテゴリラベル*/
.hidden-if-mobile /*モバイルの時*/ {
  display: none;
}

/* header ============================== */

#menu-fiache-mobile-header-bar {
  background: transparent;
  box-shadow: none;
  z-index: 50;
}

.navi-menu-button.menu-button,
.search-menu-button.menu-button {
  align-self: center;
  width: 2.5em;
  height: 2.5em;
  margin: .5em .5em 0 0;
  padding: 0;
  border-radius: 50%;
  box-shadow: var(--basic-shadow);
}

.navi-menu-button.menu-button {
  order: 3;
  background: #e7e6e7;
}

.search-menu-button.menu-button {
  order: 2;
  background: #fff;
}

.mobile-menu-buttons {
  background: transparent;
  box-shadow: none;
}

.mobile-menu-buttons .menu-caption {
  display: none;
}

.mobile-menu-buttons .menu-button-in {
  font-size: 1em;
  line-height: 1;
}

.logo-menu-button .menu-button-in {
  margin: 0 auto 0 0;
  width: fit-content;
  height: 100%;
  padding: .5em 0 0 .4em;
}

.logo-menu-button .site-logo-image {
  height: 37px;
  width: auto;
}

#navi-menu-content {
  left: 100%;
  transform: translateX(0%);
}
#navi-menu-input:checked ~ #navi-menu-content {
  transform: translateX(-100%);
}

/* PC */

.logo-image {
  padding: 45px 0 10px;
  font-size: inherit;
}

/* ロゴ上のキャッチコピー */
#header-in .tagline,
.catch-copy {
  font-size: 12px;
  letter-spacing: .1em;
}

/* グローバルメニュー */
.navi-in .menu-item {
  display: block;
  width: 176px;
  height: 60px;
  line-height: 48px;
}

/* 検索を上からスライドインさせる */
.search-menu-content,
.share-menu-content,
.follow-menu-content {
  top: 70px;
  transform: translateY(-60vh);
  transition: .45s ease;
}

#search-menu-input:checked ~ #search-menu-content {
  transition: .45s ease;
}

/* main container ============================== */

#main {
  max-width: 1050px;
  padding: 1em 0;
  margin: 0 auto;
  background: transparent;
}

.entry-content,
.entry-footer,
#comment-area {
  margin-left: .7rem;
  margin-right: .7rem;
}

.front-top-page .entry-content {
  margin-left: 0;
  margin-right: 0;
}

.entry-footer {
  padding-top: .5em;
}

/* breadcrumb */

#breadcrumb {
  margin: .7rem;
}

#breadcrumb .fas:not(.fa-angle-right),
#breadcrumb .far {
  display: none;
}

/* ページタイトル */
.article h1,
.entry-title,
.archive-title {
  font-size: 20px;
}

/* 記事ページ */

.article .entry-title,
.article h2,
.article h3,
.article h4,
.article h5,
.article h6 {
  line-height: 1.45;
}

.entry-title {
  margin-bottom: 1rem;
  padding-inline: .7rem;
}

.article h2,
.article h3,
.article h4,
.article h5,
.article h6 {
  margin-top: 2em;
}

.article h2:not(.comment-title, .section-title) {
  background: var(--navy);
  border-radius: 3px;
  color: #fff;
  font-size: 1.25rem;
}

.article h3 {
  padding: .2em 0 .2em 1.2em;
  border: none;
  position: relative;
  font-size: 1.17rem;
  clear: both;
}

.article h3::before {
  content: '';
  display: block;
  width: .6em;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  background: var(--navy);
  border-radius: 3px;
}

/* アイキャッチ */
.eye-catch-wrap {
  justify-content: center;
}

/* 目次 */

.toc {
  min-width: 250px;
  background: #fff;
  border-radius: var(--cocoon-basic-border-radius);
}

.toc-title {
  position: relative;
}

.toc-title::after {
  content: 'OPEN';
  position: absolute;
  top: 50%;
  bottom: 0;
  right: 0;
  margin: 0;
  color: #f489a0;
  font-weight: bold;
  transform: translateY(-50%);
}
.toc-checkbox:checked + .toc-title::after {
  content: 'CLOSE';
}

.toc-list.open {
  margin: 0 0 0 5px;
  text-align: left;
}

.toc .toc-list ul,
.toc .toc-list ol {
  padding-left: 1em;
}

/* インスタ画像 中央揃え */
.instagram-center {
  margin: 0 auto;
  max-width: 350px;
}

/* 記事フッター */

.entry-categories .fa-folder,
.entry-tags .fa-tag {
  display: none;
}

.entry-tags .tag-link::before {
  content: '#';
}

/* 固定ページの記事フッターの余白 */
.page .article-footer {
  padding: 0;
}

/* 小説記事 */

.article.article-fiache-novel {
  margin: 0 0 1em;
  padding: .5em 0 2em;
  background: 0 0 / 100% repeat url(/image/natural-paper.png), #d4d0c9;
  font-family: 'Hina Mincho', serif;
  font-weight: 600;
  text-shadow: -1px -1px .5px rgb(0, 0, 0, .13), 1px 1px 1px rgb(255, 255, 255, .25);
}

#fiache-novel-series-title {
  display: block;
  width: fit-content;
  margin: 1em auto 0;
  padding: 0 1.5em .5em;
  text-align: center;
  line-height: 1.3;
}

#fiache-novel-series-title .novel-subtitle {
  font-size: small;
}

#fiache-novel-series-title::after {
  content: '';
  display: block;
  width: 2em;
  height: 4px;
  margin: 1em auto 0;
  background: rgba(77, 45, 30, .5);
  border-radius: 100px;
}

.article.article-fiache-novel .entry-title {
  margin-bottom: 1.2em;
  text-align: center;
}

.article.article-fiache-novel .eye-catch-wrap {
  width: 80%;
  margin: 1em auto;
}

.article.article-fiache-novel .entry-content {
  margin-top: 2em;
  margin-bottom: 4em;
}

.article.article-fiache-novel .entry-categories-tags {
  padding: 0 10px;
}

.article.article-fiache-novel .author-card {
  margin-top: 4em;
}

.article.article-fiache-novel .author-card,
.article.article-fiache-novel .author-card .archive-link::after {
  border-color: #776959;
}
.article.article-fiache-novel .author-card .author-position {
  color: rgba(51, 51, 51, .7);
}

.article.article-fiache-novel .easyLink-box {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, Meiryo, 'Open Sans', 'Helvetica Neue', sans-serif;
  font-weight: 500;
  text-shadow: none;
}

/* セルフチェック */

#selfcheck-chart {
  position: relative;
  min-height: 300px;
  border-radius: var(--cocoon-basic-border-radius);
  overflow: hidden;
}

#selfcheck-chart::before,
#selfcheck-chart::after {
  content: '';
  width: min(100%, 300px);
  height: 0;
  margin: auto;
  padding-top: min(100%, 300px);
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  transform-origin: center;
  z-index: -10;
}
#selfcheck-chart::before {
  background: center / contain no-repeat url(/f.wp/wp-content/themes/cocoon-child-fiache2023/image/selfcheck-base-gray.png);
  animation: rotate 40s 0s infinite;
}
#selfcheck-chart::after {
  background: center / contain no-repeat url(/f.wp/wp-content/themes/cocoon-child-fiache2023/image/selfcheck-base-white.png);
  animation: rotate 30s 0s linear infinite reverse;
}

@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(180deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.selfcheck-card {
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  width: min(100%, 350px);
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  transition: .3s ease;
}

.selfcheck-card.pre,
.selfcheck-card.used {
  opacity: 0;
  visibility: hidden;
}

.selfcheck-card.pre {
  transition: opacity .3s ease, visibility 0s .3s ease;
}

.selfcheck-card.visible {
  opacity: 1;
  visibility: visible;
}

.selfcheck-card .selfcheck-question,
.selfcheck-card .goal-lead {
  margin: 0 0 .5em;
}

.selfcheck-card .selfcheck-question {
  font-weight: 600;
}

#selfcheck-chart .selfcheck-cover-title {
  text-align: center;
  font-weight: 600;
  font-size: 1.3em;
  margin: 0 0 1em;
}

.selfcheck-cover-button,
.selfcheck-answer-button {
  width: fit-content;
  margin: .7em auto 0;
  padding: .3em .5em;
  background: none;
  border: none;
  border-bottom: 3px solid;
  border-radius: 0;
  color: var(--navy);
  font-weight: 600;
  font-size: 1em;
}

.selfcheck-cover-button .fa-arrow-right,
.selfcheck-answer-button .fa-arrow-right {
  margin-left: .3em;
}

.selfcheck-card .goal-title {
  border-bottom: 3px solid;
  font-weight: 600;
  font-size: 1.3em;
  text-decoration: none;
}
.selfcheck-card .goal-title::after {
  content: '\f061';
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  margin-left: .2em;
}

/* にゃんまる心理テスト */

.article .fi-pt-title {
  min-height: 140px;
  margin: 1em 0 3em;
  padding: 1.8em 100px 1.2em 1.3em;
  position: relative;
  background: #f5e6bc;
  border-radius: 30px;
  font-size: 17px;
  text-align: left;
}
.article .fi-pt-title::before {
  content: '';
  display: block;
  width: 43px;
  height: 38px;
  position: absolute;
  top: -1em;
  left: 1.3em;
  background: 0 0 / contain no-repeat url(https://fiache.jp/f.wp/wp-content/uploads/2021/12/question-orange.png);
}
.article .fi-pt-title::after {
  content: '';
  display: block;
  width: 100px;
  height: 200px;
  position: absolute;
  bottom: -1.8em;
  right: -5px;
  background: 100% 100% / contain no-repeat url(https://fiache.jp/f.wp/wp-content/uploads/2021/12/cat.png);
}

.article p.fi-pt-p {
  margin: .8rem auto;
}

.article .fi-pt-choose {
  display: block;
  width: 100%;
  max-width: 350px;
  margin: 0 auto;
  padding: 10px 45px 10px 20px;
  background: 96% center / 35px auto no-repeat url(https://fiache.jp/f.wp/wp-content/uploads/2021/12/pawpad-orange-2.png);
  border: 5px solid #ffab24;
  border-radius: 100vh;
  color: #333;
  text-decoration: none;
  line-height: 1.45;
}
.article .fi-pt-choose.last {
  margin-bottom: 3em;
}

.article .fi-pt-answer {
  margin-top: 0;
  padding: 3em 5px .5em;
  border-bottom: 5px solid #ffab24;
}
.article .fi-pt-answer::before {
  content: '';
  display: inline-block;
  width: 32px;
  height: 32px;
  margin-right: 8px;
  background: 0 center / cover no-repeat url(https://fiache.jp/f.wp/wp-content/uploads/2021/12/pawpad-orange-1.png);
  vertical-align: bottom;
}

.article.tag-psychological-test-love-post .fi-pt-title::before {
  background-image: url(https://fiache.jp/f.wp/wp-content/uploads/2021/12/question-pink-1.png);
}
.article.tag-psychological-test-love-post .fi-pt-choose {
  background-image: url(https://fiache.jp/f.wp/wp-content/uploads/2021/12/pawpad-pink-2-1.png);
}
.article.tag-psychological-test-love-post .fi-pt-answer::before {
  background: 0 center / cover no-repeat url(https://fiache.jp/f.wp/wp-content/uploads/2021/12/pawpad-pink-1-1.png);
}
.article.tag-psychological-test-love-post .fi-pt-choose,
.article.tag-psychological-test-love-post .fi-pt-answer {
  border-color: #f6789e;
}

.article.tag-psychological-test-interesting-post .fi-pt-title::before {
  background-image: url(https://fiache.jp/f.wp/wp-content/uploads/2021/12/question-green.png);
}
.article.tag-psychological-test-interesting-post .fi-pt-choose {
  background-image: url(https://fiache.jp/f.wp/wp-content/uploads/2021/12/pawpad-green-2.png);
}
.article.tag-psychological-test-interesting-post .fi-pt-answer::before {
  background: 0 center / cover no-repeat url(https://fiache.jp/f.wp/wp-content/uploads/2021/12/pawpad-green-1.png);
}
.article.tag-psychological-test-interesting-post .fi-pt-choose,
.article.tag-psychological-test-interesting-post .fi-pt-answer {
  border-color: #6ec11e;
}

.article.tag-psychological-test-dark-post {
  padding: .8em;
  background-color: #eee;
}
.article.tag-psychological-test-dark-post .fi-pt-title {
  background-color: #d4c8df;
}
.article.tag-psychological-test-dark-post .fi-pt-title::before {
  background-image: url(https://fiache.jp/f.wp/wp-content/uploads/2022/03/question-purple.png);
}
.article.tag-psychological-test-dark-post .fi-pt-title::after {
  background: 100% 100% / contain no-repeat url(https://fiache.jp/f.wp/wp-content/uploads/2022/03/cat-dark.png);
}
.article.tag-psychological-test-dark-post .fi-pt-choose {
  background-image: url(https://fiache.jp/f.wp/wp-content/uploads/2022/03/pawpad-purple-2.png);
  background-color: #fff;
}
.article.tag-psychological-test-dark-post h2 {
  background-color: #705882;
  color: #fff;
}
.article.tag-psychological-test-dark-post .fi-pt-answer::before {
  background: 0 center / cover no-repeat url(https://fiache.jp/f.wp/wp-content/uploads/2022/03/pawpad-purple-1.png);
}
.article.tag-psychological-test-dark-post .fi-pt-choose,
.article.tag-psychological-test-dark-post .fi-pt-answer {
  border-color: #6f5782;
}
.article.tag-psychological-test-dark-post .zucks_wrapbox {
  background-color: #fff;
}

/* ララちゃん記事 */

.article.article-fiache-laralab {
  background: #f1ebe6;
  color: #4c3322;
  font-family: 'Kaisei Opti', serif;
  text-align: center;
}

.article.article-fiache-laralab .laralab-introduction {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 200px;
  padding: 1em;
  background: 50% 50% / 100% 100% no-repeat url(https://fiache.jp/f.wp/wp-content/uploads/2021/12/laralab-cloud-2x.png);
  color: #4c3322;
  font-size: 0.9rem;
}

.article.article-fiache-laralab .laralab-first-heading {
  padding: 1em;
  background: none;
  border-top: 5px double #4c3322;
  border-bottom: 5px double #4c3322;
}

.article.article-fiache-laralab .larachan-thoughts {
  margin: 130px 10px 10px;
  padding: 95px 10px 10px;
  background: #fde1b8;
  box-shadow: #fde1b8 0 0 10px 5px;
  border-radius: 10px;
  position: relative;
}
.article.article-fiache-laralab .larachan-thoughts::before {
  content: '';
  display: block;
  width: 100%;
  height: 180px;
  position: absolute;
  top: -95px;
  left: 0;
  background: center / contain no-repeat url(https://fiache.jp/f.wp/wp-content/uploads/2021/12/larachan-thoughts-2x.png);
}

.article.article-fiache-laralab .laralab-item-wrap {
  background: #fdcab8;
  border-radius: 20px;
  margin-top: 70px;
  padding: 60px 1.8em 2em;
  position: relative;
}

.article.article-fiache-laralab .laralab-item-heading {
  color: white;
  background: #f98289;
  width: 250px;
  margin-left: auto;
  margin-right: auto;
  padding: 20px;
  position: absolute;
  top: -60px;
  left: 0;
  right: 0;
  border: 2px dashed rgba(255, 255, 255, .5);
  border-radius: 6px;
  box-shadow: 0 0 0 5px #f98289, 0 2px 3px 5px rgba(0, 0, 0, .5);
  font-size: 1.1rem;
}

.article.article-fiache-laralab .balloon-comment {
  background: #fff;
  border-color: transparent;
  box-shadow: 0 2px 4px rgba(102, 68, 21, .5);
  text-align: left;
}
.article.article-fiache-laralab .balloon-comment::before {
  border-color: transparent;
}

.article.article-fiache-laralab .marker-under {
  background: linear-gradient(transparent 60%, rgba(249, 130, 137, .4) 60%);
}

.article.article-fiache-laralab .instagram-media {
  margin: 1em auto !important;
}

.article.article-fiache-laralab .entry-tags .tag-link {
  background: #fff;
}

/* Q&A記事 */

.introductory_sentence {
  font-size: .9em;
  color: #777;
}

.question_f,
.answer {
  display: block;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
}

.answer {
  margin-bottom: 2em;
}

.question-img-wrap,
.answer-img-wrap {
  display: flex;
  align-items: center;
}

.question-img-wrap::before,
.question-img-wrap::after,
.answer-img-wrap::before,
.answer-img-wrap::after {
  content: '';
  height: 3px;
  flex-grow: 1;
}
.question-img-wrap::before,
.question-img-wrap::after {
  background: var(--blue);
}
.answer-img-wrap::before,
.answer-img-wrap::after {
  background: var(--pink);
}

.question_f .question-img,
.answer .answer-img {
  display: block;
  margin: 0 1em;
  width: fit-content;
  flex-shrink: 0;
  flex-grow: 0;
}

/* 記事リスト */

/* .entry-card: カテゴリアーカイブ
** .new-entry-card: 新着記事リスト
** .popular-entry-card: 人気記事リスト
** .related-entry-card: 関連記事リスト
** .widget-entry-card: ウィジェットの記事リスト(新着、人気) */

.archive #list,
.body.blog #list {
  padding: 10px;
}

.a-wrap,
.entry-card-wrap,
.related-entry-card-wrap,
.widget-entry-cards .a-wrap {
  margin-bottom: auto;
  padding: 7px 0;
  border-bottom: 1px solid #ebebeb;
  font-size: .95rem;
}

.a-wrap:hover {
  background: rgba(250, 156, 174, .15);
}

.entry-card,
.related-entry-card,
.widget-entry-card {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  font-size: 14px;
  column-gap: 10px;
}

.entry-card.cf::after,
.related-entry-card.cf::after,
.widget-entry-card.cf::after,
#fiache-recommend .cf::after,
.popular-entry-cards .cf::after {
  content: none;
}

.entry-card-thumb,
.related-entry-card-thumb,
.widget-entry-card-thumb {
  width: auto;
  margin: 0;
  padding: 0;
  flex-basis: 85px;
  flex-shrink: 0;
}

.entry-card-thumb-image,
.related-entry-card-thumb .wp-post-image,
.widget-entry-card-thumb .wp-post-image {
  border-radius: var(--cocoon-basic-border-radius);
  vertical-align: middle;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

.entry-card-content,
.related-entry-card-content,
.widget-entry-cards .widget-entry-card-content {
  flex-basis: 100%;
  align-self: stretch;
  margin-left: 0;
  padding-bottom: 0;
  position: relative;
}

.entry-card-title,
.related-entry-card-title,
.widget-entry-card-title {
  display: inline-block;
  margin: 0 0 1.3em;
  padding: 0;
  font-size: unset;
  font-weight: normal;
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.e-card .entry-category {
  font-size: .8em;
}

.e-card .post-date,
.e-card .post-update,
.e-card .post-author {
  font-size: .8em;
  opacity: 0;
}

.entry-card-snippet,
.related-entry-card-snippet {
  font-size: 14px;
  line-height: 1.45;
}
.entry-card-snippet {
  display: block;
  display: -webkit-inline-box;
  max-height: 6em;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

.e-card-info .fa,
.e-card-info .fa-clock,
.e-card .cat-label {
  display: none;
}

.entry-card-meta,
.related-entry-card-meta {
  width: 100%;
}

.entry-card-categorys.e-card-categorys,
.related-entry-card-categorys.e-card-categorys {
  display: block;
  color: var(--orange);
  font-weight: 600;
  position: absolute;
  left: 0;
  bottom: 0;
}

/* 投稿下の記事リスト */

.under-entry-content .related-list,
.under-entry-content .new-entry-cards {
  margin: 0 .7rem;
}

/* ページネーション */

.pagination-next {
  margin: 2em auto 0;
  width: calc(100% - 1.4em);
}

.pagination-next-link {
  border: none;
  border-radius: var(--cocoon-basic-border-radius);
  background: var(--navy);
  color: #fff;
  font-weight: 600;
}

.page-numbers {
  background: #fff;
  border: none;
  box-shadow: var(--basic-shadow);
}
.pagination .page-numbers:hover {
  background: var(--cocoon-current-background-color);
}

.prev.page-numbers,
.next.page-numbers {
  background: var(--navy);
  color: #fff;
}

.pagination-next-link:hover,
.prev.page-numbers:hover,
.next.page-numbers:hover {
  background: var(--navy);
  color: #fff;
  opacity: .7;
}

.page-numbers.current {
  border: none;
}

.page-numbers.dots {
  background: transparent;
  box-shadow: none;
  border: none;
}
.page-numbers.dots:hover {
  background: transparent;
}

/* 記事リスト */

/* 投稿日のスタイル */
.new-entry-card-content {
  padding-bottom: 1em;
}
.new-entry-card-date,
#fiache-recommend .widget-entry-card-date {
  position: absolute;
  bottom: 0;
  right: 0;
  line-height: 1;
}
.new-entry-card-post-date.post-date,
#fiache-recommend .post-date {
  display: block;
  position: absolute;
  right: 0;
  bottom: 0;
  opacity: 0;
  font-size: .8em;
}

/* 新着記事ウィジェット 上3記事だけNEW!を出す */
.new-entry-card-link:first-child figure::after,
.new-entry-card-link:nth-of-type(2) figure::after,
.new-entry-card-link:nth-of-type(3) figure::after {
  content: 'NEW!';
  display: inline-block;
  margin: 0;
  padding: 3px 7px;
  position: absolute;
  left: -3px;
  top: -3px;
  background-color: var(--pink);
  border-radius: 100vw;
  color: #fff;
  font-size: x-small;
  font-weight: bolder;
  font-family: sans-serif;
  letter-spacing: .2em;
}

/* 記事ページ > 関連記事リスト */

/* SNSシェアボタン下ウィジェットと
** 関連記事リストと
** 関連記事下ウィジェットのタイトルを揃える */
.widget-below-sns-buttons-title,
.related-entry-heading,
.widget-below-related-entries-title {
  margin: 3em 0 1.5em;
  font-size: 1.3em;
  font-weight: bold;
  text-align: center;
}
.archive #list .cat-label,
.body.blog #list .cat-label {
  border: none;
  background: rgba(51, 51, 51, .8)
}
.archive #list .cat-label-6,
.body.blog #list .cat-label-6 {
  background: rgba(248, 86, 121, .85); /*Beauty*/
}
.archive #list .cat-label-7,
.body.blog #list .cat-label-7 {
  background: rgba(55, 202, 186, .85); /*Fashion*/
}
.archive #list .cat-label-8,
.body.blog #list .cat-label-8 {
  background: rgba(255, 171, 36, .85); /*Lifestyle*/
}

/* news_list shortcode */

.fi-news-list {
  display: flex;
  flex-flow: row wrap;
  row-gap: 1em;
  column-gap: 2em;
  margin: clamp(1em, 3.5vw, 2em);
}

.fi-news-item {
  flex-basis: 100%;
  display: flex;
  flex-flow: row nowrap;
  column-gap: .6em;
  row-gap: .7em;
  padding: 0 0 1em;
  border-bottom: 1px solid #ebebeb;
  min-width: 200px;
  font-size: .95rem;
  text-decoration: none;
}

.fi-news-item-img-wrap {
  flex-basis: 43%;
  flex-shrink: 0;
  flex-grow: 0;
}

.fi-news-item-img {
  aspect-ratio: 16 / 9;
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: var(--cocoon-basic-border-radius);
  vertical-align: middle;
}

.fi-news-item-content {
  flex-grow: 1;
  position: relative;
}

.fi-news-item-content .fi-news-item-title,
.fi-news-item-content .fi-news-item-cat,
.fi-news-item-content .fi-news-item-date {
  margin: 0;
}

.fi-news-item-content .fi-news-item-title {
  display: -webkit-box;
  height: calc(1em * 1.35 * 3);
  margin-bottom: 1.5em;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.35;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
}

.fi-news-item-cat,
.fi-news-item-date {
  position: absolute;
  bottom: 0;
  font-size: .8em;
}

.fi-news-item-cat {
  left: 0;
  color: var(--navy);
  font-weight: 600;
  /* max-width: 50%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis; */
}
.fi-news-item-cat.cat-30s-answer {
  color: var(--blue);
}
.fi-news-item-cat.cat-selfcheck {
  color: var(--orange);
}

.fi-news-item-date {
  right: 0;
  opacity: 0;
}

/* 人気記事リスト */
.widget-entry-cards.ranking-visible {
  counter-reset: p-rank;
}
.widget-entry-cards.ranking-visible .card-thumb {
  counter-increment: p-rank;
}
.widget-entry-cards.ranking-visible .no-1 .card-thumb::before,
.widget-entry-cards.ranking-visible .no-2 .card-thumb::before,
.widget-entry-cards.ranking-visible .no-3 .card-thumb::before {
  background: #f5bcd3;
}
.widget-entry-cards.ranking-visible .card-thumb::before {
  content: counter(p-rank);
  width: 20px;
  height: 20px;
  padding: 2px;
  position: absolute;
  top: -5px;
  left: -5px;
  background: #b1b1b3;
  border: 1px solid #fff;
  border-radius: 18px;
  opacity: 1;
  z-index: 2;
  color: #fff;
  font-size: 14px;
  font-family: Arial, sans-serif;
  line-height: 20px;
  text-align: center;
}

/* PV数 */
.popular-entry-card.widget-entry-card {
  position: relative;
}

.widget-entry-card-pv,
.widget-entry-card-pv.popular-entry-card-pv {
  display: none;
}

#custom_html-32 .category-title-1,
#custom_html-32 .category-title-2,
#custom_html-32 .category-title-3 {
  margin-top: .7em;
  padding: .2em .5em;
}

#fiache-recommend {
  column-count: 2;
  column-width: 300px;
  column-gap: 1em;
  margin: .7em;
}

/* 人気記事ランキングページ */

.body.page-id-4167 #main {
  padding: 0;
}

.body.page-id-4167 .article-header .date-tags {
  display: none;
}

.body.page-id-4167 #main .widget-entry-cards.ranking-visible .card-thumb::before {
  width: auto;
  min-width: 16px;
}

/* コメント */

.article .comment-title {
  margin-top: 3.5em;
  background: none;
  text-align: center;
}

.comment-form {
  margin-bottom: 3em;
}
.comment-btn,
.comment-form .submit {
  border: 2px solid;
  border-radius: var(--cocoon-basic-border-radius);
  background: #fff;
}

/* アーカイブページ */

.archive.category .cat-label,
.entry-card-snippet,
body.author h1 {
  display: none;
}

/* タグアーカイブページ */

.tag .fa-tags::before {
  content: '#';
}
.archive.tag .cat-label {
  top: 0;
  left: calc(1.6% + 3px);
  border: none;
}
.archive.tag .cat-label-6 {
  background-color: rgba(248, 86, 121, .7);
}
.archive.tag .cat-label-7 {
  background-color: rgba(55, 202, 186, .7);
}
.archive.tag .cat-label-8 {
  background-color: rgba(255, 171, 36, .7);
}

/* 投稿者アーカイブページ */

body.author #author-wrap {
  display: block;
  padding: 10px 10px 0;
}
body.author #author-header {
  width: 100%;
  text-align: center;
  line-height: normal;
}
body.author #author-header .author-thumb {
  display: inline-block;
  width: 120px;
  height: 120px;
  margin: 0;
  background-size: cover;
  border: 3px solid #f5bcd3;
  border-radius: 50%;
  float: none;
}
body.author .author-name {
  display: block;
  margin-bottom: .2em;
  font-weight: 600;
  font-size: large;
}
body.author span.author-position {
  margin-bottom: .3em;
  color: #999;
  font-size: small;
}
#author-wrap #custom_html-25 {
  width: 48%;
}
body.author #author-description {
  margin: 1em 0 2em;
  padding: 0 10px;
  font-size: .9em;
}
body.author #author-description p {
  margin: 0 0 1em;
}
body.author #main > h2 {
  display: flex;
  align-items: center;
}
body.author #main > h2::before,
body.author #main > h2::after {
  content: '';
  flex-grow: 1;
  height: 1px;
  background: #ccc;
}
body.author #main > h2::before {
  margin-right: .5em;
}
body.author #main > h2::after {
  margin-left: .5em;
}

/* 関連記事 */

#rel-list .widget-entry-card-content {
  position: relative;
}
#rel-list .card-title {
  margin-bottom: 1.2em;
}
#rel-list .widget-entry-card-meta {
  display: flex;
  justify-content: space-between;
  position: absolute;
  bottom: 0;
  width: 100%;
}
#rel-list .cat-name {
  display: block;
  position: absolute;
  top: 0;
  z-index: 1;
  padding: 2px;
  background: none;
  color: #ccc;
  font-size: .7em;
  font-weight: bold;
}

/* Cocoonの記事拡張スタイル Fiache.仕様 */

/* バッジ */
.badge-f-main { background-color: #f489a0; }
.badge-f-pink { background-color: #f85679; }
.badge-f-blue { background-color: #37caba; }
.badge-f-orange { background-color: #ffab24; }
.badge-f-main,
.badge-f-pink,
.badge-f-blue,
.badge-f-orange {
  padding: 1px 5px 0;
  border-radius: 2px;
  color: #fff;
  font-size: 12px;
}

/* ボタン */
.btn-f-main { background-color: #f489a0; }
.btn-f-pink { background-color: #f85679; }
.btn-f-blue { background-color: #37caba; }
.btn-f-orange { background-color: #ffab24; }

/* 文字 */
/* 色付き */
.f-main { color: #f489a0; }
.f-pink { color: #f85679; }
.f-blue { color: #37caba; }
.f-orange { color: #ffab24; }
/* 色付き太字 */
.bold-f-main { font-weight: bold; color: #f489a0; }
.bold-f-pink { font-weight: bold; color: #f85679; }
.bold-f-blue { font-weight: bold; color: #37caba; }
.bold-f-orange { font-weight: bold; color: #ffab24; }
.bold-f-yellow { font-weight: bold; color: #ffd000; }
/* 下線 */
.f-main-under { border-bottom: 2px solid #f489a0; }
.f-pink-under { border-bottom: 2px solid #f85679; }
.f-blue-under { border-bottom: 2px solid #37caba; }
.f-orange-under { border-bottom: 2px solid #ffab24; }
.f-yellow-under { border-bottom: 2px solid #ffd000; }
/* マーカー */
.marker-f-main { background-color: #ffd8de; }
.marker-f-pink { background-color: #ffe5e7; }
.marker-f-blue { background-color: #c7eee7; }
.marker-f-orange { background-color: #ffe2ba; }
/* 下線マーカー */
.marker-under-f-main { background: linear-gradient(transparent 60%,#ffd8de 60%); }
.marker-under-f-pink { background: linear-gradient(transparent 60%,#ffe5e7 60%); }
.marker-under-f-blue { background: linear-gradient(transparent 60%,#c7eee7 60%); }
.marker-under-f-orange { background: linear-gradient(transparent 60%,#ffe2ba 60%); }
.marker-under-a-pink { background: linear-gradient(transparent 60%, rgba(248, 86, 121, .7) 60%); }
.marker-under-a-blue { background: linear-gradient(transparent 60%, rgba(55, 202, 186, .7) 60%); }
.marker-under-a-orange { background: linear-gradient(transparent 60%, rgba(255, 160, 29, .7) 60%); }

/* 囲み */
/* 白抜きボックス */
.blank-box.bb-f-main { border-color: #f489a0; }
.blank-box.bb-f-pink { border-color: #f85679; }
.blank-box.bb-f-blue { border-color: #37caba; }
.blank-box.bb-f-orange { border-color: #ffab24; }
/* 付箋風ボックス */
.blank-box.sticky.st-f-main { border-color: #f489a0; background-color: #ffd8de; }
.blank-box.sticky.st-f-pink { border-color: #f85679; background-color: #ffe5e7; }
.blank-box.sticky.st-f-blue { border-color: #37caba; background-color: #c7eee7; }
.blank-box.sticky.st-f-orange { border-color: #ffab24; background-color: #ffe2ba; }
/* タブボックス */
.blank-box.bb-tab.bb-f-pink { border-color: #f489a0; }
.blank-box.bb-tab.bb-f-pink .bb-label { background-color: #f489a0; }

/* ショートコード ============================== */

/* 投稿者カード [author_card] */

/* 記事ページ用 */
.single-post .author-card,
.page-template .author-card,
.post-type-archive .author-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: .5em;
  border: 3px solid #f5bcd3;
  border-radius: 5px;
}
.single-post .author-card .author-thumb,
.page-template .author-card .author-thumb,
.post-type-archive .author-card .author-thumb {
  flex-shrink: 0;
  align-self: center;
  width: 100px;
  height: 100px;
  margin: 0 0 .5em;
  background-size: cover;
  border-radius: 50%;
}
.single-post .author-card .author-content,
.page-template .author-card .author-content,
.post-type-archive .author-card .author-content {
  margin: .3em 0 0;
}
.single-post .author-card .author-name,
.page-template .author-card .author-name,
.post-type-archive .author-card .author-name{
  display: block;
  margin: 0 10px .2em auto;
  font-size: 1.1em;
  font-weight: bold;
  line-height: 1.4;
  text-align: center;
}
.single-post .author-card .author-position,
.page-template .author-card .author-position,
.post-type-archive .author-card .author-position {
  display: block;
  margin: 0 auto .5em;
  color: #999;
  font-size: small;
  text-align: center;
}
.single-post .author-card .author-description,
.page-template .author-card .author-description,
.post-type-archive .author-card .author-description {
  display: block;
}
.single-post .author-card .author-description p,
.page-template .author-card .author-description p,
.post-type-archive .author-card .author-description p {
  margin: .3em 0 .5em;
  font-size: .9em;
  line-height: 1.45;
}
.single-post .author-card .archive-link,
.page-template .author-card .archive-link,
.post-type-archive .author-card .archive-link {
  display: table;
  margin: 0 0 0 auto;
  padding: 0 .6em;
  font-size: small;
  text-decoration: none;
}
.post-type-archive-cafe_custom .author-card .archive-link {
  color: #fff;
}

.single-post .author-card .archive-link::after,
.page-template .author-card .archive-link::after,
.post-type-archive .author-card .archive-link::after {
  content: '';
  display: inline-block;
  width: .6em;
  height: .6em;
  margin-left: .3em;
  border-top: 2px solid #f5bcd3;
  border-right: 2px solid #f5bcd3;
  transform: rotate(45deg);
}

/* ふきだし [author_balloon] */

.author-balloon .author-balloon-info {
  display: grid;
  grid-template-rows: 30px 30px;
  text-decoration: none;
}
.author-balloon.author-icon-s .author-balloon-info {
  grid-template-rows: 50px 1fr auto;
}

.author-balloon .author-thumb {
  width: 100%;
  height: 100%;
  margin: 0;
  grid-row: 1 / 3;
  background-size: cover;
  border-radius: 50%;
}
.author-balloon .author-name {
  font-weight: bold;
}
.author-balloon .author-position {
  color: #999;
  font-size: small;
}

/* アイコンが左、吹き出しが右 */
.author-balloon.author-icon-left .author-balloon-info {
  grid-template-columns: 60px 1fr;
}
.author-balloon.author-icon-left .author-thumb {
  grid-column: 1 / 2;
}
.author-balloon.author-icon-left .author-name {
  margin: auto auto 0 10px;
}
.author-balloon.author-icon-left .author-position {
  margin: 0 auto auto 10px;
}

/* 吹き出しが左、アイコンが右 */
.author-balloon.author-icon-right .author-balloon-info {
  grid-template-columns: 1fr 60px;
}
.author-balloon.author-icon-right .author-thumb {
  grid-column: 2 / 3;
}
.author-balloon.author-icon-right .author-name {
  margin: auto 10px 0 auto;
}
.author-balloon.author-icon-right .author-position {
  margin: 0 10px auto auto;
}

/* small */
.author-balloon.author-icon-left.author-icon-s,
.author-balloon.author-icon-right.author-icon-s {
  display: flex;
  display: -webkit-flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  margin: 5px 0;
}
.author-balloon.author-icon-left.author-icon-s {
  flex-direction: row;
  justify-content: flex-start;
}
.author-balloon.author-icon-right.author-icon-s {
  flex-direction: row-reverse;
  justify-content: flex-end;
}
.author-balloon.author-icon-left.author-icon-s .author-balloon-info,
.author-balloon.author-icon-right.author-icon-s .author-balloon-info {
  flex-grow: 0;
  flex-shrink: 0;
  margin: 0;
  grid-template-columns: 50px;
}
.author-balloon.author-icon-left.author-icon-s .author-thumb,
.author-balloon.author-icon-right.author-icon-s .author-thumb {
  grid-column: 1 / 2;
  grid-row: 1 / 2;
}
.author-balloon.author-icon-left.author-icon-s .author-name,
.author-balloon.author-icon-right.author-icon-s .author-name,
.author-balloon.author-icon-left.author-icon-s .author-position,
.author-balloon.author-icon-right.author-icon-s .author-position {
  font-size: 12.5px;
  line-height: 1.35;
  word-break: break-all;
}
.author-balloon.author-icon-left.author-icon-s .author-name,
.author-balloon.author-icon-right.author-icon-s .author-name {
  margin: 5px auto;
}
.author-balloon.author-icon-left.author-icon-s .author-position,
.author-balloon.author-icon-right.author-icon-s .author-position {
  margin: 0 auto 5px;
}

/* 吹き出し */
.author-balloon .balloon-comment {
  margin: 15px 0;
  padding: 1px .5em;
  position: relative;
  border: 1px solid #999;
  background: #fff;
  border-radius: 5px;
}
.author-balloon .balloon-comment::before {
  content: '';
  display: block;
  width: 12px;
  height: 12px;
  margin-top: -7.3px;
  position: relative;
  background: #fff;
  border-top: 1px solid #999;
  border-right: 1px solid #999;
  transform: rotate(-45deg);
}
.author-balloon.author-icon-left .balloon-comment::before {
  margin-left: 10%;
}
.author-balloon.author-icon-right .balloon-comment::before {
  margin-left: 90%;
}
.balloon-comment p {
  margin: 0 0 1em;
  line-height: 1.5em;
}

/* small */
.author-balloon.author-icon-left.author-icon-s .balloon-comment,
.author-balloon.author-icon-right.author-icon-s .balloon-comment {
  flex-grow: 1;
  padding: 5px 8px;
  line-height: 1.45;
}
.author-balloon.author-icon-left.author-icon-s .balloon-comment {
  margin: 5px auto 10px 15px;
}
.author-balloon.author-icon-right.author-icon-s .balloon-comment {
  margin: 5px 15px 10px auto;
}
.author-balloon.author-icon-left.author-icon-s .balloon-comment::before,
.author-balloon.author-icon-right.author-icon-s .balloon-comment::before {
  margin: 0;
  position: absolute;
  top: 12px;
}
.author-balloon.author-icon-left.author-icon-s .balloon-comment::before {
  left: -7px;
  transform: rotate(225deg);
}
.author-balloon.author-icon-right.author-icon-s .balloon-comment::before {
  right: -7px;
  transform: rotate(45deg);
}

/* スライダーショートコード [fiache_slider] 基本設定 */
.fiache-slider li.slick-slide {
  margin: 5px;
  padding: 10px;
  background: #fff;
  box-shadow: 0px 1px 4px rgba(0, 0, 0, .4);
}
.fiache-slider .cat-name {
  position: absolute;
  margin: 0;
  padding: .2em .5em;
  background-color: #ffab24;
  color: #fff;
  font-size: x-small;
}
.fiache-slider .cat-name.cat-6 {
  background-color: #f85679; /*Beauty*/
}
.fiache-slider .cat-name.cat-7 {
  background-color: #37caba; /*Fashion*/
}
.fiache-slider .cat-name.cat-8 {
  background-color: #ffab24; /*Lifestyle*/
}
.fiache-slider .thumb {
  width: 100%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.fiache-slider .thumb::after {
  content: '';
  display: block;
  padding-top: 75%; /* 親(.thumb)の横幅に対する高さ 4:3 */
}
.fiache-slider .post-title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  height: 3em;
  margin: 5px 0 0;
  overflow: hidden;
  font-size: 15px;
  text-align: center;
  line-height: 1.5em;
}

/* ウィジェット ============================== */

/* コンテンツ下部ウィジェット */
div#content-bottom {
  margin: 0;
}

/* サイドバー */
.widget-sidebar-title {
  display: none;
}

/* ウィジェット間の余白 */
.widget {
  margin-bottom: 3em;
}
.article.post .widget { /* 投稿の中のウィジェット */
  margin-bottom: 1.5em;
  margin-top: 1.5em;
}

/* フッター内 */
#footer .widget {
  margin-bottom: 0;
}

/* widget コンテンツ下部 */

#content-bottom .widget {
  max-width: 1050px;
  margin: auto;
}

/* 特集バナー */

.featured-banners {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 auto;
}

.featured-banner-item {
  width: calc(50% - 8px);
  height: 150px;
  margin: 4px;
  background-size: cover;
  background-position: center;
  border-radius: 16px;
  position: relative;
}
.featured-banner-link {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 2;
}
.featured-banner-link {
  width: calc(50% - 8px);
}

/* 特集バナー 大 */

.featured-banner-large {
  display: block;
  width: 100%;
  margin: 0 auto;
}

.featured-banner-large-link {
  display: block;
  width: calc(100% - 1.4em);
  max-width: 1000px;
  margin: 1em auto;
}

.featured-banner-large-image {
  display: block;
  margin: 0;
  box-sizing: border-box;
  border-radius: 13px;
}

/* カテゴリ別ランキング */
.category-title-1,
.category-title-2,
.category-title-3 {
  padding-left: 4px;
  color: #fff;
  font-weight: bold;
  font-size: 12px;
  line-height: 20px;
}
.category-title-1 {
  background-color: #f85679;
}
.category-title-2 {
  background-color: #37caba;
}
.category-title-3 {
  background-color: #ffab24;
}

/* フッター中 ロゴウィジェット */

.footer-logo-link {
  display: block;
  width: 200px;
  margin: 1rem auto;
}

.footer-logo-image {
  width: 100%;
  height: auto;
}

/* SNSフォローボタン */

.sns-follow {
  margin: 0;
}
.sns-share {
  margin: 1em 0;
}

.sns-buttons {
  justify-content: space-around;
}

.sns-follow-message {
  padding-top: 1.2em;
}
.sns-follow-buttons.sns-buttons {
  max-width: calc(100% - 20px);
}
.sns-follow-buttons .sns-button {
  width: 30%;
}

/* フッター中 SNSフォローウィジェット */

#footer .sns-follow-message,
#footer .footer-title {
  display: none;
}

#footer .sns-follow-buttons {
  flex-wrap: nowrap;
  justify-content: center;
  column-gap: 10px;
  margin: 2em auto 0;
}

#footer .sns-button {
  height: 1.8em;
  width: 1.8em;
  margin: .2em 0;
  border-radius: 50%;
  background: #fff;
  color: #28455c;
  font-size: 23px;
}

/* お悩みパーツ別タグ */

.parts-block-wrap {
  margin: 10px .7rem;
  padding: .2em 0 0;
  background: var(--pink);
  border-radius: 13px;
}

.parts-block-title {
  display: block;
  margin: .5em 0;
  color: #fff;
  font-weight: 600;
  text-align: center;
}

.parts-block-label-wrap {
  display: flex;
  column-gap: 4px;
  padding: 0 5px;
  overflow: scroll hidden;
}
.parts-block-label-wrap::-webkit-scrollbar {
  display: none;
}

.parts-block-label {
  flex-shrink: 0;
  display: inline-block;
  height: 2.5em;
  padding: .3em .7em .7em;
  background: #f2f2f2;
  box-sizing: border-box;
  border-radius: 9px 9px 0 0;
  transform: translateY(.3em);
  transition: .3s;
}

.parts-block-icon {
  width: 18px;
  height: 18px;
  vertical-align: middle;
  margin: 0 4px 2px 0;
  opacity: .7;
}

.parts-block-check,
.parts-block-content {
  display: none;
}

.parts-block-content-wrap {
  position: relative;
  z-index: 10;
}

.parts-block-content {
  padding: 1em;
  background: #fff;
  border-radius: 0 0 13px 13px;
}
#parts-block-ch1:checked ~ .parts-block-content-wrap #parts-block-content-ch1,
#parts-block-ch2:checked ~ .parts-block-content-wrap #parts-block-content-ch2,
#parts-block-ch3:checked ~ .parts-block-content-wrap #parts-block-content-ch3,
#parts-block-ch4:checked ~ .parts-block-content-wrap #parts-block-content-ch4,
#parts-block-ch5:checked ~ .parts-block-content-wrap #parts-block-content-ch5,
#parts-block-ch6:checked ~ .parts-block-content-wrap #parts-block-content-ch6,
#parts-block-ch7:checked ~ .parts-block-content-wrap #parts-block-content-ch7,
#parts-block-ch8:checked ~ .parts-block-content-wrap #parts-block-content-ch8,
#parts-block-ch9:checked ~ .parts-block-content-wrap #parts-block-content-ch9,
#parts-block-ch10:checked ~ .parts-block-content-wrap #parts-block-content-ch10,
#parts-block-ch11:checked ~ .parts-block-content-wrap #parts-block-content-ch11,
#parts-block-ch12:checked ~ .parts-block-content-wrap #parts-block-content-ch12 {
  display: flex;
  flex-wrap: wrap;
}

#parts-block-ch1:checked ~ .parts-block-label-wrap #parts-block-label-ch1,
#parts-block-ch2:checked ~ .parts-block-label-wrap #parts-block-label-ch2,
#parts-block-ch3:checked ~ .parts-block-label-wrap #parts-block-label-ch3,
#parts-block-ch4:checked ~ .parts-block-label-wrap #parts-block-label-ch4,
#parts-block-ch5:checked ~ .parts-block-label-wrap #parts-block-label-ch5,
#parts-block-ch6:checked ~ .parts-block-label-wrap #parts-block-label-ch6,
#parts-block-ch7:checked ~ .parts-block-label-wrap #parts-block-label-ch7,
#parts-block-ch8:checked ~ .parts-block-label-wrap #parts-block-label-ch8,
#parts-block-ch9:checked ~ .parts-block-label-wrap #parts-block-label-ch9,
#parts-block-ch10:checked ~ .parts-block-label-wrap #parts-block-label-ch10,
#parts-block-ch11:checked ~ .parts-block-label-wrap #parts-block-label-ch11,
#parts-block-ch12:checked ~ .parts-block-label-wrap #parts-block-label-ch12 {
  background: #fff;
  transform: translateY(0);
}

/* Googleカスタム検索 */
aside#search-2 #___gcse_0 { /* PC header */
  position: relative;
  margin: 1em 0 2em;
}
.gsc-input-box {
  border-radius: 100px !important;
}
table tr:nth-of-type(2n+1) {
  background-color: transparent;
}
.gsc-search-button {
  margin-left: 0 !important;
}
.gsc-search-button-v2 {
  padding: 0 !important;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.gsc-search-button-v2 svg {
  width: 20px !important;
  height: 20px !important;
}
.gsc-search-box tbody tr {
  display: grid;
  grid-template-rows: auto;
  grid-template-columns: 1fr 50px;
}
table.gsc-search-box td.gsc-input {
  padding: 0 !important;
  grid-column: 1/3;
  grid-row: 1/2;
  width: 100%;
}
.gsc-search-button {
  margin-left: 2px;
  grid-column: 2/3;
  grid-row: 1/2;
  position: relative;
}
input.gsc-input {
  padding: 0 0 0 8px !important;
  height: 100% !important;
}
.gsc-input {
  font-size: 20px !important;
}
td.gsib_b {
  display: none;
}

.gsc-thumbnail-inside {
  z-index: 50;
}

/* Googleカスタム検索 sidebar お悩みパーツメニュー下 */
#search-3 .gsc-input-box {
  border-color: #f3bcd5;
  margin: 0 10px;
}
#search-3 .gsc-search-box tbody tr {
  grid-template-columns: 1fr 60px;
}
aside#custom_html-28 { /* 上の余白 */
  margin-bottom: 1em;
}

/* tag */

.tagcloud .tag-cloud-link,
.entry-tags .tag-link,
.sc-tag-link {
  flex-grow: 0;
  flex-shrink: 1;
  justify-content: space-between;
  margin: 3px;
  padding: 3px 13px;
  background: #eee;
  border: none;
  border-radius: 50px;
  color: var(--navy);
  font-size: .8rem;
  text-decoration: none;
}
.tagcloud .tag-cloud-link,
.sc-tag-link {
  display: block;
}
.tagcloud .tag-cloud-link:hover,
.entry-tags .tag-link:hover,
.sc-tag-link:hover {
  background: var(--blue);
  color: var(--navy);
  transition: all .3s ease-in-out;
}
.tagcloud .tag-cloud-link .tag-caption::before,
.entry-tags span.fa::before,
.sc-tag-link .tag-caption::before {
  content: '#';
}

.sc-tag-link-count {
  margin-left: 8px;
}

/* タグクラウドで #PR を表示しない */
.tagcloud .tag-cloud-link.tag-link-735 {
  display: none;
}
/* Pick Up Tags ウィジェット */
.tagcloud.pick-up-tags {
  max-width: calc(100% - .7em);
  height: auto;
  margin: .5em auto;
}
/* タグクラウドタイトル */
h2.widget-content-bottom-title.main-widget-label {
  margin: 0 auto 18px;
  padding: 20px 0 10px;
  font-size: 18px;
  text-align: center;
  border-bottom: 3px solid #dcdcdc;
  max-width: 704px;
}

/* MORE link */

.more-link-wrap {
  margin-top: .5em;
  margin-right: .7em;
}

.more-link-wrap .more-link {
  display: block;
  width: fit-content;
  margin: auto 0 auto auto;
  color: #28455c;
  font-weight: 600;
  text-decoration: none;
  line-height: 2.4em;
}

.more-link-wrap .more-link::after {
  content: '\f061';
  font-family: 'Font Awesome 5 Free';
  margin-left: .3em;
}

/* これな～んだ展 */

.drawing-wrap {
  max-width: 500px;
  margin: 0 auto;
  padding: 1em 0;
  background: center / cover no-repeat url(https://fiache.jp/f.wp/wp-content/uploads/2022/07/drawing-wall.jpg);
}
.drawing-frame {
  display: inline-block;
  margin: 10px;
  position: relative;
}
.drawing-frame::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: 0 center / contain no-repeat url(https://fiache.jp/f.wp/wp-content/uploads/2021/11/illust-frame-gold.png);
}
.drawing-pic {
  padding: 5%;
  aspect-ratio: 1000 / 707;
  object-fit: contain;
  object-position: center;
  vertical-align: bottom;
}
.drawing-title-wrap {
  width: 250px;
  height: 55px;
  margin: .5em auto;
  position: relative;
  perspective: 600px;
}
.drawing-button {
  display: none;
}
.drawing-title-text {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: center center / contain no-repeat url(https://fiache.jp/f.wp/wp-content/uploads/2021/11/illust-plate-brown.png);
  color: #fff;
  font-weight: bold;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transition: all 1s ease-out;
}
.drawing-button:checked ~ .drawing-title-text.drawing-close {
  transform: rotateY(180deg);
}
.drawing-title-text.drawing-open {
  transform: rotateY(180deg);
}
.drawing-button:checked ~ .drawing-title-text.drawing-open {
  transform: rotateY(360deg);
}

/* アーカイブ */

/* show hey編集長のこれな～んだ展 アーカイブ */

#drawing-archive-title {
  max-width: 350px;
  margin: 1em auto;
}

.drawing-archive-photo-wrap {
  max-width: 400px;
  margin: 2em auto;
}

.drawing-archive-photo-caption {
  text-align: center;
}

#drawing-entry-list {
  display: flex;
  flex-flow: row wrap;
  row-gap: 15px;
  column-gap: 15px;
  justify-content: space-evenly;
}

#drawing-entry-list .drawing-entry-card {
  flex-grow: 0;
  max-width: 340px;
  margin-top: 2rem;
}

#drawing-entry-list .post-date {
  display: block;
  margin: 1em auto 0;
  font-family: serif;
  text-align: center;
}

#drawing-entry-list .drawing-title-text {
  font-size: 1rem;
}

/* スタバカスタマイズ アーカイブ */

.post-type-archive-cafe_custom #main,
.single-cafe_custom #main {
  background: #1f3e1f;
  color: rgba(255, 255, 255, .9);
}

#customize-list-wrap {
  margin: 1rem 0 6rem;
  padding: 0;
  border: 2px solid #FFF;
  border-radius: 5px;
}

.customize-list-heading {
  position: -webkit-sticky;
  position: sticky;
  top: 50px;
  padding: .5em;
  background: rgba(63, 123, 63, .8);
  line-height: 1;
  z-index: 10;
}

#customize-list-switch {
  display: none;
}

.customize-list-trigger {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: auto;
  width: 45px;
  height: 100%;
  margin: 0;
  background: rgba(255, 255, 255, .9);
  border-radius: 0;
  color: #1f3e1f;
  text-align: center;
  line-height: 1;
  z-index: 10;
}
.customize-list-trigger::before {
  content: '\f107';
  display: block;
  margin: 5px 0 0;
  font-family: 'Font Awesome 5 free';
  font-weight: 900;
  transition: all .3s;
}
.customize-list-trigger::after {
  content: 'open';
  display: block;
  font-size: 11px;
  font-weight: 600;
  transition: all .3s;
}
#customize-list-switch:checked ~ .customize-list-heading .customize-list-trigger::before {
  transform: rotate(180deg);
}
#customize-list-switch:checked ~ .customize-list-heading .customize-list-trigger::after {
  content: 'close';
}

#customize-list-inner {
  display: none;
  padding: 0 10px 1rem;
  border-top: 2px solid #fff;
}
#customize-list-switch:checked ~ #customize-list-inner {
  display: block;
}

.customize-list-genre {
  display: inline-block;
  margin: .5em 0 .3em;
  padding: 0 5px;
}

.customize-list {
  padding: .3em 0 1em 1.7em;
  line-height: 1.4;
}

.customize-list-item {
  margin: 0 0 .3em;
}

#customize-list-inner .hint {
  opacity: .8;
  font-size: small;
  line-height: 1.3;
}
#customize-list-inner .hint-p {
  margin: 1em 0;
}

.cafe-entry-card {
  max-width: 550px;
  margin: 4em auto;
  padding: 1em;
  position: relative;
  border: 2px solid #fff;
}
.cafe-entry-card::before {
  width: 100%;
  position: absolute;
  top: -.65em;
  left: -.2em;
  right: 0;
  opacity: .18;
  z-index: -10;
  font-family: 'Licorice', cursive;
  font-size: 5em;
  line-break: anywhere;
  line-height: 1;
  letter-spacing: normal;
  transform: rotate(-5deg);
}
.cafe-entry-card.message-enjoy::before {
  content: 'Enjoy!';
}
.cafe-entry-card.message-be-happy::before {
  content: 'Be happy!';
}
.cafe-entry-card.message-nice-day::before {
  content: 'Nice day!';
}
.cafe-entry-card.message-good-day::before {
  content: 'Good day!';
}
.cafe-entry-card.message-have-fun::before {
  content: 'Have fun!';
}
.cafe-entry-card.message-cheers::before {
  content: 'Cheers!';
}
.cafe-entry-card.message-awesome::before {
  content: 'Awesome!';
}
.cafe-entry-card.message-relax::before {
  content: 'Relax!';
}

.cafe-content {
  margin: .5em 0 1.2em;
  padding: 0 0 1em;
  border-bottom: 5px double #fff;
  font-size: 15px;
  line-height: 1.5;
}

.cafe-title {
  width: fit-content;
  margin: .8em auto;
  padding: .3em .8em;
  position: relative;
  text-align: center;
}
.cafe-title::before,
.cafe-title::after {
  content: '';
  display: block;
  width: .3em;
  position: absolute;
  top: 0;
  bottom: 0;
  border-top: 2px solid #fff;
  border-bottom: 2px solid #fff;
}
.cafe-title::before {
  left: 0;
  right: auto;
  border-left: 2px solid #fff;
}
.cafe-title::after {
  left: auto;
  right: 0;
  border-right: 2px solid #fff;
}

.cafe-subtitle {
  display: block;
  line-height: 1.3;
  font-size: .6em;
}

.cafe-custom-image {
  max-width: 100%;
  height: auto;
}

.cafe-base-block {
  margin-bottom: 1.5em;
}

.cafe-customize-block {
  margin-bottom: .5em;
}

.cafe-data-title {
  padding: 1.9em .2em .7em;
  position: relative;
  font-weight: bold;
  line-height: 1;
}
.cafe-data-title::before {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -10;
  opacity: .2;
  color: #74c974;
  font: normal 3em / 1 'Licorice', cursive;
  transform: rotate(-2deg);
}
.cafe-base-block .cafe-data-title::before {
  content: 'Base beverage';
}
.cafe-customize-block .cafe-data-title::before {
  content: 'Customize order';
}

.cafe-data-content {
  margin: 0;
  padding: 0 0 0 30px;
  position: relative;
  font-size: 15.3px;
}
.cafe-data-content::before {
  content: '';
  width: 15px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: .2em;
  right: auto;
  background-size: auto auto;
  background-image: repeating-linear-gradient(135deg, transparent, transparent 3px, #74c974 3px, #74c974 5px);
  background-color: transparent;
  opacity: .25;
}

.cafe-arrange-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.cafe-option-line,
.cafe-change-line,
.cafe-del-line,
.cafe-add-line {
  margin: 0 0 3px;
  padding: 0 0 0 28px;
  position: relative;
  line-height: 1.45;
}

.cafe-arrange-list .fas {
  margin: 0 .5em 0 0;
  padding: .3em;
  position: absolute;
  top: .075em;
  left: 0;
  border-radius: 50%;
  opacity: .9;
  color: #1f3e1f;
  font-size: .85em;
}
.cafe-option-line .fas {
  background: #74c974;
}
.cafe-change-line .fas {
  background: #f4d930;
}
.cafe-del-line .fas {
  background: #fa5b6c;
}
.cafe-add-line .fas {
  background: #69c1f5;
}

.cafe-option {
  color: #74c974;
  font-weight: bold;
}

.cafe-change-from,
.cafe-change-to {
  color: #f4d930;
  font-weight: bold;
}

.cafe-del {
  color: #fa5b6c;
  font-weight: bold;
}

.cafe-add {
  color: #69c1f5;
  font-weight: bold;
}

.cafe-plus-fee {
  display: inline-block;
  margin: 0 0 0 3px;
  padding: .2em .3em;
  background-color: transparent;
  background-size: 8px 7px;
  background-image: repeating-linear-gradient(135deg, transparent 2px, rgba(255, 255, 255, .4) 2px, transparent 3px);
  border-radius: 2.9px;
  font-size: .8em;
  line-height: 1.2;
}

.post-type-archive-cafe_custom .page-numbers:not(.current) {
  color: #fff;
}

/* SNS ============================== */

/* シェアボタン */
.sns-share-message,
.sns-follow-message {
  font-weight: bold;
}
.sns-share-buttons {
  justify-content: center;
}
.sns-share.ss-col-6 a.share-button {
  width: 2.2em;
  height: 2.2em;
  margin: 6px;
  border-radius: 50%;
}
.sns-share.ss-high-and-low-lc a > span {
  padding-top: 0;
}
.sns-share.ss-col-6 a.share-button .button-caption {
  display: none;
}

/* 記事上部のシェアボタン(モノクロ) */
.sns-share.bc-monochrome.ss-top a.share-button {
  background: #fff;
  color: #393939;
}
.sns-share.bc-monochrome.ss-top a.share-button:hover {
  opacity: 1;
  background: #ccc;
  color: #393939;
}

/* プラグイン ============================== */

/* お気に入りボタン */
.simplefavorite-button,
.tagfavorite-button {
  width: 100%;
  height: 60px;
  line-height: 60px;
  background-color: #fff;
  border: 2px solid #f489a0;
  border-radius: var(--cocoon-basic-border-radius);
  box-shadow: none;
}
.simplefavorite-button:focus,
.tagfavorite-button:focus {
  outline: none;
}

/* お気に入りタグ用 */
.tagfavorite-button {
  display: block;
  margin: 0 auto 1em;
}
.tagfavorite-button.add {
  background-color: #fff;
  border-color: #f489a0;
  color: #f489a0;
  transition: all .3s 0s ease;
}
.tagfavorite-button.remove {
  background-color: #f489a0;
  border-color: transparent;
  color: #fff;
  transition: all .3s 0s ease;
}
.simplefavorite-button .fa-heart,
.tagfavorite-button .fa-heart {
  padding: 0 5px 0 0;
  font-size: 1.3em;
  vertical-align: text-bottom;
}

/* タグページにアイキャッチや説明が無いとき */

.archive.tag #main > #archive-title {
  display: block;
  margin-left: 10px;
}
.archive.tag #main > #archive-title + .tagfavorite-button {
  margin: 1.2em 10px;
  width: calc(100% - 20px);
}

.entry-categories-tags {
  margin: 1.5em 0;
}

/* 広告 ============================== */

/* 記事タイトル下広告 */
.ads-center {
  display: flex;
  flex-direction: row;
  justify-content: center;
}

/* 投稿記事内 A8広告 */
.A8ad img[width="1"] {
  display: none;
}

/* フッター ============================== */

#footer {
  margin-top: 2em;
  padding-top: 0;
  overflow: hidden;
  position: relative;
  background: linear-gradient(transparent 3em, var(--navy) 3em);
}

#footer::before {
  content: '';
  width: 150vw;
  height: 10em;
  position: absolute;
  top: 0;
  left: 50%;
  background: var(--navy);
  border-radius: 50%;
  z-index: -10;
  transform: translateX(-50%);
}

.footer-bottom {
  margin-top: 0;
}

.footer-bottom-logo .logo-image {
  padding: 0;
  max-width: 363px;
}

/* フッターメニュー */

.navi-footer-in > .menu-footer li.menu-item {
  flex-grow: 0;
  width: fit-content;
  margin: .7em 0 .7em -1px;
  padding: 0 .6em;
  border-left: 1px solid rgba(255, 255, 255, .3);
  border-right: 1px solid rgba(255, 255, 255, .3);
  font-size: .7rem;
  line-height: 1;
}

.copyright {
  text-align: center;
  margin: 1em 0 0;
}

/* タイムラインアイテムの●と文字のズレ修正 */
.timeline-item-snippet {
  margin: 4px 0 0;
}

/* 内部リンク ============================== */

/* あわせて読みたい */
.emphasize-link {
  margin: 36px 0 16px;
  padding: 16px 10px;
  position: relative;
  border: 2px solid #ffc0cb;
  background-color: #fffaf0;
}
.emphasize-link p:last-child {
  margin-bottom: 0;
}
.emphasize-link::before {
  content: '　あわせて読みたい　';
  padding: 2px 6px;
  position: absolute;
  bottom: 100%;
  left: -2px;
  background-color: #ffc0cb;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  color: #fff;
  font-weight: bold;
}

/* 内部リンクカード ショートコード */
.inline-linkcard {
  margin: 10px auto;
  padding: 0;
  border: 1px solid #ddd;
  border-radius: 3px;
  background: #fff;
  overflow: hidden;
}
.inline-linkcard + br + .inline-linkcard {
  margin-top: calc(-1em + -10px);
}
.inline-linkcard-link {
  display: -ms-grid;
  display: grid;
  grid-template-columns: 120px 1fr;
  grid-template-rows: 120px;
  padding: 0;
  text-decoration: none;
}
.inline-linkcard-image {
  width: 100%;
  height: 100%;
  border-radius: 3px 0 0 3px;
  object-fit: cover;
}
p.inline-linkcard-title {
  margin: .2em 0;
  padding: 1em 10px 1em 15px;
  align-self: center;
  font-size: .85em;
}

/* アフィリエイト ============================== */

/* カエレバ */
.kaerebalink-name img,
.kaerebalink-image > img,
.shoplinkyahoo img,
.shoplinkamazon img,
.shoplinkrakuten img,
.shoplinkseven img {
  display: none;
}
.shoplinkyahoo a { color: #ff0000; }
.shoplinkamazon a { color: #ff9200; }
.shoplinkrakuten a { color: #d40000; }
.shoplinkseven a { color: #008000; }
.shoplinkyahoo a,
.shoplinkamazon a,
.shoplinkrakuten a,
.shoplinkseven a {
  background-color: #fff;
  background: linear-gradient(to bottom, #fff 5%, #f6f6f6 100%);
  border: 1px solid #dcdcdc;
  border-radius: 6px;
}
.shoplinkyahoo a:hover,
.shoplinkamazon a:hover,
.shoplinkrakuten a:hover,
.shoplinkseven a:hover {
  background: linear-gradient(to top, #fff 5%, #f6f6f6 100%);
}

/* もしもアフィ かんたんリンク */

.easyLink-box {
  border: none !important;
  border-radius: var(--cocoon-basic-border-radius);
  box-shadow: var(--basic-shadow);
  column-gap: 15px;
  margin: 1em auto !important;
}

/* ショートコードアフィ記事用 */

.aff_advertising .easyLink-box {
  border: none !important;
  box-shadow: none !important;
}

.products-wrap {
  padding: 1.5%;
}

.aff_product_title {
  padding: 8px 0;
  border-bottom: 2px solid #f5bcd3;
  font-size: 18px;
  font-weight: bold;
}

.aff_product_title a {
  text-decoration: none;
}

.detailed-info,
.acf_aff_description_title {
  margin-top: 40px;
  font-size: 18px;
  font-weight: bold;
}

.acf_aff_description {
  margin-top: 8px;
}

.aff_flame {
  border: 1px solid #ccc;
  padding: 16px;
}

.aff_price {
  text-align: right;
}
.aff_price .price2 {
  color: #ff5858;
}

/* 商品リンク 画像幅 */

.easyLink-img-pht {
  width: auto;
}

.easyLink-info-name a {
  color: var(--navy) !important;
}

.easyLink-box .easyLink-info .easyLink-info-btn .easyLink-info-btn-amazon,
.easyLink-box .easyLink-info .easyLink-info-btn .easyLink-info-btn-rakuten,
.easyLink-box .easyLink-info .easyLink-info-btn .easyLink-info-btn-yahoo {
  background: #fff !important;
  border-radius: var(--cocoon-basic-border-radius);
  padding-left: 1em;
  padding-right: 2em;
  position: relative;
}
.easyLink-box .easyLink-info-btn-rakuten {
  color: #bf0000 !important;
  border: 2px solid #bf0000;
}
.easyLink-box .easyLink-info-btn-amazon {
  color: #f90 !important;
  border: 2px solid #f90;
}
.easyLink-box .easyLink-info-btn-yahoo {
  color: #f03 !important;
  border: 2px solid #f03;
}

.easyLink-box .easyLink-info .easyLink-info-btn .easyLink-info-btn-amazon:hover,
.easyLink-box .easyLink-info .easyLink-info-btn .easyLink-info-btn-rakuten:hover,
.easyLink-box .easyLink-info .easyLink-info-btn .easyLink-info-btn-yahoo:hover {
  opacity: 1;
  background: var(--cocoon-current-background-color) !important;
}
.easyLink-info-btn-rakuten:hover {
  color: #bf0000 !important;
}
.easyLink-info-btn-amazon:hover {
  color: #f90 !important;
}
.easyLink-info-btn-yahoo:hover {
  color: #f03 !important;
}

.easyLink-info-btn-rakuten::after,
.easyLink-info-btn-amazon::after,
.easyLink-info-btn-yahoo::after {
  content: '\f054';
  font-family: 'Font Awesome 5 Free';
  position: absolute;
  right: .7em;
}

/* アフィリエイトが吹き出しからはみ出さないようにする */

.balloon-comment .easyLink-box {
  display: block;
}
.balloon-comment .easyLink-box .easyLink-img {
  height: unset;
  margin-right: 0;
}
.balloon-comment .easyLink-box .easyLink-img-box {
  margin: 0 auto 1em;
}

.balloon-comment .easyLink-box .easyLink-info .easyLink-info-btn {
  flex-direction: column;
  justify-content: center;
}

.balloon-comment .easyLink-box .easyLink-info .easyLink-info-btn .easyLink-info-btn-rakuten,
.balloon-comment .easyLink-box .easyLink-info .easyLink-info-btn .easyLink-info-btn-amazon,
.balloon-comment .easyLink-box .easyLink-info .easyLink-info-btn .easyLink-info-btn-yahoo {
  margin: .3em auto;
}

/* SIで追加 */

.ReleaseAndUpdate {
  padding: 5px 0;
  font-size: 11px;
  line-height: 20px;
}

/* 監修プロフィール枠 自撮りプロフィール記事 */

.example03-box {
  display: flex;
  flex-direction: row;
  width: 600px;
  max-width: 90%;
  padding: 10px;
  border: 3px solid #ffab24;
  overflow: hidden;
}
.example03-box .img {
  padding-right: 20px;
  float: left;
}
.example03-box .txt {
  overflow: hidden;
}

/* 色設定 ==============================
** Beauty: #f85679
** Fashion: #37caba
** Lifestyle: #ffab24
*/

/* 背景 */
.fiache-slider .cat-name.cat-6, /* スライダーショートコード */
.category-title-1 { /* ウィジェット＞カテゴリ別ランキング */
  background-color: #f85679;
}
.fiache-slider .cat-name.cat-7,
.category-title-2 {
  background-color: #37caba;
}
.fiache-slider .cat-name.cat-8,
.category-title-3 {
  background-color: #ffab24;
}
/* 文字 */
#rel-list .cat-name.cat-6 { /* 投稿者アーカイブ */
  color: #f85679;
}
#rel-list .cat-name.cat-7 {
  color: #37caba;
}
#rel-list .cat-name.cat-8 {
  color: #ffab24;
}

/* 占いたち バナー */

.couple-banners {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  column-gap: 1em;
  margin: 1em auto;
  width: calc(100% - 1.4em);
  max-width: 1000px;
}

.couple-banner-link {
  display: block;
  flex-basis: calc((100% - 1em) / 2);
  flex-shrink: 0;
  flex-grow: 0;
}

.couple-banner-image {
  width: 100%;
  height: auto;
  border-radius: 13px;
}

.front-page-section {
  margin-bottom: 2.5em;
}

/* Form */

.mw_wp_form .submit-button {
  background-color: var(--navy);
  border-color: unset;
  border-radius: var(--cocoon-basic-border-radius);
  transition: opacity .5s;
  color: var(--cafelatte);
}

@media (hover: hover) {
  .mw_wp_form .submit-button:hover {
    opacity: .7;
  }
}

.mw_wp_form input[name="submitBack"] {
  background-color: transparent;
  border-radius: var(--cocoon-basic-border-radius);
  border-color: var(--navy);
  color: var(--navy);
}

/* 834px以下 */

@media screen and (max-width: 834px) {
  /* スライドインメニュー */

  .menu-content {
    width: 75%;
    max-width: 300px;
  }

  .menu-close-button {
    text-align: right;
    padding: 0 .7em;
  }
  .menu-close-button::before {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url(https://fiache.jp/f.wp/wp-content/uploads/2020/02/menuicon00.png);
    background-size: contain;
    vertical-align: middle;
  }

  .menu-content .menu-drawer {
    padding: 0;
    margin-bottom: 0;
  }
  .menu-drawer li.menu-item {
    display: block;
  }
  .menu-drawer li.menu-item:first-child {
    border-top: 1px solid #dfdfdf;
  }

  .menu-drawer li.menu-item.mbmenu-lifestyle,
  .menu-drawer li.menu-item.mbmenu-ranking,
  .menu-drawer li.menu-item.mbmenu-favorites,
  .menu-drawer li.menu-item.border-btm,
  #navi-menu-content #navi-menu-feature {
    border-bottom: 1px solid #dfdfdf;
  }

  #navi-menu-content #navi-menu-feature {
    padding-top: 5px;
    padding-bottom: 1em;
  }

  /* 区切り */
  .menu-drawer li.menu-item.mbmenu-beauty::before {
    content: 'カテゴリ';
  }
  .menu-drawer li.menu-item.mbmenu-editorsoffice::before {
    content: 'Fiache.編集部';
  }
  #navi-menu-content #navi-menu-sns::before {
    content: '公式アカウント';
  }
  .menu-drawer li.menu-item.mbmenu-beauty::before,
  .menu-drawer li.menu-item.mbmenu-editorsoffice::before,
  #navi-menu-content #navi-menu-feature::before,
  #navi-menu-content #navi-menu-sns::before {
    display: block;
    padding: 1em 1em .3em;
    color: #bcbcbc;
    font-size: 14px;
    font-weight: bold;
  }
  .menu-drawer .menu-item a {
    margin: .5em 0;
    padding: .5em 1em;
    display: block;
    color: #333;
    font-size: 14px;
    text-decoration: none;
    letter-spacing: .1em;
    line-height: 1.5;
  }
  .menu-drawer .menu-item a:hover {
    background-color: #f5bcd3;
    color: #333;
    transition: all .5s ease;
  }
  /* アイコン */
  .mbmenu-beauty a:before,
  .mbmenu-fashion a:before,
  .mbmenu-lifestyle a:before,
  .mbmenu-ranking a:before {
    content: '';
    display: block;
    float: left;
    margin: auto 5px auto 0;
    width: 14px;
    height: calc(14px * 1.5);
    background-repeat: no-repeat;
    background-size: 12px;
    background-position: center;
  }
  .mbmenu-beauty a:before {
    background-image: url(https://fiache.jp/f.wp/wp-content/uploads/2020/02/menuicon03.png);
  }
  .mbmenu-fashion a:before {
    background-image: url(https://fiache.jp/f.wp/wp-content/uploads/2020/02/menuicon02.png);
  }
  .mbmenu-lifestyle a:before {
    background-image: url(https://fiache.jp/f.wp/wp-content/uploads/2020/02/menuicon07.png);
  }
  .mbmenu-ranking a:before {
    background-image: url(https://fiache.jp/f.wp/wp-content/uploads/2020/02/menuicon08.png);
  }

  /* メニュー下ブロック */
  .navi-menu-bottom {
    margin-bottom: 3em;
  }
  .navi-menu-bottom-link {
    display: block;
    width: 95%;
    margin: 5px auto 0;
  }
  .navi-menu-bottom-link img {
    border-radius: var(--cocoon-basic-border-radius);
  }

  #navi-menu-sns {
    font-size: 25px;
  }

  .fiache-sns-link {
    list-style: none;
    display: flex;
    padding: 0;
  }

  .mb-navi-sns-link {
    margin: .2em .4em;
    padding: 0 5px;
    text-decoration: none;
  }

  /* PCヘッダーロゴ */
  div#header-in {
    display: none;
  }

  /* タグクラウド */
  .tagcloud {
    margin: 0 6px;
  }

  /* ウィジェットの余白 */
  .widget h2 {
    padding-left: 10px;
  }

  /* 記事下の関連記事 */
  .related-entry-heading {
    padding: 0 7px;
  }
  .under-entry-content #related-entries .related-entry-card-thumb {
    margin-bottom: 0;
    padding-left: 0;
  }

  /* ランキングリスト */
  /* PV数の表示 */
  .popular-entry-card-pv.widget-entry-card-pv {
    margin-right: 5px;
    position: absolute;
    top: auto;
    bottom: 1px;
    right: 0;
    left: auto;
    color: #9892a8;
    font-size: 11px;
    font-style: normal;
  }
  div.footer-widgets {
    display: block;
  }

  /* 占い　星座別アイコン3列表示 */
  .mother-contents-list li {
    flex: 1 0 30%;
  }
} /* 834px以下おわり */

/* 480px以下 */
@media screen and (max-width: 480px) {
  /* タグページ */
  .tag-content .article-header {
    padding: 0 10px;
  }

  /* 記事リスト */
  h2.entry-card-title {
    font-weight: normal;
  }

  .ect-entry-card .card-thumb {
    margin-bottom: 0;
  }

  /* 関連記事が見つからなかった時 */
  .posts-not-found {
    padding: 0 5px;
  }

  /* タイムラインアイテムの●と文字のズレ修正 */
  .timeline-item-snippet {
    margin: -10px 0 0 8px;
  }

  /* instagram iOSだけ埋め込み画像幅がはみ出すのを解消 */
  .instagram-media {
    width: 414px !important;
    max-width: 100% !important;
    min-width: initial !important;
  }

  /* 監修プロフィール */
  div.example03-box {
    flex-direction: column;
  }

  /* もしもアフィ かんたんリンク */

  div.easyLink-box .easyLink-info .easyLink-info-btn .easyLink-info-btn-rakuten,
  div.easyLink-box .easyLink-info .easyLink-info-btn .easyLink-info-btn-amazon,
  div.easyLink-box .easyLink-info .easyLink-info-btn .easyLink-info-btn-yahoo {
    display: flex;
    align-items: center;
    height: auto;
    margin: .5em auto;
    padding: .75em;
    font-size: .9em;
    vertical-align: text-top;
  }

  .post-type-archive-cafe_custom #main {
    padding-left: 10px;
    padding-right: 10px;
  }

  /* 記事リスト */

  .fi-news-item:first-child {
    flex-flow: column nowrap;
  }

  .related-entry-card-content {
    font-size: unset;
  }

} /* 480px以下おわり */

/* 481px以上 */
@media screen and (min-width: 481px) {
  /* スライドインメニューの箱 */
  .menu-content {
    width: 40%;
  }

  /* 投稿者アーカイブ */
  body.author #author-header {
    text-align: left;
  }
  body.author #author-header .author-thumb {
    width: 150px;
    height: 150px;
  }

  body.author .follow-sns-button {
    display: inline-block;
    margin: .5em 10px .5em 0;
  }

  /* ライターカード出力ショートコード */
  .single-post .author-card,
  .page-template .author-card,
  .post-type-archive .author-card {
    flex-direction: row;
    column-gap: 10px;
  }
  .single-post .author-card .author-thumb,
  .page-template .author-card .author-thumb,
  .post-type-archive .author-card .author-thumb {
    align-self: flex-start;
    flex-shrink: 0;
    width: 120px;
    height: 120px;
  }
  .single-post .author-card .author-content,
  .page-template .author-card .author-content,
  .post-type-archive .author-card .author-content {
    width: auto;
  }
  .single-post .author-card .author-name,
  .single-post .author-card .author-position,
  .page-template .author-card .author-name,
  .page-template .author-card .author-position,
  .post-type-archive .author-card .author-name,
  .post-type-archive .author-card .author-position {
    display: inline;
  }

  /* 記事リスト */
  .related-entry-card-thumb {
    padding-left: 0;
  }

  /* 前後記事
  .pager-post-navi a {
    line-height: 1.6;
    font-size: 16px;
  } */

  /* 記事バナーウィジェット */
  aside#custom_html-12 a {
    max-width: calc(100% - 20px);
  }

  /* 小説記事、ララちゃん記事 */

  .article.article-fiache-novel,
  .article.article-fiache-laralab .entry-content,
  .article.article-fiache-laralab .entry-footer {
    padding-left: .8em;
    padding-right: .8em;
  }

  /* スタバカスタム */

  #coffee-customize-entry-list .cafe-entry-card {
    margin-top: 5em;
    padding: 3em;
  }
  #coffee-customize-entry-list .cafe-entry-card::before {
    top: -.86em;
    left: -.3em;
  }

  /* 記事リスト */

  .fi-news-list {
    row-gap: 2em;
  }

  .fi-news-item {
    flex-basis: calc(100% / 3 - 2em);
    flex-grow: 1;
    flex-flow: column;
  }

  .fi-news-item-img-wrap {
    flex-basis: auto;
  }

} /* 481px以上おわり */

/* 704px以上 */
@media screen and (min-width: 704px) {
  .hidden-if-mobile {
    display: inline-block;
  }

  /* 記事リスト */

  #main .entry-card,
  #main .related-entry-card,
  #main .widget-entry-card {
    column-gap: 15px;
  }

  #main .entry-card-thumb,
  #main .related-entry-card-thumb,
  #main .widget-entry-card-thumb {
    flex-basis: 125px;
  }

  #main .related-entry-card-content,
  #main .widget-entry-card-content {
    display: flex;
    justify-content: stretch;
  }

  #main .related-entry-card-title,
  #main .widget-entry-card-title {
    align-self: center;
    padding-bottom: 0;
    font-size: 15px;
  }

  #main .entry-card-title {
    font-weight: bold;
  }

  #main .entry-card-snippet {
    display: block;
    display: -webkit-inline-box;
  }

  /* ふきだしショートコード [author_balloon] */
  .author-balloon {
    display: flex;
    align-items: flex-start;
  }
  .author-balloon.author-icon-left {
    flex-direction: row;
  }
  .author-balloon.author-icon-right {
    flex-direction: row-reverse;
  }
  .author-balloon.author-icon-left .author-balloon-info,
  .author-balloon.author-icon-left.author-icon-s .author-balloon-info,
  .author-balloon.author-icon-right .author-balloon-info,
  .author-balloon.author-icon-right.author-icon-s .author-balloon-info {
    grid-template-rows: 120px 1fr auto;
    grid-template-columns: 120px;
    flex-basis: 120px;
  }
  .author-balloon.author-icon-left .author-thumb,
  .author-balloon.author-icon-right .author-thumb {
    grid-row: 1/2;
    grid-column: 1/2;
  }
  .author-balloon .author-name {
    font-size: .85rem;
  }
  .author-balloon.author-icon-left .author-name {
    margin: 5px auto 5px 10px;
  }
  .author-balloon.author-icon-right .author-name {
    margin: 5px 10px 5px auto;
  }
  .author-balloon .author-position {
    font-size: .8rem;
  }
  .author-balloon.author-icon-left .author-position {
    margin: 0 auto 5px 10px;
  }
  .author-balloon.author-icon-right .author-position {
    margin: 0 10px 5px auto;
  }
  .author-balloon.author-icon-left .balloon-comment,
  .author-balloon.author-icon-left.author-icon-s .balloon-comment {
    margin: .5em calc(120px + 1em) .5em 1em;
    padding: .5em 1em;
    flex-basis: 100%;
  }
  .author-balloon.author-icon-right .balloon-comment,
  .author-balloon.author-icon-right.author-icon-s .balloon-comment {
    margin: .5em 1em .5em calc(120px + 1em);
    flex-basis: 100%;
    padding-top: 6px;
  }
  .author-balloon.author-icon-left .balloon-comment::before {
    margin: 0;
    position: absolute;
    top: 1rem;
    left: -.45rem;
    transform: rotate(225deg);
  }
  .author-balloon.author-icon-right .balloon-comment::before {
    display: none;
  }
  .author-balloon.author-icon-right .balloon-comment::after {
    content: '';
    display: block;
    width: 12px;
    height: 12px;
    margin-top: -12px;
    margin-left: calc(100% - .9em);
    position: absolute;
    top: 1.5em;
    bottom: auto;
    background: #fff;
    border-top: 1px solid #999;
    border-right: 1px solid #999;
    transform: rotate(45deg);
  }

} /* 704px以上おわり */

/* 835px以上 */
@media screen and (min-width: 835px) {

  /* コンテンツ上部ウィジェットエリア */
  #content-top-in {
    position: relative;
  }

  /* 検索窓 */
  aside#search-2 {
    display: block;
    width: calc(100% / 4);
    height: 10px;
    margin: 0 0 0 auto;
    position: absolute;
    top: -180px;
    right: 10px;
  }

  #footer {
    padding-top: 2em;
    background: linear-gradient(transparent 4em, var(--navy) 4em);
  }

  #footer::before {
    height: 30em;
  }
}

@media screen and (max-width: 1023px) {
  .mobile-menu-buttons > li {
    padding-top: 0;
  }
}

/* 835px - 1023px : Cocoonテーマの調整 */
@media screen and (min-width: 835px) and (max-width: 1023px) {
  /* ウィジェット [c]テキスト(PC用) を非表示 */
  .widget_pc_text,
  div#header-in {
    display: none;
  }

  /* header */
  .mobile-header-menu-buttons {
    display: flex;
  }
  .mobile-menu-buttons .menu-button {
    cursor: default;
  }
  .mobile-menu-buttons .menu-button .menu-button-in {
    width: fit-content;
  }
}

/* 1024px以上 */
@media screen and (min-width: 1024px) {
  .mobile-header-menu-buttons {
    display: none;
  }
}