/*
Theme Name: UnderShirt
Theme URI: http://blog.hatena.ne.jp/-/store/theme/8599973812333959601
Description: 記事一覧（archive）ページでアイキャッチ（サムネイル）画像を大きく表示する、２カラム＆最大幅固定のテーマです。※スマホから見ると１カラムになります※トップページを記事一覧ページの見た目にするには、はてなブログProへの加入が必要です- [http://thumbnail.hatenablog.com/:title=DEMOサイト]* 特徴- レスポンシブ対応- レクタングル広告（横336px）が設置可能なサイドカラム- カスタマイズしやすい、装飾の少ないデザイン* 紹介記事- [http://blog.rokuzeudon.com/entry/theme-undershirt#attention:title=アイキャッチ画像とヘッダー画像の仕様について]- [http://blog.rokuzeudon.com/entry/theme-undershirt-sp:title=スマホ（レスポンシブデザインモード）で記事を２列にする方法]* 謝辞- はてなブログ様のカスタマイズ用テンプレート「[https://github.com/hatena/Hatena-Blog-Theme-Boilerplate:title=boilerplate]」を改変しています- DEMOサイトの写真は[https://unsplash.com/:title=Unsplush]様より利用させて頂いています* お問い合わせテーマを使ってみてのご感想やご意見は、[https://twitter.com/rokuzeudon:title=Twitter]にてお気軽にご連絡ください。
Author: rokuzeudon
Author URI: http://blog.hatena.ne.jp/rokuzeudon/
*/
@charset "UTF-8";

