@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Josefin+Slab:400i|Noto+Sans+JP|Noto+Serif+JP');

body {
  color: #eee;
  background-color: #000;
  font: 14px/2 "Open sans", sans-serif;
  letter-spacing: 0.05em;
  font-feature-settings: "palt";
  position: relative;
  cursor: none; /*もともとあるカーソルは非表示に*/
  height: 100vh;
}

/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*----------------------- PC -----------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/

@media screen and (min-width: 750px) {

a { cursor: none; /*もともとあるカーソルは非表示に*/ }
#cursor {
  position: fixed;
  /*丸の大きさと色の指定*/
  background: #fff;
  border-radius:10px;
  width: 20px;
  height: 20px;
  margin: -10px 0 0 -10px;/*真ん中にくるようにマイナスマージンで調整*/
  z-index: 1000;/*一番手前に来るように*/
  pointer-events: none;/*クリックできなくなるのを防ぐため。noneで対応*/
  opacity: 0;
}
#stalker{
  position: fixed;
  /*丸の大きさと色の指定*/
  background: #f6c744;
  width: 40px;
  height: 40px;
  border-radius: 30px;
  margin: -20px 0 0 -20px;/*真ん中にくるようにマイナスマージンで調整*/
  z-index: 999;/*カーソルの後ろに来るように*/
  pointer-events: none;/*クリックできなくなるのを防ぐため。noneで対応*/
  opacity: 0;
}

/*----------------------   header   ----------------------*/

#sp { display: none; }

/*----------------------   top   ----------------------*/
/*-LOGO-*/
#top img {
  display: block;
  width: 15vw;
  margin: 0 auto;
  position: relative;
  z-index: 100;
  position: absolute;
  top: 10%;
  left: 15%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}
/*
.slider { position: relative; }
#slider {
  position: relative;
  overflow: hidden;
  width: 100% !important;
}
#slider ul {
  position: relative;
  margin: 0;
  padding: 0;
  height: 100vh;
  width: 99999px;
  overflow: hidden;
  list-style: none;
}
#slider ul li {
  position: relative;
  display: block;
  float: left;
  margin: 0;
  padding: 0;
  width: 100vw;
  height: 100vh;
  text-align: center;
}
#slider ul li .slide {
  background-size: cover;
  height: 100vh;
}
*/
/* 複数画像切り替え---------------------------------------------- */
.slider-container {
  position: relative;
  width: 100%;
  height: 1000px;
  overflow: hidden;
}

.slideimg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: 0;
  background-size: cover;/* 画像をスライド全体にカバー */
  animation: slideAnime 36s infinite; /* 12秒で1サイクル */
}



@keyframes slideAnime {
  0%, 30%, 100% { opacity: 0; }/* スライドの非表示タイミング */
  10%, 20% { opacity: 1; }/* スライドの表示タイミング */
}


/* 各スライドのアニメーションタイミングを均等にずらす */
.slideimg:nth-of-type(1){
  background-image: url('../image/main1.jpg');
  animation-delay: 0s;
  background-position:center;
}
/* 米系 */
.slideimg:nth-of-type(2) {
  background-image: url('../image/kome10top.jpg');
  animation-delay: 4s;
  background-position:center;
}

.slideimg:nth-of-type(3) {
  background-image: url('../image/DSC02197.jpg');
  animation-delay: 7s;
  background-position:center;
}
/* トマトor作物*/

.slideimg:nth-of-type(4) {
  background-image: url('../image/DSC02002.jpg');
  animation-delay: 10s;
   background-position:center;
}


.slideimg:nth-of-type(5){
  background-image: url('../image/tomato.jpg');
     animation-delay:13s;
  background-position:center;
}

.slideimg:nth-of-type(6) {
  background-image: url('../image/HUSA.jpg');
  animation-delay:16s;
  background-position:center;
}

/* hana*/

.slideimg:nth-of-type(7) {
  background-image: url('../image/hanapc.jpg');
  animation-delay:18s;
  background-position:center;
}

.slideimg:nth-of-type(8) {
  background-image: url('../image/hana3.jpg');
  animation-delay:21s;
  background-position:center;
}

/* 風景 */

.slideimg:nth-of-type(9) {
  background-image: url('../image/DSC00223.jpg');
  animation-delay:23s;
  background-position:center;
}

.slideimg:nth-of-type(10){
  background-image: url('../image/tf1.jpg');
  animation-delay:26s;
  background-position:center;
}

.slideimg:nth-of-type(11){
  background-image: url('../image/DSC00180.jpg');
  animation-delay:29s;
  background-position:center;
}

.slideimg:nth-of-type(12){
  background-image: url('../image/main1.jpg');
  animation-delay:33s;
  background-position:center;
}


/*
#slider ul li .slide.image01 { background-image: url('../image/DSC02197.jpg'); }
#slider ul li .slide.image02 { background-image: url('../image/DSC02190.jpg'); }
#slider ul li .slide.image03 { background-image: url('../image/DSC02002.jpg'); }
#slider ul li .slide.image04 { background-image: url('../image/hanapc.jpg'); }

button.control_prev, button.control_next {
  position: absolute;
  top: 50%;
  z-index: 10;
  display: block;
  border: none;
  width: 2em;
  height: 2em;
  line-height: 1.9em;
  background: rgba(255, 255, 255, 0.3);
  color: #fff;
  text-align: center;
  text-decoration: none;
  font-weight: 600;
  font-size: 2rem;
  opacity: 0.8;
  border-radius: 50%;
  cursor: none; 
  transform: translateY(-50%);
}
button.control_prev:focus, button.control_next:focus {
  outline: none;
  border: 1px rgba(255, 255, 255, 0.5) solid;
}
button.control_prev:hover, button.control_next:hover {
  opacity: 1;
  -webkit-transition: all 0.2s ease;
}
button.control_prev { left: 2rem; }
button.control_next { right: 2rem; }
.progress {
  position: absolute;
  background: rgba(255, 255, 255, 0.3);
  height: 0.5rem;
  width: 100%;
  bottom: 0;
  border-top: 1px rgba(0, 0, 0, 0.15) solid;
}
.progress .bar {
  height: 100%;
  width: 0%;
  background: #fff;
}
.teaser {
  position: absolute;
  top: 50%;
  text-align: center;
  width: 100%;
  color: #fff;
  transform: translateY(-50%);
}
.teaser h2 {
  font-size: 5em;
  text-transform: uppercase;
  line-height: 1.5em;
  color: #fff;
}
.teaser p {
  font-size: 1.3em;
  line-height: 1.3em;
  width: 33%;
  min-width: 25rem;
  margin: 0rem auto;
  padding: 1.5rem 0;
}
.teaser h3 {
  width: 33%;
  padding: 1.5rem 0;
  margin: 0rem auto;
  min-width: 25rem;
}
.teaser a {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}
*/
/*----------------------   content01   ----------------------*/

