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

body {
	color:#564638;
	font-size:16px;
	line-height:1.8;
	font-family: 'Noto Sans JP', sans-serif, "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	height:100%;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}


img {
	border:none; vertical-align:middle;
}
img.top {
	vertical-align:top;
}
img.middle {
	vertical-align:middle;
}

address,
em {
	font-style:normal;
}


a {
	color:#111111;
	text-decoration: none;
	transition: 0.2s;
}
a:hover,
input[type="submit"]:hover,
input[type="reset"]:hover{
	opacity:0.8;
	filter:alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
	color:#331900;
	cursor:pointer;
}



/*********** class ****************************************/
/********** float ************/
.c-both {
	clear:both;
}

.clearfix:after {
	content: "";
	clear: both;
	display: block;
}

.left {
	float:left;
}

.right {
	float:right;
}

.center {
	display:block;
	margin-left:auto; margin-right:auto;
	text-align:center;
}
/******* end float **********/

/******* flex box ***********/
.flex{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
	justify-content: space-between;
}

.flex img {
    object-fit: cover;
    object-position: top;
}
.flex img.sum {
	object-fit: cover;
    object-position: top;
}


.height {
	justify-content: space-between;
  	flex-wrap: wrap;
	align-items: stretch;
}
/****** end flex box ********/

.indent {
            font-weight:normal; margin:5px 0 5px 1em;
            text-indent:-1em;
}
img.banner {
	border:solid 1px #DDD;
}
span.memo {
	font-size:0.9em;
}
span.error {
	display:block;
	color:#F03;
	font-size:0.9em;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
}
hr {
	height: 5px;
	background-color: #006C3E;
	width: 100%;
	border: none;
	margin:60px 0 0 0;
}
header, main, article, footer, section, aside, nav, cite, figure, figcaption { 
	display: block; 
}
img.img_size {
	display: block;
	height: auto;
	width: 100%;
}
dl.table {
	display:table; width:100%;
}
dl.table dt,
dltable dd {
	display:table-cell;
}
/*.f20 {
	font-size:1.2em;
}*/

/***** btn **********/
a.more {
	display: inline-block;
	width: 70%;
	max-width: 320px;
	padding: 0.67em 0;
	font-size: 1em;
	text-align: center;
	margin-top: 1.5em;
	margin-bottom: 1em;
	font-weight: 500;
	color: #FFFFFF;
	background-color: #000;
}
a.more:hover{
	background-color: #009933;
}
a.more2 {
	position: relative;
	display: inline-block;
	width: 70%;
	max-width: 280px;
	padding: 1em 0 1em 0;
	font-size: 1em;
	text-align: center;
	margin-top: 1em;
	margin-bottom: 1em;
	font-weight: 500;
	color:#279E77;
	background-color:#FFFFFF;
}
/*
a.more::after,
a.more2::after{
    content: "";
    position: absolute;
    right: -9px;
    bottom: -9px;
    width: 0;
    height: 0;
    border: 9px solid transparent;
    border-top-color: transparent;
    border-top-style: solid;
    border-top-width: 9px;
    border-top: 9px solid #000;
    transform: rotate(-45deg);
}
*/




/****** end btn ***********/
.sp {
	display: none;
}
.pc {
	display: block;
}
.pad{
	display:none;
}	

/*************** header start ***************************/

header#header {
}
header#header section {
	margin: 0 auto 0 auto;
}
header#header section h1.logo {
	display:block; width:25%; max-width:248px;
}
header#header section h1.logo a {
	display:block; width:100%; max-width:248px;
}
header#header section h1.logo a img {
	width:100%; max-width:248px;
}
header#header nav {
	display:block; padding-top:20px;
	width:75%;
	padding-bottom:15px;
}
header#header nav ul#nav {
	list-style-type:none; padding-left: 0;
}
header#header nav ul#nav li {
	display:inline-block; margin-left:1.5em;
}
header#header nav ul#nav li a {
  display: block;
  padding: 0 0 5px;
  text-decoration: none;
  font-weight: 500;
  color:#564638;
}
header#header nav ul#nav li a:hover::after {
  width: 100%;
}
header#header nav ul#nav li a.select {
	border-top:solid 4px #22A605; padding-top:3px;
}
header #spnav {
	display:none;
}
header#header #trans {
	margin:0.9em 0 0 2em;
}

/**************  slide  *******************************/

section#slide{
	position:relative;
}

section#slide img.slide_logo{
	position:absolute;
	z-index: 1000;
	top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
	width: 80%;
	max-width: 706px;
}

section#slide .swiper-slide {
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}

section#slide .swiper-container {
	margin:0 auto;
} 

section#slide .swiper-wrapper {
	margin:0 auto;
}

img.fit {
    font-family: 'object-fit: cover;';
}

section#slide div.head_txt{
	position: absolute;
	    top: 13%;
    left: 6.5%;
}

section#slide p.head_txt{
	color:#FFF;
	
}

section#slide p.head_txt_01{
	font-weight:bold;
	font-size:6em;
    text-shadow: 0px 0px 0px #090D13, 0px 0px 0px #090D13, 0px 0px 0px #090D13, 0px 0px 8px #333;
	margin: 0 0 0.3em 0;
    line-height: 1.3em;
}

section#slide p.head_txt_01 span{
	font-size:0.92em;
}