/*
 Theme: UnderShirt
 Author: rokuzeudon
 Responsive: yes
 Description:
   記事一覧ページでサムネイル画像を大きく表示するはてなブログテーマです。
*/
@import url(https://fonts.googleapis.com/css?family=Poppins:400,600);

html{
line-height:1.15;

-ms-text-size-adjust:100%;

-webkit-text-size-adjust:100%
}


article,aside,footer,header,nav,section{
display:block
}
.under {
  background: linear-gradient(transparent 60%, #ecfab3 60%);
font-weight: bold;
  }


figcaption,figure,main{
display:block
}

figure{
margin:1em 40px
}

hr{
-webkit-box-sizing:content-box;
box-sizing:content-box;
height:0;
overflow:visible
}

pre{
font-family:monospace,monospace;
font-size:1em
}

a{
background-color:transparent;
-webkit-text-decoration-skip:objects
}

abbr[title]{
border-bottom:none;
text-decoration:underline;
-webkit-text-decoration:underline dotted;
text-decoration:underline dotted
}

b,strong{
font-weight:inherit
}

b,strong{
font-weight:bolder
}

code,kbd,samp{
font-family:monospace,monospace;
font-size:1em
}
dfn{
font-style:italic
}
mark{
background-color:#ff0;
color:#000
}
small{
font-size:80%
}
sub,sup{
font-size:75%;
line-height:0;
position:relative;
vertical-align:baseline
}
sub{
bottom:-.25em
}
sup{
top:-.5em
}
audio,video{
display:inline-block
}
audio:not([controls]){
display:none;
height:0
}
img{
border-style:none;
margin-top: 5px;
margin-bottom: 5px;
}
svg:not(:root){
overflow:hidden
}
button,input,optgroup,select,textarea{
font-family:sans-serif;
font-size:100%;
line-height:1.15;
margin:0
}
button,input{
overflow:visible
}
button,select{
text-transform:none
}
button,html [type="button"],[type="reset"],[type="submit"]{
-webkit-appearance:button
}
button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{
border-style:none;
padding:0
}
button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{
outline:1px dotted ButtonText
}
fieldset{
padding:.35em .75em .625em
}
legend{
-webkit-box-sizing:border-box;
box-sizing:border-box;
color:inherit;
display:table;
max-width:100%;
padding:0;
white-space:normal
}
progress{
display:inline-block;
vertical-align:baseline
}
textarea{
overflow:auto
}
[type="checkbox"],[type="radio"]{
-webkit-box-sizing:border-box;
box-sizing:border-box;
padding:0
}
[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{
height:auto
}
[type="search"]{
-webkit-appearance:textfield;
outline-offset:-2px
}
[type="search"]::-webkit-search-cancel-button,[type="search"]::-webkit-search-decoration{
-webkit-appearance:none
}
::-webkit-file-upload-button{
-webkit-appearance:button;
font:inherit
}
details,menu{
display:block
}
summary{
display:list-item
}
canvas{
display:inline-block
}
template{
display:none
}
[hidden]{
display:none
}
#content-inner{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-orient:vertical;
-webkit-box-direction:normal;
-ms-flex-flow:column;
flex-flow:column;
-webkit-box-pack:justify;
-ms-flex-pack:justify;
justify-content:space-between
}
@media (min-width:992px){
#content-inner{
-webkit-box-orient:horizontal;
-webkit-box-direction:normal;
-ms-flex-direction:row;
flex-direction:row
}

}
.entry-header{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-orient:vertical;
-webkit-box-direction:normal;
-ms-flex-flow:column;
flex-flow:column
}
.entry-header .entry-title{
-webkit-box-ordinal-group:1;
-ms-flex-order:0;
order:0
}
.entry-header .date{
-webkit-box-ordinal-group:2;
-ms-flex-order:1;
order:1
}
.entry-header .categories{
-webkit-box-ordinal-group:3;
-ms-flex-order:2;
order:2
}
.entry-header .customized-header{
-webkit-box-ordinal-group:4;
-ms-flex-order:3;
order:3
}
.entry-header .social-buttons{
-webkit-box-ordinal-group:5;
-ms-flex-order:4;
order:4
}
.archive-entries{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-ms-flex-wrap:wrap;
flex-wrap:wrap
}
.page-archive .archive-entry{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-orient:vertical;
-webkit-box-direction:normal;
-ms-flex-flow:column;
flex-flow:column
}
.page-archive .archive-entry .entry-thumb-link{
-webkit-box-ordinal-group:1;
-ms-flex-order:0;
order:0
}
.page-archive .archive-entry .archive-entry-header{
-webkit-box-ordinal-group:2;
-ms-flex-order:1;
order:1
}
.page-archive .archive-entry .archive-entry-body{
-webkit-box-ordinal-group:3;
-ms-flex-order:2;
order:2
}
.page-archive .archive-entry .categories{
-webkit-box-ordinal-group:4;
-ms-flex-order:3;
order:3
}
.archive-entry-header{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-orient:vertical;
-webkit-box-direction:normal;
-ms-flex-flow:column;
flex-flow:column
}
.archive-entry-header .entry-title{
-webkit-box-ordinal-group:1;
-ms-flex-order:0;
order:0
}
.archive-entry-header .date{
-webkit-box-ordinal-group:2;
-ms-flex-order:1;
order:1
}
.pager{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-pack:justify;
-ms-flex-pack:justify;
justify-content:space-between
}

html,body{
font-family:'Merriweather','Noto Sans','Helvetica Neue', 'Helvetica', 'Arial', YuGothic,'Yu Gothic','Hiragino Kaku Gothic Pro', 'Meiryo', 'MS PGothic', sans-serif
;
color:#000000;
background-color:#f6f4f1;
line-height:1.8;
}
a{
color:#454545;
text-decoration:none;
-webkit-transition:.1s ease-out;
transition:.1s ease-out
}

a:hover{
color:#1487bd;
text-decoration:none
}

h1{
font-size:2em;
margin:.67em 0
}

h1,h2,h3,h4,h5,h6{
color:#333;
line-height:1.4;
font-family: 'Times New Roman', Times, FreeSerif, serif;
margin-top: 3rem;
}

h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{
color:#333;
text-decoration:none
}

h1 a:hover,h2 a:hover,h3 a:hover,h4 a:hover,h5 a:hover,h6 a:hover{
color:#0f668f
}

.entry-content h2 {
  font-size: 1.3rem;
  border-bottom: 2px solid #111;
}

.entry-content h3 {
  font-size: 1.3rem;
  border-bottom: 4px double #999;
}
.entry-content h4 {
  font-size: 1.2rem;
  padding-left: 10px;
  border-left: 4px solid #111;
  margin-top: 40px;
}
.entry-content h5 {
  position: relative;
  font-size: 1.1rem;
  padding-left: 18px;
  margin-top: 30px;
  margin-bottom: 10px;
}
.entry-content h5::before {
  position: absolute;
  content: "";
  top: 50%;
  left: 0;
  width: 8px;
  height: 8px;
  background-color: #111;
  margin-top: -4px;
}
.entry-content h6 {
  font-size: 1rem;
  margin-top: 36px;
}



#globalheader-container{
background-color:#454545;
color:#F6F4F1
}

#content-inner{
max-width:1200px;
margin:auto
}


#blog-title{
margin:auto;
max-width:1200px;
padding:3em 20px 2em;
text-align:center
}

@media (min-width:992px){
#blog-title{
margin:0 auto;
padding:3em 40px;
-webkit-box-sizing:border-box;
box-sizing:border-box;
text-align:center
}
}

#title{
margin:0;
font-size:1.2rem;
font-family: 'Times New Roman', Times, FreeSerif, serif;

}

@media (min-width:992px)
{
#title{
font-size:1.4rem
}

}
#title a{
color:#454545
}
#blog-description{
font-weight:400;
font-size:.8rem;
margin:1em 0 0;
  font-family: 'Helvetica', 'Arial',YuGothic,'Yu Gothic','Hiragino Kaku Gothic Pro', 'Meiryo', 'MS PGothic', sans-serif;;

}
.header-image-enable #blog-title{
margin:0 auto 2em
}

@media (min-width:768px){
.header-image-enable #blog-title{
padding:0 40px
}

}


