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

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



:root {
    --seasongradation:linear-gradient( 89.9deg,  rgba(208,246,255,1) 0.1%, rgba(255,237,237,1) 47.9%, rgba(255,255,231,1) 100.2% );
    --seasoncolor1: #7ccbe1;
	--seasoncolor2: #6075c8;
	--seasoncolor3: #6075c8;/*アピールエリア*/
}

/************************************
** 全体の変更
************************************/

body{
	    font-family:"Helvetica Neue",
        Arial,
        "Hiragino Kaku Gothic ProN",
        "Hiragino Sans",
        Meiryo,
        sans-serif;
}

.article h2{
    margin-top: 1em;
	margin-bottom: 0.5em;
}

.entry-title, .archive-title{
    font-size: 26px;
    margin: 26px 0;
    line-height: 1.3;
}

/* アピールエリアの不自然な改行の矯正 */
span.aks {
   display: inline-block;
}

/*h2の数字を消す*/
.article h2::before{
    content: none !important;
}

/* 固定ページの幅を狭くする */

@media screen and (min-width: 1024px) {
  .article {
    max-width: 800px;
    margin: 0 auto;
  }
}

/* ヘッダー */

    #header-container:after {
      content:"";
      display: block;
      height: 6px;
      width: 100%;
background: rgb(34,45,77);
background-image:var(--seasongradation);}
/*
 * 
 * 2025春薄いピンクと藍
 * background-image: linear-gradient( 103.3deg,  rgba(252,225,208,1) 30%, rgba(255,173,214,1) 55.7%, rgba(162,186,245,1) 81.8% );
 * 
 * 2023年秋
 * 	background: rgb(34,45,77);
background: linear-gradient(90deg, rgba(34,45,77,1) 0%, rgba(69,64,96,1) 5%, rgba(97,79,119,1) 11%, rgba(148,76,122,1) 16%, rgba(185,75,112,1) 21%, rgba(191,84,103,1) 26%, rgba(209,107,103,1) 36%, rgba(227,138,120,1) 45%, rgba(238,155,103,1) 55%, rgba(252,165,94,1) 64%, rgba(248,190,90,1) 74%, rgba(251,221,99,1) 84%, rgba(255,225,130,1) 90%, rgba(245,233,159,1) 95%, rgba(255,246,217,1) 100%);}
 * 2023年お月見　青⇒黄色
 * background: rgb(1,20,38);
background: linear-gradient(90deg, rgba(1,20,38,1) 0%, rgba(4,61,116,1) 9%, rgba(4,121,235,1) 35%, rgba(49,210,233,1) 55%, rgba(198,228,113,1) 76%, rgba(255,192,0,1) 89%, rgba(252,176,69,1) 100%);}

 *春のピンク～黄緑 linear-gradient(91.17726892173312deg, rgba(255, 88, 134,1) 7.046477373908548%,rgba(255, 89, 134,1) 7.046477373908548%,rgba(255, 128, 145,1) 21.88141422045488%,rgba(255, 128, 109,1) 42.36319799568659%,rgba(255, 139, 78,1) 61.50505199123024%,rgba(246, 190, 71,1) 88.11222904503592%,rgba(253, 216, 112,1) 98.92737655251807%);
 * アムールモード（紫と赤と黄色）linear-gradient(89.48089634047335deg, rgba(151, 66, 158,1) 2.199741010906316%,rgba(152, 65, 156,1) 2.199741010906316%,rgba(197, 60, 118,1) 16.45396945651711%,rgba(226, 48, 72,1) 32.26887984872763%,rgba(251, 48, 50,1) 53.077972470057276%,rgba(253, 105, 63,1) 71.18188305061403%,rgba(246, 170, 78,1) 84.9158841806916%,rgba(245, 177, 81,1) 102.08338559328854%);
   薄水色　background-image: linear-gradient( 108.1deg,  rgba(167,220,225,1) 11.2%, rgba(217,239,242,1) 88.9% );
	9月　濃いめ紫 background-image: linear-gradient( 111.3deg,  rgba(74,105,187,1) 9.6%, rgba(205,77,204,1) 93.6% );
	8月爽やか background: linear-gradient(to right, #5433ff, #20bdff, #a5fecb);
　　6月あじさい background-image: linear-gradient( 64.5deg,  rgba(245,116,185,1) 14.7%, rgba(89,97,223,1) 88.7% );

　　8月青  background: linear-gradient(to right, #72c7e6 0%,#8ae2d7 100%);
      background: -webkit-linear-gradient(left, #72c7e6 0%,#8ae2d7 100%);

     9月グレープ　background-image: linear-gradient( 111.3deg,  rgba(74,105,187,1) 9.6%, rgba(205,77,204,1) 93.6% );

	10月もみじ background: linear-gradient(90deg, rgba(242,101,89,1) 0%, rgba(241,140,108,1) 12%, rgba(249,174,52,1) 58%, rgba(255,226,184,1) 85%, rgba(255,255,224,1) 100%); 

 11月、12月、1月　ピンク青　background-image: linear-gradient( 89.9deg,  rgba(208,246,255,1) 0.1%, rgba(255,237,237,1) 47.9%, rgba(255,255,231,1) 100.2% );

2月-3月 真っ赤　background-image: linear-gradient( 109.6deg,  rgba(162,2,63,1) 11.2%, rgba(231,62,68,1) 53.6%, rgba(255,129,79,1) 91.1% );

4月　ピンク⇒黄色⇒黄緑  background: rgb(242,101,89);
background-image: linear-gradient( 64.3deg,  rgba(254,122,152,0.81) 17.7%, rgba(255,206,134,1) 64.7%, rgba(172,253,163,0.64) 112.1% );

5月　緑　background-image: radial-gradient( circle farthest-corner at 10% 20%,  rgba(4,159,108,1) 0%, rgba(194,254,113,1) 90.1% );

*/

/* フッターの線 */

    #content:after{
      content:"";
      display: block;
      height: 6px;
      width: 100%;
background: rgb(34,45,77);
background-image:var(--seasongradation);}

.footer{
    margin-top:0px;
    padding: 8px;
}


/* アピールエリア */

.appeal{
	background-size:auto 100%;/*この場合は幅が自動設定*/
}


.appeal-in.wrap {
  width: 100%;
  padding: 0;
	min-height: 100px;
	height: 150px;
	
}

.appeal-content {
  width: 100%;
  max-width:none;
  margin: 0;
  padding: 2em 1em;
color:#404040;
	 background:none;
	background-color:none !important;;
  border-radius: 0;
}

/*   color:#404040; 文字黒系 */
/*     color:#f8fbf8; 文字白系 */

.appeal-title,
.appeal-message {
  max-width: 510px;
  margin-left: auto;
  margin-right: auto;
}

.appeal-title {
  display: inline-block;
	font-size : 16px;
  margin-bottom: 1em;
	color:var(--seasoncolor3);
  border-bottom: 2px solid currentColor;
}

/*	黄色color:#ffcf62; */
/*	濃紫色color:#3D2278; */
/*	赤色color:#DD5A5A; */
/*  紺色#6075c8 */

.appeal .appeal-in {
	min-height: 100px;
	height: 150px;
}