section#slide p.head_txt_02{
	font-size:1.813em;
	text-shadow: 0px 0px 0px #263954, 0px 0px 0px #263954, 0px 0px 0px #263954, 0px 0px 8px #263954;
	font-weight:bold;

}

/******** 共通 layout *******************/
.large_inner{
	width:96%; max-width:1780px;
	margin:0 auto;
}
.inner {
	width:96%; max-width:1300px;
	margin:0 auto;
}
.middle_inner {
	width: calc(100% - 10%);
	max-width: 1020px;
	margin: 0 auto;
}
.lower_inner {
	width: calc(100% - 20%); max-width:634px;
	margin:0 auto;
}
main {
	width:100%;
}
main .content {
	margin:0 0 100px 0; padding:0;
}
main img.heading{
	width:100%; margin-bottom:20px;
}

/***************** video start ***********************/

/*.mainVisual h1 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 300px;
    height: 80px;
    margin: auto;
    line-height: 80px;
    text-align: center;
    color: #fff;
    font-size: 28px;
    border: 1px solid #fff;
    background: rgba( 0, 0, 0, 0.3 );
}*/
video{
	width:95%;
	/*max-width:1026px;*/
	max-width:1000px;
	margin-top: 3em;
}
video + p{
    font-size: 1.5em;
    margin: 2.5em auto 1em auto;
    color: #39AE39;
    font-weight: 600;
}
video + p + video{
	margin-top: 0;
}
.mainVisual h1 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 70%;
    height: 35%;
    margin: auto;
    /*line-height: 80px;*/
    text-align: center;
    color: #fff;
    font-size: 2.875em;
    /*border: 1px solid #fff;
    background: rgba( 0, 0, 0, 0.3 );*/
    /*padding: 1em;*/
	text-shadow: 3px 3px 4px rgba(0, 0, 0, 0.5);
}

.mainVisual h1 span.green{
	color:#009966;
}

.mainVisual h1 span.orange{
	color:#FF9224;
}

.mainVisual h1 img {
	display:block; margin:0 auto; text-align:center;
	padding-top:0.5em;
}
.mainVisual {
  position: relative;
  width: 100%;
  /*height: 300px;*/ height:100vh;
  overflow: hidden;
  /*background: linear-gradient(-45deg, rgba(4, 114, 124, 0.4), rgba(17, 66, 99, 0.6));*/
  /*background: linear-gradient(-45deg, rgba(4, 114, 124, 0.3), rgba(17, 66, 99, 0.5));*/
}
.mainVisual video {
  position: absolute;
  left: 0;
  top: 0;
  min-width: 100%;
  min-height: 100%;
  z-index: -1;
}



/***************** video end ***********************/


/*********  main btn  ***********/


.imgWrap {
	overflow: hidden;	/*拡大時にはみ出た部分を隠す*/
	/*width: 320px;	/*画像の幅*/
	/*height: 180px;	/*画像の高さ*/

}

div.btn_txt{
	position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

.imgWrap img {
	display: block;
	transition-duration: 0.3s;	/*変化に掛かる時間*/
}
.imgWrap img:hover {
	transform: scale(1.1);	/*画像の拡大率*/
	transition-duration: 0.3s;	/*変化に掛かる時間*/
}

p.brbp{
	font-size:1.75em;
	margin:0;
	position:relative;
	margin-bottom: 1.3em;
	color:#FFF;
	text-shadow: 1px 1px 3px rgba(0,0,0,0.65);
	font-weight: 600;
}

p.brbp::after {
	content: "";
	position: absolute;
	bottom: -0.4em;
	left: 0;
	right: 0;
	margin: auto;
	background-color: #FF9900;
	width: 2.5em;
	height: 4px;
	border-radius: 2px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	-o-border-radius: 2px;
	-ms-border-radius: 2px;
	box-shadow: 1px 1px 3px rgba(0,0,0,0.65);
}

span.brbp_span{
	display:block;
	font-size:0.57em;
	text-shadow: 1px 1px 4px black;
	font-weight: 600;
}

span.brbp_02{
	font-size:1.125em;
	color:#FFF;
	text-shadow: 1px 1px 3px rgba(0,0,0,0.65);
	font-weight: 600;

}





/************  topstart  ********************************************/
.ttl {
    position: relative;
    margin-top: 60px;
    margin-bottom: 1.5em;
    font-size: 1.625em;
    font-weight: 500;
    color: #FF6666;
    font-family: 'M PLUS Rounded 1c', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	letter-spacing: 3px;
	padding-bottom: 0.2em;
}
.ttl::after {
    content: "";
    position: absolute;
    bottom: -0.4em;
    left: 0;
    right: 0;
    margin: auto;
    background-color: #FF6666;
    width: 2.5em;
    height: 4px;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -o-border-radius: 2px;
    -ms-border-radius: 2px;
}
.ttl img{
	padding-bottom: 0.7em;
}
/*
.ttl img.icon {
    width: 3em;
    max-width: 53px;
}
*/
.ttl img.eng5 {
    width: 15em;
    max-width: 340px;
}
.ttl img.eng7 {
    width: 21em;
    max-width: 425px;
}
.ttl img.eng8 {
    width: 21em;
    max-width: 546px;
}


/****************  top_about  *******************/
section#top_about{
	background-image:url(../img/top/top_about01.png);
	background-repeat:no-repeat;
	background-position:top center;
	background-size:contain;
	padding: 3em 0 10em 0;
}
div.about_a {
	margin: 0 3% 0 0;
	width : -webkit-calc(100% / 3) ;
	width : calc(100% / 3.4) ;
	padding-top: 33%;
	position:relative;
}
div.about_end{
	margin: 0;
}
div.about_a a {
    width: 100%;
    padding-top: 33%;
	margin:0;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
div.about_a a.ab1 {
	background-image: url(../img/top/btn_01_off.png);
	z-index:100;
}
div.about_a a.ab2 {
	background-image: url(../img/top/btn_01_on.png);
	z-index:10;
}
div.about_a a.ab1:hover {
		opacity:0;
	filter:alpha(opacity=0);
	-ms-filter: "alpha( opacity=0 )";
}
div.about_a a.ab3 {
	background-image: url(../img/top/btn_02_off.png);
	z-index:100;
}
div.about_a a.ab4 {
	background-image: url(../img/top/btn_02_on.png);
	z-index:10;
}
div.about_a a.ab3:hover {
		opacity:0;
	filter:alpha(opacity=0);
	-ms-filter: "alpha( opacity=0 )";
}
div.about_a a.ab5 {
	background-image: url(../img/top/btn_03_off.png);
	z-index:100;
}
div.about_a a.ab6 {
	background-image: url(../img/top/btn_03_on.png);
	z-index:10;
}
div.about_a a.ab5:hover {
		opacity:0;
	filter:alpha(opacity=0);
	-ms-filter: "alpha( opacity=0 )";
}
.txt_ttl {
    font-size: 1.5em;
    margin: 1em 0;
	color:#39AE39;
}
section#top_about div.flex{
	margin-top: 4.5em;
}

