@charset "utf-8";
/*-------------------------------------*/
/*	トップページ	*/
/*-------------------------------------*/
/*初期アニメーション*/
#opening {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
 background-color:#FFFFFF;
  z-index:1000;
}
 
#opening .op_img{
  position: absolute;
top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	z-index: 1100;
	width: 100%;
	max-width: 300px;
	text-align: center;
}
#opening .op_img .logo_circle{
  position: relative;
	width: 100%;
	max-width: 300px;
	height: 300px;
	margin: 0 auto 20px auto;
	text-align: center;
}
#opening .op_img .logo_circle img{
}
#opening .op_img .logo_circle .loading02{
  position: absolute;
top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	animation: shake 2s infinite;
    transform: translate(-50%, -50%) rotate(20deg);
}
#opening .op_img .logo_circle .loading03{
  position: absolute;
top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	animation: rotate_anime 10s linear infinite;
}
/***************************************************
 * Generated by SVG Artista on 1/23/2024, 6:00:37 AM
 * MIT license (https://opensource.org/licenses/MIT)
 * W. https://svgartista.net
 **************************************************/

@-webkit-keyframes animate-svg-stroke-1{0%{stroke-dashoffset:255.27413940429688px;stroke-dasharray:255.27413940429688px}100%{stroke-dashoffset:0;stroke-dasharray:255.27413940429688px}}@keyframes animate-svg-stroke-1{0%{stroke-dashoffset:255.27413940429688px;stroke-dasharray:255.27413940429688px}100%{stroke-dashoffset:0;stroke-dasharray:255.27413940429688px}}@-webkit-keyframes animate-svg-fill-1{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-1{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-1{-webkit-animation:animate-svg-stroke-1 1s cubic-bezier(0.47,0,0.745,0.715) 0s both,animate-svg-fill-1 0.7s cubic-bezier(0.47,0,0.745,0.715) 0.8s both;animation:animate-svg-stroke-1 1s cubic-bezier(0.47,0,0.745,0.715) 0s both,animate-svg-fill-1 0.7s cubic-bezier(0.47,0,0.745,0.715) 0.8s both}@-webkit-keyframes animate-svg-stroke-2{0%{stroke-dashoffset:164.9679412841797px;stroke-dasharray:164.9679412841797px}100%{stroke-dashoffset:0;stroke-dasharray:164.9679412841797px}}@keyframes animate-svg-stroke-2{0%{stroke-dashoffset:164.9679412841797px;stroke-dasharray:164.9679412841797px}100%{stroke-dashoffset:0;stroke-dasharray:164.9679412841797px}}@-webkit-keyframes animate-svg-fill-2{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-2{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-2{-webkit-animation:animate-svg-stroke-2 1s cubic-bezier(0.47,0,0.745,0.715) 0.12s both,animate-svg-fill-2 0.7s cubic-bezier(0.47,0,0.745,0.715) 0.9s both;animation:animate-svg-stroke-2 1s cubic-bezier(0.47,0,0.745,0.715) 0.12s both,animate-svg-fill-2 0.7s cubic-bezier(0.47,0,0.745,0.715) 0.9s both}@-webkit-keyframes animate-svg-stroke-3{0%{stroke-dashoffset:296.88360595703125px;stroke-dasharray:296.88360595703125px}100%{stroke-dashoffset:0;stroke-dasharray:296.88360595703125px}}@keyframes animate-svg-stroke-3{0%{stroke-dashoffset:296.88360595703125px;stroke-dasharray:296.88360595703125px}100%{stroke-dashoffset:0;stroke-dasharray:296.88360595703125px}}@-webkit-keyframes animate-svg-fill-3{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-3{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-3{-webkit-animation:animate-svg-stroke-3 1s cubic-bezier(0.47,0,0.745,0.715) 0.24s both,animate-svg-fill-3 0.7s cubic-bezier(0.47,0,0.745,0.715) 1s both;animation:animate-svg-stroke-3 1s cubic-bezier(0.47,0,0.745,0.715) 0.24s both,animate-svg-fill-3 0.7s cubic-bezier(0.47,0,0.745,0.715) 1s both}@-webkit-keyframes animate-svg-stroke-4{0%{stroke-dashoffset:184.83770751953125px;stroke-dasharray:184.83770751953125px}100%{stroke-dashoffset:0;stroke-dasharray:184.83770751953125px}}@keyframes animate-svg-stroke-4{0%{stroke-dashoffset:184.83770751953125px;stroke-dasharray:184.83770751953125px}100%{stroke-dashoffset:0;stroke-dasharray:184.83770751953125px}}@-webkit-keyframes animate-svg-fill-4{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-4{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-4{-webkit-animation:animate-svg-stroke-4 1s cubic-bezier(0.47,0,0.745,0.715) 0.36s both,animate-svg-fill-4 0.7s cubic-bezier(0.47,0,0.745,0.715) 1.1s both;animation:animate-svg-stroke-4 1s cubic-bezier(0.47,0,0.745,0.715) 0.36s both,animate-svg-fill-4 0.7s cubic-bezier(0.47,0,0.745,0.715) 1.1s both}@-webkit-keyframes animate-svg-stroke-5{0%{stroke-dashoffset:244.23851013183594px;stroke-dasharray:244.23851013183594px}100%{stroke-dashoffset:0;stroke-dasharray:244.23851013183594px}}@keyframes animate-svg-stroke-5{0%{stroke-dashoffset:244.23851013183594px;stroke-dasharray:244.23851013183594px}100%{stroke-dashoffset:0;stroke-dasharray:244.23851013183594px}}@-webkit-keyframes animate-svg-fill-5{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-5{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-5{-webkit-animation:animate-svg-stroke-5 1s cubic-bezier(0.47,0,0.745,0.715) 0.48s both,animate-svg-fill-5 0.7s cubic-bezier(0.47,0,0.745,0.715) 1.2000000000000002s both;animation:animate-svg-stroke-5 1s cubic-bezier(0.47,0,0.745,0.715) 0.48s both,animate-svg-fill-5 0.7s cubic-bezier(0.47,0,0.745,0.715) 1.2000000000000002s both}@-webkit-keyframes animate-svg-stroke-6{0%{stroke-dashoffset:273.0772705078125px;stroke-dasharray:273.0772705078125px}100%{stroke-dashoffset:0;stroke-dasharray:273.0772705078125px}}@keyframes animate-svg-stroke-6{0%{stroke-dashoffset:273.0772705078125px;stroke-dasharray:273.0772705078125px}100%{stroke-dashoffset:0;stroke-dasharray:273.0772705078125px}}@-webkit-keyframes animate-svg-fill-6{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-6{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-6{-webkit-animation:animate-svg-stroke-6 1s cubic-bezier(0.47,0,0.745,0.715) 0.6s both,animate-svg-fill-6 0.7s cubic-bezier(0.47,0,0.745,0.715) 1.3s both;animation:animate-svg-stroke-6 1s cubic-bezier(0.47,0,0.745,0.715) 0.6s both,animate-svg-fill-6 0.7s cubic-bezier(0.47,0,0.745,0.715) 1.3s both}@-webkit-keyframes animate-svg-stroke-7{0%{stroke-dashoffset:481.8913269042969px;stroke-dasharray:481.8913269042969px}100%{stroke-dashoffset:0;stroke-dasharray:481.8913269042969px}}@keyframes animate-svg-stroke-7{0%{stroke-dashoffset:481.8913269042969px;stroke-dasharray:481.8913269042969px}100%{stroke-dashoffset:0;stroke-dasharray:481.8913269042969px}}@-webkit-keyframes animate-svg-fill-7{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-7{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-7{-webkit-animation:animate-svg-stroke-7 1s cubic-bezier(0.47,0,0.745,0.715) 0.72s both,animate-svg-fill-7 0.7s cubic-bezier(0.47,0,0.745,0.715) 1.4000000000000001s both;animation:animate-svg-stroke-7 1s cubic-bezier(0.47,0,0.745,0.715) 0.72s both,animate-svg-fill-7 0.7s cubic-bezier(0.47,0,0.745,0.715) 1.4000000000000001s both}@-webkit-keyframes animate-svg-stroke-8{0%{stroke-dashoffset:598.0185546875px;stroke-dasharray:598.0185546875px}100%{stroke-dashoffset:0;stroke-dasharray:598.0185546875px}}@keyframes animate-svg-stroke-8{0%{stroke-dashoffset:598.0185546875px;stroke-dasharray:598.0185546875px}100%{stroke-dashoffset:0;stroke-dasharray:598.0185546875px}}@-webkit-keyframes animate-svg-fill-8{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-8{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-8{-webkit-animation:animate-svg-stroke-8 1s cubic-bezier(0.47,0,0.745,0.715) 0.84s both,animate-svg-fill-8 0.7s cubic-bezier(0.47,0,0.745,0.715) 1.5s both;animation:animate-svg-stroke-8 1s cubic-bezier(0.47,0,0.745,0.715) 0.84s both,animate-svg-fill-8 0.7s cubic-bezier(0.47,0,0.745,0.715) 1.5s both}

.loading01{
	max-width: 300px;
	width: 100%;
}

@media screen and (max-width: 768px) {
#opening .op_img{
	width: 60%;
	max-width: 300px;

}	
#opening .op_img .logo_circle{
  position: relative;
	width: 100%;
	max-width: 200px;
	height: 200px;
	margin: 0 auto 20px auto;
	text-align: center;
}
}

@keyframes shake {
    50% {
        transform: translate(-50%, -50%) rotate(-20deg);
    }

    100% {
        transform: translate(-50%, -50%) rotate(20deg);
    }
}
@keyframes rotate_anime {
  0% {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}

/* #mv */
#mv{
	position: relative;
}
#mv .sld{
	margin: 0 0 0 auto;
	width: 70%;
}
.sld img{
	width: 100%;
}
.main_ttl{
	position: absolute;
	top: 0;
	left: 10%;
}
.bg_main01{
	position: absolute;
	left: 25%;
	bottom: -10%;
	width: 50%;
}
.bg_main02{
	position: absolute;
	left: 2%;
	bottom: 0;
	width: 20%;
}

@media screen and (max-width: 1360px) {
	.main_ttl{
	max-width: 200px;
}
}
@media screen and (max-width: 991px) {
	.main_ttl{
	max-width: 150px;
}
}
@media screen and (max-width: 768px) {
.main_ttl{
	position: absolute;
	top: 0;
	left: 10%;
}
	.main_ttl{
	max-width: 150px;
		left: 5%;
}
}
@media screen and (max-width: 550px) {
		.main_ttl{
	max-width: 120px;
		left: 5%;
			top: -20px;
}
.bg_main01{
	position: absolute;
	left: 45%;
}	
#mv .sld{
	width: 85%;
}	
}



/* about */
#about{
	position: relative;
	padding: 200px 0 100px 0 ;
}
#about::before{
	content: "";
	max-width: 430px;
	height: 340px;
	width: 50%;
	background-image: url("../images/bg_egg01.png");
	background-repeat: no-repeat;
	background-position: center top;
	background-size: contain;
	display: block;
	position: absolute;
	right: 10%;
	top: 0;
}
#about .container{
	position: relative;
}
#about .txt_box{
	background: #FFFFFF;
	padding: 40px;
	border-radius: 35px;
	width: 45%;
	position: absolute;
	right: 0;
	bottom: -50px;
}
#about .txt_box p{
	font-size: 2.2rem;
	font-weight: 500;
	letter-spacing: 0.1em;

}
#about .txt_box::before{
	content: "";
	width: 340px;
	height: 40px;
	background-image: url("../images/bg_glass.svg");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	    position: absolute;
    bottom: -5px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}
.img_company{
	width: 65%;	
}
@media screen and (max-width: 1200px) {
#about .txt_box p{
	font-size: 1.8rem;
}
}
@media screen and (max-width: 991px) {
#about{
	padding: 150px 0 50px 0 ;
}	
#about::before{
	background-position: center;
	max-width: 250px;
	height: 300px;
	width: 50%;
	right: 2%;
	top: 0;
}	
#about .txt_box{
	padding: 30px;
	max-width: 500px;
	width: 90%;
	position: relative;
	right: auto;
	bottom: auto;
	margin: 0 auto;
}
#about .txt_box::before{
	content: "";
	width: 200px;
	height: 40px;
		background-position: bottom;
}	
.img_company{
	width: 70%;
	margin-bottom: -40px;
	
}	
}
@media screen and (max-width: 768px) {
#about .txt_box p{
	font-size: 1.6rem;
}
.img_company{
	width: 85%;	
}	
}
@media screen and (max-width: 550px) {
#about::before{
	background-position: center;
	max-width: 250px;
	height: 250px;
}	
.img_company{
	width: 90%;
	margin-bottom: -20px;
}		
}





