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

/****************************************************
*  project: scaffolding template for filmora        *
*  description: breakpoint/container 1016px/1000px  *
*  author: mazq@wondershare.cn                      *
*  update: 170504                                   *
****************************************************/

/********** color scheme **********
primary     #3f4e59   steel
success               steel
info        #6ce2d9   teal
warning     #ff6d5c   red
danger                red
altnative   #f3f3f3   smoke
background  #fff      white
text                  steel
link                  steel
parent      #353132   dark
disabled    #9b9b9b   gray        */

/********** font **********/
/** markpro regular **/
@font-face {
	font-family: 'markpro';
	font-style: normal;
	font-weight: normal;
	src: url('fonts/markpro.eot?#iefix');
	src: url('fonts/markpro.eot?#iefix') format('eot'), url('fonts/markpro.woff2') format('woff2'), url('fonts/markpro.woff') format('woff'), url('fonts/markpro.ttf') format('truetype');
}

/** markpro bold **/
@font-face {
	font-family: 'markpro';
	font-style: normal;
	font-weight: bold;
	src: url('fonts/markproheavy.eot?#iefix');
	src: url('fonts/markproheavy.eot?#iefix') format('eot'), url('fonts/markproheavy.woff2') format('woff2'), url('fonts/markproheavy.woff') format('woff'), url('fonts/markproheavy.ttf') format('truetype');
}