.header-image-enable #blog-title-inner{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-orient:horizontal;
-webkit-box-direction:normal;
-ms-flex-direction:row;
flex-direction:row;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
margin:30px 0 0
}
@media (min-width:992px){
.header-image-enable #blog-title-inner{
background-size:cover
}

}
.header-image-enable #blog-title-content{
margin:auto;
text-align:center
}
#top-box{
max-width:1200px;
margin:0 auto 1em;
-webkit-box-sizing:border-box;
box-sizing:border-box
}
#top-editarea{
margin-bottom:2em
}
.breadcrumb{
padding:0 20px;
font-size:.78rem
}
@media (min-width:768px){
.breadcrumb{
padding:0 40px
}

}
@media (min-width:992px){
#wrapper{
width:calc(100% - 337px)
}

}
#main{
width:100%
}
#main-inner{
max-width:1140px;
margin:auto;
padding:0 20px;
-webkit-box-sizing:border-box;
box-sizing:border-box
}
@media (min-width:992px){
#main-inner{
padding:0 40px
}

}
.entry{
position:relative;
margin-bottom:20px;
padding:20px;
background:#fff
}
@media (min-width:768px){
.entry{
padding:30px 40px
}

}
.entry-header{
position:relative;
margin:10px 0 30px
}
.entry-header .social-buttons{
margin:1em 0 0;
padding:1em 0;
border-top:1px solid #ddd
}
.date{
font-size:.9rem
}
.date a{
color:#999;
text-decoration:none
}
.date a:hover{
color:#454545
}


.entry-title{
margin:0 0 .3em;
font-size:1.4rem;
font-family: 'Times New Roman', Times, FreeSerif, serif;

}

@media (min-width:992px){
.entry-title{
font-size:1.4rem
}

}

.categories a{
font-size:.86rem;
display:inline-block;
margin:8px 4px 0 0;
padding:4px 8px 2px;
background:#F6F4F1;
text-decoration:none
}

.categories a:hover{
color:#1487bd
}

.categories a::before {
  content: "#";
}

.entry-footer .social-buttons{
margin-bottom:1em
}
.entry-footer-section{
color:#999;
font-size:.9rem
}
.entry-footer-section a{
color:#999
}
.comment-box{
margin:2em 0 1em;
padding:2em 0 1em;
border-top:4px solid #ddd
}
.comment{
list-style:none;
margin:0 0 15px 0;
padding:0;
line-height:1.7;
font-size:.85rem
}
@media (min-width:768px){
.comment{
font-size:.9rem
}

}
.entry-comment{
margin:0 0 1em;
padding:10px 10px 10px 70px;
background:#F6F4F1;
border-radius:6px;
position:relative
}
.read-more-comments{
padding:10px 0;
text-decoration:underline
}
.hatena-id-icon{
position:absolute;
top:10px;
left:10px;
width:50px!important;
height:50px!important;
border-radius:3px
}
.comment-user-name{
margin:0 0 .4em 0;
font-weight:700
}
.comment-content{
margin:0 0 .4em 0;
word-wrap:break-word;
color:#454545;
font-size:.85rem
}
.comment-content p{
margin:0 0 .6em 0
}
.comment-metadata{
color:#999;
margin:0;
font-size:.8rem
}
.comment-metadata a{
color:#999
}
.leave-comment-title{
padding:.6em 1em;
font-size:.85rem;
background:#F6F4F1;
top:0;
-webkit-box-shadow:1px 3px 10px #ddd;
box-shadow:1px 3px 10px #ddd
}
.leave-comment-title:hover{
top:3px;
-webkit-box-shadow:0 1px 3px #ddd;
box-shadow:0 1px 3px #ddd
}
@media (min-width:992px){
#box2{
width:377px
}


/* sidebar */

}
#box2-inner{
padding:0 20px;
-webkit-box-sizing:border-box;
box-sizing:border-box
}
@media (min-width:768px){
#box2-inner{
padding:0 40px
}

}
@media (min-width:992px){
#box2-inner{
padding-left:0
}

}
.hatena-module{
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
    margin-bottom:3em;
    font-size:.85rem
}
@media (min-width:768px){
.hatena-module{
    font-size:.9rem
}

}
.hatena-module-title {
  font-weight: bold;
  margin-bottom: 15px;
  padding: 8px 0;
  font-size: 1rem;
  text-align: center;
  color: #111;
  border-bottom: 4px double #999999;
  font-family: 'Helvetica', 'Arial',YuGothic,'Yu Gothic','Hiragino Kaku Gothic Pro', 'Meiryo', 'MS PGothic', sans-serif;;

}
.hatena-module-title a {
  color: #111;
  text-decoration: none;
}
.hatena-module-title a:hover {
  text-decoration: underline;
}

