@charset "utf-8";

html, body {
height: 100%;
}

body, text {
font-family: "Noto Sans JP";
word-break: break-all;
-webkit-text-size-adjust: 100%;
letter-spacing: 1px;
font-weight: 500;
font-size: 16px;
line-height: 1.6;
margin: 0;
color: #394a33;
}

a:hover {color: #8b7456;}
a {text-decoration: none;}

* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}

img {
vertical-align: bottom;
width: 100%;
}

h1, h2, h3, h4, p {
margin: 0;
font-size: 100%;
font-weight: normal;
}

ul, li {
list-style: none;
margin: 0;
padding: 0;
}

input, input [type="text"], textarea {
font-size:16px;
}

table {
border-collapse: separate;
border-spacing: 0;
}


/* First view -------------------------------------------------------- */
.main_visual {
background-image: url(image/mainvisual.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
max-width: 1400px;
width: 95%;
margin: 0 auto;
height: 700px;
border-radius: 40px;
}

/* under 1200 -------------------------------------------------------- */
@media (max-width : 1200px) {
.main_visual {
height: 500px;
}
}

/* under 800 -------------------------------------------------------- */
@media (max-width : 800px) {
.main_visual {
background-image: url(image/mainvisual-sp.jpg);
width: 100%;
height: 100vw;
border-radius: 0;
}
}


/* Common ------------------------- */
.contents_wrap {
padding: 100px 0;
}

.contents_wrap2 {
padding: 0 0 100px;
}

.contents_inner {
max-width: 1400px;
width: 95%;
margin: 0 auto;
overflow: hidden;
}

/* under 1200 ------------------------- */
@media (max-width: 1200px) {
.contents_inner {

}
}

/* under 800 ------------------------- */
@media (max-width: 800px) {
.contents_wrap {
padding: 50px 0;
}

.contents_wrap2 {
padding: 0 0 50px;
}

.contents_inner {
width: 90%;
}
}


/* Headder area -----------------------------------------------------*/
.header_logo {
width: 330px;
margin: 40px auto 0;}

.header_wrap {
overflow: hidden;
margin: 50px 0 20px;
}

.main_menu ul {
overflow: hidden;
padding: 0;
width: 780px;
margin: 0 auto;}

.main_menu li {
float: left;
display: inline-block;
margin: 0 2%;
}

.main_menu li a {
color: #394a33;
transition: all .3s ease-out;
font-family: 'Noto Serif JP', serif;
}

.main_menu li a:hover {
color: #a2bb98;
}

/* under 800 -------------------------------------------------------- */
@media (max-width : 800px) {
.header_logo {
width: 180px;
margin: 15px 0 15px 20px;}

.side_logo {
margin: 40px auto 20px;
width: 140px;
}
}


/* globalMenu -----------------------------------------------------*/
.globalMenuSp {
box-shadow: 0px 0px 1px rgba(0, 0, 0, .2);
z-index: 10002;
top: 0;
left: auto;
right: 0;
margin: auto;
position: fixed;
transform: translateX(100%);
transition: all .8s;
width: 100%;
text-align: center;
background-color: rgba(255, 255, 255, 1);
height: 100%;
overflow: auto;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: none;
}

.globalMenuSp ul {
width: 90%;
margin: 80px auto 50px;
padding: 0;
}

.globalMenuSp li {
list-style-type: none;
padding: 18px 10px;
width: 100%;
border-bottom: 1px solid #d9e5de;
}

.globalMenuSp li a {
color: #394a33;
font-size: 16px;
}

.globalMenuSp.active {
transform: translateX(0px);
}

.navToggle {
display: block;
position: fixed;
right: 15px;
top: 15px;
width: 50px;
height: 48px;
cursor: pointer;
z-index: 10005;
background: #e33535;
text-align: center;
border-radius: 5px;
}

.navToggle span {
display: block;
position: absolute;
width: 28px;
border-bottom: solid 2px #fff;
-webkit-transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
transition: .5s ease-in-out;
left: 11px;
}

.navToggle span:nth-child(1) {
top: 12px;
}

.navToggle span:nth-child(2) {
top: 23px;
}

.navToggle span:nth-child(3) {
top: 34px;
}

.navToggle span:nth-child(4) {
border: none;
}

.navToggle.active span:nth-child(1) {
top: 23px;
left: 11px;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);
}

.navToggle.active span:nth-child(2),
.navToggle.active span:nth-child(3) {
top: 23px;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg);
}