/********** animation **********/
/** icon spin **/
@-webkit-keyframes icon-spin {
	0% {
		-webkit-transform: rotate(0deg);
	}

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

@-moz-keyframes icon-spin {
	0% {
		-moz-transform: rotate(0deg);
	}

	100% {
		-moz-transform: rotate(359deg);
	}
}

@-o-keyframes icon-spin {
	0% {
		-o-transform: rotate(0deg);
	}

	100% {
		-o-transform: rotate(359deg);
	}
}

@keyframes icon-spin {
	0% {
		transform: rotate(0deg);
	}

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

/** reappear **/
.anime-reappear {
	-webkit-animation: 1s linear 1 reappear;
	-moz-animation: 1s linear 1 reappear;
	-o-animation: 1s linear 1 reappear;
	animation: 1s linear 1 reappear;
}

@-webkit-keyframes reappear {
	0% {
		opacity: 1;
	}

	30% {
		opacity: 0;
	}

	70% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@-moz-keyframes reappear {
	0% {
		opacity: 1;
	}

	30% {
		opacity: 0;
	}

	70% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@-o-keyframes reappear {
	0% {
		opacity: 1;
	}

	30% {
		opacity: 0;
	}

	70% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes reappear {
	0% {
		opacity: 1;
	}

	30% {
		opacity: 0;
	}

	70% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

/** unfold **/
@-webkit-keyframes unfold {
	0% {
		-webkit-transform: translate(0, -100%);
	}

	80% {
		-webkit-transform: translate(0, 0);
	}

	90% {
		-webkit-transform: translate(0, -15%);
	}

	100% {
		-webkit-transform: translate(0, 0);
	}
}

@-moz-keyframes unfold {
	0% {
		-moz-transform: translate(0, -100%);
	}

	80% {
		-moz-transform: translate(0, 0);
	}

	90% {
		-moz-transform: translate(0, -15%);
	}

	100% {
		-moz-transform: translate(0, 0);
	}
}

@-o-keyframes unfold {
	0% {
		-o-transform: translate(0, -100%);
	}

	80% {
		-o-transform: translate(0, 0);
	}

	90% {
		-o-transform: translate(0, -15%);
	}

	100% {
		-o-transform: translate(0, 0);
	}
}

@keyframes unfold {
	0% {
		transform: translate(0, -100%);
	}

	80% {
		transform: translate(0, 0);
	}

	90% {
		transform: translate(0, -15%);
	}

	100% {
		transform: translate(0, 0);
	}
}


/********** component **********/
/** pace **/
.pace .pace-progress {
	background: #6ce2d9;
	opacity: .7;
	position: fixed;
	z-index: 2000;
	top: 0;
	left: 0;
	height: 5px;
	-webkit-transition: width 1s;
	-moz-transition: width 1s;
	-o-transition: width 1s;
	transition: width 1s;
}

.pace-inactive {
	display: none;
}

/** bootstrap **/
.badge,
.label {
	font-weight: normal;
}

hr {
	border-color: rgba(155, 155, 155, .3);
}

/** container **/
@media (min-width: 1230px) {
	.container-lg {
		width: 1230px;
		max-width: 1230px;
	}

	.container-sm {
		width: 816px;
		max-width: 816px;
	}
}

/** hide **/
.hide-mobile,
.hide-tablet,
.hide-desktop {
	display: inline-block !important;
}

@media (max-width:767px) {
	.hide-mobile {
		display: none !important;
		margin: 0 !important;
	}
}

@media (min-width:768px) and (max-width:1015px) {
	.hide-tablet {
		display: none !important;
		margin: 0 !important;
	}
}

@media (min-width:1016px) {
	.hide-desktop {
		display: none !important;
		margin: 0 !important;
	}
}

/** text and background **/
a,
a:before,
a:after {
	-webkit-transition-duration: .2s;
	-moz-transition-duration: .2s;
	-o-transition-duration: .2s;
	transition-duration: .2s;
}

body {
	line-height: 2;
	font-family: "PingFang SC", -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
}

body.pack {
	/* overflow-y: scroll */
}

main {
	/*overflow-x: hidden; -ms-overflow-x: hidden;*/
	padding-top: 80px;
}

p {
	margin: 0 0 10px;
}

.text-large {
	font-size: 18px;
	line-height: 25px;
}

.text-small {
	font-size: 14px;
	line-height: 20px;
}

.text-smoke {
	color: #f7f7f7;
}

.text-steel {
	color: #313c48;
}

.text-teal {
	color: #61ded0;
	font-size: 18px;
}

.text-red {
	color: #ff5349;
}

.text-rose {
	color: #ef3062;
}

.text-gray {
	color: #9b9b9b;
}

.bg-smoke {
	background-color: #f7f7f7;
}

.bg-steel {
	background-color: #313c48;
}

.bg-teal {
	background-color: #61ded0;
}

.bg-red {
	background-color: #ff544a;
}

.bg-rose {
	background-color: #ef3062;
}

.bg-pattern {
	background-position: left top;
	background-repeat: repeat;
}

.bg-pattern-flip {
	position: relative;
}

.bg-pattern-flip:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: inherit;
	top: 0;
	left: 0;
	background-position: left top;
	-webkit-transform: scaleY(-1);
	-moz-transform: scaleY(-1);
	-ms-transform: scaleY(-1);
	-o-transform: scaleY(-1);
	transform: scaleY(-1);
}

.bg-pattern-flip>* {
	position: relative;
}

.bg-pattern-smoke {
	background-image: url("../images/pattern-smoke.png");
}

.bg-pattern-steel {
	background-image: url("../images/pattern-steel.png");
}

.bg-pattern-teal {
	background-image: url("../images/pattern-teal.png");
}

@media (min-width:1016px) {
	.bg-half {
		position: relative;
		width: 100%;
		height: 100%;
	}

	.bg-half-before:before,
	.bg-half-after:after {
		content: "";
		position: absolute;
		width: 50%;
		height: 100%;
		top: 0;
		z-index: -1;
		z-index: 0\0;
	}

	.bg-half-before:before {
		left: 0;
	}

	.bg-half-after:after {
		right: 0;
	}

	.bg-half-before-smoke:before,
	.bg-half-after-smoke:after {
		background-color: #f7f7f7;
	}

	.bg-half-before-steel:before,
	.bg-half-after-steel:after {
		background-color: #313c48;
	}

	.bg-half-before-teal:before,
	.bg-half-after-teal:after {
		background-color: #61ded0;
	}

	.bg-half-before-red:before,
	.bg-half-after-red:after {
		background-color: #ff5349;
	}

	.bg-half-before-rose:before,
	.bg-half-after-rose:after {
		background-color: #ef3062;
	}
}

/** icon **/
.fm {
	display: inline-block;
	vertical-align: top;
	line-height: inherit;
}

.fm.fm-spin {
	-webkit-animation: icon-spin 1.8s linear infinite;
	-moz-animation: icon-spin 1.8s linear infinite;
	-o-animation: icon-spin 1.8s linear infinite;
	animation: icon-spin 1.8s linear infinite;
}

.fm.fm-with-dot {
	position: relative;
}

.fm.fm-with-dot:after {
	content: "";
	position: absolute;
	right: -3px;
	top: 20%;
	top: calc(30% - 3px);
	width: 7px;
	height: 7px;
	border-radius: 7px;
	background-color: #ff6d5c;
	box-shadow: 0 0 0 1px #fff;
}

a>.fm-link,
a>.fm-more {
	vertical-align: top;
}

a:hover>.fm-more {
	-webkit-transform: translate(5px, 2px);
	-moz-transform: translate(5px, 2px);
	-o-transform: translate(5px, 2px);
	transform: translate(5px, 2px);
	-webkit-transition: transform .2s ease;
	-moz-transition: transform .2s ease;
	-o-transition: transform .2s ease;
	transition: transform .2s ease;
}

a:not(.button):hover>.fm-more {
	-webkit-transform: translate(5px, 0);
	-moz-transform: translate(5px, 0);
	-ms-transform: translate(5px, 0);
	-o-transform: translate(5px, 0);
	transform: translate(5px, 0);
}

.button .fm {
	-webkit-transform: translate(0, 2px);
	-moz-transform: translate(0, 2px);
	-ms-transform: translate(0, 2px);
	-o-transform: translate(0, 2px);
	transform: translate(0, 2px);
}


/** button **/
.button,
a.button {
	display: inline-block;
	vertical-align: top;
}

.button {
	position: relative;
	height: 50px;
	padding: 0 10px;
	width: 225px;
	font-size: 18px;
	line-height: 50px;
	color: #fff;
	margin: 12.5px 10px;
	text-align: center;
	font-weight: bold;
	cursor: pointer;
	overflow: hidden;
	white-space: nowrap;
	border: none;
	outline: none;
	-webkit-appearance: none;
	appearance: none;
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
}

.button:before,
.button:after {
	content: "";
	position: absolute;
	top: 0;
	z-index: 1;
	opacity: .08;
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-ms-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
}

.button:before {
	left: calc(50% - 25px);
	border-left: solid 50px transparent;
	border-bottom: solid 50px #000;
}

.button:after {
	left: calc(50% + 25px);
	height: 100%;
	width: calc(50% - 25px);
	background-color: #000;
}

.button:hover,
.button:focus {
	color: #fff;
}

.button:hover:after {
	left: calc(100% + 50px);
}

.button:hover:before {
	left: 100%;
}

.button-steel {
	background-color: #3f4e59;
	border-color: #3f4e59;
}

/* .button-teal { background-color: #6ce2d9; border-color: #6ce2d9; color: #3f4e59; } */
.button-teal {
	background: #50E3C2;
	border-color: #50E3C2;
	color: #3f4e59;
}

.button-teal:hover,
.button-teal:focus {
	color: #3f4e59;
}

.button-red {
	background-color: #ff6d5c;
	border-color: #ff6d5c;
}

.button-smoke {
	background-color: #f3f3f3;
	border-color: #f3f3f3;
	color: #ff6d5c;
}

.button-smoke:hover,
.button-smoke:focus {
	color: #ff6d5c;
}

.button-white {
	background-color: #fff;
	border-color: #fff;
	color: #3f4e59;
}

.button-white:hover,
.button-white:focus {
	color: #3f4e59;
}

.button-ghost {
	line-height: 46px;
	border: solid 2px;
	background-color: transparent;
}

.button-ghost:hover,
.button-ghost:focus {
	color: #fff;
}

.button-ghost:before,
.button-ghost:after {
	display: none;
}

.button-ghost.button-steel {
	color: #3f4e59;
	border-color: #3f4e59;
}

.button-ghost.button-steel:hover,
.button-ghost.button-steel:focus {
	background-color: #3f4e59;
	color: #fff;
}

/* .button-ghost.button-teal { color: #6ce2d9; border-color: #6ce2d9; } */
.button-ghost.button-teal {
	color: #50E3C2;
	border-color: #50E3C2;
}

/* .button-ghost.button-teal:hover, .button-ghost.button-teal:focus { background-color: #6ce2d9; color: #3f4e59; } */
.button-ghost.button-teal:hover,
.button-ghost.button-teal:focus {
	background-color: #50E3C2;
	color: #3f4e59;
}

.button-ghost.button-red {
	color: #ff6d5c;
	border-color: #ff6d5c;
}

.button-ghost.button-red:hover,
.button-ghost.button-red:focus {
	background-color: #ff6d5c;
	color: #fff;
}

.button-ghost.button-smoke {
	color: #f3f3f3;
	border-color: #f3f3f3;
}

.button-ghost.button-smoke:hover {
	background-color: #f3f3f3;
	color: #ff6d5c;
}

.button-ghost.button-white {
	color: #fff;
	border-color: #fff;
}

.button-ghost.button-white:hover,
.button-ghost.button-white:focus {
	background-color: #fff;
	color: #3f4e59;
}

.button-compact {
	width: auto;
	padding: 0 30px;
}

.button-justify {
	width: 100%;
	margin: 12.5px 0;
}

.button-disabled {
	cursor: not-allowed;
	background-color: #e6e6e6 !important;
	color: #aaa !important;
	border-color: #e6e6e6 !important;
	pointer-events: none;
}

.button-disabled:before,
.button-disabled:after {
	display: none;
}

.button-small {
	width: 110px;
	height: 40px;
	line-height: 40px;
	font-size: 16px;
	padding: 0 5px;
	overflow: hidden;
}

.button-small.button-ghost {
	line-height: 36px;
}

.button-small.button-compact {
	width: auto;
	padding: 0 15px;
}

.link-white .button-teal,
.link-white .button-teal:hover,
.link-white .button-teal:focus {
	color: #3f4e59;
}


.button.complex {
	padding: 7px 0;
	height: 60px;
	line-height: 1
}

.button.complex:before,
.button.accordant:before {
	border-bottom-width: 68px;
}

.button.complex .l {
	display: inline-block;
	text-align: left;
	vertical-align: middle;
}

.button.complex b {
	display: block;
	line-height: 1.5em;
}

.button.complex .ver {
	font-size: 12px;
	transform: scale(0.82);
	transform-origin: left center;
	display: inline-block;
	font-weight: normal;
	/*color: #2b3640*/
}

.button.complex i.fm {
	font-size: 24px;
	vertical-align: middle;
	margin-left: -8px;
}

.button.accordant {
	height: 60px;
	line-height: 60px
}

/** progress **/
.progress {
	height: 18px;
	border-radius: 0;
	background-color: transparent;
	border: solid 1px;
	box-shadow: none;
	margin: 11px 0;
}

.progress-bar {
	box-shadow: none;
	line-height: 18px;
}

.progress-bar.bg-pattern {
	background-size: cover;
}

/** form **/
button,
input,
select,
textarea {
	border: none;
	background-color: transparent;
	padding: 0;
}

input:focus:invalid,
textarea:focus:invalid,
.input-group>.input-file:focus:invalid~.input-text {
	box-shadow: 0 0 1px 1px #ff6d5c;
	border-color: transparent;
	outline: none;
}

input:invalid,
select:invalid,
textarea:invalid {
	outline: none
}

@media screen and (-webkit-min-device-pixel-ratio:0) {

	select,
	textarea,
	input {
		font-size: 16px !important;
	}
}

.input-button {
	margin: 0;
}

.input-item {
	margin-bottom: 10px;
}

.input-title {
	font-size: 18px;
	line-height: 40px;
	margin: 10px 0;
}

.input-title .fm {
	width: 25px;
	text-align: center;
}

.input-title-required:after {
	content: "\002A";
	line-height: 1.5;
	vertical-align: top;
	margin-left: 5px;
	color: #ff6d5c;
}

.input-text,
.input-select {
	display: inline-block;
	vertical-align: top;
	height: 40px;
	line-height: 39px;
	border-bottom: solid 1px;
	padding: 0 8px;
	font-size: 16px;
	width: 100%;
}

.input-group {
	position: relative;
}

.input-group>.input-file {
	position: absolute;
	z-index: 2;
	opacity: 0;
	left: 0;
	top: 0;
	height: 40px;
	line-height: 40px;
	cursor: pointer;
	width: 100%;
}

.input-group>.input-text {
	position: relative;
	width: calc(100% - 120px);
}

.input-group>.input-button {
	position: relative;
}

.input-group>.input-file:hover~.input-button::before {
	left: 100%;
}

.input-group>.input-file:hover~.input-button::after {
	left: calc(100% + 50px);
}

.input-group>.input-label {
	display: inline-block;
	margin-right: 10px;
}

.input-toggle {
	position: absolute;
	top: 0;
	right: 5px;
	line-height: 40px;
	width: 15px;
	height: 40px;
	background: #fff\0;
	top: -1px\0;
	right: 8px\0;
	width: 19px\0
}

.input-select option:checked {
	display: none;
}

.input-span {
	display: inline-block;
	vertical-align: top;
	position: relative;
}

.input-label {
	position: relative;
	line-height: 40px;
	display: block;
	text-align: left;
}

.input-label>.input-check+.input-span {
	cursor: pointer;
}

.input-label>.input-check+.input-span:before {
	content: "";
	display: inline-block;
	vertical-align: top;
	width: 16px;
	height: 16px;
	border: solid 1px;
	margin: 12px;
}

.input-label>.input-check+.input-span:after {
	content: "";
	background-color: currentColor;
	height: 10px;
	width: 10px;
	text-align: center;
	position: absolute;
	left: 15px;
	top: 15px;
	opacity: 0;
	-webkit-transition: opacity .5s ease;
	-moz-transition: opacity .5s ease;
	-o-transition: opacity .5s ease;
	transition: opacity .5s ease;
}

.input-label>.input-check:checked+.input-span:after {
	opacity: 1;
}

.input-label>.input-check:disabled+.input-span {
	cursor: not-allowed;
}

.input-label>.input-check:disabled+.input-span:before {
	opacity: .3;
}

.input-label>.input-check:disabled+.input-span:after {
	opacity: .3;
}

.input-check {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	display: none;
}

.input-area {
	width: 100%;
	border: solid 1px;
	padding: 0 8px;
	line-height: 40px;
}

.bg-steel .input-select option {
	background-color: #3f4e59;
}

.bg-teal .input-select option {
	background-color: #6ce2d9;
}

.bg-red .input-select option {
	background-color: #ff6d5c;
}

.bg-smoke .input-select option {
	background-color: #f3f3f3;
}

.input-text[disabled],
.input-text[readonly],
.input-select[disabled],
.input-select[readonly],
.input-area[disabled],
.input-area[readonly] {
	opacity: .5;
}

.input-text[disabled],
.input-select[disabled],
.input-area[disabled] {
	cursor: not-allowed;
}

/** system **/
*[data-sys="win"] .sys-mac,
*[data-sys="auto"] .sys-mac {
	display: none !important;
	margin: 0 !important;
}

*[data-sys="mac"] .sys-win {
	display: none !important;
	margin: 0 !important;
}

/** modal/popup **/
.modal-content {
	padding: 50px 40px;
	background-color: #3f4e59;
	box-shadow: none;
	border-radius: 0;
	color: #fff;
	border: none;
}

.modal-white {
	background-color: #fff;
	color: #3f4e59;
}

.modal-header {
	border-bottom: none;
	padding: 0;
	position: relative;
}

.modal-header .close {
	font-size: 30px;
	color: #fff;
	line-height: 30px;
	width: 30px;
	height: 30px;
	display: block;
	opacity: 1;
	text-shadow: none;
	position: absolute;
	right: -25px;
	top: -35px;
}

.modal-white .close {
	color: #3f4e59;
}

.modal-header .close:hover {
	color: #ff6d5c;
}

.modal-title {
	font-size: 24px;
	font-weight: normal;
	line-height: 30px;
	letter-spacing: 0.9px;
	padding: 10px 0;
}

.modal-body {
	padding: 20px 0;
	font-size: 18px;
}

.modal-footer {
	padding: 0;
	border-top: none;
	background-color: transparent;
	text-align: center;
}

.modal-sm .modal-content {
	padding: 20px;
}

.modal-sm .modal-header .close {
	position: absolute;
	margin-top: -10px;
	right: 10px;
}

/** notice **/
#shoulder::before {
	content: "";
	position: fixed;
	width: 100%;
	height: 0%;
	left: 0;
	pointer-events: none;
	top: 0;
	background: -webkit-linear-gradient(0deg, rgba(0, 0, 0, 0)0%, rgba(0, 0, 0, 0.15)100%);
	background: -moz-linear-gradient(0deg, rgba(0, 0, 0, 0)0%, rgba(0, 0, 0, 0.15)100%);
	background: -o-linear-gradient(0deg, rgba(0, 0, 0, 0)0%, rgba(0, 0, 0, 0.15)100%);
	background: linear-gradient(0deg, rgba(0, 0, 0, 0)0%, rgba(0, 0, 0, 0.15)100%);
}

#shoulder.has-notice::before {
	height: 40%;
}

.notice {
	line-height: 30px;
}

.notice.active {
	padding: 0 0 10px;
	max-height: 120px;
}

.notice-box {
	position: relative;
	cursor: pointer;
	padding: 10px 50px 10px 15px;
	background-color: #f3f3f3;
	box-shadow: 0 0 8px #999;
}

.notice-close {
	position: absolute;
	right: 0;
	top: 0;
	line-height: 50px;
	width: 50px;
	text-align: center;
}

.notice .button-notice {
	display: inline-block;
	width: 100px;
	height: 30px;
	margin: 0 0 0 10px;
	padding: 0;
	line-height: 30px;
	font-size: 14px;
	vertical-align: middle;
}

/** logo **/
.logo {
	color: transparent;
	user-select: none;
	background-position: center;
	background-repeat: no-repeat;
}

.logo-wondershare-square {
	background: url("logo/logo-wondershare-square.png") center no-repeat;
	background-image: url("logo/logo-wondershare-square.svg"), none;
}

.logo-wondershare {
	background: url("logo/logo-wondershare.png") center no-repeat;
	background-image: url("logo/logo-wondershare.svg"), none;
}

.logo-filmora {
	background: url("logo/logo-filmora-cn-en.png") center no-repeat;
	background-image: url("logo/logo-filmora-cn-en.svg"), none;
}

.logo-filmora-go {
	background: url("logo/logo-filmora-cn.png") center no-repeat;
	background-image: url("logo/logo-filmora-cn.svg"), none;
}

.logo-filmora-go-white {
	background: url("logo/logo-filmora-cn-white.png") center no-repeat;
	background-image: url("logo/logo-filmora-cn-white.svg"), none;
}

.logo-filmora-pro {
	background: url("logo/logo-filmora-pro.png") center no-repeat;
	background-image: url("logo/logo-filmora-pro.svg"), none;
}

.logo-filmora-io {
	background: url("logo/logo-filmora-io.png") center no-repeat;
	background-image: url("logo/logo-filmora-io.svg"), none;
}

.logo-filmora-io-white {
	background: url("logo/logo-filmora-io.png") center no-repeat;
	background-image: url("logo/logo-filmora-io-white.svg"), none;
}

.logo-filmora-white {
	background: url("logo/logo-filmora-cn-en-white.png") center no-repeat;
	background-image: url("logo/logo-filmora-cn-en-white.svg"), none;
	background-size: auto 60px !important;
}

.logo-filmora-square {
	background: url("logo/logo-filmora-square.png") center no-repeat;
	background-image: url("logo/logo-filmora-square.svg"), none;
}

.logo.logo-store {
	width: 200px;
	height: 60px;
	border-radius: 6px;
	border: solid 1px #a9aaa9;
	display: inline-block;
	background-color: #000;
	background-position: 50% 80%;
	background-repeat: no-repeat;
	background-size: auto 50px;
	overflow: hidden;
	position: relative;
	margin: 10px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, .5);
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
}

.logo.logo-store:before,
.logo.logo-store:after {
	content: "";
	position: absolute;
	top: 0;
	z-index: 1;
	opacity: .12;
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-ms-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
}

.logo.logo-store:before {
	left: calc(50% - 35px);
	border-left: solid 70px transparent;
	border-bottom: solid 70px #fff;
}

.logo.logo-store:after {
	left: calc(50% + 35px);
	height: 100%;
	width: calc(50% - 35px);
	background-color: #fff;
}

.logo.logo-store:hover:after {
	left: calc(100% + 70px);
}

.logo.logo-store:hover:before {
	left: 100%;
}

.logo-app-store {
	background: url("logo/logo-app-store.png") center no-repeat;
	background-image: url("logo/logo-app-store.svg"), none;
}

.logo-google-play {
	background: url("logo/logo-google-play.png") center no-repeat;
	background-image: url("logo/logo-google-play.svg"), none;
}

.logos .logo-company {
	position: absolute;
	top: -5px;
	left: 8px;
	display: block;
	width: 67px;
	height: 70px;
	background-color: #353132;
	z-index: 2;
	background-size: auto 28px;
}

.logos .logo-product {
	margin-left: 90px;
	width: 200px;
	height: 100%;
	background-size: auto 28px;
	background-position: left center;
}

/** burger **/
.icon-burger {
	cursor: pointer;
	user-select: none;
	width: 30px;
	-webkit-transform: scale(.85) translateY(-2px);
	-moz-transform: scale(.85) translateY(-2px);
	-o-transform: scale(.85) translateY(-2px);
	transform: scale(.85) translateY(-2px);
}

.icon-burger .lines,
.icon-burger .lines:after,
.icon-burger .lines:before {
	display: inline-block;
	height: 2px;
	width: 2rem;
	background: #3f4e59;
}

.icon-burger .lines {
	-webkit-transition: background .3s .6s ease;
	-moz-transition: background .3s .6s ease;
	-o-transition: background .3s .6s ease;
	transition: background .3s .6s ease;
	position: relative;
	top: -.13em;
}

.icon-burger .lines:after,
.icon-burger .lines:before {
	position: absolute;
	left: 0;
	content: '';
	-webkit-transform-origin: .14286rem center;
	-moz-transform-origin: .14286rem center;
	-o-transform-origin: .14286rem center;
	transform-origin: .14286rem center;
	-webkit-transform-origin: 50% 50%;
	-moz-transform-origin: 50% 50%;
	-o-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
	-webkit-transition: top .3s .6s ease, transform .3s ease;
	-moz-transition: top .3s .6s ease, transform .3s ease;
	-o-transition: top .3s .6s ease, transform .3s ease;
	transition: top .3s .6s ease, transform .3s ease;
}

.icon-burger .lines:before {
	top: .5rem;
}

.icon-burger .lines:after {
	top: -.5rem;
}

.active .icon-burger .lines {
	-webkit-transition: background .3s 0s ease;
	-moz-transition: background .3s 0s ease;
	-o-transition: background .3s 0s ease;
	transition: background .3s 0s ease;
	background: 0 0;
}

.active .icon-burger .lines:after,
.active .icon-burger .lines:before {
	-webkit-transition: top .3s ease, transform .3s .5s ease;
	-moz-transition: top .3s ease, transform .3s .5s ease;
	-o-transition: top .3s ease, transform .3s .5s ease;
	transition: top .3s ease, transform .3s .5s ease;
	top: 0;
	width: 2rem;
}

.active .icon-burger .lines:before {
	-webkit-transform: rotate3d(0, 0, 1, 45deg);
	-moz-transform: rotate3d(0, 0, 1, 45deg);
	-o-transform: rotate3d(0, 0, 1, 45deg);
	transform: rotate3d(0, 0, 1, 45deg);
}

.active .icon-burger .lines:after {
	-webkit-transform: rotate3d(0, 0, 1, -45deg);
	-moz-transform: rotate3d(0, 0, 1, -45deg);
	-o-transform: rotate3d(0, 0, 1, -45deg);
	transform: rotate3d(0, 0, 1, -45deg);
}


/** header **/
#header {
	font-size: 16px;
	text-align: center;
	width: 100%;
	position: relative;
	z-index: 10;
}

#header .header-top {
	background: #fff;
	height: 32px;
}