.appeal-message {
	font-size : 13px;
}

.appeal-message a{
	color:var(--seasoncolor3);}


/*480px以下*/
@media screen and (max-width: 480px){
	
.appeal-content {
  padding: 1em 1em;
}
	
.appeal-title,
.appeal-message {
  max-width: 510px;
  margin-left: 0;
  margin-right: 0;
}
	
.appeal {
	background-size: 100% 100%;
    background-image: url(https://lastrainbow.icu/wp-content/uploads/2021/11/header_4mb.jpg);
}
	
}




/* ブログカテゴリメニューの高さ調整 */

.cat-item{
	line-height: 1;}

/* 関連記事の微調整 */

.rect-entry-card a.related-entry-card-wrap, .rect-mini-card a.related-entry-card-wrap {
    margin-bottom: 0.5em;
    background: transparent;
    border-radius: 2px;
}

.entry-card-content, .related-entry-card-content {
    padding-bottom: 0em;
}

/* アイキャッチのカテゴリを消す */

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

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

/*480px以下*/
@media screen and (max-width: 480px){

	
/*ヘッダー幅調整*/
	
.header {
    height: 100%;
	line-height: 40px;/* ブログタイトルを高さの中央へ */
    padding:  0 0 0;
}
	
}

/************************************
** フロントページ
************************************/

.index_contents{
    display: flex;
}
.index_left{
    width: 230px;
}
.index_right{
    flex: 1;
}

.index_bana{
	width:200px;
	height:auto;
}

.ul_record{
	margin:0 0 0 0px;
	padding:0.5em;
	background-color: #f1f1f1;
	border:1px solid #cfcfcf;
	position: relative;
}

.ul_record li{
	list-style:none;
	color:var(--seasoncolor1); /*色*/
	font-size:0.9em;
}

.ul_record li:before{
  font-family: "Font Awesome 5 Free";
  content: '\f0da';
	color:var(--seasoncolor1); /*色*/
	font-size:0.8em;
  font-weight: 900;
	padding-right:0.3em;
}

.recored_txt{
	color:#404040;
	font-size:0.9em;
}

.recored_txt:before{
font-family: "Font Awesome 5 Free";
  content: ' \f141 ';
	color:var(--seasoncolor2);/*薄目色*/
	font-weight: 900;
 padding:0em 0.5em 0 0.3em;}

.record_2024::after {
    color: #ffffff;
    content: "2024";
    font-weight: bold;
	font-size:50px;
	float:right;
    padding: 0em;
	margin: -62px auto;}

.record_2023::after {
    color: #ffffff;
    content: "2023";
    font-weight: bold;
	font-size:50px;
	float:right;
    padding: 0em;
	margin: -62px auto;}

.record_2022::after {
    color: #ffffff;
    content: "2022";
    font-weight: bold;
	font-size:50px;
	float:right;
    padding: 0em;
	margin: -62px auto;}

.record_2021::after {
    color: #ffffff;
    content: "2021";
    font-weight: bold;
	font-size:50px;
	float:right;
    padding: 0em;
	margin: -62px auto;}

.record_2020::after {
    color: #ffffff;
    content: "2020";
    font-weight: bold;
	font-size:50px;
	float:right;
    padding: 0em;
	margin: -62px auto;}

.record_2015::after {
    color: #ffffff;
    content: "2015";
    font-weight: bold;
	font-size:50px;
	float:right;
    padding: 0em;
	margin: -60px auto;}

.record_2014::after {
    color: #ffffff;
    content: "2014";
    font-weight: bold;
	font-size:50px;
	float:right;
    padding: 0em;
	margin: -62px auto;}

.record_2013::after {
    color: #ffffff;
    content: "2013";
    font-weight: bold;
	font-size:50px;
	float:right;
    padding: 0em;
	margin: -62px auto;}

@media screen and (max-width: 480px) {
.record_2024::after,.record_2023::after,.record_2022::after,.record_2021::after,.record_2020::after,.record_2015::after,.record_2014::after,.record_2013::after{
	display:none;
	}
}


@media screen and (max-width: 480px) {
	
     .index_contents {
         display: block;
     }
     .index_left{
         width: 100%;
         margin: 0 auto;
		 padding:0 auto;
		 text-align:center;
     }
     .index_right{
         width: 100%;
		 padding:0 auto;
         margin: 0 auto;
     }
	
	.ul_record{
	padding:0.2em;
	margin:0 0 0 0px;
}
	.ul_record li{
	padding:0;
	margin: 0;
}
	.index_bana{
	width:100%;
	height:auto;
}
	
 }

/* タブ */

.tab-bg{
	margin-right: calc(50% - 50vw);
	margin-left: calc(50% - 50vw);
	background:#cccccc;
}

.tab-bg-box{
	margin-right:auto;
	margin-left:auto;
	max-width:800px;
}

.tab-wrap {
  display: flex;
  flex-wrap: wrap;
	width:100%;
	margin:20px 0;
}

.tab-wrap:after {
  content: '';
  width: 100%;
  height: 3px;
  background:var(--seasoncolor1); /* 色 */
  display: block;
  order: -1;
}

.tab-label {
  color: White;
background-color: #666666;
  font-weight: bold;
  white-space: nowrap;
  text-align: center;
padding: 10px 0.6em 8px 0.6em;
  order: -1;
  position: relative;
  z-index: 1;
  cursor: pointer;
  flex: 1;
}
.tab-label:not(:last-of-type) {
  margin-right: 0px;
}

.tab-content {
  width: 100%;
  height: 0;
  overflow: hidden;
  opacity: 0;
}
.tab-switch:checked+.tab-label {
  background:var(--seasoncolor1); /* 色 */
}

.tab-switch:checked+.tab-label+.tab-content {
  height: auto;
  overflow: auto;
  padding: 15px;
  opacity: 1;
  transition: .5s opacity;
}
.tab-switch {
  display: none;
}

/* 新着記事の日付表示 */

.widget-entry-card-date {
  display: block;
	float:right;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

.widget-entry-card-date::before{ /*人気記事の投稿日のアイコンの変更*/
font-family: "Font Awesome 5 Free";
content: "\f017"; /*fa-clockアイコン*/
padding-right: 1px; /*右余白*/
font-weight: 300; /*アイコンの太さ*/
	font-size : 0.8em;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

/*　新着記事　抜粋文字行制御 */

.new-entry-card-snippet{
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2; /* 任意の行数を指定 */
}

/* 新着記事 更新日マーク重複消す */

.widget-entry-card-date::before {
  font-family: "Font Awesome 5 Free";
	content: none;}

@media screen and (max-width: 480px) {
.new-entry-card-snippet{
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 4; /* 任意の行数を指定 */
}
}

/**************************************
 **汎用性高い
**************************************/

/* 引用 */

blockquote {
    padding: 1.5em 1.8em !important;
}

/* hr */

hr {
	opacity: 0.5; /* テーマカラーを半透明に */
	color:#ccc;
	margin-top:2.8em;
	margin-bottom:2.8em!important;}/* <p>の幅に合わせて↑余白 */
}



/* dl要素 */


	/* 左罫線、横並び */

	dl.style1{
		width: 100%;
	  	margin: 1em 0 1em 0;}

	.style1 dt {
	    float:left;
	    clear:both;
	    width:7em;
   		padding:1ex;
	    _width:8em;    /* WinIE */
	    white-space:nowrap;
		color: #587500;
		border-left:5px solid #91c100;}

	.style1 dd {
		margin-bottom: 0.2em;
	    margin-left:8em;    /* = dt.width + dt.padding */
   		padding:1ex;
		text-align: left;}

		.style1 dt a:link{ color: #587500; text-decoration:underline; }
	    .style1 dt a:visited{ color: #587500; text-decoration:underline; }
	    .style1 dt a:hover{ color: #666666; text-decoration:none; }


	/* 枠線付、上下 dolls*用語 */
	
	dl.style2{
        margin:1em 1em 1em 0em;} 

	.style2 dt{
        border-bottom: 1px solid #cccccc;
        padding    : 0px 0 0 0;
        margin: 1em 0 0 1em;}

	.style2 dt::before{	font-family: 'Font Awesome 5 Free';
		content: '\f00c';
		font-weight: 900;
		color: #666666;
		margin:0 10px 0 0;}

	.style2 dd {
        line-height : 1.4em;
        padding: 0.5em 1em 0.3em 1em;
        margin : 0 0 0 0;
        font-size:0.9em ;}

	/* 上下 備忘録用 */
	
	dl.style3{
        margin:1em 0em 2em 0em;} 

	.style3 dt{
		background-color:#E6E6E6;
   		padding:1ex;
        margin: 2em 0 0 0em;}

	.style3 dt::before{	font-family: 'Font Awesome 5 Free';
		content: '\f00c';
		font-weight: 900;
		color: #666666;
		margin:0 10px 0 0;}

	.style3 dd {
        line-height : 1.8em;
   		padding:1ex;
		color:#555555;
        margin : 0 0 0 0;
        font-size:1em ;}

	/* 上下 備忘録用 ひらめきマーク*/
	
	dl.style4{
        margin:1em 0em 2em 0em;} 

	.style4 dt{
		background-color:#9ccc65;
   		padding:1ex;
        margin: 2em 0 0 0em;}

	.style4 dt::before{	font-family: 'Font Awesome 5 Free';
		content: '\f0d0';
		font-weight: 900;
		color: #fcfefb;
		margin:0 10px 0 0;}

	.style4 dd {
        line-height : 1.8em;
   		padding:1ex;
		color:#555555;
        margin : 0 0 0 0;
        font-size:1em ;}


/**************************************
 **サイドバー周り
**************************************/

/*---折り畳みアーカイブウィジェット---*/
.widget_archive a.year{ /*各年*/
	cursor: pointer;
	border-bottom: 1px dotted #ccc; /*各年に下線を引く*/
}
.widget_archive a.year::after{ /*各年横のアイコン*/
	font-family: "Font Awesome 5 Free";
	content: '\f107'; /* アイコンの指定 */
	position: relative; /* 相対配置 */
	left: 5px; /* アイコンの位置 */
	font-weight: bold;
}
.widget_archive .years ul { /*各月*/
	display: flex;
	flex-flow: row wrap;
	margin-left: 5px; /*インデント*/
	font-size: 1rem;
	text-decoration: underline; /*各月に下線を引く*/
}
.widget_archive ul.years li {
	padding: 0 1px; /*各月の間隔*/
}
#sidebar .widget_archive ul.years li :hover { /*マウスホバー時*/
	background: none;
	transition: 0.1s;
	color: #B72F05;
}
.widget_archive ul.years .hide { /*各年をクリックすると開閉*/
	margin: 0;
	height: 0;
	opacity: 0;
	visibility: hidden;
}


/**************************************
 **ギャラリー
**************************************/

.img_border{
	border: 1px #cccccc solid;
}



/* イラスト 大き目サイズ flexbox化 */

div.illust{
	margin:0px; /* 一旦リセット */
	padding:0px; /* 一旦リセット */
	text-align: left;
	float:left;
}

.illust_flex{
	margin:0px; /* 一旦リセット */
	padding:0px; /* 一旦リセット */
  	display: flex;
	flex-wrap: wrap; /* 子要素の折り返し */
 	flex-direction: row; /* 子要素の並ぶ向き */
	align-content: flex-start; /* 複数行にした時の揃え */
	text-align: left;
}

.illust_flex li{
	margin:0px; /* 一旦リセット */
	padding:0px; /* 一旦リセット */
	text-align: left;
	list-style:none;
}

.illust_flex img {
	margin:0px 0 0px 0; /* 一旦リセット */
	padding:0px; /* 一旦リセット */
	flex: none;
	width: 100px; /* 縮小対策↓↓ */
	height:100px;
   flex-shrink: 0;
	float:left;
	border: 1px #cccccc solid;
	  position: relative;
}

@media screen and (max-width: 1023px){

  .illust_flex{	margin:0px; /* 一旦リセット */
	  padding:0px; /* 一旦リセット */}
	
	.illust_flex li{
	margin:0px; /* 一旦リセット */
	padding:0px; /* 一旦リセット */}
	
.illust_flex img {
	margin:0px 0 0 -30px; /* 何故か左が30px開いてるのでその対策  */
	padding:0px; /* 一旦リセット */
	flex: none;
	width: 130px; /* 縮小対策↓↓ 何故か左が30px開いてるのでその対策（ほんとの画像は100px）  */
	height:100px;
   flex-shrink: 0;
}
	
}

/*834px以下*/
@media screen and (max-width: 834px){
	div.illust{
	margin:0px; /* 一旦リセット */
	padding:0px; /* 一旦リセット */
	text-align: left;
}
	
	  .illust_flex{	margin:0px; /* 一旦リセット */
	  padding:0px; /* 一旦リセット */}
  
	.illust_flex li{
	margin:0px; /* 一旦リセット */
	padding:0px; /* 一旦リセット */}
	
	.illust_flex img {
	margin:0px 0 0px 0; /* 一旦リセット */
	padding:0px; /* 一旦リセット */
	flex: none;
	width: 100px; /* 縮小対策↓↓ */
	height:100px;
   flex-shrink: 0;
	float:left;
}
}

/*480px以下*/
@media screen and (max-width: 480px){
	div.illust{
	margin:0px; /* 一旦リセット */
	padding:0px; /* 一旦リセット */
	text-align: left;
}
	
	  .illust_flex{	margin:0px; /* 一旦リセット */
	  padding:0px; /* 一旦リセット */}
	
	.illust_flex li{
	margin:0px; /* 一旦リセット */
	padding:0px; /* 一旦リセット */}
	
	.illust_flex img {
	margin:0px 0 0px 0; /* 一旦リセット */
	padding:0px; /* 一旦リセット */
	flex: none;
	width: 90px; /* 縮小対策↓↓ */
	height:90px;
   flex-shrink: 0;
	float:left;
}
	
}

/* イラスト 小さ目サイズ flexbox化 */

div.illust_log{
	margin:0px; /* 一旦リセット */
	padding:0px; /* 一旦リセット */
	text-align: left;
	float:left;
}

.illust_log_flex{
	margin:0px; /* 一旦リセット */
	padding:0px; /* 一旦リセット */
  	display: flex;
	flex-wrap: wrap; /* 子要素の折り返し */
 	flex-direction: row; /* 子要素の並ぶ向き */
	align-content: flex-start; /* 複数行にした時の揃え */
	text-align: left;
}

.illust_log_flex li{
	margin:0px; /* 一旦リセット */
	padding:0px; /* 一旦リセット */
	text-align: left;
	list-style:none;
}

.illust_log_flex img {
	margin:0px 0 0px 0; /* 一旦リセット */
	padding:0px; /* 一旦リセット */
	flex: none;
	width: 80px; /* 縮小対策↓↓ */
	height:80px;
   flex-shrink: 0;
	float:left;
	border: 1px #cccccc solid;
}

@media screen and (max-width: 1023px){

  .illust_log_flex{	margin:0px; /* 一旦リセット */
	  padding:0px; /* 一旦リセット */}
	
	.illust_log_flex li{
	margin:0px; /* 一旦リセット */
	padding:0px; /* 一旦リセット */}
	
.illust_log_flex img {
	margin:0px 0 0 -30px; /* 何故か左が30px開いてるのでその対策  */
	padding:0px; /* 一旦リセット */
	flex: none;
	width: 110px; /* 縮小対策↓↓ 何故か左が30px開いてるのでその対策（ほんとの画像は100px）  */
	height:80px;
   flex-shrink: 0;
}
	
}

/*834px以下*/
@media screen and (max-width: 834px){
	div.illust_log{
	margin:0px; /* 一旦リセット */
	padding:0px; /* 一旦リセット */
	text-align: left;
}
	
	  .illust_log_flex{	margin:0px; /* 一旦リセット */
	  padding:0px; /* 一旦リセット */}
  
	.illust_log_flex li{
	margin:0px; /* 一旦リセット */
	padding:0px; /* 一旦リセット */}
	
	.illust_log_flex img {
	margin:0px 0 0px 0; /* 一旦リセット */
	padding:0px; /* 一旦リセット */
	flex: none;
	width: 80px; /* 縮小対策↓↓ */
	height:80px;
   flex-shrink: 0;
	float:left;
}
}

/*480px以下*/
@media screen and (max-width: 480px){
	div.illust_log{
	margin:0px; /* 一旦リセット */
	padding:0px; /* 一旦リセット */
	text-align: left;
}
	
	  .illust_log_flex{	margin:0px; /* 一旦リセット */
	  padding:0px; /* 一旦リセット */}
	
	.illust_log_flex li{
	margin:0px; /* 一旦リセット */
	padding:0px; /* 一旦リセット */}
	
	.illust_log_flex img {
	margin:0px 0 0px 0; /* 一旦リセット */
	padding:0px; /* 一旦リセット */
	flex: none;
	width: 50px; /* 縮小対策↓↓ */
	height:50px;
   flex-shrink: 0;
	float:left;
}
	
}

/* 画像に枠線 */

.is-style-default img{border:1px solid #999999;}


/* 新着短編漫画横並び　サムネイル大の時 */

.new-entry-cards.comic_short {
    display: flex;
    flex-wrap: wrap;
}

.new-entry-cards.comic_short a {
    width: 30%;
	margin:0 5px 5px 0;
}

.new-entry-cards.comic_short  a{
border: none; /*枠線形状・色*/
	box-shadow: none;
}

.new-entry-cards.comic_short  a:hover{
border: none; /*枠線形状・色*/
	box-shadow: none;
}

.comic_short .widget-entry-card-date{
  display: block;
	float:right;
	margin: 0 -15px 0 0;　/* 日付を右につめる微調整 */
	padding:0;
}



/*768px以下*/
@media screen and (max-width: 768px){
  .new-entry-cards.comic_short a {
      width: 47%;
  }
	
.comic_short .new-entry-card-title {
	font-size:13px; /*短編漫画のタイトルスマホ用*/
}
.comic_short .widget-entry-card-date::before{ /*人気記事の投稿日のアイコンの変更*/
	font-size : 0.6em;
}
.comic_short .widget-entry-card-date {
	font-size:13px;
}

	
}

/*480px以下*/
@media screen and (max-width: 480px){
  .new-entry-cards.comic_short a {
      width: 47%;
	  
	  
  }

} 

.new-entry-cards.comic_short img {
	border: solid 1px #ddd;
}

/* 新着漫画横並び　小ネタ */

.new-entry-cards.comic_log {
    display: flex;
    flex-wrap: wrap;
}

.new-entry-cards.comic_log a {
    width: 20%;
	margin:0 5px 5px 0;
}

.new-entry-cards.comic_log  a{
border: none; /*枠線形状・色*/
	box-shadow: none;
}

.new-entry-cards.comic_log  a:hover{
border: none; /*枠線形状・色*/
	box-shadow: none;
}

.comic_log .new-entry-card-title {
	font-size:12px; /*小ネタ漫画のタイトル*/
}

.comic_log .new-entry-card-post-date{
	display: none; /*日付の非表示*/
}

.comic_log .widget-entry-card-date::before{
	display: none; /*日付の非表示*/
}

/*768px以下*/
@media screen and (max-width: 768px){
  .new-entry-cards.comic_log a {
      width: 30%;
  }
}

/*480px以下*/
@media screen and (max-width: 480px){
  .new-entry-cards.comic_log a {
      width: 30%;
  }
} 

.new-entry-cards.comic_log img {
	border: solid 1px #ddd;
}

/* 画像上のNEW表示*/

.img_new{
  position: relative;
  }

.img_new p{
  position: absolute;
  bottom: 1px;/*画像の右下に配置*/
  right: 1px;
  margin: 0; /*余計な隙間を除く*/
  color: white;/*文字を白に*/
background: rgba(43, 43, 43, 0.8);/*背景を半透明に*/
  font-size: 12px;
  line-height: 1;/*行高は1に*/
  padding: 5px 10px;/*文字周りの余白*/
  }


/**************************************
 **創作ページ COLORFUL
**************************************/

/* キャラ設定 BOX */

#List_Character {
    border: 2px solid #da4033;
    border-radius: 4px;
    margin: 2em 0;
    padding: 1em 1em 0 1em;
    position: relative;
}
#List_Character::before {
    background-color: #fff;
    color: #da4033;
    content: "キャラクター設定";
    font-weight: bold;
    left: 1em;
    padding: 0 .5em;
    position: absolute;
    top: -1em;
}

/* クリアフィックス */
#List_Character ul:after {
  content: "";
  clear: both;
  display: block;
}

#List_Character ul li {
  display: block;
  float: left;
  height: 50px;
	width: 18%;
  list-style-type: none;
  text-align: left;
	margin-bottom:-1.5em;
	margin-top:0em;
	  line-height: 50px;
}

#List_Character ul li a{
	text-decoration:none;
	color:#2b2b2b;
}


#List_Character ul li a::before{
font-family: 'Font Awesome 5 Free';
		content: '\f061';
		font-weight: 900;
		color: #da4033;
	margin: 0 5px 0 0;

}