/******************  top_topics  *********************/
section#top_topics{
	background-image:url(../img/top/top_about02.png);
	background-repeat:no-repeat;
	background-position:bottom center;
	background-size:contain;
	padding: 0 0 12em 0;

}

section#top_topics dl{
	display:table;
	width:90%;
	padding:0 1.65em 0.825em 1.65em;
	margin:0 auto;	
}

section#top_topics dt{
	padding-bottom: 8px;
	display:table-cell;
	font-weight:bold;
	width:12.5%;
	float:left;
}

section#top_topics dd{
	padding-bottom: 8px;
	display:block;
	border-bottom:dotted 1px #331900;
	margin-left:0;
	width:100%;
}

section#top_topics div.middle_inner{
	background-color:#E1F5FF;
	border-radius:1em;
	margin: 4em auto 2em auto ;
	border:solid 1px #331900;
	width:80%;
}

section#top_topics a.topics_text{
	color:#564638
}

section#top_topics .ttl{
	margin-top:0; 
}

section#top_topics .box { padding:1.6em 0 0.825em 0; }

/******************  top_staff  *******************/
section#top_staff{
	background-image:url(../img/top/kumo.jpg);
	background-repeat:no-repeat;
	background-position:top center;
	background-size:contain;
	padding: 3em 0 0 0;
}
.bx-wrapper {
    position: relative;
    padding: 0;
    *zoom: 1;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
}
.bx-wrapper {
    margin-top: 3.5em;
    padding-top: 48px;
    background-image: url(../img/top/kusa01.png);
    background-repeat: repeat-x;
    background-position: top center;
}
.bx-viewport {
    -webkit-transform: translatez(0);
    background-color: #78C168;
    padding: 20px 0 20px 0;
}
ul#bx_silde {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 100%;
}
div.tsuchi{
	background-image: url(../img/header/soil_part02.png),url(../img/header/soil.jpg);
	background-repeat: repeat-x,repeat;
	background-position: center top,center top;
	background-size: 50% auto,40% auto;
	padding: 3.5em 0 2.5em 0;
}
p.more_p{
	margin:0;
}
div.tsuchi img{
	display:none;
}

/************  top_recruit  **************/
section#top_recruit{
	background-image:url(../img/top/kumo.jpg),url(../img/top/kusa02.jpg);
	background-repeat:no-repeat,no-repeat;
	background-position:top center,bottom center;
	background-size:contain;
	padding: 3em 0 2.5em 0;
}
section#top_recruit .inner {
    position: relative;
}
.grid {
    display: -ms-grid;
    display: grid;
}
section#top_recruit div.grid{
	margin-top: 4.5em;
	margin-bottom: 3em;
}
section#top_recruit figure:nth-child(1) {
	-ms-grid-column:1;
	grid-column:1;
	-ms-grid-row:1;
	grid-row:1;
	margin: 0 4% 0 0;
}
section#top_recruit figure:nth-child(2) {
	-ms-grid-column:2;
	grid-column:2;
	-ms-grid-row:1;
	grid-row:1;
}
section#top_recruit figure:nth-child(3) {
	-ms-grid-column:3;
	grid-column:3;
	-ms-grid-row:1;
	grid-row:1;
	margin: 0 0 0 4%;
}
section#top_recruit figure {
	max-width:409px; 
	margin:0 2% 0 2%; padding:0;
	width:96%;	
}
section#top_recruit figure figcaption {
    margin: 0 0 2em 0;
    padding: 0;
}
section#top_recruit figure img.sum {
	width:100%; 
	max-width:409px;
}
section#top_recruit figure figcaption dl {
    margin: 0;
    padding: 0;
}
section#top_recruit figure figcaption dl dt {
    margin: 0 0 0.9em 0;
    padding: 0.9em 0 0.9em 0;
    font-size: 1.25em;
    font-weight: bold;
    border-bottom: dotted 1px #331900;
}
section#top_recruit figure figcaption dl dd {
    margin: 0;
    padding: 0;
}
section#top_recruit figure figcaption dl dt img.icon {
	width:2em; max-width:36px; margin-right:0.3em;
	vertical-align: top;
}
section#top_recruit figure figcaption dl dd a.more {
	font-size:0.938em; width:14em;
}
.green{
	color:#39AE39;
}

