@charset "utf-8";
/* html,body,h1,h2,h3,ul,li,p{
  margin:0;
  padding:0;
  line-height:1;
  font-family: sans-serif;
}
ul{
  list-style: none;
}
a{
  text-decoration:none;
} */
body{
  background-color:#F7F8F8;
}
a{
  color:black;
}
article h2{
  line-height:1.4;
}
.panNav{
  width:990px;
  /* padding:14px 17px 55px; */
  padding:24px 0 56px;
  box-sizing:border-box;
  margin:0 auto;
  font-size:12px;
  color:#aaa;
}
.panNav a{
  font-size:12px;
  color:#aaa;
}
.second>.panNav{
  padding-bottom:20px;

}

@media screen and (max-width:998px){
  .panNav{
    width:100%;
  }
}

.blog_container{
  width:990px;
  display: flex;
  justify-content: space-between;
  margin:0 auto;
}
@media screen and (max-width:998px){
  .blog_container{
    width:100%;
  }
}

.blog_container p{
  line-height:2;
  color:#464D4E;
}
.blog_main{
  width:735px;
}
.blog_main img{
  max-width:100%;
  height:auto;
  box-sizing: border-box;
}
.side{
  width:211px;
}
article{
  border-top:1px solid #E5E5E5;
  padding:42px 0 70px;
  box-sizing: border-box;
}
h2{
  font-size:20px;
  margin-bottom:19px;
}

/* 個別投稿のトップタイトル pタグで処理しているため例外定義 */
.p-blog-hedding{
  line-height: 1;
  font-size: 28px;
}

.title{
  line-height: 1.4;
  font-size: 20px;
  margin-bottom: 19px;
}

.postDate{
  font-size:12px;
  opacity: 0.5;
  margin-bottom:19px;
}
/* 投稿日・更新日アイコン */
.postDate > time > img {
  /* border: 2px solid red; */
  width: 14px;
  height: auto;
  opacity: 1;
}
.categoryNav{
  height:33px;
  line-height:33px;
  background-color:white;
  text-align:right;
  font-size:12px;
  padding:0 12px 0 0;
  margin-bottom:40px;
  box-sizing:border-box;
  
}
.categoryNav a{
  color:#464D4E;
}
.categoryNav>span{
  opacity: 0.5;
}

.facebook{
  height:56px;
  margin:50px 0 50px 0;
}
.facebook>a{
  display: block;
  color:white;
  background-color:#3A5897;
  height:56px;
  line-height:56px;
  text-align: center;
  width:368px;
  margin:0 auto;
  font-size:13px;
}
.facebook i{
  margin-right:20px;
  font-size:20px;
}

.postNav{
  width:100%;
  /* height:152px; */
  border-top:1px solid #E5E5E5;
  padding:50px 0;
  box-sizing: border-box;
  display: flex;
}
.postNav span{
  display:inline-block;
  width:35%;
}
.postNav span.center{
  text-align: center;
  width:30%;
}
.postNav span.left{
  text-align: left;
}
.postNav span.right{
  text-align: right;
}

.pagination{
  margin-bottom:50px;
  padding-top:47px;
  text-align: center;
  /* border-top:1px solid #E5E5E5; */
  box-sizing: border-box;
}
.screen-reader-text{
  display: none;
}
.page-numbers{
  padding:2px;
  margin:0 10px;
  font-size:14px;
  box-sizing: border-box;
}
.page-numbers.current{
  font-weight:bold;
  border-bottom:3px solid black;
}
.prev.page-numbers{
  margin-right:40px;
}
.next.page-numbers{
  margin-left:40px;
}



.side h2.widgettitle{
  background-color:#E6F2F2;
  width: 211px;
  height:40px;
  font-size:14px;
  line-height:40px;
  padding-left:12px;
  margin-bottom: 19px;
  box-sizing:border-box;
}
.side ul ul{
  list-style: outside;
  padding-left:30px;
  box-sizing:border-box;
}
.side ul ul>li{
  font-size:13px;
  line-height:1.7;
  box-sizing: border-box;
  margin-bottom:19px;
}

/*  モーダルウィンドウ部分  */