.hatena-urllist{
list-style:none;
margin:0;
padding:0;
line-height:1.4
}
.hatena-urllist li{
padding:0 0 1em
}
.hatena-urllist li:last-child{
padding-bottom:0
}
.urllist-title-link{
font-size:.9rem
}
.urllist-category-link{
color:#999;
font-size:.8rem;
padding:.1em .3em .1em 0
}
.urllist-date-link a{
display:block;
margin:0 0 .4em;
color:#999
}
.urllist-entry-body{
margin-top:.3em;
color:#999
}
.urllist-with-thumbnails li .urllist-image{
position:relative;
margin:0 1em 1em 0;
-webkit-transition:.1s ease-out;
transition:.1s ease-out;
top:0;
-webkit-box-shadow:1px 3px 10px #ddd;
box-shadow:1px 3px 10px #ddd
}
.urllist-with-thumbnails li .urllist-image:hover{
top:3px;
-webkit-box-shadow:0 1px 3px #ddd;
box-shadow:0 1px 3px #ddd
}
.urllist-categories{
margin:.4em 0 0
}

/* Profile module */

.profile-icon{
float:left;
margin:0 10px 10px 0
}
.id{
display:block;
font-weight:700;
margin-bottom:.5em
}
.profile-description p{
margin-top:0
}
.search-form,.search-result-form{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
border:2px solid #ddd;
border-radius:3px;
width:100%;
padding:4px 0 2px 6px;
-webkit-box-sizing:border-box;
box-sizing:border-box
}
.search-module-input,.search-result-input{
-webkit-box-flex:1;
-ms-flex:1 0;
flex:1 0%;
padding:5px;
color:#454545;
background:none;
border:none;
outline:none;
height:20px
}
.search-module-button,.search-result-button{
width:24px;
height:24px;
margin-right:5px;
background:transparent url(https://cdn.blog.st-hatena.com/images/theme/search@2x.png?version=686d07ced341492bfbc75d23ddabc1) no-repeat center;
background-size:20px 20px;
border:none;
outline:none;
color:transparent;
overflow:hidden;
opacity:.5;
cursor:pointer
}
.search-module-button:hover,.search-result-button:hover{
opacity:.85
}
.hatena-module-category a{
position:relative;
padding:0 0 0 20px
}
.hatena-module-category a::before{
content:">";
display:inline;
position:absolute;
top:0;
left:2px;
color:#999;
-webkit-transition:.1s ease-out;
transition:.1s ease-out
}
.hatena-module-category a:hover::before{
color:#1487bd;
left:6px
}
.page-about .entry-content dt{
font-weight:700;
border-bottom:1px solid #ddd;
margin-bottom:.5em
}
.page-about .entry-content dd{
margin-left:0;
margin-bottom:2em
}
.archive-header-category{
margin:25px;
text-align:center;
font-family: 'Helvetica', 'Arial',YuGothic,'Yu Gothic','Hiragino Kaku Gothic Pro', 'Meiryo', 'MS PGothic', sans-serif;
}
.archive-entry{
position:relative;
width:100%;
margin-bottom:20px;
padding:20px;
-webkit-box-sizing:border-box;
box-sizing:border-box;
background:#fff
}
@media (min-width:768px){
.archive-entry{
width:calc(50% - 10px);
padding:20px
}
.archive-entry:nth-child(odd){
margin-right:20px
}

}
.page-archive #main-inner{
padding:20px
}
@media (min-width:768px){
.page-archive #main-inner{
padding:0 40px
}

}
.page-archive .entry-thumb-link{
width:calc(100% + 40px);
margin:-20px 0 20px -20px
}
@media (min-width:768px){
.page-archive .entry-thumb-link{
width:calc(100% + 40px);
margin:-20px 0 20px -20px
}

}
.page-archive .entry-thumb{
width:100%;
height:48vw;
background-position:center
}
@media (min-width:768px){
.page-archive .entry-thumb{
height:24vw
}

}
@media (min-width:992px){
.page-archive .entry-thumb{
height:17vw;
max-height:202px
}

}
.page-archive .categories a{
font-size:.7em
}
.archive-date{
margin-bottom:.2em
}
.archive-entry-header .entry-title{
font-size:1.1rem
}
.archive-entry-header .date{
font-size:.8rem
}
.archive-entry-body .entry-description{
margin:0;
font-size:.8rem
}
.archive-entry-body .social-buttons{
display:block;
margin-top:.3em
}
.page-entry #main-inner{
padding:0
}
@media (min-width:768px){
.page-entry #main-inner{
padding:0 40px
}

}
.page-entry .breadcrumb{
margin-bottom:1em
}
#footer{
background:#F6F4F1
}
#footer-inner{
margin-top:2em;
padding:10px 0;
text-align:center;
font-size:.8rem;
color:#999
}
#footer-inner a{
color:#999
}
#footer-inner p{
margin:.5em auto
}
@media (min-width:768px){
#footer-inner{
max-width:1200px;
margin:auto;
padding:20px 40px
}