#header .header-top a,
#header .header-top a:hover {
	color: #dcd5cf;
}

#header .header-top svg {
	fill: currentColor;
	width: 96px;
	height: 96px
}

#header .header-top .logo-company .svg-logo-wondershare {
	display: none;
}

#header .header-top .logo-company {
	width: 94px;
	position: absolute;
	height: 96px;
	background: #353031;
	z-index: 1;
}

#header .header-bottom {
	background: #303e47;
	height: 64px;
}

#header .header-bottom .header-dropdown {
	float: left;
	position: relative;
	text-align: right;
	position: relative;
	z-index: 11;
}

#header .header-bottom .logos {
	float: left;
	height: 64px;
	margin-left: 150px;
	position: relative;
	z-index: 11;
}

#header .header-bottom .logos .logo {
	margin-left: 0
}

#header .header-bottom a .icon-chevron-bottom {
	display: none;
}

#header .header-bottom .menu {
	height: 64px;
	line-height: 64px;
	display: inline-block;
	vertical-align: top;
}

#header .header-bottom .menu .menu-link {
	display: inline-block;
}

#header .header-bottom .menu .menu-link a {
	padding: 0 25px
}

#header .header-bottom .menu a {
	color: #fff
}

#header .header-bottom .menu a svg {
	width: 10px;
	height: 10px;
	transform: rotate(-90deg);
	display: inline-block;
	vertical-align: middle;
}

#header .header-bottom .menu a:hover {
	color: #61ded0
}

#header .header-extra {
	position: absolute;
	top: 32px;
	width: 100%
}

#header .header-extra .extra {
	float: right;
	height: 64px;
	line-height: 64px;
	text-align: center;
}

#header .header-extra .extra li {
	float: left;
}

#header .header-extra .extra a {
	color: #61ded0;
	display: inline-block;
	font-size: 14px;
	position: relative;
}

#header .header-extra .avatar img {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	vertical-align: middle;
	overflow: hidden;
}

#header .header-extra .extra li span {
	margin: 0 5px;
	color: #61ded0;
}

#header .header-extra .extra .action-txt {
	margin-left: 14px;
	font-size: 0
}

#header .header-extra .extra .action-txt a:first-child {
	margin-right: 10px;
	padding-right: 10px;
}

#header .header-extra .extra .action-txt a:first-child:after {
	position: absolute;
	content: '';
	background: #61ded0;
	width: 1px;
	height: 14px;
	right: 0;
	top: calc(50% - 7px);
}



#header .user-menu-box {
	position: absolute;
	z-index: 30;
	right: 0;
	top: 44px;
	padding: 6px;
	max-width: 200px;
	min-width: 172px;
}

#header .user-menu-box.active {
	max-height: 222px;
}

#header .user-menu {
	background-color: #fff;
	position: relative;
	box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.13);
	font-size: 14px;
	line-height: 40px;
}

#header .user-menu:before {
	content: "";
	display: none;
	position: absolute;
	top: -6px;
	right: 12px;
	border: solid 6px transparent;
	border-top: none;
	border-bottom: solid 6px #f3f3f3;
	z-index: 2;
}

#header .user-name {
	line-height: 20px;
	padding: 10px;
	margin: 0;
}

#header .user-action {
	text-align: right;
}

#header .user-action a {
	padding: 0 15px;
	text-align: center;
	cursor: pointer;
	border-bottom: solid 2px #d7d5d5;
}

#header .user-action a:hover {
	background-color: #6ce2d9;
	border-color: transparent;
	color: #3f4e59
}

#header .user-action a i {
	margin-right: 13px;
	font-size: 20px;
}

#header .icon-user i {
	width: 30px;
}

#header .user-action li:last-child a {
	border-color: transparent;
}


#header .menu-panel {
	position: fixed;
	top: 96px;
	left: 0;
	width: 100%;
	background-color: #f8f8f8;
	padding: 22px 0 19px;
	opacity: 0;
	max-height: 0;
	display: none;
}

#header .menu>li {
	display: inline-block;
	vertical-align: top
}

#header .menu-title a {
	padding: 0 25px
}

#header .menu-dropdown.active .menu-title a {
	color: #61ded0
}

#header .menu-dropdown.active .menu-title a svg {
	transform: rotate(0);
	transition: all 0.2s ease-in;
}

#header .menu-dropdown.active .menu-title:after {
	opacity: 0
}

#header .menu-dropdown.active .menu-panel {
	box-shadow: 0 1px 3px rgba(53, 49, 50, .5);
	opacity: 1;
	max-height: 600px;
	display: block;
}

#header .menu-panel .products .row>div {
	text-align: center;
	line-height: 1
}

#header .menu-panel .products .row>div:first-child {
	border-right: solid 1px #DADADA;
}

#header .menu-panel .product {
	display: inline-block;
	text-align: left;
	padding: 0;
}

#header .menu-panel .product .title {
	position: relative;
	font-size: 16px
}

#header .menu-panel .product .title i {
	width: 18px;
	height: 15px;
	border-radius: 1.2px;
	background-color: #ff0000;
	position: absolute;
	font-size: 12px;
	font-style: normal;
	color: #fff;
	text-align: center;
	line-height: 15px;
	top: -10px;
	left: 152px
}

#header .menu-panel .product .desc {
	text-align: left;
	overflow: hidden;
	color: #303e47;
	margin-top: 9px;
	font-size: 12px
}

#header .menu-panel .links .row {
	display: table;
	width: 100%
}

#header .menu-panel .links .row>div {
	display: table-cell;
	position: relative;
	float: none;
	vertical-align: top
}

#header .menu-panel .links .action {
	position: absolute;
	left: 8px;
	bottom: 0
}

#header .menu-panel .downloads .title {
	margin: 20px 0 0
}

#header .icon-burger {
	display: none
}

#header .menu>li:first-of-type.active .menu-panel {
	padding: 0
}




@media(max-width: 1215px) {
	#header .header-bottom .menu .menu-link a {
		padding: 0 10px
	}

}

@media(max-width: 1015px) {
	#header .container-lg {
		padding: 0
	}

	#header .header-top {
		height: 45px;
		line-height: 45px
	}

	#header .header-top a,
	#header .header-top a:hover {
		color: #353031;
	}

	#header .header-top .logo-company {
		height: 48px;
		background: transparent;
		width: 80px
	}

	#header .header-top svg {
		width: 60px;
		height: 48px
	}

	#header .header-top .logo-company .logo-wondershare-vertical {
		display: none;
	}

	#header .header-top .logo-company .svg-logo-wondershare {
		display: inline-block;
	}

	#header .header-bottom {
		height: 45px;
		line-height: 45px
	}

	#header .header-bottom .logos {
		float: none;
		margin: 0 auto;
		width: 109px;
		height: 45px;
	}

	#header .header-bottom .logos .logo {
		margin: 0 auto;
		background-size: auto 46px !important;
	}

	#header .header-bottom a {
		color: #fff
	}

	#header .header-bottom a .icon-chevron-bottom {
		float: right;
		width: 10px;
		margin-right: 75px;
		height: 45px;
		display: inline-block;
	}

	#header .header-bottom a .icon-chevron-bottom.active {
		transform: rotate(180deg);
		transition: all .2s ease-in-out
	}

	#header .header-bottom .header-dropdown {
		float: none;
		width: 100%;
		overflow: hidden;
		height: 0;
		position: relative;
	}

	#header .header-bottom .active {
		height: auto;
		transition: all .2s ease-in-out;
		z-index: 20;
	}

	#header .header-bottom .menu {
		width: 100%;
		background: #f9f9f9;
		height: auto;
		line-height: 1.5;
		position: relative;
		z-index: 3;
	}

	#header .header-bottom .menu .menu-link,
	#header .header-bottom .menu .menu-dropdown {
		border-top: solid 1px #dcd5cf;
		text-align: left;
		display: block;
		padding: 9px;
	}

	#header .header-bottom .menu .menu-link a,
	#header .header-bottom .menu .menu-dropdown a {
		color: #303e47;
		padding: 0
	}

	#header .header-extra {
		top: 0;
		right: 20px
	}

	#header .header-extra .extra {
		height: 45px;
		line-height: 45px;
	}

	#header .header-extra .extra a {
		color: #353031
	}

	#header .header-extra .extra .action-txt a:first-child:after {
		background: #353031
	}

	#header .header-bottom .menu .menu-dropdown a svg {
		margin: 7px 0 0
	}

	#header .menu-panel .product {
		text-align: left;
	}

	#header .header-bottom .menu-dropdown .menu-panel {
		position: initial;
		box-shadow: none;
		opacity: 1;
		height: auto;
		max-height: 600px;
		padding: 5px 0
	}

	#header .header-bottom .menu-dropdown .menu-panel a {
		display: block;
	}

	#header .header-bottom .menu-dropdown .menu-panel a div {
		color: #303e47 !important;
		text-align: left !important;
		line-height: 1.25;
		padding: 5px 0;
	}

	#header .menu-panel .products .row>div:first-child {
		border: none
	}

	#header .menu-panel .product .title i {
		top: -2px;
	}
}

@media(max-width: 767px) {}



/** shoulder **/
#shoulder {
	top: 10px;
}

/** footer **/
#footer {
	font-size: 12px;
	background-color: #353031
}