.color_red{
	color:#da4033;
	opacity: 0.8;
}


/*480px以下*/
@media screen and (max-width: 480px){

	/* PC版と仕組み自体違うから修正時注意 */
	
#List_Character {
    border: 2px solid #da4033;
    border-radius: 4px;
    margin: 2em 0;
    padding: 5px 5px 0 5px;
    position: relative;
}
	#List_Character ul{
	display: flex;
	justify-content: flex-start; 
	font-size:0.9em;
	height:auto;
	width:95%;
	margin:0 0 1em 0;
}

	#List_Character ul li {
  display: inline;
  float: left;
  height: auto;
width: auto;
  list-style-type: none;
  text-align: left;
	margin-bottom:-1.5em;
	margin-top:0em;
}

	.screen_none{
		display:none;!important /* スマホで表示消す */
		width: 0%;!important
	}
	
} 


/* 世界観設定 BOX */

#world_set{
    background-color: #eee;
	background-image: url(https://lastrainbow.icu/wp-content/uploads/2021/07/colorful_bg_word.png); 
    margin: 2em 0;
    padding: 2em;
}

#world_set p{
    margin: 0;
    padding: 0 100px 0 0;
}

/*
#world_set::after {
    color: #1c1c1c;
    content: "世界観設定";
    font-weight: bold;
	font-size:20px;
	float:right;
    padding: 0em;
	margin:3px -1em 0px 0;
}
*/