/* farm */
#farm{
	position: relative;
	padding: 100px 0 ;
	
}
#farm::before{
	content: "";
max-width: 480px;
	height: 480px;
	width: 50%;
		background-image: url("../images/bg_egg02.png");
	background-repeat: no-repeat;
	background-position: center top;
	background-size: contain;
	display: block;
	position: absolute;
	left: 5%;
	top: 0;
	z-index: -1;
}

@media screen and (max-width: 991px) {}
@media screen and (max-width: 768px) {
	#farm::before{
max-width: 480px;
	height: 480px;
	width: 50%;
	left: -10%;
	top: 0;
}
}
@media screen and (max-width: 550px) {
}

/* access */
#access {
	position: relative;
	background: #FFFEF4;

}
#access::before {
	content: "";
	width: 100%;
	height: 20px;
	background-image: url("../images/bg_wave_t.svg");
	background-repeat: repeat-x;
	background-position: top;
	position: absolute;
	left: 0;
	top: -19px;
}
#access::after {
	content: "";
	width: 100%;
	height: 20px;
	background-image: url("../images/bg_wave_b.svg");
	background-repeat: repeat-x;
	background-position: bottom;
	position: absolute;
	left: 0;
	bottom: -19px;
}
.map_box {
	position: relative;
}
#map{
	width: 100%;
	height: 500px;
	border-radius: 35px;
	overflow: hidden;
}
.map_box .map_info{
	background: #FFFFFF;
	max-width: 320px;
	padding: 20px;
	border-radius: 0 0 20px 20px;
	position: absolute;
	right: 30px;
	top: 0;
	box-shadow: 0 0 10px gray;
	text-align: center;
}
.map_box .map_info img{
	margin-bottom: 10px;
}
.map_box .map_info .subttl{
	font-family: 'Zen Maru Gothic', serif;
	font-size: 1.8rem;
	font-weight: 600;
	margin-bottom: 10px;
}
.map_box .map_info h3{
	font-family: 'Zen Maru Gothic', serif;
	font-size: 2.4rem;
	font-weight: 600;
	margin-bottom: 10px;
}
.map_box .map_info .tel{
	margin-bottom: 10px;
}
.map_box .map_info .tel a{
	color: #EB6143;
	font-size: 1.8rem;
	font-weight: 600;
}
.map_box .map_info .bt_map{
	color: #EB6143;
	font-family: 'Zen Maru Gothic', serif;
	font-size: 1.8rem;
	font-weight: 500;
	display: block;
	border: 2px solid #EB6143;
	border-radius: 50px;
	line-height: 1;
	padding: 0.5em;
	background: #FFFFFF;
}
.map_box .map_info .bt_map:hover{
	background: #EB6143;
	color: #FFFFFF;

}
@media screen and (max-width: 1200px) {
.map_box .map_info{
	background: #FFFFFF;
	max-width: 280px;
	padding: 15px;
	right: 20px;
}
.map_box .map_info .subttl{
	font-size: 1.4rem;
}
.map_box .map_info h3{
	font-size: 2.0rem;
}
.map_box .map_info .tel a{
	font-size: 1.6rem;
}
.map_box .map_info .bt_map{
	font-size: 1.6rem;
}
}
@media screen and (max-width: 991px) {
	#map{
	width: 100%;
	height: 300px;
	border-radius: 35px;
		margin-bottom: 40px;
}
.map_box .map_info{
	background: none;
	box-shadow: none;
	max-width: 300px;
	width: 100%;
	padding: 20px;
	right: auto;
	top: auto;
	position: relative;
	margin: 0 auto;
}
}
@media screen and (max-width: 768px) {

}
@media screen and (max-width: 550px) {
	
}