#footer .footer-top {
	height: 5px;
	background-color: #f37460;
	background-image: linear-gradient(to right, #29c2de 0, #0a94d6 25%, #cf63c7 75%, #e86987 100%);
}

#footer .footer-middle .left {
	float: left;
}

#footer .footer-middle .right {
	float: right;
}

#footer .footer-middle .logo-company {
	text-align: right;
	padding: 35px 30px 0 0
}

#footer .footer-middle .links {
	border-left: 1px solid #565150;
	width: 100%;
	padding: 35px 0 25px 40px;
	color: #dcd5cf
}

#footer .footer-middle .title {
	margin-bottom: 15px;
	font-size: 14px;
	font-weight: 500
}

#footer .footer-middle .title svg {
	width: 12px;
	float: right;
	height: 48px;
	line-height: 48px;
	display: none;
}

#footer .footer-middle .link a {
	display: inline-block;
	color: #dcd5cf
}

#footer .footer-middle .link a:hover {
	text-decoration: underline;
}

#footer .footer-middle .code-filmora {
	background: url(../images/code-filmora.png?v=20180918) no-repeat 0 0;
	background-size: 100%;
	width: 80px;
	height: 80px
}

#footer .footer-middle .subscribe {
	margin-top: 25px
}

#footer .footer-middle .subscribe form {
	margin-bottom: 0
}

#footer .footer-middle .mail input[type="email"],
#footer .mail input.input-text {
	width: 140px;
	width: calc(100% - 95px);
	box-shadow: none;
	border-color: inherit;
}

#footer .footer-middle .mail input:-webkit-autofill,
#footer .mail input:-webkit-autofill:focus {
	-webkit-box-shadow: 0 0 0px 1000px #3f4e59 inset;
	box-shadow: 0 0 0px 1000px #3f4e59 inset;
	-webkit-text-fill-color: #fff;
	border-color: #fff;
}

#footer .footer-middle .mail button {
	width: 90px;
}


#footer .footer-bottom {
	position: relative;
}

#footer .footer-bottom:after {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 1px;
	content: "";
	background-color: #dcd5cf;
	opacity: .2;
}

#footer .footer-bottom .footer-company {
	background-color: #353132;
	text-align: center;
	padding: 20px 0;
}

#footer .footer-bottom .logo-company {
	height: 20px;
	width: 140px;
	background-size: auto 20px;
	margin-right: 30px;
	margin: 0 auto
}

#footer .footer-bottom .footer-company li {
	display: inline-block;
	color: #dcd5cf;
}

#footer .footer-bottom .copyright,
#footer .footer-bottom .footer-company li a {
	color: #969494;
}

#footer .footer-bottom .copyright {
	margin-bottom: 0
}

#footer .goto-top {
	width: 40px;
	height: 40px;
	right: 40px;
	bottom: 40px;
	cursor: pointer;
	text-align: center;
	border: solid 2px;
}

#footer .goto-top i {
	font-size: 30px;
	line-height: 36px;
}

#footer .goto-top.transparent {
	pointer-events: none;
	cursor: default;
}



@media(max-width: 1015px) {
	#footer .footer-middle .left {
		float: none;
		width: 100%
	}

	#footer .footer-middle .right {
		float: none;
		width: 100%
	}

	#footer .footer-middle .links {
		border: none;
		padding: 0;
		margin: 0;
	}

	#footer .footer-middle .title {
		margin: 0;
		line-height: 48px;
		cursor: pointer
	}

	#footer .footer-middle .title svg {
		display: block;
	}

	#footer .footer-middle .title:hover svg {
		transform: rotate(180deg);
		transition: all .2s ease-in-out
	}

	#footer .footer-middle .link li {
		padding-bottom: .5rem;
	}

	#footer .footer-middle .logo-company {
		text-align: center;
		margin-right: 0;
		padding: 30px 0
	}


	#footer .links .footer-block {
		border-bottom: 1px solid #565150;
		height: 48px;
		overflow: hidden;
	}

	#footer .links .footer-block:hover {
		height: auto;
		transition: all .2s ease-in-out;
		max-height: 500px;
	}

	#footer .links .footer-block.sns,
	#footer .links .footer-block.subscribe {
		border: none;
		height: auto;
	}

	#footer .links .footer-block.sns {
		text-align: center;
		font-size: 12px;
	}

	#footer .footer-middle .subscribe {
		margin-top: 0
	}

	#footer .links .footer-block .code-filmora {
		margin: 30px auto 10px;
	}

	#footer .links .footer-block.sns .title {
		display: none;
	}


	#footer .mail {
		padding-bottom: 0;
	}

	#footer .mail input[type="email"] {
		border-color: rgba(243, 243, 243, .2);
	}


	#footer .goto-top {
		width: 30px;
		height: 30px;
		right: 10px;
		bottom: 10px;
		cursor: pointer;
		text-align: center;
		border-width: 1px;
		display: none;
	}

	#footer .goto-top i {
		font-size: 24px;
		line-height: 28px;
	}
}


/*** login **/
#login .modal-dialog {
	width: 500px;
	max-width: 100%;
	margin: 120px auto 0;
	margin: 10vh auto 0;
}

#login .modal-content {
	padding: 0;
	color: #3f4e59;
	background-color: #f8f8f8;
}

#login .modal-header .close {
	display: none;
	right: 0;
	top: -28px;
	font-size: 18px;
}

#login .modal-header .switch {
	line-height: 75px;
	font-size: 22px;
	letter-spacing: 0.2px;
	cursor: pointer;
}

#login .modal-header .switch li {
	float: left;
	width: 50%;
}

#login .modal-header .switch li:not(.active) {
	background-color: #f0f0f0;
	box-shadow: inset 0 0 15px 0 rgba(222, 222, 222, 0.5);
}

#login .modal-body {
	padding: 0 35px 30px;
}

#login form.active {
	max-height: 800px;
	overflow: initial;
}

#login .input-item {
	margin: 20px 0 0;
	position: relative;
	font-size: 16px;
}

#login .input-text {
	line-height: 29px;
	height: 30px;
	margin: 20px 0 0;
	padding: 0;
	border-color: #3f4e59;
}

#login .input-text:-webkit-autofill,
#login .input-text:-webkit-autofill:focus {
	-webkit-box-shadow: 0 0 0px 1000px #f8f8f8 inset;
	box-shadow: 0 0 0px 1000px #f8f8f8 inset;
}

#login .input-title {
	position: absolute;
	top: 0;
	left: 0;
	font-size: 14px;
	line-height: 20px;
	margin: 0;
	pointer-events: none;
	opacity: 0;
	color: #6ce2d9;
}

#login .input-title:before {
	content: "!";
	position: absolute;
	width: 13px;
	height: 13px;
	font-size: 12px;
	line-height: 13px;
	border-radius: 50%;
	color: #fff;
	background-color: #ff6d5c;
	top: 28px;
	left: -24px;
	text-align: center;
	opacity: 0;
}

#login .input-text:invalid+.input-title {
	opacity: 1;
}

#login .input-text:focus {
	border-color: #6ce2d9;
}

#login .input-text:focus+.input-title {
	top: 0;
	opacity: 1;
}

#login .input-text:focus:invalid {
	box-shadow: none;
	border-color: #6ce2d9;
}

#login .input-text:focus:invalid+.input-title:before {
	opacity: 1;
}

#login .input-text:not(:focus)+.input-title {
	top: 0;
	opacity: 1;
}

#login .input-text:not(:focus):invalid {
	color: transparent;
}

#login .input-text:not(:focus):invalid+.input-title {
	top: 23px;
	color: #3f4e59;
}

#login .input-check+.input-span {
	font-size: 14px;
}

#login .input-label {
	line-height: 30px;
}

#login .input-label>.input-check+.input-span:before {
	margin: 7px;
}

#login .input-label>.input-check+.input-span:after {
	top: 10px;
	left: 10px;
}

#login .input-title-group {
	position: static;
	opacity: 1;
}

#login .input-group {
	padding: 10px 0 0;
	margin: 0 0 -15px;
}

#login .input-group .input-label {
	margin-bottom: 15px;
}

#login .input-group .input-check+.input-span {
	padding: 0 10px;
	background-color: #f0f0f0;
}

#login .input-group .input-check:checked+.input-span {
	background-color: #3f4e59;
	color: #6ce2d9;
}

#login .input-group .input-check+.input-span:before,
#login .input-group .input-check+.input-span:after {
	display: none;
}

#login .input-group+.input-title {
	opacity: 1;
}

#login .action-extra {
	margin: 5px 0 0;
	line-height: 20px;
	font-size: 13px;
}

#login .action {
	margin: 35px 0 0;
}

#login .action .button {
	display: block;
	width: 100%;
	margin: 0;
}

#login .modal-footer {
	background-color: #f0f0f0;
	padding: 20px 20px 30px;
}

#login .third-head {
	font-size: 14px;
	letter-spacing: 0.2px;
	line-height: 15px;
	margin: 0 0 25px;
}

#login .third-box {
	line-height: 45px;
}

#login .third-party {
	display: inline-block;
	vertical-align: top;
	width: 130px;
	margin: 0 8px;
}

#login .third-party i {
	font-size: 18px;
}

#login .third-facebook {
	background-color: #30569b;
}

#login .third-twitter {
	background-color: #009ef6;
}

#login .third-youtube {
	background-color: #c20a00;
}

@media(max-width: 1015px) {
	#login .modal-dialog {
		margin: 30px 0 0;
	}

	#login .modal-header .close {
		display: inline-block;
	}

	#login .desc {
		display: none;
		font-size: 14px;
		line-height: 20px;
	}

	#login .input-group .input-check+.input-span {
		padding: 0 8px;
	}

	#login .input-group .input-label {
		margin: 0 3px 8px 0;
	}

	#login .action {
		text-align: center;
	}

	#login .third-party {
		width: 45px;
	}

	#login .third-party .title {
		display: none;
	}
}

/** section **/
section {
	position: relative;
}

section>.back {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 1;
	overflow: hidden;
}

section>.back>.container-full {
	height: 100%;
}

section>.front {
	position: relative;
	height: 100%;
	z-index: 2;
}

section>.front>div[class^="container"] {
	height: 100%;
}

@media(max-width: 1015px) {
	section>.front {
		width: 100%;
	}
}

/** parallax scrolling **/
section[data-anime="parallax"] .parallax-bg {
	position: absolute;
	width: 100%;
	height: 150%;
	top: 50%;
	-webkit-transform: translate(0, -50%);
	-moz-transform: translate(0, -50%);
	-ms-transform: translate(0, -50%);
	-o-transform: translate(0, -50%);
	transform: translate(0, -50%);
}

section[data-anime="parallax"] .parallax-bg video {
	position: absolute;
	top: 50%;
	left: 50%;
	min-width: 100%;
	width: auto;
	height: auto;
	z-index: -100;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

/** entrance **/
.unload {
	opacity: 0;
}

section[data-anime="entrance"] {
	overflow: hidden;
}

section[data-anime="entrance"] .anime-item {
	-webkit-transition-timing-function: ease-in-out;
	-moz-transition-timing-function: ease-in-out;
	-o-transition-timing-function: ease-in-out;
	transition-timing-function: ease-in-out;
}

section[data-anime="entrance"] .anime-item[data-anime-style="fade-up"].unload {
	-webkit-transform: translate(0, 15%);
	-moz-transform: translate(0, 15%);
	-ms-transform: translate(0, 15%);
	-o-transform: translate(0, 15%);
	transform: translate(0, 15%);
}

section[data-anime="entrance"] .anime-item[data-anime-style="fade-down"].unload {
	-webkit-transform: translate(0, -15%);
	-moz-transform: translate(0, -15%);
	-ms-transform: translate(0, -15%);
	-o-transform: translate(0, -15%);
	transform: translate(0, -15%);
}

section[data-anime="entrance"] .anime-item[data-anime-style="fade-left"].unload {
	-webkit-transform: translate(15%, 0);
	-moz-transform: translate(15%, 0);
	-ms-transform: translate(15%, 0);
	-o-transform: translate(15%, 0);
	transform: translate(15%, 0);
}

section[data-anime="entrance"] .anime-item[data-anime-style="fade-right"].unload {
	-webkit-transform: translate(-15%, 0);
	-moz-transform: translate(-15%, 0);
	-ms-transform: translate(-15%, 0);
	-o-transform: translate(-15%, 0);
	transform: translate(-15%, 0);
}

/** with mask **/
.with-mask {
	position: relative;
}

.with-mask:before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	opacity: .25;
	z-index: 1;
	pointer-events: none;
}

.with-mask-light:before {
	opacity: .15;
}

.with-mask-dark:before {
	opacity: .5;
}

