/*
* NSK
* top.css
*
*/
/* ------------------------
  Components
------------------------ */
::-moz-selection {
	background-color: #fff;
	color: #cc192e;
	text-shadow: none;
}

::selection {
	background-color: #fff;
	color: #cc192e;
	text-shadow: none;
}

.lp_container {
	overflow: hidden;
	position: relative;
	background: #fff;
}
.lp_container img {
	vertical-align: middle;
}
@media screen and (max-width: 767px) {
	.lp_container img {
		width: 100%; 
		max-width: none;
	}
}
@media screen and (min-width: 768px) {
	.lp_container .js-responsiveImg {
		visibility: hidden;
	}
}
.lp_container .visible-sp {
	display: inline;
}
@media screen and (min-width: 768px) {
	.lp_container .visible-sp {
		display: none;
	}
}
.lp_container .hidden-sp {
	display: none;
}
@media screen and (min-width: 768px) {
	.lp_container .hidden-sp {
		display: inline;
	}
}

/* --------------------------------
   key visual
-------------------------------- */
.kv {
	position: relative;
	z-index: 1;
	background: url(/special/img/kv_bg_dot_sp.png) center top no-repeat;
	background-size: 8px auto, cover;
}
@media screen and (min-width: 768px) {
	.kv {
		background: none;
	}
}

.kv_bg_movie {
	display: none;
}
@media screen and (min-width: 768px) {
	.kv_bg_movie {
		display: block;
		position: fixed;
		z-index: -1;
		top: 0;
		right: 0;
		left: 0;
		margin: auto;
		width: 100%;
		height: 100%;
		text-align: center;
	}
	.kv_bg_movie:before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: url(/special/img/kv_bg_dot.png);
	}
}
.kv_bg_movie video {
	position: absolute;
	z-index: -1;
	top: 50%;
	left: 50%;
	width: auto;
	min-width: 100%;
	height: auto; 
	min-height: 100%;
	-webkit-transform: translate(-50%, -56%);
	        transform: translate(-50%, -56%);
}

.kv_btn_movie {
	position: relative;
	margin: 0 auto;
}
.kv_btn_movie a {
	display: block; 
	position: relative;
}
.kv_btn_movie a:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(/special/img/movie_play_btn_deco.png) center center no-repeat;
	background-size: contain;
}
@media screen and (min-width: 768px) {
	.kv_btn_movie {
		width: 240px;
	}
	.kv_btn_movie a:hover:before {
		-webkit-animation: movieBtnRotate 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
		        animation: movieBtnRotate 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
	}
}

.kv_btn_movie_1 {
	position: relative;
	margin: 0 auto;
}
.kv_btn_movie_1 a {
	display: block; 
	position: relative;
}
.kv_btn_movie_1 a:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(/special/img/movie_play_btn_deco.png) center center no-repeat;
	background-size: contain;
}
@media screen and (min-width: 768px) {
	.kv_btn_movie_1 {
		width: 240px;
	}
	.kv_btn_movie_1 a:hover:before {
		-webkit-animation: movieBtnRotate 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
		        animation: movieBtnRotate 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
	}
}

.kv_btn_movie_2 {
	position: relative;
	margin: 0 auto;
}
.kv_btn_movie_2 a {
	display: block; 
	position: relative;
}
.kv_btn_movie_2 a:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(/special/img/movie_play_btn_deco.png) center center no-repeat;
	background-size: contain;
}
@media screen and (min-width: 768px) {
	.kv_btn_movie_2 {
		width: 240px;
	}
	.kv_btn_movie_2 a:hover:before {
		-webkit-animation: movieBtnRotate 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
		        animation: movieBtnRotate 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
	}
}

.kv_btn_movie_4 {
	position: relative;
	margin: 0 auto;
}
.kv_btn_movie_4 a {
	display: block; 
	position: relative;
}
.kv_btn_movie_4 a:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(/special/img/movie_play_btn_deco.png) center center no-repeat;
	background-size: contain;
}
@media screen and (min-width: 768px) {
	.kv_btn_movie_4 {
		width: 240px;
	}
	.kv_btn_movie_4 a:hover:before {
		-webkit-animation: movieBtnRotate 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
		        animation: movieBtnRotate 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
	}
}

.kv_btn_movie_5 {
        position: relative;
        margin: 0 auto;
}
.kv_btn_movie_5 a {
        display: block;
        position: relative;
}
.kv_btn_movie_5 a:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: url(/special/img/movie_play_btn_deco.png) center center no-repeat;
        background-size: contain;
}
@media screen and (min-width: 768px) {
        .kv_btn_movie_5 {
                width: 240px;
        }
        .kv_btn_movie_5 a:hover:before {
                -webkit-animation: movieBtnRotate 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
                        animation: movieBtnRotate 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
        }
}


@-webkit-keyframes movieBtnRotate {
	0% {
		-webkit-transform: rotate(0);
		        transform: rotate(0);
	}
	100% {
		-webkit-transform: rotate(360deg);
		        transform: rotate(360deg);
	}
}

@keyframes movieBtnRotate {
	0% {
		-webkit-transform: rotate(0);
		        transform: rotate(0);
	}
	100% {
		-webkit-transform: rotate(360deg);
		        transform: rotate(360deg);
	}
}

/* --------------------------------
   concept
-------------------------------- */
.concept {
	position: relative;
	z-index: 1;
	margin: 12.03125% 0 0;
	padding: 1px 0 0;
	background: #cc192e;
}
.concept:before {
	content: "";
	position: absolute;
	z-index: -1;
	bottom: 100%;
	left: 0;
	padding: 17.5% 0 0;
	width: 100%;
	height: 0;
	background: url(/special/img/section_stop_01_sp.png) center top no-repeat;
	background-size: cover;
}
@media screen and (min-width: 768px) {
	.concept {
		margin: 219px 0 0;
		padding: 1px 0 279px;
	}
	.concept:before {
		padding: 333px 0 0;
		background: url(/special/img/section_stop_01.png) center top no-repeat;
	}
}

@media screen and (min-width: 768px) {
	.concept_inner {
		position: relative;
		margin: 0 auto;
		max-width: 1000px;
	}
}