#content01 div.box.sp , br.sp { display: none; }
#content01 {
  display: block;
  width: 1200px;
  height: 1200px;
  margin: 200px auto 450px;
  position: relative;
  z-index: 100;
}
#content01 h2 {
  text-align: center;
  margin: 50px auto 100px;
  position: relative;
  font-size: 60px;
  color: white;
  font-family: "NK_Monotype Corsiva","Monotype Corsiva",serif;
  font-feature-settings: "palt";
}
#content01 img.top {
  display: block;
  width: 80%;
  height: 65%;
  position: absolute;
  top: 50;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  z-index: 10;
}
.js-fade01 {
  opacity: 0;
  visibility: hidden;
  transform: translateY(50px);
  transition: opacity 10s,visibility 15s, transform 15s;
}
.js-fade02 {
  opacity: 0;
  visibility: hidden;
  transform: translateY(0);
  transition: opacity 1s,visibility 1s, transform 1s;
}
.js-fade03 {
  opacity: 0;
  visibility: hidden;
  transform: translateY(50px);
  transition: opacity 1s,visibility 1s, transform 1s;
}
.scroll {
  opacity: 1;
  visibility: visible;
  transform: translateY(0px);
}
/*== 押し込む円 */
.pushcircle {
    /*周囲の線の起点とするためrelativeを指定*/
  position: relative;
    /*円の形状*/
  width: 100px;
  height: 100px;
  box-sizing: border-box;
  padding: 0 10px;
  text-align: center;
  background: white;
  border-radius: 50%;
  color: #111;
  text-decoration: none;
  outline: none;
  /*天地中央にテキストを配置*/
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
}
/*内側の線*/
.pushcircle:after {
  content: "";
    /*絶対配置で線の位置を決める*/
  position: absolute;
  top: 50%;
  left: 50%;
    /*線の形状*/
  width: 85%;
  height: 85%;
  border: 2px solid #333;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(1.1);
    /*アニメーションの指定*/
  transition: .75s ease;
}
/*hoverをしたら枠線が小さくなる*/
.pushcircle:hover:after {
  transform: translate(-50%, -50%) scale(1);
  border-color: #111;
}
.box a { cursor: none; /*もともとあるカーソルは非表示に*/ }
.box a.yuki {
  width: 80px;
  height: 80px;
  position: absolute;
  top: 180px;
  right: 400px;
  cursor: none;
}
.pushcircle img.yuki {
  position: absolute;
  top: 20px;
  left: 15px;
  display: block;
  width: 35%;
  z-index: 101;
}
.box a.kari {
  width: 100px;
  height:100px;
  position: absolute;
  top: 180px;
  right: 220px;
  cursor: none;
}
.pushcircle img.kari {
  position: absolute;
  top: 20px;
  left: 50px;
  display: block;
  width: 35%;
  z-index: 101;
}
.box a.kari2 {
  width: 120px;
  height: 120px;
  position: absolute;
  top: 300px;
  right: 100px;
  cursor: none;
}
.pushcircle img.kari2 {
  position: absolute;
  top: 50px;
  left: 0px;
  display: block;
  width: 35%;
  z-index: 101;
}
.box a.tasuke {
  width: 185px;
  height: 185px;
  position: absolute;
  top: 350px;
  right: 269px;
}
.pushcircle img.tasuke {
  position: absolute;
  position: absolute;
  top: 25%;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  display: block;
  width: 50%;
  z-index: 101;
}
.box a.nou {
  width: 120px;
  height: 120px;
  position: absolute;
  top: 280px;
  right: 490px;
}
.pushcircle img.nou {
  position: absolute;
  bottom: 23px;
  right: 25px;
  display: block;
  width: 35%;
  z-index: 101;
}
.box a.motome {
  width: 120px;
  height: 120px;
  position: absolute;
  top: 240px;
  left: 150px;
}
.pushcircle img.motome {
  position: absolute;
  bottom: 23px;
  right: 18px;
  display: block;
  width: 35%;
  z-index: 101;
}
.box a.naka {
  width: 180px;
  height: 180px;
  position: absolute;
  top: 290px;
  left: 340px;
}
.pushcircle img.naka {
  position: absolute;
  top: 25%;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  display: block;
  width: 50%;
  z-index: 101;
}
.box a.shoku {
  width: 180px;
  height: 180px;
  position: absolute;
  bottom: 290px;
  left: 180px;
}
.pushcircle img.shoku {
  position: absolute;
  top: 20%;
  left: 48%;
  transform: translateX(-52%);
  -webkit-transform: translateX(-52%);
  -ms-transform: translateX(-52%);
  display: block;
  width: 53%;
  z-index: 101;
}
.box a.syu {
  width: 105px;
  height: 105px;
  position: absolute;
  bottom: 200px;
  left: 350px;
}
.pushcircle img.syu {
  position: absolute;
  bottom: 24px;
  right: 25px;
  display: block;
  width: 35%;
  z-index: 101;
}
.box a.koromo {
  width: 180px;
  height: 180px;
  position: absolute;
  bottom: 220px;
  right: 380px;
}
.pushcircle img.koromo {
  position: absolute;
  top: 25%;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  display: block;
  width: 50%;
  z-index: 101;
}
.box a.kau {
  width: 135px;
  height: 135px;
  position: absolute;
  bottom: 120px;
  right: 580px;
}
.pushcircle img.kau {
  position: absolute;
  bottom: 20px;
  left: 35px;
  display: block;
  width: 28%;
  z-index: 101;
}
.box a.toi {
  width: 180px;
  height: 180px;
  position: absolute;
  bottom: 580px;
  right: 1050px;
}
.pushcircle img.toi {
  position: absolute;
  bottom: 40px;
  left: 85px;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  display: block;
  width: 50%;
  z-index: 101;
}
.box a.ki {
  width: 180px;
  height: 180px;
  position: absolute;
  bottom: 310px;
  right: 50px;
}
.pushcircle img.ki {
  position: absolute;
  bottom: 50px;
  left: 90px;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  display: block;
  width: 50%;
  z-index: 101;
}
.textbox {
  text-align: center;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  display: block;
  margin: -300px auto;
  width: 800px;
  height: 300px;
  overflow: hidden;
}
.textbox p {
  display: block;
  font-size: 18px;
  padding: 10px 0;
  line-height: 2.2;
  font-family:serif; 
}
.textbox h3 { 
 font-size: 40px;
 font-family:serif; 
}
#content01 h4 {
  position: absolute;
  top: 450px;
  right: 90px;
  font-size: 15px;
  display: flex;
  padding-left: 10px;
  color: #cd5c5c;
}
#content01 h4::before {
  content: '';
  width: 70px;
  height: 15px;
  margin: 0 5px;
  border-bottom: solid 1px;
  border-left: solid 1px;
  transform: skew(-45deg);
}
#content01 .border {
  display: block;
  width: 1600px;
  height: 1650px;
  position: absolute;
  top: -70px;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  z-index: 10;
  border: #777 2px solid;
}

/*----------------------   content02   ----------------------*/

