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

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

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
/**固定ページで日付非表示**/
.page .date-tags {
display: none;
}
/****フィードとRSSボタン消す ****/
a.follow-button.feedly-button.feedly-follow-button-sq{
display:none;
}
a.follow-button.rss-button.rss-follow-button-sq{
display:none;
}
/*** 見出しリセット ***/
/* 見出し2 */
.article h2 {　
　padding: 0;
  background-color:transparent;
  border-radius: 0;
}
/**見出し3**/
.article h3 {
  padding: 0;
  border-top: 0;
  border-right: 0;
  border-bottom: 0;
  border-left: 0;
}
/**見出し4**/
.article h4 {
  padding: 0;
  border-top: 0;
  border-right: 0;
  border-bottom: 0;
  border-left: 0;
}
/**見出しカスタマイズ**/
/**見出し２**/
.article h2 {
  background: #5AA9C8; /*背景色*/
  padding: 0.5em;/*文字周りの余白*/
  color: white;/*文字を白に*/
  border-radius: 1.0em;/*角の丸み*/
}
/**見出し３**/
.article h3 {
  border-bottom: solid 3px #bbc8e6;
  position: relative;
}

.article h3:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #e6cde3;
  bottom: -3px;
  width: 30%;
}
/**見出し４**/
.article h4 {
  position: relative;
  color: #333;
  text-shadow: 0 0 2px white;
}
.article h4:before {
  content: "";
  position: absolute;
  background: #94bedc;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  top: 50%;
  /* border: dashed 1px white; */
  left: -15px;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: -1;
}
/*ヘッダー非表示（投稿ページ）*/
.single #header {
		display: none;
}
/*記事一覧タイトル背景色*/
.a-wrap{ /* インデックスページの記事背景色 */
background-color: #fff0f9;
}
/***タグエリア****/
.tagcloud a {
    background: #fff5da;
    border: 1px solid #ccc; 
    border-radius: 20px; /*角の丸み*/
    color: #555; /*文字色*/
    display: inline-block;
    padding: 3px 10px;
    text-decoration: none;
    font-size: 13px;
    margin: 2px;
    flex: 0 1 auto;
    display: flex;
    justify-content: space-between;
}
.tagcloud a .tag-caption::before {
    content: ""; /*アイコンの変更*/
    padding-right: 3px;
}
.tagcloud a:hover { /*マウスホバー時*/
    background: #f9b74c;
    border: 1px solid #0e1327;
    color: #fff;
    transition: 0.5s; /*アニメーションの時間*/
}
/************************************
** ●全画像のホバー時エフェクト処理
************************************/
a:hover img{
  opacity: 0.6; /*不透明度*/
  transition: all 0.8s ease; /*アニメーション*/
}
/**指定固定ページのヘッダー**/
.page-id-83 .header {
background: url("https://twin-studio.com/wp-content/uploads/2025/01/itk-01-2.jpg") no-repeat;
background-size: contain;
background-position: center;
}
.page-id-85 .header {
background: url("https://twin-studio.com/wp-content/uploads/2025/02/mm01.jpg") no-repeat;
background-size: contain;
background-position: center;
}
.page-id-96 .header {
background: url("https://twin-studio.com/wp-content/uploads/2025/06/comic1.jpg") no-repeat;
background-size: contain;
background-position: center;
}
/*固定ページロゴ非表示*/
.page-id-83 .logo > a img {
	visibility: hidden;
}
.page-id-85 .logo > a img {
	visibility: hidden;
}
.page-id-96 .logo > a img {
	visibility: hidden;
}
/**固定ページエリア毎に背景色区切る**/
.change-area {
    background: #f8f9fc;
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
    padding-right: calc(50vw - 50%);
    padding-left: calc(50vw - 50%);
}