.concept_h_container {
	position: relative;
	margin: -17.5% 0 0;
}
@media screen and (min-width: 768px) {
	.concept_h_container {
		margin: -333px auto 0;
		width: 226px;
	}
}

.concept_h {
	margin: 4.0625% auto 0;
	width: 32.5%;
	font-size: 0;
}
@media screen and (min-width: 768px) {
	.concept_h {
		margin-top: 25px;
		width: 100%;
	}
}

.concept_girl {
	position: absolute;
	top: -310%;
	left: -5px;
	width: 30.46875%;
}
@media screen and (min-width: 768px) {
	.concept_girl {
		top: -313.9534884%;
		left: -231px;
		width: 210px;
	}
}

.concept_girl_word {
	position: absolute;
	top: -11.7948718%;
	right: -54.3589744%;
	width: 79.4871795%;
}
@media screen and (min-width: 780px) {
	.concept_girl_word {
		top: 69px;
		right: 150px;
		width: 105px;
		-webkit-transform: rotate(7deg);
		        transform: rotate(7deg);
	}
}

.concept_title {
	margin: 12.1875% auto 0;
	width: 39.0625%;
}
@media screen and (min-width: 768px) {
	.concept_title {
		margin-top: 106px;
		width: 542px;
	}
}

.concept_title_lead p {
	margin: 6.25% 0 0;
	text-align: center;
	letter-spacing: 0.14em; 
	color: #fff;
	font-size: 4.0625vw;
	line-height: 1.76923;
}
.concept_title_lead p strong {
	letter-spacing: 0.2em; 
	font-size: 5.3125vw;
	line-height: 1.2;
}
@media screen and (min-width: 768px) {
	.concept_title_lead p {
		margin: 35px 0 0; 
		font-size: 1.6rem;
		line-height: 2.25;
	}
	.concept_title_lead p strong {
		font-size: 2.6rem;
	}
}

.concept_img_girl {
	margin: 33.59375% auto 0;
	width: 85.3125%;
}
@media screen and (min-width: 768px) {
	.concept_img_girl {
		margin-top: 32px;
		width: 678px;
	}
}

/* object */
.concept_obj_floating span {
	display: block;
	position: absolute;
	z-index: -1;
	top: 0;
	-webkit-animation-name: floating;
	        animation-name: floating;
	-webkit-animation-duration: 6.6s;
	        animation-duration: 6.6s;
	-webkit-animation-iteration-count: infinite;
	        animation-iteration-count: infinite;
}

.concept_obj_floating_01 {
	left: -1.40625%;
	margin: 8.4375% 0 0;
	width: 24.0625%;
}
@media screen and (min-width: 768px) {
	.concept_obj_floating_01 {
		left: 3.1%;
		margin: 284px 0 0;
		width: 13.8%;
	}
}

.concept_obj_floating_02 {
	left: 63.59375%;
	margin: 152.1875% 0 0;
	width: 26.40625%;
	-webkit-animation-delay: 2.3s;
	        animation-delay: 2.3s;
}
@media screen and (min-width: 768px) {
	.concept_obj_floating_02 {
		left: 78.7%;
		margin: 468px 0 0;
		width: 24.4%;
	}
}

.concept_obj_floating_03 {
	left: -2.65625%;
	margin: 217.34375% 0 0;
	width: 21.875%;
	-webkit-animation-delay: -1.8s;
	        animation-delay: -1.8s;
}
@media screen and (min-width: 768px) {
	.concept_obj_floating_03 {
		left: -0.5%;
		margin: 885px 0 0;
		width: 17.1%;
	}
}

@-webkit-keyframes floating {
	0% {
		-webkit-transform: translateY(12px);
		        transform: translateY(12px);
	}
	50% {
		-webkit-transform: translateY(-12px);
		        transform: translateY(-12px);
	}
	100% {
		-webkit-transform: translateY(12px);
		        transform: translateY(12px);
	}
}

@keyframes floating {
	0% {
		-webkit-transform: translateY(12px);
		        transform: translateY(12px);
	}
	50% {
		-webkit-transform: translateY(-12px);
		        transform: translateY(-12px);
	}
	100% {
		-webkit-transform: translateY(12px);
		        transform: translateY(12px);
	}
}

.concept_obj_rotation span {
	display: block;
	position: absolute;
	z-index: -1;
	top: 0;
}

.concept_obj_rotation_01 {
	left: 74.21875%;
	margin: 2.96875% 0 0;
	width: 18.125%;
	-webkit-animation: rotationR 8s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
	        animation: rotationR 8s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
}
@media screen and (min-width: 768px) {
	.concept_obj_rotation_01 {
		left: 80.2%;
		margin: 412px 0 0;
		width: 9.3%;
	}
}

.concept_obj_rotation_02 {
	left: 9.375%;
	margin: 160.15625% 0 0;
	width: 35.9375%;
	-webkit-animation: rotationL 17s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
	        animation: rotationL 17s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
}
@media screen and (min-width: 768px) {
	.concept_obj_rotation_02 {
		left: 4.3%;
		margin: 644px 0 0;
		width: 18.3%;
	}
}

.concept_obj_rotation_03 {
	left: 83.125%;
	margin: 219.84375% 0 0;
	width: 18.4375%;
	-webkit-animation: rotationR 11.5s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
	        animation: rotationR 11.5s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
}
@media screen and (min-width: 768px) {
	.concept_obj_rotation_03 {
		left: 78.4%;
		margin: 932px 0 0;
		width: 11.8%;
	}
}

@-webkit-keyframes rotationR {
	0% {
		-webkit-transform: rotate(0);
		        transform: rotate(0);
	}
	100% {
		-webkit-transform: rotate(360deg);
		        transform: rotate(360deg);
	}
}

@keyframes rotationR {
	0% {
		-webkit-transform: rotate(0);
		        transform: rotate(0);
	}
	100% {
		-webkit-transform: rotate(360deg);
		        transform: rotate(360deg);
	}
}

@-webkit-keyframes rotationL {
	0% {
		-webkit-transform: rotate(0);
		        transform: rotate(0);
	}
	100% {
		-webkit-transform: rotate(-360deg);
		        transform: rotate(-360deg);
	}
}