#fullScreen{
	display: none;
}
#fullScreen.disp{
	height:100vh;
	width:100%;
	z-index: 10;
	background-color:black;
	position: fixed;
	display: flex;
	justify-content: center;
	align-items: center;
}

#imageArea{
	display: none;
	position: absolute;
	top:0;
	left:0;
	bottom:0;
	right:0;
	margin : auto;
  box-sizing: border-box;
  z-index: 20;
}
#imageArea.disp{
	display: block;
}

#viewImage.disp{
	display: block;
}

#btn{
	width:50px;
	height:50px;
	margin-top:-50px; /* ボタンを上部にずらして、イメージが中央に来るように */
	display: block;
	position: relative;
	border-radius:7px;
	float:right;
}
.bar{
	display:block;
	position: absolute;
	top:0;
	left:0;
	bottom:0;
	right:0;
	margin: auto;
	width:44px;
	height:4px;
	border-radius:7px;
	background:white;
	transition: .1s;
}
.bar.active{
	width:48px;
	height:4px;
}
.bar1{
	transform:rotateZ(45deg);
}
.bar2{
	background:white;
	transform:rotateZ(-45deg);
}



/* 背景画像のスクロールをとめる */
body.fixed{
	height:100vh;
	overflow-y:hidden;
	margin-right:17px;
	/* 横ずれ修正 */
}



.facebook-share{
  display:inline-block;
  margin-left:8px;
}


/* 20220510 追加 */

figure,
.wp-block-image{
  margin:40px 0 !important;
}

.articleContent{
  font-size:14px;
  color:#464D4E;
}
.articleContent > *{
  margin-top:40px;
  margin-bottom:40px;
}
.articleContent > *:first-child{
  margin-top:0 !important;
}
.articleContent > h2{
  margin-top:40px;
  margin-bottom:20px;
  padding:3px 0 3px 15px;
  font-size:18px;
  line-height:1.3;
  border-left:8px solid #CC3333;
  color:#CC3333;
}

.articleContent > p{
  margin-top:20px;
  margin-bottom:20px;
}

.articleContent ul,
.articleContent ol{
  padding-left:24px;
}
.articleContent ul{
  list-style:disc;
}
.articleContent li{
  margin-bottom:0.4em;
  line-height:1.4;
}


/* Easy Table of Contents */
article [id="ez-toc-container"]{
  margin:60px 0;
  padding:20px;
  padding-bottom:25px;
  background-color:white;
}
article .ez-toc-title-container{
  border-bottom:2px solid #B90E00;
}
article .ez-toc-title{
  margin:-5px 0 2px;
  font-size:18px;
}
article .ez-toc-list{
  padding-left:0;
  list-style:none;
}
article .ez-toc-list li{
  margin-bottom:0;
  padding:21px 0 17px 21px;
  line-height:1.3;
  border-bottom:1px solid #E5E5E5;
  background:url(../img/blog/list-style_blog.png) 0 22px no-repeat;
}
article .ez-toc-list li:last-child{
  padding-bottom:0;
  border-bottom:none;
}
article .ez-toc-list li a{
  color:#464D4E;
}


/* 投稿一覧表示(front-page, category) */
.post-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:35px;
  margin-bottom:34px;
}
.post-list li{
  background-color:white;
}
.post-list li a{
  display:block;
  padding-bottom:22px;
}
.post-list img{
  width:100%;
  object-fit:cover;
  aspect-ratio:350/180;
}
.post-list h2{
  margin:18px 20px 16px;
  font-size:18px;
  line-height:1.6;
}
.post-list time{
  margin-left:20px;
  font-size:12px;
}


@media screen and (max-width:998px){
  .panNav{
    padding-left:16px;
  }
  .blog_container{
    width:100%;
    padding:0 18px;
    box-sizing: border-box;
  }
  .blog_main{
    /* width:clac( 100% - 211px ); */
    width:clac( 100% - 230px );
    margin-right:20px;
  }
  .side{
    width:210px;
    /* background-color: wheat; */
  }
}












/* 767px以下 */









