@charset "utf-8";


/*----------------------------------------
common
----------------------------------------*/
img { user-drag: none; -webkit-user-drag: none; -moz-user-select: none; }
.mincho { font-family:"游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif; }
.bold { font-weight: bold; }
video { filter:drop-shadow(0px 0px rgba(0,0,0,0)); outline: none; border: none; }
.video { position:relative; cursor:pointer; display:flex; }
.video video { width:100%; }
.video .btn { position:absolute; bottom:3rem; left:3rem; z-index:10; transition:all .4s; }
.video .btn.pause { opacity:0; }
.video .btn.play { opacity:1; }

header {  }
header .logo { display:none; }
header.menu { position:absolute; bottom:10%; left:0; width:100%; }
header.menu ul { display:flex; align-items:center; justify-content:space-between; padding:0 5rem; }
header.menu ul li { flex-grow:1; border-right:solid 1px #fff; text-align:center;}
header.menu ul li a { display:inline-block; color:#fff; font-size:1.25vw; }
header.menu ul li.item { border-right:none; }
header.menu ul li.item a { border:solid 1px #fff; padding:0.5rem 2em; border-radius:30px; }
header.menu ul li:last-child { border-right:none; border-left:solid 1px #fff; }

header.fixed {
  position:fixed;
  z-index:9999;
  bottom:auto;
  top:0;
  padding:0;
}
header.fixed ul { padding:2rem 5rem; background:rgb(255,255,255,.6); backdrop-filter:blur(3px); }
header.fixed ul li { border-color:#333; }
header.fixed ul li a { color:#333; }
header.fixed ul li.item a { border-color:#333; }
header.fixed ul li:last-child { border-color:#333; }

/*----------------------------------------
mv
----------------------------------------*/
#mv {  }
#mv .mv-wrap { position:relative;  }
#mv .mv-wrap .over {
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%,-60%);
  width:85%;
  z-index:10;
  cursor:pointer;
}
#mv .mv-wrap .over .btn {
  position:absolute;
  bottom:10%;
  left:5%;
}
#mv .video { cursor:auto; }


/*----------------------------------------
contents
----------------------------------------*/
#contents { margin-top: 15rem; }
#contents .block { margin-bottom:15rem; }
#contents .block ul.flb { display:flex; justify-content:space-between; }
#contents .block ul.flb li {  }
#contents .block ul.flb li.video { width:70.012%; height:100%; align-items:flex-start; }
#contents .block ul.flb li.textarea { width:28.4%; position:relative; }
#contents .block ul.flb li.textarea .img { position:absolute; bottom:0; right:0; width:76.955%; }
#contents .block ul.flb.rev li.video { order:2; margin-right:0; margin-left:2.5%; }
#contents .block ul.flb.rev li.textarea p { margin-left:auto; }
#contents .block ul.flb.rev li.textarea .img { right:auto; left:0; }
#contents .block:first-child ul.flb li.video { margin-right:3.5%; }
#kikou ul li.textarea p { width:81.545%; }
#dojou ul li.textarea p { width:88.215%; }
#kusa ul li.textarea p { width:64.765%; }
#kusa ul li.textarea .img { bottom:auto; top:0; }
#silage ul li.textarea p { width:89.649%; }
#silage .silage-cont { margin-top:7rem; }
#silage .silage-cont ul { display:flex; flex-direction:row-reverse; justify-content:space-between; }
#silage .silage-cont ul li {}
#silage .silage-cont ul li.bokuso { width:60.161%; margin-right:6.255%; }
#silage .silage-cont ul li.caw { width:31.5295%; margin-right:4.204%; }
#passion ul li.textarea p { width:86.968%; }
#cycle { margin:15rem 0 0; }
#cycle ul { display:flex; flex-direction:row-reverse; width:81.451%; margin:0 auto; }
#cycle ul li:first-child { width:14.979%; }
#cycle ul li:first-child p { display:none; }
#cycle ul li:last-child { width:80%; margin-right:5.021%; }
#cycle .last { margin-top:5rem; position:relative; }
#cycle .last p {
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  writing-mode:vertical-rl;
  font-size:3.6rem;
  color:#fff;
  height:100%;
  display:flex;
  justify-content:center;
  letter-spacing:0.6em;
  line-height:1.7;
  font-weight: bold;
}

#item {}
#item .item-wrap { width:81.451%; margin:0 auto; }
#item .ttl { font-size:2.1vw; text-align:center; line-height:1.9; letter-spacing:0.4em; font-weight: bold; margin:9rem 0 10rem; }
#item .ttl span { display:block; font-size:80%; }
#item ul { display:flex; justify-content:space-between; margin-bottom:5rem; }
#item ul li { width:32%; }
#item ul li p { font-size:1.0416vw; text-align:center; font-weight:500; }
#item ul li p span { display:block; font-size:120%; }
#item ul li .btn { width:60%; margin:auto; }
#item ul li .btn a {
  display:block;
  padding:1rem 0;
  text-align:center;
  letter-spacing:0.2em;
  font-size:1.045vw;
  border-radius:15px;
  /*background:#bdccd4;*/
  font-weight: bold;
  box-shadow:3px 3px 0px 0px #6D98A7;
}
#item .item-btn { max-width:72rem; width:100%; margin:5rem auto; }
#item .item-btn a {
  display:block;
  background:#BDCCD4;
  padding:3rem 0;
  text-align:center;
  font-size:2.4rem;
  letter-spacing:0.6em;
  line-height:1;
  color:#fff;  
  border-radius:40px;
  box-shadow:3px 3px 0px 0px #6D98A7;
  font-weight:500;
}

footer {  }
footer .video { margin-bottom:13rem; }
footer .logoarea { position:relative; margin:0 0 15rem; padding-top:10rem; }
footer .logoarea:before {
  content:"";
  display:block;
  position:absolute;
  top:0;
  left:50%;
  transform: translateX(-50%);
  max-width:65rem;
  width:100%;
  height:1px;
  background:#000;
  padding:0 2rem;
}
footer .logoarea ul { display:flex; align-items:flex-end; justify-content:space-between; max-width:164rem; padding:0 2rem; width:100%; margin:0 auto; }
footer .logoarea ul li {}
footer .logoarea ul li:first-child { width:33.545%; margin-right:4.118%; }
footer .logoarea ul li:last-child { width:62.337%; font-size:1.8vw; font-weight: bold; letter-spacing:0.2em; }

/*----------------------------------------
responsive
----------------------------------------*/
@media screen and (max-width:1400px){}
@media screen and (max-width:1024px){}
@media screen and (max-width:820px){
  #mv { margin-top:6.5rem; }
  #mv .mv-wrap .over { transform:translate(-50%,-50%); width:95%; }
  header { height:6.5rem; }
  header.menu {
    position:fixed;
    display:flex;
    justify-content:space-between;
    align-items:center;
    bottom:auto;
    top:0;
    z-index:9999;
    padding:0 2rem;
    background:rgb(255,255,255,.9);
    height:6.5rem;
    backdrop-filter:blur(3px);
  }
  header.menu ul { display:none; }
  header .logo { display:block; width:30%; }
  #sp-menu { display:block; }
  #mv .btn,.video .btn { width:5rem; }
  
  #contents .block { margin-bottom:10rem; }
}
@media screen and (max-width:768px){}
@media screen and (max-width:600px){
  
  header .logo { width:40%; }
  
  #contents .block ul.flb { flex-direction:column-reverse; }
  #contents .block ul.flb li { width:100%!important; }
  #contents ul li.textarea { margin-bottom:3rem; }
  #contents ul li.textarea p { margin:0 auto; }
  #contents .block ul.flb.rev li.video { order:initial; margin:0; }
  #contents .block ul.flb li.textarea .img { width:70%; }
  #contents .block:first-child ul.flb li.video { margin:0; }
  #kikou ul li.textarea p { padding-bottom:16rem; }
  #dojou ul li.textarea p { padding-bottom:5rem; }
  #kusa ul li.textarea p { margin:0 auto 0 2rem; }
  
  #silage .silage-cont ul { flex-direction:column; }
  #silage .silage-cont ul li { width:100%!important; }
  #silage .silage-cont ul li.bokuso { margin:0 auto 3rem; width:90%!important; }
  #silage .silage-cont ul li.bokuso p { font-size:3.7vw; margin-bottom:2rem; font-weight:bold; }
  #silage .silage-cont ul li.bokuso p span { display:block; font-size:130%; letter-spacing:0.3em; margin-bottom:2rem; text-align:center; }
  #contents #passion.block { margin-bottom:0; }
  #passion ul li.textarea p { padding-bottom:20rem; }
  
  #cycle { margin-top:5rem; }
  #cycle ul { flex-direction:column; }
  #cycle ul li { width:100%!important; }
  #cycle ul li:first-child img { display:none; }
  #cycle ul li:first-child p { display:block; text-align:center; font-size:3rem; letter-spacing:0.3em; margin-bottom:5.5vw; font-weight: bold; }
  #cycle ul li:first-child p span.wrap { display:inline-block; text-align:left; }
  #cycle ul li:first-child p span.grn { color:#009245; }
  #cycle .last img { height:45rem; object-fit:cover; border-radius:0 0 60px 60px; }
  
  #item ul { flex-direction:column; width:90%; margin:0 auto 8rem; }
  #item ul li { width:100%; margin-bottom:5rem; }
  #item ul li p { font-size:3.2vw; }
  #item ul li:last-child { margin-bottom:0; }
  #item ul li .btn a { font-size:1.6rem; }
  #item .item-wrap { width:100%; }
  #item .ttl { font-size:4.5vw; width:100%; padding:0 2rem; }
  #item .item-btn { max-width:80%; }
  
  footer .video { margin-bottom:8rem; }
  footer .logoarea { margin:0 0 10rem; padding-top:5rem; }
  footer .logoarea:before { width:80%; }
  footer .logoarea ul { flex-direction:column; align-items:center; }
  footer .logoarea ul li:first-child { width:50%; }
  footer .logoarea ul li:last-child { margin-top:4rem; width:100%; text-align:center; font-size:4vw; }
  
}
@media screen and (max-width:414px){}
@media screen and (max-width:375px){}
@media screen and (max-width:320px){}