@charset "UTF-8";

.bg_line{text-align: center; padding-bottom: 15px; margin-bottom: 20px;}
.bg_line span{display:block; font-size:18px; font-weight: bold;}
.bg_line img{height: 16px;}
.blog-style #main-cont{position:relative; background:#FFF;}
.blog-top .post-roll{padding:20px 0;}
.single-post .post-roll{background:#FFF;}
.breadcrumbs p{margin:15px 0; font-size:14px;}

#blog-content{padding:0 8% 30px;}
#blog-content.single-post{background:#FFF;}
.blog-top-list{
display: flex;
	flex-wrap: wrap;
}
.blog-top-post{margin:15px 2% 20px; display:inline-block; vertical-align: top; width:44%;}
.blog-top-post .tit{font-size:16px; padding:0; font-weight:bold; text-align:left;}
.blog-top-post .tit a{color: #fd7e01;}
.blog-top-post p.time{font-size:12px; margin: 10px 0 0px;}
.blog-top-post .photo{text-align:center; position:relative;width: 100%;height: 120px;margin-bottom: 10px;}
.blog-top-post .photo .office a{
	position: absolute;
	background: #87ce47;
	font-size: 12px;
	padding: 4px 12px;
	left: 0;
	top: 0;
	border-radius: 0 0 10px 0;
	color: #fff;
}

.blog-top-post .photo img{width: 100%;height: 100%;object-fit: cover; border-radius:8px; background:#FFF;}
.blog-top-post .cat a{
	display:block;
	padding:5px 10px;
	text-align:center;
	color:#FFF;
	font-weight:bold;
	font-size:12px;
	background:#fdad01;
	border-radius:4px;
}
.blog-top-post .cat.schedule a{background:#fdd101;}
.blog-top-post2{margin:15px 2% 20px; display:inline-block; vertical-align: top; width:44%;}
.blog-top-post2 .tit{font-size:16px; padding:0; font-weight:bold; text-align:left;}
.blog-top-post2 .tit a{color: #fd7e01;}
.blog-top-post2 p.time{font-size:12px; margin: 10px 0 0px;}
.blog-top-post2 .photo{text-align:center; position:relative;}
.blog-top-post2 .photo img{width:100%; border-radius:8px; background:#FFF;}
.blog-top-post2 .cat a{
	display:block;
	padding:5px 10px;
	text-align:center;
	color:#FFF;
	font-weight:bold;
	font-size:12px;
	background:#fdad01;
	border-radius:4px;
}
.blog-top-post2 .cat.schedule a{background:#fdd101;}
.post-roll #article-list .more ,#next{margin:20px auto; text-align:center; clear:both;}
.blog-list li{border-top:1px solid #ddd; overflow:hidden;}
.blog-list a{display:table; width:100%; padding:15px 20px 5px;}
.blog-list a span{display:table-cell; vertical-align:middle; font-weight:bold;}
.blog-list a .thumb{width:70px; padding-right:10px;}
.blog-list a:hover img{opacity:0.7;}
.blog-list2 li{border-top:1px solid #ddd; overflow:hidden;}
.blog-list2 a{display:table; width:100%; padding:15px 20px 5px;}
.blog-list2 a span{display:table-cell; vertical-align:middle; font-weight:bold;}
.blog-list2 a .thumb{width:70px; padding-right:10px;}
.blog-list2 a:hover img{opacity:0.7;}
.post-title{font-size:18px;}
.post-header{ position:relative; padding:15px 0; width:100%; overflow:hidden;}
.post-header .post-time{float:right;width: 30%;text-align:right;font-size:14px;}
.post-header .tit-blog-post{float:left;width: 70%;}
.post-header .tit-blog-post h2{font-size:20px; margin:20px 0 10px;}
.social-button{text-align: right;}
.social-button li{
	display:inline-block; vertical-align:middle; line-height:10px;
}
.post-header .tit-blog-post .tit-cat,.post-header .tit-blog-post .tit-office {
    display: inline-block;
}
.tit-cat{
	color:#FFF; background: #fdad01;
	font-weight:bold; margin-bottom:20px;
	border-radius: 4px; padding: 2px 15px;
	display: inline-block; font-size: 12px;
}
.tit-office{
	color:#FFF; background: #87ce47;
	font-weight:bold; margin-bottom:20px;
	border-radius: 4px; padding: 2px 15px;
	display: inline-block; font-size: 12px;
}

.post h3{
	background:#87ce47; font-size:22px; padding:10px 20px;
	border-radius:8px; margin:20px 0 60px; color: #FFF;
}
.post h4{font-size:20px; margin:20px 0 40px; color:#87ce47;}
.post h5{font-size:18px; margin:20px 0 40px; color: #000;}
.post{margin:20px 0 60px;}
.post p{font-size:16px; line-height:34px;}
.post li{position:relative; padding:0px 0 0 30px; margin-bottom:10px;}
.post li:before{color:#68b82d; content:"●"; position:absolute; top:0; left:0;}
.post a{color:#d14865; text-decoration:underline;}
.post a:hover{text-decoration:none;}
.breadcrumbs{padding-bottom: 0;}
.single-foot h2{text-align:center; font-size:16px; margin-bottom:20px;}
#article-list .more ,#next{text-align:center;  clear:both;}
#article-list .more .btn-link ,#next .btn-link{width:280px; margin:0 auto; font-weight: bold;}
#article-list .more span ,#next span{
	background:#FFF; border:2px dotted #fd7e01;
	border-radius: 24px; display:block; text-align: center;
	padding: 10px 0; font-size: 12px; color: #fd7e01;
	cursor: pointer;
}
#article-list .more span:hover,
#next span:hover{background: #fd7e01; color: #FFF;}
#next a:hover{text-decoration: none;}
.post-footer .tit-post-foot {
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    margin-top: 40px;
}


@media (min-width: 768px) {
.bg_line{text-align: center; padding-bottom: 20px; margin-bottom: 40px;}
.bg_line span{display:block; font-size:34px;}
.bg_line img{height: auto;}
.blog-style #main-cont{margin-bottom:0; padding-bottom:20px; }
.blog-top-list .blog-top-post:nth-child(3n){margin-left:0;}
.blog-top-post{display:inline-block; width:46%; vertical-align:top; margin:0 1.5% 20px;}
.blog-top-post .tit{padding:0; font-size:18px;}
.blog-top-post .txt{padding:10px 20px 0; font-size:14px;}
.blog-top-post ul{padding:25px 20px 20px;}
.blog-top-post .photo{text-align:center; position:relative;width: 100%;height: 210px;margin-bottom: 10px;}
.blog-top-post .photo img{width: 100%;height: 100%;object-fit: cover;border-radius:8px;background: #FFF;}
.blog-top-post .cat a{margin-bottom: 10px;}
.blog-top-post a:hover img{opacity:0.7;}
.blog-top-post a:hover{text-decoration:underline;}
.blog-top-list2 .blog-top-post:nth-child(3n){margin-left:0;}
.blog-top-post2{display:inline-block; width:46%; vertical-align:top; margin:0 1.5% 20px;}
.blog-top-post2 .tit{padding:0; font-size:18px;}
.blog-top-post2 .txt{padding:10px 20px 0; font-size:14px;}
.blog-top-post2 ul{padding:25px 20px 20px;}
.blog-top-post2 .cat a{margin-bottom: 10px;}
.blog-top-post2 a:hover img{opacity:0.7;}
.blog-top-post2 a:hover{text-decoration:underline;}

.tit-cat{font-size:14px; margin-bottom:50px;}
.tit-office{font-size:14px; margin-bottom:50px;}
.post-title{font-size:26px; margin:20px 0;}

.post-header{margin:30px 0px 20px; padding:30px 0 0; position:relative; overflow:hidden;}

.post-header .tit-blog-post h2{font-size:32px;}
.post-header .social-button li{display:inline-block; vertical-align:middle; line-height:10px;}
.social-button{text-align: right;}
.post-roll{margin:15px;}
.post{margin:0px 40px;}
.post h3{margin:80px 0 60px; font-size:24px;}
.post p{font-size:16px; margin-bottom:20px;}
.post ul{margin-bottom:20px;}
.post li{position:relative; padding:0px 0 0 30px; margin-bottom:10px;}
.post a{color:#d14865; text-decoration:underline;}
.post a:hover{text-decoration:none;}

.post-roll .post-block{margin:0px 40px;}
.pc-blog-list li{border-top:1px solid #e5e5e5;}
.blog-top-post{text-align:left;}
.blog-style .blog-list{margin:0　0 20px;}
.pc-blog-list2 li{border-top:1px solid #e5e5e5;}
.blog-top-post2{text-align:left;}
.blog-style .blog-list2{margin:0　0 20px;}


.tit-list{font-size:16px; line-height:18px;  padding:0px 20px 10px; margin-bottom:10px; font-weight:bold;}
.post-thumb{width:180px;}
.post-txt-data{width:480px;}
.tit-blog-post dd h3{font-size:26px; line-height:36px;}
.tit-blog-post dd h3 a{text-decoration:none;}
.tit-blog-post2 dd h3{font-size:26px; line-height:36px;}
.tit-blog-post2 dd h3 a{text-decoration:none;}
.post-block{padding:15px 0px;}
.blog-list a:hover{text-decoration:underline;}
.blog-list2 a:hover{text-decoration:underline;}
#blog-content .breadcrumbs{position:absolute; top:10px;}
.single-foot{padding:60px 8%;}
.single-foot h2{margin-bottom:30px;}
.post-footer{margin-top: 100px;}
.post-footer .tit-post-foot {
    font-size: 24px;
    font-weight: bold;
 }

}


@media (min-width: 940px) {

.single-post .post-roll{width:800px; margin:40px auto;}

.blog-top{width:100%;}
.blog-top .post-roll{margin:0; padding:60px 0;}

.breadcrumbs{width:1000px; margin:0 auto 20px;}

.blog-style #main-cont{padding-bottom:40px;}
.page-title .pc-inner{width:1000px; margin:0 auto;}
.post-header{padding:0;}
.post{margin:0;}
.post img{max-width:800px;}

.height-set{margin-top:0;}

.single-foot{padding:60px 0 ;}
.single-foot h2{font-size:26px; margin-bottom:50px;}
.single-foot h2 span{background-size:auto;}
.blog-top-list {text-align:left; width:1000px; margin:20px auto;}
.blog-top-list li ,.blog-top-list li:nth-child(2n){width:310px; margin:0 30px 30px 0 !important;}
.blog-top-list li:nth-child(3n){margin-right:0 !important;}
.blog-top-list .thumb{width: 310px; height: 240px;}
.blog-top-list2 {text-align:left; width:1000px; margin:20px auto;}
.blog-top-list2 li ,.blog-top-list2 li:nth-child(2n){width:310px; margin:0 30px 30px 0 !important;}
.blog-top-list2 li:nth-child(3n){margin-right:0 !important;}
.blog-top-list2 .thumb{width: 310px; height: 240px;}
#article-list .more ,#next{width: 20%; margin: 0 auto; display: block;}
#article-list .more span ,#next span{font-size: 18px;}
}

@media (max-width: 768px) {
#article-list{overflow: hidden;}
.single-mode li{float: left; width: 46%;}
.single-foot{width: 88%; margin: 0 auto;}
}



.article-categories{margin: 80px auto;padding: 50px 60px;background: #fbf6e1;width: 70%;max-width: 934px;border-radius: 30px;box-sizing: border-box;}
.article-categories .office{display: flex;}
.article-categories .office ul{display: flex; flex-wrap: wrap; margin: 3px 0 0; width: calc(100% - 160px);}
.article-categories .office__title{color: #000; font-size: 22px; font-weight: bold; width: 140px; text-align: right;margin-right: 20px;}
.article-categories .blog-nipori a{display: block;color: #6fb92e;border: 1px solid #6fb92e;padding: 2px 10px;margin: 0 10px 10px 0;border-radius: 4px;font-size: 14px;font-weight: bold;background: #fff;}
.article-categories .blog-nipori a:hover{background: #6fb92e; color: #fff; text-decoration: none;}
.article-categories .blog-oji a{display: block;color: #08a04f;border: 1px solid #08a04f;padding: 2px 10px;margin: 0 10px 10px 0;border-radius: 4px;font-size: 14px;font-weight: bold;background: #fff;}
.article-categories .blog-oji a:hover{background: #08a04f; color: #fff; text-decoration: none;}
.article-categories .categories{display: flex;}
.article-categories .categories__title{color: #000; font-size: 22px; font-weight: bold; width: 140px; text-align: right; margin-right: 20px; margin-top: 6px;}
.article-categories .categories ul{display: flex; flex-wrap: wrap; margin: 10px 0 0; width: calc(100% - 160px);}
.article-categories .categories ul li a{border: 1px solid #fdad01;background: #fdad01;margin: 0 10px 10px 0;padding: 2px 30px;border-radius: 4px;font-size: 14px;font-weight: bold;color: #fff;display: block;transition: all .3s;}
.article-categories .categories ul li a:hover{background: #fff; color: #fdad01; text-decoration: none;}
.article-categories .office ul li a {
    color: #fff;
    border: 1px solid #87ce47;
    background: #87ce47;
    margin: 0 10px 10px 0;
    padding: 2px 30px;
    border-radius: 4px;
    font-size: 14px;
    font-weight: bold;
    color: #fff;
    display: block;
    transition: all .3s;
}
.article-categories .office ul li a:hover{
    background: #fff;
    color: #87ce47;
    text-decoration: none;
}


	@media (max-width: 768px) {
		.article-categories{background: none; padding: 0; width: 100%; margin: 60px auto;}
		.article-categories .office{flex-direction: column; width: 100%; background: #f8f6f3; margin-bottom: 16px; padding: 15px 5px; border-radius: 15px;}
		.article-categories .office__title{width: 100%; text-align: center; font-size: 16px; margin-bottom: 10px;}
		.article-categories .office__title span{display: none;}
		.article-categories .office ul{width: 100%; justify-content: center;}
		.article-categories .categories{flex-direction: column; width: 100%; background: #f8f6f3; padding: 15px 5px; border-radius: 15px;}
		.article-categories .categories__title{width: 100%; text-align: center; font-size: 16px; margin-bottom: 10px;}
		.article-categories .categories__title span{display: none;}
		.article-categories .categories ul{width: 100%; justify-content: space-between; margin: 0;}
		.article-categories .categories ul li{min-width: 46%; margin: 0 2%;}
		.article-categories .categories ul li a{margin: 5px auto;text-align: center;padding: 2px;}
	}