#content02 .content_wrap .inner_wrap.sp { display: none; }
#content02 {
  width: 100%;
  position: relative;
  /*
  background-image: url('../image/2.jpg');
  background-attachment: fixed;
  background-size: cover;*/
}
#content02 .content_wrap {
  display: block;
  width: 1200px;
  padding: 50px 0 100px;
  margin: 10px auto 50px;
  position: relative;
  z-index: 100;
}
#content02 .content_wrap h2 {
  text-align: center;
  margin: 50px auto 100px;
  position: relative;
  font-size: 70px;
  font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
  color: #f6c744;
  text-shadow: 1px 2px 3px #808080;
}
#content02 .textbox {
  text-align: center;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  display: block;
  margin: -300px auto;
  width: 800px;
  height: 300px;
  overflow: hidden;
  font-size: 18px;
  font-family:serif ;
}
#content02 .content_wrap .inner_wrap {
  width: 100%;
  margin: 0 auto 100px;
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}
#content02 .content_wrap .hover {
  position: relative;
  width: 320px;
  height: 320px;
}
#content02 .content_wrap .hover .hover-img {
  margin: 0;
  padding: 0;
}
#content02 .content_wrap .hover-img img {
  width: 100%;
  height: 100%;
}
#content02 .content_wrap .hover .hover-text {
  position: absolute;
  width: 320px;
  height: 320px;
  top: 0;
  left: 0;
  color: #fff;
  background-color: rgba(0,0,0,0.65);
  opacity: 0;
  transition: .3s ease-in-out;
  display: table;
}
#content02 .content_wrap .hover .hover-text .text1 {
  display: table-cell;
  vertical-align: middle;
  font-size: 22px;
  padding: 0 20px;
  text-align: left;
  font-family:serif; 
}
#content02 .content_wrap .hover:hover .hover-text { /*不透明にして表示*/ opacity: 1; }
a.btn_13 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-align: center;
  text-decoration: none;
  width: 400px;
  margin: auto;
  padding: 1rem 4rem;
  font-weight: bold;
  background: #eee;
  color: #111;
  border-radius: 100vh;
  position: relative;
  transition: 0.5s;
}

a.btn_13::before {
  content: '';
  position: absolute;
  top: calc(50% - 2px);
  right: 1em;
  transform: translateY(calc(-50% - 2px)) rotate(45deg);
  width: 10px;
  height: 1px;
  background: #111;
}
a.btn_13::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 1em;
  transform: translateY(-50%);
  width: 50px;
  height: 1px;
  background-color: #111;
}
a.btn_13:hover {
  background: #999;
  color: #333;
}

#content02 .content_wrap .hover:hover .hover-text { /*不透明にして表示*/ opacity: 1; }
a.btn_14 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-align: center;
  text-decoration: none;
  width: 400px;
  margin: auto;
  padding: 2rem 2.5rem;
  font-weight: bold;
  background:  #02114D;
  color: wihte;
  border-radius: 100vh;
  position: relative;
  transition: 0.5s;
}
a.btn_14::before {
  content: '';
  position: absolute;
  top: calc(50% - 2px);
  right: 1em;
  transform: translateY(calc(-50% - 2px)) rotate(45deg);
  width: 10px;
  height: 1px;
  background:white;
}
a.btn_14::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 1em;
  transform: translateY(-50%);
  width: 50px;
  height: 1px;
  background-color: white;
}
a.btn_14:hover {
  background: #999;
  color: #333;
}

/*----------------------   content03   ----------------------*/

#content03 .inner_box.sp { display: none; }
#content03 {
  display: block;
  width: 1200px;
  margin: 0 auto 100px;
  position: relative;
  z-index: 100;
}
#content03 h2 {
  text-align: center;
  position: relative;
  font-size: 70px;
  color: #f6c744;
  font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
}
#content03 h3 {
  font-size: 18px;
  text-align: center;
   font-family:serif;
}
#content03 h4 {
  font-size: 16px;
  font-weight: bold;
  font-family:serif;
}
#content03 h5 {
  font-size: 16px;
  font-weight: bold;
  color:#cd5c5c;
  font-family:serif;
}

#content03 .inner_box {
  display: block;
  width: 1000px;
  margin: 50px auto 0;
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}
#content03 .inner_box div {
  display: block;
  width: 230px;
  margin: 0 10px;
  position: relative;
}
#content03 .inner_box div img {
  display: block;
  width: 100%;
  margin-bottom: 10px;
}
#content03 .inner_box div p {
  font-feature-settings: "palt";
  padding-top: 10px;
  font-family:serif;
}


/*----------------------   content04   ----------------------

#content04 {
  width: 100%;
  position: relative;
  padding: 50px 0 100px;
  margin: 200px auto;
  background-image: url('../image/wrap02.png');
  background-attachment: fixed;
  background-size: 100%;
}
.content04_wrap {
  display: block;
  width: 1200px;
  margin: 0 auto;
  position: relative;
  z-index: 100;
}
.content04_wrap h2 {
  text-align: center;
  margin: 50px auto 100px;
  position: relative;
  font-size: 45px;
  color:#f6c744;
  font-family: arial black;
}
.content04_wrap .inner_wrap {
  width: 100%;
  margin: 0 auto 100px;
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}
.content04_wrap .hover {
  position: relative;
  width: 320px;
  height: 320px;
  margin-bottom: 50px;
}
.content04_wrap .hover .hover-img {
  margin: 0;
  padding-bottom: 10px;
}
.content04_wrap .hover-img img {
  width: 100%;
  height: 100%;
}
.content04_wrap .my-parts {
  display: inline-block;
  width: 50px;
  height: 50px;
  position: relative;
  box-shadow: 0 0 0 1px rgba(0,0,0,.1);
}
.content04_wrap .my-parts span {
  position: absolute;
  display: block;
  top: 50%;
  left: 50%;
  width: 84%;
  height: 84%;
  margin: -42% 0 0 -42%;
  border-radius: 50%;
}
.content04_wrap .my-parts span img {
  position: absolute;
  display: block;
  width: 100%;
  top: 0%;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transition: 0.5s;
}
.content04_wrap .my-parts span img:hover { opacity: .5; }
.content04_wrap .btn_13 { margin-top: 150px; }


/*----------------------   content20   ----------------------*/

#content20 {
  width: 100%;
  position: relative;
  padding: 200px 100px 300px;
  margin: 100px auto 50px;
  background-image: url('../image/IMG_3740.png');