/* スピリットカラー設定 BOX */

#color_set {
    background-color: #eee;
	background-image: url(https://lastrainbow.icu/wp-content/uploads/2021/07/colorful_bg_sp.png); 
    margin: 2em 0;
    padding: 2em;
	color: #2b2b2b;
}

/*
#color_set::after {
    color: #1c1c1c;
    content: "スピリットカラー";
    font-weight: bold;
	font-size:20px;
	float:right;
    padding: 0em;
	margin:3px -1em 0px 0;
}
*/


#color_set p{
    margin: 0;
    padding: 0 0 0em 0;
}


/*769px以下 ipad */
@media screen and (max-width: 769px){

#world_set p{
	font-size:0.9em;
    margin: 0;
    padding: 0 100px 0 0;
}
	
#color_set p{
	font-size:0.9em;
    margin: 0;
    padding: 0 0 0em 0;
}
}


/*480px以下*/
@media screen and (max-width: 480px){
	#world_set{
    background-color: #eee;
	background-image: none; 
    margin: 2em 0;
    padding: 1em;
}

#world_set p{
    margin: 0;
    padding: 0 0px 0 0;
}
	
	
#color_set {
    background-color: #eee;
	background-image: url(https://lastrainbow.icu/wp-content/uploads/2021/07/colorful_bg_sp_res.png); 
    margin: 2em 0;
    padding: 1em;
	color: #2b2b2b;
}
	