@media screen and (max-width:767px){
  header{
    padding-bottom:0px;
  }
  .panNav{
    width:100%;
    padding:16px 17px 28px;
    box-sizing:border-box;
    margin:0 auto;
    font-size:10px;
    line-height:1.6;
  }
  .panNav a{
    font-size:10px;
    line-height:1.6;
  }
  .panNav:nth-child(2){
    padding:16px 17px 20px;
  }
  
  .blog_container{
    width:100%;
    display: block;
    justify-content: space-between;
    margin:0 auto;
  }
  
  .blog_main{
    width:100%;
  }
  .side{
    width:100%;
    /* background-color: wheat; */
  }
  article{
    border-top:1px solid #E5E5E5;
    padding:20px 0 35px;
    box-sizing: border-box;
  }
  h2{
    font-size:16px;
    margin-bottom:5px;
  }
  
  .categoryNav{
    margin-bottom:20px;
  }
  
  .facebook>a{
    width:252px;
  }

  .page-numbers{
    margin:0 5px;
    font-size:13px;
  }
  .prev.page-numbers{
    margin-right:10px;
  }
  .next.page-numbers{
    margin-left:10px;
  }
  
  .pagination{
    margin:34px 0 64px;
  }
  
  .side h2.widgettitle{
    background-color:#E6F2F2;
    width: 100%;
    height:40px;
    font-size:14px;
    line-height:40px;
    padding-left:12px;
    margin-bottom: 19px;
    box-sizing:border-box;
  }
  .side ul ul{
    list-style: outside;
    padding-left:30px;
    box-sizing:border-box;
    /* background-color:pink; */
  }
  .side ul ul>li{
    font-size:13px;
    line-height:1.7;
    box-sizing: border-box;
    margin-bottom:19px;
  }
  
  /*  モーダルウィンドウ部分  */
  
  #fullScreen{
    display: none;
  }
  #fullScreen.disp{
    height:100vh;
    width:100%;
    z-index: 9999;
    background-color:black;
    position: fixed;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  #imageArea{
    display: block;
    position: absolute;
    top:0;
    left:0;
    bottom:0;
    right:0;
    margin : auto;
    box-sizing: border-box;
  }
  #imageArea.disp{
    display: block;
  }
  
  #viewImage.disp{
    display: block;
  }
  
  #btn{
    width:50px;
    height:50px;
    margin-top:-50px; /* ボタンを上部にずらして、イメージが中央に来るように */
    display: block;
    position: relative;
    border-radius:7px;
    float:right;
  }
  .bar{
    display:block;
    position: absolute;
    top:0;
    left:0;
    bottom:0;
    right:0;
    margin: auto;
    width:44px;
    height:4px;
    border-radius:7px;
    background:white;
    transition: .1s;
  }
  .bar.active{
    width:48px;
    height:4px;
  }
  .bar1{
    transform:rotateZ(45deg);
  }
  .bar2{
    background:white;
    transform:rotateZ(-45deg);
  }
  
  
  
  /* 背景画像のスクロールをとめる */
  body.fixed{
    height:100vh;
    overflow-y:hidden;
    margin-right:17px;
    /* 横ずれ修正 */
  }
  
  .postDate{
    font-size:10px;
  }
  .categoryNav{
    font-size:10px;
  }
  .articleContent{
    font-size:12px;
  }

  figure,
  .wp-block-image{
    margin:24px 0 !important;
  }
  .articleContent > *{
    margin-top:24px;
    margin-bottom:24px;
  }
  .articleContent > h2{
    margin-top:24px;
    margin-bottom:16px;
    font-size:14px;
    border-left-width:5px;
  }
  .articleContent > p{
    margin-top:16px;
    margin-bottom:16px;
  }

  /* Easy Table of Contents */
  article [id="ez-toc-container"]{
    margin:40px 0;
    padding-bottom:17px;
  }
  article .ez-toc-title{
    margin:-5px 0 2px;
    font-size:14px;
  }
  article .ez-toc-list li{
    margin-bottom:0;
    padding:16px 0 15px 14px;
    line-height:1.3;
    border-bottom:1px solid #E5E5E5;
    background:url(../img/blog/list-style_blog_s.png) 0 19px no-repeat;
  }

  /* 投稿一覧表示(front-page, category) */
  .post-list{
    grid-template-columns:none;
    gap:20px;
  }
  .post-list img{
    width:100%;
  }
  .post-list h2{
    margin-bottom:11px;
    font-size:16px;
  }
  .post-list time{
    font-size:10px;
  }
}