/* <system section="background" selected="undefined"> */

/* </system> */
@import url("https://codomisu.sakura.ne.jp/minimalism/old.css");

/* Responsive:yes */


/*--------------------------------------------------
            スマホの文字のバラつき防止
--------------------------------------------------*/

body {
-webkit-text-size-adjust: 115%;
}

/* 画像 */

.box{
	display:table;
	table-layout: fixed;
}

img {
max-width: 100%;
height: auto;
}

@media screen and (max-width: 480px){.entry-content img {max-width: 80%}}

/*--------------------------------------------------
                    END
--------------------------------------------------*/


/*--------------------------------------------------
            アンダーライン装飾
--------------------------------------------------*/

article u{

    text-decoration: none;

    background: linear-gradient(transparent 50%, #fbcac8 30%);

}

/*--------------------------------------------------
                    END
--------------------------------------------------*/

/*--------------------------------------------------
　　　　　箇条書きの一文の間隔を調整
--------------------------------------------------*/

.entry-content ul {
  font-size: 16px;
  padding-top:2px;
  padding-bottom:2px;
}

.entry-content ol {
  font-size: 16px;
  padding-top:2px;
  padding-bottom:2px;
}

.entry-content li {
  padding-top:1.5px;
  padding-bottom:1.5px;
}

@media screen and (max-width: 480px){.entry-content ul {font-size: 13px;}}

@media screen and (max-width: 480px){.entry-content ol {font-size: 13px;}}

/*--------------------------------------------------
                    END
--------------------------------------------------*/


/*--------------------------------------------------
            文字サイズ
--------------------------------------------------*/
/* 記事中文字サイズ */
.entry-content p {
    font-size: 17px;
    line-height: 1.8; /* 行の高さ */
}
@media screen and (max-width: 480px){.entry-content p {font-size: 16px;}}

/* タイトル文字サイズ */
.entry-title {
    line-height: 1.4; /* 行の高さ */
}
@media screen and (max-width: 480px){.entry-title a {font-size: 18px;}}

/*--------------------------------------------------
                    END
--------------------------------------------------*/


/*--------------------------------------------------
            斜線で下線に蛍光ペン
--------------------------------------------------*/
article em{
font-weight:bold;
font-style: normal;
margin:0 0.1em;
padding:0.1em 0.2em;
background:#fcfc60 !important;
background:linear-gradient(to bottom, transparent 60%, #ffd700 60%) !important;
}
article i{
font-style:oblique !important;
}

/*--------------------------------------------------
                    END
--------------------------------------------------*/

.entry-content h3{
    padding: 10px 15px; 
    border-left: 10px solid #333;
}
    
.entry-content h4{
    padding: 10px 15px; 
    border-left: 5px solid #333;
}



/*--------------------------------------------------
       　　　　　　　　セリフ枠
--------------------------------------------------*/

.box5 {
    padding: 0.5em 1em;
    margin: 2em 0;
    background: white;
    border-top: solid 3px #5d627b;
    border-left: solid 3px #5d627b;
    border-right: solid 3px #5d627b;
    border-bottom: solid 4px #5d627b;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.22);
    border-radius: 9px;
}
.box5 p {
    margin: 0; 
    padding: 0;
}

/*--------------------------------------------------
                    END
--------------------------------------------------*/

/*--------------------------------------------------
       　　　　　　　　続きを読む
--------------------------------------------------*/

.cp_box *, .cp_box *:before, .cp_box *:after {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.cp_box {
	position: relative;
}
.cp_box label {
	position: absolute;
	z-index: 1;
	bottom: 0;
	width: 100%;
	height: 140px; /* グラデーションの高さ */
	cursor: pointer;
	text-align: center;
	/* 以下グラデーションは背景を自身のサイトに合わせて設定してください */
	background: linear-gradient(to bottom, rgba(250, 252, 252, 0) 0%, rgba(250, 252, 252, 0.95) 90%);
}
.cp_box input:checked + label {
	background: inherit; /* 開いた時にグラデーションを消す */
}
.cp_box label:after {
	line-height: 2.5rem;
	position: absolute;
	z-index: 2;
	bottom: 20px;
	left: 50%;
	width: 16rem;
	font-family: FontAwesome;
	content: '\f13a'' 続きをよむ';
	transform: translate(-50%, 0);
	letter-spacing: 0.05em;
	color: #ffffff;
	border-radius: 20px;
	background-color: rgba(27, 37, 56, 1);
}
.cp_box input {
	display: none;
}
.cp_box .cp_container {
	overflow: hidden;
	height: 250px; /* 開く前に見えている部分の高さ */
	transition: all 0.5s;
}
.cp_box input:checked + label {
	/* display: none ; 閉じるボタンを消す場合解放 */
}
.cp_box input:checked + label:after {
	font-family: FontAwesome;
	content: '\f139'' 閉じる';
}
.cp_box input:checked ~ .cp_container {
	height: auto;
	padding-bottom: 80px; /* 閉じるボタンのbottomからの位置 */
	transition: all 0.5s;
}

/*--------------------------------------------------
                    END
--------------------------------------------------*/



/*--------------------------------------------------
       POINTなし箇条書きリスト
--------------------------------------------------*/
.list04 {
  border: solid 2px #4abdac;
  border-radius: 5px;
  padding: 0.5em 1em 0.5em 2.3em;
  position: relative;
}

.list04 li {
  line-height: 1.5;
  padding: 0.5em 0;
  list-style-type: none!important;
}

.list04 li:before {

  font-family: "FontAwesome";
  content: "\f138";/*アイコンの種類*/
  position: absolute;
  left : 1em;/*左端からのアイコンまでの距離*/
  color: #333333;/*アイコン色*/
}
/*--------------------------------------------------
                    END
--------------------------------------------------*/

/*--------------------------------------------------
       タイトル付きボックス（矢印アイコン）
--------------------------------------------------*/
.box01 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #f78733;
}
.box01 .box-title {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    vertical-align: middle;
    font-size: 12px;
    background: #f78733;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}
.box01 p {
    margin: 0;
    padding: 0;
}
.box01 ul li {
  line-height: 1.5;
  padding: 0.5em 0;
  list-style-type: none!important;
}
.box01 ul li:before {/*疑似要素*/
  font-family: "FontAwesome";
  content: "\f138";/*アイコンの種類*/
  position: absolute;
  font-size: 11px;
  left : 1.0em;/*左端からのアイコンまでの距離*/
  color: #f78733;/*アイコン色*/
}
/*--------------------------------------------------
                    END
--------------------------------------------------*/

/*--------------------------------------------------
       POINT付き箇条書きリスト
--------------------------------------------------*/
.list03 {
  border: solid 2px #4abdac;
  padding: 0.5em;
  position: relative;
  margin-top: 2em;
}
.list03 li {
  line-height: 1.5;
  padding: 0.5em 0 0.5em 1.4em;
  border-bottom: dashed 1px silver;
  list-style-type: none!important;
}
.list03 li:last-of-type {
  border-bottom: none;
}
.list03 li:before {
  /*リスト内のアイコン*/
  font-family: "FontAwesome";
  content: "\f138";/*アイコン種類*/
  position: absolute;
  left : 0.5em; /*左端からのアイコンまで*/
  color: #4abdac; /*アイコン色*/
}
.list03 li:after {
  /*タイトルタブ*/
  background: #4abdac;
  color: #fff;
  font-weight: bold;
  position: absolute;
  left: -2px;
  bottom: 100%;
  padding: 1px 7px;
  content: "POINT";/*タブの文字*/
  letter-spacing: 0.05em;/*字間*/
}
/*--------------------------------------------------
                    END
--------------------------------------------------*/

/*--------------------------------------------------
      タイトル付きボックス（チェックアイコン)
--------------------------------------------------*/
.box02 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #4abdac;
    border-radius: 8px;
}
.box02 .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 12px;
    background: #FFF;
    color: #333333;
    font-weight: bold;
}
.box02 p {
    margin: 0;
    padding: 0;
}
.box02 ul li {
  line-height: 1.5;
  padding: 0.5em 0;
  list-style-type: none!important;
}
.box02 ul li:before {/*疑似要素*/
  font-family: "FontAwesome";
  content: "\f00c";/*アイコンの種類*/
  position: absolute;
  font-size: 12px;
  left : 1.0em;/*左端からのアイコンまでの距離*/
  color: #333333;/*アイコン色*/
}
/*--------------------------------------------------
                    END
--------------------------------------------------*/


/*--------------------------------------------------
      　　　　　　　　引用デザイン
--------------------------------------------------*/
/*引用デザイン--ここから↓↓--*/
blockquote {
    position: relative;
    padding: 5px 10px 5px 32px;
    box-sizing: border-box;
    font-style: italic;
    background: #f3f3f3;
    box-shadow: 0 3px 4px rgba(0, 0, 0, 0.15);
}

blockquote:before{
    display: inline-block;
    position: absolute;
    top: 10px;
    left: -15px;
    width: 40px;
    height: 30px;
    text-align: center;
    content: "\f10d";
    font-family: FontAwesome;
    color: #FFF;
    font-size: 12px;
    line-height: 30px;
    background: #94adda;
    box-shadow: 0 2px 2px rgba(26, 26, 26, 0.14);
    font-weight: 900;
}

blockquote:after{
    position: absolute;
    content: '';
    top: 40px;
    left: -15px;
    border: none;
    border-bottom: solid 8px transparent;
    border-right: solid 15px #94adda;
}

blockquote p {
    position: relative;
    padding: 0;
    margin: 10px 0;
    z-index: 3;
    line-height: 1.7;
}

blockquote cite {
    display: block;
    text-align: right;
    color: #888888;
    font-size: 0.9em;
}
/*引用デザイン--ここまで↑↑--*/

/*--------------------------------------------------
                    END
--------------------------------------------------*/


/*---------------------------------------------
　　目次
---------------------------------------------*/
/* 目次の折りたたみ */
//.table-of-contents{
//    display: none;
//}

/*目次のデザイン変更*/
.table-of-contents {
    margin-left: 0;
    padding: 15px 10px 15px 35px; /* 枠内の余白(上右下左) */
    font-size: 100%;  /* 文字サイズ */
    border:dotted 1px #777;  /* 線の種類と色 */
    background:#f7f7f7;  /* 背景 */
}
.table-of-contents:before {
    content: "<目次>";
    font-size: 110%;
    font-weight:bold;   /* 文字の太さ　通常はnormal */    
    color:#000;  /* 文字の色 */
    border-bottom: 1px dashed lightgrey;
}
.table-of-contents li,
.table-of-contents ul{
list-style-type:decimal;  /* マークの種類 */
}

.entry-content .table-of-contents {
    border: 1px solid #e6e6e6;
    margin: 0 0 1.6em;
    padding: 1.6em 1.6em 1.6em 3.2em;
    background-color: #f7f7f7;
}

.show-area{
    display: inline-block;
    padding: 10px;
    border-radius: 5px;
    cursor: pointer;
    margin-bottom: 0;
    color: blue;
}


.hatena-module-title,
.hatena-module-title::before,
.hatena-module-title::after {
  background: none;
  border: none;
}


/*----Titledefault----*/

.hatena-module-title,

.hatena-module-title::before,

.hatena-module-title::after {

  background: none;

  border: none;

}

.hatena-module-title a {
color:#FFFFFF;
} 

.hatena-module-title{

  position: relative;
  
  color:#FFFFFF;

  background: #999999;/* 背景色 */

  line-height: 1.4;

  padding: 0.5em 0.5em 0.5em 1.8em;/* タイトル内の余白 */

  margin: 0px -10px 20px -10px;/* タイトルの位置を調整。 */

}

/*----プロフィール----*/

.hatena-module-profile .hatena-module-title:before {

  font-family: "Font Awesome 5 Free";

  //content: "2bb";
  /* アイコンフォント */

  position: absolute;

  left : 0.5em;

}

/*----検索----*/

.hatena-module-search-box .hatena-module-title:before {

  font-family: "Font Awesome 5 Free";

  //content: "002";

  position: absolute;

  left : 0.5em; 

}

/* ranking */
.entries-access-ranking{
  counter-reset: rank 0;
}

.entries-access-ranking-item:before{
  counter-increment: rank 1;
  content: counter(rank) " ";
  background: royalblue;
  padding: 1px 10px;
  color: white;
}

/*----月別アーカイブ----*/

.hatena-module-archive .hatena-module-title:before {

  font-family: "Font Awesome 5 Free";

  //content: "187";

  position: absolute;

  left : 0.5em; 

}

/*----最新記事----*/

.hatena-module-recent-entries .hatena-module-title:before {

  font-family: "Font Awesome 5 Free";

  //content: "303";

  position: absolute;

  left : 0.5em; 

}

/*----注目記事----*/

.hatena-module-entries-access-ranking .hatena-module-title:before {

  font-family: "Font Awesome 5 Free";

  //content: "201";

  position: absolute;

  left : 0.5em; 

}

/*----カテゴリー----*/

.hatena-module-category .hatena-module-title:before {

  font-family: "Font Awesome 5 Free";

  //content: "02d";

  position: absolute;

  left : 0.5em; 

}

/*----HTML----*/

.hatena-module-html .hatena-module-title:before {

  font-family: "Font Awesome 5 Free";

  //content: "005";

  position: absolute;

  left : 0.5em; 

}