#color_set p{
    margin: 0;
    padding: 0 0 0em 0;
}
		
}


/* キャラ設定 */

.introduction{
  position: relative;
  padding: 0 65px;
  text-align: center;
	color:#BDC0BA;
  margin:0;
}

.introduction:before {
  position: absolute;
  top: calc(50% - 1px);
  left: 0;
  width: 100%;
  height: 2px;
  content: '';
  background: #F2F2F2;
}

.introduction span{
  position: relative;
  padding: 0 1em;
  background: #fff;
}


.character_date p{
	font-size:0.9em;
	margin:0 0 0.5em 0;
	padding:0;
}

.name_ruby {
	margin:0 0 0 2em;
	font-size:0.5em;
	color:#777777;
}

.datelist {
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: hidden;
}

/*480px以下*/
@media screen and (max-width: 480px){
.datelist {
  margin: 0 0 0 -2em;
  padding: 0;
  list-style: none;
  overflow: hidden;
}
} 


.datelist li {
  display: inline;/*横に並ぶように*/
  list-style: none;
	font-size:0.9em;
}

.datelist li:before {/* [を表示*/
  content: ' [';
  padding: 0 0.2em;
  color: rgba(102, 102, 102, 0.5);
}

.datelist li:after {/* [を表示*/
  content: '] ';
  padding: 0 0.2em;
  color: rgba(102, 102, 102, 0.5);
}

