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

	PC
	
-----------------------------------------------------------------*/


/* module
-------------------------------------------------------*/
.sp {
display: none;
}
.in {
width:1000px;
max-width:1000px;
margin:0 auto;
}
.area {
padding: 70px 0;
}
img {
width: 100%;
}
#wrapper {
overflow: hidden;
}
h3 {
border:1px solid #80ac1b;
background: linear-gradient(rgba(148,200,33,1) 40%, rgba(128,172,27,1) 100%);
color:#fff;
font-weight: bold;
font-size: 150%;
line-height: 1.2;
padding:20px;
box-sizing:border-box;
box-shadow:inset 0 1px 5px rgba(255,255,255,.7);
margin-bottom:35px;
	border-radius: 5px;
}
h3 > * {
display: inline-block;
}

.banner h3 {
	border-radius: 0px;
}



/* header
-------------------------------------------------------*/
#header {
padding: 10px 20px 20px;
box-sizing: border-box;
}
#header .in {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content:space-between;
}
#header h1 {
font-size: 75%;
line-height: 1.2;
margin-bottom:10px;
}
#header .logo img {
max-width:444px;
}
#header ul {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content:flex-end;
}
#header ul li {
padding-left:30px;
}
#header ul li:first-child img {
max-width:234px;
}
#header ul li:last-child img {
max-width:230px;
}


/* nav
-------------------------------------------------------*/
#nav {
background: #8FC014;
}
#nav ul {
display: flex;
flex-flow: row nowrap;
align-items: stretch;
justify-content: space-between;
}
#nav ul li {
border-right: 1px solid #fff;
/*width: 14.1%;*/
width: 16.6%;
}
#nav ul li:first-child {
border-left:1px solid #fff;
}
#nav ul li a {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: center;
text-align: center;
height: 100%;
line-height: 1;
padding:10px 0;
box-sizing: border-box;
}
#nav ul li a img {
max-width: 97px;
}

/* breadcrumb
-------------------------------------------------------*/
#breadcrumb {
background:#EEEEEE;
}
#breadcrumb ul {
display: flex;
flex-flow: row wrap;
align-items: flex-start;
justify-content: flex-start;
font-size: 85%;
line-height: 1.3;
padding:11px 0;
}
#breadcrumb ul li:not(:last-child)::after {
content:">";
display: inline-block;
padding:0 10px;
}


/* visual
-------------------------------------------------------*/
#index #visual .visual-in {
background:url(../img/index/visual_bg2.png)no-repeat center center/cover;
padding:70px 0 0;
}
#index #visual .visual-in .in {
width: 1065px;
max-width: 1065px;
}
#index #visual .box {
background:url(../img/index/bg01.png);
padding:20px 0;
}
#index #visual .box .in {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: flex-start;
}
#index #visual .box .in .txt-box {
margin-right: 50px;
}
#index #visual .box .in .txt-box .ttl {
margin-bottom:25px;
}
#index #visual .box .in .txt-box .ttl>b::before {
content: "";
display: inline-block;
background:url(../img/index/top_icon.png)no-repeat left center/74px 57px;
width: 74px;
height: 57px;
position: relative;
bottom:-20px;
padding-right:10px;
}
#index #visual .box .in .txt-box .ttl img {
max-width:410px;
}
#index #visual .box .in .txt-box ul li {
font-size: 140%;
line-height: 1.3;
margin-bottom:20px;
}
#index #visual .box .in .txt-box ul li .bg-yellow {
background:#FFFF00;
}
#index #visual .box .in .txt-box ul li::before {
content:"";
display: inline-block;
background:url(../img/index/top_check.png)no-repeat left center/36px 33px;
width: 36px;
height: 33px;
vertical-align: middle;
padding-right: 10px;
}
#other #visual .visual-in {
padding:70px 0;
}
#other #visual .visual-in .in {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: center;
font-size: 270%;
line-height: 1.2;
color: #fff;
font-weight: bold;
}