/** tab switch **/
.tab-switch .tab-content>.tab-pane {
	display: none;
}

.tab-switch .tab-content>.tab-pane.active {
	display: block;
}

/** image lightbox **/
.img-lightbox {
	cursor: pointer;
}

#modal-lightbox .modal-content {
	padding: 50px 40px 10px;
}

#modal-lightbox .modal-body {
	padding: 0;
}

.swiper-lightbox .swiper-container {
	padding: 0 0 40px;
}

.swiper-lightbox img {
	max-width: 100%;
}

/** youtube player **/
.yt-player {
	display: inline-block;
	width: 100%;
	max-width: 100%;
	height: 0;
	padding-bottom: 56.1224%;
	position: relative;
	background-color: #000;
	overflow: hidden;
	vertical-align: top;
	position: relative;
}

.yt-cover {
	cursor: pointer;
	height: 0;
	padding-bottom: 56.12245%;
	background-image: url("ph/ph-youtube.png");
	z-index: 3
}

.yt-cover:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: #000;
	left: 0;
	top: 0;
	opacity: .25;
}

.yt-play {
	position: absolute;
	left: 50%;
	top: 50%;
	line-height: 1;
	font-size: 80px;
	height: 1em;
	width: 1em;
	color: #fff;
	text-shadow: 1px 1px 1px #666;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	z-index: 3
}

.yt-cover:hover:before {
	opacity: .5;
}

.yt-player .videobox {
	opacity: 0
}

.yt-iframe {
	position: absolute;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	bottom: 0;
	z-index: 1;
	border: none;
	opacity: 1;
}

.yt-player.active .yt-cover,
.yt-player.active .yt-play {
	opacity: 0;
	z-index: 1
}

.yt-player.active .videobox {
	position: absolute;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	bottom: 0;
	z-index: 1;
	border: none;
	opacity: 1;
}

#modal-youtube .modal-body {
	height: 0;
	padding-bottom: 56.12245%;
	position: relative;
}

#modal-youtube iframe {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	border: none;
}

/** sliders **/
.swiper-slides {
	position: relative;
}

.swiper-index {
	text-align: center;
}

.swiper-index li {
	display: inline-block;
	cursor: pointer;
}

.swiper-ctrl {
	position: absolute;
	font-size: 50px;
	width: 50px;
	text-align: center;
	line-height: 1;
	z-index: 11;
	cursor: pointer;
	top: 45%;
	top: calc(50% - 25px);
}

.swiper-ctrl-prev {
	left: -50px;
}

.swiper-ctrl-next {
	right: -50px;
}

.swiper-container {
	padding: 40px 0;
}

.swiper-wrapper.row {
	width: auto;
}

.swiper-cover {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 3;
}

.swiper-pagination-bullet {
	background-color: #6ce2d9;
	opacity: .7;
}

.swiper-pagination-bullet-active {
	background-color: #ff6d5c;
}

@media(max-width: 1215px) {
	.swiper-ctrl {
		display: none;
	}
}

/** list prefix **/
.list-prefix {
	counter-reset: li;
}

.list-prefix>li:before {
	width: 20px;
	font-size: 20px;
	display: inline-block;
	vertical-align: middle;
	text-align: center;
	margin-right: 5px;
	line-height: inherit;
}

.list-disc>li:before {
	content: "\2022";
	font-family: Arial;
}

.list-check>li:before {
	content: "\e90d";
	font-family: "filmora";
}

.list-number>li:before {
	content: counter(li)".";
	counter-increment: li;
	font-size: inherit;
}

/** miscellaneous **/
/* ratings */
ul.ratings {
	color: #ffa108;
}

ul.ratings li {
	display: inline-block;
}

/* scrollbar */
.with-scrollbar {
	-ms-overflow-style: auto;
}

.with-scrollbar::-webkit-scrollbar {
	display: initial;
	width: 5px;
	height: 5px;
}

.with-scrollbar::-webkit-scrollbar-track {
	background-color: #f3f3f3;
}

.with-scrollbar::-webkit-scrollbar-thumb {
	background-color: #3f4e59;
}

/* border */
.with-border {
	border-color: rgba(155, 155, 155, .3) !important;
}

/** text shadow **/
.with-shadow {
	text-shadow: 1px 1px 1px #999;
}

/** breadcrumbs **/
.breadcrumbs {
	margin-bottom: 41px;
	line-height: 20px;
}

.breadcrumbs li {
	display: inline;
	vertical-align: bottom;
	font-size: 14px;
}

.breadcrumbs li:after {
	content: "\e905";
	font-family: "filmora";
	font-size: 12px;
	vertical-align: bottom;
	margin: 0 5px 0 10px;
}

.breadcrumbs li:last-of-type:after {
	display: none;
}

.breadcrumbs a {
	display: inline;
	vertical-align: bottom;
}

@media(max-width: 1215px) {
	.breadcrumbs {
		margin-bottom: 15px;
	}
}


/** flag **/
.flags {
	margin: 23px 0;
}

.flag {
	float: left;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 14px;
	width: 21px;
	position: relative;
}

.flag:not(.flag-cover) {
	max-width: 0;
	margin-right: 0;
}

.flag:not(.flag-cover) a:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: #000;
	opacity: .2;
	cursor: pointer;
	-webkit-transition-duration: .2s;
	-moz-transition-duration: .2s;
	-o-transition-duration: .2s;
	transition-duration: .2s;
}

.flag:not(.flag-cover):hover a:before {
	opacity: 0;
}

.flags.active .flag:not(.flag-cover) {
	max-width: 21px;
	margin-right: 9px;
}

.flags.active .flag.flag-cover {
	display: none;
}

.flag.flag-cover a {
	position: absolute;
	white-space: nowrap;
	padding-left: 30px;
	line-height: 14px;
}

.flag.flag-cn,
#body[data-lan="cn"]~#footer .flag.flag-cover {
	background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMjAwIDgwMCIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KPHBhdGggZmlsbD0iI2RlMjkxMCIgZD0ibTAsMGgxMjAwdjgwMGgtMTIwMHoiLz4NCjxwYXRoIGZpbGw9IiNmZmRlMDAiIGQ9Im0tMTYuNTc5Niw5OS42MDA3bDIuMzY4Ni04LjEwMzItNi45NTMtNC43ODgzIDguNDM4Ni0uMjUxNCAyLjQwNTMtOC4wOTI0IDIuODQ2Nyw3Ljk0NzkgOC40Mzk2LS4yMTMxLTYuNjc5Miw1LjE2MzQgMi44MTA2LDcuOTYwNy02Ljk3NDctNC43NTY3LTYuNzAyNSw1LjEzMzF6IiB0cmFuc2Zvcm09Im1hdHJpeCg5LjkzMzUyIC4yNzc0NyAtLjI3NzQ3IDkuOTMzNTIgMzI0LjI5MjUgLTY5NS4yNDE1KSIvPg0KPHBhdGggZmlsbD0iI2ZmZGUwMCIgaWQ9InN0YXIiIGQ9Im0zNjUuODU1MiwzMzIuNjg5NWwyOC4zMDY4LDExLjM3NTcgMTkuNjcyMi0yMy4zMTcxLTIuMDcxNiwzMC40MzY3IDI4LjI1NDksMTEuNTA0LTI5LjU4NzIsNy40MzUyLTIuMjA5NywzMC40MjY5LTE2LjIxNDItMjUuODQxNS0yOS42MjA2LDcuMzAwOSAxOS41NjYyLTIzLjQwNjEtMTYuMDk2OC0yNS45MTQ4eiIvPg0KPGcgZmlsbD0iI2ZmZGUwMCI+DQo8cGF0aCBkPSJtNTE5LjA3NzksMTc5LjMxMjlsLTMwLjA1MzQtNS4yNDE4LTE0LjM5NDUsMjYuODk3Ni00LjMwMTctMzAuMjAyMy0zMC4wMjkzLTUuMzc4MSAyNy4zOTQ4LTEzLjQyNDItNC4xNjQ3LTMwLjIyMTUgMjEuMjMyNiwyMS45MDU3IDI3LjQ1NTQtMTMuMjk5OC0xNC4yNzIzLDI2Ljk2MjcgMjEuMTMzMSwyMi4wMDE3eiIvPg0KPHBhdGggZD0ibTQ1NS4yNTkyLDMxNS45Nzk1bDkuMzczNC0yOS4wMzE0LTI0LjYzMjUtMTcuOTk3OCAzMC41MDctLjA1NjYgOS41MDUtMjguOTg4NiA5LjQ4MSwyOC45OTY0IDMwLjUwNywuMDgxOC0yNC42NDc0LDE3Ljk3NzQgOS4zNDkzLDI5LjAzOTItMjQuNzE0LTE3Ljg4NTgtMjQuNzI4OCwxNy44NjUzeiIvPg0KPC9nPg0KPHVzZSB4bGluazpocmVmPSIjc3RhciIgdHJhbnNmb3JtPSJtYXRyaXgoLjk5ODYzIC4wNTIzNCAtLjA1MjM0IC45OTg2MyAxOS40MDAwNSAtMzAwLjUzNjgxKSIvPg0KPC9zdmc+DQo=');
}

.flag.flag-en,
#body[data-lan="en"]~#footer .flag.flag-cover {
	background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMjM1IDY1MCIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KPGRlZnM+DQo8ZyBpZD0idW5pb24iPg0KPHVzZSB5PSItLjIxNiIgeGxpbms6aHJlZj0iI3g0Ii8+DQo8dXNlIHhsaW5rOmhyZWY9IiN4NCIvPg0KPHVzZSB5PSIuMjE2IiB4bGluazpocmVmPSIjczYiLz4NCjwvZz4NCjxnIGlkPSJ4NCI+DQo8dXNlIHhsaW5rOmhyZWY9IiNzNiIvPg0KPHVzZSB5PSIuMDU0IiB4bGluazpocmVmPSIjczUiLz4NCjx1c2UgeT0iLjEwOCIgeGxpbms6aHJlZj0iI3M2Ii8+DQo8dXNlIHk9Ii4xNjIiIHhsaW5rOmhyZWY9IiNzNSIvPg0KPC9nPg0KPGcgaWQ9InM1Ij4NCjx1c2UgeD0iLS4yNTIiIHhsaW5rOmhyZWY9IiNzdGFyIi8+DQo8dXNlIHg9Ii0uMTI2IiB4bGluazpocmVmPSIjc3RhciIvPg0KPHVzZSB4bGluazpocmVmPSIjc3RhciIvPg0KPHVzZSB4PSIuMTI2IiB4bGluazpocmVmPSIjc3RhciIvPg0KPHVzZSB4PSIuMjUyIiB4bGluazpocmVmPSIjc3RhciIvPg0KPC9nPg0KPGcgaWQ9InM2Ij4NCjx1c2UgeD0iLS4wNjMiIHhsaW5rOmhyZWY9IiNzNSIvPg0KPHVzZSB4PSIuMzE1IiB4bGluazpocmVmPSIjc3RhciIvPg0KPC9nPg0KPGcgaWQ9InN0YXIiPg0KPHVzZSB4bGluazpocmVmPSIjcHQiIHRyYW5zZm9ybT0ibWF0cml4KC0uODA5MDIgLS41ODc3OSAuNTg3NzkgLS44MDkwMiAwIDApIi8+DQo8dXNlIHhsaW5rOmhyZWY9IiNwdCIgdHJhbnNmb3JtPSJtYXRyaXgoLjMwOTAyIC0uOTUxMDYgLjk1MTA2IC4zMDkwMiAwIDApIi8+DQo8dXNlIHhsaW5rOmhyZWY9IiNwdCIvPg0KPHVzZSB4bGluazpocmVmPSIjcHQiIHRyYW5zZm9ybT0icm90YXRlKDcyKSIvPg0KPHVzZSB4bGluazpocmVmPSIjcHQiIHRyYW5zZm9ybT0icm90YXRlKDE0NCkiLz4NCjwvZz4NCjxwYXRoIGZpbGw9IiNmZmYiIGlkPSJwdCIgZD0iTS0uMTYyNSwwIDAtLjUgLjE2MjUsMHoiIHRyYW5zZm9ybT0ic2NhbGUoLjA2MTYpIi8+DQo8cGF0aCBmaWxsPSIjYmYwYTMwIiBpZD0ic3RyaXBlIiBkPSJtMCwwaDEyMzV2NTBoLTEyMzV6Ii8+DQo8L2RlZnM+DQo8cGF0aCBmaWxsPSIjZmZmIiBkPSJtMCwwaDEyMzV2NjUwaC0xMjM1eiIvPg0KPHVzZSB4bGluazpocmVmPSIjc3RyaXBlIi8+DQo8dXNlIHk9IjEwMCIgeGxpbms6aHJlZj0iI3N0cmlwZSIvPg0KPHVzZSB5PSIyMDAiIHhsaW5rOmhyZWY9IiNzdHJpcGUiLz4NCjx1c2UgeT0iMzAwIiB4bGluazpocmVmPSIjc3RyaXBlIi8+DQo8dXNlIHk9IjQwMCIgeGxpbms6aHJlZj0iI3N0cmlwZSIvPg0KPHVzZSB5PSI1MDAiIHhsaW5rOmhyZWY9IiNzdHJpcGUiLz4NCjx1c2UgeT0iNjAwIiB4bGluazpocmVmPSIjc3RyaXBlIi8+DQo8cGF0aCBmaWxsPSIjMDAyODY4IiBkPSJtMCwwaDQ5NHYzNTBoLTQ5NHoiLz4NCjx1c2UgeGxpbms6aHJlZj0iI3VuaW9uIiB0cmFuc2Zvcm09Im1hdHJpeCg2NTAgMCAwIDY1MCAyNDcgMTc1KSIvPg0KPC9zdmc+DQo=');
	background-position: left center;
}

