@charset "UTF-8";

h1{ line-height: 1.4; }/* ベースの行間を指定 */
h1{ font-family: "YakuHanMP", "ヒラギノ明朝 Pro W3","Hiragino Mincho Pro"; }
[lang="en"] h1{ font-family: "Georgia", "YakuHanMP", "ヒラギノ明朝 Pro W3","Hiragino Mincho Pro"; }

/*
h1
no-over
txt-wrp

anime-title
anime-wrp
anime-wrp--left
anime-wrp--right
*/


.h1{ text-align:center; font-size:55px; color:#32a0f0; /*padding:120px 15px 40px;*/ font-weight:normal; }
@media only screen and (min-width: 1px) and (max-width: 767px){ .h1 { font-size:28px; } }


/* 青色 =================================================================================== */

/* メインビジュアルのタイトルアニメーション */
.anime-titleB span { position:relative; overflow:hidden; }
.anime-titleB .anime-wrp { display:inline-block; width:100%; }
.h1.anime-titleB .anime-wrp, .anime-titleB .anime-wrp { width:auto; }
.anime-titleB span.txt-wrp { opacity:0; }

/*矩形の色を変えている*/
.anime-titleB > span.anime-wrp:after { content:" "; position:absolute; background:#32a0f0; top:0; left:0; right:0; bottom:0; }
.anime-titleB.no-over > span.anime-wrp:after { overflow:hidden; visibility:hidden; -webkit-transform:translateX(-100%); transform:translateX(-100%); }
.anime-titleB.no-over > span.anime-wrp--right:after { -webkit-transform:translateX(100%); transform:translateX(100%); }

/*動く矩形を出している left版*/
.anime-titleB.is-end > span.anime-wrp:after {
	-webkit-transform: translateX(101%);
	transform: translateX(101%);
	transition: all .85s;
	-webkit-transition-timing-function:cubic-bezier(.785, .135, .15, .86);
	transition-timing-function:cubic-bezier(.785, .135, .15, .86);
}

/*動く矩形を出している right版*/
.anime-titleB.is-end > span.anime-wrp--right:after {
	-webkit-transform: translateX(-101%);
	transform: translateX(-101%);
	transition: all .85s;
	-webkit-transition-timing-function:cubic-bezier(.785, .135, .15, .86);
	transition-timing-function:cubic-bezier(.785, .135, .15, .86);
}





/* 白色 =================================================================================== */

/* メインビジュアルのタイトルアニメーション */
.anime-titleW span { position:relative; overflow:hidden; }
.anime-titleW .anime-wrp { display:inline-block; width:100%; }
.h1.anime-titleW .anime-wrp, .anime-titleW .anime-wrp { width:auto; }
.anime-titleW span.txt-wrp { opacity:0; }

/*矩形の色を変えている*/
.anime-titleW > span.anime-wrp:after { content:" "; position:absolute; background:#fff; top:0; left:0; right:0; bottom:0; }
.anime-titleW.no-over > span.anime-wrp:after { overflow:hidden; visibility:hidden; -webkit-transform:translateX(-100%); transform:translateX(-100%); }
.anime-titleW.no-over > span.anime-wrp--right:after { -webkit-transform:translateX(100%); transform:translateX(100%); }

/*動く矩形を出している left版*/
.anime-titleW.is-end > span.anime-wrp:after {
	-webkit-transform: translateX(101%);
	transform: translateX(101%);
	transition: all .85s;
	-webkit-transition-timing-function:cubic-bezier(.785, .135, .15, .86);
	transition-timing-function:cubic-bezier(.785, .135, .15, .86);
}

/*動く矩形を出している right版*/
.anime-titleW.is-end > span.anime-wrp--right:after {
	-webkit-transform: translateX(-101%);
	transform: translateX(-101%);
	transition: all .85s;
	-webkit-transition-timing-function:cubic-bezier(.785, .135, .15, .86);
	transition-timing-function:cubic-bezier(.785, .135, .15, .86);
}