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

body { font-size:12px; }

/********** header *******************/

header#header h1 {
	margin:1em 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.7em;
	right:0.5em;
}
header#header #spnav a {
	color:#331900;
}

header#header section h1.logo {
	width:50%;
}

header#header nav ul#nav {
	position:absolute; top:10px; left:0; right:0;
	z-index:2000;
	width:100%;
	margin:0 0 1px 0; padding:0;
	display:none;
	
}

header#header nav ul#nav li {
	display: block;
	margin: 0 0 0 0;
	width: 100%;
	background-color: #66B955;
	border-bottom: 1px dotted #FFF;
	color: white;
}
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;
	color: white;
	text-shadow: 1px 1px 0 black;
}

header#header nav ul#nav li a:hover{
	border-bottom:none;
}
header#header nav ul#nav li a::after {
	display:none;
}
header#header #trans {
	float:none; margin:0 0 10px;
}

section#slide img.top_logo {
    position: absolute;
    max-width: 167px;
    bottom: 1em;
    right: 2em;
}

/*******************  top  ****************************/
.mainVisual h1{
	width:95%;
	font-size: 2.075em;
}

/******** layout *******************/


.inner,
.middle_inner,
.lower_inner {
	width:96%; padding-left:2%; padding-right:2%;
}


br.pc {
	display:none;
}

section#top_about p.f20 {
	text-align:left;

}
.sp {
	display: block;
}
.pc {
	display: none;
}

.pad{
	display:none;
}
/*************** top start ***************************/
.ttl img.eng5 {
	width:10em;
	max-width:340px;
}
.ttl img.eng7 {
	width:14em;
	max-width:476px;
}
.ttl img.eng8 {
    width: 15em;
    max-width: 370px;
}
.txt_ttl{
	font-size: 1.4em;
}
.ttl img.icon{
	width: 1.5em;
}
section#top_about{
	background-position: top left,bottom left;
    background-size: 200%,211%;
	padding: 1em 0 5em 0;
}
section#top_about p br{
	display:none;
}
section#top_about div.flex{
	display:block;
	margin-top:0;
}
div.about_a {
    width: 60%;
	padding-top: 80%;
	margin: auto;
}

section#top_topics{
	padding-bottom:5em;
}
section#top_topics div.middle_inner{
	width: 90%;
}
section#top_topics dl {
    width: 100%;
    padding: 1em 1em 1em 1em; box-sizing: border-box;
    margin: 0;
}
section#top_topics dt{
	float:none;
	padding-bottom:0;
	width: 24%;
}
section#top_topics dd{
	border-bottom: dotted 1px #331900;
    margin-left: 0;
}
section#top_staff{
	background-position: center -16%;
    background-size: 281%;
	padding: 1em 0 0 0;
}
section#top_staff p{
	text-align:center;
}
div.tsuchi{
	background-size: 130% auto,40% auto;
}
section#top_recruit{
	background-position: center -6%,center 104%;
	background-size: 281%,auto;
	padding: 1em 0 1.5em 0;
}
section#top_recruit p{
	text-align:left;
}
section#top_recruit p.more_p{
	text-align:center;
	margin-top: 4em;
}
section#top_recruit p.more_p a{
	margin-top: 0;
}
section#top_recruit div.grid{
	display:block;
	margin-bottom:0;
}
section#top_recruit p br{
	display:none;
}
section#top_recruit figure{
	margin: auto;
}
section#movie{
	padding: 1em 0 5em 0;
}
section#top_gallery{
	background-position: center -30%,4% bottom,96% bottom,center bottom;
    background-size: 281% auto,50%,45%,auto;
}
section#top_gallery{
    padding: 1em 0 7em 0;
}
section#top_recruit figure:nth-child(1),
section#top_recruit figure:nth-child(3){
	margin:auto;
}

/********************  footer  **********************/
footer#footer{
	background-size: 130% auto,40% auto;
	padding: 0em 0 1em 0;
	font-size:1.1em;
}
footer#footer section {
    padding: 10px 0 50px 0;
}
footer#footer section .footer_logo,
footer#footer section nav {
	width:100%;
}

footer#footer section .footer_logo {
	margin-top:1em;
}

footer#footer nav ul {
	float:none;
	width:100%; 
	/*margin-left:1em;*/
	display:block;
}
footer#footer nav ul li{
	display:block;
	float:none;
}
footer#footer nav ul li ul{
	margin-left:0;
}
footer p.copy{
	padding: 1em;
	text-align: left;
}
section#contents_business p,
section#contents_product p,
section#contents_farming p{
    margin-right: 3%;
}
footer#footer .middle_inner .footer_logo.left h6{
	margin-bottom: 1em;
}
footer#footer .middle_inner .footer_logo.left h6 a img{
	margin-left: 0.5em;
}