@keyframes rotationL {
	0% {
		-webkit-transform: rotate(0);
		        transform: rotate(0);
	}
	100% {
		-webkit-transform: rotate(-360deg);
		        transform: rotate(-360deg);
	}
}

/* --------------------------------
  creative
-------------------------------- */
.creative {
	position: relative;
	z-index: 1;
	margin: 9.6875% 0 0;
	padding: 1px 0 33.59375%;
	background: url(/special/img/content_bg_texture.png) center center;
}
.creative:before {
	content: "";
	position: absolute;
	z-index: -1;
	bottom: 100%;
	left: 0;
	padding: 17.5% 0 0;
	width: 100%;
	height: 0;
	background: url(/special/img/section_stop_02_sp.png) center top no-repeat;
	background-size: cover;
}
@media screen and (min-width: 768px) {
	.creative {
		margin: 0;
		padding: 1px 0 483px;
	}
	.creative:before {
		padding: 333px 0 0;
		background: url(/special/img/section_stop_02.png) center top no-repeat;
	}
}

@media screen and (min-width: 768px) {
	.creative_inner {
		position: relative;
		margin: 0 auto;
		max-width: 1000px;
	}
}

.creative_h_container {
	position: relative;
	margin: -13.75% 0 0;
}
@media screen and (min-width: 768px) {
	.creative_h_container {
		margin: -311px auto 0;
		width: 448px;
	}
}

.creative_h {
	margin: 0 auto;
	width: 65.3125%;
	font-size: 0;
}
@media screen and (min-width: 768px) {
	.creative_h {
		width: 100%;
	}
}

.creative_girl {
	position: absolute;
	top: -146.1538462%;
	right: -6.09375%;
	width: 26.40625%;
}
@media screen and (min-width: 768px) {
	.creative_girl {
		top: -150%;
		right: -183px;
		width: 190px;
	}
}

.creative_girl_word {
	position: absolute;
	top: -13.7055838%;
	left: -26.6272189%;
	width: 62.7218935%;
}
@media screen and (min-width: 850px) {
	.creative_girl_word {
		top: 15px;
		left: 133px;
		width: 72px;
		-webkit-transform: rotate(-22deg);
		        transform: rotate(-22deg);
	}
}

@media screen and (min-width: 768px) {
	.creative_introduction {
		margin: 124px 0 0;
	}
}

.creative_introduction_cont {
	position: relative;
	z-index: 1;
	margin: 18.125% 0 0;
}
.creative_introduction_cont:before {
	content: "";
	position: absolute;
	z-index: -1;
	top: -4px;
	left: 4.21875%;
	padding-top: 30%;
	border-radius: 50%; 
	width: 30%;
	height: 0;
	background: #fff;
}
@media screen and (min-width: 768px) {
	.creative_introduction_cont {
		margin: 63px 13.5% 0 11.3%;
	}
	.creative_introduction_cont:before {
		top: 9.785106%;
		left: -10px;
		padding-top: 18.6170213%; 
		width: 18.6170213%;
	}
}

@media screen and (min-width: 768px) {
	.creative_introduction_cont_02:before {
		left: 47.3404255%;
	}
}

.creative_introduction_h {
	margin: 0 auto;
}
@media screen and (min-width: 768px) {
	.creative_introduction_h {
		margin: 12.6329787% 0 0;
	}
}
.creative_introduction_cont_01 .creative_introduction_h {
	width: 71.25%;
}
@media screen and (min-width: 768px) {
	.creative_introduction_cont_01 .creative_introduction_h {
		float: left;
		margin-left: 5.8510638%;
		width: 41.6223404%;
	}
}
.creative_introduction_cont_02 .creative_introduction_h {
	width: 39.6875%;
}
@media screen and (min-width: 768px) {
	.creative_introduction_cont_02 .creative_introduction_h {
		float: right;
		width: 45.212766%;
	}
	.creative_introduction_cont_02 .creative_introduction_h img {
		width: 174px;
	}
}

.creative_introduction_thumb {
	margin: 6.25% auto 0;
	width: 61.5625%;
}
@media screen and (min-width: 768px) {
	.creative_introduction_thumb {
		margin: 0;
		width: 41.7553191%;
	}
	.creative_introduction_thumb a {
		transition: opacity 0.3s;
	}
	.creative_introduction_thumb a:hover {
		opacity: 0.7;
	}
}
@media screen and (min-width: 768px) {
	.creative_introduction_cont_01 .creative_introduction_thumb {
		float: right;
		margin-left: 10px;
	}
}
@media screen and (min-width: 768px) {
	.creative_introduction_cont_02 .creative_introduction_thumb {
		float: left;
		margin-right: 10px;
	}
}

.creative_introduction_txt {
	margin: 4.6875% 7.03125%;
	letter-spacing: 0.14em; 
	color: #656565;
	font-size: 4.0625vw;
	line-height: 1.76923;
}
@media screen and (min-width: 768px) {
	.creative_introduction_txt {
		margin: 20px 0 0;
		padding-left: 8px;
		width: 45.212766%;
		font-size: 1.6rem;
		line-height: 1.75;
	}
}
@media screen and (min-width: 768px) {
	.creative_introduction_cont_01 .creative_introduction_txt {
		float: left;
		margin-left: 5.8510638%;
	}
}
@media screen and (min-width: 768px) {
	.creative_introduction_cont_02 .creative_introduction_txt {
		float: right;
	}
}

/* object */
.creative_obj_rotation span {
	display: block;
	position: absolute;
	z-index: -1;
	top: 0;
}

.creative_obj_rotation_01 {
	left: 69.53125%;
	margin: 44.6875% 0 0;
	width: 26.25%;
	-webkit-animation: rotationR 18s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
	        animation: rotationR 18s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
}
@media screen and (min-width: 768px) {
	.creative_obj_rotation_01 {
		left: 82.6%;
		margin: 267px 0 0;
		width: 16.8%;
	}
}