/* company */
.gaiyo{
	background: #FFFFFF;
	width: 100%;
	border-radius: 35px;
	overflow: hidden;
	line-height: 1.7;
}
.gaiyo a{
	text-decoration: underline;

}

.gaiyo, .gaiyo td, .gaiyo th {
  border-collapse: collapse;
	  border-bottom: 2px dotted #462E2E;
}
.gaiyo td, .gaiyo th {
  padding: 1.5em 0.5em;
}
.gaiyo th {

  width: 25%;
	text-align: center;
	font-weight: 600;
	font-family: 'Zen Maru Gothic', serif;
	font-size: 1.8rem;
}
.gaiyo td {
}
@media screen and (max-width: 991px) {

}
@media screen and (max-width: 768px) {

}
@media screen and (max-width: 550px) {
.gaiyo th {

  width: 30%;
	font-size: 1.6rem;
}	
}

/* recruit */
#recruit .caption{
	font-size: 3.6rem;
	font-weight: 600;
	text-align: center;
		font-family: 'Zen Maru Gothic', serif;
	margin-bottom: 30px;
}
#recruit .caption span{
	font-weight: 600;
	vertical-align: baseline;
	background:linear-gradient(transparent 60%, #FFE45F 60%);

}
.recruit_sld{
	position: relative;	
	margin-bottom: 40px;
}
.rec_box{
	position: relative;
}
.bg_recruit01{
	position: absolute;
	right: 0;
	top: 10%;
}
.bg_recruit02{
	position: absolute;
	left: 10%;
	bottom: 10%;
}
.bg_recruit03{
	position: absolute;
	left: 10%;
	top: 30%;
}
@media screen and (max-width: 1400px) {
.recruit_sld .sld{
width: 90%;
	margin: 0 auto;
}	
.bg_recruit01{
	position: absolute;
	right: 0;
	top: 0%;
}
.bg_recruit02{
	position: absolute;
	left: 5%;
	bottom: 10%;
}
.bg_recruit03{
	position: absolute;
	left: 5%;
	top: 10%;
}
}
@media screen and (max-width: 991px) {
#recruit .caption{
	font-size: 2.4rem;
}
.bg_recruit01{
	position: absolute;
	right: 0;
	top: 5%;
	width: 40%;
}
.bg_recruit02{
	position: absolute;
	left: 0;
	bottom: 10%;
	width: 40%;
}
.bg_recruit03{
	position: absolute;
	left: 5%;
	top: 0%;
}
}
@media screen and (max-width: 768px) {
#recruit .caption{
	font-size: 2.4rem;
}
	.bg_recruit03{
	position: absolute;
	left: 5%;
	top: 0%;
		width: 20%;
		max-width: 100px;
}
}
@media screen and (max-width: 550px) {
.bg_recruit01 {
    position: absolute;
    right: 0;
    bottom: 0%;
    top: auto;
    width: 40%;
}	
}
/*----------------------------------------
	共通
-----------------------------------------*/
.ttl {
  font-size: 4.5rem;
  font-weight: 600;
  line-height: 1.5;
  margin-bottom: 80px;
 font-family: 'Zen Maru Gothic', serif;
  text-align: center;
  letter-spacing: 0.05em;
  position: relative;
}
.ttl span {
  font-size: 1.8rem;
  font-weight: 500;
  font-family: 'Roboto Condensed', sans-serif;
  display: block;
  text-transform: uppercase;
  position: relative;
  line-height: 1;
	color: #E9A93F;
	
}
.ttl::before {
  content: "";
  width: 106px;
  height: 17px;
  background-image: url("../images/bg_h.svg");
  background-size: auto;
  position: absolute;
  bottom: -30px;;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}