/* entry-content の中の書式 */
.entry-content {
  line-height: 1.8;
  padding-bottom: 10px;
  border-bottom: 1px solid #dddddd;
  font-family: 'Helvetica', 'Arial',YuGothic,'Yu Gothic','Hiragino Kaku Gothic Pro', 'Meiryo', 'MS PGothic', sans-serif;
  letter-spacing: -0.04em;
  text-align: justify;
  font-size: 16px;
}

}
.entry-content p {
  margin: 0 0 1.5rem 0;
}
@media screen and (max-width: 767px) {
  .entry-content p {
   font-size: 16px;
  line-height: 1.8;
  letter-spacing: -0.04em;
  text-align: justify;
  }
}
.entry-content img,.entry-content video{
max-width:100%;
height:auto;
vertical-align:middle
}

.entry-content a{
color:#1487bd;
text-decoration:underline
}
.entry-content a:hover{
color:#0f668f;
text-decoration:none
}
.entry-content a.keyword{
text-decoration:none;
border-bottom:1px dotted #ddd;
color:#454545
}

.entry-content .entry-see-more{
display:inline-block;
padding:10px 16px;
color:#454545;
text-decoration:none;
background:#F6F4F1;
top:0;
-webkit-box-shadow:1px 3px 10px #ddd;
box-shadow:1px 3px 10px #ddd;
-webkit-transition:.1s ease-out;
transition:.1s ease-out
}
.entry-content .entry-see-more:hover{
top:3px;
-webkit-box-shadow:0 1px 3px #ddd;
box-shadow:0 1px 3px #ddd
}
.entry-content ul,.entry-content ol,.entry-content dd{
margin:0 0 1em 1.5em;
padding:0
}
.entry-content ul li ul,.entry-content ul li ol,.entry-content ol li ul,.entry-content ol li ol,.entry-content dd li ul,.entry-content dd li ol{
margin-bottom:0
}
.entry-content table{
border-collapse:collapse;
border-spacing:0;
border-bottom:1em;
margin-bottom:1em;
width:100%;
overflow:auto;
display:block;
font-size:.8rem
}
@media (min-width:992px){
.entry-content table{
font-size:.9rem
}

}
.entry-content table th,.entry-content table td{
border:1px solid #ddd;
padding:5px 10px
}
.entry-content table th{
background:#fff
}
.entry-content blockquote{
margin:2em 0 1.6em;
padding:20px;
background:#F6F4F1;
font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
font-size: 16px;
line-height: 1.8;
letter-spacing: -0.05em;
text-align: justify;
}
.entry-content blockquote p:first-child{
margin-top:0
}
.entry-content blockquote p:last-child{
margin-bottom:0
}
.entry-content blockquote::before{
content:"“";
display:block;
position:absolute;
top:-52px;
left:-12px;
font-size:8em;
opacity:.1
}
.entry-content pre,.entry-content code{
font-family:'Monaco','Consolas','Courier New',Courier,monospace,sans-serif
}
.entry-content pre{
background:#fff;
border:none;
white-space:pre-wrap;
text-overflow:ellipsis;
font-size:100%;
line-height:1.3;
font-size:.8rem;
padding:10px
}
.entry-content pre>code{
margin:0;
padding:0;
white-space:pre;
border:none;
background-color:transparent;
font-family:'Monaco','Consolas','Courier New',Courier,monospace,sans-serif
}
.entry-content code{
font-size:90%;
margin:0 2px;
padding:0 5px;
background-color:#fff;
border-radius:3px
}
.entry-content hr{
width:50%;
border:0;
border:none;
border-top:1px solid #ddd;
margin:2em auto
}
.entry-content .table-of-contents{
margin:0;
padding:1.2em;
border:1px solid #999;
font-size:0.95em;
letter-spacing: -0.05em;
}
.entry-content .table-of-contents:before{
content:”目次”;
display:block;
margin:0 0 .8rem;
padding:0 0 .4rem;
border-bottom:1px solid #999;
font-size:1rem
}
.entry-content .table-of-contents a{
color:#454545
}
.entry-content .table-of-contents li{
margin:0 0 0 1.4em;
line-height: 2.0;
}
.entry-content .table-of-contents li ul{
margin:0 0 1em .5em
}
.entry-content .table-of-contents li ul li{
margin:4px
}

.entry-content .box5 {
    padding: 0.5em 1em;
    margin: 2em 0;
    border: double 3px #a9a9a9;
}
.entry-content .box5 p:first-child{
margin-top:0.5em
}
.entry-content .box5 p:last-child{
margin-bottom:0.5em
}

.entry-content .box26 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #abccce;
    border-radius: 8px;
    font-size: 0.95em;
}
.entry-content .box26 .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    color: #abccce;
    font-weight: bold;
}
.entry-content .box26 p:first-child{
margin-top:2em
}
.entry-content .box26 p:last-child{
margin-bottom:0.5em
}


.entry-content .box23 {
    position: relative;
    margin: 2em 0 2em 40px;
    padding: 8px 25px;
    background: #e7f5f7;
    border-radius: 30px;
    font-size: 0.95em;
}
.entry-content .box23:before{font-family: FontAwesome;
    content: "\f111";
    position: absolute;
    font-size: 15px;
    left: -40px;
    bottom: 0;
    color: #e7f5f7;
}
.entry-content .box23:after{
    font-family: FontAwesome;
    content: "\f111";
    position: absolute;
    font-size: 23px;
    left: -23px;
    bottom: 0;
    color: #e7f5f7;
}

