/*
Theme Name: Cocoon Child
Theme URI: https://wp-cocoon.com/
Template: cocoon-master
Author: わいひら
Author URI: https://nelog.jp/
Description: SEO・高速化・モバイルファースト最適化済みの無料テーマ。
Tags: two-columns,left-sidebar,right-sidebar
Version: 2.8.5.1.1743510500
Updated: 2025-04-01 21:28:20

*/

/* 投稿日・更新日・投稿者名をサイト全体で非表示にする */
.date-tags,      /* Cocoon の投稿日／更新日ラッパー */
.author-info,    /* 投稿者情報（Cocoon） */
.post-date,      /* 投稿日を個別に持つテーマ用 */
.updated,        /* 更新日 microdata 用 */
.byline,         /* 投稿者表示を .byline で持つテーマ用 */
.post-update
{
  display: none !important;
}

@media screen and (max-width: 834px) {
    main.main, div.sidebar {
        padding: 2px 10px;
    }
}

@media screen and (max-width: 480px) {
    .body, .menu-content {
        font-size: 15px;
    }
header p {
    font-size: 12px;
}
}


/*──────────────────────────────────────────────
  Top
──────────────────────────────────────────────*/
/* 横並びグリッド */
.wpp-list {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  padding: 10px 0;
  margin: 0;
  gap: 16px;
  scrollbar-width: thin;
}

/* 各ランキング項目 */
.wpp-list li {
  flex: 0 0 auto;
  width: 120px;
  list-style: none;
  text-align: center;
  font-size: 14px;
  counter-increment: wpp-rank;
  position: relative;
}

/* ランキング番号（上部に小さく） */
.wpp-list li::before {
  content: counter(wpp-rank);
  position: absolute;
  top: 2px;
  left: 2px;
  background: #f36;
  color: #fff;
  font-size: 12px;
  width: 22px;
  height: 22px;
  line-height: 22px;
  border-radius: 50%;
  text-align: center;
  font-weight: bold;
  box-shadow: 0 0 3px rgba(0,0,0,0.3);
}

/* 画像（サムネ） */
.wpp-list img {
  width: 100%;
  height: auto;
  border-radius: 6px;
  display: block;
}

/* タイトル（省略表示） */
.wpp-list .wpp-post-title {
  display: block; /* インライン要素だとellipsisが効かない */
  margin-top: 6px;
  font-weight: 500;
  font-size: 13px;
  color: #333;
  text-decoration: none;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 100%;
}

/* 2行表示する場合 */
.wpp-list .wpp-post-title.multiline {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 2;
  line-height: 18px;
  max-height: 36px; /* 2行分の高さ */
}

/* PV数のスタイル */
.wpp-list .wpp-meta.post-stats {
  font-size: 12px;
  color: #888;
  margin-top: 4px;
}
.list-title2 {
    text-align: center;
    font-size: 12px;
    margin-top: 2em;
    margin-bottom: 1em;
}
span.list-title-in2 {
    position: relative;
    display: inline-block;
    padding: 0 75px;
    white-space: nowrap;
}
.list-title-in2:before {
    left: 0;
    margin-right: 10px;
}
.list-title-in2:after {
    right: 0;
    margin-left: 10px;
}
.list-title-in2:before, .list-title-in2:after {
    content: "";
    position: absolute;
    top: 50%;
    display: inline-block;
    width: 55px;
    height: 1px;
    background-color: #000;
}

/*──────────────────────────────────────────────
  追加CSS
──────────────────────────────────────────────*/

/* 遅延フェードをカットして即表示にする 
img.lazyloaded,
img[data-lazyloaded="1"] {
  opacity: 1 !important;
  transition: none !important;
}*/

/* logo */
.header-container-in.hlt-top-menu.hlt-tm-small .logo-header img {
    max-height: 40px;
    width: auto;
    height: auto;
}
/* TOP */
.ect-3-columns .entry-card-wrap {
    width: 33%;
    padding: 2px;
}
@media screen and (max-width: 834px) {
    main.main, div.sidebar {
        padding: 2px 5px;
    }
}
.list-title {
    margin-top: 0.8em;
    margin-bottom: 0.3em;
}

