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

* {
  margin: 0;
  padding: 0;
}
.pc { display: block !important; }
.sp { display: none !important; }

body{
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
}
.img100 {
  width: 100%;
}
.sns_youtube{
  position: fixed;
  top: 30%;
  right: 3%;
  width: 50px;
  z-index: 1000;
}
.sns_twitter{
  position: fixed;
  top: 40%;
  right: 3%;
  width: 50px;
  z-index: 1000;
}
.sns_tiktok{
  position: fixed;
  top: 50%;
  right: 3%;
  width: 50px;
  z-index: 1000;
}
.sns_fantia{
  position: fixed;
  top: 60%;
  right: 3%;
  width: 50px;
  z-index: 1000;
}
.space_sns{
  margin: 3% 0 3% 0;
}
.keytext{
  font-weight: bold;
  text-align: center;
  font-size: 1.5rem;
  color: #6d4a23;
  padding: 0.2em;
  background: linear-gradient(transparent 70%, #fff87d 70%);
}
.Box{
  padding: 0 10% 10%;
  margin-top: 3%;
}
.leadBox{
  padding: 0 15% 0 15%;
}
.lead{
  margin-top: 3%;
  font-size: 1.0rem;
  font-weight: bold;
  color: #6d4a23;
}
.maincontainer{
  position: relative;
}
.tumutumu{
  width: 45vw;
  z-index: 300;
  position: absolute;
  top: 14vw;
  left: 2vw;
}
.tumutumu img {
  width: 100%;
}
.txt_welcome {
  position: absolute;
  left: 5.6vw;
  bottom: 10vw;
  text-align: center;
  font-size: 2.2vw;
  font-weight: bold;
  color: #6d4a23;
}
.BoxBox_pf{
  margin: 0 auto;
  background: #fbffdc;
  padding: 2% 2% 2% 2%;
  border: dashed 2px #ffc844;/*点線*/
  box-shadow: 0px 0px 0px 10px #fff87d;
  width: 40vw;
  color: #651b1b;
  position: absolute;
  top: 15vw;
  left: 5vw;
}
.listspace{
  padding: 0 0 0 14vw;
  margin-bottom: 5%;
}
li{
  list-style: none;
}
.pf_li{
  margin: 2% 0 0 0;
}
.pflayout{
  position: relative；
}
.pfimg{
  position: absolute;
  right: 10vw;
  top: 2vw;
  z-index: 500;
}
.box_in{
  margin: 2% 0 0 0;
}
.BoxBox_SNS{
  padding: 5vh 25vw 0 25vw;
}
.SNSimg{
  z-index: 100;
}
.on:hover {
  filter: opacity(80%);
}
.Box2{
  padding: 0 10% 0 10%;
  margin-top: 10%;
}
.special_move{
  margin-top: 5%;
}
.movie{
  margin-top: 2%;
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.movie iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
.Box00{
  padding: 0 10% 0 10%;
  margin-top: 7%;
}
.snslist {
  display: flex;
  align-items: center;
  padding: 2% 10% 0 10%;
}
.snslist li.twitter {
  width: 7.3vw;
  max-width: 84px;
}
.snslist li.youtube {
  width: 8.6vw;
  max-width: 99px;
}
.snslist li.fantia {
  width: 33.5vw;
  max-width: 242px;
}
.snslist li:nth-of-type(n+2) {
  margin-left: 5%;
}
.title00{
  position: relative;
  padding: 0.6em;
  background: #ffd833;
  width: 32vw;
  font-size: 1.3rem;
  color: #645518;
}
.title00:after {
  position: absolute;
  content: '';
  top: 100%;
  left: 70px;
  border: 15px solid transparent;
  border-top: 15px solid #ffd833;
  width: 0;
  height: 0;
}
footer{
    text-align: center;
    padding-bottom: 5%;
    margin-top: 10%;
    padding-top: 3%;
    background: #fff;
}
.footerimg{
    width: 224px;
}
.copy{
    color: #fff;
    margin-top: 10px;
    font-size: 12px;
}
#pageTop {
  text-align:center;
}
#pageTop img {
    width:4%;
    padding-bottom: 3%;
}
#pageTop a:hover {
  text-decoration: none;
  opacity: 0.7;
}
.title01{
  text-align: center;
  margin: 0 10% 0;
  background: linear-gradient(transparent 70%, #fff87d 70%);
  color: #6d4a23;
}
.Box01{
  width: 60%;
  margin: 0 auto;
  margin-top: 2%;
  color: #6d4a23;
}
.Box02{
  background-color: #ffc437;
  padding: 10% 0;
  margin: 10% 0 0 0;
}
.Box02 .Box01 {
  margin-top: 0;
}
.Box02 .Box01 .title01 {
  margin: 0;
}
.Box02 .Box01 .ttl {
  margin-top: 2%;
}
.list_c{
  display: flex;
  justify-content: center;
}
.list_cord{
  margin: 0 1% 0 1%;
}
.go-top{
  text-align: center;
  width: 15vw;
  margin: 0 auto;
}
.copy{
  color: #fff;
  font-size: 0.8rem;
  text-align: center;
  padding-top: 1%;
}
.SODlogo{
  margin: 0 auto;
  width: 15vw;
  margin-top: 3vh;
}