/*
Template:easel
Theme Name:canvas on EASEL
Version: 1.1.0
*/

/* ここから下に書いたCSSが、親テーマCSSに上書きされます。 */


/*文字基本 */
body  {
  font-size: 18px;
  line-height: 1.8;
  color: #333333;
}

/*リンク*/
a {
color: #4D4DF6;
}
a  {
  text-decoration: underline;
}
a:hover {
color: #5eaeff;
}





/*フッター*/
footer.footer{
    background-color:#5eaeff;  /*フッター色*/  
}
.footer #footer_widget {
    padding-top: 20px;
    background: #ffffff;  /*フッター色2*/}
footer.footer #footer_widget {
    background-color: transparent;
    border-bottom: 1px solid #5eaeff;
}
footer.footer #inner-footer ul li a {
    color: #ffffff;
}
footer.footer #inner-footer .copyright {
    margin: 1em 0 1em auto;
    color: #ffffff;  /*フッター文字*/
}
footer.footer #inner-footer .copyright {
margin: 1em auto;
text-align: center;  /*フッター位置*/
  }


/*ヘッダーPC*/
@media only screen and (min-width:768px){.header{
  width: 100%;
		height: 220px;  
	background-image: url('http://wordsho.com/wp-content/uploads/2026/01/1c2e1625b3fd7c74a25827df70b85e1f.png');
  background-repeat: no-repeat;
  background-position: center center;
 background-size: cover; /* 横幅優先でフィット */
}
.header a.logo img{
display: none;}

.header nav {
    margin-top: 100px;
}
.header .nav li a {
    color: #ffffff;
    position: relative;
}
.header nav {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background-color: #4C4CF6;
}	
}

/*ヘッダスマホ*/
@media only screen and (max-width: 767px){
    .header  {
  background-image: url('http://wordsho.com/wp-content/uploads/2025/12/1c2e1625b3fd7c74a25827df70b85e1f-1.png'); /* 画像のパスを指定 */
  background-repeat: no-repeat; /* 繰り返しを無効化 */
  background-size: cover; /* 画像を全体にフィット */
  background-position: center; /* 画像を中央に配置 */
}
.header .nav li a {
    color: #000474;
    position: relative;
}	
.header a.logo img{
display: none;
}
.header:hover {
    color: #ff7800;
}
.header {
    color: #4a2222;
} 

/* ホバー時大きく */
header label:hover {
  transform: scale(1.06);
  color: #FFD43B;
}
/* 押した時縮む */
header label a:active {
  transform: scale(0.94);
}
/* 押した時縮む */
 header label:active {
  transform: scale(0.94);
}
}








/*見出し*/
h1 {
　　color: #5eaeff;
    padding:1px 1px;  /*内側の余白*/
    border-bottom: solid 3px  #5eaeff;  /*下線の太さ 種類 色*/
}

h1:before {
    content: url("http://wordsho.com/wp-content/uploads/2025/10/h1_icon.png");  /*画像のURL*/
    margin: 0 10px 0 0;  /*画像右の余白*/
    margin-top: 2px;  /*画像上の余白*/
}
header.article-header.entry-header {
    border-bottom: 1px solid #ffffff;  /*元からあった下線を非表示*/
}


h2 {
　　color: #5eaeff;
    padding:1px 1px;  /*内側の余白*/
}

h2:before {
    content: url("http://wordsho.com/wp-content/uploads/2025/10/h2_icon.png");  /*画像のURL*/
    margin: 0 10px 0 0; /*画像右の余白*/
    margin-top: 2px;  /*画像上の余白*/
}

article h2 {
    padding: 9px 10px;
    border-bottom: 3px solid #5eaeff;  /*下線の太さ 種類 色*/
}

h2 {
    padding:1px 1px;  /*内側の余白*/
}

h3 {
    padding:1px 1px;  /*内側の余白*/
    border-bottom: solid 5px  #5eaeff;  /*下線の太さ 種類 色*/
}

