/**
 * 
 * 淇敼鐢佃剳绔樉绀虹殑瀹介珮 320*486 =銆� 480*729
 * 
 */

#support {
	color: #fff;
	position: fixed;
	bottom: 5px;
	right: 5px
}

#support a img {
	border: 0
}

.phone_panel {
	/* left: 35%;
	margin-left: -130px;
	position: absolute;
	height: 641px;
	top: 50%;
	margin-top: -320px */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	height: 526px;
	background-color: white;
}

.phoneBox {

	width: 322px;
	/* height: 641px; */
	height: 486px;
	float: left;
	margin: 20px auto;
}

.phoneBox .top {
	height: 48px;
	width: 100%;
	background-size: 100% 100%;
	background-image: url(/assets/images/yulan_phone_top.png);
	background-repeat: no-repeat
}

.phoneBox .bottom {
	height: 45px;
	width: 100%;
	background-size: 100% 100%;
	background-image: url(/assets/images/yulan_phone_bottom.png);
	background-repeat: no-repeat;
	text-align: center
}

.phoneBox .bottom a {
	width: 120px;
	height: 40px;
	background: url(/assets/images/btn1_bg.png) no-repeat;
	display: inline-block;
	margin-top: 2px;
	color: #ccc;
	font-size: 14px;
	line-height: 40px;
	font-weight: 700
}

.phoneBox .nr {
	background-color: #fff;
	position: relative;
	cursor: pointer;
	height: 486px;
	overflow-x: hidden;
	overflow-y: hidden;
	-webkit-user-select: none;
}

.ui-page {
	position: relative!important;
	min-height: 0!important
}

.anchorBL {
	display: none!important
}

article {
	height: 100%!important
}

.zoomIn-change {
	animation: zoomIn .5s ease 0s 1 both;
	-webkit-animation: zoomIn .5s ease 0s 1 both;
	transform-origin: 100% 0
}

@-webkit-keyframes zoomIn {
	0% {
		opacity: 0;
		-webkit-transform: scale3d(.3,.3,.3);
		transform: scale3d(.3,.3,.3)
	}

	50% {
		opacity: 1
	}
}

@keyframes zoomIn {
	0% {
		opacity: 0;
		-webkit-transform: scale3d(.3,.3,.3);
		transform: scale3d(.3,.3,.3)
	}

	50% {
		opacity: 1
	}
}

#code #downAppView {
	background-color: #fff;
	padding: 10px;
	width: 260px;
	text-align: center;
	position: absolute;
	color: #000;
	right: 0;
	margin-top: 25px;
	display: none
}

#downAppView h3 {
	text-align: left;
	padding-bottom: 20px;
	font-size: 14px
}

#downAppView h3 #close {
	float: right
}

#downApp {
	float: right;
	background-color: #08a1ef;
	padding: 3px 5px;
	border-radius: 4px;
	cursor: pointer
}

#downApp:hover {
	color: #fff;
	background-color: #56c6ff
}

#code {
	/* position: fixed;
	right: 30%;
	top: 50%;
	margin-right: -120px;
	margin-top: -243px */
	position: fixed;
	left: 100%;
	top: 50%;
	transform: translate(0,-50%) scale(0.5);
}

#code #view_reg {
	font-size: 13px;
	border: 1px solid #fff;
	border-radius: 5px;
	height: 42px;
	line-height: 42px;
	text-align: center
}

#view_reg span {
	padding-left: 5px
}

#view_reg span a {
	border-bottom: 1px solid #08a1ef
}

#code #down {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	width: 450px;
	height: 600px
}

body {
	background-color: transparent;
	overflow: hidden;
	background-size: cover;
	background-position: 50% 50%
}

body * {
	user-select: none;
	-webkit-user-select: none
}

#code div {
	color: #000;
	font-size: 13px;
	margin: 10px 0
}

#code #codeImg {
	display: block
}

.phone_menubar {
	background: url(/assets/images/phonetitle1.gif);
	height: 20px
}

.hypefolio.phone_menubar {
	background: url(/assets/images/phonetitle.gif)
}

.scene_title_baner {
	display: block!important;
	height: 40px;
	line-height: 40px;
	background: #000;
	color: #fff;
	text-align: center;
	border-left: 1px solid #F6F6F6;
	border-right: 1px solid #F6F6F6
}

.scene_title_baner .scene_title {
	min-width: 20px;
	font-size: 24px;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap
}

a {
	text-decoration: none
}

a:link {
	color: #08a1ef;
	text-decoration: none
}

a:visited {
	color: #08a1ef;
	text-decoration: none
}

a:hover {
	color: #08a1ef;
	text-decoration: none
}

a:active {
	color: #08a1ef;
	text-decoration: none
}