background-color:rgba(0,0,0,0.20);
background-blend-mode:lighten;
  background-attachment: fixed;
  background-size: 120%;
}
#content20 .bg { display: none; }
#content20 h2 {
  text-align: center;
  margin: 50px auto 50px;
  position: relative;
  font-size:70px;
  color: #f6c744;
  font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
 /*text-shadow: 1px 2px 3px #808080;*/
  line-height: 1.25;
}
#content20 h1 {
  text-align: center;
  margin: 0px auto;
  padding-top: 0px;
  position: relative;
  font-size: 1.5vw;
  font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
  color: #cd5c5c;
  /*text-shadow: 1px 2px 3px #808080;*/
  line-height: 1;
}
#content20 .content_wrap h3 {
  font-size: 20px;
  text-align: center;
  margin: 0 auto 12px;
  color: #fff;
  /*text-shadow: 1px 2px 3px #808080;*/
  font-family:serif;
}
#content20 .content_wrap h4 {
  font-size: 17px;
  text-align: center;
  margin: -50px auto 12px;
  color: #fff;
  /*text-shadow: 1px 2px 3px #808080;*/
  font-family:serif;
}
#content20 .content_wrap p {
  font-size: 20px;
  text-align: center;
  margin: 100px 100px 50px;
  color: #fff;
  /*text-shadow: 1px 2px 3px #000000;*/
  font-family:serif;
}
p .big {
  font-size: 30px; /* px, em, % などでも可 */
  font-weight: 600;
}
p .big1 {
  font-size: 35px; /* px, em, % などでも可 */
  font-weight: 600;
}
.image-box {
  margin: -30px auto 0;
  width: auto;      /* DIVの幅 */
  height: auto;     /* DIVの高さ */
  border: 0px solid #ccc; /* 枠線（任意） */
  overflow: hidden;  /* はみ出しを隠す */
  text-align: center;
}
.image-box2 {
  margin: 45px auto 12px;
  width: auto;      /* DIVの幅 */
  height: auto;     /* DIVの高さ */
  border: 0px solid #ccc; /* 枠線（任意） */
  overflow: hidden;  /* はみ出しを隠す */
  text-align: center;
}

.image-box img {
  width: 25%;       /* 画像をDIVの幅に合わせる */
  height: 100%;      /* 高さも合わせる */
  object-fit: cover; /* 画像をトリミングしてフィット */
}
.image-box2 img {
  width: 15%;       /* 画像をDIVの幅に合わせる */
  height: 100%;      /* 高さも合わせる */
  object-fit: cover; /* 画像をトリミングしてフィット */
  filter: invert(100%); /* 色を反転させる */
}

/*----------------------   content05   ----------------------*/

#content05 {
  width: 100%;
  position: relative;
  padding: 50px 0 100px;
  margin: 100px auto 50px;
  background-image: url('../image/wanted1.png');
  background-attachment: fixed;
  background-size: 100%;
}
#content05 .bg { display: none; }
#content05 h2 {
  text-align: center;
  margin: 100px auto 50px;
  position: relative;
  font-size:70px;
  color: #f6c744;
  font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
  text-shadow: 1px 2px 3px #808080;
  line-height: 1.25;
}
#content05 h1 {
  text-align: center;
  margin: 0px auto;
  padding-top: 0px;
  position: relative;
  font-size: 1.5vw;
  font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
  color: #cd5c5c;
  text-shadow: 1px 2px 3px #808080;
  line-height: 1;
}
#content05 .content_wrap h3 {
  font-size: 20px;
  text-align: center;
  margin: 0 auto 12px;
  color: #fff;
  text-shadow: 1px 2px 3px #808080;
  font-family:serif;
}
#content05 .content_wrap h4 {
  font-size: 17px;
  text-align: center;
  margin: -50px auto 12px;
  color: #fff;
  text-shadow: 1px 2px 3px #808080;
  font-family:serif;
}
#content05 .content_wrap p {
  font-size: 30px;
  text-align: center;
  margin: 0 auto 50px;
  color: #fff;
  text-shadow: 1px 2px 3px #808080;
  font-family:serif;
}


/*----------------------   content06   ----------------------*/

#content06 {
  display: block;
  width: 100%;
  margin: 150px auto 60px;
  position: relative;
  z-index: 100;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  background-image: url('../image/2.jpg');
  background-attachment: fixed;
  background-size: cover;
  }
.content06_wrap {
  display: block;
  width: 1200px;
  margin: 0 auto;
  position: relative;
  z-index: 100;
  font-feature-settings: "palt";
}
.content06_wrap h2 {
  text-align: center;
  margin: 100px auto 100px;
  position: relative;
  font-size: 70px;
  color: #f6c744;
  font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
}
.content06_wrap .inner_wrap {
  width: 100%;
  margin: 0 auto 100px;
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}
.content06_wrap .hover-text {
  position: absolute;
  width: 94%;
  height: 100%;
  top: 0%;
  left: 0%;
  color: #fff;
  background-color: rgba(0,0,0,0.65);
  opacity: 0;
  transition: .3s ease-in-out;
  overflow: hidden;
}
.content06_wrap .hover-text .text1 {
  position: absolute;
  width: 90%;
  height: 100%;
  padding: 20px 10px;
  top: 0%;
  left: 0%;
  font-size: 13px;
  line-height: 1.5;
  font-weight: bold;
}
.content06_wrap .hover-text .text2 {
  font-size: 11px;
  line-height: 1.5;
}
.content06_wrap #photo1:hover .hover-text ,
.content06_wrap #photo2:hover .hover-text ,
.content06_wrap #photo3:hover .hover-text ,
.content06_wrap #photo4:hover .hover-text ,
.content06_wrap #photo5:hover .hover-text ,
.content06_wrap #photo6:hover .hover-text ,
.content06_wrap #photo7:hover .hover-text ,
.content06_wrap #photo8:hover .hover-text { opacity: 1; }
#stage {
  position: relative;
  width: 90%;
  overflow: hidden;
}
#photos {
  position: absolute;
  width: 100%;
  left: 1%;
  top: 10px;
  transition: left 1s ease;
}
.pic {
  width: 20%;
  position: absolute;
}
.pic img { width:94%; }
#photo1 { left:0%; }
#photo2 { left:20%; }
#photo3 { left:40%; }
#photo4 { left:60%; }
#photo5 { left:80%; }
#photo6 { left:100%; }
#photo7 { left:120%; }
#photo8 { left:140%; }
#btns {
  width: 20%;
  margin: 20px auto 50px;
  position: relative;
}
.p_bar {
  display: block;
  width: 20%;
  height: 8px;
  background: #aaa;
}
.p_bar {
  position: absolute;
  top: 8px;
}
#p_btn {
  display: block;
  width: 20%;
  height: 8px;
  background: #f00;
  z-index: 20;
  position: absolute;
  top: 8px;
}
#btn1 { left: 0%; }
#btn2 { left: 26%; }
#btn3 { left: 54%; }
#btn4 { left: 82%; }
#p_btn {
  left: 0%;
  transition:left 1s ease;
  pointer-events: none;
}
#r1,#r2,#r3,#r4,#b2,#b3,#b4,#f5,#f6,#f7,.p-slide { display:none; }
#r1:checked ~ #photos { left: 1%;   }
#r2:checked ~ #photos { left: -19%; }
#r3:checked ~ #photos { left: -39%; }
#r4:checked ~ #photos { left: -59%; }
#r1:checked ~ #btns #p_btn { left: 0%; }
#r2:checked ~ #btns #p_btn { left: 26%; }
#r3:checked ~ #btns #p_btn { left: 54%; }
#r4:checked ~ #btns #p_btn { left: 82%; }
.left_btn,.right_btn {
  position: fixed;
  opacity: 0;
}
/*
.left_btn {
  position: relative;
  display: block;
  width: 51px;
  height: 51px;
  left: 12%;
  top: -50%;
  background: url('../image/back_1.png');
}
.left_btn:hover {
  background: url('../image/back_2.png');
  cursor: pointer;
}
.right_btn {
  display: block;
  width: 51px;
  height: 51px;
  right: 3%;
  top: -50%;
  background: url('../image/forward_1.png');
}
.right_btn:hover {
  background: url('../image/forward_2.png');
  cursor: pointer;
}
/* 画像hoverで送り・戻りボタンを表示 */
.pic label span { pointer-events:none; }
/* スライドのhoverで該当する送りボタンを表示・アクティブ化する */
#photo1:hover > label span,#photo2:hover > label span,#photo3:hover > label span,#photo4:hover > label span,#photo5:hover > label span,#photo6:hover > label span,#photo7:hover > label span,#photo8:hover > label span {
  pointer-events:auto;
  opacity:1;
}
/* 送りボタンクリック時のanimation設定 */
#b2:checked ~ #photos { left:1%; }
#b3:checked ~ #photos { left:-19%; }
#b4:checked ~ #photos { left:-39%; }
#f5:checked ~ #photos { left:-19%; }
#f6:checked ~ #photos { left:-39%; }
#f7:checked ~ #photos { left:-59%; }
#b2:checked ~ #btns #p_btn { left:0%;  }
#b3:checked ~ #btns #p_btn { left:12%; }
#b4:checked ~ #btns #p_btn { left:24%; }
#f5:checked ~ #btns #p_btn { left:12%; }
#f6:checked ~ #btns #p_btn { left:24%; }
#f7:checked ~ #btns #p_btn { left:36%; }

