/* =========================================================
   変数（テーマカラー・共通値）
========================================================= */
:root{
  --bg-main:#fbe7f6;
  --bg-card:#fcfcfc;
  --shadow:1px 2px 3px #ddd;

  --text-main:#333;
  --text-soft:#999;
  --text-muted:#555;

  --accent:#df00a3;
  --accent-hover:#00b6ff;
  --link:#6a2dbd;
  --link-visited:#8a79b8;
  --link-hover:#ff2ea6;

  --radius:1rem;
}

/* =========================================================
   リセット
========================================================= */
*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

body{
  font-family:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP",sans-serif;
  background:var(--bg-main);
  color:var(--text-main);
  line-height:1.7;
}

a{
  text-decoration:none;
}

/* =========================================================
   レイアウト
========================================================= */
header,
footer,
.outer{
  display:flex;
  justify-content:center;
}

.container{
  width:100%;
  max-width:1200px;
  display:flex;
  gap:1.25rem;
}

.main{flex:7; min-width:0;}
.sidebar{flex:3; min-width:240px;}

@media(max-width:768px){
  .container{flex-direction:column;}
  .sidebar{width:100%;}
}

@media(max-width:1260px){
  body{margin:0 20px;}
}

/* =========================================================
   カード共通（記事・ウィジェット）
========================================================= */
article,
.box,
.widget{
  background:var(--bg-card);
  box-shadow:var(--shadow);
  border-radius:var(--radius);
  margin-bottom:1.5rem;
  padding:1.15rem;
}

article{
  padding:2rem;
}

.post-content .e-content h1 {
  margin-bottom: 15px;
}

.post-content .e-content p {
  line-height: 2;
}

/* =========================================================
   ヘッダー・フッター
========================================================= */
header{margin:2rem 0 1.25rem;}

header h1 a{color:var(--accent);}
header h1 a:hover,
header h1 a:focus-visible{color:var(--accent-hover);}

footer{
  padding:2rem 0;
  text-align: center;
}

footer {
  flex-direction:column;
}

.copyright{
  margin-top:10px;
  text-align:center;
}

/* =========================================================
   タイポグラフィ
========================================================= */
header,footer,main,aside{font-size:1.05rem;}

.post-header h1{font-size:1.7rem;}

.post-header h2{color: #333;}

h2.archive-title {
  margin-bottom: 15px;
}

.post-header,
.category_tags-area{
  margin-bottom:1rem;
  padding-bottom:.5rem;
  border-bottom:1px solid #ddd;
  color:var(--text-soft);
}

.more-link{
  margin-top:1rem;
  padding-top:1rem;
  border-top:1px solid #ddd;
  color:var(--text-soft);
}

/* =========================================================
   リンクカラー
========================================================= */
article a{color:var(--link);}
article a:visited{color:var(--link-visited);}
article a:hover{
  color:var(--link-hover);
  text-decoration:underline;
}

.sidebar a{color:#4a2a8a;}
.sidebar a:visited{color:#6f5ea0;}
.sidebar a:hover{color:var(--link-hover);}

/* =========================================================
   メタ（カテゴリ・タグ）
========================================================= */
.meta-list{
  display:flex;
  align-items:flex-start;
  line-height:1.9;
  margin:.4rem 0;
  font-size:.95rem;
}

.meta-list::before{
  margin-right:.45rem;
  white-space:nowrap;
  opacity:.85;
  font-weight:600;
}

.meta-list.category::before{content:"📁 カテゴリー：";}
.meta-list.tag::before{content:"🏷️ タグ："}

.meta-list ul{
  display:flex;
  flex-wrap:wrap;
  list-style:none;
}

.meta-list li{margin-right:.45rem;}

.meta-list a{
  color:#5b3aa3;
  background:#f3effa;
  padding:2px 6px;
  border-radius:6px;
}

.meta-list a:visited{
  color:#7a6aa8;
  background:#ece7f7;
}

.meta-list a:hover{
  background:var(--link-hover);
  color:#fff;
}

/* =========================================================
   検索
========================================================= */
.search-hit{
  background:linear-gradient(transparent 60%,#ffe66b 60%);
  font-weight:600;
}

#search-title{
  font-size:1.5rem;
  font-weight:700;
  margin-bottom:1rem;
}

#search-result p{
  background:var(--bg-card);
  padding:2rem;
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  font-size:1.2rem;
  color:var(--text-muted);
  text-align:center;
}

/* =========================================================
   サイドバー
========================================================= */
.widget h3{
  font-size:1.05rem;
  font-weight:700;
  margin-bottom:.6rem;
  padding-bottom:.4rem;
  border-bottom:2px solid #e5e7eb;
}

/* 検索フォーム */
.sidebar-search form{display:flex;gap:1.25rem;}
.sidebar-search .search_input{flex:7;}
.sidebar-search .search_submit{flex:3;}

.sidebar-search input[type="text"]{
  width:100%;
  padding:8px;
}

.sidebar-search input[type="submit"]{
  background:#999;
  color:#fff;
  border:none;
  border-radius:4px;
  padding:7px 20px;
  box-shadow:0 3px 0 #777;
}

.sidebar-search input[type="submit"]:active{
  transform:translateY(3px);
  box-shadow:none;
}

/* カテゴリー */
.category-list ul{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
}

.category-list li{
  flex:0 0 calc((100% - 1rem)/3);
  display: inline-block;
}

/* タグ */
.tag-cloud a{
  display:inline-block;
  margin-left:.75rem;
}

/* アーカイブ */
.archive-list ul{list-style:none;padding-left:0;}

.archive-list .year-label{
  display: block;
  cursor:pointer;
  margin-top:.5rem;
  padding:.25rem .4rem;
  font-weight:600;
  background:#f3f4f6;
  border-radius:6px;
}

.archive-list .month-list{
  display:none;
  padding-left:1rem;
}

.archive-list .year-item.open>.month-list{display:block;}

.archive-list .month-list a{
  display:block;
  padding:.15rem .4rem;
  font-size:.9rem;
  border-radius:4px;
}

.archive-list .month-list a:hover{
  background:#eef2ff;
  color:#3730a3;
}

/* =========================================================
   広告領域
========================================================= */
.infeed-ad {
  margin: 2rem 0;
  padding: 1.5rem;
  text-align: center;
}

.adframe-imglink img,
.infeed-ad img {
  max-width: 100%;
}

.ad-random .ad-item,
.random-ad .ad-item {
  display: none;
}

.infeed-ad .ad-item > div {
  width: auto !important;
}

.adframe iframe,
.infeed-ad iframe  {
  max-width: 100%;
  max-height: 100%;
}

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

/* =========================================================
   ページネーション
========================================================= */
#pagination{
  display:flex;
  align-items:center;
  position:relative;
  margin:2rem 0;
}

#pagination .prev{margin-right:auto;}
#pagination .next{margin-left:auto;}

#pagination a{
  color:#6a5acd;
  font-weight:600;
}

