@charset "utf-8";

.details{max-width:900px; width:auto; padding:0 10px;}
img{max-width:100%; height:auto;}

.vpeapp-down-a-wrap{display:inline-flex; justify-content:center; position:relative; margin-top:23px; z-index:1;}
.vpeapp-down-a-x{display:flex; margin:-8px -8px -8px 8px; flex-flow:wrap; flex:none;}
.vpeapp-down-a{color:#fff; font-size:35px; text-decoration:none; background-color:#2f356c; display:flex; align-items:center; border-radius:.3em; padding:.2em .6em; line-height:1; text-align:left; transition:transform .4s; margin:8px;}
.vpeapp-down-a:hover{transform:scale(1.05);}
.vpeapp-down-a > img{margin-right:.2em;}
.vpeapp-down-a-span{display:block; font-size:48%; color:#d4d4d4;}
.vpeapp-qrcode-icon{background-color:#2f356c; border:0 none; padding:17px; border-radius:10px;}
.vpeapp-qrcode-icon:hover ~ .vpeapp-qrcode-wrap, .vpeapp-qrcode-icon:focus ~ .vpeapp-qrcode-wrap{visibility:visible;}
.vpeapp-qrcode-wrap{position:absolute; background-color:#fff; left:0; right:0; display:flex; justify-content:center; top:100%; padding:20px 10px; border-radius:10px; margin-top:12px; visibility:hidden;}
.vpeapp-qrcode-wrap::after{content:''; position:absolute; bottom:100%; border-width:0 7px 10px; border-style:solid; border-color:transparent transparent #fff; left:30px;}
.vpeapp-qrcode-wrap > div{margin:0 8%;}
.vpeapp-qrcode-title{font-size:23px; display:flex; align-items:center; justify-content:center; margin-top:10px;}
.vpeapp-qrcode-title > img{margin-right:8px;}

.vpeapp-switch-btn{border-radius:50%; border:0 none; background-color:#1f414d; width:30px; height:30px; text-align:center; cursor:pointer;}
.vpeapp-switch-btn:first-of-type::after, .vpeapp-switch-btn:last-of-type::after{content:''; width:30%; height:30%; border:2px solid #fff; display:inline-block; box-sizing:border-box; border-top:0 none; border-right:0 none; border-radius:1px;}
.vpeapp-switch-btn:first-of-type::after{transform:rotate(45deg); margin-left:3px;}
.vpeapp-switch-btn:last-of-type::after{transform:rotate(-135deg); margin-right:3px;}
.vpeapp-switch-btn:disabled{cursor:initial; filter:grayscale(1);}
.vpeapp-switch-btn:disabled::after{border-color:#999;}

.vpeapp-main-title{font-size:60px; color:#fff; line-height:1; margin-top:35px; position:relative; display:inline-block;}
.vpeapp-main-title::after{content:attr(free-text); position:absolute; font-size:36%; background:linear-gradient(90deg, #008f18, #65b300) no-repeat; padding:4px 17px; border-radius:20px 0; right:0; bottom:100%; margin:0 -30px -6px 0;}

.df-hide{transform:translateY(50px);opacity:0;transition:transform .6s, opacity .6s linear;}
.show .df-hide, .show.df-hide{transform:translateY(0); opacity:1;}
.show .df-hide.vpeapp-main-title{transition-delay:.2s;}
.show .df-hide.vpeapp-down-a-wrap{transition-delay:.6s;}

.vpeapp-header{background-color:#2C2C2C; position:fixed; left:0; right:0; top:0; padding:8px 0; display:none; z-index:2;}
.vpeapp-header .details{max-width:1200px;}
.vpeapp-header-wrap{display:flex; justify-content:space-between;}
.vpeapp-header-logo{font-size:21px; color:#fff; display:flex; align-items:center;}
.vpeapp-header-logo::before{content:''; width:42px; height:36px; background:url(../video-editing-software/images/editor-mobile-app/logo.png) no-repeat; margin-right:10px; flex:none;}
.vpeapp-header-wrap .vpeapp-down-a-wrap{margin-top:0; transform:initial; opacity:1;}
.vpeapp-header .vpeapp-down-a-x{margin:0;}
.vpeapp-header-wrap .vpeapp-down-a{background-color:#222; border:1px solid #585858; font-size:18px;}
.vpeapp-header-wrap .vpeapp-down-a-span{font-size:52%;}
.vpeapp-header-wrap .vpeapp-down-a{margin:0 0 0 15px;}

.vpeapp-nr{background:url(../video-editing-software/images/editor-mobile-app/bg1.jpg) no-repeat 0 / 100% 100%, linear-gradient(#000, #041D71) no-repeat; text-align:center; padding:50px 0;}
.vpeapp-nr-subtitle{font-size:28px; color:#d4d4d4;}
.vpeapp-nr-subtitle-probe{color:inherit; font-size:80%;}
.vpeapp-nr-desc{font-size:27px; color:#d4d4d4; line-height:1.75; margin:22px 0; transition-delay:.4s;}

.vpeapp-clip{background:url(../video-editing-software/images/editor-mobile-app/bg2.jpg) no-repeat 0 / 100% 100%, linear-gradient(#041D71, #08331F, #000) no-repeat; padding:40px 0;}
.vpeapp-clip-title{font-size:40px; color:#fff; line-height:1; font-weight:700; text-align:center; transition-delay:.8s;}
.vpeapp-clip-wrap{display:flex; align-items:center; justify-content:space-between; margin-top:80px; transition-delay:1s;}
.vpeapp-clip-wrap > *{margin:0 10px;}
.vpeapp-clip-imgs{position:relative; width:530px;}
.vpeapp-clip-imgs::before{content:''; display:block; padding-top:91.7%;}
.vpeapp-clip-img{transition:right .4s, left .4s, transform .4s; position:absolute; top:0;}
.vpeapp-clip-img:not(.show){cursor:pointer;}
.vpeapp-clip-img.show{left:53.39%; right:0; z-index:2;}
.vpeapp-clip-img.middle{left:22.9%; right:30.35%; transform:scale(.9); z-index:1;}
.vpeapp-clip-img.left{left:0; right:53.39%; transform:translate(-10%) scale(.8);}
.vpeapp-clip-info{width:310px;}
.vpeapp-clip-info-item{display:none;}
.vpeapp-clip-info-item.show{display:block;}
.vpeapp-clip-subtitle{font-size:35px; color:#fff; line-height:1; margin:28px 0 35px;}
.vpeapp-clip-item-title{font-size:25px; color:#fff; line-height:1; padding:15px 0; cursor:pointer;}
dl.active .vpeapp-clip-item-title{color:#ff9329; cursor:initial;}
.vpeapp-clip-item-desc{font-size:19px; color:#a4a4a4; line-height:1.4; display:none; padding-bottom:15px;}

.vpeapp-tools{background-color:#08080F; padding:50px 0;}
.vpeapp-tools-title{font-size:35px; color:#fff; line-height:1; font-weight:700; text-align:center; margin-bottom:50px;}
.vpeapp-tools-item{display:flex; justify-content:space-between; align-items:center;}
.vpeapp-tools-item > div{margin:0 5px;}
.vpeapp-tools-info{width:325px;}
.vpeapp-tools-item-subtitle{font-size:25px; color:#ff9329; line-height:1;}
.vpeapp-tools-item-title{font-size:35px; color:#fff; line-height:1; margin:26px 0;}
.vpeapp-tools-item-desc{font-size:19px; color:#a4a4a4; line-height:1.7;}

.vpeapp-filter{background-color:#08080F; padding:50px 0; overflow:hidden;}
.vpeapp-filter-title{font-size:35px; color:#fff; line-height:1; margin-bottom:25px;}
.vpeapp-filter-desc{font-size:19px; color:#a4a4a4; line-height:1.7; margin:25px 0;}
.vpeapp-filter-img-wrap{display:flex; margin:40px 0 25px;}
.vpeapp-filter-img-x{flex:none; overflow:hidden;}
.vpeapp-filter-imgs{display:flex; cursor:grab; margin-left:-20px; transition:transform .4s;}
.vpeapp-filter-imgs:active{cursor:grabbing;}
.vpeapp-filter-img{margin-left:20px;}

.vpeapp-func{background:linear-gradient(#08080F, #0F0F1C) no-repeat; padding:50px 0;}
.vpeapp-func-title{font-size:35px; color:#fff; font-weight:700; line-height:1; text-align:center;}
.vpeapp-func-wrap{display:flex; justify-content:center; margin-top:40px;}
.vpeapp-func-items{width:420px;}
.vpeapp-func-item{background-color:#101010; border:2px solid #1e1e1e; border-radius:12px; margin:8% 4% 0;}
.vpeapp-func-item-img{text-align:center;}
.vpeapp-func-item-x{padding:22px 8%;}
.vpeapp-func-item-title{font-size:30px; color:#fff; line-height:1; margin-bottom:15px;}
.vpeapp-func-item-desc{font-size:21px; color:#a4a4a4; line-height:1.6;}

.vpeapp-down{background-color:#0F0F1C; padding:10px 0 80px; text-align:center;}
.vpeapp-down .vpeapp-down-a-wrap{margin-top:40px;}
.vpeapp-down .vpeapp-qrcode-icon{background-color:rgba(255 255 255 / .15);}
.vpeapp-down .vpeapp-down-a{background-color:rgba(255 255 255 / .15);}

.vpeapp-faq{background-color:#fff; padding:50px 0 70px;}
.vpeapp-faq-title{font-size:40px; line-height:1; text-align:center; margin-bottom:40px;}
.vpeapp-faq-item{background-color:#F3F3F3; border-radius:6px; padding:20px; margin-top:8px; cursor:pointer;}
.vpeapp-faq-subtitle{font-size:21px; line-height:1; position:relative; padding-right:30px;}
.vpeapp-faq-subtitle::after{content:''; position:absolute; right:10px; width:10px; height:10px; border:2px solid; border-top:0 none; border-left:0 none; transform:rotate(45deg); transition:transform .2s; transform-origin:75% 75%; top:50%; margin-top:-8px;}
.active > .vpeapp-faq-subtitle::after{transform:rotate(225deg);}
.vpeapp-faq-desc{font-size:17px; display:none; margin-top:15px;}

@media (max-width: 767px) {

	.vpeapp-header-wrap .vpeapp-down-a + .vpeapp-down-a{margin-top:5px;}

	.vpeapp-main-title::after{margin-right:0;}

	.vpeapp-down-a-x{flex-flow:column;}
	.vpeapp-qrcode-wrap > div{margin:0 10px;}

	.vpeapp-clip-wrap{flex-flow:wrap; justify-content:center;}
	.vpeapp-clip-info{width:auto;}
	.vpeapp-clip-wrap > *{margin:0;}

	.vpeapp-tools-item{flex-flow:wrap; justify-content:center;}
	.vpeapp-tools-info:first-of-type{order:1;}
	.vpeapp-tools-info.vpeapp-tools-info{width:auto; margin:30px 0;}
	.vpeapp-tools-item:last-of-type > .vpeapp-tools-info{margin-bottom:0;}
	
	.vpeapp-func-item-x{padding:10px;}

}

@media (max-width: 479px) {

	.vpeapp-header-logo{font-size:17px; flex-flow:column; justify-content:center;}
	.vpeapp-header-wrap .vpeapp-down-a{margin-left:0;}

	.vpeapp-down-a{font-size:25px;}

	.vpeapp-func-wrap{flex-flow:wrap;}
	.vpeapp-func-item{margin:6% 0 0;}
	
	.vpeapp-filter-img > img{width:180px;}
	.vpeapp-filter-imgs{margin-left:-10px;}
	.vpeapp-filter-img{margin-left:10px;}

}

.ytb-watch {
	text-align: center;
	position: absolute;
	top: -60px;
	left: 50%;
	transform: translateX(-50%);
}
.ytb-watch a {
	color: #fff;
	font-size: 17px;
	line-height: 1.4;
	text-decoration: none;
}
.ytb-watch a:hover {
	color: #ff0000;
}

.ytb-popu {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: rgba(0, 0, 0, .8);
	z-index: 9999;
	z-index: 99;
	display: none;
}
.ytb-popu-container {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
}
.ytb-popu-box {
	max-width: 1280px;
	position: relative;
	color: #fff;
}
#ytb-popu-close {
	position: absolute;
	right: 0;
	top: -30px;
	font-size: 27px;
	line-height: 25px;
	display: block;
	cursor: pointer;
}
@media (max-width: 1200px) {
	.ytb-popu-box iframe {
		max-width: 1280px;
		width: 90vw !important;
		height: 50vw !important;
	}
}