@charset "UTF-8";

/** TOP Slider **/
.top_photo01 {background-image: url("../img/toppc_img01.jpg");}
.top_photo02 {background-image: url("../img/toppc_img02.jpg");}
.top_photo03 {background-image: url("../img/toppc_img03.jpg");}
.top_photo04 {background-image: url("../img/toppc_img04.jpg");}

#TopPage {
	margin: 155px auto 0 auto;
}

#TopPage,
#TopPage #slide{
	width: 100%;
	height: calc(100vw * 0.4);
}

#slide {
    position: absolute;
	overflow: hidden;
	padding: 0;
	margin: 0;
	width: 100%;
}

#slide .photo {
    position: relative;
	background-size: cover;
	background-position: center;
	height: 100%;
	width: 100%;
}


#TopPage iframe {
	width: 50%;
	height:  calc(50vw * 0.5625);
	top: 100px;
	border: #ffffff solid;
	border-width: 10px;
}

/* JSの秒数に合わせる */
.top_zoom {
    animation: top_zoom_animation 13s;
}

@keyframes top_zoom_animation {
  0% {
    transform: scale(1);
      transform-origin: 50% 50%;
  }
  100% {
    transform: scale(1.1);
      transform-origin: 50% 50%;
  }
}

/** テキストアニメーションここまで **/


/* ------------------------------------------------------ */
@media only screen and (max-width : 1336px) {
/* ------------------------------------------------------ */

}


/* ------------------------------------------------------ */
@media only screen and (max-width : 1250px) {
/* ------------------------------------------------------ */

}


/* ------------------------------------------------------ */
@media only screen and (max-width : 880px) {
/* ------------------------------------------------------ */
}

/* ------------------------------------------------------ */
@media only screen and (max-width : 600px) {
/* ------------------------------------------------------ */
#TopPage,
#TopPage #slide{
	width: 100%;
	height: 100vw;
}

.top_photo01 {background-image: url("../img/topsp_img01.jpg");}
.top_photo02 {background-image: url("../img/topsp_img02.jpg");}
.top_photo03 {background-image: url("../img/topsp_img03.jpg");}
.top_photo04 {background-image: url("../img/topsp_img04.jpg");}
}

}