#pagination a:hover{
  color:#7f73ff;
  text-decoration:underline;
}

#pagination .page-status{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  color:#8b87a6;
  font-weight:500;
}

/* =========================================================
   PAGETOP
========================================================= */
#page-top{
  position:fixed;
  bottom:20px;
  right:20px;
  z-index:99;
}

#page-top a{
  display:block;
  width:60px;
  padding:18px 5px;
  font-size:2rem;
  text-align:center;
  font-weight:bold;
  border-radius:90px;
  background:#ab101b;
  color:#fff;
  opacity:.9;
  transition:.3s;
  line-height: 0.8;
}

#page-top a:hover{opacity:.5;}


/* =========================================================
   ブログパーツ
========================================================= */
.product_img-area img {
  max-width: 100%;
}

.product_img-area,
.product-description {
  margin-bottom: 1.5rem;
}

.product-description h3 {
  font-size: 1.5rem;
  border-bottom: solid 1px #ddd;
  padding-bottom: 5px;
  margin-bottom: 1rem;
  color: #777;
  letter-spacing: 2px;
}

.product-description.movie-area > div {
  margin: 0 auto;
}

.product-description.movie-area video {
  width: 100%;
}

.product-description.product_link {
  text-align: center;
}

/* この作品を見るボタン */
.product-description.product_link a.cta-button{
  display:inline-block;
  padding:14px 36px;
  font-size:1.2rem;
  font-weight:700;
  color:#fff;
  text-decoration:none;
  text-align:center;

  /* 薄いピンク */
  background:#ff9ed6;

  border-radius:12px;

  /* 浮き上がり表現 */
  box-shadow:
    0 6px 0 #d86bb3,      /* 下の影（縁） */
    0 10px 18px rgba(0,0,0,0.25); /* 全体の影 */

  transition:all 0.08s ease;
}

/* ホバー（変化なし） */
.product-description.product_link a.cta-button:hover{
  background:#ff9ed6;
  text-decoration: none;
}

/* クリック時 */
.product-description.product_link a.cta-button:active{
  background:var(--link-hover); /* 濃いピンク */

  /* 沈み込む */
  transform:translateY(6px);

  box-shadow:
    0 0 0 #d86bb3,
    0 4px 10px rgba(0,0,0,0.3);
}

/* 訪問済みでも色を固定 */
.product-description.product_link a.cta-button:visited{
  background:#ff9ed6;
}