.flag.flag-fr,
#body[data-lan="fr"]~#footer .flag.flag-cover {
	background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA5MDAgNjAwIj4NCjxwYXRoIGZpbGw9IiNlZDI5MzkiIGQ9Im0wLDBoOTAwdjYwMGgtOTAweiIvPg0KPHBhdGggZmlsbD0iI2ZmZiIgZD0ibTAsMGg2MDB2NjAwaC02MDB6Ii8+DQo8cGF0aCBmaWxsPSIjMDAyMzk1IiBkPSJtMCwwaDMwMHY2MDBoLTMwMHoiLz4NCjwvc3ZnPg0K');
}

.flag.flag-de,
#body[data-lan="de"]~#footer .flag.flag-cover {
	background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBoZWlnaHQ9IjYwMCIgdmlld0JveD0iMCAwIDUgMyI+DQo8cGF0aCBkPSJtMCwwaDV2M2gtNXoiLz4NCjxwYXRoIGZpbGw9IiNkMDAiIGQ9Im0wLDFoNXYyaC01eiIvPg0KPHBhdGggZmlsbD0iI2ZmY2UwMCIgZD0ibTAsMmg1djFoLTV6Ii8+DQo8L3N2Zz4NCg==');
}

.flag.flag-it,
#body[data-lan="it"]~#footer .flag.flag-cover {
	background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBoZWlnaHQ9IjEwMDAiIHZpZXdCb3g9IjAgMCAzIDIiPg0KPHBhdGggZmlsbD0iIzAwOTI0NiIgZD0ibTAsMGgxdjJoLTF6Ii8+DQo8cGF0aCBmaWxsPSIjZmZmIiBkPSJtMSwwaDF2MmgtMXoiLz4NCjxwYXRoIGZpbGw9IiNjZTJiMzciIGQ9Im0yLDBoMXYyaC0xeiIvPg0KPC9zdmc+DQo=');
}

.flag.flag-es,
#body[data-lan="is"]~#footer .flag.flag-cover {
	background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA3NTAgNTAwIj4NCjxwYXRoIGZpbGw9IiNjNjBiMWUiIGQ9Im0wLDBoNzUwdjUwMGgtNzUweiIvPg0KPHBhdGggZmlsbD0iI2ZmYzQwMCIgZD0ibTAsMTI1aDc1MHYyNTBoLTc1MHoiLz4NCjwvc3ZnPg0K');
}

.flag.flag-br,
#body[data-lan="br"]~#footer .flag.flag-cover {
	background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgdmVyc2lvbj0iMS4wIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNzIwIiBoZWlnaHQ9IjUwNCIgdmlld0JveD0iLTIxMDAgLTE0NzAgNDIwMCAyOTQwIj4NCgk8ZGVmcz4NCgkJPHBhdGggaWQ9IkQiIGQ9Ik0gLTMxLjUsMCBoIDMzIGEgMzAgMzAgMCAwIDAgMzAsLTMwIHYgLTEwIGEgMzAgMzAgMCAwIDAgLTMwLC0zMCBIIC0zMS41IHogTSAtMTguNSwtMTMgaCAxOSBhIDE5IDE5IDAgMCAwIDE5LC0xOSB2IC02IGEgMTkgMTkgMCAwIDAgLTE5LC0xOSBIIC0xOC41IHoiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPg0KCQk8cGF0aCBpZD0iRSIgZD0iTSAwLDAgaCA2MyB2IC0xMyBIIDEyIHYgLTE4IGggNDAgdiAtMTIgaCAtNDAgdiAtMTQgSCA2MCB2IC0xMyBIIDAgeiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTMxLjUpIi8+DQoJCTxwYXRoIGlkPSJlIiBkPSJNIC0yNi4yNSwwIGggNTIuNSB2IC0xMiBoIC00MC41IHYgLTE2IGggMzMgdiAtMTIgaCAtMzMgdiAtMTEgSCAyNSB2IC0xMiBIIC0yNi4yNSB6Ii8+DQoJCTxnIGlkPSJHIj4NCgkJCTxjbGlwUGF0aCBpZD0iZ2N1dCI+DQoJCQkJPHBhdGggZD0iTSAtMzEuNSwwIHYgLTcwIGggNjMgdiA3MCB6IE0gMCwtNDcgdiAxMiBoIDMxLjUgdiAtMTIgeiIvPg0KCQkJPC9jbGlwUGF0aD4NCgkJCTx1c2UgeGxpbms6aHJlZj0iI08iIGNsaXAtcGF0aD0idXJsKCNnY3V0KSIvPg0KCQkJPHJlY3QgeD0iNSIgeT0iLTM1IiB3aWR0aD0iMjYuNSIgaGVpZ2h0PSIxMCIvPg0KCQkJPHJlY3QgeD0iMjEuNSIgeT0iLTM1IiB3aWR0aD0iMTAiIGhlaWdodD0iMzUiLz4NCgkJPC9nPg0KCQk8cGF0aCBpZD0iTSIgZD0iTSAtMzEuNSwwIGggMTIgdiAtNDggbCAxNCw0OCBoIDExIGwgMTQsLTQ4IFYgMCBoIDEyIFYgLTcwIGggLTE3LjUgbCAtMTQsNDggbCAtMTQsLTQ4IEggLTMxLjUgeiIvPg0KCQk8cGF0aCBpZD0iTyIgZD0iTSAwLDAgYSAzMS41IDM1IDAgMCAwIDAsLTcwIGEgMzEuNSAzNSAwIDAgMCAwLDcwIE0gMCwtMTMgYSAxOC41IDIyIDAgMCAwIDAsLTQ0IGEgMTguNSAyMiAwIDAgMCAwLDQ0IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz4NCgkJPHBhdGggaWQ9IlAiIGQ9Ik0gLTMxLjUsMCBoIDEzIHYgLTI2IGggMjggYSAyMiAyMiAwIDAgMCAwLC00NCBoIC00MCB6IE0gLTE4LjUsLTM5IGggMjcgYSA5IDkgMCAwIDAgMCwtMTggaCAtMjcgeiIgZmlsbC1ydWxlPSJldmVub2RkIi8+DQoJCTxnIGlkPSJSIj4NCgkJCTx1c2UgeGxpbms6aHJlZj0iI1AiLz4NCgkJCTxwYXRoIGQ9Ik0gMjgsMCBjIDAsLTEwIDAsLTMyIC0xNSwtMzIgaCAtMTkgYyAyMiwwIDIyLDIyIDIyLDMyIi8+DQoJCTwvZz4NCgkJPHBhdGggaWQ9IlMiIGQ9Ik0gLTE1Ljc1LC0yMiBDIC0xNS43NSwtMTUgLTksLTExLjUgMSwtMTEuNSBDIDExLC0xMS41IDE1Ljc0LC0xNC43NSAxNS43NSwtMTkuMjUgQyAxNS43NSwtMzMuNSAtMzEsLTI0LjUgLTMwLjc1LC00OS41IEMgLTMwLjUsLTcxIC02LC03MCAzLC03MCBDIDEyLC03MCAyOSwtNjYgMjguNzUsLTQ4Ljc1IEwgMTMuNSwtNDguNzUgQyAxMy41LC01Ni4yNSA2LjUsLTU5IC0xLjUsLTU5IEMgLTkuMjUsLTU5IC0xNC43NSwtNTcuNzUgLTE0Ljc1LC01MC41IEMgLTE1LC0zOC43NSAzMS41LC00Ni41IDMxLjUsLTIxLjc1IEMgMzEuNSwtMy41IDEzLjUsMCAwLDAgQyAtMTEuNSwwIC0zMS41NSwtNC41IC0zMS41LC0yMiB6Ii8+DQoJCTxnIGlkPSJzdGFyIiBmaWxsPSIjZmZmIj4NCgkJCTxnIGlkPSJjIj4NCgkJCQk8cGF0aCBpZD0idCIgZD0iTSAwLC0xIHYgMSBoIC41IiB0cmFuc2Zvcm09InJvdGF0ZSgxOCAwLC0xKSIvPg0KCQkJCTx1c2UgeGxpbms6aHJlZj0iI3QiIHRyYW5zZm9ybT0ic2NhbGUoLTEsMSkiLz4NCgkJCTwvZz4NCgkJCTx1c2UgeGxpbms6aHJlZj0iI2MiIHRyYW5zZm9ybT0icm90YXRlKDcyKSIvPg0KCQkJPHVzZSB4bGluazpocmVmPSIjYyIgdHJhbnNmb3JtPSJyb3RhdGUoLTcyKSIvPg0KCQkJPHVzZSB4bGluazpocmVmPSIjYyIgdHJhbnNmb3JtPSJyb3RhdGUoMTQ0KSIvPg0KCQkJPHVzZSB4bGluazpocmVmPSIjYyIgdHJhbnNmb3JtPSJyb3RhdGUoLTE0NCkiLz4NCgkJPC9nPg0KCQk8dXNlIGlkPSJzdGFyMSIgeGxpbms6aHJlZj0iI3N0YXIiIHRyYW5zZm9ybT0ic2NhbGUoMzEuNSkiLz4NCgkJPHVzZSBpZD0ic3RhcjIiIHhsaW5rOmhyZWY9IiNzdGFyIiB0cmFuc2Zvcm09InNjYWxlKDI2LjI1KSIvPg0KCQk8dXNlIGlkPSJzdGFyMyIgeGxpbms6aHJlZj0iI3N0YXIiIHRyYW5zZm9ybT0ic2NhbGUoMjEpIi8+DQoJCTx1c2UgaWQ9InN0YXI0IiB4bGluazpocmVmPSIjc3RhciIgdHJhbnNmb3JtPSJzY2FsZSgxNSkiLz4NCgkJPHVzZSBpZD0ic3RhcjUiIHhsaW5rOmhyZWY9IiNzdGFyIiB0cmFuc2Zvcm09InNjYWxlKDEwLjUpIi8+DQoJPC9kZWZzPg0KCTxyZWN0IHg9Ii01MCUiIHk9Ii01MCUiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9IiMwMDliM2EiLz4NCgk8cGF0aCBkPSJNIC0xNzQzLDAgMCwxMTEzIDE3NDMsMCAwLC0xMTEzIHoiIGZpbGw9IiNmZWRmMDAiLz4NCgk8Y2lyY2xlIHI9IjczNSIgZmlsbD0iIzAwMjc3NiIvPg0KCTxjbGlwUGF0aCBpZD0iYmFuZCI+DQoJCTxjaXJjbGUgcj0iNzM1Ii8+DQoJPC9jbGlwUGF0aD4NCgk8cGF0aCBkPSJNIC0yMjA1LDE0NzAgYSAxNzg1IDE3ODUgMCAwIDEgMzU3MCwwIGggLTEwNSBhIDE2ODAgMTY4MCAwIDEgMCAtMzM2MCwwIHoiIGNsaXAtcGF0aD0idXJsKCNiYW5kKSIgZmlsbD0iI2ZmZiIvPg0KCTxnIGZpbGw9IiMwMDliM2EiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC00MjAsMTQ3MCkiPg0KCQk8dXNlIHhsaW5rOmhyZWY9IiNPIiB5PSItMTY5Ny41IiB0cmFuc2Zvcm09InJvdGF0ZSgtNykiLz4NCgkJPHVzZSB4bGluazpocmVmPSIjUiIgeT0iLTE2OTcuNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTQpIi8+DQoJCTx1c2UgeGxpbms6aHJlZj0iI0QiIHk9Ii0xNjk3LjUiIHRyYW5zZm9ybT0icm90YXRlKC0xKSIvPg0KCQk8dXNlIHhsaW5rOmhyZWY9IiNFIiB5PSItMTY5Ny41IiB0cmFuc2Zvcm09InJvdGF0ZSgyKSIvPg0KCQk8dXNlIHhsaW5rOmhyZWY9IiNNIiB5PSItMTY5Ny41IiB0cmFuc2Zvcm09InJvdGF0ZSg1KSIvPg0KCQk8dXNlIHhsaW5rOmhyZWY9IiNlIiB5PSItMTY5Ny41IiB0cmFuc2Zvcm09InJvdGF0ZSg5Ljc1KSIvPg0KCQk8dXNlIHhsaW5rOmhyZWY9IiNQIiB5PSItMTY5Ny41IiB0cmFuc2Zvcm09InJvdGF0ZSgxNC41KSIvPg0KCQk8dXNlIHhsaW5rOmhyZWY9IiNSIiB5PSItMTY5Ny41IiB0cmFuc2Zvcm09InJvdGF0ZSgxNy41KSIvPg0KCQk8dXNlIHhsaW5rOmhyZWY9IiNPIiB5PSItMTY5Ny41IiB0cmFuc2Zvcm09InJvdGF0ZSgyMC41KSIvPg0KCQk8dXNlIHhsaW5rOmhyZWY9IiNHIiB5PSItMTY5Ny41IiB0cmFuc2Zvcm09InJvdGF0ZSgyMy41KSIvPg0KCQk8dXNlIHhsaW5rOmhyZWY9IiNSIiB5PSItMTY5Ny41IiB0cmFuc2Zvcm09InJvdGF0ZSgyNi41KSIvPg0KCQk8dXNlIHhsaW5rOmhyZWY9IiNFIiB5PSItMTY5Ny41IiB0cmFuc2Zvcm09InJvdGF0ZSgyOS41KSIvPg0KCQk8dXNlIHhsaW5rOmhyZWY9IiNTIiB5PSItMTY5Ny41IiB0cmFuc2Zvcm09InJvdGF0ZSgzMi41KSIvPg0KCQk8dXNlIHhsaW5rOmhyZWY9IiNTIiB5PSItMTY5Ny41IiB0cmFuc2Zvcm09InJvdGF0ZSgzNS41KSIvPg0KCQk8dXNlIHhsaW5rOmhyZWY9IiNPIiB5PSItMTY5Ny41IiB0cmFuc2Zvcm09InJvdGF0ZSgzOC41KSIvPg0KCTwvZz4NCgk8dXNlIGlkPSLOsUNNaSIgeGxpbms6aHJlZj0iI3N0YXIxIiB4PSItNjAwIiB5PSItMTMyIi8+DQoJPHVzZSBpZD0izrFDTWEiIHhsaW5rOmhyZWY9IiNzdGFyMSIgeD0iLTUzNSIgeT0iMTc3Ii8+DQoJPHVzZSBpZD0izrJDTWEiIHhsaW5rOmhyZWY9IiNzdGFyMiIgeD0iLTYyNSIgeT0iMjQzIi8+DQoJPHVzZSBpZD0izrNDTWEiIHhsaW5rOmhyZWY9IiNzdGFyNCIgeD0iLTQ2MyIgeT0iMTMyIi8+DQoJPHVzZSBpZD0izrRDTWEiIHhsaW5rOmhyZWY9IiNzdGFyMiIgeD0iLTM4MiIgeT0iMjUwIi8+DQoJPHVzZSBpZD0izrVDTWEiIHhsaW5rOmhyZWY9IiNzdGFyMyIgeD0iLTQwNCIgeT0iMzIzIi8+DQoJPHVzZSBpZD0izrFWaXIiIHhsaW5rOmhyZWY9IiNzdGFyMSIgeD0iMjI4IiB5PSItMjI4Ii8+DQoJPHVzZSBpZD0izrFTY28iIHhsaW5rOmhyZWY9IiNzdGFyMSIgeD0iNTE1IiB5PSIyNTgiLz4NCgk8dXNlIGlkPSLOslNjbyIgeGxpbms6aHJlZj0iI3N0YXIzIiB4PSI2MTciIHk9IjI2NSIvPg0KCTx1c2UgaWQ9Is61U2NvIiB4bGluazpocmVmPSIjc3RhcjIiIHg9IjU0NSIgeT0iMzIzIi8+DQoJPHVzZSBpZD0izrhTY28iIHhsaW5rOmhyZWY9IiNzdGFyMiIgeD0iMzY4IiB5PSI0NzciLz4NCgk8dXNlIGlkPSLOuVNjbyIgeGxpbms6aHJlZj0iI3N0YXIzIiB4PSIzNjciIHk9IjU1MSIvPg0KCTx1c2UgaWQ9Is66U2NvIiB4bGluazpocmVmPSIjc3RhcjMiIHg9IjQ0MSIgeT0iNDE5Ii8+DQoJPHVzZSBpZD0izrtTY28iIHhsaW5rOmhyZWY9IiNzdGFyMiIgeD0iNTAwIiB5PSIzODIiLz4NCgk8dXNlIGlkPSLOvFNjbyIgeGxpbms6aHJlZj0iI3N0YXIzIiB4PSIzNjUiIHk9IjQwNSIvPg0KCTx1c2UgaWQ9Is6xSHlhIiB4bGluazpocmVmPSIjc3RhcjIiIHg9Ii0yODAiIHk9IjMwIi8+DQoJPHVzZSBpZD0izrNIeWEiIHhsaW5rOmhyZWY9IiNzdGFyMyIgeD0iMjAwIiB5PSItMzciLz4NCgk8dXNlIGlkPSLOsUNydSIgeGxpbms6aHJlZj0iI3N0YXIxIiB5PSIzMzAiLz4NCgk8dXNlIGlkPSLOskNydSIgeGxpbms6aHJlZj0iI3N0YXIyIiB4PSI4NSIgeT0iMTg0Ii8+DQoJPHVzZSBpZD0izrNDcnUiIHhsaW5rOmhyZWY9IiNzdGFyMiIgeT0iMTE4Ii8+DQoJPHVzZSBpZD0izrRDcnUiIHhsaW5rOmhyZWY9IiNzdGFyMyIgeD0iLTc0IiB5PSIxODQiLz4NCgk8dXNlIGlkPSLOtUNydSIgeGxpbms6aHJlZj0iI3N0YXI0IiB4PSItMzciIHk9IjIzNSIvPg0KCTx1c2UgaWQ9Is6xVHJBIiB4bGluazpocmVmPSIjc3RhcjIiIHg9IjIyMCIgeT0iNDk1Ii8+DQoJPHVzZSBpZD0izrJUckEiIHhsaW5rOmhyZWY9IiNzdGFyMyIgeD0iMjgzIiB5PSI0MzAiLz4NCgk8dXNlIGlkPSLOs1RyQSIgeGxpbms6aHJlZj0iI3N0YXIzIiB4PSIxNjIiIHk9IjQxMiIvPg0KCTx1c2UgaWQ9Is6xQ2FyIiB4bGluazpocmVmPSIjc3RhcjEiIHg9Ii0yOTUiIHk9IjM5MCIvPg0KCTx1c2UgaWQ9Is+DT2N0IiB4bGluazpocmVmPSIjc3RhcjUiIHk9IjU3NSIvPg0KPC9zdmc+');
}

