@charset “UTF-8”;

/* ----------------------
global
 ---------------------- */
.cnt {
	text-align: center;
}

.img_bck,
.full_load {
	display: block;
}

.wp_img_size img {
	height: 53px !important;
}

/* ----------------------
 zoom effect
 ---------------------- */
@-webkit-keyframes ts_zoom {
	0% {
		opacity: 0;
		-webkit-transform: scale(0);
		transform: scale(0);
	}

	100% {
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}

@keyframes ts_zoom {
	0% {
		opacity: 0;
		-webkit-transform: scale(0);
		transform: scale(0);
	}

	100% {
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}

.ts_zoom {
	-webkit-animation: ts_zoom 0.6s ease;
	animation: ts_zoom 0.6s ease;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-transition: all 0.6s;
	-o-transition: all 0.6s;
	transition: all 0.6s;
}

.ts_zoom-effect {
	opacity: 0;
	-webkit-transition: all 0.6s;
	-o-transition: all 0.6s;
	transition: all 0.6s;
}

/*  ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
animation
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
.box {
	width: 100%;
	overflow: hidden;
	text-align: center;
}

.box_wrapper {
	overflow: hidden;
}

.box .boxInner {
	width: inherit;
	height: inherit;
	background-color: none;
	opacity: 0;
}

.isPlay {
	-webkit-animation-name: play;
	animation-name: play;
	-webkit-animation-duration: .5s;
	animation-duration: .5s;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	-webkit-animation-timing-function: cubic-bezier(.8, 0, .5, 1);
	animation-timing-function: cubic-bezier(.8, 0, .5, 1);
	position: relative;
	opacity: 1 !important;
}

.isPlay:before {
	-webkit-animation-name: maskOut;
	animation-name: maskOut;
	-webkit-animation-duration: .5s;
	animation-duration: .5s;
	-webkit-animation-delay: .5s;
	animation-delay: .5s;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	-webkit-animation-timing-function: cubic-bezier(.8, 0, .5, 1);
	animation-timing-function: cubic-bezier(.8, 0, .5, 1);
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	background-image: -o-linear-gradient(340.4deg, rgba(255, 255, 255, 1) 11.2%, rgba(255, 255, 255, 1) 91.1%);
	background-image: linear-gradient(109.6deg, rgba(255, 255, 255, 1) 11.2%, rgba(255, 255, 255, 1) 91.1%);
}

@-webkit-keyframes play {
	from {
		-webkit-transform: translateX(-100%);
		transform: translateX(-100%);
	}

	to {
		-webkit-transform: translateX(0);
		transform: translateX(0);
	}
}

@keyframes play {
	from {
		-webkit-transform: translateX(-100%);
		transform: translateX(-100%);
	}

	to {
		-webkit-transform: translateX(0);
		transform: translateX(0);
	}
}

@-webkit-keyframes maskOut {
	from {
		-webkit-transform: translateX(0);
		transform: translateX(0);
	}

	to {
		-webkit-transform: translateX(100%);
		transform: translateX(100%);
	}
}

@keyframes maskOut {
	from {
		-webkit-transform: translateX(0);
		transform: translateX(0);
	}

	to {
		-webkit-transform: translateX(100%);
		transform: translateX(100%);
	}
}

/*  ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
fadeInUp
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
@-webkit-keyframes fadeInUp {
	0% {
		opacity: 0;
		-webkit-transform: translateY(30px);
		transform: translateY(30px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

@keyframes fadeInUp {
	0% {
		opacity: 0;
		-webkit-transform: translateY(20px);
		transform: translateY(20px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

.fadeInUp {
	-webkit-animation: fadeInUp 0.6s ease;
	animation: fadeInUp 0.6s ease;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both
}

/*  ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
fadeInRight
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
@-webkit-keyframes fadeInRight {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-30px);
		transform: translateX(-30px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
		transform: translateX(0);
	}
}

@keyframes fadeInRight {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-30px);
		transform: translateX(-30px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
		transform: translateX(0);
	}
}

.fadeInRight {
	-webkit-animation: fadeInRight 0.6s ease;
	animation: fadeInRight 0.6s ease;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-transition: all 0.6s;
	-o-transition: all 0.6s;
	transition: all 0.6s;
}

/*  ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
fadeInLeft
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
@-webkit-keyframes fadeInLeft {
	0% {
		opacity: 0;
		-webkit-transform: translateX(30px);
		transform: translateX(30px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
		transform: translateX(0);
	}
}

@keyframes fadeInLeft {
	0% {
		opacity: 0;
		-webkit-transform: translateX(30px);
		transform: translateX(30px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
		transform: translateX(0);
	}
}

.fadeInLeft {
	-webkit-animation: fadeInLeft 0.6s ease;
	animation: fadeInLeft 0.6s ease;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-transition: all 0.6s;
	-o-transition: all 0.6s;
	transition: all 0.6s;
}

.fade,
.fade_right,
.fade_left {
	opacity: 0;
	-webkit-transition: all 0.6s;
	-o-transition: all 0.6s;
	transition: all 0.6s;
}

.delay1 {
	animation-delay: 0.2s;
	-moz-animation-delay: 0.2s;
	-webkit-animation-delay: 0.2s;
	-o-animation-delay: 0.2s;
}

.delay2 {
	animation-delay: 0.35s;
	-moz-animation-delay: 0.35s;
	-webkit-animation-delay: 0.35s;
	-o-animation-delay: 0.35s;
}

.delay3 {
	animation-delay: 0.5s;
	-moz-animation-delay: 0.5s;
	-webkit-animation-delay: 0.5s;
	-o-animation-delay: 0.5s;
}

.delay4 {
	animation-delay: 0.65s;
	-moz-animation-delay: 0.65s;
	-webkit-animation-delay: 0.65s;
	-o-animation-delay: 0.65s;
}

.delay5 {
	animation-delay: 0.8s;
	-moz-animation-delay: 0.8s;
	-webkit-animation-delay: 0.8s;
	-o-animation-delay: 0.8s;
}

.delay_duration1 {
	-webkit-animation-duration: 1.2s;
	animation-duration: 1.2s;
}

.delay_duration2 {
	-webkit-animation-duration: 4.2s;
	animation-duration: 4.2s;
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
swing
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ */
@-webkit-keyframes swinging {
	0% {
		-webkit-transform: rotate(10deg);
	}

	50% {
		-webkit-transform: rotate(-5deg)
	}

	100% {
		-webkit-transform: rotate(10deg);
	}
}

@keyframes swinging {
	0% {
		transform: rotate(10deg);
	}

	50% {
		transform: rotate(-5deg)
	}

	100% {
		transform: rotate(10deg);
	}
}

.swingimage {
	-webkit-transform-origin: 50% 0;
	transform-origin: 50% 0;
	-webkit-animation: swinging 3.5s ease-in-out forwards infinite;
	animation: swinging 3.5s ease-in-out forwards infinite;
}

/*  ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
scene
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
.slide-1 {
	background-image: url(../images/slide-1.jpg);
	position: relative;
}

.slide-2 {
	background-image: url(../images/slide-2.jpg);
	position: relative;
}

.slide-3 {
	background-image: url(../images/slide-3.jpg);
	position: relative;
}

.slide-4 {
	background-image: url(../images/slide-4.jpg);
	position: relative;
}

.bx-pager img,
.bx-pager2 img,
.bx-pager3 img {
	width: 80px;
	height: auto;
}

.bx-pager a img,
.bx-pager2 a img,
.bx-pager3 a img {
	opacity: 0.5;
	filter: alpha(opacity=50);
}

.bx-pager a.active img,
.bx-pager2 a.active img,
.bx-pager3 a.active img {
	opacity: 1;
	filter: alpha(opacity=100);
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
Grow Rotate
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.hvr-grow-rotate {
	display: inline-block;
	vertical-align: middle;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-property: transform;
	transition-property: transform;
}

.hvr-grow-rotate:hover,
.hvr-grow-rotate:focus,
.hvr-grow-rotate:active {
	-webkit-transform: scale(1.1) rotate(4deg);
	transform: scale(1.1) rotate(4deg);
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
Grow
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.hvr-grow {
	display: block;
	vertical-align: middle;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-property: transform;
	transition-property: transform;
}

.hvr-grow:hover,
.hvr-grow:focus,
.hvr-grow:active {
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
smoke
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

.move {
	position: absolute;
	top: 50px;
	left: 20px;
	-webkit-animation: steam_Move 18s infinite linear;
	animation: steam_Move 18s infinite linear;
	transition: all 1s;

}

.wp_smoke {
	position: relative;
}

.steam {
	position: absolute;
	top: 50px;
	left: 100px;
	-webkit-animation: steam_Move 18s infinite linear;
	animation: steam_Move 18s infinite linear;
	transition: all 1s;

}

#photo {
	z-index: 100;
	position: absolute;
	left: 0;
}

@keyframes steam_Move {
	0% {
		filter: blur(10px);
		transform: rotateY(0deg);
		transform: scale(1, 1);
		opacity: 0.75;
		top: 340px;
	}

	33% {
		transform: rotateY(40deg);
		transform: scale(0.6, 1.2);
	}

	66% {
		transform: rotateY(2deg);
		transform: scaleY(1.2, 0.4);
	}

	100% {
		filter: blur(16px);
		transform: rotateY(50deg);
		transform: scaleY(1.4, 1.2);
		opacity: 0;
		top: -600px;
	}
}

@-webkit-keyframes steam_Move {
	0% {
		-webkit-filter: blur(10px);
		-webkit-transform: rotateY(0deg);
		-webkit-transform: scale(1, 1);
		opacity: 0.75;
		top: 340px;
	}

	33% {
		-webkit-transform: rotateY(40deg);
		-webkit-transform: scale(0.8, 1.2);
	}

	66% {
		-webkit-transform: rotateY(2deg);
		-webkit-transform: scaleY(1.2, 0.6);
	}

	100% {
		-webkit-filter: blur(16px);
		-webkit-transform: rotateY(50deg);
		-webkit-transform: scaleY(1.4, 1.2);
		top: -600px;
		opacity: 0;
	}
}