/* banner
-------------------------------------------------------*/
.banner h3 {
margin-bottom:0;
}
.banner h3 img {
max-width:790px;
}
.banner .border-box {
border:2px solid #7fac22;
padding:20px 10px 10px;
box-sizing: border-box;
position: relative;
}
.banner .txt img {
max-width:597px;
margin-left: 10px;
margin-bottom:10px;
}
.banner ul {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: flex-start;
background: url(../img/common/banner_bg.png);
padding:25px;
box-sizing: border-box;
}
.banner ul li {
margin-right: 50px;
position: relative;
z-index: 3;
}
.banner ul li:first-child img {
max-width:430px;
}
.banner ul li:last-child img {
max-width:423px;
}
.banner .img {
position: absolute;
right: -2px;
bottom:0;
z-index: 2;
}


/* footer
-------------------------------------------------------*/
#footer {
text-align: center;
padding:50px 0 0;
}
#footer .footer-nav {
background:#94C821;
}
#footer .footer-nav ul{
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: center;
padding:25px 0;
}
#footer .footer-nav ul li {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: flex-start;
}
#footer .footer-nav ul li:not(:last-child)::after {
content:"|";
padding:0 10px;
display: inline-block;
color:#fff;
}
#footer .footer-nav a {
color:#fff;
}
#footer .logo {
border-bottom:1px solid #dcdcdc;
margin-bottom:20px;
}
#footer .logo img {
max-width:345px;
margin-bottom:15px;
}
#footer .in {
padding:40px 0 50px;
}
#footer .box {
display: flex;
flex-flow: row nowrap;
align-items: flex-start;
justify-content: space-between;
}
#footer .box .txt-box .txt:first-child {
margin-bottom:20px;
}
#footer .box .txt-box .txt > * {
display: block;
text-align: left;
font-size: 80%;
line-height: 1.4;
}
#footer .box ul {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: space-between;
}
#footer .box ul li:first-child img {
max-width: 234px;
}
#footer .box ul li:last-child img {
max-width: 230px;
margin-left: 30px;
}
#footer .copy {
font-size: 75%;
background:#eeeeee;
padding:20px 0;
}


/* index
-------------------------------------------------------*/
#index #area01 {
padding-bottom:100px;
}
#index #area01 ul {
display: flex;
flex-flow: row nowrap;
align-items: stretch;
justify-content: space-between;
}
#index #area01 ul li {
width:300px;
box-shadow: 3px 3px 7px rgba(0,0,0,0.1);
border-radius: 10px;
background:#fff;
padding:20px;
box-sizing: border-box;
border:1px dashed #e5e5e5;
}
#index #area01 ul li .num img {
max-width: 60px;
}
#index #area01 ul li .icon img {
max-width:106px;
}
#index #area01 ul li .img {
margin-bottom:20px;
}
#index #area01 ul li .img>span {
height: 111px;
position: relative;
display: flex;
align-items: flex-end;
justify-content: center;
}
#index #area01 ul li .num {
position: absolute;
top:0;
left:0;
}
#index #area01 ul li .txt > * {
display: block;
}
#index #area01 ul li .txt b {
margin-bottom:10px;
line-height: 1.2;
font-size: 120%;
}
#index #area01 ul li .txt span {
line-height: 1.4;
}
#index #area02 {
background:url(../img/index/bg02.png)no-repeat center center/cover;
}
#index #area02 ul {
display: flex;
flex-flow: row nowrap;
align-items: flex-start;
justify-content: space-between;
margin-bottom:70px;
}

#index #area02 .btn-orange {
	text-align: center;
}
#index #area02 .btn-orange img {
/*max-width: 125px;*/
max-width: 318px;
	margin: 0 auto;
}
#index #area03 ul {
display: flex;
flex-flow: row nowrap;
align-items: flex-start;
justify-content: space-between;
}
#index #area03 ul li {
width: 300px;
}
#index #area03 ul li .img {
text-align: center;
}
#index #area03 ul li img {
max-width:180px;
margin-bottom:15px;
}
#index #area03 ul li .txt {
font-size: 90%;
}


/* other
-------------------------------------------------------*/