.creative_obj_rotation_02 {
	left: 61.40625%;
	margin: 169.0625% 0 0;
	width: 44.0625%;
	-webkit-animation: rotationR 9s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
	        animation: rotationR 9s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
}
@media screen and (min-width: 768px) {
	.creative_obj_rotation_02 {
		left: -2.2%;
		margin: 723px 0 0;
		width: 11.3%;
	}
}

.creative_obj_rotation_03 {
	left: 4.84375%;
	margin: 252.96875% 0 0;
	width: 17.8125%;
	-webkit-animation: rotationL 30s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
	        animation: rotationL 30s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
}
@media screen and (min-width: 768px) {
	.creative_obj_rotation_03 {
		left: 68.4%;
		margin: 1038px 0 0;
		width: 29.4%;
	}
}

/* --------------------------------
  contents
-------------------------------- */
.contents {
	position: relative;
	z-index: 1;
	padding: 1px 0 37.96875%;
	background: #cc192e;
}
.contents:before {
	content: "";
	position: absolute;
	z-index: -1;
	bottom: 100%;
	left: 0;
	padding: 17.5% 0 0;
	width: 100%;
	height: 0;
	background: url(/special/img/section_stop_01_sp.png) center top no-repeat;
	background-size: cover;
}
@media screen and (min-width: 768px) {
	.contents {
		margin: 0px 0 0;
		padding: 1px 0 427px;
	}
	.contents:before {
		padding: 333px 0 0;
		background: url(/special/img/section_stop_01.png) center top no-repeat;
	}
}

@media screen and (min-width: 768px) {
	.contents_inner {
		position: relative;
		margin: 0 auto;
		max-width: 1000px;
	}
}

.contents_h_container {
	position: relative;
	margin: -14.0625% 0 0;
}
@media screen and (min-width: 768px) {
	.contents_h_container {
		margin: -309px auto 0;
		width: 248px;
	}
}

.contents_h {
	margin: 0 auto;
	width: 35%;
	font-size: 0;
}
@media screen and (min-width: 768px) {
	.contents_h {
		width: 100%;
	}
}

.contents_girl {
	position: absolute;
	top: -357.428571%;
	left: -0.9375%;
	width: 30.46875%;
}
@media screen and (min-width: 768px) {
	.contents_girl {
		top: -363.155%;
		left: -221px;
		width: 203px;
	}
}

.contents_girl_word {
	position: absolute;
	top: -6.1538462%;
	right: -72.3076923%;
	width: 78.4615385%;
}
@media screen and (min-width: 780px) {
	.contents_girl_word {
		top: 64px;
		right: 144px;
		width: 102px;
		-webkit-transform: rotate(13deg);
		        transform: rotate(13deg);
	}
}

.contents_introduction {
	position: relative;
	padding: 23.672222% 15.4320988%;
	border-radius: 50%;
	width: 101.25%;
	background: #fff;
}
.contents_introduction:before {
	content: "";
	position: absolute;
	padding-top: 100%;
	width: 61.1111%;
	height: 0; 
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
}

.contents_introduction_01 {
	margin: 55.9375% 0 0 9.375%;
}
.contents_introduction_01:before {
	top: -40.7751938%;
	left: -14.9691%;
	background-image: url(/special/img/contents_img_01.png);
}
@media screen and (min-width: 768px) {
	.contents_introduction_01 {
		margin: 89px 0 0 45.7%;
		padding: 85px 55px 85px 65px;
		width: 375px;
		height: 375px;
	}
	.contents_introduction_01:before {
		top: 79px;
		left: -80.5333333%;
		padding-top: 306px; 
		width: 306px;
	}
}

.contents_introduction_02 {
	margin: 62.5% 0 0 -10.9375%;
}
.contents_introduction_02:before {
	top: -43.5658915%;
	left: 54.012345%;
	background-image: url(/special/img/contents_img_02.png);
}
@media screen and (min-width: 768px) {
	.contents_introduction_02 {
		margin: 71px 0 0 10.7%;
		padding: 92px 60px 90px 72px;
		width: 386px;
		height: 386px;
	}
	.contents_introduction_02:before {
		top: -5px;
		left: 97.9328165%;
		padding-top: 266px; 
		width: 266px;
	}
}

.contents_introduction_03 {
	margin: 55% 0 0 9.375%;
}
.contents_introduction_03:before {
	top: -40.7751938%;
	left: -14.9691%;
	background-image: url(/special/img/contents_img_03.png);
}
@media screen and (min-width: 768px) {
	.contents_introduction_03 {
		margin: -42px 0 0 48.2%;
		padding: 75px 46px 80px 58px;
		width: 364px;
		height: 364px;
	}
	.contents_introduction_03:before {
		top: 194px;
		left: -61.2637363%;
		padding-top: 260px; 
		width: 260px;
	}
	.contents_introduction_03:after {
		content: "";
		position: absolute;
		top: 120px;
		left: -96.978022%;
		width: 169px;
		height: 169px;
		background: url(/special/img/contents_img_04.png) 0 0 no-repeat;
	}
}

.contents_introduction_h {
	margin: 0;
	text-align: center;
	color: #cc192e;
	font-size: 5.3125vw;
	font-weight: bold; 
	line-height: 1;
}
@media screen and (min-width: 768px) {
	.contents_introduction_h {
		font-size: 2rem;
	}
}

.contents_introduction_txt {
	margin: 5.5555556% 0 0;
	letter-spacing: 0.14em; 
	font-size: 3.75vw;
	line-height: 1.75;
}
@media screen and (min-width: 768px) {
	.contents_introduction_txt {
		margin: 20px 0 0;
		font-size: 1.4rem;
		line-height: 1.71429;
	}
}

