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

/* ************************************************************* */
/*          COMMON Rayout 
/* ************************************************************* */

body {
	margin: 0;
	padding: 0;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
	color: #004831;
	font-size: 95%;
	line-height: 1.7em;
	letter-spacing: 0.05em;
	text-align: justify;
	background-color: #FFF;
	animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
	background-color: rgba(0,72,49,1.00)
}

h1,h2,h3,h4,h5 { font-weight: 700; }

ul,li { list-style: none; }

img { max-width: 100%; }

a:hover { cursor: pointer; }


@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

a { text-decoration: none; }
a:hover { cursor: pointer;}


/* ************************************************************* */
/*          HEADER  RAYOUT
/* ************************************************************* */

.head {
	width: 100%;
	height: 100px;
	margin: 0;
	padding: 0;
	top: 0;
	display: block;
	position: fixed;
	background-color: #FFF;
	z-index: 9999;
}

.head .h_logo {
    top: 22px;
    left: 25px;
    display: block;
    position: fixed;
    width: 235px;
    margin: 0;
    z-index: 999999;
}

.head .h_logo img {
	width: 100%;
}

/*.head .h_logo a {
	width: 100%;
	padding: 0;
	margin: 0;
	display: block;
	text-align: center;
	font-size: 20px;
	font-weight: 700;
	color: #FFF;
	background-color: #D6D6D6;
	line-height: 40px;
}*/

.head .nav_btn {
	width: 240px;
	height: 100px;
	margin: 0;
	padding: 0;
	float: right;
}

.head .nav_btn .btn {
	width: 120px;
	height: 100px;
	margin: 0;
	padding: 0;
	float: left;
}


.head .nav_btn .btn a {
	width: 100%;
	height: 45px;
	margin: 0;
	padding: 55px 0 0;
	display: block;
	text-align: center;
	line-height: 1.2em;
	color: #FFF;
	background-color: #004831;
	background-image: url("../images/common/ico_mail.png");
	background-repeat: no-repeat;
	background-position: center top 30px;
	transition: ease 0.5s all;
	font-size: 14px;
}


.head .nav_btn .btn a:hover { opacity: 0.7; }

/*.head .nav_btn .btn.recruit a {
	background-color: #A7D821;
	color: #004831;
	background-image: url("../images/common/Ico_recruit.png");
}*/

.head .nav_btn.recruit_info .btn.recruit a {
	background-color: #008B5F;
	color: #FFF;
	background-image: url("../images/recruit/ico_recruit.svg");
	background-position: center top 28px;
}

.head .nav_btn.recruit_info .btn a span {
	font-size: 11px;
	letter-spacing: 0;
}

.head .bar_block {
	display: block;
	margin: 18px 20px 0 0;
	padding: 0;
	float: right;
}

.head .bar_block .btn {
	width: 25px;
	margin: 0 0 0 20px;
	padding: 0;
	float: left;
}

.head .bar_block .btn a {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	line-height: 40px;
	border-radius: 5px;
	font-size: 90%;
	transition: ease 0.5s all;
}

.head .bar_block .btn a:hover {
	opacity: 0.7;
}

nav.NavMenu{
	z-index: 2;
}



/* ************************************************************* */
/*          CONTENT  RAYOUT
/* ************************************************************* */
.content {
	width: 100%;
	min-height: 60vh;
	margin: 100px 0 0;
	padding: 0 0 100px;
	float: left;
	background-color: #FFF;
	z-index: 999;
}

.content .wrapper {
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
	padding: 0;
}

.content .inner {
	width: 100%;
	max-width: 1024px;
	margin: 0 auto;
	padding: 100px 0;
}

.foot .inner {
	width: 100%;
	max-width: 1024px;
	margin: 0 auto;
	padding: 0;
}

/* **** PANKUZU LIST **** */

.panlist {
	width: 100%;
	margin: 0;
	padding: 0;
	float: left;
	background-color: #E2EFBC;
}

.panlist .inner {
	margin-top: 0;
	margin-bottom: 0;
	padding-top: 0;
	padding-bottom: 0;
}

.content .pan_list {
	width: 100%;
	margin: 0;
	padding: 0;
	float: left;
}

.content .pan_list ol {
	width: 100%;
	margin: 0;
	padding: 0;
	float: left;
}

.content .pan_list ol li {
	width: auto;
	margin: 0 0.5em 0 0;
	padding: 0;
	float: left;
	line-height: 45px;
	list-style: none;
}

.content .pan_list ol li a::after {
	content: " >";
}

.content .pan_list ol li a {
	font-weight: 700;
	color: #004831;
}

/* **** BUTTOM  **** */

.content .btn_box {
	width: 100%;
	margin: 50px 0;
	float: left;
	display: flex;
	text-align: center;
}