h4 {
    padding:1px 1px;  /*内側の余白*/
    border-bottom: solid 5px  #5eaeff;  /*下線の太さ 種類 色*/
}

h4:before {
    content: url("http://wordsho.com/wp-content/uploads/2025/10/h2_icon.png");  /*画像のURL*/
    margin: 0 10px 0 0; /*画像右の余白*/
    margin-top: 2px;  /*画像上の余白*/
}



/*更新履歴*/
.news_list {
    padding: 1px;
    border: 1px solid #ffffff; /*元からあった線を非表示にする*/
    margin: 15px auto;
    list-style: none;
}



/*ブログ*/
body.blog article {
    padding: 0.5em 1em;
    margin: 2em 0;
    font-weight: bold;
    border: solid 3px #267fcf;/*線*/
	border-radius: 10px;/*角の丸み*/
}/*記事囲み枠*/

.hentry:not(:last-of-type) {
    border-bottom: 3px solid #267fcf;
}/*元からある下線を囲み枠のデザインに合わせる*/



/*ボックス（囲み枠）*/
.box4{
  /*更新履歴用*/
    padding: 8px 19px;
    margin: 2em 0;
    color: #2c2c2f;
    background: #ffffff; /*背景色*/
    border-top: solid 5px #5eaeff;
    border-bottom: solid 5px #5eaeff;
} 
.box4 p {
    margin: 0; 
    padding: 0;
}

 /*名前付き*/
.box26 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #5eaeff;
    border-radius: 8px;
}
.box26 .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    color: #4D4DF6;
    font-weight: bold;
}
.box26 p {
    margin: 0; 
    padding: 0;
}



/*投稿ページ*/
span.category a {
    color: #5eaeff;
    display: inline-block;
    font-size: 17px;
    margin: 0 10px;
}/*投稿ページカテゴリー*/

span.category {
    color: #5eaeff;
    margin: 0 0 0 15px;
    display: inline-block;
    font-size: 20px;
}/*投稿ページカテゴリーマーク*/

.byline {
    color: #000000;
    font-size: 20px;
    margin: 1;
}/*投稿ページ日にち*/


/*リンクボタン*/
.blue-btn a, #submit a {
	  background: #5eaeff;
    color: #ffffff !important;
}

.blue-btn a:hover, #submit a:hover, .blue-btn a:focus, #submit a:focus {
    background-color: #4D4DF6;
    border: 1px solid #4D4DF6;
}


/*～イラスト～================================================= */
.shortcode-illust img {
	border-radius: 16px;
  filter: brightness(95%);
}
.shortcode-illust li section {
    border-radius: 16px;
    background: #ffffffe0;
}
.shortcode-illust li section h3 {
    font-size: 20px;
    font-weight: 400;
    color: #373030;
    margin: 0 auto 5px;
}

figure.eye-catch img {
	border-radius: 16px;
	filter: brightness(98%)
}
footer.article-footer .day {
    color: #5eaeff;
    font-size: 23px;
}/*イラストページページ日にち*/


/*黒塗りコード*/
input.netabare01_checkbox {
display: none;
}

label.netabare01_label {
display: inline;
position: relative;
background-color: #171717 !important;
color: #171717 !important;
cursor: pointer;
transition: 0.3s;
}

label.netabare01_label:before {
content: "クリックで内容を表示します";
display: block;
border: 1px solid #c70b0b;
font-size: 14px;
background-color: #ffeced;
color: #c70b0b;
position: absolute;
padding: 4px 10px;
z-index: 2;
right: 0;
left: 0;
bottom: calc(100% + 5px);
margin: auto;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
min-width: 200px;
text-align: center;
border-radius: 4px;
transition: 0.3s;
pointer-events: none;
opacity: 0;
}

label.netabare01_label:hover:before {
opacity: 1;
}

input.netabare01_checkbox:checked + label.netabare01_label {
color: #ffffff !important;
}

input.netabare01_checkbox:checked + label.netabare01_label:hover:before {
opacity: 0;
}