section#top_recruit figure figcaption dl dd  span{
	color:#F00;
}


/********************  movie  ****************************/
section#movie{
	padding: 3em 0 6em 0;
}

/******************  top_gallery  *********************/
section#top_gallery,
section#gallery div.bg01,
section#staff div.bg01,
section#about div.bg01,
section#recruit div.bg01{
	background-image:url(../img/top/kumo.jpg),url(../img/top/house.png),url(../img/top/ushi.png),url(../img/top/kusa03.jpg);
	background-repeat:no-repeat,no-repeat,no-repeat,no-repeat;
	background-position: center top,4% bottom,96% bottom,center bottom;
	background-size: contain,auto,auto,contain;
}
section#top_gallery{
	padding: 2.5em 0 9em 0;
}
section#top_gallery ul {
	list-style-type: none;
	padding:0;
	margin: 0px;
	margin-bottom: 2em;
}
section#top_gallery ul li {
	width : calc(100% / 3 - 3%) ;
    margin: 1% 2% 1% 0;
}
section#top_gallery ul li.t {
	width : calc(100% / 3 - 3%) ;
    margin: 1% 2% 1% 3%;
}
section#top_gallery ul li.e {
	width : calc(100% / 3 - 3%) ;
    margin: 1% 0 1% 0;
}
section#top_gallery ul li img.sum {
    width: 100%;
    max-width: 240px;
}

section#top_gallery div.flex {
    justify-content: space-between;
}

section#top_gallery div.flex div {
    inline-size: 100%;
}

section#top_gallery div.flex div.insta_cont img.insta {
    width: 100%;
    max-width: 447px;
    margin: auto;
    display: block;
}

/******************** コンテンツページ start ******************************/



/****************** form ****************************************************/
section#contact div.common{
	background-image: url(../img/contact/common_bg.jpg);
}
section#contact .middle_inner {
	padding:7em 0 5em 0;
}
section#contact form table {
	width:80%; margin:0 auto 30px auto;
}
section#contact form table th {
	width: 30%;
	background-color: #EEE;
	padding: 12px 2% 12px 2%;
	text-align: right;
	border-bottom: solid 3px #FFF;
}
section#contact form table td {
	padding:12px 2% 12px 2%;
}
section#contact form table td input {
	width:80%; padding:1%; font-size:1em;
}
section#contact form table td textarea {
	width:80%; padding:1%; height:80px; font-size:1em;
}
section#contact form input[type=submit] {
	border-radius:0;
	-webkit-appearance: none;
	width:30%; marginm:30px auto 30px auto; height:41px; font-size:1.3em;
	background-color: #CCC;
	border: 1px solid #BBB;
	cursor:pointer;
	box-shadow:0px 0px 13px -5px 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;
	color:#000;
}
form a.back {
	display:inline-block;
	text-align:center;
	text-decoration:none;
	line-height:41px;
	width:30%; margin-bottom:31px; height:41px; font-size:1.3em;
	background-color:#999; border:#777 solid 1px;
	color:#FFF; cursor:pointer;
	box-shadow:0px 0px 13px -5px rgba(0, 0, 0, 0.8);
	border-radius: 2px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	-o-border-radius: 2px;
	-ms-border-radius: 2px;
}
form a.post {
	display:inline-block;
	text-align:center;
	text-decoration:none;
	line-height:41px;
	width:30%; margin-bottom:31px; height:41px; font-size:1.3em;
	background-color:#39ae39; border: solid 1px #063;
	color:#FFF; cursor:pointer;
	box-shadow:0px 0px 13px -5px rgba(0, 0, 0, 0.8);
	border-radius: 2px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	-o-border-radius: 2px;
	-ms-border-radius: 2px;
}
span.h {
	background-color:#E80032;
	color:#FFF; font-size:0.7em; font-weight:normal;
	display:inline-block;
	padding:1px 8px 0px 8px;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-o-border-radius: 3px;
	-ms-border-radius: 3px;
}
span.n {
	background-color:#7FCDF1;
	color:#FFF; font-size:0.7em; font-weight:normal;
	display:inline-block;
	padding:1px 8px 0px 8px;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-o-border-radius: 3px;
	-ms-border-radius: 3px;
}
section#contact span.form_span{
	color:#FFF;
}
section#contact div.bg01 {
    padding-top: 3em;
	padding-bottom: 7em;
	background-image: url(../img/top/kumo.jpg),url(../img/top/house.png),url(../img/top/ushi.png),url(../img/top/kusa03.jpg);
	background-repeat: no-repeat,no-repeat,no-repeat,no-repeat;
	background-position: center -22%,4% bottom,96% bottom,center bottom;
	background-size: contain,auto,auto,contain;
}
.c_white{
	color:#FFF;
	font-weight:600;
}







