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

body { font-size:12px; }

/********** header *******************/
header#header{
	padding: 0.7em 0 0.7em 0;
}
header#header h1 {
	margin:0.5em 0 0.5em 0;
}
header#header nav {
	position:relative;
    display: block;
    padding-top: 0;
    width: 100%;
}
header#header #spnav {
	display:block;
	font-size:3em;
	position:absolute;
	top:0.6em;
	right:0.5em;
	z-index:1000;
}
header#header #spnav a {
	color:#331900;
}
header#header section h1.logo {
	width:41%;
}
header#header nav ul#nav {
	position:absolute; top:4.2em; left:0; right:0;
	z-index:100;
	width:100%;
	margin:0 0 1px 0; padding:0;
	display:none;
	border: 1px solid rgba(108,81,66,0.6);
	box-shadow: 0 0 8px #FFF;
}
header#header nav ul#nav li {
	display: block;
	margin: 0 0 0 0;
	width: 100%;
	background-color:#FFF;
	border-bottom: 1px dotted;
	line-height: 3.5;
}
header#header nav ul#nav li:last-of-type {
	border-bottom: none;	
}
header#header nav ul#nav li a {
	display:block;
	padding:0.6em 1em;
	text-align:left;
	font-size: 1.2em;
}
header#header nav ul#nav li a img{
	display: inline-block;
	width: 2em;
	padding-right: 1em;
	padding-top: 0.4em;
}
header#header section h1.logo.logo_pc{
	display:none;
}
header#header section h1.logo.logo_sp{
    display: block;
	max-width: 191px;
}
header#header #trans {
	float:none;
	margin: 1em 0 0 0;
	text-align: left;
}
header span.border{
	display: none;	
}

/*********** 見出し *****************************/

.inner,
.middle_inner,
.lower_inner {
	width:96%; padding-left:2%; padding-right:2%;
}
br.pc_br{
	display:none;
}
.sp {
	display: block;
}
.pc {
	display: none;
}
.flex{
	display:block;
}
.flex img{
	width:100%;
	height:0%;
}

/*************** top start ***************************/

.mainVisual{
	height: 80vh;
}

.mainVisual .to_recruit {
  inset: auto 3.55% 10% auto;
  padding: 0.5em;
  inline-size: min(400px, 48%);
  box-sizing: border-box;
  font-size: 0.75em;
}
.mainVisual .to_recruit .fa-chevron-right {
  inset: 55% 1.2em auto auto;
}
.mainVisual .to_recruit:hover .fa-chevron-right {
  inset: 55% 0.8em auto auto;
}

.half_green {
    background: linear-gradient(transparent 69%,#CADCB5 69%);
}
.half_pink {
    background: linear-gradient(transparent 69%,#EBDDC9 69%);
}
section#top_gallery img.main{
	width: 100%;
}
p.sp_left{
	text-align:left;
}
h2.top_ttl{
	padding-top: 1.5em;
}
section#top_about h2.top_ttl img{
	width: 11%;
}
h2.top_ttl span{
	font-size: 0.7em;
	padding-top: 0;
}
section#top_about div.flex, section#top_recruit div.flex{
	display:block;
}
section#top_recruit{
	background-position: 51.5% center;
}
div.tabox{
	width: 90%;
	margin: auto;
	margin-top: -1em;
}
div.tabtn{
	position: relative;
	right: auto;
	left: auto;
	top: -3em;
}
section#top_about, section#top_recruit{
	padding-bottom: 1em;
}
section#top_staff,
section#top_gallery{
	padding: 4em 0 1.5em 0;
}
section#top_staff img.main{
	width: 100%;
}
section#top_staff img.main_sp {
    display: block;
}
section#top_staff img.main_pc{
    display: none;
}
section#top_staff div.inner,
section#top_gallery div.inner{
	position: relative;
	top: -2em;
}
section#top_recruit h2.top_ttl img{
	width: 8%;
}
div.ttl_box,
section#top_gallery div.ttl_box{
	width: 85%;
	margin: auto;
}
.kayahara_txt{
	position: absolute;
	height: auto;
	max-width: 808px;
	width: 85%;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}
img.kayahara_txt_pc{
	display:none;
}
img.kayahara_txt.sp{
	display:block;
}
section#top_topics h2.top_ttl img{
	width: 13%;
	
}
section#top_topics dl dt a{
	font-size:1em;
}
section#top_topics dl dd{
	font-size:0.9em;
}
/************ contact **************/