.contents_introduction_btn {
	position: absolute;
	z-index: 1;
	right: 16.5123457%;
	bottom: -5.1162791%;
	margin: 0; 
	width: 20.6790123%;
}
.contents_introduction_btn a {
	display: block;
	position: relative;
	transition: -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.contents_introduction_btn a:before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	right: 0;
	bottom: 0;
	left: -5.9701493%;
	margin: auto;
	width: 111.19%;
	height: 111.19%;
	-webkit-animation: rotationL 15s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
	        animation: rotationL 15s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75); 
	background: url(/special/img/contents_btn_more_deco.png) 0 0 no-repeat;
	background-size: cover;
}
.contents_introduction_btn a:hover {
	-webkit-transform: scale(1.2);
	        transform: scale(1.2);
}
.contents_introduction_btn a:hover:before {
	-webkit-animation-duration: 5s;
	        animation-duration: 5s;
}
@media screen and (min-width: 768px) {
	.contents_introduction_btn {
		right: 44px;
		bottom: -14px;
		width: 84px;
	}
}

.contents_introduction_02_girl {
	position: absolute;
	z-index: -1;
	top: -24.9612403%;
	left: 19.5987%;
	width: 36.7284%;
}
@media screen and (min-width: 768px) {
	.contents_introduction_02_girl {
		top: -76px;
		left: -5px;
		width: 150px;
		-webkit-transform: rotate(-19deg);
		        transform: rotate(-19deg);
	}
}

.contents_introduction_02_girl_word {
	position: absolute;
	top: -25.6%;
	left: -6.302521%;
	width: 48.7394958%;
}
@media screen and (min-width: 768px) {
	.contents_introduction_02_girl_word {
		top: 41px;
		left: -81px;
		width: 79px;
		-webkit-transform: rotate(24deg);
		        transform: rotate(24deg);
	}
}

.contents_introduction_03_girl {
	position: absolute;
	z-index: -1;
	top: -21.55038%;
	left: 53.39506%;
	width: 33.7963%;
}
@media screen and (min-width: 768px) {
	.contents_introduction_03_girl {
		top: -62px;
		left: 243px;
		width: 152px;
		-webkit-transform: rotate(19deg);
		        transform: rotate(19deg);
	}
}

.contents_introduction_03_girl_word {
	position: absolute;
	top: -19.3877551%;
	left: 39.7260274%;
	width: 47.0319635%;
}

/* object */
.contents_obj_rotation span {
	display: block;
	position: absolute;
	z-index: -1;
	top: 0;
}

.contents_obj_rotation_01 {
	left: 65%;
	margin: 6.25% 0 0;
	width: 22.5%;
	-webkit-animation: rotationR 16s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
	        animation: rotationR 16s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
}
@media screen and (min-width: 768px) {
	.contents_obj_rotation_01 {
		left: 10.2%;
		margin: 219px 0 0;
		width: 10%;
	}
}

.contents_obj_rotation_02 {
	left: -7.8125%;
	margin: 135.46875% 0 0;
	width: 36.875%;
	-webkit-animation: rotationL 42s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
	        animation: rotationL 42s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
}
@media screen and (min-width: 768px) {
	.contents_obj_rotation_02 {
		left: 80.6%;
		margin: 514px 0 0;
		width: 20.7%;
	}
}

.contents_obj_rotation_03 {
	left: 80.9375%;
	margin: 305.3125% 0 0;
	width: 25.78125%;
	-webkit-animation: rotationR 19s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
	        animation: rotationR 19s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
}
@media screen and (min-width: 768px) {
	.contents_obj_rotation_03 {
		left: 91.3%;
		margin: 672px 0 0;
		width: 9.2%;
	}
}

.contents_obj_rotation_04 {
	left: -5.625%;
	margin: 460.65625% 0 0;
	width: 42.8125%;
	-webkit-animation: rotationR 52s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
	        animation: rotationR 52s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
}
@media screen and (min-width: 768px) {
	.contents_obj_rotation_04 {
		left: -4.3%;
		margin: 957px 0 0;
		width: 25.7%;
	}
}

.contents_obj_rotation_05 {
	-webkit-animation: rotationL 14s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
	        animation: rotationL 14s infinite cubic-bezier(0.25, 0.25, 0.75, 0.75);
}
@media screen and (max-width: 767px) {
	.contents_obj_rotation_05 {
		display: none !important;
	}
}
@media screen and (min-width: 768px) {
	.contents_obj_rotation_05 {
		left: 87.6%;
		margin: 1331px 0 0;
		width: 7.2%;
	}
}

/* --------------------------------
  connect
-------------------------------- */
.connect {
	position: relative;
	z-index: 1;
	padding: 1px 0;
	background: url(/special/img/content_bg_texture.png) center center;
}
.connect:before {
	content: "";
	position: absolute;
	z-index: -1;
	bottom: 100%;
	left: 0;
	padding: 17.5% 0 0;
	width: 100%;
	height: 0;
	background: url(/special/img/section_stop_02_sp.png) center top no-repeat;
	background-size: cover;
}
@media screen and (min-width: 768px) {
	.connect:before {
		padding: 268px 0 0;
		background: url(/special/img/section_stop_02.png) center top no-repeat;
	}
}

@media screen and (min-width: 768px) {
	.connect_inner {
		position: relative;
		margin: 0 auto;
		max-width: 1000px;
	}
}

.connect_h_container {
	position: relative;
	margin: -13.68125% 0 0;
}
@media screen and (min-width: 768px) {
	.connect_h_container {
		margin: -244px auto 0;
		width: 226px;
	}
}

.connect_h {
	margin: 0 auto;
	width: 33.125%;
	font-size: 0;
}
@media screen and (min-width: 768px) {
	.connect_h {
		width: 100%;
	}
}

.connect_girl {
	position: absolute;
	top: -215.625%;
	right: 7.8125%;
	width: 25.3125%;
}
@media screen and (min-width: 768px) {
	.connect_girl {
		top: -197.0588235%;
		right: -172px;
		width: 162px;
	}
}

.connect_girl_word {
	position: absolute;
	top: 8.1632653%;
	left: 80.2469136%;
	width: 42.5925926%;
}
@media screen and (min-width: 768px) {
	.connect_girl_word {
		top: 15px;
		left: 142px;
		width: 46px;
	}
}