/************ contact **************/
section#contact div.bg01 {
    background-position: center -20%,4% bottom,96% bottom,center bottom;
	background-size: 287% auto,59%,34%,213%;
	padding: 6em 0 7em 0;
}
section#contact .middle_inner{
	padding: 0em 0 0em 0;
}
section#contact h4.center,
section#contact form p.center {
	text-align:left;
}
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 td {
	
}
section#contact form table th {
	width:27%;
	padding:12px 2% 12px 1%;
	text-align:center;
}
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;
	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;
}

/************************  gallery  ******************************/
section#gallery div.bg01{
	background-position: center -17%,4% bottom,96% bottom,center bottom;
	background-size: 287% auto,59%,34%,213%;
	padding: 5em 0 9em 0;
}
h2.common_ttl img{
	width: 1.8em;
}
h2.common_ttl img.txt {
    padding: 0.7em 0 0.2em 0;
}
section#gallery div.bg01 div.middle_inner, section#staff div.bg01 div.middle_inner{
	padding-top: 0em;
}
section#gallery ul li{
	width: calc(92% / 3);
	margin: 1.3%;
}
h3.title{
	font-size: 1.6em;
	padding-bottom: 0.5em;
}
section#gallery ul.movie_list li {
	width: 100%;
	margin-top: 1em;
}

/**************************  staff  *****************************/
section#staff div.bg01{
	background-position: center -4.5%,4% bottom,96% bottom,center bottom;
	background-size: 287% auto,59%,34%,213%;
	padding: 6em 0 9em 0;	
}
dl.staff:nth-child(2n+1) {
    clear: both;
}
dl.staff {
    width: 48%;
    max-width: 48%;
    margin-right: 0;
    margin-top: 0;
    margin-bottom: 10px;
    float: left;
}
dl.staff dt.staff_ttl img {
    max-width: 100%;
	width:100%;
}
dl.staff:nth-child(2n) {
    float: right;
}
dl.ob.staff{
	float:none;
}
dl.staff dd.staff_data{
	font-size: 1.3em;
	min-height: 250px;
}
dl.staff dd.staff_sp02{
	min-height: 227px;
}
dl.staff dd.staff_sp03{
	min-height:276px;
}
dl.staff dd.staff_sp04{
	min-height:242px;
}

dl.staff dd.staff_spauto{
	min-height:auto;
}
dl.staff dd.staff_data span.come span.small{
	display: block;
	padding: 0;
}
dl.staff dd.staff_data span.block br{
	display:none;
}

/**************************  about  *****************************/
section#about div.bg01{
	background-position: center -2.5%,4% bottom,96% bottom,center bottom;
	background-size: 287% auto,59%,34%,213%;
	padding: 6em 0 9em 0;
}
section#town h4.border_ttl,
section#message h4.border_ttl{
	margin-top: 0em;
}
div.flex{
	display:block;
}
section#town div.flex img,
section#about section#waraku div.flex img,
section#recruit div.flex img {
    width: 95%;
    margin: auto;
    display: block;
    margin-bottom: 1em;
}
section#about .flex div.waraku_right{
	width: 100%;
	margin:auto;
}
section#waraku div.flex img{
	margin-bottom: 0em;
}
div.waraku_right{
	width: 100%;
	margin-top: 2em;
}
h6.waraku_about{
	font-size: 2em;
	display: block;
	text-align: center;
}
section#about section#waraku h6.waraku_about img {
    width: 2em;
    display: inline-block;
	margin: 0;
}
h6.waraku_about span{
	vertical-align: top;
}
div.waraku_right ul li{
	display: block;
	text-align: center;
}
section#waraku div.large_inner img{
	margin-bottom:1em;
}
table.data th{
	width: 8em;
	padding-left:0;
}
p.milk_net{
	padding-left:0;
}

section#about_topics dl{
	display:block;
}

section#about_topics dt{
	display:block;
}

section#about_topics dd{
	margin-left:0;
}

section#about_topics img{
	float:none;
}

/********************  recruit  ****************************/
section#recruit div.bg01{
	background-position: center -3%,4% bottom,96% bottom,center bottom;
    background-size: 287% auto,59%,34%,213%;
    padding: 7em 0 9em 0;
}
section#message{
    background-size: 250%;
	padding-bottom: 5em;
}
section#voice p{
	text-align:left
}
section#voice p br{
	display:none;
}
p.about_concept_p01{
    padding: 0.5em 1em;
}
table.data td ul.square li img {
    padding: 0.8em 0 0.4em 0em;
    width: 90%;
	display: block;
}
section#recruit div.tell div.flex{
    padding-top: 2em;
}
section#recruit div.tell dl.tel{
    margin: auto;
    width: 80%;
}
section#recruit div.tell dl.tel dt,
section#recruit div.tell dl.fax dt {
	font-size: 1.15em;
}
section#recruit div.tell dl.fax {
    margin-right: 15%;
    margin: auto;
    width: 80%;
    margin-top: 3em;
}
section#recruit div.tell dl.fax dd a{
    line-height: 70px;
}
section#recruitment table.data th{
	width: 7em;
}