* {
margin: 0px;
padding: 0px;
box-sizing: border-box;
outline: none;
-webkit-tap-highlight-color: transparent
}

html {
font-size: 14px
}

body {
font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif;
background-color: #EAEAEA
}

ol,
ul {
list-style: outside none none
}

a {
text-decoration: none
}

a:hover {
text-decoration: none
}

img {
border: 0;
vertical-align: middle
}

input {
-webkit-appearance: none
}

.app-btn-circle {
background: linear-gradient(to right, #FF0179, #FF4BD1);
color: #ffffff;
border-radius: 2.4rem;
display: inline-block;
text-align: center
}

.large {
width: 6.8rem;
line-height: 2.6rem;
box-shadow: 0px 1px 2px #f5aaaa;
font-size: 1.2rem
}

.btnswitch {
outline: none;
background: linear-gradient(to right, #FF0179, #FF4BD1);
color: #ffffff;
border-top-right-radius: 2.4rem;
border-bottom-right-radius: 2.4rem;
width: 8rem;
line-height: 3rem;
display: inline-block;
text-align: center;
border-width: 0px;
font-size: 1.2rem
}

.btnconfirm {
outline: none;
background: linear-gradient(to right, #FF0179, #FF4BD1);
color: #ffffff;
border-radius: 2.4rem;
width: 6.4rem;
line-height: 2.4rem;
display: inline-block;
text-align: center;
border-width: 0px;
font-size: 1.2rem;
box-shadow: 0px 1px 2px #f5aaaa;
}

.switch-play {
position: absolute;
left: 0;
bottom: 6rem
}

.small {
width: 4.3rem;
line-height: 1.9rem
}

.app-layout-1,
.app .header,
.app .header .app-logo {
display: flex;
justify-content: space-between;
align-items: center
}

.app-layout-2 {
display: flex;
align-items: center
}

.app-layout-3 {
display: flex;
flex-wrap: wrap
}

.app-layout-4,
.app .video-play .play-tool {
display: flex;
flex-direction: column;
align-items: center
}

.app-img-1 {
width: 2.4rem;
height: 2.4rem;
border-radius: 100%;
border: 1px solid #ffffff
}

.app-img-2 {
width: 1.2rem;
height: 1.2rem
}

.app-img-3 {
width: 3rem;
height: 3rem;
opacity: 0.9
}

.app-img-4 {
width: 3.5rem;
height: 3.5rem;
opacity: 0.9
}

.app-img-5 {
width: 3.4rem;
height: 3.4rem;
border-radius: 100%;
border: 1px solid #ffffff
}

.play {
position: absolute;
top: 50%;
left: 50%;
margin-top: -2.5rem;
margin-left: -2.5rem
}

.play img {
width: 5rem
}

.app .header {
background-color: #ffffff;
padding: 0.5rem 1.5rem 0.5rem 1rem;
position: fixed;
top: 0px;
width: 100%;
z-index: 10000
}

.app .header .app-logo img {
width: 3rem
}

.app .header .app-logo p {
font-size: 1.2rem;
color: #606060;
font-family: "Microsoft JhengHei";
padding-left: 1rem
}

.app .video-play {
position: fixed;
top: 0px;
left: 0px;
min-width: 100%;
min-height: 100%;
overflow: hidden
}

.app .video-play .play-tool {
position: absolute;
right: 1rem;
bottom: 9rem
}

.app .video-play .play-tool .pt-t {
padding-bottom: 1.2rem;
text-align: center
}

.app .video-play .play-tool .pt-t p {
color: #ffffff;
font-size: 0.9rem;
font-weight: bolder
}

.app .video-play .play-tool .pt-name {
padding-bottom: 2rem
}

.app .video-play .player {
position: absolute;
background-color: #000000;
width: 100%;
height: 100%;
z-index: -1
}

.app .video-play .close {
position: absolute;
right: 1rem;
top: 1rem
}

.app .header-paly {
top: auto;
bottom: 0px;
background-color: rgba(255, 255, 255, 0.7)
}

.model {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
display: none;
}

.box {
position: absolute;
background-color: #ffffff;
border-radius: 6px;
width: 16rem;
height: 10rem;
top: 50%;
left: 50%;
margin-left: -8rem;
margin-top: -6rem;
}

.btnconfirm {
position: absolute;
bottom: 1rem;
left: 50%;
margin-left: -3.2rem;
}

.message {
display: flex;
align-items: center;
height: 7rem;
padding: 0 2rem;
justify-content: center;
}