/* ジャンル（最強バージョン） */
body article.fanza-product span.jtext {
  color: #ef95ff !important;
}

/* 最強バージョン */
html body article.fanza-product section.package-info > p.volume {
  text-align: center !important;
}

@media screen and (max-width: 834px) {
    .ect-vertical-card .entry-card-wrap {
        width: 49% !important;
    }
}

p.center-text a {
    text-decoration: none;
    color: #9b00ff;
	font-size: 15px;
}
.center-text {
      text-align: center;     
    }
.new-entry-card-title.widget-entry-card-title.card-title {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
}

.back-to-top-affiliate-btn {
    display: inline-block;
    padding: 10px 5px 10px;
    background-color: #00c300ba!important;
    color: white;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    border-radius: 5px;
    text-decoration: none;
    position: fixed;
    bottom: 130px;
    right: 10px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, .1);
    z-index: 10000;
}

.back-to-top-affiliate-btn:hover {
    background-color: #E30B0B;
}

@media screen and (max-width: 480px) {
a.av-pto {
    font-size: 13px !important;
}
    .entry-title, .article h2 {
        font-size: 18px;
        padding: .8em .0em;
    }
}


a.av-pto {
    font-size: 16px;
    text-decoration-line: none;
    font-weight: bold;
    color: #ca00ff;
}

.cat-label {
display: none;
}

 /* 目次外 */
.page-numbers, .tagcloud a, .author-box, .ranking-item, .pagination-next-link, .comment-reply-link, .toc {
    border: 1px solid #fff;
}
.article ul li, .article ol li {
    /*margin: 10px 15px 0 !important*/
}

 /* クーポン */
a.av-pto {
    color: #bf00ff;
    font-weight: bold;
}

section#fanza-campaign {
    line-height: 22px;
}

.avokok {
	margin-top: 18px;
  font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', 'Hiragino Mincho ProN', 'HGS明朝E', 'ＭＳ Ｐ明朝', serif;
  position: relative;
  padding: 1rem 0rem 1rem;
  -webkit-box-shadow: 0 2px 14px rgba(0, 0, 0, .1);
  box-shadow: 0 2px 14px rgba(0, 0, 0, .1);
	text-align: center;
}