/* Top page -------------------------------------------------------- */
#roop {
width: 100%;
height: 120px;
background: url(image/left_slide_sankyufarm.png) repeat-x;
background-position: 0 0;
background-size: cover;
-webkit-animation: bgroop 50s linear infinite;
animation: bgroop 50s linear infinite;}

@-webkit-keyframes bgroop {
    from {
        background-position: 0 0;
    }
    to {
        background-position: -3200px 0;
    }
}
@keyframes bgroop {
    from {
        background-position: 0 0;
    }
    to {
        background-position: -3200px 0;
    }
}

.loopSlide_photo {
margin-top: 80px;
}

#roop_photo {
width: 100%;
height: 200px;
background: url(image/left_slide_farmphoto.png) repeat-x;
background-position: 0 0;
background-size: cover;
-webkit-animation: bgroop 50s linear infinite;
animation: bgroop 50s linear infinite;}

@-webkit-keyframes bgroop {
    from {
        background-position: 0 0;
    }
    to {
        background-position: -3200px 0;
    }
}
@keyframes bgroop {
    from {
        background-position: 0 0;
    }
    to {
        background-position: -3200px 0;
    }
}

.first_message {
text-align: center;
margin: 50px auto 0;
width: 90%;
}

.block_wrap {
position: relative;
height: 550px;
}

.block_left_right {
height: 450px;
}

.block_ttl_right {
padding-top: 90px;
}

.block_left {
position: absolute;
width: 50%;
top: 0;
left: 0;
}

.block_right {
position: absolute;
width: 50%;
top: 0;
right: 0;
}

.about_us_photo, .our_concept_photo {
background-size: cover;
background-repeat: no-repeat;
background-position: top center;
height: 450px;
width: 100%;
position: absolute;
}

.about_us_photo {
background-image: url(image/about_us_photo.jpg);
}
.our_concept_photo {
background-image: url(image/our_concept_photo.jpg);
}

.block_text_wrap {
background-color: #edf9ef;
width: 56%;
height: 300px;
position: absolute;
bottom: 0;
right: 0;
padding: 60px;
}

.block_text_wrap2 {
background-color: #edf9ef;
width: 56%;
height: 300px;
position: absolute;
bottom: 0;
left: 0;
padding: 60px;
}

.bottom_link {
position: absolute;
left: 60px;
bottom: 60px;
}

.block_text {
margin-bottom: 50px;
}

.flow_wrap ul {
overflow: hidden;
margin-bottom: 50px;
}

.flow_wrap li {
float: left;
width: 23%;
margin: 0 1%;
}

.tel_mail {
margin-top: 40px;
}

.tel, .mail {
padding: 20px 0;
width: 50%;
}

.tel img, .mail img {
width: 300px;
margin: 0 auto;
display: block;
}

.tel {
background-color: #669a7b;
float: left;
}

.mail {
background-color: #89bb9d;
float: right;
}

footer {
background-color: #edf9ef;
padding: 100px 0;
text-align: center;
}

.foot_logo {
width: 150px;
margin: 0 auto 30px;
}

address {
font-style: normal;
margin-bottom: 50px;
font-size: 90%;
}

.sns_area {
overflow: hidden;
width: 140px;
margin: 0 auto 40px;
}

.sns_area li {
float: left;
width: 50px;
margin: 0 10px;
}

.sns_area_sp {
overflow: hidden;
width: 174px;
margin: 0 auto 20px;
}

.sns_area_sp li {
float: left;
width: 75px;
margin: 0 5px;
border: none;
}

.copy {font-size: 12px;}

/* under 1200 -------------------------------------------------------- */
@media screen and (max-width : 1200px) {
#roop {
height: 90px;
}

#roop_photo {
height: 140px;
-webkit-animation: bgroop 80s linear infinite;
animation: bgroop 80s linear infinite;
}

.loopSlide_photo {
margin-top: 60px;
}

.block_wrap {
height: 420px;
}

.bottom_link {
left: 40px;
bottom: 40px;
}

.block_left_right {
height: 350px;
}

.about_us_photo, .our_concept_photo {
background-size: 100%;
height: 350px;
}

.block_ttl_right {
padding-top: 30px;
}

.block_text_wrap, .block_text_wrap2 {
height: 300px;
padding: 40px;
}

.block_text {
margin-bottom: 30px;
}

footer {
background-color: #edf9ef;
padding: 50px 0;
}

.tel_mail {
margin-top: 20px;
}

.tel img, .mail img {
width: 250px;
}
}

/* under 800 -------------------------------------------------------- */
@media screen and (max-width : 800px) {
#roop {
height: 60px;
-webkit-animation: bgroop 60s linear infinite;
animation: bgroop 60s linear infinite;}