/*----------------------   content07   ----------------------*/

#content07 {
  display: block;
  width: 1200px;
  margin: 0 auto;
  position: relative;
  font-feature-settings: "palt";
  text-align: center;
}
#content07 h2 {
  text-align: center;
  margin: 100px auto 50px;
  position: relative;
  font-size: 70px;
  color: #f6c744;
  font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
}
#content07 .inner_wrap {
  width: 100%;
  margin: 0 auto;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
#content07 .carousel {
  display: flex;
  justify-content: center;
}
#content07 .contains {
  width: 70vw;
  height: 80vh;
  overflow: hidden;
  position: relative;
  padding: 0;
  list-style: none;
}
#content07 .slide_select { display: none; }
#content07 .slide {
  width: 70vw;
  height: 80vh;
  position: absolute;
  opacity: 0;
}
#content07 .slide img {
  display: block;
  width: 100%;
}
#content07 .scroll_button {
  position: absolute;
  display: block;
  height: 30px;
  width: 30px;
  top: 50%;
  margin-top: -20px;
  border-width: 5px 5px 0 0;
  border-style: solid;
  border-color: #fdfdfd;
  opacity: 0.5;
  z-index: 3;
}
#content07 .scroll_button:hover { opacity: 1; }
#content07 .scroll_prev {
  left: 15px;
  transform: rotate(-135deg);
}
#content07 .scroll_next {
  right: 15px;
  transform: rotate(45deg);
}
#content07 .move_controler {
  position: absolute;
  bottom: 0px;
  width: 100%;
  text-align: center;
}
#content07 .button_move {
  display: inline-block;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  border-radius: 100%;
  opacity: 0.5;
  z-index: 2;
}
#content07 .button_move:hover { opacity: 0.75; }
#content07 .button_move { background-color: #fdfdfd; }
#content07 .slide_select:nth-of-type(1):checked ~ .slide:nth-of-type(1) { opacity: 1; }
#content07 .slide_select:nth-of-type(1):checked ~ .move_controler .button_move:nth-of-type(1) { opacity: 1; }
#content07 .slide_select:nth-of-type(2):checked ~ .slide:nth-of-type(2) { opacity: 1; }
#content07 .slide_select:nth-of-type(2):checked ~ .move_controler .button_move:nth-of-type(2) { opacity: 1; }
#content07 .slide_select:nth-of-type(3):checked ~ .slide:nth-of-type(3) { opacity: 1; }
#content07 .slide_select:nth-of-type(3):checked ~ .move_controler .button_move:nth-of-type(3) { opacity: 1; }
#content07 .slide_select:nth-of-type(4):checked ~ .slide:nth-of-type(4) { opacity: 1; }
#content07 .slide_select:nth-of-type(4):checked ~ .move_controler .button_move:nth-of-type(4) { opacity: 1; }
#content07 .my-parts {
  display: block;
  margin: 0 auto 0 0;
  width: 50px;
  height: 50px;
  font-size: 50px;
  position: relative;
}
#content07 .my-parts span {
  position: absolute;
  display: block;
  top: 100%;
  left: 100%;
  width: 84%;
  height: 84%;
  margin: -42% 0 0 -100%;
  border-radius: 50%;
}
#content07 .my-parts span img {
  position: absolute;
  display: block;
  width: 150%;
  top: 0;
  left: 100%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transition: 0.5s;
}
#content07 .my-parts span img:hover { opacity: .5; }

/*----------------------   content08   ----------------------*/

#content08 {
  display: block;
  width: 500px;
  margin: 10px auto 100px;
  position: relative;
  font-feature-settings: "palt";
}
#content08 h2 {
  text-align: center;
  margin: 0px auto;
  position: relative;
  font-size: 70px;
  color: #f6c744;
  font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
}
#content08 table {
  display: block;
  margin: 100 auto　0;
}
#content08 table tr { border-bottom: 1px solid #fff; }
#content08 table th,
#content08 table td {
  padding: 24px 0;
  border: none;
}
#content08 table th { width: 30%; }
#content08 table td { width: 40%; }

/*----------------------   footer   ----------------------*/

footer {
  text-align: center;
  display: block;
  width: 60vw;
  margin: 250px auto 50px;
  padding-bottom: 30px;
}
footer img {
  display: block;
  width: 10vw;
  margin: 0 auto 30px;
}
#page_top {
  width: 50px;
  height: 50px;
  position: fixed;
  right: 50px;
  bottom: -50px;
  background: #fff;
  border-radius: 50%;
  transition: .5s;
}
#page_top a {
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
}
#page_top a::before {
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f102';
  font-size: 23px;
  color: #111;
  position: absolute;
  width: 23px;
  height: 23px;
  top: -23px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}
#page_top:hover {
  transition: .5s;
  opacity: .5;
}

}

/*-- メインカラー　#96d232 --*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*----------------------- SP -----------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/
/*--------------------------------------------------*/

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

