/****************************************
初期化処理
*****************************************/
abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,main,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{
  margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent
}
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section{display:block}
blockquote,q{quotes:none}
blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}
ins{text-decoration:none}
*,:after,:before{box-sizing:border-box}
html{font-size:62.5%}
body{text-align:left;word-wrap:break-word;overflow-wrap:break-word;font-size:1.7rem;font-weight:500;line-height:1.2;letter-spacing:.02em;min-width:960px}
.container{margin:auto;width:86%;min-width:960px;max-width:1180px}
a{text-decoration:none;color:inherit}
img{height:auto;vertical-align:bottom}
iframe,img{max-width:100%}
.separator a{margin-left:0!important;margin-right:0!important}
.separator a,.separator img{display:inline-block}
.section{margin:0}
.widget ol,.widget ul{padding:0}
.widget-content li{list-style-type:none}
.widget .post-body ol,.widget .post-body ul{padding-left:2em;padding-right:0}
.Header h1{margin-bottom:0}
.status-msg-wrap{margin:0}
.status-msg-body{text-align:left}
.status-msg-border{border:0}
.status-msg-bg{background:0}
.gsc-search-box{margin-bottom:0!important}
table.gsc-search-box{background:#fff;border-radius:18px;max-width:16em}
input.gsc-search-button{appearance:none;padding:0 .8em;border:0;outline:0;margin-left:0!important;border-radius:18px;font-weight:700;height:2.5em;font-size:14px;cursor:pointer}
.gsc-input{padding-right:0!important}
input.gsc-input{appearance:none;padding:0 1em;border:0;outline:0;background:#fff;border-radius:18px;height:2.5em;font-size:14px;width:100%}
.cloud-label-widget-content{text-align:left}
.label-size{font-size:80%!important;opacity:1!important;display:inline-block}

@media(max-width:768px){
  body{font-size:1.6rem;min-width:0}
  .container{width:96%;min-width:0}
  .twitter-timeline{width:770px!important}
}

@media(max-width:480px){
  #main.width-100 .container{width:100%}
  .width-100 #sub-content,.width-100 .breadcrumbs{width:96%;margin-right:auto;margin-left:auto}
}

/****************************************
全体設定
*****************************************/
body{
  font-family:"游ゴシック体","Yu Gothic",YuGothic,"ヒラギノ角ゴシック Pro","Hiragino Kaku Gothic Pro",'メイリオ',Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}
@font-face{
  font-family:'Yu Gothic';
  font-display:swap;
}

/* 2カラム */
#main-inner{display:flex}
#main-content{margin-right:30px;width:calc(100% - 346px);flex-shrink:0}
#sub-content{margin-top:30px;width:316px;flex-shrink:0}

@media(max-width:768px){
  #main-inner{display:block}
  #main-content{margin-right:0;width:100%}
  #sub-content{width:100%}
}

/****************************************
ナビゲーション（変数なし部分）
*****************************************/
#navigation a{color:inherit}
#navigation-button,#navigation-label{display:none}
#navigation-content ul{display:flex;flex-wrap:wrap}
#navigation-content li{margin-right:1em;list-style:none}
#navigation-content li a{font-weight:bold}

@media(max-width:768px){
  #navigation-label{
    display:block;text-align:center;font-size:2.5rem;cursor:pointer
  }
  #navigation-content{
    display:none;flex-direction:column;width:100%;position:absolute;top:100%;left:0;
    max-height:0;overflow:hidden;transition:max-height .3s ease-out;z-index:1000;
    box-shadow:0 4px 6px rgba(0,0,0,.1)
  }
  #navigation-button:checked ~ #navigation-content{
    display:flex;max-height:500px
  }
}

/****************************************
ヘッダー（変数なし部分）
*****************************************/
#header-inner{padding:1em 0}
#header-img-wrapper{text-align:center}
#header-title{font-size:150%;font-weight:bold}
#header-text{font-size:80%;font-weight:bold}

/****************************************
パンくず（変数なし部分）
*****************************************/
.breadcrumbs{line-height:1;font-size:16px;margin-top:10px}

/****************************************
記事一覧（変数なし部分）
*****************************************/
#list{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start}
#list a{color:inherit}
.list-item-inner{padding:.5em;border-top:none}
.list-item-title{margin-top:.5em;font-weight:bold}
.list-item-img{display:block;width:100%}
.list-item-category{display:flex;flex-wrap:wrap;justify-content:flex-end;margin-top:.5em;font-size:80%;font-weight:bold}
@media(max-width:480px){#list{display:block}}

/****************************************
個別記事（変数なし部分）
*****************************************/
#single-content{margin-top:1em;line-height:1.8}
#single-content p{margin-top:1.8em;margin-bottom:1.8em}
#single-content h3{font-size:2.26rem;font-weight:bold;margin-bottom:1em;margin-top:2em;padding:.5em 0;line-height:1.2}
#single-content blockquote{
  margin:20px 40px;
  padding-left:20px;
  border-left:3px solid #eeeeee;
  color:#aaaaaa;
  font-style:italic;
  font-family:Georgia,Cambria,"Times New Roman",Times,serif;
}

.single-share{display:flex;justify-content:center}
.single-share-facebook{background:#3B5998}
.single-share-twitter{background:#55acee}
.single-share-hatena{background:#008fde}
.single-share-pocket{background:#ef3f56}
.single-share-line{background:#00B900}

#blog-pager{text-align:center;margin-top:30px}
#blog-pager-newer-link,#blog-pager-home-link,#blog-pager-older-link{
  padding:1em;font-weight:bold;border-radius:2em
}

#comments{margin-top:2em}

/****************************************
フッター（変数なし部分）
*****************************************/
#footer-inner{display:flex}
#footer-item1,#footer-item2,#footer-item3{
  flex-basis:29.3333%;margin-left:2%;margin-right:2%
}
#footer .widget{padding-top:30px}
#footer .widget:last-child{padding-bottom:30px}
@media(max-width:768px){#footer-inner{display:block}}

/****************************************
タグクラウド（変数なし部分）
*****************************************/
.label-size{padding:.5em;border-radius:3px;margin:.25em 0}
.widget h2{font-size:110%}
.widget h2,.widget .widget-content{font-weight:bold}