.connect_sns {
	display: -ms-flexbox;
	display: flex;
	position: relative;
	margin: 14.6875% 14.0625% 9.375%;

	-ms-flex-pack: justify;

	    justify-content: space-between;
}
.connect_sns:before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	width: 1px;
	height: 112.244898%;
	background-image: linear-gradient(#cc192e 50%, transparent 50%, transparent);
	background-size: 4px 4px;
}
.connect_sns li {
	margin: 0;
	padding: 0;
	width: 35.4978355%; 
	background: none;
}
@media screen and (min-width: 768px) {
	.connect_sns {
		margin: 106px 19.6% 68px;
	}
	.connect_sns:before {
		right: auto; 
		left: 39.538715%;
	}
	.connect_sns li a {
		transition: opacity 0.3s;
	}
	.connect_sns li a:hover {
		opacity: 0.6;
	}
	.connect_sns li:nth-child(1) {
		width: 208px;
	}
	.connect_sns li:nth-child(2) {
		margin-left: 64px;
		width: 336px;
	}
}

/* --------------------------------
  banner
-------------------------------- */
.bnr_recruit {
	position: relative;
	z-index: 1;
	background: #fff;
}

.bnr_recruit_inner {
	display: -ms-flexbox;
	display: flex;
	padding: 0.9375%;

	-ms-flex-pack: justify;

	    justify-content: space-between;
}
.bnr_recruit_inner p {
	margin: 0;
	width: 49.3630573%;
	font-size: 0;
	line-height: 1;
}
@media screen and (min-width: 768px) {
	.bnr_recruit_inner {
		margin: 0 auto;
		padding: 14px 0;
		max-width: 764px;
	}
	.bnr_recruit_inner p {
		width: 48.9528796%;
	}
	.bnr_recruit_inner p a {
		transition: opacity 0.3s;
	}
	.bnr_recruit_inner p a:hover {
		opacity: 0.8;
	}
}

.l-footer {
	position: relative;
	z-index: 1;
	background: #fff;
}

/* --------------------------------
  movie modal
-------------------------------- */
.kv_modalMovie {
	visibility: hidden; 
	opacity: 0;
	position: fixed;
	z-index: 1000;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	transition: opacity 0.3s, visibility 0.3s;
}
.visible-movieModal .kv_modalMovie {
	visibility: visible; 
	opacity: 1;
}

.kv_modalMovie_bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(51, 51, 51, 0.8);
}

.kv_modalMovie_container {
	position: relative;
	z-index: 1;
	margin: auto;
	width: 87.1875%;
	max-width: 120vh;
	height: 100%;
}
@media screen and (min-width: 768px) {
	.kv_modalMovie_container {
		width: 80%;
	}
}

.kv_modalMovie_loader {
	opacity: 0; 
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	padding-bottom: 56.25%;
	height: 0;
	transition: opacity 0.5s, -webkit-transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0.5s;
	transition: transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0.5s, -webkit-transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	-webkit-transform: scale(0.9);
	        transform: scale(0.9);
}
.visible-movieModal .kv_modalMovie_loader {
	opacity: 1;
	transition-delay: 0.5s; 
	-webkit-transform: scale(1); 
	        transform: scale(1);
}
.kv_modalMovie_loader iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.kv_modalMovie_close,
.creative_modal_close {
	opacity: 0; 
	position: absolute;
	right: 0;
	bottom: -68px;
	left: 0;
	margin: auto;
	border: 1.5px dashed #fff;
	border-radius: 50%;
	width: 53px;
	height: 53px;
	-webkit-transform: scale(0.5) rotate(360deg);
	        transform: scale(0.5) rotate(360deg);
}
@media screen and (min-width: 768px) {
	.kv_modalMovie_close,
	.creative_modal_close {
		right: 0;
		bottom: 100%;
		left: 100%;
		width: 7vw;
		max-width: 106px;
		height: 7vw;
		max-height: 106px;
	}
}
.kv_modalMovie_close span,
.creative_modal_close span {
	display: block;
	overflow: hidden;
	width: 100%;
	height: 100%;
	cursor: pointer; 
	-webkit-transform: rotate(45deg); 
	        transform: rotate(45deg);
	white-space: nowrap;
	text-indent: 100%;
	font-size: 0;
}
.kv_modalMovie_close span:before,
.kv_modalMovie_close span:after,
.creative_modal_close span:before,
.creative_modal_close span:after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	transition: background-color 0.3s; 
	background: #fff;
}
.kv_modalMovie_close span:before,
.creative_modal_close span:before {
	width: 54.717%;
	height: 1px;
}
.kv_modalMovie_close span:after,
.creative_modal_close span:after {
	width: 1px;
	height: 54.717%;
}
.kv_modalMovie_close:hover,
.creative_modal_close:hover {
	border-color: #cc192e;
}
.kv_modalMovie_close:hover span:before,
.kv_modalMovie_close:hover span:after,
.creative_modal_close:hover span:before,
.creative_modal_close:hover span:after {
	background-color: #cc192e;
}

.kv_modalMovie_close {
	transition: opacity 0.5s 1s, border-color 0.3s, -webkit-transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 1s;
	transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 1s, opacity 0.5s 1s, border-color 0.3s;
	transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 1s, opacity 0.5s 1s, border-color 0.3s, -webkit-transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 1s;
}
.visible-movieModal .kv_modalMovie_close {
	opacity: 1; 
	-webkit-transform: scale(1) rotate(0); 
	        transform: scale(1) rotate(0);
}

.creative_modal_close {
	transition: opacity 0.5s 0.5s, border-color 0.3s, -webkit-transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s;
	transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s, opacity 0.5s 0.5s, border-color 0.3s;
	transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s, opacity 0.5s 0.5s, border-color 0.3s, -webkit-transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s;
}
.visible-modal .creative_modal_close {
	opacity: 1; 
	-webkit-transform: scale(1) rotate(0); 
	        transform: scale(1) rotate(0);
}

/* --------------------------------
  poster modal
-------------------------------- */
.creative_modal {
	visibility: hidden; 
	opacity: 0;
	position: fixed;
	z-index: 1000;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	transition: opacity 0.3s, visibility 0.3s;
}
.visible-modal .creative_modal {
	visibility: visible; 
	opacity: 1;
}

.creative_modal_bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(51, 51, 51, 0.8);
}