section#contact h2.common_h2 img{
	width: 8%;
}
section#contact div.common{
	background-position: 54% top;
}
section#contact .middle_inner{
	padding: 3em 0 2em 0;
}
section#contact form table {
	width:100%;
}
section#contact form table input[type=text] {
	width:96%; padding:2%;
}
section#contact form table td textarea {
	width:96%; padding:2%; height:80px;
}
section#contact form table th {
	width:27%;
	padding:12px 2% 12px 1%;
}
section#contact form table td {
	padding:12px 2% 12px 2%;
}
section#contact form input[type=submit] {
	border-radius:0;
	-webkit-appearance: none;
	width:80%; marginm:30px auto 30px auto; height:35px; font-size:1em;
	background-color:#CCC; border:solid 1px #BBB;
	cursor:pointer;
	box-shadow:0px 0px 5px -2px rgba(0, 0, 0, 0.8);
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-o-border-radius: 4px;
	-ms-border-radius: 4px;
	margin-bottom:50px;
}
form a.back,
form a.post {
	width:45%;
}

/*************** footer ******************************/

footer#footer section {
    padding: 10px 0 7em 0;
}
footer#footer {
	font-size:1.1em;
	background-size: 156%;
}
footer#footer section .footer_logo,
footer#footer section nav {
	width:100%;
}
footer#footer section .footer_logo {
    margin-top: 0em;
}
footer#footer .middle_inner .footer_logo.left h6{
	width: 80%;
	margin-bottom: 0.5em;
}
footer#footer nav ul {
	float:none;
	width:100%; 
	/*margin-left:1em;*/
	display:block;
}
footer#footer nav ul li{
	display:block;
	float:none;
	padding:0;
}
footer#footer nav ul li ul{
	margin-left:0;
}
footer p.copy{
	text-align: left;
	padding: 0;
}
section#contents_business p,
section#contents_product p,
section#contents_farming p{
    margin-right: 3%;
}

/***************  gallery  ******************/

h2.common_h2{
	padding: 3.7em 0;
}
h2.common_h2 img{
	vertical-align: middle;
}
section#gallery h2.common_h2 img ,
section#about h2.common_h2 img {
    width: 8%;
}

/**************  about  ****************/
section#about div.common{
	background-position: 82% top;
}
h3.bo_ttl{
	margin-bottom: 0;
	padding-top: 1em;
	font-size: 2.8em;
}
h3.bo_ttl div.h3_inner{
	padding-left: 0.5em;
	padding-right: 0.5em;
}
h3.bo_ttl span{
	font-size: 0.4em;
}
section#about p.brown{
	margin-top: 0;
}
p.cont{
	text-align:left;
}
p.cont br{
	display:none;
}
section#concept div.flex img, 
section#company div.flex img,
section#town div.flex img{
	width:100%;
	margin: auto;
	display: block;
	margin-bottom: 1em;
}
section#concept div.flex, section#town div.flex{
	margin-top: 3em;
}
table.data th{
	width: 7.5em;
}
section#company {
    padding-bottom: 4em;
}

/************  staff  ***************/
section#staff h2.common_h2 img{
	width: 10%;
}
section#staff div.staff_main dl.staff{
	float: none;
	width: 100%;
	margin: auto;
	display: block;
}
section#staff div.staff_main dl.staff dd.height{
	min-height:auto;
}
section#staff dl.profile dt{
	width: 19.5%;
}
section#staff dl.profile dd{
	width: 78%;
}
section#staff div.staff_main dl.staff dt.staff_ttl div.staff_img{
	margin-top: 2em;
}
dl.stf dd{
	width: 74.5%;
}
section#staff div.staff_main div.thanks h3.title{
	padding-top: 2em;
	margin-bottom: 0;
}

/************  recruit  **************/

h3.title{
	font-size: 1.4em;
}
section#message p.brown{
	margin-bottom: 1.5em;
	font-size: 1.3em;
}
section#message div.flex div{
    width: 100%;
    margin: auto;
}
section#message div.flex_a + div.flex_a{
	margin-top: 3.5em;
	padding-top: 1.5em;
}
div.flex_b{
	margin-top: 0.5em;
	max-width: 670px;
}
section#message div.flex_b div.flex{
	width: 100%;
	display: flex;
	margin-bottom: 0.5em;
}
div.flex_b img{
	width: 49%;
	height:0%;
}
section#photo div.flex img{
	display: block;
	width: 100%;
	margin: auto auto 1em auto;
}
section#photo table td{
	padding-right:0;
}
section#flow table th{
	width: 22%;
}
section#recruit h2.common_h2 img{
	width: 6%;
}
section#recruitment table.data{
	margin-top: 1em;
}
section#recruit div.button_wrapper dl{
	float: none;
	width: 90%;
	margin: 1.5em auto;
}
section#recruit div.button_wrapper dl dd{
	height: 4.5em;
	line-height: 4.5em;
}
div.button_wrapper{
	padding-bottom: 3em;
}
section#recruit p.contact_p{
	margin-top: 2em;
}

div.car img{
    width:90%;
}


ul#slide01{
	margin-top: 1em;
    padding-bottom: 1em;
}
ul#slide01 li{
	margin-inline-end: 1em;
	width: 48%;
}