/* example
-------------------------------------------------------*/
#example #visual .visual-in {
background: url(../img/example/visual_bg.png)no-repeat center center/cover;
}
#example #area01 ul li {
display: flex;
flex-flow: row nowrap;
align-items: flex-start;
justify-content: flex-start;
padding:20px;
box-sizing: border-box;
box-shadow: 3px 3px 5px rgba(0,0,0,0.1);
border-radius: 10px;
margin-bottom:40px;
}
#example #area01 ul li .img-box>span {
position: relative;
display: block;
}
#example #area01 ul li .img-box .num {
position: absolute;
top:-20px;
left:-20px;
}
#example #area01 ul li .img-box .num img {
max-width:76px;
}
#example #area01 ul li .img-box .img img {
width:300px;
margin-right: 30px;
}
#example #area01 ul li .txt > * {
display: block;
}
#example #area01 ul li .txt b {
font-size: 130%;
line-height: 1.2;
margin-bottom:10px;
}
#example #area02 .ul01,
#example #area02 .ul02 {
display: flex;
flex-flow: row wrap;
align-items: flex-start;
justify-content: space-between;
}
#example #area02 .ul01 {
margin-bottom:70px;
}
#example #area02 .ul01 li {
width: 30%;
text-align: center;
margin-bottom:40px;
}
#example #area02 .ul01 li .img img {
max-width: 230px;
margin-bottom:10px;
}
#example #area02 .ul01 li .txt .big {
font-size: 140%;
}
#example #area02 h4 {
font-size: 150%;
line-height: 1.2;
color:#fff;
text-align: center;
}
#example #area02 h4 b {
background:#8CBC1E;
display: inline-block;
width: 70%;
max-width: 270px;
padding:8px;
box-sizing: border-box;
border-radius: 50px;
margin-bottom:30px;
}
#example #area02 .ul02 li {
margin-bottom:50px;
}



/* flow
-------------------------------------------------------*/
#flow #visual .visual-in {
background: url(../img/flow/visual_bg.png)no-repeat center center/cover;
}
#flow #area01 {
padding-bottom:0;
}
#flow #area01 ul {
display: flex;
flex-flow: row nowrap;
align-items: flex-start;
justify-content: space-between;
}
#flow #area01 ul li {
width: 176px;
}
#flow #area01 ul li .img {
text-align: center;
border-bottom:1px solid #80ac1b;
margin-bottom:15px;
position: relative;
}
#flow #area01 ul li:not(:last-child) .img::after {
content: "";
display: inline-block;
background:url(../img/flow/arrow.png)no-repeat center center/20px 31px;
width: 20px;
height: 31px;
position: absolute;
top:0;
bottom:0;
right: -25px;
margin:auto;
}
#flow #area01 ul li .img img {
max-width: 112px;
margin-bottom:10px;
}
#flow #area01 ul li .txt > * {
display: block;
}
#flow #area01 ul li .txt b {
text-align: center;
line-height: 1.2;
font-size: 110%;
margin-bottom:15px;
}
#flow #area01 ul li .txt span {
font-size: 90%;
line-height: 1.4;
}
#flow #area02 dl {
border:1px solid #dcdcdc;
margin-bottom:20px;
border-radius: 10px;
padding:15px 20px;
box-sizing: border-box;
}
#flow #area02 dl dt {
font-weight: bold;
font-size: 120%;
line-height: 1.2;
background:url(../img/flow/q.png)no-repeat left center/39px 39px;
padding-left:49px;
min-height:39px;
margin-bottom:10px;
display: flex;
align-items: center;
}
#flow #area02 dl dd {
background:url(../img/flow/a.png)no-repeat left top/39px 39px;
padding-left:49px;
min-height:39px;
}



