@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

blockquote {
	background-color: rgba(255, 0, 128, .05);
    border-color: rgba(255, 0, 128, .5);
}


:root{
  --container: 960px; --content: 720px;
  --radius: 16px; --shadow: 0 8px 28px rgba(0,0,0,.08);
  --brand:#d84b57; --brand-ink:#fff;
  --ink:#1f2937; --muted:#6b7280;
  --chip-bg:#f3f4f6; --chip-ink:#374151;
  --card-bg:#fff; --card-border:#eef0f3;
}

/* レイアウト */
.single-doujinops-wrap{max-width:var(--container);margin:18px auto 56px;padding:0 14px;font-size:16.8px;line-height:1.9;color:var(--ink);}
.single-doujinops-header{max-width:var(--content);margin:0 auto 12px;}
.single-doujinops-title{font-size:clamp(22px,6vw,32px);line-height:1.28;margin:0 0 6px;}
.single-doujinops-meta{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px;}
.meta-chip{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:var(--chip-bg);color:var(--chip-ink);font-size:12.5px;}
.meta-chip a{color:inherit;text-decoration:none;}

.single-doujinops-content{max-width:var(--content);margin:0 auto;}
.work-spec{list-style:none;padding:10px 12px;margin:8px 0 14px;background:#fafafa;border:1px solid var(--card-border);border-radius:12px;}
.work-spec li{margin:4px 0;}

.sample-gallery{margin:0 -14px 16px;} /* スマホはほぼフルブリード */
.sample-gallery figure{margin:0 0 10px;}
.sample-gallery img{width:100%;height:auto;display:block;border-radius:12px;box-shadow:var(--shadow);}

.cta-box{text-align:center;margin:14px 0 20px;}
.cta-button{display:inline-block;padding:14px 22px;border-radius:999px;background:var(--brand);color:var(--brand-ink);text-decoration:none;font-weight:700;box-shadow:var(--shadow);}
.cta-button:active{transform:translateY(1px);}
.single-doujinops-content h2{margin:22px 0 10px;font-size:19px;line-height:1.45;}

.post-tags{display:flex;flex-wrap:wrap;gap:8px;margin:18px auto;max-width:var(--content);}
.post-tags a{display:inline-block;padding:6px 10px;border-radius:999px;background:var(--chip-bg);color:var(--chip-ink);text-decoration:none;font-size:13px;}

.related-wrap{max-width:var(--container);margin:26px auto 6px;padding-top:6px;}
.related-title{font-size:18px;margin:0 0 8px;color:var(--muted);}
.related-grid{display:grid;grid-template-columns:1fr;gap:12px;}
.related-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;text-decoration:none;color:inherit;}
.related-card .thumb{aspect-ratio:3/4;width:100%;object-fit:cover;background:#f5f5f5;display:block;}
.related-card .body{padding:10px 12px;}
.related-card .ttl{font-size:14px;line-height:1.55;margin:0 0 6px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.related-card .chiprow{display:flex;gap:6px;}
.related-card .chip{background:var(--chip-bg);color:var(--chip-ink);border-radius:999px;padding:2px 8px;font-size:12px;}

@media (min-width:560px){.related-grid{grid-template-columns:repeat(2,1fr);} }
@media (min-width:960px){.related-grid{grid-template-columns:repeat(3,1fr);} }

.age-note{max-width:var(--content);margin:18px auto 0;font-size:12px;color:var(--muted);}

/*プラグイン用*/

.circle-lead { font-size: 1.05em; margin: 8px 0 12px; }
.review-stars { color: 
#F7C948; line-height: 1; font-size: 1.1em; }
.review-score { margin-top: 2px; color: #555; }
.aligncenter { display: block; margin: 12px auto; max-width: 100%; height: auto; }
.post-categories a, .post-tag { margin-right: .5em; }
.cta-readmore {
	margin: 20px 0;
	text-align: center;
}
.cta-readmore a { display: inline-block; padding: 16px 32px; background: linear-gradient(135deg, #ff6b9d 0%, #c44569 100%); color: white; text-decoration: none; border-radius: 50px; font-weight: 600; font-size: 16px; position: relative; overflow: hidden; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 8px 25px rgba(255, 107, 157, 0.4); } .cta-readmore a::before { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent); transition: left 0.6s; } .cta-readmore a:hover::before { left: 100%; } .cta-readmore a:hover { transform: translateY(-3px); box-shadow: 0 15px 35px rgba(255, 107, 157, 0.5); } .cta-readmore a::after { content: '→'; margin-left: 8px; transition: transform 0.3s ease; display: inline-block; } .cta-readmore a:hover::after { transform: translateX(4px); }
.cta-note { font-size: .85em; color: #666; margin-top: .35em; }


/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}