@charset "UTF-8";

#contents {
	max-width: none;
	overflow: hidden;
}

#container{
	width: 750px;
  margin: 20px auto 0;
  background-image: repeating-linear-gradient(-45deg, #dbd1c4, #dbd1c4 2px, #e7ddd1 2px, #e7ddd1 4px);
  overflow: hidden;
}

#container img {
	max-width: 100%;
	height: auto;
	vertical-align: top;
}


/* movie */
#container .movie01 {
	position: relative;
	width: 100%;
  height: 56.47vw;
  max-height: 466px;
}

#container .movie01 {
	position: relative;
	width: 100%;
  height: 56.47vw;
  max-height: 466px;
}

#container .movie01 iframe {
	position: absolute;
	width: 78.82%;
	aspect-ratio: 16 / 9;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}

#container .movie02 {
	position: relative;
	width: 100%;
  height: 122.94vw;
  max-height: 1044px;
}
#container .movie02 iframe {
	position: absolute;
	width: 66.9333%;
	aspect-ratio: 9 / 16;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}


/* 装飾 */
#container .mb15 {
	margin-bottom: 15px !important;
}
#container .mb30 {
	margin-bottom: min(4vw, 30px) !important;
}
#container .mb40 {
	margin-bottom: min(5.33vw, 40px) !important;
}
#container .mb45 {
	margin-bottom: 45px !important;
}
#container .mb60 {
  margin-bottom: min(8vw, 60px) !important;
}
#container .mb80 {
	margin-bottom: 80px !important;
}
#container .mb110 {
  margin-bottom: min(14.67vw, 110px) !important;
}
#container .pl10 {
	padding-left: 10px !important;
}

#container .s-shadow{
  box-shadow: 0px 5px 16px 2px rgba(149, 126, 98, 0.25);
}
#container .s-center{
  text-align: center;
}
#container a.bnr img{
  transition: .3s ease-in-out;
}
#container a.bnr:hover img{
  filter: brightness(1.075);
}

#container .fadein {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity .5s ease, transform .5s ease;
}

#container .fadein.is-show {
  opacity: 1;
  transform: translateY(0);
}


@media (min-width: 769px) {
	.sp {
		display: none;
	}
}
@media (max-width: 768px) {
	*{
		box-sizing: border-box;
	}
	.pc {
		display: none;
	}
	#container {
		width: 100%;
	}
  .w-90{
    max-width: 90%;
    margin: 0 auto;
  }
  .w-70{
    max-width: 70%;
    margin: 0 auto;
  }
  #container .movie02 iframe{
    top: 47%;
  }
}