/* company
-------------------------------------------------------*/
#company #visual .visual-in {
background: url(../img/company/visual_bg.png)no-repeat center center/cover;
}
#company #area01 {
padding-bottom:0;
}
#company #area01 .dl-box {
border:1px solid #c9c9c9;
margin-bottom:70px;
}
#company #area01 dl {
display: table;
width: 100%;
}
#company #area01 dl:not(:last-child) {
border-bottom:1px solid #c9c9c9;
}
#company #area01 dl > * {
display: table-cell;
vertical-align: top;
padding:20px;
box-sizing: border-box;
}
#company #area01 dl dt {
width: 200px;
background:#eeeeee;
border-right:1px solid #c9c9c9;
}
#company #area01 dl dd ul li {
padding-left:1em;
text-indent: -1em;
}
#company #area01 h4 {
font-size: 120%;
line-height: 1.2;
border-bottom:1px solid #84b21c;
display: table;
width: 100%;
padding-bottom:10px;
margin-bottom:30px;
}
#company #area01 h4::before{
content:"";
display: inline-block;
vertical-align: middle;
background: url(../img/company/map.png)no-repeat left center/23px 33px;
width: 23px;
height: 33px;
padding-right: 5px;
}
#company #area01 h4 b {
display: table-cell;
vertical-align: middle;
width: 100%;
}
#company #area01 .map-area {
display: flex;
flex-flow: row nowrap;
align-items: flex-start;
justify-content: space-between;
}
#company #area01 .map-area li {
width: 480px;
}
#company #area01 .map-area li .txt > * {
display: block;
}
#company #area01 .map-area li .txt .small {
font-size: 90%;
}
#company #area02 {
padding-bottom:140px;
}
#company #area02 dl {
border-bottom:1px solid #cccccc;
display: table;
width: 100%;
}
#company #area02 dl>* {
display: table-cell;
vertical-align: top;
box-sizing: border-box;
padding:20px 0;
}
#company #area02 dl dt {
width: 280px;
}

#company #area01 a {
	color: #8fc014;
}

/* contact
-------------------------------------------------------*/
#contact-page #visual .visual-in {
background: url(../img/contact/visual_bg.png)no-repeat center center/cover;
}
#contact-page #area {
padding-bottom: 0;
}
#contact-page #area .img {
text-align: center;
}
#contact-page #area .img img {
max-width:813px;
}
#contact #form {
width:100%;
border:1px solid #c9c9c9;
}
#contact .text {
margin:0;
padding:3px;
height:40px;
box-sizing: border-box;
width:100%;
}
#contact textarea {
height: 100px!important;
}
#contact label {
display: inline-block;
}
#contact .ttl-txt {
text-align: center;
margin-bottom:30px;
}
#contact .ttl-txt span {
color:#FF3434;
font-size: 120%;
text-align: center;
line-height: 1.2;
border:2px solid #FF3434;
border-radius: 50px;
padding:10px 20px;
box-sizing: border-box;
display: inline-block;
}
#contact tr {
display: table;
width:100%;
}
#contact tr:not(:last-child) {
border-bottom:1px solid #c9c9c9;
}
#contact tr > * {
padding:20px;
box-sizing: border-box;
display: table-cell;
vertical-align: middle;
line-height: 1;
}
#contact tr th {
text-align: left;
width:260px;
background:url(../img/contact/hissu.png)no-repeat right 20px center /48px 27px;
border-right:1px solid #c9c9c9;
	background-color: #eee;
}
#contact tr:last-child th {
vertical-align: top;
background:url(../img/contact/nini.png)no-repeat right 20px top 20px /48px 27px;
	background-color: #eee;
}
#contact .kakunin tr:last-child th,
#contact .kakunin tr:nth-child(7) th,
#contact .kakunin tr:nth-child(8) th {
vertical-align: top;
background:url(../img/contact/nini.png)no-repeat right 20px top 20px /48px 27px;
	background-color: #eee;
}

#contact .radio-area {
padding-bottom:10px;
}
#contact .radio-btn {
margin-bottom:10px;
}
#contact .file{
	margin-bottom:5px;
}
.small_txt {
    font-size: 80%;
    display: block;
}

.btn-orange span {
display: inline-block;
position: relative;
}
.btn-orange span:hover::after {
opacity: .7;
}
#contact .btn-area {
text-align: center;
}
#contact .contact-btn {
border:none;
margin:50px 10px 0;
text-indent: -9999px;
background:url(../img/contact/btn_check.png)no-repeat center center/318px 60px;
width:318px;
height: 60px;
}
#contact.conf .contact-btn {
background:url(../img/contact/btn_send.png)no-repeat center center/318px 60px;
}
#contact .back-btn {
border: none;
margin:50px 10px 0;
background:url(../img/contact/btn_back.png)no-repeat center center/318px 60px;
width:318px;
height: 60px;
}
#contact .thanks-btn {
margin:50px 10px 0;
background:url(../img/contact/btn_thanks.png)no-repeat center center/318px 60px;
width:318px;
height: 60px;
display: block;
}
#contact.conf .f-box {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: center;
}
#contact .error-messe {
color:red;
padding:0 20px;
}