.entry-content .box23 p:first-child{
margin-top:0.5em
}
.entry-content .box23 p:last-child{
margin-bottom:0.5em
}

.pager{
margin:2em 0
}
.pager .pager-prev,.pager .pager-next{
display:block;
width:50%
}
.pager .pager-next{
text-align:right
}
.pager .pager-prev a,.pager .pager-next a{
display:inline-block;
width:96%;
padding:20px;
-webkit-box-sizing:border-box;
box-sizing:border-box
}
div.footnote{
padding:1em 0;
border-top:#ddd 1px solid
}
#footer .guest-footer{
margin:20px;
padding:25px 30px 10px;
max-width:700px;
background:#fff;
border-radius:6px
}
@media (min-width:768px){
#footer .guest-footer{
margin:30px auto
}

}
.page-index .pager,.page-archive .pager{
margin:2em 0
}
.entry-header-menu a{
position:absolute;
top:0;
right:0;
padding:6px 10px;
background:#F6F4F1;
top:0;
-webkit-box-shadow:1px 3px 10px #ddd;
box-shadow:1px 3px 10px #ddd;
-webkit-transition:.1s ease-out;
transition:.1s ease-out
}
.entry-header-menu a:hover{
top:3px;
-webkit-box-shadow:0 1px 3px #ddd;
box-shadow:0 1px 3px #ddd
}
.entry-header-html a,.entry-footer-html a{
color:#1487bd;
text-decoration:underline
}

.entry-header-html a:hover,.entry-footer-html a:hover{
text-decoration:none;
color:#0f668f
}

.page-index .entry-description{
 display:none;
}


/* グローバルナビ */
.sh-global-nav-wrap {

 position: relative;

 z-index: 50;


}

.sh-global-nav {

 width: 100%;


}

.sh-global-nav-list {

 font-size: 0;

 letter-spacing: 0;

 list-style: none;

 margin: 0;

 padding: 10px 0;

 text-align: center;


}

.sh-global-nav-list .sh-global-nav-item {

 position: relative;

 font-size: 0.9rem;

 display: inline-block;

 border-right: 1px solid #ccc;

 padding: 0 16px;

 height: 30px;

 line-height: 30px;

 z-index: 3;


}

.sh-global-nav-list .sh-global-nav-item:last-child {

 border-right: none;


}

.sh-global-nav-list .sh-global-nav-item a {

 position: relative;

 text-decoration: none;

 color: #111;


}

.sh-global-nav-list .sh-global-nav-item a:after {
 content: "";
 position: absolute;
 left: 0;
 bottom: -10px;
 background-color: #111;
 height: 1px;
 width: 0px;
 -webkit-transition: all .3s;
 transition: all .3s;
}

.sh-global-nav-list .sh-global-nav-item a:hover:after {
 width: 100%;
 -webkit-transition: all .3s;
 transition: all .3s;
}

.sh-global-nav-list .has-child {
 padding-right: 28px;
}

.sh-global-nav-list .has-child::after {
 position: absolute;
 right: 8px;
 top: 14px;
 content: '';
 border: 4px solid transparent;
 border-top-color: #999;
}

.sh-global-nav-list .sh-global-nav-item ul {

 font-size: 0.85rem;

 margin: 10px 0 0;

 padding: 0;

 position: absolute;

 top: 100%;

 left: 0;

 min-width: 180px;

 list-style: none;

 z-index: 4;


}

.sh-global-nav-list .sh-global-nav-item ul li {

 height: 0;

 overflow: hidden;

 -webkit-transition: all .3s;

 transition: all .3s;

 border: none;


}

.sh-global-nav-list .sh-global-nav-item:hover ul {

 margin: 0;

 padding-top: 10px;


}

.sh-global-nav-list .sh-global-nav-item:hover ul li {

 -webkit-transition: all .3s;

 transition: all .3s;

 height: 34px;


}

.sh-global-nav-list .sh-global-nav-item ul li a {

 background-color: #ddd;

 display: block;

 line-height: 33px;

 border-bottom: 1px solid #ddd;


}

.sh-global-nav-list .sh-global-nav-item ul li:last-child a {

 border-bottom: none;


}

.sh-global-nav-list .sh-global-nav-item ul li a:hover {

 background-color: #ccc;


}

/* トグルボタン */
.sh-mobile-head-toggle-button {

 position: absolute;

 height: 40px;

 width: 46px;

 left: 0;

 top: 0;

 z-index: 1;


}

.sh-mobile-head-toggle-button span {

 position: absolute;

 left: 10px;

 width: 26px;

 height: 2px;

 background-color: #111;

 -webkit-transition: all .3s;

 transition: all .3s;

 z-index: 1;


}