.midashi03{
	font-weight: 600;
	font-family: 'Zen Maru Gothic', serif;
	font-size: 3.6rem;
	margin-bottom: 20px;
	padding-left: 20px;
	border-left: 5px solid #462E2E;
	line-height: 1.5;
}
.midashi04{
	font-weight: 600;
	font-family: 'Zen Maru Gothic', serif;
	font-size: 2.4rem;
	margin-bottom: 20px;
	padding: 0.5em 1em;
	background: #C5D385;
	line-height: 1.5;
	border-radius: 20px;
}
.radius35{
	border-radius: 35px;
	overflow: hidden;
}
/*2列レイアウト*/
.col-2_list {
  display: flex;
  flex-wrap: wrap;
  gap: 40px 20px;
  justify-content: space-between;
}
.col-2_list::after {
  content: "";
  display: block;
  width: calc(100% / 2 - 20px);
}
.col-2_list .col_box {
  width: calc(100% / 2 - 20px);
}
/*3列*/
.col-3_list {
  display: flex;
  flex-wrap: wrap;
  gap: 40px 20px;
  justify-content: space-between;
}
.col-3_list::after {
  content: "";
  display: block;
  width: calc(100% / 3 - 20px);
}
.col-3_list .col_box {
  width: calc(100% / 3 - 20px);
}

@media(max-width: 768px) {
.ttl {
  font-size: 3.0rem;
  margin-bottom: 40px;
}
.ttl span {
  font-size: 1.4rem;	
}
.ttl::before {
  bottom: -20px;;
}	
  .subttl {
    font-size: 2.8rem;
  }
  .col_box {
    margin: 0 auto;
  }
.midashi03{
	font-size: 2.8rem;
}
.midashi04{
	font-size: 2.0rem;
}
}
@media(max-width: 550px) {
  .ttl, .ttl02 {
    font-size: 2.8rem;
  }
  .ttl span {
    font-size: 2rem;
  }
  /*3列*/
  .col-2_list, .col-3_list {
    gap: 20px 20px;
    flex-direction: column;
  }
  .col-2_list .col_box, .col-3_list .col_box {
    width: 100%;
    max-width: 400px;
	  margin: 0 auto;
  }	
}