.creative_modal_container {
	position: relative;
	z-index: 1;
	margin: auto;
	width: 87.1875%;
	max-width: 62.5vh;
	height: 100%;
}
@media screen and (min-width: 768px) {
	.creative_modal_container {
		margin-top: 40px; 
		width: 550px;
	}
}

.creative_modal_content {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	padding-bottom: 134.72%;
	height: 0;
}

.creative_modal_poster {
	visibility: hidden; 
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	transition: opacity 0.5s, visibility 0.5s, -webkit-transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.5s, visibility 0.5s, transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.5s, visibility 0.5s, transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	-webkit-transform: scale(0.9);
	        transform: scale(0.9);
}
.creative_modal_poster.is-current {
	visibility: visible;
	opacity: 1;
	-webkit-transform: scale(1);
	        transform: scale(1);
}

.creative_modal_ctrl {
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	width: 100%;
	height: 10.918775%;
}
.creative_modal_ctrl span {
	display: block;
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	border-radius: 50%; 
	width: 100%;
	height: 100%;
	background: rgba(51, 51, 51, 0.5);
	white-space: nowrap;
	text-indent: 100%;
	font-size: 0;
}
.creative_modal_ctrl svg {
	position: absolute;
	top: 0;
	left: 0;
}
@media screen and (min-width: 768px) {
	.creative_modal_ctrl svg {
		stroke-width: 0.6px;
	}
	.creative_modal_ctrl svg polygon {
		transition: stroke 0.4s;
	}
	.creative_modal_ctrl svg:hover polygon {
		stroke: #cc192e;
	}
}
@media screen and (min-width: 768px) {
	.creative_modal_ctrl {
		height: 62px;
	}
	.creative_modal_ctrl span {
		background: none;
	}
}

#modal_ctrl_prev,
#modal_ctrl_next {
	position: absolute;
	top: 0;
	margin: 0;
	padding-top: 14.6953%;
	width: 14.6953%;
	height: 0;
	cursor: pointer;
}
@media screen and (min-width: 768px) {
	#modal_ctrl_prev,
	#modal_ctrl_next {
		padding-top: 22.04295%;
		width: 22.04295%;
		-webkit-transform: translateY(-25%);
		        transform: translateY(-25%);
	}
}

#modal_ctrl_prev {
	left: -7.3476703%;
}
@media screen and (min-width: 768px) {
	#modal_ctrl_prev {
		left: -120px;
	}
}

#modal_ctrl_next {
	right: -7.3476703%;
}
@media screen and (min-width: 768px) {
	#modal_ctrl_next {
		right: -120px;
	}
}

/* --------------------------------
  scroll animation
-------------------------------- */
.concept_inner .concept_h,
.concept_inner .concept_girl {
	opacity: 0;
	-webkit-transform: rotate(-20deg);
	        transform: rotate(-20deg);
}

.concept_inner .concept_h {
	transition: opacity 0.5s, -webkit-transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.5s, transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.5s, transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition-delay: 1.5s;
	-webkit-transform-origin: center 1000px;
	        transform-origin: center 1000px;
}
@media screen and (min-width: 768px) {
	.concept_inner .concept_h {
		transition-delay: 0s; 
		-webkit-transform-origin: center 1500px; 
		        transform-origin: center 1500px;
	}
}

.concept_inner .concept_girl {
	transition: opacity 0.4s, -webkit-transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
	transition-delay: 1.65s;
	-webkit-transform-origin: right 1000px;
	        transform-origin: right 1000px;
}
@media screen and (min-width: 768px) {
	.concept_inner .concept_girl {
		transition-delay: 0.15s;
		-webkit-transform-origin: right 1130px;
		        transform-origin: right 1130px;
	}
}

.concept_inner .concept_girl_word {
	opacity: 0;
	transition: opacity 0.4s, -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition-delay: 2.2s;
	-webkit-transform: scale(0);
	        transform: scale(0);
	-webkit-transform-origin: left bottom;
	        transform-origin: left bottom;
}
@media screen and (min-width: 768px) {
	.concept_inner .concept_girl_word {
		transition-delay: 0.7s; 
		-webkit-transform-origin: right top; 
		        transform-origin: right top;
	}
}

.concept_inner.is-inview .concept_h,
.concept_inner.is-inview .concept_girl {
	opacity: 1;
	-webkit-transform: rotate(0);
	        transform: rotate(0);
}

.concept_inner.is-inview .concept_girl_word {
	opacity: 1;
	-webkit-transform: scale(1);
	        transform: scale(1);
}

.creative_inner .creative_h,
.creative_inner .creative_girl {
	opacity: 0;
	-webkit-transform: rotate(20deg);
	        transform: rotate(20deg);
}

.creative_inner .creative_h {
	transition: opacity 0.5s, -webkit-transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.5s, transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.5s, transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	-webkit-transform-origin: center 1000px;
	        transform-origin: center 1000px;
}
@media screen and (min-width: 768px) {
	.creative_inner .creative_h {
		-webkit-transform-origin: center 1500px;
		        transform-origin: center 1500px;
	}
}

.creative_inner .creative_girl {
	transition: opacity 0.4s, -webkit-transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
	transition-delay: 0.15s;
	-webkit-transform-origin: left 1000px;
	        transform-origin: left 1000px;
}
@media screen and (min-width: 768px) {
	.creative_inner .creative_girl {
		-webkit-transform-origin: left 1100px;
		        transform-origin: left 1100px;
	}
}

.creative_inner .creative_girl_word {
	opacity: 0;
	transition: opacity 0.4s, -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition-delay: 0.7s;
	-webkit-transform: scale(0);
	        transform: scale(0);
	-webkit-transform-origin: right bottom;
	        transform-origin: right bottom;
}
@media screen and (min-width: 768px) {
	.creative_inner .creative_girl_word {
		-webkit-transform-origin: left bottom;
		        transform-origin: left bottom;
	}
}

.creative_inner.is-inview .creative_h,
.creative_inner.is-inview .creative_girl {
	opacity: 1;
	-webkit-transform: rotate(0);
	        transform: rotate(0);
}

