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



/*Animation copy TOPメインめくれる文字
-----------------------------------------------------------*/
@-webkit-keyframes passing-bar{
	0% {
		left: 0;
		right: auto;
		width: 0;
	}
	50% {
		left: 0;
		right: auto;
		width: 100%;
	}
	51% {
		left: auto;
		right: 0;
		width: 100%;
	}
	100% {
		left: auto;
		right: 0;
		width: 0;
	}
}
@keyframes passing-bar{
	0% {
		left: 0;
		width: 0;
	}
	50% {
		left: 0;
		width: 100%;
	}
	51% {
		left: 0;
		width: 100%;
	}
	100% {
		left: 100%;
		width: 0;
	}
}
@-webkit-keyframes passing-txt{
	0% { opacity: 0; }
	50% { opacity: 0; }
	100% { opacity: 1; }
}
@keyframes passing-txt{
	0% { opacity:0; }
	50% { opacity:0; }
	100% { opacity:1; }
}


/* css */
.passing .passing-box {
	display: block;
}
.passing .passing-bar {
	position: relative;
	display: inline-block;
	-webkit-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	width:100%;
	margin-bottom:5px;
}
.passing .last {
	margin-bottom:0;
}

.passing .passing-bar:before {
	content: '';
	display: inline-block;
	width: 0;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	background:#069;/*変更箇所*/
}





.passing .passing-txt {
	opacity: 0;
	-webkit-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	line-height:1 !important;
	padding:15px 2%;/*15px 4%*/
	color:#fff;
	filter:drop-shadow(3px 3px 3px rgba(0,0,0,0.9));/*画像上でも透過するbox-shadowに代わるもの*/
}

.EGsmall-text{
	font-size:72px;
	font-family: 'Averia Serif Libre', cursive;
}

.EGbig-text{
	font-size:108px;
	letter-spacing:0.05em;
	font-family: 'Averia Serif Libre', cursive;
}

.CHU-text{
	font-size:36px;
	font-family: 'Noto Serif SC', serif;
}

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

.passing .passing-txt {
	text-align:center;
	padding:15px 1%;
}

.EGsmall-text{
	font-size:48px;
}

.EGbig-text{
	font-size:84px;
}

.CHU-text{
	font-size:30px;
}

}

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

.passing .passing-txt {
	padding:12.5px 0.5%;
}

.EGbig-text{
	font-size:72px;
}

}

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

.passing .passing-txt {
	padding:10px 0.5%;
}

.EGsmall-text{
	font-size:36px;
}

.EGbig-text{
	font-size:55px;
}

.CHU-text{
	font-size:24px;
}

}


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

.passing .passing-txt {
	padding:7.5px 0.5%;
}

.EGsmall-text{
	font-size:30px;
}

.EGbig-text{
	font-size:48px;
}

.CHU-text{
	font-size:20px;
}

}

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

.EGsmall-text{
	font-size:24px;
}

.EGbig-text{
	font-size:40px;
}

.CHU-text{
	font-size:18px;
}

}






/*.css-selector {
    background: linear-gradient(270deg, #000000, #666, #000000, #666);
    background-size: 800% 800%;
    -webkit-animation: AnimationName 15s ease infinite;
    -moz-animation: AnimationName 15s ease infinite;
    animation: AnimationName 15s ease infinite;
}

@-webkit-keyframes AnimationName {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@-moz-keyframes AnimationName {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@keyframes AnimationName {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}*/





.passing.move .passing-bar:before {
	-webkit-animation: passing-bar 1s ease 0s 1 normal forwards;
	animation: passing-bar 1s ease 0s 1 normal forwards;
}
.passing.move .passing-txt {
	-webkit-animation: passing-txt 0s ease .5s 1 normal forwards;
	animation:passing-txt 0s ease .5s 1 normal forwards;
}


.passing.move .passing-bar:before {
	-webkit-animation: passing-bar 1s ease 0s 1 normal forwards;
	animation: passing-bar 2s ease 0s 1 normal forwards;
}

.passing.move .passing-txt {
	-webkit-animation: passing-txt 0s ease .5s 1 normal forwards;
	animation:passing-txt 2s ease .5s 1 normal forwards;
}