header#pc { display: none; }
header#sp .header img { display: none; }
/*　ハンバーガーメニューボタン　*/
.hamburger {
   display: block;
   position: fixed;
   z-index: 100;
   top: 15px;
   right: 20px;
   width: 40px;
   height: 40px;
   cursor: pointer;
   text-align: center;
   background-color: #f6c744;
   padding: 5px;
}
.hamburger span {
   display: block;
   position: absolute;
   width: 20px;
   height: 2px ;
   left: 10px;
   background: #fff;
   -webkit-transition: 0.3s ease-in-out;
   -moz-transition: 0.3s ease-in-out;
   transition: 0.3s ease-in-out;
}
.hamburger span:nth-child(1) { top: 10px; }
.hamburger span:nth-child(2) { top: 20px; }
.hamburger span:nth-child(3) { top: 30px; }
/* スマホメニューを開いてる時のボタン */
.hamburger.active span:nth-child(1) {
   top: 15px;
   left: 11px;
   background: white;
   -webkit-transform: rotate(-45deg);
   -moz-transform: rotate(-45deg);
   transform: rotate(-45deg);
}
.hamburger.active span:nth-child(2),
.hamburger.active span:nth-child(3) {
   top: 15px;
   background: white;
   -webkit-transform: rotate(45deg);
   -moz-transform: rotate(45deg);
   transform: rotate(45deg);
}
/* メニュー背景　*/
nav.globalMenuSp {
   position: fixed;
   z-index: 99;
   top: 0;
   left: 0;
   background-color: #f6c744;
   text-align: left;
   width: 100%;
   height: 100%;
   transform: translateX(100%);
   transition: all 0.6s;
   padding: 20px 0;
}
nav.globalMenuSp ul {
   margin: 0 auto;
   padding: 70px 0 0;
   width: 100%;
}
nav.globalMenuSp ul li {
   list-style-type: none;
   padding: 0;
   width: 80%;
   display: block;
   margin: 0 auto;
   color: white;
}
nav.globalMenuSp ul li a {
   display: block;
   color: white;
   text-decoration :none;
   font-size: 4vw;
   font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
   font-weight: bold;
   line-height: 2.5;
}
nav.globalMenuSp.active {
   opacity: 100;
   display: block;
   transform: translateX(0%);
}

/*----------------------   top SP  ----------------------*/

#top img {
  display: block;
  width: 80vw;
  margin: 0 auto;
  position: relative;
  z-index: 10;
  position: absolute;
  top: 30%;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}
/*
#slider {
  position: relative;
  overflow: hidden;
  width: 100% !important;
}
#slider ul {
  position: relative;
  margin: 0;
  padding: 0;
  height: 100vh;
  width: 99999px;
  overflow: hidden;
  list-style: none;
}
#slider ul li {
  position: relative;
  display: block;
  float: left;
  margin: 0;
  padding: 0;
  width: 100vw;
  height: 100vh;
  text-align: center;
}
#slider ul li .slide {
  background-size: cover;
  height: 100vh;
}
*/


/* 複数画像切り替え---------------------------------------------- */
.slider-container {
  position: relative;
  width: 100%;
  height:700px;
  overflow: hidden;
}

.slideimg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: 0;
  background-size: cover;/* 画像をスライド全体にカバー */
  animation: slideAnime 36s infinite; /* 12秒で1サイクル */
}



@keyframes slideAnime {
  0%, 30%, 100% { opacity: 0; }/* スライドの非表示タイミング */
  10%, 20% { opacity: 1; }/* スライドの表示タイミング */
}


/* 各スライドのアニメーションタイミングを均等にずらす */
.slideimg:nth-of-type(1){
  background-image: url('../image/sp/main1sp.jpg');
     animation-delay: 0s;
  background-position:center;
}
/* 米系 */
.slideimg:nth-of-type(2) {
  background-image: url('../image/sp/kome10topsp.jpg');
  animation-delay: 4s;
  background-position:center;
}

.slideimg:nth-of-type(3) {
  background-image: url('../image/sp/DSC02197-2.jpg');
  animation-delay: 7s;
  background-position:center;
}
/* トマトor作物*/

.slideimg:nth-of-type(4) {
  background-image: url('../image/sp/DSC02002-2.jpg');
  animation-delay: 10s;
   background-position:center;
}


.slideimg:nth-of-type(5){
  background-image: url('../image/sp/DSC02167.jpg');
     animation-delay:13s;
  background-position:center;
}

.slideimg:nth-of-type(6) {
  background-image: url('../image/sp/DSC02123.jpg');
  animation-delay:16s;
  background-position:center;
}

/* hana*/

.slideimg:nth-of-type(7) {
  background-image: url('../image/sp/hanasp.jpg');
  animation-delay:18s;
  background-position:center;
}

.slideimg:nth-of-type(8) {
  background-image: url('../image/sp/DSC03513.jpg');
  animation-delay:21s;
  background-position:center;
}

/* 風景 */

.slideimg:nth-of-type(9) {
  background-image: url('../image/sp/fv02.jpg');
  animation-delay:23s;
  background-position:center;
}

.slideimg:nth-of-type(10){
  background-image: url('../image/sp/tf1sp.jpg');
  animation-delay:26s;
  background-position:center;
}

.slideimg:nth-of-type(11){
  background-image: url('../image/sp/fv01.jpg');
  animation-delay:29s;
  background-position:center;
}

.slideimg:nth-of-type(12){
  background-image: url('../image/sp/main1sp.jpg');
  animation-delay:33s;
  background-position:center;
}

/*
#slider ul li .slide.image01 { background-image: url('../image/sp/DSC02197-2.jpg'); }
#slider ul li .slide.image02 { background-image: url('../image/sp/DSC02190-2.jpg'); }
#slider ul li .slide.image03 { background-image: url('../image/DSC02002.jpg'); }
#slider ul li .slide.image04 { background-image: url('../image/hanapc.jpg'); }

button.control_prev, button.control_next { display: none;}
#top .progress {
  position: absolute;
  background: rgba(255, 255, 255, 0.3);
  height: 0.5rem;
  width: 100%;
  bottom: 0;
  border-top: 1px rgba(0, 0, 0, 0.15) solid;
}
#top .progress .bar {
  height: 100%;
  width: 0%;
  background: #fff;
}
#top .teaser {
  position: absolute;
  top: 50%;
  text-align: center;
  width: 100%;
  color: #fff;
  transform: translateY(-50%);
}
#top .teaser h2 {
  font-size: 5em;
  text-transform: uppercase;
  line-height: 1.5em;
  color: #fff;
}
#top .teaser p {
  font-size: 1.3em;
  line-height: 1.3em;
  width: 33%;
  min-width: 25rem;
  margin: 0rem auto;
  padding: 1.5rem 0;
}
#top .teaser h3 {
  width: 33%;
  padding: 1.5rem 0;
  margin: 0rem auto;
  min-width: 25rem;
}
#top .teaser a {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}
*/
/*----------------------   content01 SP----------------------*/

#content01 {
  display: block;
  width: 100%;
  position: relative;
  z-index: 10;
}
#content01 h2 {
  text-align: center;
  margin: 50px auto 30px;
  position: relative;
  font-size: 9vw;
  color: white;
  font-family: "NK_Monotype Corsiva","Monotype Corsiva",serif;
  font-feature-settings: "palt";
}
#content01 div.box.pc , #content01 h4 { display: none; }
#content01 div.box.sp img {
  display: block;
  width: 80%;
  margin: 60px auto;
}
.textbox {
  text-align: center;
  display: block;
  width: 90%;
  margin: 0 auto;
  overflow: hidden;
  font-family: serif;
}
.textbox h3 {
  font-size: 7vw;
  line-height: 1.5;
}
.textbox p {
  display: block;
  width: 75%;
  font-size: 4vw;
  margin: 30px auto;
  line-height: 2;
}
a.btn_13 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-align: center;
  text-decoration: none;
  width: 70vw;
  margin: auto;
  padding: 1rem 3rem;
  font-weight: bold;
  font-size: 3vw;
  color: #111;
  background-color: #f6c744;
  border-radius: 100vh;
  position: relative;
  font-weight: bold;
}
a.btn_13::before {
  content: '';
  position: absolute;
  top: calc(50% - 2px);
  right: 1em;
  transform: translateY(calc(-50% - 2px)) rotate(45deg);
  width: 10px;
  height: 1px;
  background: #111;
}
a.btn_13::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 1em;
  transform: translateY(-50%);
  width: 20px;
  height: 1px;
  background-color: #111;
}
a.btn_14 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-align: center;
  text-decoration: none;
  width:250px;
  margin: auto;
  padding: 1rem 2.5rem;
  font-weight: bold;
  background:  #02114D;
  color: wihte;
  border-radius: 100vh;
  position: relative;
  transition: 0.5s;
}