.flag.flag-ae,
#body[data-lan="ae"]~#footer .flag.flag-cover {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBoZWlnaHQ9IjYwMCIgdmlld0JveD0iMCAwIDEyIDYiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4NCjxwYXRoIGZpbGw9IiNjZTExMjYiIGQ9Im0wLDBoM3Y2aC0zeiIvPg0KPHBhdGggZmlsbD0iIzAwOWEwMCIgZD0ibTMsMGg5djJoLTl6Ii8+DQo8cGF0aCBmaWxsPSIjZmZmIiBkPSJtMywyaDl2MmgtOXoiLz4NCjxwYXRoIGQ9Im0zLDRoOXYyaC05eiIvPg0KPC9zdmc+DQo=");
	background-position: left center;
}

.webuploader-pick {
	background: none !important;
	padding: 0 !important;
	color: #3f4e59 !important;
}

.webuploader-pick-hover {
	background: none !important
}

#fileList {
	min-height: 32px;
	margin: -30px 0 10px 0px\0
}

#fileList .file-item {
	display: inline-block;
	border-radius: 3px;
	margin: 0 8px 0 8px;
	cursor: pointer
}

#fileList .file-item img {
	display: none
}

#fileList .info {
	font-size: 14px;
	text-align: left;
	font-size: 14px;
	height: 26px;
	line-height: 26px;
	vertical-align: top;
}

#fileList .info:hover {
	color: #6ce2d9
}

#fileList .remove {
	font-size: 14px;
}

#fileList .pgs {
	position: absolute;
	bottom: 0;
	font-size: 12px;
	line-height: 1;
	text-align: center;
	width: 100%;
	margin: 0 0 5px 0;
	color: #125424;
}

#modal-lightbox .swiper-slide {
	align-self: center;
	height: 500px
}

#modal-lightbox .swiper-slide .image {
	height: 100%;
	background-repeat: no-repeat;
	background-position: center
}



.AdBt {
	position: fixed;
	left: 50%;
	bottom: 0px !important;
	top: auto !important;
	z-index: 99999;
	width: 100%;
	height: auto;
	transform: translate(-50%);
}

.AdBt .close {
	display: inline-block;
	color: #fff;
	font-size: 24px;
	position: absolute;
	right: 10px;
	top: 10px;
	border: 1px solid #FFF;
	border-radius: 50%;
	height: 32px;
	width: 32px;
	text-align: center;
	cursor: pointer;
	z-index: 1;
	line-height: 32px;
	font-weight: 300;
	opacity: 1;
	filter: alpha(opacity=100);
}

.ad-banner-bottom {
	position: fixed;
	left: 50%;
	bottom: 0px;
	z-index: 99999;
	width: 100%;
	height: auto;
	transform: translateX(-50%);
}

.ad-banner-bottom>a {
	height: 108px;
	background-size: cover;
	display: block;
}

.ad-banner-bottom .close {
	display: inline-block;
	color: #393939;
	font-size: 24px;
	position: absolute;
	right: 10px;
	top: 10px;
	border: 1px solid #393939;
	border-radius: 50%;
	height: 32px;
	width: 32px;
	text-align: center;
	cursor: pointer;
	z-index: 1;
	line-height: 32px;
	font-weight: 300;
	opacity: 1;
}

.ad-banner-bottom .close a {
	color: #393939;
}

.ad-banner-left {
	position: fixed;
	left: 0;
	bottom: 0;
	z-index: 99999;
	width: 300px;
	height: 300px;
}

.ad-banner-left>a {
	height: 300px;
	width: 300px;
	background-size: cover;
	display: block;
}

.ad-banner-left .close {
	display: inline-block;
	color: #393939;
	font-size: 24px;
	position: absolute;
	right: 10px;
	top: 10px;
	border: 1px solid #393939;
	border-radius: 50%;
	height: 32px;
	width: 32px;
	text-align: center;
	cursor: pointer;
	z-index: 1;
	line-height: 32px;
	font-weight: 300;
	opacity: 1;
}

.ad-banner-left .close a {
	color: #393939;
}

/*red-packet*/
.red-packet {
	position: fixed;
	bottom: calc(10% + 8px);
	right: 5px;
	z-index: 4;
	display: none;
	width: 158px;
	height: 223px;
	cursor: url(/assets/images/cur.cur), pointer;
}

.packet-top {
	width: 158px;
	height: 83px;
	background-image: url(../images/light.png);
	background-size: 100%;
	text-indent: -9999px;
	position: absolute;
	top: 0;
	left: 0
}

.packet-cont {
	width: 133px;
	height: 176px;
	background: url(../images/egg.png) no-repeat;
	background-size: 100%;
	position: absolute;
	top: 46px;
	left: 16px;
}

.packet-cont .txt {
	display: none
}

.packet-cont .price {
	display: none
}

.packet-cont .price b {
	display: none
}

.packet-cont .des {
	display: none
}

.red-packet-shadow {
	width: 275px;
	height: 14px;
	background: url(../images/shadow.png) no-repeat;
	background-size: 100%;
	position: fixed;
	bottom: 10%;
	right: 5px;
	right: -51px;
	display: none;
}

