@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
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
.main,
.sidebar,
.breadcrumb.sbp-main-before,
.breadcrumb.sbp-footer-before,
.breadcrumb.pbp-main-before,
.breadcrumb.pbp-footer-before {
  background-color: #ffffff;
}

/******エントリーカード関係******************************
/*エントリーカードの文字サイズ*/
.new-entry-card-title,
.widget-entry-card-title,
.card-title{
  font-size: 15px;
}
/* エントリーカードのサムネイルをレスポンシブ化 */
.new-entry-card {
  display: flex;
  flex-wrap: wrap; /* スマホで縦並びにする */
    border: 1px solid #e0e0e0;  /* デフォルトの薄い枠 */
    border-radius: 6px;          /* 角丸 */
    overflow: hidden;             /* はみ出る部分を隠す */
    transition: all 0.3s ease;   /* アニメーション */
    background-color: #fff;       /* 白背景 */
    box-shadow: 0 1px 3px rgba(0,0,0,0.08); /* 通常時の軽い影 */
}
/* マウスオーバー時 */
.new-entry-card-link:hover .new-entry-card {
    transform: translateY(-5px);              /* 少し浮かせる */
    box-shadow: 0 6px 15px rgba(0,0,0,0.15); /* 大きめの影 */
}
.new-entry-card .new-entry-card-thumb {
  width: 40%;      /* PCは40%幅 */
  max-width: 300px; /* 最大幅を300pxに制限 */
  flex-shrink: 0;
}

.new-entry-card .new-entry-card-thumb img {
  width: 100%;
  height: auto;
  display: block;
}

/* テキスト部分 */
.new-entry-card .new-entry-card-content {
  width: 60%;      /* PCは60%幅 */
  flex: 1;
  padding: 10px 5px 10px 5px; /* サムネイルと少し間隔 */
}
.widget-entry-card-content{
	margin-left: 0;
}

/**************************************************************
/* H2見出しの疑似要素をリセット*/
.entry-content h2 > span::before {
    content: none;
}

/* 自動生成される女優プロフのラベル欄の調整 */
.actress-profile-table th {
    width: 31.5% !important;
}

/* 価格表の黒ボタンの表示指定*/
.wp-block-table td{
	padding:0;
}
.inline-button-black{
  display: inline-block !important;
  box-sizing: border-box;
  max-width: 200px;
  width: 80%;
  height:50px;
  line-height:50px;
  padding:0;
  margin:0 auto;
  border-style: none;
  font-size: clamp(7px, 2vw, 16px); /* 画面が縮小すると文字も縮小する*/
}
[class*="inline-button-"] {
  border-radius: 0px; /* 少し丸くする */
}

/* DMMリリース作品用グリッド */
.dmm-release-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.3em;
  margin-bottom: 0.7em;
}

.dmm-release-item {
  font-size: 0.9em; /* 文字を少し小さめに */
}

.dmm-release-item .blogcard {
  max-width: 100%;
  font-size: 0.9em;
  transform: scale(1); /* カードを縮小 */
  transform-origin: top left;
	height: 300px; /* 好きな高さに固定 */
    overflow: hidden; /* はみ出た文字は隠す */
	margin-bottom: 5px;   /* 内側に余白を追加 */
	box-sizing: border-box;
}
.dmm-release-item .blogcard .blogcard-title {
    display: -webkit-box;
    -webkit-line-clamp: 3; /* 最大行数を3行に制限 */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.blogcard-title {
  margin-bottom: 1em;
}

/* スマホ対応 */
@media screen and (max-width: 1023px){
.dmm-release-item .blogcard {
  max-width: 100%;
  font-size: 0.9em;
  transform: scale(1); /* カードを縮小 */
  transform-origin: top left;
	height: 280px; /* 好きな高さに固定 */
    overflow: hidden; /* はみ出た文字は隠す */
	margin-bottom: 5px;   /* 内側に余白を追加 */
	box-sizing: border-box;
}

  .dmm-release-grid {
    grid-template-columns: repeat(4, 1fr); /* タブレットは３列 */
  }
  .new-entry-card {
    flex-direction: column; /* 縦並びに変更 */
  }
  .new-entry-card .new-entry-card-thumb,
  .new-entry-card .new-entry-card-content {
    width: 100%;  /* 幅100%で自動調整 */
    padding-left: 0;
  }
	
}
@media (max-width: 834px) {
  .dmm-release-grid {
    grid-template-columns: repeat(3, 1fr); /* タブレットは３列 */
  }
  .new-entry-card {
    flex-direction: column; /* 縦並びに変更 */
  }
  .new-entry-card .new-entry-card-thumb,
  .new-entry-card .new-entry-card-content {
    width: 100%;  /* 幅100%で自動調整 */
    padding-left: 0;
  }
}
@media (max-width: 480px) {
  .dmm-release-grid {
    grid-template-columns: repeat(2, 1fr);  /* スマホは２列 */
  }
	  .new-entry-card {
    flex-direction: column; /* 縦並びに変更 */
  }
  .new-entry-card .new-entry-card-thumb,
  .new-entry-card .new-entry-card-content {
    width: 100%;  /* 幅100%で自動調整 */
    padding-left: 0;
  }
}

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

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

}

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

}