#roop_photo {
height: 120px;
}

.first_message {
text-align: left;
margin: 20px auto 0;
}

.block_wrap {
height: auto;
}

.bottom_link {
position: static;
left: 0;
bottom: 0;
}

.block_left_right {
height: 65vw;
}

.about_us_photo, .our_concept_photo {
height: 57vw;
margin-top: 70px;
display: block;
}

.block_left {
width: 100%;
display: block;
position: static;
}

.block_right {
width: 100%;
display: block;
}

.block_ttl_right {
padding-top: 0;
padding-bottom: 20px;
}

.block_text_wrap, .block_text_wrap2 {
width: 100%;
height: auto;
position: static;
display: block;
padding: 60px 30px 30px;
}

.flow_wrap ul {
margin-bottom: 20px;
}

.flow_wrap li {
float: none;
width: 100%;
margin: 0 0 20px;
}

.tel, .mail {
padding: 20px 0;
width: 100%;
}

.tel img, .mail img {
width: 200px;
}

.tel {
background-color: #669a7b;
float: none;
}

.mail {
background-color: #89bb9d;
float: none;
}

.foot_logo {
width: 120px;
}

address {
margin-bottom: 30px;
}
}


/* Sub page -------------------------------------------------------- */
.subpage_main_visual {
max-width: 1400px;
width: 95%;
margin: 0 auto;
}

.subpage_main_visual_company,
.subpage_main_visual_flow,
.subpage_main_visual_concept,
.subpage_main_visual_recruit,
.subpage_main_visual_contact
 {
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
width: 100%;
height: 400px;
border-radius: 40px;
}

.subpage_main_visual_company {
background-image: url(image/subpage_mainvisual_company.jpg);
}
.subpage_main_visual_flow {
background-image: url(image/subpage_mainvisual_flow.jpg);
}
.subpage_main_visual_concept {
background-image: url(image/subpage_mainvisual_concept.jpg);
}
.subpage_main_visual_recruit {
background-image: url(image/subpage_mainvisual_recruit.jpg);
}
.subpage_main_visual_contact {
background-image: url(image/subpage_mainvisual_contact.jpg);
}

.subpage_title {
margin: 80px auto 0;
width: 250px;
}

.list_table {
overflow: hidden;
}

.list_table_li {
border-bottom: 1px solid #efefef;
padding: 20px 0;
overflow: hidden;
}

.list_title {
width: 13%;
float: left;
font-weight: bold;
display: block;
}

.list_naiyou {
width: 87%;
float: right;
display: block;
}

.saibai {
margin-bottom: 30px;
}

.saibai img, .ikubyo img, .nagare img {
border-radius: 20px;
}

.nagarewrap {
max-width: 600px;
width: 100%;
margin: 0 auto;
}

.contents_box {
padding-top: 30px;
position: relative;
}

.contents_title {
top: 0;
position: absolute;
width: 560px;
left:  0;
right: 0;
margin: auto;
}

.contents_subtitle {
font-family: 'Noto Serif JP', serif;
font-weight: 700;
text-align: center;
font-size: 18px;
letter-spacing: 4px;
margin-bottom: 30px;
}

.contents_text {
background-color: #fff;
border-radius: 30px;
padding: 30px;
}

.n_mgn {
margin-top: -40px;
}

.interview_box {
height: 250px;
}

.name {
font-weight: 900;
font-family: 'Noto Serif JP', serif;
margin-bottom: 20px;
font-size: 16px;
}

.interview_text_1 {
float: left;
width: 60%;
display: flex;
justify-content: center;
align-items: center;
height: 250px;
padding: 0 30px;
background-color: #fff;
border-top-left-radius: 40px;
border-bottom-left-radius: 40px;
font-size: 90%;
}

.interview_photo_1 {
float: right;
width: 40%;
height: 250px;
border-top-right-radius: 40px;
border-bottom-right-radius: 40px;
}

.interview_text_2 {
float: right;
width: 60%;
display: flex;
justify-content: center;
align-items: center;
height: 250px;
padding: 0 30px;
background-color: #fff;
border-top-right-radius: 40px;
border-bottom-right-radius: 40px;
font-size: 90%;
}

.interview_photo_2 {
float: left;
width: 40%;
height: 250px;
border-top-left-radius: 40px;
border-bottom-left-radius: 40px;
}

.harada_photo, .iwata_photo, .masuda_photo {
background-size: cover;
background-position: center center;
height: 250px;
}