.left-bar {
	position: fixed;
	top: 0;
	bottom: 0;
	right: 0;
	width: 320px;
	background-color: #fff;
	box-shadow: -1px 0 3px;
	font-size: 12px;
	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	transition: all .4s ease;
}
.left-bar .use-tpl{height: 120px;
	background-color: #f0f3f4;
	color: #7b8793;
	position: fixed;
	bottom: 0;
}
.left-bar .use-tpl button{
    width: 280px
}
.left-bar .use-tpl span {
	line-height: 60px
}
.left-bar .share-title {
	line-height: 50px;
	padding-left: 20px;
	height: 50px
}

.left-bar h6 {
	font-size: 12px
}

.left-bar .scene-img {
	margin: 0 20px;
	text-align: center;
	padding: 10px;
	height: 180px;
	width: 180px;
	border: 1px solid #ccd5db;
	}

.left-bar .extend-bar {
	position: absolute;
	left: -29px;
	width: 30px;
	height: 60px;
	background-color: #fff;
	top: 40%;
	box-shadow: -1px 0 1px;
	border-radius: 3px;
	line-height: 60px;
	text-align: center;
	cursor: pointer
}

.left-bar .quick-share {
	margin-top: 20px;
	padding-left: 20px;
	padding-top: 20px;
	height: 100px;
	border-top: 1px solid #ccd5db;
	border-bottom: 1px solid #ccd5db;
	overflow: hidden;
	

}
.left-bar .quick-share h6{line-height: 50px;
	height: 50px
}
.left-bar .quick-share a {
	width: 32px;
	height: 32px;
	display: inherit;
	float: left;
	margin-left: 10px
}

.left-bar .option-btn .btn {
	font-size: 12px
}

.left-bar .create-link {
	position: fixed;
	bottom: 140px;
}
.left-bar .create-link a{text-decoration: underline;
	font-size: 12px;
	color: #08a1ef
}

.left-bar .create-link {
	bottom: 20px
}

.left-bar .create-link a {
	padding-left: 20px
}

.hide-panel {
	width: 0
}

.extend-panel {
	right: 0
}

.ctrl_panel_dir {
	position: fixed;
	width: 110px;
	height: 110px;
	z-index: 30;
	right: 320px;
	bottom: 3%;
	-webkit-user-select: none
}

.ctrl_panel_dir div {
	position: absolute;
	opacity: .2;
	width: 0;
	height: 0;
	border: 12px solid transparent;
	-webkit-transform: scale(0.9999);
	-ms-transform: scale(0.9999);
	transform: scale(0.9999);
	-webkit-transition: all .2s ease;
	transition: all .2s ease;
	-webkit-tap-highlight-color: rgba(0,0,0,0)
}

.ctrl_panel_dir .ctrl-left {
	top: 42px;
	border-right-width: 22px
}

.ctrl_panel_dir .ctrl-right {
	left: 74px;
	top: 42px;
	border-left-width: 22px
}

.ctrl_panel_dir .ctrl-up {
	left: 42px;
	border-bottom-width: 22px
}

.ctrl_panel_dir .ctrl-down {
	left: 42px;
	top: 74px;
	border-top-width: 22px
}

.ctrl_panel_dir div.ctrl-left,.ctrl_panel_dir div.ctrl-left.enabled {
	border-right-color: #e08c14
}

.ctrl_panel_dir div.ctrl-right,.ctrl_panel_dir div.ctrl-right.enabled {
	border-left-color: #e08c14
}

.ctrl_panel_dir div.ctrl-up,.ctrl_panel_dir div.ctrl-up.enabled {
	border-bottom-color: #e08c14
}

.ctrl_panel_dir div.ctrl-down,.ctrl_panel_dir div.ctrl-down.enabled {
	border-top-color: #e08c14
}

.ctrl_panel_dir .enabled {
	opacity: .8;
	cursor: pointer
}

