@charset "utf-8";
/* CSS Document */

.clearfix:after { display:block; clear:both; height:0px; visibility:hidden; content:"."; }

/*box-size box-radius */
.box { background: #fff; z-index: 0; }
.box-radius { border-radius: 6px; border: solid 2px #109954; padding: 3px 9px 4px 9px; }
.white .box-radius { border: solid 2px #fff; position: relative; top: -3px; }

/*btn*/
.btn { width: 200px; height: 46px; background-color: #109954; color: #fff; border-radius: 6px; position: relative; text-align: center; }
.btn:after { content: ""; width: calc(100% - 6px); height: 40%; position: absolute; bottom: 0; left: 3px; box-shadow: 0 0px 0px 3px #E8D0BC; z-index: -1; border-radius: inherit; }
.btn svg, .btn img, .btn-nav li:first-child, .btn-nav li a { display: inline-block; margin-top: 15px; }
@media screen and (min-width: 1101px){
.btn:hover, a:hover .btn { -webkit-transform: translateY(5px); -ms-transform: translateY(5px); transform: translateY(5px); }
.btn:hover:after, a:hover .btn:after, a.topiccategory:hover div:after, .wp-pagenavi a:hover:after { display: none; }/*ホバーで影消える*/
}
.btn-nav { /*width: 1000px;*/ height: 96px; background-color: #109954; color: #fff; border-radius: 8px; position: relative;  }
.btn-nav:after { content: ""; width: calc(100% - 20px); height: 10%; position: absolute; bottom: 0; left: 10px; box-shadow: 0 2px 0px 3px #E8D0BC; z-index: -1; border-radius: inherit; }
.btn-tel { width: 168px; }
.btn-mail { width: 46px; }
.btn-archive { width: 70px; height: 26px; position: absolute; right: 0; top: 3px; }
.btn-archive svg { margin-top: 5px; }
.btn.btn-form { width: 224px ; height: 36px; position: absolute; right: 25px; top: 16px; }
.btn.btn-form svg { margin-top: 10px; }
.btn-white { width: 100%; height: 46px; background-color: #fff; color: #109954; border-radius: 8px; text-align: center; }
.btn-white:hover { background-color: #F4CD21; }
.btn-white span { display: block; margin-top: 15px; }
.btn-white.btn-white-sp span { margin-top: 8px; }
.btn-brown { letter-spacing: 0; background-color: #C19574; color: #fff; border-radius: 6px; padding: 7px 26px; display: inline-block; font-weight: bold; }

@media screen and (max-width: 1600px){
	.btn-nav { height: 96px; background-color: #109954; color: #fff; border-radius: 6px; position: relative; }
}

/*arrow*/
.topiccategory-box { background-image: url("../img/svg_mapback.svg"); background-size: 6px 6px; background-position: center; }
.topiccategory-arrow { width: 20px; height: 20px; background-color: #C19574; border-radius: 10px; position: relative; text-align: center; float: left;  }
.topiccategory-arrow:after { content: ""; width: 80%; height: 90%; position: absolute; bottom: 0; left: 2px; box-shadow: 0 0 0 2px #E8D0BC; z-index: -1; border-radius: inherit; }
.topiccategory-arrow img { margin-top: 6px; }
.topiccategory-arrow span { margin-top: 2px; }
a.topiccategory { position: relative; z-index: 0; }
a.topiccategory:hover, .external-link:hover { -webkit-transform: translateY(3px); -ms-transform: translateY(3px); transform: translateY(3px); }
.topiccategory.arrow-green div { background-color: #109954; }
.topiccategory.arrow-green span { /*width: 100%;*/ line-height: 1.4em; }
.external-link { position: relative; z-index: 0; }
.external-link a { font-weight: bold; text-decoration: none; line-height: 1.4em; }
.external-link p { display: block; text-indent: 0; margin-left: 30px; }
.externalLink-img { width: 9px; height: 6px; background-color: #109954; border: 1px solid #fff; position: relative; top: 7px; right: -6px; float: left; }
.externalLink-img:after { content: ""; width: 9px; height: 6px; background-color: #109954; position: absolute; bottom: -3px; left: -3px; z-index: -1; }

/*線*/
.border-brown-t { border-top: 1px solid #E8D0BC; }
.border-brown-b { border-bottom: 1px solid #E8D0BC; }

/*ページ送り*/
.wp-pagenavi { text-align: center; }
.wp-pagenavi > * { width: 40px; font-family: 'Roboto Slab', serif; line-height: 40px; letter-spacing: .1em; font-weight: bold; background-color: #fff; color: #109954; border-radius: 6px; border: solid 2px #109954; margin: 0 25px 0 0; display: inline-block; position: relative; }
.wp-pagenavi span.current { background-color: #109954; color: #fff; }
.wp-pagenavi a:after { content: ""; width: calc(100% - 4px); height: 40%; position: absolute; bottom: 0; left: 2px; box-shadow: 0 0px 0px 4px #E8D0BC; z-index: -1; border-radius: inherit; }
.wp-pagenavi a:hover { background-color: #109954; color: #fff; -webkit-transform: translateY(4px); -ms-transform: translateY(4px); transform: translateY(4px); }
.wp-pagenavi > *:last-child { margin-right: 0; }

/*○○について*/
.category-icon { width: 106px; height: 86px; border-radius: 6px; border: solid 2px #109954; position: absolute; left: -160px; box-sizing:border-box; margin: 0 auto; }

/*ホバーで背景色変化*/
a.hover-green:hover { background-color: #f2fff8; }

@media screen and (max-width: 1100px){
	/*btn*/
	.btn-map { width: calc(100% - 10px); }
	.btn-brown { border-radius: 6px; padding: 6px 16px; }	
	a.topiccategory { margin-right: 20px; float: left; }
	.category-icon { top: 0; left: 0; position:relative; float:left; }
}
@media screen and (max-width: 830px){
	.btn.btn-form { width: 100%; position: relative; right: 0; float: none; margin-bottom: 20px; }
	/*.external-link p { margin-left: 30px; }*/
}
@media screen and (max-width: 600px){
	.topiccategory-box { margin-top: 10px; }
	/*btn*/
	.btn { width: 134px; height: 40px; }
	.btn-map { width: 100%; }
	.btn-mail { width: 40px; }
	.btn-archive { width: 50px; height: 35px; top: -6px; }
	.btn-archive svg { margin-top: 9px; }

	/*○○について*/
	.category-icon { width: 86px; height: 70px; text-align:center;}
	.category-icon svg:nth-child(2) { margin-top: 5px; height:10px; width:auto; }
}