/********************************** footer start ****************************************/
footer#footer {
	overflow: hidden;
	padding-bottom: 10px;
	background-image: url(../img/header/soil_part02.png),url(../img/header/soil.jpg);
	background-repeat: repeat-x,repeat;
	background-position: center top,center top;
	background-size: 50% auto,40% auto;
	padding: 6em 0 3em 0;
}

/*footer#footer section {
	padding:50px 0 50px 0;
}*/

footer#footer section a,
footer p.copy,
footer#footer div.footer_logo address{
	font-weight:300;
}

footer#footer section .footer_logo {
	width:35%;
}

footer#footer section h6 {
	font-size:1.4em; margin:0 0 1em 0;
}
footer#footer .middle_inner .footer_logo.left h6 {
	display:block; width:100%; max-width:301px;
	margin-bottom: 2em;
}

footer#footer .middle_inner .footer_logo.left h6 a {
	display:block; width:100%; max-width:301px;
}

footer#footer .middle_inner .footer_logo.left h6 a img {
	 width:100%; max-width:239px;
}
footer#footer div.footer_logo address {
	font-size:0.9em;
}
footer#footer a.foot_tel {
	font-size:1.125em; font-weight:bold;
	padding-top: 0.5em; display: block;
}
footer#footer a.foot_tel i {
	padding-right:0.5em;
}

footer#footer nav {
	width:65%;
}
footer#footer nav ul {
	list-style-type:none;
	margin:0; padding:4em 0 0 0;
	justify-content: flex-end;
	/*width:50%;*/
}
footer#footer nav ul li {
	margin-bottom:0.5em; font-size:0.875em; 
	padding-left:3%;
}

footer p.copy {
	padding:4em 0 0 0; margin:0;
	font-size:0.75em;
	text-align:right;
}
footer,
footer a{
	color:#FFF;
}
footer a:hover{
	color:#FFF;
	opacity:0.8;
}


/*******************************  gallery  ************************************/
div.common{
	background-repeat: no-repeat;
	background-position: center center;	
	background-size: cover;
}
section#gallery div.common{
	background-image: url(../img/gallery/common_bg.jpg);
}
h2.common_ttl{
	font-size: 1.625em;
	padding: 5em 0 7em 0;
	margin: 0;
	color: #FFF;
	font-family: 'M PLUS Rounded 1c', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	font-weight: 500;
	letter-spacing: 3px;
	text-shadow: 0px 0px 5px rgba(0,0,0,0.7),0px 0px 5px rgba(0,0,0,0.7),0px 0px 5px rgba(0,0,0,0.7),0px 0px 5px rgba(0,0,0,0.7);
	position:relative;
}
h2.common_ttl:after{
	content: "";
    position: absolute;
    bottom: 6.5em;
    left: 0;
    right: 0;
    margin: auto;
    background-color: #FF6666;
    width: 2.33em;
    height: 4px;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -o-border-radius: 2px;
    -ms-border-radius: 2px;
	box-shadow: 1px 1px 5px #000;
}
h2.common_ttl img{
	display:block;
	margin: auto;
	padding:0;
}
h2.common_ttl img.txt{
	padding: 0.8em 0 0.7em 0;
}
section#gallery div.bg01,
section#staff div.bg01,
section#about div.bg01{
	padding-top:3em;
	padding-bottom:12em;
	background-position: center -14%,4% bottom,96% bottom,center bottom;
}
section#gallery div.bg01 div.middle_inner{
	padding-top: 1em;
}
section#gallery ul {
	list-style-type:none; padding:0;
}
section#gallery ul li {
    width: 23.6%;
	max-width: 240px;
	margin: 0.7%;
    padding: 0;
}

section#gallery ul li a img {
	width:100%; max-width:244px;
}

section#gallery h3.movie_ttl {
	margin-top: 2em;
}

section#gallery ul.movie_list {
	display: block;
}

section#gallery ul.movie_list li {
	display: inline-block;
	width: 46%;
	max-width: 470px;
	margin: auto;
	float: left;
}

section#gallery ul.movie_list li.e {
	float: right;
}

section#gallery ul.movie_list li video {
	margin-top: 0;
}

h3.title{
	font-size:2em;
	color:#4C933E;
	font-family: 'M PLUS Rounded 1c', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	letter-spacing: 4px;
}