/* 

#support{color:#fff;position:fixed;bottom:5px;right:5px}#support a img{border:0}.phone_panel{left:35%;margin-left:-130px;position:absolute;height:641px;top:50%;margin-top:-320px}.phoneBox{width:322px;height:641px;float:Left}.phoneBox .top{height:48px;width:100%;background-size:100% 100%;background-image:url(/assets/images/yulan_phone_top.png);background-repeat:no-repeat}.phoneBox .bottom{height:45px;width:100%;background-size:100% 100%;background-image:url(/assets/images/yulan_phone_bottom.png);background-repeat:no-repeat;text-align:center}.phoneBox .bottom a{width:120px;height:40px;background:url(/assets/images/btn1_bg.png) no-repeat;display:inline-block;margin-top:2px;color:#ccc;font-size:14px;line-height:40px;font-weight:700}.phoneBox .nr{background-color:#000;position:relative;cursor:pointer;height:486px;overflow-x:hidden;overflow-y:hidden;-webkit-user-select:none}.ui-page{position:relative!important;min-height:0!important}.anchorBL{display:none!important}article{height:100%!important}.zoomIn-change{animation:zoomIn .5s ease 0s 1 both;-webkit-animation:zoomIn .5s ease 0s 1 both;transform-origin:100% 0}@-webkit-keyframes zoomIn{0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes zoomIn{0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}#code #downAppView{background-color:#fff;padding:10px;width:260px;text-align:center;position:absolute;color:#000;right:0;margin-top:25px;display:none}#downAppView h3{text-align:left;padding-bottom:20px;font-size:14px}#downAppView h3 #close{float:right}#downApp{float:right;background-color:#08a1ef;padding:3px 5px;border-radius:4px;cursor:pointer}#downApp:hover{color:#fff;background-color:#56c6ff}#code{position:fixed;right:30%;top:50%;margin-right:-120px;margin-top:-243px}#code #view_reg{font-size:15px;border:1px solid #fff;border-radius:5px;height:42px;line-height:42px;text-align:center}#view_reg span{padding-left:5px}#view_reg span a{border-bottom:1px solid #08a1ef}#code #down{position:absolute;top:0;left:0;bottom:0;right:0;width:450px;height:600px}body{background-color:transparent;overflow:hidden;background-size:cover;background-position:50% 50%}body *{user-select:none;-webkit-user-select:none}#code div{color:#fff;font-size:13px;margin:10px 0}#code #codeImg{display:block}.phone_menubar{background:url(/assets/images/phonetitle1.gif);height:20px}.hypefolio.phone_menubar{background:url(/assets/images/phonetitle.gif)}.scene_title_baner{display:block!important;height:40px;line-height:40px;background:#000;color:#fff;text-align:center;border-left:1px solid #F6F6F6;border-right:1px solid #F6F6F6}.scene_title_baner .scene_title{min-width:20px;font-size:24px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}a{text-decoration:none}a:link{color:#08a1ef;text-decoration:none}a:visited{color:#08a1ef;text-decoration:none}a:hover{color:#08a1ef;text-decoration:none}a:active{color:#08a1ef;text-decoration:none}.left-bar{position:fixed;top:0;bottom:0;right:0;width:320px;// background-color:#f0f3f4;background-color:#fff;box-shadow:-1px 0 3px;font-size:12px;-webkit-transition:all .4s ease;-moz-transition:all .4s ease;transition:all .4s ease;.use-tpl{height:120px;background-color:#f0f3f4;color:#7b8793;position:fixed;bottom:0;button{width:280px}span{line-height:60px}}}.left-bar .share-title{line-height:50px;padding-left:20px;height:50px}.left-bar h6{font-size:12px}.left-bar .scene-img{margin:0 20px;text-align:center;// background-color:#fff;padding:10px;height:180px;width:180px;border:1px solid #ccd5db;// canvas{height:140px}}.left-bar .extend-bar{position:absolute;left:-29px;width:30px;height:60px;background-color:#fff;top:40%;box-shadow:-1px 0 1px;border-radius:3px;line-height:60px;text-align:center;cursor:pointer}.left-bar .quick-share{margin-top:20px;padding-left:20px;padding-top:20px;height:100px;border-top:1px solid #ccd5db;border-bottom:1px solid #ccd5db;overflow:hidden;h6{line-height:50px;height:50px}a{width:32px;height:32px;display:inherit;float:left;margin-left:10px}}.left-bar .option-btn .btn{font-size:12px}.left-bar .create-link{position:fixed;bottom:140px;a{text-decoration:underline;font-size:12px;color:#08a1ef}}.left-bar .create-link{bottom:20px}.left-bar .create-link a{padding-left:20px}.hide-panel{width:0}.extend-panel{right:0}.ctrl_panel_dir{position:fixed;width:110px;height:110px;z-index:30;right:320px;bottom:3%;-webkit-user-select:none}.ctrl_panel_dir div{position:absolute;opacity:.2;width:0;height:0;border:12px solid transparent;-webkit-transform:scale(0.9999);-ms-transform:scale(0.9999);transform:scale(0.9999);-webkit-transition:all .2s ease;transition:all .2s ease;-webkit-tap-highlight-color:rgba(0,0,0,0)}.ctrl_panel_dir .ctrl-left{top:42px;border-right-width:22px}.ctrl_panel_dir .ctrl-right{left:74px;top:42px;border-left-width:22px}.ctrl_panel_dir .ctrl-up{left:42px;border-bottom-width:22px}.ctrl_panel_dir .ctrl-down{left:42px;top:74px;border-top-width:22px}.ctrl_panel_dir div.ctrl-left,.ctrl_panel_dir div.ctrl-left.enabled{border-right-color:#e08c14}.ctrl_panel_dir div.ctrl-right,.ctrl_panel_dir div.ctrl-right.enabled{border-left-color:#e08c14}.ctrl_panel_dir div.ctrl-up,.ctrl_panel_dir div.ctrl-up.enabled{border-bottom-color:#e08c14}.ctrl_panel_dir div.ctrl-down,.ctrl_panel_dir div.ctrl-down.enabled{border-top-color:#e08c14}.ctrl_panel_dir .enabled{opacity:.8;cursor:pointer} */