@charset "utf-8";
* { box-sizing: border-box;}
@media screen and (min-width: 1100px) {
/*
#blog-page-wrap main{ margin-left: -80px;}
*/
}
@media screen and (min-width: 800px) {
header nav .header-menu .hd-nav .hd1 p .hd-link > span > span.j, 
header nav .header-menu .hd-nav .hd1 p .hd-link > span > span.eng{ color: #fff !important;}
.scroll header nav .header-menu .hd-nav .hd1 p .hd-link > span > span.j, 
.scroll header nav .header-menu .hd-nav .hd1 p .hd-link > span > span.eng{ color: #000 !important;}
header nav .header-menu .hd-nav#hd-contact .hd1 .hd-link .j, 
header nav .header-menu .hd-nav#hd-contact .hd1 .hd-link .eng{ color: #000 !important;}
/**/
}

/*------------------------
blog-page-wrap
----------------------------*/
.ez-toc-section{ width: 100%; height: 2px; display: block; pointer-events: none; position: absolute; left: 0; top: 0; margin-top: 94vh;}
#blog-page-wrap{ width: 100%; display: flex; flex-direction: column; align-items:center; justify-content: flex-start;}
#blog-page-wrap main #blog-main *{ font-size: 15px; color: #333; font-weight: 400;}
#blog-page-wrap main #blog-main b{ font-weight: bold;}
#blog-page-wrap main #blog-main p, 
#blog-page-wrap main #blog-main p *{line-height: 1.8em; letter-spacing: 1px; }
#blog-page-wrap main #blog-main h2{display: flex; align-items: center; padding:25px 15px; border: solid 1px #000; margin-top: 30px; position: relative; border-radius: 10px;}
#blog-page-wrap main #blog-main h2, 
#blog-page-wrap main #blog-main h2 .tSpan{ font-size: 22px; color: #000; font-weight: 400; line-height: 1.1em; position: relative;}
#blog-page-wrap main #blog-main h3{ display: block; padding: 10px 0; position: relative;}
#blog-page-wrap main #blog-main h3, 
#blog-page-wrap main #blog-main h3 .tSpan{ font-size: 18px; letter-spacing: 0; color: #000; font-weight: 400; line-height: 1.2em;}
#blog-page-wrap main #blog-main h4{ display: block; padding: 5px 0;}
#blog-page-wrap main #blog-main h4, 
#blog-page-wrap main #blog-main h4 span{ font-size: 16px; color: #000; font-weight: 400; line-height: 1.2em;}

#blog-page-wrap main #blog-main h2.border{ }
#blog-page-wrap main #blog-main h3.border{ padding: 10px; border-bottom: double 3px #777;}
#blog-page-wrap main #blog-main h4.border{ padding: 10px; border: solid 1px #ddd; border-radius: 6px;}


@media screen and (max-width: 800px) {
#blog-page-wrap{ margin-top: 80px;}
#blog-page-wrap main #blog-main *{ font-size: 16px;}
#blog-page-wrap main #blog-main h2, 
#blog-page-wrap main #blog-main h2 .tSpan{ font-size: 26px;}
#blog-page-wrap main #blog-main h3, 
#blog-page-wrap main #blog-main h3 .tSpan{ font-size: 20px; font-weight: bold;}
#blog-page-wrap main #blog-main h4, 
#blog-page-wrap main #blog-main h4 span{ font-size: 18px;}
}
/*==============================================
  下層 MV
================================================*/
#titleArea{ width: 100%; min-height: 300px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 30px 3% 0; position: relative; z-index: 8; background:#000;}
#titleArea .back{ width:100%; height: 100%; position: absolute; z-index: -1; left: 0; top:0; background-size: cover; opacity: 0.3; }
#titleArea::before{content: ""; width:100%; height: 100%; position: absolute; z-index: 100; top: 0; right: 0; background:#fff; transition: 0.6s 0.1s ease-in;}
.opBody1 #titleArea::before{width: 0%;}
#titleArea h1{ width: 100%; display: flex; justify-content: center; padding: 20px 0;}
#titleArea h1 span{ font-size: 22px; letter-spacing: 1px; color: #fff; font-weight: normal; line-height: 1.4em;}
#titleArea ul{ width: 100%; float: left; text-align: center;}
#titleArea ul li{ display: inline-block; color: #fff; vertical-align: baseline;}
#titleArea ul li:first-child::after{ content: "　―　";}
#titleArea ul li.date{ letter-spacing: 1px;}
#titleArea ul li.cate{ font-size: 18px;}
@media screen and (max-width: 800px) {
#titleArea{ margin:20px 0 0;}

#titleArea h1 span{ font-size: 22px;}
}
@media screen and (max-width: 510px) {
#titleArea{ margin:10px 0 20px;}
#titleArea h1 span{ font-size: 18px; letter-spacing: 0;}
#titleArea ul li.date{ font-size: 13px;}
#titleArea ul li.cate{ font-size: 14px;}
}
/*------------------------
blog-page-wrap
----------------------------*/
#blog-page-wrap main{ width: 100%; display: flex; flex-direction: row-reverse; justify-content: center; align-items: flex-start;}
#blog-page-wrap main #blog-main{ max-width: 740px; width: 92%; margin:0 4%; display: flex; flex-direction: column; justify-content: center; align-items: center;}
#blog-page-wrap main #blog-main > *{ width: 100%;}
/*---------
WriterID
-----------*/
@media screen and (min-width: 1021px) {
body, 
#blog-page-wrap, 
#blog-page-wrap main{ overflow: visible;}
/**/
#blog-page-wrap main #WriterID { width: 170px; margin:0 40px 0 10px; position: sticky; top: 20vh; left: 0; margin-top: 100px;}
#blog-page-wrap main #WriterID .image{ width: 50px; height: 50px; position: absolute; left: 0; top: 5px; border-radius: 100%; padding: 10px; border: solid 1px #ccc; background: #fff; display: flex; justify-content: center; align-items: center;}
#blog-page-wrap main #WriterID .txtBox{ width: 100%; margin-bottom: 10px; display: flex; flex-direction: column;}
#blog-page-wrap main #WriterID .txtBox .tit{ display: flex; width: 100%; min-height: 50px; align-items: center; justify-content: center;padding-left: 60px; flex-direction: column-reverse; margin-bottom: 10px;}
#blog-page-wrap main #WriterID .txtBox .tit h4{ width: 100%; display: block; font-size: 8px; color: #555; font-weight: 300; letter-spacing: 0;}
#blog-page-wrap main #WriterID .txtBox .tit h5{ width: 100%; display: flex; font-size: 18px; font-weight: 400; margin-bottom: 1px;}
#blog-page-wrap main #WriterID .txtBox .tit p{ width: 100%; display: block; font-size: 20px; font-weight: 400;}
#blog-page-wrap main #WriterID .txtBox .info{ width: 100%; display: block;}
#blog-page-wrap main #WriterID .txtBox .info p{ font-size: 11px; line-height: 1.6em; width: 100%; display: block; color: #999;}
/**/
#blog-page-wrap main #WriterID .txtBox .info ul{ width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 6px;}
#blog-page-wrap main #WriterID .txtBox .info ul li{ width: 100%; display: block; margin: 5px 0;}
#blog-page-wrap main #WriterID .txtBox .info ul li a{ display: flex; width: 100%; height:26px; align-items: center; justify-content: center; font-size: 9px; letter-spacing: 0; border-radius: 4px; border: solid 1px #ddd; color: #999; line-height: 1em;}
#blog-page-wrap main #WriterID .txtBox .info ul li a:hover{ background: #555; color: #fff; border: solid 1px #555;}
#blog-page-wrap main #WriterID .txtBox .info ul li.contact{ width: 100%;}
#blog-page-wrap main #WriterID .txtBox .info ul li.contact a{ background:#F3BBBC; border: solid 1px #F3BBBC; color: #fff;}
#blog-page-wrap main #WriterID .txtBox .info ul li.contact a:hover{ background:#CD6567; border: solid 1px #A23234;}
#blog-page-wrap main #WriterID #WriterID_btn{ width: 30px; height: 30px; position: absolute; left: 0; top: -30px; font-size: 20px; display: flex; justify-content: center; align-items: center; cursor: pointer; transition: 0.4s; border-radius: 100%; padding-bottom: 2px;}
#blog-page-wrap main #WriterID #WriterID_btn:hover{ box-shadow: 0 0 0 2px #ccc;}
#blog-page-wrap main #WriterID #WriterID_btn.open::before{ content: "×"; font-size: 30px;}
#blog-page-wrap main #WriterID #WriterID_btn.close::before{ content: "＋"; font-size: 30px; opacity: 0.3;}
#blog-page-wrap main #WriterID #WriterID_btn:hover.close::before{ opacity: 1;}
#blog-page-wrap main #WriterID.hide .image, 
#blog-page-wrap main #WriterID.hide .txtBox { opacity: 0; pointer-events: none;} 
}
@media screen and (max-width: 1021px) {
#blog-page-wrap main{ flex-direction: column; align-items: center;}
#blog-page-wrap main #WriterID { width: 94%; margin: 80px 3% 20px; display: flex; flex-direction: row; border: solid 1px #ddd; border-radius: 4px; padding: 20px; justify-content: space-between;}
#blog-page-wrap main #WriterID .image{ width: 80px; height: 80px; border-radius: 100%; padding: 10px 10px 12px; border: solid 1px #ccc; background: #fff; display: flex; justify-content: center; align-items: center;}

#blog-page-wrap main #WriterID .txtBox{ width: calc(100% - 120px); display: flex; flex-direction: column;}
#blog-page-wrap main #WriterID .txtBox .tit{ width: 100%; display: flex; flex-direction: row-reverse; align-items: flex-end; justify-content: flex-end;}

#blog-page-wrap main #WriterID .txtBox .tit h4{ font-size: 11px; font-weight: 300; margin:0 0 5px 10px; color: #000;}
#blog-page-wrap main #WriterID .txtBox .tit h5{ font-size: 24px; font-weight: 400;}
#blog-page-wrap main #WriterID .txtBox .info{ display: flex; flex-direction: column;}
#blog-page-wrap main #WriterID .txtBox .info p{ font-size: 12px; line-height: 1.2em; margin: 10px 0; color: #777;}
/**/
#blog-page-wrap main #WriterID .txtBox .info ul{ display: flex; flex-wrap: wrap;}
#blog-page-wrap main #WriterID .txtBox .info ul li{ display: block; margin:5px 10px 5px 0;}
#blog-page-wrap main #WriterID .txtBox .info ul li a{ display: flex; padding: 0 8px; height: 24px; border-radius: 2px; align-items: center; justify-content: center; background: #e5e5e5; border: solid 1px #e5e5e5; color: #777; font-size: 12px;}
#blog-page-wrap main #WriterID .txtBox .info ul li a:hover{ background: #fff; border: solid 1px #aaa; color: #000;}
#blog-page-wrap main #WriterID .txtBox .info ul li.contact{ }
#blog-page-wrap main #WriterID .txtBox .info ul li.contact a{ padding: 0 15px; background:#F3BBBC; border: solid 1px #F3BBBC; color: #fff;}
#blog-page-wrap main #WriterID .txtBox .info ul li.contact a:hover{ background:#CD6567; border: solid 1px #A23234;}
}


@media screen and (max-width: 600px) {
#blog-page-wrap main #WriterID .txtBox .tit{ flex-direction: column-reverse; align-items: flex-start;}
#blog-page-wrap main #WriterID .txtBox .tit h2{ margin:0 0 5px;}
#blog-page-wrap main #WriterID .txtBox .info p{ font-size: 11px; margin: 5px 0;}


#blog-page-wrap main #WriterID .txtBox .info ul{ flex-direction: column;}
#blog-page-wrap main #WriterID .txtBox .info ul li{ width: 100%; margin: 5px 0;}
	
#blog-page-wrap main #WriterID .txtBox .info ul li a{ width: 100%; padding: 0; height: 30px; color: #555;}
}

/*---------
breadcrumb
-----------*/
#blog-page-wrap .breadcrumb{ width: 100%; display: flex; padding:10px 2% 40px; justify-content: center; opacity: 0;}
.opBody1 #blog-page-wrap .breadcrumb{ opacity: 1;}
#blog-page-wrap .breadcrumb ul{ width: 96%; max-width: 900px; display: flex; flex-wrap: wrap;}
#blog-page-wrap .breadcrumb ul li{ display: flex; align-items: center; line-height: 1em;}
#blog-page-wrap .breadcrumb ul li > *{ font-size: 11px; line-height: 0; line-height: 1.2em;}
#blog-page-wrap .breadcrumb ul li strong{ font-weight: bold; color: #000;}
#blog-page-wrap .breadcrumb ul li a{ color: #777;}
#blog-page-wrap .breadcrumb ul li a:hover{ color: #000; text-decoration:underline;}
#blog-page-wrap .breadcrumb ul li::after{ content:">"; display: block; font-size: 11px; margin: 0 5px; line-height: 1em; font-weight: 200; color: #aaa;}
#blog-page-wrap .breadcrumb ul li:last-child::after{ display: none;}
#blog-page-wrap .breadcrumb ul li br{ display: none;}









/*---------
目次：プラグイン
-----------*/
#blog-page-wrap main #toc_container { padding: 10px 10px 10px 20px; background: #f0f0f0; border-radius: 2px; margin-bottom: 40px;}
#blog-page-wrap main #toc_container *{ font-size: 14px !important;}
#blog-page-wrap main #toc_container > ul, 
#blog-page-wrap main #toc_container > ul > ul{ width: 100%; display: flex; flex-direction: column;}
#blog-page-wrap main #toc_container > ul > li { width: 96%; display: block; margin:10px 0 6px 4%; line-height: 1.2em; }
#blog-page-wrap main #toc_container > ul > li{list-style: decimal !important; display: list-item !important;}
#blog-page-wrap main #toc_container > ul > li > a{ font-weight: 500; color: #000;}
#blog-page-wrap main #toc_container > ul > li a:hover{ color: #000; text-decoration: underline;}
#blog-page-wrap main #toc_container > ul > li > ul li{ }
#blog-page-wrap main #toc_container > ul > li > ul li{ width: 98%; margin:6px 0 2px 2%; line-height: 1.2em; list-style: disc !important; overflow: visible !important; display: list-item !important; padding: 2px 0;}
#blog-page-wrap main #toc_container > ul > li > ul li a{ font-size: 90%; color: #555 !important; font-weight: 300;}
#blog-page-wrap main #toc_container ul li::marker{ font-family: Arial, Helvetica, "sans-serif"; font-weight: bold; position: relative; z-index: 99999999999999999999; opacity: 1;}
@media screen and (max-width: 600px) {
#blog-page-wrap main #toc_container *{ font-size: 15px;}
#blog-page-wrap main #toc_container { padding: 20px 10px 20px 25px;}
#blog-page-wrap main #toc_container > ul > li{ width: 94%; margin:10px 0 5px 6%;}
}

/*今回の目次*/
#blog-page-wrap #ez-toc-container { background: #f0f0f0; border: none !important;border-radius: 4px;-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05); box-shadow:none !important; display: table; margin-bottom: 1em; padding: 10px 10px 10px 20px !important; position: relative; width: auto;}
#blog-page-wrap div#ez-toc-container .ez-toc-title{ font-size: 14px; font-weight: bold;}


#blog-page-wrap div#ez-toc-container .ez-toc-list li a{ font-size: 13px !important;}
#blog-page-wrap div#ez-toc-container .ez-toc-list li a:hover{ color: #000 !important; text-decoration: underline;}
#blog-page-wrap div#ez-toc-container .ez-toc-list > li  { margin: 10px 0 !important; line-height: 1.1em !important; }

#blog-page-wrap div#ez-toc-container .ez-toc-list > li > a{ font-weight: 500; color: #000;}
#blog-page-wrap div#ez-toc-container .ez-toc-list > li ul li{ width: 95%; margin:2px 0 2px 5%; line-height: 1.1em; list-style: disc !important; overflow: visible !important; display: list-item !important; padding: 2px 0;}

#blog-page-wrap div#ez-toc-container .ez-toc-list > li ul li::marker{ font-family: Arial, Helvetica, "sans-serif"; font-weight: bold; position: relative; z-index: 99999999999999999999; opacity: 1;}

#blog-page-wrap div#ez-toc-container .ez-toc-list > li ul li a{ font-size: 90%; color: #555 !important; font-weight: 300;}


/*---------
シリーズ
-----------*/
#blog-page-wrap main #blog-main .series{ width: 100%; float: left; padding: 20px 5%; border: solid 4px #eee; border-radius: 4px;}
#blog-page-wrap main #blog-main .series > * {width: 100%; float: left; }
#blog-page-wrap main #blog-main .series p{ font-size: 14px; font-weight: bold;}
#blog-page-wrap main #blog-main .series ul li{ width: 100%; float: left; padding: 4px 0 4px 35px; position: relative; margin:5px 0 ; }
#blog-page-wrap main #blog-main .series ul li a{ color: #CD6567; text-decoration: underline; font-size: 13px;}
#blog-page-wrap main #blog-main .series ul li a:hover{ color: #000; text-decoration: none;}
#blog-page-wrap main #blog-main .series ul li.now::before{ content: "now"; width: 30px; line-height: 30px; vertical-align: middle; border-radius: 100%; background:#CD6567; color: #fff; text-align: center; font-size: 11px; letter-spacing: 0; position: absolute; left: 0; top: 50%; margin-top: -15px;}
#blog-page-wrap main #blog-main .series ul li.now{ border: solid 1px #777; color: #fff; background: #777;  border-radius: 30px; font-size: 13px;}
@media screen and (max-width: 600px) {
#blog-page-wrap main #blog-main .series{ padding: 15px 4%;}
#blog-page-wrap main #blog-main .series p, 
#blog-page-wrap main #blog-main .series ul li.now, 
#blog-page-wrap main #blog-main .series ul li a{ font-size: 15px;}
}
/*---------
パーツデザイン
-----------*/
#blog-page-wrap main .dlbox { display: flex; flex-direction: column; padding: 20px; border-radius: 12px; background: #f5f5f5; border: solid 1px #999;}
#blog-page-wrap main .dlbox > *{ width: 100%; display: flex; font-weight: 300;}
#blog-page-wrap main .dlbox dt{ font-size: 16px; font-weight: bold; margin-bottom: 10px; border-bottom: solid 3px #ccc; padding-bottom: 5px;}
#blog-page-wrap main .dlbox dd { font-size: 16px; margin-bottom: 5px;}
#blog-page-wrap main .dlbox dd b{ display: block; margin-right: 5px; letter-spacing: 0; font-size: 14px; color: #000;}
#blog-page-wrap main .dlbox dd span { flex:1; display: block; letter-spacing: 0; font-size: 14px;}















/*-------------------
ページリンク関連
----------------------*/
/*次へボタン*/
#blog-post-bottom{ padding-top: 80px; width: 92%; margin: 0 4%;}
#blog-post-bottom .pageInner{ width: 100%; max-width: 650px; display: flex; flex-direction: column; justify-content: center; align-items: center;}
#blog-post-bottom #blog_page_link { width: 100%; margin: 40px 0 100px;}
#blog-post-bottom #blog_page_link ul{ display: flex; flex-direction: row; justify-content: space-between;}
#blog-post-bottom #blog_page_link ul li{ display: block; width: 20%; margin: 0 3%; }
#blog-post-bottom #blog_page_link ul li.list{ width: 38%;}
#blog-post-bottom #blog_page_link ul li > *{ line-height: 60px; text-align: center; display: block; font-size: 16px; border-radius: 4px;}
#blog-post-bottom #blog_page_link ul li a{ border: solid 1px #555; text-decoration: none; color: #111; font-weight: bold;position: relative;}
#blog-post-bottom #blog_page_link ul li a span{ font-size: 16px;}
#blog-post-bottom #blog_page_link ul li a:hover{ background: #f0f0f0; border: solid 1px 000; box-shadow: 0 0 0 2px #000;}
#blog-post-bottom #blog_page_link ul li > span{ background: #e5e5e5; color: #888;}
/*icon*/
#blog-post-bottom #blog_page_link ul li.list a span, 
#blog-post-bottom #blog_page_link ul li.list a span::before, 
#blog-post-bottom #blog_page_link ul li.list a span::after{ content: ""; display: block; width: 20px; height: 2px; position: absolute; background: #111; transition: 0.3s;}
#blog-post-bottom #blog_page_link ul li.list a span{ margin-top: -1px; left: 15%; top: 50%;}
#blog-post-bottom #blog_page_link ul li.list a span::before{ margin-top: -6px; left: 0; top: 0;}
#blog-post-bottom #blog_page_link ul li.list a span::after{ margin-top: 6px; left: 0; top: 0;}
#blog-post-bottom #blog_page_link ul li.list a:hover span::before{ margin-top: -4px;}
#blog-post-bottom #blog_page_link ul li.list a:hover span::after{ margin-top: 4px;}
#blog-post-bottom #blog_page_link ul li a::before{ width: 10px; height: 10px; display: block; content: ""; position: absolute; border-bottom: solid 3px #111; top: 50%; margin-top: -7px; transition: 0.4s;}
#blog-post-bottom #blog_page_link ul li:nth-child(1) a::before{ left: 8%; border-left: solid 3px #111; transform:rotate(45deg);}
#blog-post-bottom #blog_page_link ul li:nth-child(1) a:hover::before{ left:6%;}
#blog-post-bottom #blog_page_link ul li:nth-child(2) a::before{ display: none;}
#blog-post-bottom #blog_page_link ul li:nth-child(3) a::before{ right: 8%; border-right: solid 3px #111; transform:rotate(-45deg);}
#blog-post-bottom #blog_page_link ul li:nth-child(3) a:hover::before{ right:6%;}
@media screen and (max-width:800px) {
#blog-post-bottom #blog_page_link { margin: 0px 0 100px;}
#blog-post-bottom #blog_page_link ul li{width: 28%; margin: 0;}
#blog-post-bottom #blog_page_link ul li.list a span{ left: 8%;}
}
@media screen and (max-width:600px) {
#blog-post-bottom #blog_page_link ul li a span{ display: none;}
#blog-post-bottom #blog_page_link ul li a::before{ width: 8px; height: 8px; margin-top: -5px;}
#blog-post-bottom #blog_page_link ul li{width: 25%; margin: 0; }
#blog-post-bottom #blog_page_link ul li.list a{ padding-left: 8%;}
#blog-post-bottom #blog_page_link ul li.list a, 
#blog-post-bottom #blog_page_link ul li:nth-child(1) a::after, 
#blog-post-bottom #blog_page_link ul li:nth-child(3) a::after{ font-size: 13px;}
/*
#blog-post-bottom #blog_page_link ul li:nth-child(1) a::after{ content: "前へ";}
#blog-post-bottom #blog_page_link ul li:nth-child(3) a::after{ content: "次へ";}
*/
}
/*-------------------
カテゴリー一覧
----------------------*/
.blog_post_list{ width: 100%; border-bottom: solid 1px #ddd; margin-bottom: 100px;}
.blog_post_list h2, 
.blog_post_list h3, 
.blog_post_list h4{ position: relative;}
.blog_post_list h2, 
.blog_post_list h2 a{ font-size: 16px !important;}
.blog_post_list h2 a:hover{ opacity: 0.4; text-decoration: underline;}
.blog_post_list h2{ padding: 20px 10px !important; color: #000 !important; border: none!important; border-bottom: solid 1px #000 !important; border-top: solid 5px #000 !important; font-weight: bold !important; background: none !important; border-radius: 0 !important;} 
/**/
.blog_post_list ul{ margin: 10px 0;}
.blog_post_list ul li{ display: block;}
.blog_post_list ul li a{ display: flex; flex-direction: row; align-items: center; justify-content: flex-start; padding: 10px 5%; text-decoration: none;}
.blog_post_list ul li a .img{ width: 70px; height: 70px; background: #fff; border: solid 1px #ddd; display: block; position: relative; z-index: 1;}
.blog_post_list ul li a .img::before{ position: absolute; top: 30px; left: 0; text-align: center; width: 100%; height: 24px; font-size: 12px; content: "UMBER"; z-index: 5; line-height: 12px; letter-spacing: 0; color: #777; text-align: center; font-weight: 200;}
.blog_post_list ul li a .img img{ width: 70px; height: 70px; max-width: none; object-fit: cover; position: relative; z-index: 10;}
.blog_post_list ul li a p{ margin-left: 25px; font-size: 16px; font-weight: 500;}
.blog_post_list ul li a p span { font-size: 12px !important; color: #999; display: block; }
.blog_post_list ul li a p br{ display: none;}
.blog_post_list ul li a:hover p{ text-decoration: underline;}
.blog_post_list ul li a:hover p span{ text-decoration: none !important;}
@media screen and (max-width:700px) {
.blog_post_list{ margin-bottom: 0px;}
}