.harada_photo {
background-image: url(image/hadada.jpg);
border-top-right-radius: 40px;
border-bottom-right-radius: 40px;
}
.iwata_photo {
background-image: url(image/iwata.jpg);
border-top-left-radius: 40px;
border-bottom-left-radius: 40px;
}
.masuda_photo {
background-image: url(image/masuda.jpg);
border-top-right-radius: 40px;
border-bottom-right-radius: 40px;
}

.text_mgn {
margin-bottom: 50px;
}

.main_photo {
margin: 1%;
}

.photo_area ul {
overflow: hidden;
}

.photo_area li {
float: left;
width: 18%;
margin: 1%;
}

.photo_area li img, .main_photo img {
border-radius: 8px;
}

/* under 1200 -------------------------------------------------------- */
@media screen and (max-width : 1200px) {
.subpage_main_visual_company {
height: 300px;
border-radius: 30px;
}

.list_table_li {
padding: 10px 0 ;
}

.list_title {
width: 100%;
float: none;
font-size: 110%;
}

.list_naiyou {
width: 100%;
float: none;
}
}

/* under 800 -------------------------------------------------------- */
@media screen and (max-width : 800px) {
.subpage_main_visual_company,
.subpage_main_visual_flow,
.subpage_main_visual_concept,
.subpage_main_visual_recruit,
.subpage_main_visual_contact {
height: 200px;
border-radius: 20px;
}

.subpage_title {
margin: 30px auto 0;
}

.saibai {
margin-bottom: 20px;
}

.contents_box {
padding-top: 15px;
margin-top: 30px;
}

.contents_title {
max-width: 330px;
width: 80%;
}

.contents_subtitle {
font-size: 16px;
margin: 10px 0 20px;
letter-spacing: 0px;
}

.contents_text {
border-radius: 20px;
padding: 20px;
}

.interview_box {
height: auto;
}

.name {
text-align: center;
}

.interview_text_1 {
float: none;
width: 100%;
display: block;
height: auto;
padding: 20px;
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
border-top-left-radius: 0;
}

.interview_photo_1 {
float: none;
width: 100%;
height: 45vw;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
border-bottom-right-radius: 0;
}

.interview_text_2 {
float: none;
width: 100%;
display: block;
height: auto;
padding: 20px;
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
border-top-right-radius: 0;
}

.interview_photo_2 {
float: none;
width: 100%;
height: 45vw;
border-top-right-radius: 20px;
border-top-right-radius: 20px;
border-bottom-left-radius: 0;
}

.harada_photo, .masuda_photo {
border-top-right-radius: 20px;
border-top-left-radius: 20px;
border-bottom-right-radius: 0;
height: 45vw;
}

.iwata_photo {
border-top-left-radius: 20px;
border-top-right-radius: 20px;
border-bottom-left-radius: 0;
height: 45vw;
}

.text_mgn {
margin-bottom: 30px;
}

.photo_area li {
width: 48%;
margin: 1%;
}
}


/* contact page ------------------------- */
#formWrap {
width: 100%;
max-width: 1000px;
height: auto;
margin: 0 auto;
padding: 1px;
}

input#formbutton {
cursor: pointer;
-webkit-appearance: none;
width: 140px;
padding: 15px 0;
margin: 0 5px;
color: #fff;
background-color: #669a7b;
border: 1px solid #669a7b;
border-radius: 40px;
letter-spacing: 2px;
text-indent: 2px;
text-align: center;
transition: .2s;
font-size: 14px;
font-weight: bold;
}

#formbutton:hover {
background-color: #fff;
color: #669a7b;
}

.formkoumoku {
font-weight: 700;
}

.koumoku_en {
font-family: 'Hind', sans-serif;
font-weight: bold;
font-size: 17px;
}

.input_area {
width:100%;
background-color: #fff;
border: none;
height: 60px;
padding: 10px 20px;
margin: 5px 0 40px;
-webkit-appearance: none;
border-radius: 50px;
border: solid 1px #a8c29f;
}

.input_area2 {
width:100%;
background-color: #fff;
border: none;
padding: 20px;
-webkit-appearance: none;
border-radius: 20px;
border: solid 1px #a8c29f;
margin-bottom: 40px;
}

input[type="text"]:focus {
border: solid 1px #436437;
outline: none;
}

textarea:focus {
border: solid 1px #436437;
outline: none;
}

::placeholder {
font-size: 13px;
letter-spacing: 2px;
}

.hissu {
color: #d50000;
}

.radio_area {
margin: 4px 0 30px;
}