.creative_inner.is-inview .creative_girl_word {
	opacity: 1;
	-webkit-transform: scale(1);
	        transform: scale(1);
}

.contents_inner .contents_h,
.contents_inner .contents_girl {
	opacity: 0;
	-webkit-transform: rotate(-20deg);
	        transform: rotate(-20deg);
}

.contents_inner .contents_h {
	transition: opacity 0.5s, -webkit-transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.5s, transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.5s, transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	-webkit-transform-origin: center 1000px;
	        transform-origin: center 1000px;
}
@media screen and (min-width: 768px) {
	.contents_inner .contents_h {
		-webkit-transform-origin: center 1500px;
		        transform-origin: center 1500px;
	}
}

.contents_inner .contents_girl {
	transition: opacity 0.4s, -webkit-transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
	transition-delay: 0.15s;
	-webkit-transform-origin: right 1000px;
	        transform-origin: right 1000px;
}
@media screen and (min-width: 768px) {
	.contents_inner .contents_girl {
		-webkit-transform-origin: right 1050px;
		        transform-origin: right 1050px;
	}
}

.contents_inner .contents_girl_word {
	opacity: 0;
	transition: opacity 0.4s, -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition-delay: 0.7s;
	-webkit-transform: scale(0);
	        transform: scale(0);
	-webkit-transform-origin: left bottom;
	        transform-origin: left bottom;
}
@media screen and (min-width: 768px) {
	.contents_inner .contents_girl_word {
		-webkit-transform-origin: right top;
		        transform-origin: right top;
	}
}

.contents_inner.is-inview .contents_h,
.contents_inner.is-inview .contents_girl {
	opacity: 1;
	-webkit-transform: rotate(0);
	        transform: rotate(0);
}

.contents_inner.is-inview .contents_girl_word {
	opacity: 1;
	-webkit-transform: scale(1);
	        transform: scale(1);
}

.connect_inner .connect_h,
.connect_inner .connect_girl {
	opacity: 0;
	-webkit-transform: rotate(20deg);
	        transform: rotate(20deg);
}

.connect_inner .connect_h {
	transition: opacity 0.5s, -webkit-transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.5s, transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.5s, transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	-webkit-transform-origin: center 1000px;
	        transform-origin: center 1000px;
}
@media screen and (min-width: 768px) {
	.connect_inner .connect_h {
		-webkit-transform-origin: center 1500px;
		        transform-origin: center 1500px;
	}
}

.connect_inner .connect_girl {
	transition: opacity 0.4s, -webkit-transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
	transition-delay: 0.15s;
	-webkit-transform-origin: left 1000px;
	        transform-origin: left 1000px;
}
@media screen and (min-width: 768px) {
	.connect_inner .connect_girl {
		-webkit-transform-origin: left 1145px;
		        transform-origin: left 1145px;
	}
}

.connect_inner .connect_girl_word {
	opacity: 0;
	transition: opacity 0.4s, -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition-delay: 0.7s;
	-webkit-transform: scale(0);
	        transform: scale(0);
	-webkit-transform-origin: left bottom;
	        transform-origin: left bottom;
}

.connect_inner.is-inview .connect_h,
.connect_inner.is-inview .connect_girl {
	opacity: 1;
	-webkit-transform: rotate(0);
	        transform: rotate(0);
}

.connect_inner.is-inview .connect_girl_word {
	opacity: 1;
	-webkit-transform: scale(1);
	        transform: scale(1);
}

.contents_introduction_02_girl {
	opacity: 0;
	transition: opacity 0.4s, -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform-origin 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), transform-origin 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), transform-origin 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform-origin 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	-webkit-transform: rotate(-40deg);
	        transform: rotate(-40deg);
	-webkit-transform-origin: 150% 180%;
	        transform-origin: 150% 180%;
}
.contents_introduction_02_girl .contents_introduction_02_girl_word {
	opacity: 0;
	transition: opacity 0.4s, -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition-delay: 0.5s;
	-webkit-transform: scale(0);
	        transform: scale(0);
	-webkit-transform-origin: center bottom;
	        transform-origin: center bottom;
}

.contents_introduction_02.is-inview .contents_introduction_02_girl {
	opacity: 1;
	-webkit-transform: rotate(0);
	        transform: rotate(0);
}
@media screen and (min-width: 768px) {
	.contents_introduction_02.is-inview .contents_introduction_02_girl {
		-webkit-transform: rotate(-19deg);
		        transform: rotate(-19deg);
		-webkit-transform-origin: center;
		        transform-origin: center;
	}
}
.contents_introduction_02.is-inview .contents_introduction_02_girl .contents_introduction_02_girl_word {
	opacity: 1;
	-webkit-transform: scale(1);
	        transform: scale(1);
}

.contents_introduction_03_girl {
	opacity: 0;
	transition: opacity 0.4s, -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform-origin 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), transform-origin 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), transform-origin 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform-origin 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	-webkit-transform: rotate(40deg);
	        transform: rotate(40deg);
	-webkit-transform-origin: -80% 220%;
	        transform-origin: -80% 220%;
}
.contents_introduction_03_girl .contents_introduction_03_girl_word {
	opacity: 0;
	transition: opacity 0.4s, -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: opacity 0.4s, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition-delay: 0.5s;
	-webkit-transform: scale(0);
	        transform: scale(0);
	-webkit-transform-origin: center bottom;
	        transform-origin: center bottom;
}

.contents_introduction_03.is-inview .contents_introduction_03_girl {
	opacity: 1;
}
@media screen and (max-width: 767px) {
	.contents_introduction_03.is-inview .contents_introduction_03_girl {
		-webkit-transform: rotate(0);
		        transform: rotate(0);
	}
}
@media screen and (min-width: 768px) {
	.contents_introduction_03.is-inview .contents_introduction_03_girl {
		-webkit-transform: rotate(19deg);
		        transform: rotate(19deg);
		-webkit-transform-origin: center;
		        transform-origin: center;
	}
}
.contents_introduction_03.is-inview .contents_introduction_03_girl .contents_introduction_03_girl_word {
	opacity: 1;
	-webkit-transform: scale(1);
	        transform: scale(1);
}