.sh-mobile-head-toggle-button span:first-child {

 top: 12px;


}

.sh-mobile-head-toggle-button span:nth-child(2) {

 top: 20px;


}

.sh-mobile-head-toggle-button span:nth-child(3) {

 top: 28px;


}

.sh-mobile-head-toggle-button.is-open span:first-child {

 animation: rotate-span1 .6s forwards;


}

.sh-mobile-head-toggle-button.is-open span:nth-child(2) {

 animation: rotate-span2 .6s forwards;


}

.sh-mobile-head-toggle-button.is-open span:nth-child(3) {

 animation: rotate-span3 .6s forwards;


}

@keyframes rotate-span1 {

 0% {
top: 12px;
width: 26px;
transform:rotate(0deg);
left:10px;

}

 50% {
top: 20px;
width: 0px;
left:23px;

}

 100% {
top: 20px;
width: 26px;
transform:rotate(315deg);
left:10px;

}


}

@keyframes rotate-span2 {

 0% {
width: 26px;
left: 10px;

}

 50% {
width: 0px;
left:23px;

}

 100% {
width: 0px;
left:23px;

}


}

@keyframes rotate-span3 {

 0% {
top: 28px;
 width: 26px;
transform:rotate(0deg);
left: 10px;

}

 50% {
top: 20px;
width: 0px;
left:23px;

}

 100% {
top: 20px;
width: 26px;
transform:rotate(-315deg);
left:10px;

}


}

/* サイト名 */
.sh-site-name {

 -webkit-transition: opacity .6s;

 transition: opacity .6s;

 opacity: 0;

 visibility:hidden;


}

.sh-site-name.is-show {

 opacity: 1;

 visibility:visible;


}

.sh-site-name p {

 margin: 0;

 font-size: 0.9rem;

 text-align: center;

 line-height: 40px;

 color: #111;


}

.sh-site-name a {

 color: #111;

 text-decoration: none;

 font-family: 'Times New Roman', Times, FreeSerif, serif;


}

/* グローバルナビ検索ボックス */
.sh-global-nav-wrap .search-box {

 position: absolute;

 top: 0;

 right: 0;

 margin: 0;

 z-index: 1;


}

.sh-global-nav-wrap .sh-search-button {

 width: 46px;

 height: 40px;

 text-align: center;


}

.sh-global-nav-wrap .sh-search-button i {

 margin-top: 6px;

 font-size: 24px;

 color: #111;


}

.sh-global-nav-wrap .hatena-module-body {

 position: absolute;

 top: 100%;

 right: 0;

 padding: 0px 16px;

 height: 0;

 margin-top: 1px;

 overflow: hidden;

 -webkit-transition: all .3s;

 transition: all .3s;

 background-color: rgba(255,255,255,.8);



}

.sh-global-nav-wrap .hatena-module-body.is-open {

 height: auto;

 padding: 16px;


}

.sh-global-nav-wrap .hatena-module-body .search-module-input {

 width: 200px;

 -webkit-box-sizing: border-box;

 box-sizing: border-box;

 border: 1px solid #bbb;

 padding: 4px;

 border-radius: 0;

 -webkit-appearance:none;


}

.sh-global-nav-wrap .hatena-module-body .search-module-button {

 margin: 10px 0 0 140px;

 width: 60px;

 height: 28px;

 border-radius: 0px;

 background-color: #F6F4F1;

 color: #111;

 border: 1px solid #999;

 cursor: pointer;

 outline: none;

 padding: 0;

 appearance: none;

 -webkit-box-sizing: border-box;

 box-sizing: border-box;


}

#container #container-inner {

 position: relative;

 left: 0;

 -webkit-transition: all .6s;

 transition: all .6s;

 z-index: 1;


}

#container #container-inner.is-open {

 left: 250px;


}

.sh-mobile-head {

 display: none;


}

.sh-black-back {

 display: none;


}