.avokok:before,
.avokok:after {
  position: absolute;
  left: 0;
  width: 100%;
  height: 4px;
  content: '';
  background-image: -webkit-linear-gradient(315deg, #704308 0%, #ffce08 40%, #e1ce08 60%, #704308 100%);
  background-image: linear-gradient(135deg, #704308 0%, #ffce08 40%, #e1ce08 60%, #704308 100%);
}

.avokok:before {
  top: 0;
}

.avokok:after {
  bottom: 0;
}

/* 目次全体のデザイン */
.toc {
    background-color: #f8f8f8;
    border: 1px solid #ddd;
    padding: 15px;
    border-radius: 8px;
    font-size: 14px;
    max-width: 600px;
    width: 100%;
    margin: 20px auto;
}

/* 目次タイトル */
.toc-title {
    font-weight: bold;
    font-size: 16px;
    display: block;
    text-align: center;
    padding: 5px;
    cursor: pointer;
}

/* 目次リスト */
.toc-list {
    list-style: none;
    padding-left: 0;
}

/* 目次の各項目 */
.toc-list li {
    padding: 5px 0;
    border-bottom: 1px dashed #ccc;
}

/* 最後の項目の下線を消す */
.toc-list li:last-child {
    border-bottom: none;
}

/* 目次のリンク */
.toc-list a {
    text-decoration: none;
    color: #0073aa;
    transition: 0.3s;
}

.toc-list a:hover {
    color: #ff4d4d;
}

/* 子要素のインデント */
.toc-list ol {
    padding-left: 15px;
}
/* FANZA APIバナーを非表示 */
p[style*="text-align:right"] a[href*="https://affiliate.dmm.com/api/"] {
  display: none !important;
}
/* FANZA APIバナーを非表示 */
p[style*="text-align: right"] a[rel~="nofollow"][href*="https://affiliate.dmm.com/api/"] {
  display: none !important;
}


/* フッターの投稿者情報を非表示 */
.footer-meta .author-info {
  display: none !important;
}

/* 見どころ */
section.appeal-point ul {
    margin: 20px;
}

/* おすすめ */
@media screen and (max-width: 834px) {
.article ul, .article ol {
        padding-left: 0!important;
    }
.rpwe-block {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
ul.rpwe-ul {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;
    margin: 0;
    justify-content: space-between;
}
li.rpwe-li.rpwe-clearfix {
    flex: 1 1 calc(50% - 10px);
    /* max-width: calc(50% - 10px); */
    box-sizing: border-box;
    text-align: center;
}
}


/* モバイルボタン */
/* favorite */
.simplefavorite-button.active {
    opacity: inherit;
    margin-left: 20px;
}
button.simplefavorite-button {
    margin-left: 20px;
}
/* モバイルボタン */
span.fa.fa-heart {
    color: red;
}
span.fa.fa-star {
    color: #19be00;
}
span.fa.fa-trophy {
    color: gold;
}
@media screen and (max-width: 350px) {
  ul#menu-\%e3\%83\%95\%e3\%83\%83\%e3\%82\%bf\%e3\%83\%bc {
    width: 100vw; /* ビューポート幅の100% */
  }
}

/* 詳細テーブル */
.body div.scrollable-table table, .body .wp-block-table table {
    margin-bottom: 0;
    width: 100%;
}

/* メニューmax重要 */
@media screen and (max-width: 1023px) {
    .header-container-in.hlt-top-menu {
        flex-direction: row !important;
    }
}

@media (max-width: 767px) {

  /* ❶ ヘッダー全体を横並び */
  #header {
    display: flex !important;           /* ← 必ず flex に */
    align-items: center;
    justify-content: space-between;
    padding: 0 12px;
  }

  /* ❷ ロゴ側ラッパー：幅を自動に */
  #header-in {
    width: auto !important;
    display: flex;
    align-items: center;
  }

  /* ❸ ナビ（ハンバーガー）を右端へ
        !important で UA-CSS を確実に打ち消す */
  #header > nav.navi {
    display: flex !important;           /* ← ここが上書きポイント */
    align-items: center;
    margin-left: auto;
  }
}


/* メニュー */
#mega-menu-wrap-navi-mobile #mega-menu-navi-mobile {
    text-align: center;
}
@media (min-width: 768px) {
#mega-menu-wrap-navi-mobile #mega-menu-navi-mobile>li.mega-menu-flyout ul.mega-sub-menu {
    z-index: 999;
    position: absolute;
    max-width: none;
    display: flex;
    flex-wrap: wrap;
    padding: 20px;
    border: 0;
    background: #f1f1f1;
    border-radius: 0;
    width: 690px;
}
}

#mega-menu-wrap-navi-mobile .mega-menu-toggle .mega-toggle-blocks-right .mega-toggle-block:only-child {
    margin-left: 30px;
}
#mega-menu-wrap-navi-mobile .mega-menu-toggle .mega-toggle-blocks-right .mega-toggle-block {
    margin-right: 30px;
}	


/* ===== 投稿メタ装飾 ===== */
.post-meta {
  font-size: 0.9rem;
  color: #555;
  margin: 1em 0;
}
.post-meta .meta-item {
  display: inline-block;
  margin-right: 1.5em;
  vertical-align: middle;
}
.post-meta .meta-item i {
  margin-right: 0.3em;
  color: #888;
}
/* カテゴリ・タグの各リンクをバッジ風に */
.post-meta .term-badge {
  display: inline-block;
  background: #f2f2f2;
  color: #333;
  padding: 2px 6px;
  margin: 0 4px 0 0;
  border-radius: 4px;
  text-decoration: none;
  font-weight: normal;
}
.post-meta .term-badge:hover {
  background: #e0e0e0;
}

span.meta-item.meta-cat a {
    display: inline-block;
    border: none;
    border-radius: 5px;
    padding: 0 5px;
    margin: 1px;
    background-color: #ce7979;
    color: white;
    text-align: center;
    text-decoration: none;
    font-size: 14px;
    cursor: pointer;
}