/*----------------------   content02 SP   ----------------------*/

#content02 {
  width: 100%;
  position: relative;
}
#content02 .content_wrap {
  position: relative;
  clip-path: inset(0 0 0 0);
  width: 100%;
  padding-bottom: 50px;
}
#content02 .bg{
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  /*background-image: url('../image/sp/wrap01.jpg');
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;*/
  z-index: -1;
}
.content_wrap h2 {
  text-align: center;
  margin: 50px auto;
  position: relative;
  font-size: 8vw;
  font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
  color: #f6c744;
  text-shadow: 1px 2px 3px #808080;
}
.content_wrap .inner_wrap.pc { display: none; }
.content_wrap .inner_wrap.sp {
  width: 75%;
  display: block;
  margin: 0 auto 50px;
}
.content_wrap img {
  display: block;
  width: 100%;
  background-color: rgba(255, 255, 255, 1);
  padding: 30px 40px 20px;
}
.content_wrap .text1 {
  color: #333;
  font-size: 3vw;
  font-weight: bold;
  margin-bottom: 10px;
  padding: 0 20px 30px;
  line-height: 1.5;
  background-color: rgba(255, 255, 255, 1);
  text-align: center;
  font-family:serif; 
}

/*----------------------   content03  SP ----------------------*/

#content03 .inner_box.pc { display: none; }
#content03 {
  display: block;
  width: 100%;
  position: relative;
  z-index: 10;
}
#content03 h2 {
  text-align: center;
  margin: 30px auto;
  position: relative;
  font-size: 8vw;
  font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
  color: #f6c744;
}
#content03 h3 {
  font-size: 3.5vw;
  text-align: center;
  font-family:serif; 
}
#content03 h4 {
  font-size: 3vw;
  font-weight: bold;
  font-family:serif; 
}
#content03 h5 {
  font-size: 3vw;
  font-weight: bold;
  color:#cd5c5c;
  font-family:serif; 
}
#content03 .inner_box {
  display: block;
  width: 80%;
  margin: 50px auto;
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}
#content03 .inner_box div {
  display: block;
  width: 45%;
  margin: 0;
  position: relative;
}
#content03 .inner_box div img {
  display: block;
  width: 100%;
  margin-bottom: 10px;
}
#content03 .inner_box div p {
  font-size: 3vw;
  line-height: 1.5;
  font-feature-settings: "palt";
  padding-top: 10px;
  font-family:serif; 
}


/*----------------------   content20 sp  ----------------------*/

#content20 {
  width: 100%;
  position: relative;
  padding: 100px 0px 100px;
  margin: 100px auto 50px;
  background-image: url('../image/sp/IMG_3740-1.png');
background-color:rgba(0,0,0,0.1);
background-blend-mode:lighten;
  background-attachment: fixed;
  background-size: 300%;
  background-repeat: no-repeat;
    background-position: center; 
}
#content20 .bg { display: none; }
#content20 h2 {
  text-align: center;
  margin: 0px auto 50px;
  position: relative;
  font-size:8vw;
  color: #f6c744;
  font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
 /*text-shadow: 1px 2px 3px #808080;*/
  line-height: 1.25;
}
#content20 h1 {
  text-align: center;
  margin: 0px auto;
  padding-top: 0px;
  position: relative;
  font-size: 1.5vw;
  font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
  color: #cd5c5c;
  /*text-shadow: 1px 2px 3px #808080;*/
  line-height: 1;
}
#content20 .content_wrap h3 {
  font-size: 20px;
  text-align: center;
  margin: 0 auto 12px;
  color: #fff;
  /*text-shadow: 1px 2px 3px #808080;*/
  font-family:serif;
}
#content20 .content_wrap h4 {
  font-size: 17px;
  text-align: center;
  margin: -50px auto 12px;
  color: #fff;
  /*text-shadow: 1px 2px 3px #808080;*/
  font-family:serif;
}
#content20 .content_wrap p {
  font-size: font-size:5vw;
  text-align: center;
  margin: 50px 0px 50px;
  color: #fff;
  /*text-shadow: 1px 2px 3px #000000;*/
  font-family:serif;
}
p .big {
  font-size: 5vw; /* px, em, % などでも可 */
  font-weight: 600;
}
p .big1 {
  font-size: 5vw; /* px, em, % などでも可 */
  font-weight: 600;
}
.image-box {
  margin: 50px auto 50px;
  width: auto;      /* DIVの幅 */
  height: auto;     /* DIVの高さ */
  border: 0px solid #ccc; /* 枠線（任意） */
  overflow: hidden;  /* はみ出しを隠す */
  text-align: center;
}
.image-box2 {
  margin: 45px auto 12px;
  width: auto;      /* DIVの幅 */
  height: auto;     /* DIVの高さ */
  border: 0px solid #ccc; /* 枠線（任意） */
  overflow: hidden;  /* はみ出しを隠す */
  text-align: center;
}

.image-box img {
  width: 25%;       /* 画像をDIVの幅に合わせる */
  height: 100%;      /* 高さも合わせる */
  object-fit: cover; /* 画像をトリミングしてフィット */
}
.image-box2 img {
  width: 15%;       /* 画像をDIVの幅に合わせる */
  height: 100%;      /* 高さも合わせる */
  object-fit: cover; /* 画像をトリミングしてフィット */
  filter: invert(100%); /* 色を反転させる */
}


/*----------------------   content05 SP  ----------------------*/

#content05 {
  width: 100%;
  position: relative;
}
#content05 .content_wrap {
  position: relative;
  clip-path: inset(0 0 0 0);
  width: 100%;
  padding-bottom: 50px;
}
#content05 .bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-image: url('../image/sp/wanted1.png');
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: -1;
}
#content05 h2 {
  text-align: center;
  margin: 50px auto;
  padding-top: 50px;
  position: relative;
  font-size: 8vw;
  font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
  color: #f6c744;
  text-shadow: 1px 2px 3px #808080;
  line-height: 1;
}
#content05 h1 {
  text-align: center;
  margin: 0px auto;
  padding-top: 0px;
  position: relative;
  font-size: 3vw;
  font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
  color: #cd5c5c;
  text-shadow: 1px 2px 3px #808080;
  line-height: 1;
}
#content05 .content_wrap h3 {
  font-size: 3vw;
  text-align: center;
  margin: 0 auto 12px;
  color: #fff;
  text-shadow: 1px 2px 3px #808080;
}
#content05 .content_wrap h4 {
  font-size: 17px;
  text-align: center;
  margin: -50px auto 12px;
  color: #fff;
  text-shadow: 1px 2px 3px #808080;
  font-family:serif;
}
#content05 .content_wrap p {
  font-size: 4vw;
  text-align: center;
  margin: 0 auto 50px;
  color: #fff;
  text-shadow: 1px 2px 3px #808080;
  font-family:serif; 
}