.content .btn.more a {
	width: 240px;
	line-height: 50px;
	color: #004831;
	transition: ease 0.5s all;
	text-align: center;
	display: block;
	margin: 0;
	background-image: url("../images/common/arr_right01.png");
	background-repeat: no-repeat;
	background-position: center right 20px;
	background-color: #FFF;
	background-size: 12px;
	border-radius: 6px;
}

/* **** PAGE TITLE  **** */

.content .p_title {
	width: 100%;
	margin: 0;
	padding: 0;
	display: flex;
}

.content .p_title dl {
	width: 90%;
	margin: 0 auto;
}

.content .p_title dt,
.content .p_title dd {
	width: 100%;
	text-align: center;
	margin: 0;
	padding: 0;
}

.content .p_title dt img {
	width: 72px;
	margin: 0 auto;
}

.content .p_title dd {
	font-family: "Lato", sans-serif;
	font-size: 56px;
	color: #008B5F;
	font-weight: 400;
	margin: 20px 0 0;
	line-height: 1.0em;
}

.content .p_title dd::first-letter {
	color: #A7D821;
}

.content .p_title h1 {
	font-size: 18px;
	text-align: center;
	margin: 0 0 50px;
}


/* ************************************************************* */
/*          FOOTER  RAYOUT
/* ************************************************************* */

.foot {
	width: 100%;
	margin: 0;
	padding: 0;
	float: left;
	background-color: #A7D822;
	color: #FFF;
}

.foot .head {
	width: 100%;
	height: 13vw;
	margin: -1px 0 0;
	padding: 0;
	float: left;
	top: 0;
	position: relative;
	display: block;
	background-color: #FFF;
	clip-path: polygon( 50% 6.5vw, 0 0,100% 0,50% 6.5vw);
	z-index: 0;
}

.foot .foot_bg {
	width: 100%;
	margin: -13vw 0 0;
	padding: 200px 0 0;
	float: left;
	background-color: #004831;
	clip-path: polygon(0 0, 100% 13vw, 100% 100%,0 100%);
}

.foot .wrapper {
	width: 100%;
	margin: 10px 0 0;
	padding: 0;
	float: left;
}

.foot .f_logo {
	width: 235px;
	margin: 40px 0 0;
	padding: 0;
	float: left;
}

.foot dl {
	width: 100%;
	margin: 0 0 20px;
	padding: 0;
	float: left;
}

.foot dl dt {
	width: 100%;
	margin: 0;
	padding: 0;
	float: left;
}

.foot dl dd {
	width: 100%;
	margin: 0;
	padding: 0;
	float: left;
	line-height: 25px;
}

.foot ul.foot_nav {
	width: 100%;
	margin: 0;
	padding: 50px 0 0;
	float: left;
}

.foot ul.foot_nav li {
	margin: 0 2.2em 0 0;
	float: left;
}

.foot ul.foot_nav li a {
	color: #FFF;
	letter-spacing: 2px;
	display: inline-block;
	position: relative;
	overflow: hidden;
	text-decoration: none;
}

.foot ul.foot_nav li a:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #fff;
  transform: translate(-100%, 0);
  transition: transform cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s;
  content: "";
}

.foot ul.foot_nav li a:hover:after {
  transform: translate(0, 0);
}

.foot .bar_area {
	width: 100%;
	margin: 50px 0 0;
	padding: 0;
	float: left;
}

.foot .bar_area .button {
	width: 240px;
	margin: 0 32px 0 0;
	padding: 0;
	float: left;
	border-radius: 6px;
	/*background-position: 100% 0;
	background-size: 200% auto;
	background-image: linear-gradient(
	to right,
    #004831 0%,
    #004831 50%,
    #FFF 50%,
    #FFF 100%
	);
	transition: background-position ease 0.4s;*/
}

.foot .bar_area .button a {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	display: block;
	color: #004831;
	background-color: #D6D6D6;
	border: #D6D6D6 1px solid;
	line-height: 48px;
	text-align: center;
	background-image: url("../images/common/arr_right02.png");
	background-repeat: no-repeat;
	background-position:center right 20px;
	background-size: 12px;
	transition: ease 0.5s all;
	border-radius: 6px;
}

.foot .bar_area .button a:hover {
	color: #FFF;
	background-color: #004831;
	background-image: url("../images/common/arr_right01.png");
}

.foot .bar_area .button.recruit a {
	background-color: #A7D821;
	border: #A7D821 1px solid;
}

.foot .bar_area .button.recruit a:hover {
	background-color: #004831;
	border: #D6D6D6 1px solid;
}


.foot .sns_area {
	width: 100%;
	margin: 0 0 50px;
	float: left;
}

.foot .sns_area ul {
	float: right;
}

.foot .sns_area ul li {
	width: 30px;
	margin: 0 0 0 20px;
	float: left;
}