/*************************************  staff  *******************************************/
section#staff div.common{
	background-image: url(../img/staff/common_bg.jpg);
}
section#staff div.bg01{
	background-position: center -5%,4% bottom,96% bottom,center bottom;
}
section#staff div.bg01 div.middle_inner {
    padding-top: 8em;
}
dl.staff {
   width: 31%;
	max-width: 320px;
	margin-right: calc(13% / 4.5);
	margin-bottom: 30px;
}
dl.staff:nth-child(3n) {
   margin-right:0;	
}
dl.ob.staff{
	margin: auto;
	display: block;
	float: none;
	margin-top: 4em;
}
dl.staff dt.staff_ttl img.staff_img {
   display: block;
   max-width: 100%;
   margin-bottom: 10px;	
}
dl.staff dt.staff_ttl img {
   max-width: 100%;	
}
dl.staff dt.staff_ttl div.staff_img {
   background-size:contain;
   background-repeat:no-repeat;
   cursor: pointer;
}
dl.staff dt.staff_ttl div#staff01 {
   background-image: url(../img/staff/staff16_on.jpg);
}
dl.staff dt.staff_ttl div#staff02 {
   background-image: url(../img/staff/staff17_on.jpg);
}
dl.staff dt.staff_ttl div#staff03 {
   background-image: url(../img/staff/staff03_on.jpg);
}
dl.staff dt.staff_ttl div#staff04 {
   background-image: url(../img/staff/staff04_on.jpg);
}
dl.staff dt.staff_ttl div#staff05 {
   background-image: url(../img/staff/staff05_on.jpg);
}
dl.staff dt.staff_ttl div#staff06 {
   background-image: url(../img/staff/staff06_on.jpg);
}
dl.staff dt.staff_ttl div#staff07 {
   background-image: url(../img/staff/staff07_on.jpg);
}
dl.staff dt.staff_ttl div#staff08 {
   background-image: url(../img/staff/staff08_on.jpg);
}
dl.staff dt.staff_ttl div#staff09 {
   background-image: url(../img/staff/staff09_on.jpg);
}
dl.staff dt.staff_ttl div#staff10 {
   background-image: url(../img/staff/staff10_on.jpg);
}
dl.staff dt.staff_ttl div#staff11 {
   background-image: url(../img/staff/staff11_on.jpg);
}
dl.staff dt.staff_ttl div#staff12 {
   background-image: url(../img/staff/staff12_on.jpg);
}
dl.staff dt.staff_ttl div#staff13 {
   background-image: url(../img/staff/staff18_off.jpg);
}
dl.staff dt.staff_ttl div#staff14 {
   background-image: url(../img/staff/staff14_on.jpg);
}
dl.staff dt.staff_ttl div#staff15 {
   background-image: url(../img/staff/staff15_on.jpg);
}
dl.staff dt.staff_ttl div#staff16 {
	background-image: url(../img/staff/staff19_on.jpg);
 }
 dl.staff dt.staff_ttl div#staff17 {
	background-image: url(../img/staff/staff20_on.jpg);
 }
 
 


dl.staff dt.staff_ttl img:hover {
	opacity: 0;
	filter: alpha(opacity=0);
	-ms-filter: "alpha( opacity=0 )";
	transition-property: opacity;
	transition-duration:1s;
    transition-timing-function:ease-in-out;
}
dl.staff dd.staff_data {
    background-color: #DFF5FF;
    margin: 0 auto;
    font-size: 1.125em;
    padding: 1em 0.5em;
    font-weight: 500;
	min-height: 328px;
}
dl.staff dd.staff_data a{
	text-decoration: underline;
	color: #4C933E;
	word-break: break-all;
	display: block;
}
dl.staff dd.staff_data span.small_txt {
	font-size: 0.833em; padding-right:1em;
}
.block{
	display:block;
}
dl.staff dd.staff_data span.block{
	font-size:0.67em;
}
dl.staff dd.staff_data span.come{
	font-size:0.75em;
	margin-top: 0.2em;
	margin-bottom: 0.1em;
}
dl.staff dd.staff_data span.come span.small{
	padding-left: 2em;
}