@media (max-width: 767px) {

 .sh-global-nav-wrap {

   height: 0px;


}

 .sh-global-nav {

   margin-bottom: 0;

   border-bottom: none;

   position: fixed;

   width: 230px;

   height: 100%;

   top: 0;

   left: -250px;

   overflow-y: auto;

   -webkit-transition: all .6s;

   transition: all .6s;

   -webkit-box-sizing: border-box;

   box-sizing: border-box;

   background-color: #F6F4F1;

   padding-top: 40px;


}

 .sh-global-nav.is-open {

   left: 0;


}

 .sh-global-nav-list {

   padding: 0;

   text-align: left;


}

 .sh-global-nav-list .sh-global-nav-item a {

   padding: 0 12px;


}

 .sh-global-nav-list .sh-global-nav-item {

   height: 38px;

   width: 100%;

   padding: 0;

   border-right: none;


}

 .sh-global-nav-list .sh-global-nav-item.has-child {

   height: auto;


}

 .sh-global-nav-list .sh-global-nav-item.has-child::after {

   display: none;


}

 .sh-global-nav-list .sh-global-nav-item > a {

   display: block;

   line-height: 38px;

   font-weight: bold;

   background-color: #F6F4F1;

   color: #111;

   border-top: 1px solid #999;

   border-bottom: 1px solid #999;


}

 .sh-global-nav-list .sh-global-nav-item > a:hover {

   background-color: #999;


}

 .sh-global-nav-list .sh-global-nav-item a:after {

   display: none;


}

 /* 子カテゴリー */
 .sh-global-nav-list .sh-global-nav-item ul {

   padding: 0;

   position: static;

   margin: 0;


}

 .sh-global-nav-list .sh-global-nav-item:hover ul {

   padding-top: 0;


}

 .sh-global-nav-list .sh-global-nav-item ul li {

   height: 36px;


}

 .sh-global-nav-list .sh-global-nav-item:hover ul li {

   height: 36px;


}

 .sh-global-nav-list .sh-global-nav-item ul li a {

   background-color: #F6F4F1;

   font-size: 0.9rem;

   line-height: 36px;

   border: none;


}

 .sh-global-nav-list .sh-global-nav-item ul li a::before {

   font-family: "blogicon";

   content: "\f006";

   font-size: 0.7rem;

   color: #aaa;

   margin-right: 10px;


}

 .sh-mobile-head {
   display: block;
   width: 100%;
   height: 40px;
   background-color: #F6F4F1;
   border-bottom: 1px solid #F6F4F1;
   position: fixed;
   top: 0;
   left: 0;
   margin-top: 0;
   z-index: 80;
   -webkit-transition: all .6s;
   transition: all .6s;
}

 .sh-mobile-head.is-open {
   left: 230px;
}

 .sh-black-back {
   position: fixed;
   left: 0;
   top: 40px;
   display: block;
   width: 0;
   height: 100%;
   -webkit-transition: all .6s;
   transition: all .6s;
   background-color: #000;
   opacity: 0.6;
   z-index: 2000;
}

 .sh-black-back.is-open {

   display: block;

   width: 100%;

   left: 230px;


}


}


/* フォローボタン */
.sh-follow-btn-small {
 text-align: center;
}

.sh-follow-btn-small a {
 display: inline-block;
 color: #111;
}

.sh-follow-btn-small i,
.sh-follow-btn-small i.lg {
 font-size: 30px;
 margin-right: 12px;
}

/* シェアボタン */
.sh-share-area,
.sh-share-fixed-bottom {
 width: 60%;
 position: relative;
 background-color: #fff;
 padding : 4px 0;
 margin: 20px auto;
 z-index: 1;
}

.sh-share-text {
 font-size: 0.9rem;
 margin-bottom: 6px;
 text-align: center;
 color: #666;
}

.sh-share-list {
 list-style: none;
 font-size: 0px;
 letter-spacing: 0px;
 padding: 0;
 margin: 0;
}

.sh-share-item {
 position: relative;
 text-align: center;
 display: inline-block;
 font-size: 26px;
 width: 25%;
 border-right: 1px solid #fafafa;
 box-sizing: border-box;
 -webkit-box-sizing: border-box;
}

.sh-share-item:last-child {
 border-right: none;
}

.sh-share-item a {
 height: 36px;
 line-height: 36px;
 display: block;
 color: #111;
}

.sh-share-item a:hover {
 opacity: .6;
}

.sh-share-item .sh-share-count {
 position: absolute;
 left: 50%;
 top: 0px;
 margin-left: 8px;
 display: block;
 min-width: 14px;
 padding: 0 2px;
 line-height: 18px;
 text-align: center;
 border-radius: 10px;
 font-size: .6rem;
 color: #fff;
 background-color: #999;
}


@media (max-width: 767px) {
 .sh-share-area {
   width: 100%;
}

 .sh-share-fixed-bottom {
   width: 100%;
   position: fixed;
   bottom: 0;
   left: 0;
   z-index: 5000;
   background-color: #f6f4f1;
   border-top: 1px solid #f6f4f1;
   margin: 0;
   padding : 4px 0;
}

 .sh-share-fixed-bottom .sh-share-text {
   display: none;
}

 .sh-share-fixed-bottom .sh-share-item {
   font-size: 22px;
}

 .sh-share-item .sh-share-count {
   margin-left: 6px;
}
}

.mincho {
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

@media (max-width: 767px) {
.mincho {
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
}


/*↓----更新日時表示----↓*/
.lastmod {
background-color: transparent;
padding: 5px 0px;
text-decoration: none;
font-size: 15px;
display: inline;
margin-left: 0px;
color: #999999;
}
.lastmod::before {
margin-right: 5px;
margin-left: 10px;
padding-left: 3px;
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: '\f01e';
}
.entry-date a {
background-color: transparent;
padding: 5px 0px 5px 6px;
text-decoration: none;
font-size: 15px;
display: inline;
}
.entry-date a::before {
margin-right: 5px;
padding-left: 3px;
}
/*↑----更新日時表示----↑*/