.radio_waku {
background-color: #669a7b;
cursor: pointer;
display: inline-block;
padding: 10px 20px 10px 10px;
margin: 0 10px 0 0;
font-size: 90%;
color: #fff;
border-radius: 50px;
}

.radio_waku:hover {
background-color: #8caf9a;
}

.policy {
margin-top: 50px;
}

.policy1 {
margin-bottom: 10px;
text-align: center;
font-weight: normal;
}

.policy2 {
font-size: 85%;
text-align: center;
font-weight: normal;
}

table.formTable{
width:100%;
border-collapse:collapse;}

.formTable{margin-bottom: 50px;}

table.formTable td{
padding:10px;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;}

table.formTable th{
font-weight: 500!important;
padding:10px;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;}

table.formTable th{
width:30%;
font-weight:normal;
background:#efefef;
text-align:left;}

p.error_messe{
margin:5px 0;
color:red;}

.sousinend {text-align: center;}

.sns_banner {
width: 200px;
margin: 50px auto 0;
}

.sns_banner img {
border-radius: 10px;
margin-top: 5px;
}

/* under 800 ------------------------- */
@media (max-width: 800px) {
.form_bg {
padding: 20px;
}

#formWrap {
padding-bottom: 0;
}

.radio_waku {
width: 120px;
display: block;
margin: 0 0 10px 0;
}

.policy {
margin-top: 30px;
}

.policy2 {
text-align: left;
}

.formTable{margin-bottom: 30px;}

table.formTable th{width:100%; display: block;}

table.formTable td,table.formTable th{
padding:10px;
width:100%; display: block;}

table.formTable td{
padding:10px;
border-top: none;
border-bottom: 1px solid #ccc;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;}

table.formTable th{
padding:10px;
border-top: none;
border-bottom: none;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;}

table.formTable{
border-top: 1px solid #ccc;}
}


/* Other -------------------------------------------------------- */
main {
background-color: #fff;
display: block;}

.green_wrap {
border-radius: 30px;
padding: 40px;
}

.green_bg {
background-color: #f6fbf7;
}

.green_bg2 {
background-color: #edf9ef;
}

.section-inner {
max-width: 1000px;
width: 90%;
margin: 0 auto;
padding: 0 0 100px;
}

.section-inner2 {
max-width: 1000px;
width: 90%;
margin: 0 auto;
padding: 100px 0;
}

.center, .center2 {
text-align: center;
}

.block_ttl_wrap {
margin-bottom: 50px;
}

.block_ttl {
width: 300px;
margin: 0 auto;
}

.fa-chevron-right {
font-size: 14px;
padding-left: 3px;
}

.link_buttom a {
display: block;
background-color: #669a7b;
border-radius: 50px;
padding: 14px 0;
font-family: 'Libre Baskerville', serif;
text-align: center;
color: #fff;
letter-spacing: 4px;
text-indent: 4px;
width: 220px;
font-size: 14px;
transition: .5s;
-webkit-transition: .5s;
-moz-transition: .5s;
-o-transition: .5s;
}

.link_buttom a:hover {
background-color: #345641;
}

.large_link_btm a {
display: block;
background-color: #294e38;
font-family: 'Libre Baskerville', serif;
text-align: center;
color: #fff;
letter-spacing: 4px;
text-indent: 4px;
font-size: 26px;
padding: 30px 0;
transition: .5s;
-webkit-transition: .5s;
-moz-transition: .5s;
-o-transition: .5s;
}

.large_link_btm a:hover {
background-color: #4c795e;
}

.arrow_lage {font-size: 22px;}

.map {
position: relative;
width: 100%;
height: 0;
padding-top: 350px;
}

.map iframe {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
}

/* under 800 -------------------------------------------------------- */
@media (max-width : 800px) {
body, text {
font-size: 14px;
}

.section-inner {
padding: 0 0 60px;
}

.section-inner2 {
padding: 60px 0;
}

.pc {display: none;}

.block_ttl_wrap {
margin-bottom: 20px;
}

.block_ttl {
width: 250px;
}

.center2 {
text-align: left;}

.link_buttom a {margin: 0 auto;
}

.large_link_btm a {
font-size: 20px;
padding: 20px 0;
}

.arrow_lage {font-size: 18px;}

.green_wrap {
border-radius: 30px;
padding: 20px;
}

.map {
position: relative;
width: 100%;
height: 0;
padding-top: 220px;
}
}

/* over 800 -------------------------------------------------------- */
@media (min-width : 801px) {
.spbr, .sp {display: none;}
}