/************************  about  *********************************/
section#about div.common{
	background-image: url(../img/about/common_bg.jpg);
}
section#about div.bg01{
	background-position: center -2.8%,4% bottom,96% bottom,center bottom;
	padding-bottom: 14.5em;
}
h4.border_ttl {
    font-size: 2em;
    border-top: 2px solid #554638;
    border-bottom: 2px solid #554638;
    padding-bottom: 0.7em;
    margin-bottom: 1.5em;
    margin-top: 3em;
}
h4.border_ttl span.small {
    font-size: 0.56em;
    color: #FFF;
    background-color: #FF6666;
    padding: 0.03em 0.67em;
	letter-spacing: 1.5px;
}
h4.border_ttl span.large {
    display: block;
    letter-spacing: 5px;
}
section#town h4.border_ttl{
	margin-top: 5em;
}
section#town p{
	margin-bottom: 2.5em;
}
h6.waraku_about{
	font-size: 1.25em;
	margin-top: 0.5em;
	margin-bottom: 0;
}
h6.waraku_about span{
	background: #39AD39;
    color: #FFF;
    padding: 0.25em 0.8em;
	vertical-align: bottom;
	margin-left: 0.5em;
}
section#about .flex h6.waraku_about img{
	width: 3.7em;
	position: relative;
	top: 0.1em;
}
section#about .flex img.waraku_left,
section#about .flex div.waraku_right{
	width: 48%;
	max-width: 485px;
	height: 0%;
}
div.waraku_right ul{
	padding:0;
}
div.waraku_right ul li{
	font-size: 1.25em;
	background-color:#DFF5FF;
	list-style:none;
	padding-left: 1em;
	font-weight: bold;
	display: inline-block;
	padding-right: 0.5em;
	margin: 0.1em 0;
}
div.waraku_right ul li:before{
	position: relative;
	top: -4px;
	left: -9px;
	display: inline-block;
	width: 5px;
	height: 5px;
	content: '';
	border-radius: 100%;
	background: #554638;
}
section#about .flex div.waraku_right img.waraku_ushi{
	width:100%;
	height:auto;
}
section#waraku div.flex{
	margin-top: 3em;
	margin-bottom: 2.5em;
}
section#waraku div.large_inner{
	margin-top: 4.5em;
}
section#company{
	margin-top: 4em;
}
section#company h4.border_ttl{
	margin-top: 0em;
}
img.top_img {
    display: block;
    margin: auto;
    margin-top: 2em;
    margin-bottom: 2.5em;
    width: 93%;
    max-width: 780px;
}
section#company h4.border_ttl{
	margin-bottom:2em;
}
table.data {
    width: 100%;
    border-collapse: collapse;
	margin-bottom: 2em;
}
section#about table.data{
	margin-bottom:0;
}
table.data th, table.data td{
    padding-top: 0.6em;
	padding-bottom: 0.6em;
    border-bottom: dotted 1px #999;
    font-weight: 400;
	vertical-align: text-top;
}
table.data th, table.data td a{
	color:#564638;
}
table.data th {
	padding-left:1em;
    text-align: left;
    text-indent: 1em;
    width: 13em;
}
iframe.fb{
	border: 1px solid #565656;
}
div.history{
	margin-top: 7em;
}
h4.simple{
	border-bottom: 1px solid #3E2624;
	padding-bottom: 1.3em;
	margin-bottom: 2.5em;
}
h4.simple span{
	background-color:#3E2624;
	color:#FFF;
	font-size:1.25em;
	letter-spacing: 5px;
	padding: 0.23em 0.5em;
	border-radius: 5px;
}
div.history table.data th, 
div.history table.data td{
	border:none;
}
div.history table.data th{
	width: 14em;
}
div.history table.data td span.space{
	padding: 0.5em;
}
table.data td ul{
	margin:0;
	padding-left:0.75em;
}
table.data td ul li{
	list-style:none;
}
table.data td ul li:before{
	position: relative;
	top: -4px;
	left: -9px;
	display: inline-block;
	width: 5px;
	height: 5px;
	content: '';
	border-radius: 100%;
	background: #554638;
}
div.many_photo{
	padding-bottom: 4em;
}
section#about figure:nth-of-type(3n+1) {
    clear: both;
}
section#about figure {
    width: 31.33%;
	max-width: 320px;
	margin: 3% 3% 0 0;
}
section#about figure img {
    width: 100%;
}
section#about figure.e {
    margin: 3% 0 0 0;
}
section#about .flex .sum {
    object-fit: contain;
    object-position: top;
}
section#about .flex img,
section#recruit .flex img {
    width: -webkit-calc(100% / 3 - 1%);
    width: calc(100% / 3 - 1%);
    height:0%;
}
p.milk_net {
	border-bottom: dotted 1px #999;
	font-weight: 400;
	margin: 0;
	text-indent: 1em;
	padding: 0.6em 0 0.6em 1em;
	margin-bottom: 2em;
}
p.milk_net a{
	color:#564638;
	margin-left: 1em;
}

section#about_topics dl{
    border-bottom: dotted 1px #999;
	display:table;
	width:100%;
}

section#about_topics dt{
	display:table-cell;
}

section#about_topics dd{
	display:block;
}

section#about_topics img{
	float:left;
}

/*****************************  recruit  *************************************/
section#message{
	background-image: url(../img/recruit/glass.jpg);
	background-repeat: no-repeat;
	background-position: center bottom;	
	background-size:contain;
	padding-bottom: 9em;
}
section#recruit div.common{
	background-image: url(../img/recruit/common_bg.jpg);
}
section#recruit div.bg01 {
    background-position: center -3%,4% bottom,96% bottom,center bottom;
    padding-bottom: 17em;
	padding-top: 3em;
}
.red{
	color:#FF6666;
}
section#message h4.border_ttl{
	margin-top: 5em;
}
p.about_concept_p01{
	text-align: left;
	margin-left: auto;
	margin-right: auto;
	line-height: 2em;
	padding: 0.5em 2.8em;
	border-bottom: 3px dotted rgba(131,202,199,0.5);
	margin: 0;
}
section#message img.top_img{
	margin-bottom: 1.5em;
}
p.name{
	margin-bottom: 2.5em;
	margin-top: 1.5em;
}
section#voice img.top_img{
	margin-bottom: 1.5em;
}
section#voice p{
	margin-bottom: 4em;
	margin-top: 0.5em;
}
table.data td ul.square{
	padding:0;
}
table.data td ul.square li{
	list-style: none;
	position: relative;
	padding-left: 1.2em;
}
table.data td ul.square li:before{
	content: "◆";
	background: none;
	position: absolute;
	height: auto;
	width: auto;
	border-radius: unset;
	top: 0;
	right: auto;
	left: 0;
}
table.data td ul.square li img{
	padding:0.8em 0.65em 0.4em 0;
	max-width: 320px;
	width: 41%;
}
section#recruit div.tell p.tell_top {
    font-size: 1.375em;
    font-weight: bold;
    margin: 0;
    padding:2.5em 0 25px 0;
	letter-spacing: 2px;
}
/*** 20200902 ***/
table.data td ul.att{
	list-style:none;
	padding: 0.5em 0 0 0;
}
table.data td ul.att li.att_li{
	padding-left: 1em;
	text-indent: -1em;
}
table.data td ul.att li.att_li:before{
	display:none;
}
/*** end 20200902 ***/
section#recruit div.tell div.flex {
    justify-content: space-between;
    padding-top: 10px;
}
section#recruit div.tell dl.tel,
section#recruit div.tell dl.fax {
    width: 31.5%;
}
section#recruit div.tell dl.tel dt,
section#recruit div.tell dl.fax dt {
    font-weight: 500;
    padding-bottom: 13px;
	letter-spacing: 2px;
}
section#recruit div.tell dl.tel dd,
section#recruit div.tell dl.fax dd {
    border-radius: 5px;
}
section#recruit div.tell dl.tel dd a,
section#recruit div.tell dl.fax dd a {
    font-size: 1.375em;
    color: #FFF;
    letter-spacing: 2px;
    font-weight: 500;
    display: inline-block;
    line-height: 70px;
    display: block;
}
section#recruit div.tell dl.tel {
    margin-left: 15%;
}
section#recruit div.tell dl.tel.tel2 {
	margin-left: auto;
	padding-top: 3em;
}