/*----------------------   content06 SP  ----------------------*/

#content06 {
  display: block;
  width: 100%;
  position: relative;
  z-index: 10;
  background-image: url('../image/sp/2sp.jpg');
  background-attachment: fixed;
  background-size: cover;
}
.content06_wrap {
  display: block;
  width: 100%;
  margin: 0 auto 100px;
  position: relative;
  z-index: 10;
  font-feature-settings: "palt";
}
.content06_wrap h2 {
  text-align: center;
  margin: 50px auto 0;
  position: relative;
  font-size: 8vw;
  font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
  color: #f6c744;
  line-height: 1.1;
}
.content06_wrap .inner_wrap {
  width: 100%;
  margin: 0 auto;
  position: relative;
}
input , #photos ,.pic , #btns , div.pc { display: none; }

.p-slide {
  padding-left: 15px;
  padding-right: 15px;
}
.p-slide__inner {
  position: relative;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 50px;
  margin-bottom: 50px;
  overflow: hidden; /*-- はみ出した要素を非表示にする --*/
}
.p-slide__main {
  display: flex; /*-- 横に並べるのに必要 --*/
  margin-left: -10px;
  padding-bottom: 17px;
}
.p-slide__block {
  flex: 0 0 calc(30% - 10px); /*-- 横に並べるのに必要 --*/
  margin-left: 10px;
}
.p-slide__img img { width: 60vw; }
.simplebar-scrollbar::before { background-color: #debc00; }

/*-- スクロールバーが動く領域の背景色の変更 お好みで
.simplebar-track {
   background-color: #f6f6f6;
 }
--*/

.simplebar-content-wrapper::-webkit-scrollbar { /*-- iOSでデフォルトのスクロールバーを非表示 --*/
  display: none;
  -webkit-appearance: none;
}

/*----------------------   content07   ----------------------*/

#content07 {
  display: block;
  width: 100%;
  margin: 0 auto;
  position: relative;
  font-feature-settings: "palt";
  text-align: center;
}
#content07 h2 {
  text-align: center;
  margin: 50px auto;
  position: relative;
  font-size: 8vw;
  font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
  color: #f6c744;
  line-height: 1;
}
#content07 .inner_wrap {
  width: 100%;
  margin: 0 auto;
  position: relative;
}
#content07 .contains {
  width: 100%;
  height: 250px;
  overflow: hidden;
  position: relative;
  padding: 0;
  list-style: none;
}
#content07 .slide_select { display: none; }
#content07 .slide {
  display: block;
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 250px;
  opacity: 0;
}
#content07 .slide img {
  display: block;
  width: 90vw;
  margin: 0 auto;
}
#content07 .scroll_button {
  position: absolute;
  display: block;
  height: 20px;
  width: 20px;
  top: 50%;
  border-width: 3px 3px 0 0;
  border-style: solid;
  border-color: #fdfdfd;
  opacity: 0.5;
  z-index: 3;
}
#content07 .scroll_button:hover { opacity: 1; }
#content07 .scroll_prev {
  left: 15px;
  transform: rotate(-135deg);
}
#content07 .scroll_next {
  right: 15px;
  transform: rotate(45deg);
}
#content07 .move_controler {
  position: absolute;
  bottom: 0;
  width: 100%;
  text-align: center;
}
#content07 .button_move {
  display: inline-block;
  height: 10px;
  width: 10px;
  margin: 0 2px;
  border-radius: 100%;
  opacity: 0.5;
  z-index: 2;
}
#content07 .button_move:hover { opacity: 0.75; }
#content07 .button_move { background-color: #fdfdfd; }
#content07 .slide_select:nth-of-type(1):checked ~ .slide:nth-of-type(1) { opacity: 1; }
#content07 .slide_select:nth-of-type(1):checked ~ .move_controler .button_move:nth-of-type(1) { opacity: 1; }
#content07 .slide_select:nth-of-type(2):checked ~ .slide:nth-of-type(2) { opacity: 1; }
#content07 .slide_select:nth-of-type(2):checked ~ .move_controler .button_move:nth-of-type(2) { opacity: 1; }
#content07 .slide_select:nth-of-type(3):checked ~ .slide:nth-of-type(3) { opacity: 1; }
#content07 .slide_select:nth-of-type(3):checked ~ .move_controler .button_move:nth-of-type(3) { opacity: 1; }
#content07 .slide_select:nth-of-type(4):checked ~ .slide:nth-of-type(4) { opacity: 1; }
#content07 .slide_select:nth-of-type(4):checked ~ .move_controler .button_move:nth-of-type(4) { opacity: 1; }
#content07 .my-parts {
  display: block;
  margin: 0 auto 0 0;
  width: 50px;
  height: 50px;
  font-size: 50px;
  position: relative;
}
#content07 .my-parts span {
  position: absolute;
  display: block;
  top: 100%;
  left: 100%;
  width: 84%;
  height: 84%;
  margin: -42% 0 0 -100%;
  border-radius: 50%;
}
#content07 .my-parts span img {
  position: absolute;
  display: block;
  width: 150%;
  top: 0;
  left: 100%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transition: 0.5s;
}
#content07 .my-parts span img:hover { opacity: .5; }


/*----------------------   content08 SP  ----------------------*/

#content08 {
  display: block;
  width: 84%;
  margin: 100px auto 50px;
  position: relative;
  font-feature-settings: "palt";
}
#content08 h2 {
  text-align: center;
  margin: 0px auto;
  position: relative;
  font-size: 8vw;
  font-family: "arial black", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
  color: #f6c744;
  line-height: 0;
}
#content08 table {
  display: block;
  margin: 0 auto;
  font-size: 3.2vw;
}
#content08 table tr { border-bottom: 1px solid #fff; }
#content08 table th,
#content08 table td {
  padding: 24px 0;
  border: none;
}
#content08 table th { width: 20%; }
#content08 table td { width: 44%; }

/*----------------------   footer   ----------------------*/

footer {
  text-align: center;
  display: block;
  width: 60vw;
  margin: 0 auto 50px;
  padding-bottom: 30px;
}
footer img {
  display: block;
  width: 50vw;
  margin: 0 auto 30px;
}

#page_top{
  width: 50px;
  height: 50px;
  position: fixed;
  z-index: 10;
  right: 20px;
  bottom: -50px;
  background: #f6c744;
  opacity: 0.6;
  border-radius: 50%;
}
#page_top a {
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f102';
  font-size: 23px;
  color: #fff;
  position: absolute;
  width: 23px;
  height: 23px;
  top: -25px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}

}