.spcolor{
	height:75px;
	    background-image: url(https://lastrainbow.icu/wp-content/uploads/2021/07/spritcolor.png); 
	    background-position: right;/* 背景画像指定 */
	      background-repeat  : no-repeat;
}

.spcolor_none{
	height:75px;
}

/*480px以下*/
@media screen and (max-width: 480px){
	.spcolor{
	height:75px;
	    background-image: url(https://lastrainbow.icu/wp-content/uploads/2021/07/spritcolor_res.png); 
	    background-position: right;/* 背景画像指定 */
	      background-repeat  : no-repeat;
}


}


.spcolor p{
 line-height: 75px;/*上下中央に配置*/
	font-weight: bold; 
}

.spcolor_none p{
 line-height: 75px;/*上下中央に配置*/
	font-weight: bold; 
}


.spcolor_title {
  position: relative;
  padding: 1em 2em 1em 2em;
	margin:0 1em 0 0;
  color: #fff;
  border-radius: 30vh;
  background: #656765;
		font-weight: normal; 
}

.colorful_hr{
	border:none;
  height: 8px;
	width:95%;
  background-image: repeating-linear-gradient(45deg, #ccc 0, #ccc 1px, transparent 0, transparent 50%);
  background-size: 8px 8px;
	padding:0 auto 0 auto;
	margin:1em auto 2em auto;
}

.mask_date{
	background-image: url(https://lastrainbow.icu/wp-content/uploads/2021/07/colorful_mask.png); 
	  position: relative;
	  z-index: 30;
}

.mask_date2{
	background-image: url(https://lastrainbow.icu/wp-content/uploads/2021/07/colorful_reverse.png); 
	  position: relative;
	  z-index: 30;
}

.mask_date2 a{
	color:#000000;
}

.mask_date3{
	background-image: url(https://lastrainbow.icu/wp-content/uploads/2024/03/colorful_mask2.png); 
	position: relative;
	z-index: 30;
}


/* タグリスト */

.taglist {
  margin: 1em 0 0 0;
  padding: 0;
  list-style: none;
  overflow: hidden;
}

.taglist li {
  display: inline;/*横に並ぶように*/
  list-style: none;
	font-size:0.9em;
	float:right;
}

.taglist li:before {/* [を表示*/
	font-family: "Font Awesome 5 Free";
	content: '\f02b';
	font-weight: 900;
	padding: 0 0.2em;
	color: rgba(102, 102, 102, 0.5);
}

/*480px以下*/
@media screen and (max-width: 480px){
.taglist {
  margin: 1em 0 0 0;
	padding: 0;
	padding-left: 0px!important;
  list-style: none;
  overflow: hidden;
	text-align: center;
	
}

.taglist li {
  display: inline;/*横に並ぶように*/
  list-style: none;
	font-size:0.9em;
	float:none;
}	
} 


/*キャラ事個別指定*/

.c_kohaku{
	background-color:#cb1d30;
}

.c_yuuiti{
	 background-color: #48d1cc;}
}

.c_botan{

}

.c_tsubasa{
	 background-color: #fafdff;}

.c_menou{
	background-color:#c71585;
}

.c_sora{
	background-color:#daa520;
}

.c_lime{
	background-color:#402923;
}

.c_hisui{
	background-color:#00984f;
}

.c_remon{
	background-color:#001d42;
}

.c_foolfool{
	background-color:#000000;
}


.date_kohaku{
		    background-image: url(https://lastrainbow.icu/wp-content/uploads/2021/07/cat_kohaku.jpg); 
	    background-position: top right;/* 背景画像指定 */
	      background-repeat  : no-repeat;
}

.date_yuuiti{
		    background-image: url(https://lastrainbow.icu/wp-content/uploads/2021/07/cat_yuuiti.jpg); 
	    background-position: top right;/* 背景画像指定 */
	      background-repeat  : no-repeat;
}

.date_tsubasa{
		    background-image: url(https://lastrainbow.icu/wp-content/uploads/2021/07/cat_tsubasa.jpg); 
	    background-position: top right;/* 背景画像指定 */
	      background-repeat  : no-repeat;
}

.date_menou{
		    background-image: url(https://lastrainbow.icu/wp-content/uploads/2021/07/cat_menou.jpg); 
	    background-position: top right;/* 背景画像指定 */
	      background-repeat  : no-repeat;
}

.date_sora{
		    background-image: url(https://lastrainbow.icu/wp-content/uploads/2021/07/cat_sora.jpg); 
	    background-position: top right;/* 背景画像指定 */
	      background-repeat  : no-repeat;
}

.date_lime{
		    background-image: url(https://lastrainbow.icu/wp-content/uploads/2021/07/cat_lime.jpg); 
	    background-position: top right;/* 背景画像指定 */
	      background-repeat  : no-repeat;
}

.date_hisui{
		    background-image: url(https://lastrainbow.icu/wp-content/uploads/2022/10/cat_hisui.jpg); 
	    background-position: top right;/* 背景画像指定 */
	      background-repeat  : no-repeat;
}

.date_remon{
		    background-image: url(); 
	    background-position: top right;/* 背景画像指定 */
	      background-repeat  : no-repeat;
}


/*480px以下*/
@media screen and (max-width: 480px){

	
.date_kohaku,.date_yuuiti,.date_tsubasa,.date_lime,.date_sora,.date_menou,.date_hisui,.date_remon{
	background-size:80%; 
}
	
	
}

/* 特殊画面変移 */

.start {
	background: #FFF;
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 9000;
}
.start p {
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	display: none;
	z-index: 9999;
	width: 280px;
}

/**************************************
 **創作ページ Dolls*
**************************************/

ul.dolls_mainnavi{
	  display: flex;
 	 justify-content: space-between;
	width:500px;
	margin:0 auto 1em auto;
}

.dolls_mainnavi li{
	list-style:none;}

.dolls_mainnavi li a{
	display: block;
	width:7em;
	text-align:center;
	text-decoration: none;
	list-style:none;
	background-image: linear-gradient(60deg, #29323c 0%, #485563 100%);
	border : solid 1px #29323c ;
	color:#ffffff;
	padding:0.5em;}

.dolls_mainnavi li a:hover{
	background-image: linear-gradient(60deg, #29323c 0%, #485563 100%);
}


/*480px以下*/
@media screen and (max-width: 480px){
	ul.dolls_mainnavi{
	  display: flex;
 	 justify-content: center;
	font-size:0.9em;
	width:95%;
	margin:0 0 1em 0;
}
	
	.dolls_mainnavi li a{
	display: block;
	text-align:center;
	text-decoration: none;
	list-style:none;
	background-image: linear-gradient(60deg, #29323c 0%, #485563 100%);
	border : solid 1px #29323c ;
	color:#ffffff;
	padding:0.5em;}
	
}




/* タイトル周り */
/* 打ち消さないとh2のspanで数字が出る */

.entry-content h2 > span::before {
    content: "";
    counter-increment: h2;
}

/* 打ち消さないとh2のspanでテーマカラーが出てくる */

.article h2 > span::after {
background:none;
}



	h2.story {
			background : url("https://lastrainbow.icu/wp-content/uploads/2021/07/h2_01.png") 0 50% no-repeat;
			height: 110px;
        	font-size: 1.2em;
			letter-spacing : 0.3em;
			border-top:none;
        	border-bottom: 1px dashed #cccccc;
			color:#2b2b2b;
        	padding    : 60px 0 10px 130px;
        	margin : 2em 0 0.5em 0;} 

	h2.character {
			background : url("https://lastrainbow.icu/wp-content/uploads/2021/07/h2_02.png") 0 50% no-repeat;
			height: 110px;
        	font-size: 1.2em;
			letter-spacing : 0.3em;
			border-top:none;
			color:#2b2b2b;
        	border-bottom: 1px dashed #cccccc;
        	padding    : 60px 0 10px 130px;
        	margin : 2em 0 0.5em 0;} 

	h2.short {
			background : url("../img/h2_03.png") 0 50% no-repeat;
			height: 59px;
        	font-size: 1.2em;
			letter-spacing : 0.3em;
			border-top:none;
        	border-bottom: 1px dashed #cccccc;
        	padding    : 60px 0 10px 130px;
        	margin : 2em 0 0.5em 0;} 

	h2.word {
			background : url("https://lastrainbow.icu/wp-content/uploads/2021/07/h2_04.png") 0 50% no-repeat;
			height: 110px;
        	font-size: 1.2em;
			letter-spacing : 0.3em;
			border-top:none;
        	border-bottom: 1px dashed #cccccc;
        	padding    : 60px 0 10px 130px;
        	margin : 2em 0 0.5em 0;} 


/*480px以下*/
@media screen and (max-width: 480px){
		h2.story {
			background : url("https://lastrainbow.icu/wp-content/uploads/2021/07/h2_01.png") 0 50% no-repeat;
			height: 119px;
        	font-size: 1.1em;
			letter-spacing : 0.1em;
			border-top:none;
        	border-bottom: 1px dashed #cccccc;
        	padding    : 60px 0 10px 130px;
        	margin : 2em 0 0.5em 0;} 
	
	h2.character {
			background : url("https://lastrainbow.icu/wp-content/uploads/2021/07/h2_02.png") 0 50% no-repeat;
			height: 110px;
        	font-size: 1.2em;
			letter-spacing : 0.1em;
			border-top:none;
			color:#2b2b2b;
        	border-bottom: 1px dashed #cccccc;
        	padding    : 60px 0 10px 130px;
        	margin : 2em 0 0.5em 0;} 
	
	
}


h3.dolls_h3{
        font-size: 1em;
        color: #c54e00;
		letter-spacing : 0.1em;
        padding    : 0 0 0 20px;
        margin : 0em 0 0.5em 0;}


h4.dolls_h4{
        font-size: 1em;
        color: #c54e00;
		letter-spacing : 0.1em;
        padding    : 0 0 0 14px;
        margin : 0em 0 0.5em 1em;}

/*↓漫画画像の左寄せ 作製期間の右寄せ */

img.left{
        margin-top: 0px;
        margin-bottom: 0px;
        margin-right:1em ;
        border:0;
        float: left;}

p.intr{
	font-size: 0.9em;
	padding:0.5em 0 0 0;
	margin:0 0 1em 0;
}


/*480px以下*/
@media screen and (max-width: 480px){
	
h3.dolls_h3{
        font-size: 0.9em;
        color: #c54e00;
		letter-spacing : 0em;
 		line-height:100px;
        margin : 0em 0 0.5em 0;}
	
	h3.title_act3{
        font-size: 0.9em;
        color: #c54e00;
		letter-spacing : 0em;
 		line-height:50px;
        margin : 0em 0 0.5em 0;}

	
p.intr{
	font-size: 0.9em;
	clear:both;
	padding:0;
	margin:1em 0 1em 0;
}

}

/*360px以下*/
@media screen and (max-width: 360px){
	
h3.dolls_h3{
        font-size: 0.8em;
        color: #c54e00;
		letter-spacing : 0em;
 		line-height:100px;
        margin : 0em 0 0.5em 0;}
	
		h3.title_act3{
        font-size: 0.8em;
        color: #c54e00;
		letter-spacing : 0em;
 		line-height:50px;
        margin : 0em 0 0.5em 0;}

	
p.intr{
	font-size: 0.8em;
	clear:both;
	padding:0;
	margin:1em 0 1em 0;
}

	
}


p.days{
		margin: 0 0 1em 0;
        text-align: right;}

/* キャラ紹介 */

p.character_name{
		font-size: 1em;
		padding: 1em 0 0 0;
		margin: 0 0 0 100px;
	    border-bottom: 1px dashed #666666;
} 

p.character_txt{
		font-size: 0.8em;
		padding: 0.5em 0 0 0}

p.character_words{
		font-size: 0.9em;
		margin:30px 0 0 0px;
		text-align: center;
	clear:both;
		transform: rotate(-5deg);
		color: #666666;}

p.character_words2{
		font-size: 0.9em;
		margin:30px 0 0 0px;
		clear:both;
		text-align: center;
		transform: rotate(5deg);
		color: #666666;}

img.portrait{
	width: 130px;
	height: auto;
        vertical-align: text-bottom;
		float: left;
        margin: 0 0.5em 1em 0;
        border:0;}

span.gray{
        color: #999999;}

span.font08{
	font-size:0.8em;
}

span.font07{
	font-size:0.7em;
}

span.font05{
	font-size:0.5em;
	letter-spacing : 0em;
}


/**/

br.clear{
		clear : both;
		margin-bottom: 1em;}


/* 漫画ページ 前後リスト */

.comic_nav {
  list-style: none;
	margin:auto;
	padding:auto;
	text-align:center;
	padding-left:0;
}
 
.comic_nav li {
  width: auto;
  text-align: center;
  background-color: #cccccc;
 color:#2b2b2b;
  height: 50px;
  line-height: 50px;
}
 
.comic_nav a{
  text-decoration: none;
	color:#484848!important;
  font-weight: bold;
  padding: 20px;
}

/**************************************
 **追加項目 細かい場所
**************************************/

/* dl横並びレスポンシブ */

.dl_side dl {
display: flex;
flex-flow: row wrap;
	border-top: 1px solid #ccc;
width: 100%;
}
.dl_side dt {
flex-basis: 15%;
padding-top: 10px;
padding-bottom: 10px;
		padding-left:1em;
margin:0;
background-color: #f1f1f1;
border-bottom: 1px solid #ccc;
}
.dl_side dd {
flex-basis: 85%;
padding-top: 10px;
padding-bottom: 10px;
	padding-left:1em;
margin:0;
background-color: #fff;
border-bottom: 1px solid #ccc;
}

@media screen and (max-width: 559px) {
.dl_side dl {
flex-flow: column;
}
}

/* dl横並びレスポンシブ プロフィール用*/

.dl_prof dl {
display: flex;
flex-flow: row wrap;
	border-top: 1px solid #ccc;
width: 100%;
}
.dl_prof dt {
flex-basis: 20%;
padding-top: 10px;
padding-bottom: 10px;
		padding-left:1em;
margin:0;
background-color: #f3f3f3;
border-bottom: 1px solid #ccc;
}
.dl_prof dd {
flex-basis: 80%;
padding-top: 10px;
padding-bottom: 10px;
	padding-left:1em;
	padding-right:1em;
margin:0;
background-color: #fff;
border-bottom: 1px solid #ccc;
}

@media screen and (max-width: 559px) {
.dl_prof dl {
flex-flow: column;
	}}

/* dl横並びレスポンシブ 語りまとめ用*/

.dl_katari dl {
display: flex;
flex-flow: row wrap;
	border-top: 1px solid #ccc;
width: 100%;
}
.dl_katari dt {
flex-basis: 35%;
padding-top: 12px;
padding-bottom: 12px;
		padding-left:1em;
margin:0;
background-color: #f3f3f3;
border-bottom: 1px solid #ccc;
}

.dl_katari dd {
flex-basis: 65%;
padding-top: 10px;
padding-bottom: 10px;
	padding-left:0em;
	padding-right:1em;
margin:0;
background-color: #fff;
border-bottom: 1px solid #ccc;
}


.list_side li {
  display: inline-block;/*横に並ぶように 不自然な改行ないように*/
  list-style: none;
font-size:1em;
}

.list_side li:before {/* [を表示*/
  content: ' [';
  padding: 0 0.2em;
  color: rgba(102, 102, 102, 0.5);
}

.list_side li:after {/* [を表示*/
  content: '] ';
  padding: 0 0.2em;
  color: rgba(102, 102, 102, 0.5);
}

.list_side_comic li {
  display: inline-block;/*横に並ぶように 不自然な改行ないように*/
  list-style: none;
font-size:0.8em;
}

.list_side_comic li:before {/* [を表示*/
  content: ' [';
  padding: 0 0.2em;
  color: rgba(102, 102, 102, 0.5);
}

.list_side_comic li:after {/* [を表示*/
  content: '] ';
  padding: 0 0.2em;
  color: rgba(102, 102, 102, 0.5);
}



@media screen and (max-width: 559px) {
.dl_katari dl {
flex-flow: column;
	}}


/* Font Awesome 設定 */

.my-small{
  font-size: 0.8em 
  /*0.8倍の大きさに*/}

.my-gray {color: #c0c6c9;}

.my-red {color: #f4b3c2;}

.my-pixiv{color:#0096fa;}

.my-steam{color:#223749;}

.my-twitter{color:#1da1f2;}


/* リンク集バナー横並び */

ul.side_list {
    margin: 0.5em 0 0 0;
    padding: 0em;
}

.side_list li {
    display: inline;
    line-height: 110%;
    list-style-type: none;
    margin:0;
    background: none;
    padding: 0;
}

.side_list li img{
	width:23.5%;
	height:auto;
}

@media screen and (max-width: 480px){
	

ul.side_list {
    margin: 0 0 0 0;
    padding: 0em;
}
	
.side_list li img{
	width:47%;
	height:auto;
	margin-bottom:0.5em;
}
}


/* スマホで関連記事見るの本文の高さ */

@media screen and (max-width: 480px){
.related-entry-card-snippet{
	padding:0.7em 0 0 0;
}
}

/* 固定ページの日付を非表示 */

.page .date-tags {
display: none;
}

/* pスタイル追加*/

.bs {
  margin:0 0 2em 0;
}

.ss {
  margin:0 0 3px 0;
}

/* 記事内 続きを読むCSS */

.cp_box *, .cp_box *:before, .cp_box *:after {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.cp_box {
	width: auto;
	margin: 2em auto;
}
.cp_box label {
	font-weight: bold;
	position: relative;
	display: block;
	width: 80%;
	margin: auto;
	padding: 0.3em 1em;
	cursor: pointer;
	transition: all 0.3s;
	text-align: center;
	color: #da3c41;
	border: 2px solid #da3c41;
	border-radius: 3px;
}
.cp_box label:hover {
	transition: all 0.3s;
	color: #ffffff;
	background: #da3c41;
}
.cp_box label::after {
	font-family: 'Font Awesome 5 Free';
	content: ' \f067';
	color: #da3c41;
}
.cp_box label:hover::after {
	color: #ffffff;
}
.cp_box input:checked ~ label::after {
	font-family: 'Font Awesome 5 Free';
	content: ' \f068';
	color: #da3c41;
}
.cp_box input:checked ~ label:hover::after {
	color: ;
}
.cp_box input {
	display: none;
}
.cp_box .cp_container {
	position: relative;
	z-index: 10;
	overflow: hidden;
	height: 0;
	margin-top: -1px;
	transition: height 0.3s ease-in-out,box-shadow 0.6s linear;
}
.cp_box input:checked ~ div {
	transition: height 0.5s ease-in-out,box-shadow 0.1s linear;
}

/* 続きを読むを押すと表示されるテキストの高さ */
.cp_box input:checked ~ div.cp_container {
	height: 100%;
}

.cp_container p{
}

/* 旧ブログ記事 マーカー線・赤 */
.marker1{
background:linear-gradient(transparent 75%, #ffadad 75%);
font-weight:bold; 
}

/* 旧ブログ記事 マーカー線・青 */
.marker2{
 background: linear-gradient(transparent 75%, #c1e0ff 75%);
font-weight: bold; 
}

/* まろやかWEB拍手 */

.maroyaka-webclap .btn-xs,
.maroyaka-webclap .btn-group-xs > .btn{
padding: 3px 16px!important;
color: #ffffff!important;
font-size: 14px!important;
border-radius: 0!important;
border-color: #555555!important;
box-shadow: none!important;
text-shadow: none!important;
background-image: none!important;
background-color: #999999!important;
}

/* トップに表示したりウィジェットに表示したり */

.webclap_none{
	display:none;
}

@media screen and (max-width: 769px){
.webclap_none{
	display:block;
}
}

.webclap_none_mb{
	padding: 20px 30px 0 0;
	margin:auto auto;
}

@media screen and (max-width: 769px){
.webclap_none_mb{
	display:none;
}
}

.mwc-message-box {
  display: table;
  position: absolute;
  margin: 30px;
  width: 350px!important;
  background-color: #F8F8F8; 
  border: 1px solid #DDDDDD;
  border-radius: 6px;
  -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
  box-shadow: 0 5px 10px rgba(0,0,0,.2);
  z-index: 99999;
}

@media screen and (max-width: 769px){
.mwc-message-box {
  display: table;
  position: absolute;
  margin: 30px 10px 0 0; /*ウィジェットに隠れちゃうので調整*/
  width: 280px;
  background-color: #F8F8F8; 
  border: 1px solid #DDDDDD;
  border-radius: 6px;
  -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
  box-shadow: 0 5px 10px rgba(0,0,0,.2);
  z-index: 99999;
}
}

/*タイムライン調整*/

.timeline-item-label {
    width: 110px;
    float: left;
    padding-top: 14px;
    text-align: right;
    padding-right: 1em;
    font-size: 16px;
	color:inherit;
}

.timeline-item::before {
    content: '';
    width: 12px;
    height: 12px;
    position: absolute;
    left: 105px;
    top: 22px;
    border-radius: 100%;
}

@media screen and (max-width: 415px){
.timeline-item::before {
    content: '';
    width: 12px;
    height: 12px;
    position: absolute;
    left: -8px;
    top: 22px;
    border-radius: 100%;
	}

	.timeline-item-label{
    width: 80px;
    float: left;
    padding-top: 14px;
    text-align: left;
    padding-right: 1em;
    font-size: 16px;
    color: inherit;
}

	.timeline-item-title {
    font-weight: bold;
    padding: 8px 0 0 0;
}
	
}

/* 画像ファイルへのリンク時にアイコンを表示 */

.link_img:after{
font-family: "Font Awesome 5 Free";
  content: ' \f1c5 ';
	  font-weight: 900;
 padding:0em 0.1em 0 0em;
	text-decoration: none;
}

/* ブログカード横 */

.blogcard-wrap {
  max-width: none;
}

.blogcard {
  padding: 1.6% 2.2% 2%;
  border: 1px solid #ccc;
}

.blogcard-thumbnail {
  float: left;
  width: 160px;
  margin-top: 3px;
}

.blogcard-content {
  padding: 0;
  margin-left: 170px;
  max-height: 140px;
  min-height: 100px;
}

.blogcard-title {
  font-size: 18px;
  margin-bottom: 0.4em;
}

.blogcard-footer {
  padding: 0.6% 0 0;
  font-size: 16px;
  opacity: 1;
}

@media screen and (max-width: 834px) {

  .blogcard-thumbnail {
    width: 120px;
  }  

  .blogcard-title {
    font-size: 0.9em;
    margin-bottom: .5em;
  }

  .blogcard-snippet {
    font-size: 12px;
  }

  .blogcard-content {
    margin-left: 130px;
    max-height: 120px;
    min-height: 70px;
    font-size: 0.9em;
    line-height: 1.5;
  }

  .blogcard-footer {
    font-size: 14px;
  }

}

@media screen and (max-width: 480px) {

  .blogcard {
    padding: 2.5%;
  }

  .blogcard-snippet {
    max-height: 6em;
  }

}

/* 読書感想文バックナンバー */

.box_bookRecord {
    position: relative;
    padding: 10px 20px;
    box-sizing: border-box;
    color: #4e4e4e;
    background: #f2f9ff;
}

.box_bookRecord:before{
    display: inline-block;
	position: absolute;
    top: 7px;
    left: 20px;
    content: "";
	margin:0 10px 0 0 ;
font-family: "Font Awesome 5 Free";
    color: #d2e6ff;
    font-size: 35px;
    line-height: 1;
    font-weight: 900;
}

.box_bookRecord:after{
    display: inline-block;
    position: absolute;
    bottom: 5px;
    right: 15px;
    text-align: center;
    content: "\f518";
font-family: "Font Awesome 5 Free";
    color: #d2e6ff;
    font-size: 35px;
    line-height: 1;
    font-weight: 900;
}

.box_bookRecord p {
    padding: 0;
    margin: 10px;
    line-height: 1.7;
}

.box_bookRecord cite {
    position: relative;
    display: block;
    text-align: right;
    color: #888888;
    font-size: 0.9em;
}

/**/