section#recruit div.tell dl.tel dt i {
    font-size: 1.25em;
    padding-right: 0.3em;
    vertical-align: text-bottom;
}
section#recruit div.tell dl.tel dd {
    background-color: #39AD39;
}
section#recruit div.tell dl.tel.tel2 dd {
    background-color: #A3D900;
}

section#recruit div.tell dl.fax {
    margin-right: 15%;
}
section#recruit div.tell dl.fax dt i{
	font-weight: 500;
	font-size: 1.25em;
	vertical-align: text-bottom;
	padding-right: 0.3em;
}
section#recruit div.tell dl.fax dd {
    background-color: #F59504;
}
section#recruit div.tell dl.fax dd a {
    font-size: 1.125em;
}
img.glass{
	width:100%;
}

table.data caption {
	color:#F00;
	padding-bottom: 1.7em;
}








/*************** iPad *********************************************************************/
@media (min-width: 768px) and (max-width: 1342px) {
section#top_recruit figure figcaption dl dd br{
	display:none;
}
.p_left{
	text-align:left;	
}

}

@media (min-width: 768px) and (max-width: 1025px) {
	
body {
	font-size:12px;
}
header#header nav{
	/*width:auto;*/
	position: relative;
	width:70%;
	padding-top: 36px;	
}
header#header #trans {
	margin: 0.9em 0 0 2em;
	float: none;
	position: absolute;
	top: 0;
	right: 0;
}
.sp{
	display:none;
}
.pc{
	display:block;
}	
.gst{
	display:none;
}
.p_left{
	text-align:left;
}
.ttl img.icon{
	width:2em;
}
video{
	margin-top: 0em;
}
section#top_gallery div.flex {
	justify-content: space-between;
	flex-flow: column;
}
section#top_gallery div.flex div.insta_cont img.insta {
	max-width: 550px;
}
/*************  common  ***************/
h2.common_ttl img{
	width: 2.5em;
}
h2.common_ttl img.txt{
    padding: 0.5em 0 0.4em 0;
}
h2.common_ttl:after{
	bottom: 2em;
}
.ttl img.eng5{
	width: 12.5em;
}
.ttl img.eng7{
	width: 17.5em;
}
div.common{
    background-size: 150%;
}
h2.common_ttl{
	padding: 2.7em 0;
}

/***************  top  ******************/
section#top_recruit{
	background-size: contain,200%;
}
section#top_gallery{
	background-size: contain,40%,30%,200%;
}

/************  gallery  **************/
section#top_gallery, 
section#gallery div.bg01, 
section#staff div.bg01, 
section#about div.bg01, 
section#recruit div.bg01,
section#contact div.bg01{
	background-size: contain,auto,auto,200%;
}
section#top_gallery{
	padding: 3em 0 13em 0;
}
section#gallery div.bg01, section#staff div.bg01{
	background-position: center 0%,4% bottom,96% bottom,center bottom;	
}

/************  staff  **************/
section#staff div.common{
	background-position: 70% center;
}
section#staff div.bg01 div.middle_inner {
    padding-top: 6em;
}
dl.staff{
	width: 31.4%;
}	
dl.staff dd.staff_data{
	min-height: 245px;
}

/************  about  ***************/
section#about div.bg01,
section#recruit div.bg01{
	background-position: center 0%,4% bottom,96% bottom,center bottom;
}
section#town h4.border_ttl ,
section#message h4.border_ttl {
    margin-top: 4em;
}
section#about .flex h6.waraku_about img{
	width: 2.7em;
}
section#about .flex img.waraku_left, section#about .flex div.waraku_right{
	min-height: 210px;
}

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#message{
	background-size: 200%;
}
section#recruit div.tell dl.fax,
section#recruit div.tell dl.tel {
    width: 37.5%;
}
section#recruit div.tell dl.fax {
    margin-right: 10%;
}
section#recruit div.tell dl.tel {
    margin-left: 10%;
}

}


/*************** tablet *********************************************************************/
@media (max-width: 999px) {
section#top_movie .movie_container {
   width: 100% !important;	
}
section#top_movie .movie_container .video-shortcode {
    width: 96% !important;
    height: auto !important;
    margin-left: auto;
    margin-right: auto;
    display: block;
}
}