.red-packet.sys-mobile {
	transform: scale(.3);
	right: -18%;
	bottom: -5%
}

.red-packet-shadow.sys-mobile {
	display: none
}

.red-packet.sys-mobile .price,
.red-packet.sys-mobile .des {
	display: none
}

.red-packet.active,
.red-packet-shadow.active {
	display: block;
}

.red-packet-shadow.sys-mobile.active {
	display: none
}

/*activity  modal-send-vip*/
.moadl-activity .modal-content {
	background-image: url(../images/activity-send-vip-bg.png);
	background-size: 100%
}

.moadl-activity .modal-title {
	font-size: 26px;
	padding: 20px 0 0 0;
}

.modal-send-vip .modal-body {
	padding: 14px 0
}

.modal-send-vip .modal-content .tag {
	width: 68%;
	padding-top: 15.3%;
	background-image: url(../images/activity-icon-free.png);
	background-size: 100%;
	margin: 0 auto;
	background-repeat: no-repeat;
}

.modal-send-vip .modal-content .limit {
	font-size: 21px;
	line-height: 1;
	margin: 5px 0 35px;
}

.modal-send-vip .modal-content .time {
	margin-bottom: 10px;
	font-size: 16px;
	line-height: 1
}

.modal-send-vip .modal-content .des {
	font-size: 16px;
	line-height: 1.5
}

.modal-send-vip .modal-content .des b {
	margin: 0 5px;
	font-size: 21px;
	line-height: 1
}

/*.modal-send-vip .modal-content .button:not(.button-justify):not(.button-compact){width: 228px;}*/
.modal-send-vip .modal-content .num {
	font-size: 16px
}

.modal-send-vip .modal-content .num i {
	background-image: url(../images/activity-num-bg.png);
	background-size: 100%;
	background-repeat: no-repeat;
	width: 12px;
	height: 21px;
	font-size: 21px;
	text-align: center;
	color: #ff544a;
	font-style: normal;
	margin: 0 3px;
	background-position: center;
	padding: 5px 4px;
}

.modal-send-vip .modal-content .num i:first-child {
	margin-left: 11px
}

.modal-send-vip .modal-content .num i:last-child {
	margin-right: 11px
}

/*activity  modal-get-vip*/
.modal-get-vip .card {
	background-color: #fff;
	box-shadow: 0 0 9px 0 rgba(0, 0, 0, 0.07);
	padding: 7px;
	margin-top: 38px;
	position: relative;
	font-size: 20px;
}

.pack-tag {
	position: absolute;
	font-size: 12px;
	font-weight: bold;
	width: 50px;
	height: 25px !important;
	line-height: 25px;
	text-align: center;
	top: -8px;
	right: 16px;
	text-transform: uppercase;
}

.pack-tag:after {
	content: "";
	position: absolute;
	border-bottom: 8px solid #ff544a;
	border-right: 8px solid transparent;
	top: 0;
	right: -8px;
}

.pack-tag-free {
	background-color: #ff544a;
	color: #fff;
}

.modal-get-vip .pack-tag {
	background-color: #6ce2d9;
	color: #fff;
	width: auto;
	font-size: 14px;
	font-weight: normal;
	padding: 6px 12px;
	height: auto !important;
	right: calc(50% - 110px);
	top: -15px;
}

.modal-get-vip .pack-tag:after {
	border-bottom: 15px solid #6ce2d9;
	border-right: 15px solid transparent;
	top: 0;
	right: -15px;
}

.modal-get-vip .modal-content .button:not(.button-justify):not(.button-compact) {
	width: 228px;
}

.modal-get-vip .card ul {
	padding-top: 37px;
}

.modal-get-vip .card ul li:after {
	background: url("../images/store/privilege-ico.png") no-repeat;
	content: '';
	position: absolute;
	top: 0;
}

.modal-get-vip .card ul li {
	font-size: 14px;
	color: #6ce2d9;
	display: inline-block;
	width: 93px;
	padding-top: 40px;
	vertical-align: top;
	line-height: 1.25;
	position: relative;
}

.modal-get-vip .card ul li:nth-child(1):after {
	height: 24px;
	width: 24px;
	background-position: -147px 0;
	left: calc(50% - 12px);
}

.modal-get-vip .card ul li:nth-child(2):after {
	height: 25px;
	width: 25px;
	background-position: -68px 0;
	left: calc(50% - 12px);
}

.modal-get-vip .card ul li:nth-child(3):after {
	height: 25px;
	width: 35px;
	background-position: -93px 0;
	left: calc(50% - 17px);
}

.modal-get-vip .card ul li:nth-child(4):after {
	height: 26px;
	width: 33px;
	background-position: 0 0;
	left: calc(50% - 16px);
}

.modal-get-vip .card ul li:nth-child(5):after {
	height: 24px;
	width: 19px;
	background-position: -128px 0;
	left: calc(50% - 10px);
}

.modal-get-vip .card ul li:nth-child(6):after {
	height: 26px;
	width: 35px;
	background-position: -33px 0;
	left: calc(50% - 17px);
}

.modal-get-vip .card ul li:nth-child(7):after {
	height: 24px;
	width: 24px;
	background-position: -171px 0;
	left: calc(50% - 15px);
}

@media(max-width: 640px) {
	.modal-get-vip .card ul li {
		width: 30%
	}

	.modal-get-vip .card ul li span {
		background: #FFF;
		box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.13);
		display: none;
		height: auto;
		width: 80px;
		position: absolute;
		padding: 5px;
		bottom: 37px;
		color: #949494;
		z-index: 5;
		font-size: 12px;
	}

	.modal-get-vip .card ul li:hover span {
		display: block;
	}

	.modal-get-vip .card ul {
		padding-top: 21px;
	}

	.modal-get-vip .modal-title {
		font-size: 20px
	}
}

.modal-get-vip .sys-mobile {
	display: none
}

.modal-get-vip.sys-mobile .sys-win {
	display: none
}

.modal-get-vip.sys-mobile .sys-mobile {
	display: block;
}

.modal-get-vip.sys-mobile .card {
	margin-top: 10px
}

.modal-get-vip.sys-mobile .card .bg-3x1 {
	padding-bottom: 50%
}

.modal-get-vip.sys-mobile .pack-tag {
	padding: 2px 5px;
	right: 17px;
}

.sys-mobile .modal-content .button:not(.button-justify):not(.button-compact) {
	width: auto;
}

.modal-send-vip.sys-mobile .modal-content .num i:first-child {
	margin-left: 5px;
}

.modal-send-vip.sys-mobile .modal-content .num i:last-child {
	margin-right: 5px;
}

.red-packet {
	animation: tada 3s both infinite;
	transform-origin: 50% 100%
}

.red-packet.sys-mobile {
	animation: tadamobile 3s both infinite;
	transform-origin: 50% 50%;
}

.red-packet.paused {
	animation-play-state: paused;
}

.red-packet.running {
	animation-play-state: running;
}

.idol-cut {
	position: fixed;
	right: 0px;
	bottom: 300px;
	width: 80px;
	height: 110px;
	border: 1px solid #e6452c;
	animation: tada 2s both infinite;
	transform-origin: 50% 100%;
	z-index: 30;
	border-radius: 5px
}

.idol-cut a {
	width: 100%;
	height: 100%;
	display: block;
	background: url("../images/idol-cut.png") no-repeat center center;
	background-size: 100% 100%;
}

.idol-cut-top {
	width: 49px;
	height: 59px
}


.icon-hot {
	background: url(../images/icon-hot.png) no-repeat;
	width: 14px !important;
	height: 20px !important;
	display: inline-block;
	margin: 0 5px 0 0;
	vertical-align: middle;
}

@keyframes tada {

	0%,
	60% {
		transform: scale(.8)
	}

	64%,
	68% {
		transform: scale(.8) rotate(-5deg)
	}

	72%,
	80%,
	88%,
	96% {
		transform: scale(.85) rotate(5deg)
	}

	76%,
	84%,
	92% {
		transform: scale(.85) rotate(-5deg)
	}

	100% {
		transform: scale(.8) rotate(0)
	}
}

@keyframes tadamobile {

	0%,
	60% {
		transform: scale(.3)
	}

	64%,
	68% {
		transform: scale(.3) rotate(-5deg)
	}

	72%,
	80%,
	88%,
	96% {
		transform: scale(.31) rotate(5deg)
	}

	76%,
	84%,
	92% {
		transform: scale(.31) rotate(-5deg)
	}

	100% {
		transform: scale(.3) rotate(0)
	}
}

.download-tips {
	display: none;
}

/* download tips*/
@media screen and (max-width: 1024px) {
	.download-tips {
		position: fixed;
		bottom: 0;
		left: 0;
		display: block;
		align-content: center;
		align-items: center;
		width: 100%;
		padding: 12px 15px;
		background-color: #fff;
		z-index: 10;
		box-shadow: 0 -.2rem 2rem 0 rgba(0, 0, 0, 0.06);
		will-change: opacity;
		opacity: 0;
		pointer-events: none;
		overflow: hidden;
	}

	.download-tips.actived {
		opacity: 1;
		pointer-events: auto;
	}

	.filmora-icon {
		display: inline-block;
		vertical-align: middle;
		width: 3rem;
		height: 3rem;
		background-image: url("./logo/fm9-logo.png");
		/* background-image: image-set( "./logo/filmora.png" 1x, "./logo/filmora@2x.png" 2x, "./logo/filmora@3x.png" 400dpi ); */
		background-size: 100% 100%;
	}

	.filmora-txt {
		flex: 1;
		padding: 0 5px;
		display: inline-block;
		vertical-align: middle;
		text-align: left;
	}

	.filmora-txt span {
		display: block;
		margin: 0 0 1.4vw;
		font-size: 2.9vw;
		line-height: 1;
	}

	.download-tips .ratings {
		display: block;
		font-size: 0;
	}

	.download-tips .ratings .fm {
		line-height: 1;
		font-size: .75rem;
	}

	.download-btn {
		display: inline-block;
		padding: .4rem 1.8rem;
		font-size: 1.25rem;
		font-weight: bold;
		color: #303e47;
		background-color: #61ded0;
		float: right;
	}

	.download-btn:hover,
	.download-btn:focus {
		color: #303e47;
	}
}
.row-inner {
  width: 1200px;
  margin: 0 auto;

}
.row-inner .inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight:bold;

}
.clear {
    clear: both;
}
.row-inner .num {
	font-size:40px;
}
.row-inner .small {
	font-size: 18px;
	font-weight: 400;
	text-align:center;
}
ul.nav-list {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    text-align: center;
    -webkit-box-flex: 1;
    -ms-box-flex: 1;
     -moz-box-flex: 1;
    height: 72px;
    line-height: 72px;
    -webkit-box-pack: end;
}

li.nav-item {
    padding: 0 20px;
    height: 100%;
    font-size: 14px;
    cursor: pointer;
}

li.nav-item-select,li.nav-item:hover {
    border-bottom: 6px solid #5281ea;
}

.bread-crumb-nav.fn-clear {
    margin: 20px 0;
    border-bottom: 2px solid #dadada
}

ul.bread-crumbs {
    display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
    position: relative;
    bottom: 0;
}

.bread-crumb-nav li {
    margin-right: 20px;
    font-size: 16px;
    padding: 10px 0;
}
.bread-crumb-nav li a {
    
}
.bread-crumb-nav li a:hover {
    text-decoration: none;
}
.bread-crumb-nav li.now {
    
position: relative;
    
overflow: hidden;
    
text-overflow: ellipsis;
    
/*-webkit-text-overflow:ellipsis;*/
    
white-space: nowrap;
    
max-width: 300px;
}
.bread-crumb-nav .now:before {
    display: block;
    content:"";
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    border-bottom: 2px solid #0083bf;
}
.bread-crumb-nav .home {

}
.mac_pages {
   display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;

    flex-direction: row-reverse;
}

.page_tip {
    padding-left: 30px;
    line-height: 46px;
}

.page_info {
    border: 1px solid #dfdfdf;
    display: flex;
    border-radius: 10px;
    overflow: hidden;
}

.page_info a {
    display: block;
    -webkit-box-flex: 1;
    padding: 5px;
    min-width: 46px;
    text-align: center;
    border-right: 1px solid #dfdfdf;
    transition: background 1s;
}
.page_info a:hover {
    background: #00a0e9;
    color: #fff;

}
input#page {
    width: 80px;
    display: block;
    text-align: center;
}

button.page_btn.mac_page_go {
    width: 52px;
    background: #00a0e9;
    color: #fff;
}
.page_current {
    background: #00a0e9;
    color: #fff;
}