.foot .sns_area ul li a {
	opacity: 1;
	transition: ease 0.5s all;
}

.foot .sns_area ul li a:hover {
	opacity: 0.7;
}


.foot .copy {
	width: 100%;
	margin: 0;
	padding: 0;
	float: left;
	line-height: 50px;
	font-size: 14px;
	color: #FFF;
	text-align: center;
}

/****************************************************
/*               page-top
*****************************************************/
.pagetop {
	position: fixed;
	bottom: 70px;
	right: 25px;
	z-index: 99999;
	display: block;
}

.pagetop a { 
	display: block;
	width: 50px;
	height: 35px;
	padding: 15px 0 0;
	transition:all .3s ease;
	text-align: center;
	opacity: 1;
	background-color: #A7D821;
	color: #FFF;
	font-family: "Barlow Condensed", sans-serif;
	font-size: 18px;
	background-image: url("../images/common/arr_top_w.svg");
	background-repeat: no-repeat;
	background-position: center top 10px;
	background-size: 10.2px;
}

.pagetop a:hover { 
	border-radius: 25px;
}

/* ***********  PAGE NAVI  LAYOUT  ************** */

.pagenav {
	width: 100%;
	margin: 50px 0;
	padding: 0;
	text-align: center;
	display: flex;
}

.pagenav .wp-pagenavi {
	width: auto;
	margin: 0 auto;
	display: inline-block;
}

.pagenav span {
	width: 40px;
	height: 40px;
	text-align: center;
	line-height: 40px;
	float: left;
	margin: 0 10px 0 0 0;
}

.pagenav a {
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-decoration: none;
	color: #004831;
	text-align: center;
	display: block;
	float: left;
	font-size: 20px;
	font-family: "Barlow Condensed", sans-serif;
	border: none;
}

.pagenav a.page::before {
	content: "0";
}

.pagenav a.first,
.pagenav a.last { width: 4em; }

.pagenav a:hover { opacity: 0.7; }
.pagenav.column a {	background-color: #FFF;box-sizing: border-box; }
.pagenav .wp-pagenavi { width: auto;margin: 0 auto;text-align: center; }
.pagenav .wp-pagenavi .pages { border: none;font-style: italic;display: none; }
.pagenav .wp-pagenavi .pages:before { content: "Page - "; }
.pagenav .wp-pagenavi .current { 
	background-color: #004831;
	color: #FFF;
	font-weight: 700;
	margin: 0 10px 0 0 0;
	border-radius: 6px;
	font-size: 20px;
	font-family: "Barlow Condensed", sans-serif;
}
.pagenav .wp-pagenavi .current::before { 
	content: "0";
}
.pagenav .wp-pagenavi a.nextpostslink,
.pagenav .wp-pagenavi a.previouspostslink { 
	color: #C4D700;
	width: auto;
}


/* ************************************************************************************
          Responsive Layout Whideth 1300px
*************************************************************************************** */
@media only screen and (max-width: 1300px) {

.head .nav_btn {
	width: 300px;
	height: 50px;
}

.head .nav_btn .btn {
	width: 140px;
	height: 50px;
	margin: 5px 10px 0 0;
}

.head .nav_btn .btn a {
	width: 105px;
	height: 25px;
	padding: 5px 10px 15px 30px;
	text-align: left;
	background-position: center left 5px;
	border-radius: 5px;
}

.head .nav_btn.recruit_info .btn.recruit a {
	width: 105px;
	height: 25px;
	padding: 5px 10px 15px 30px;
	background-position: center left 5px;
}

.head .nav_btn .btn a:hover {
	border-radius: 0;
	opacity: 0.7;
}

.foot .inner { width: 90%; }
.foot ul.foot_nav li {	margin: 15px 1em 15px 0;float: left; }
.foot ul.foot_nav li a { display: block;width: 100%; }

}

@media only screen and (max-width: 1000px) {

.content .p_title {	margin: 0;padding: 50px 0 0; }

.head .bar_block,
.head .nav_btn  { display: none; }

.content .inner {
	width: 90%;
	margin: 0;
	padding: 0 5%;
}

}

.pc-block{
	display:block;
}

@media only screen and (max-width: 680px) {

	.pc-block{
	display:none;
}

.pagetop {
	bottom: 45px;
}

.foot {
	height: auto;
	padding: 0;
}

.foot ul.foot_nav li {
	width: 100%;
	margin: 5px 0 0;
	border-bottom: #FFF 1px solid;
}

.foot .bar_area {
	margin: 50px 0;
}

.foot .bar_area .button {
	width: 100%;
	margin: 0 0 20px;
}

}


@media only screen and (max-width: 580px) {

.head .h_logo {	        width: 205px;
        height: auto;
        left: 20px; }

.content .p_title dd { font-size: 11vw; }
.content .p_title h1 { font-size: 16px; }

}
