@charset "utf-8";

/*
*set rem
*/
@media (min-width: 320px) and (max-width: 359px) {
html {
font-size: 6px;
}
}
@media (min-width: 360px) and (max-width: 374px) {
html {
font-size: 7px;
}
}
@media (min-width: 375px) and (max-width: 413px) {
html {
font-size: 7.5px;
}
}
@media (min-width: 414px) and (max-width: 750px) {
html {
font-size: 8.3px;
}
}
@media (min-width: 760px)and (max-width: 1023px) {
html {
font-size: 7.5px;
}
}
@media only screen and (max-device-width: 1024px) and (min-device-width: 768px){
html {
font-size: 12.5px;
}	
}
@media only screen and (min-width: 1024px) {
html {
font-size: 100%;
}
}
/* iPad pro */
@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px)and (-webkit-min-device-pixel-ratio: 2)and (orientation:portrait) {
 html {
font-size: 15px;
}
}
 @media only screen and (min-device-width: 1024px) and (max-device-width: 1366px)and (-webkit-min-device-pixel-ratio: 2)and (orientation:landscape) {
 html {
font-size: 14.5px;
}
}
.cover {
	width:100%;
	height:100%;
	position:fixed;
	z-index:700;
	background-color:rgba(0, 0, 0, 0.4);
	display:none;
}
.result {
	width:43.75rem;
	height:35rem;
	border-radius:0.625rem;
	position:absolute;
	left:50%;
	margin-left:-21.875rem;
	top:50%;
	margin-top:-16.25rem;
	background:#efe0b4;
	border:0.3125rem solid #ffd09a;
	display:block;
	transition:all 0.3s ease;
	transform:scale(0);
}
.rsutext {
	width:100%;
	height:5.625rem;
	margin-top:0.625rem;
	text-align:center;
	display:block;
}
.record-close {
	display:block;
	width: 32px;
	height: 32px;
	cursor:pointer;
	background:url(http://pic-1259109643.cos.ap-taipei.myqcloud.com/respic/old/images/PMDESIGN/qmzg/20190123/images/close.png) no-repeat center center/cover;
	position:absolute;
	right: -45.6px;
	top:0;
	transition:all 0.3s ease;
}
.record {
	width: 640px;
	height:auto;
	position:absolute;
	z-index:999;
	position:absolute;
	left:50%;
	margin-left: -320px;
	top:40%;
	margin-top:-8px;
	font-size:3.84px;
	background: #483c7f;
	border: 0.1875rem solid #9087bb;
	border-radius:1.6px;
	text-align:center;
	display:none;
	height: 256px;
	color: #ffffff;
	padding:3.2px 0;
}
.record h4 {
	font-size:41.6px;
	border-bottom: 0.0625rem solid #000000;
}
.record div {
	font-size:32px;
	margin:24px 0;
}
.record a {
	display:block;
	width:144px;
	margin: auto;
	line-height:2.5rem;
	color: #212121;
	cursor:pointer;
	border-radius:0.25rem;
	background: #ffd4e2;
	font-size:25.6px;
}
/* section-common */
.section {
	padding: 1.875rem 0;
	width: 100%;
	position: relative;
	overflow: hidden;
}
.section .section-title {
	margin: 0 auto 2rem;
	width: 65.6rem;
	height: 5.625rem;
	background-repeat: no-repeat;
	background-position: center;/* background-size: contain;*/
}
/* banner */
.banner {
	position: relative;
	width: 100%;
	height: 67.375rem;
	background: url(../img/bg01.jpg) no-repeat center;
	overflow: hidden;
}
.banner::after {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	margin: auto;
	width: 100%;
	height: 67.5rem;
	max-height: 100%;
	background: url(../img/banner-f.png) no-repeat center top;
	background-size: contain;
}
.logo {
	position: absolute;
    left: 0;
    right: 0;
	bottom: 14rem;
	z-index: 10;
    margin: auto;
    width: 30.813rem;
    height: 18.5rem;
    background: url(../img/logo.png) no-repeat center;
    background-size: contain;
}
.slogon {
	position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
	margin: auto;
	z-index: 10;
    width: 84.4rem;
    height: 19.7rem;
    background: url(../img/slogon.png) no-repeat center;
    background-size: contain;
}
.operation-list {/* width:75rem; */
	margin:0 auto;
	display:flex;
	flex-direction: row;  /* 子元素横向排列 */
	justify-content: center; /* 相对父元素水平居中 */
}
.operation-list li {
	position:relative;
}
.operation-list li a {
	margin:0 1.25rem;
	width: 17.625rem;
	height: 12.125rem;
	display: block;
	background-repeat:no-repeat;
	background-position:center;
	cursor:pointer;
	background-size: contain;
}
.operation-list li:nth-child(1) a {
background-image:url(../img/but01.png);
}
.operation-list li:nth-child(2) a {
background-image:url(../img/but02.png);
}
.operation-list li:nth-child(3) a {
background-image:url(../img/but03.png);
}
/* pop */
.pop {
	display: none;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 999;
	width: 100%;
	height: 100%;
}
.pop-main {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 999;
	margin: auto;
	padding: 3.5rem 8.5rem 6.25rem;
	width: 42.625rem;
	height: 30.1875rem;
	background: url(../img/form-login.png) no-repeat center top;
}
.mask {
	position: absolute;
	z-index: 1;
	width: 100%;
	height: 100%;
	background: #fff;
	opacity: .9;
}
.pop-title {
	margin-left: 4.375rem;
	height: 10.5rem;
	background-repeat: no-repeat;
	background-position: center bottom;
}
.form-number {
	margin: 0 auto;
	width: 46.5625rem;
	height: 30.375rem;
	background: url(../img/form-bg2.png) no-repeat center;
	background-size: 100%;
	overflow: hidden;
}
.form-number table {
	color: #ffffff;
	margin: 3.8125rem 0 0 4.375rem;
	width: 38.125rem;
	font-size: 28pc;
}
.form-number table tr {
	height: 2.5rem;
	line-height: 2.5rem;
	border-bottom: 0.0625rem solid #505050;
}
.form-number table tr th {
	width: 50%;
	text-align: center;
	font-size: 1rem;
	background: #ca5555;
}
.form-number table tr td {
	color: #333;
	text-align: center;
	font-size: 1rem;
	background: #fff;
	border: 0.0625rem solid #ccc;
}
.title-record {
	padding-top: 5.625rem;
	background: url(../img/title-record.png) no-repeat center;
}
.title-change {
	padding-top: 5.625rem;
	background-image: url(../img/title-change.png);
}
.close-btn {
	position: absolute;
	right: -6rem;
	top: 0;
	padding-top: 6.25rem;
	width: 6.25rem;
	background: url(../img/btn-close.png) no-repeat center;
 transition: all .5s ease;
	cursor: pointer;
}
.close-btn:hover {
	transform:rotate(180deg);
}
.login-tips {
	position:absolute;
	left: 8.5rem;
	top: 7.5rem;
	color: #ec6d78;
	font-size: 1.0625rem;
	letter-spacing: 0.125rem;
}
/* login */
.login-pop .pop-main {
	background: url(../img/form-login.png) center top no-repeat;
	width: 42.625rem;
	height: 30.1875rem;
	padding: 3.5rem 8.5rem 6.25rem;
	background-size: contain;
}
.form-login-before .title_b {
	display: block;
	padding-top: 4.375rem;
	background: url(../img/title-login.png) no-repeat center top;
	background-size: contain;
}
.form-server .title_b {
	background-image: url(../img/title-server.png);
	display: block;
	padding-top: 4.375rem;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}
.login-form {
	padding-top: 0.625rem;
}
.num_th_ip {
	background:none;
}
.login-form > div {
	display: flex;
	margin: 0.9375rem auto;
}
.num_th_ip {
	margin-left: -0.3125rem;
	padding-left: 0.9375rem;
	width: 21.25rem;
	height: 2.6875rem;
	line-height: 2.6875rem;
	font-size: 0.875rem;
	color: #d8cc9f;
	outline: none;
	background: #424242;
	border: 0.0625rem solid #c29aff;
}
.lg_b-t {
	background-size: 1.5625rem;
}
.icon-b {
	display: inline-block;
	width: 4.4375rem;
	height: 2.6875rem;
	line-height: 2.6875rem;
	vertical-align: top;
	background: #c29aff url(http://pic-1259109643.cos.ap-taipei.myqcloud.com/respic/old/images/PMDESIGN/gwpgtw/20170918/images/member-icon.png) no-repeat center;
	background-size: 1.1875rem;
}
.icon-e {
	display: inline-block;
	width: 4.375rem;
	height: 2.6875rem;
	line-height: 2.8125rem;
	vertical-align: top;
	background: #c29aff url(http://pic-1259109643.cos.ap-taipei.myqcloud.com/respic/old/images/PMDESIGN/gwpgtw/20170918/images/lock-icon.png) no-repeat center;
	background-size: 1.0625rem;
}
.lg_b-btn a {
	display: block;
	margin: 0 auto;
	width: 100%;
	height: 3.75rem;
	font-size: 1.25rem;
	font-weight: bold;
	line-height: 3.75rem;
	text-align: center;
	color: #ffffff;
	letter-spacing: 0.5rem;
	background: #a36df6;
	box-shadow: 0rem 0.1875rem rgba(0, 0, 0, 0.12);
	border-radius: 0.375rem;
	cursor: pointer;
}
.facebook-link {
	display: inline-block;
	margin: 0.625rem;
	padding-top: 2.5rem;
	width: 2.5rem;
	background: url(http://pic-1259109643.cos.ap-taipei.myqcloud.com/respic/old/images/PMDESIGN/sghk/20170801/images/facebook.png) no-repeat center;
	cursor: pointer;
	background-size: contain;
}
.line-link {
	display: inline-block;
	margin: 0.625rem;
	padding-top: 2.5rem;
	width: 2.5rem;
	vertical-align: -1.5625rem;
	background: url(../images/line.png) no-repeat center;
	background-size: contain;
	border-radius: 0.4375rem;
	cursor: pointer;
}
.login-form > div.lg_bottom {
	margin: 1.875rem 0 0 0;
	padding-left: 5rem;
	width: auto;
	height: 4.375rem;
	background: #ffffff;
}
.lg_bottom {
	vertical-align: top;
}
.lg_bottom p {
	display: flex;
	padding-top: 0.25rem;
	line-height: 4.5rem;
}
.icon-f {
	display: inline-block;
	width: 4.125rem;
	height: 2.6875rem;
	line-height: 4.0625rem;
	vertical-align: top;
	background: #ec6d78 url(http://pic-1259109643.cos.ap-taipei.myqcloud.com/respic/old/images/PMDESIGN/gwpgtw/20170918/images/yzm-icon.png) no-repeat center;
	background-size: 1.1875rem;
}
.lg_b-m {
	position: relative;
}
.yzm-a img {
	width: 6.375rem;
	height: 2.6875rem;
}
.yzm-a {
	position: absolute;
	right: 0;
	top: 0;
	cursor: pointer;
}
.login {
	float: right;
	margin: 0.25rem 0 0 0;
	width: 33.25rem;
}
.login-btn {
	display: inline-block;
	width: 33.125rem;
	height: 4.375rem;
	font-size: 2.0625rem;
	color: #ffffff;
	line-height: 3.9375rem;
	text-align: center;
	font-weight: bold;
	letter-spacing: 0.375rem;
	background: #e03564;
	border-radius: 0.4375rem;
	border: 0.125rem solid #803939;
	box-shadow: 0.125rem 0.125rem 0rem #9a9a9a;
	cursor: pointer;
}
.quite {
	margin-left: 0.625rem;
	padding: 0.25rem 0.875rem;
	font-size: 0.875rem;
	color: #fff;
	background: #ec2b2b;
	border-radius: 1.4375rem;
}
.pop-show {
	display: block;
}
.server-tips {
	color: red;
	text-align: center;
	height: 2.8125rem;
	line-height: 2.1875rem;
	letter-spacing: 0.4375rem;
}
.serveBox {
	margin-bottom: 1.25rem;
	display: flex;
	height: 3.125rem;
	line-height: 3.125rem;
	background: #424242;
	border: 0.0625rem solid #fff;
}
.serveBox > span {
	width: 8.4375rem;
	text-align: center;
	color: #fff;
	border-right: 0.0625rem solid #ffffff;
	margin-right: 1.25rem;
	background: #c299ff;
}
#box_roles ul, .serveBox li {
	color:#fff;
}
.serveBox select {
	width: 15.75rem;
	height: 3rem;
	font-size: 0.875rem;
	-webkit-appearance: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	background: #424242;
	color: #fff;
	border: none;
	outline:none;
}
select:focus {
	border:none;
}
.binding {
	height: 3.4375rem;
	font-size: 1.125rem;
	color: #fff;
	text-align: center;
	line-height: 3.4375rem;
	background: #a26df6;
	border-radius: 0.25rem;
	box-shadow: 0rem 0.1875rem rgba(0, 0, 0, 0.12);
}
/*em login */

.loogin {
	cursor:pointer;
	background:url(../img/loogin.png) no-repeat;
	height: 2.8rem;
    width: 100%;
    background-size: contain;
}
.quit {
	cursor:pointer;
	background:url(../img/exit.png) no-repeat;
	height: 2.8rem;
    width: 100%;
	background-size: contain;
}
.dow {
	width: 8.7rem;
    height: 18.7rem;
    background: url(../img/dow.png) no-repeat;
    position: fixed;
    background-size: contain;
	right: 10px;
    top: 10%;
    z-index: 99;
    padding: 9.6rem 0.8rem 0 0.8rem;
    box-sizing: border-box;
}
.dow a {
	display: block;
    width: 100%;
    height: 2.5rem;
    background-size: contain;
    background-repeat: no-repeat;
    margin: 0 auto 0.25rem;
}
.dow a:nth-child(1) {
background-image: url(../img/AppStore.png);
}
.dow a:nth-child(2) {
background-image: url(../img/googleplay.png);
}
/* section-1 */
.section-1 {
	width: 100%;
	background: url(../img/bg02.jpg) no-repeat center top;
	height:64.9375rem;
}
.section-1 .section-title {
	/* margin-bottom: 0.625rem; */
    background-image: url(../img/title01.png);
	height: 16.8rem;
	background-size: contain;
}
.set2-list {
	position:relative;
	width: 65rem;
	margin: 0 auto;
}
.set2-list .swiper-container {
	padding-top: 9rem;
}
.set2-list .swiper-slide {
	width: 48.625rem;
}
.set2-list .swiper-slide .swiper-video {
	width:100%;
    height: 27.375rem;
	margin-bottom: 0.625rem;
	z-index:999;
	position:relative;
	filter: blur(4px);
}
.set2-list .swiper-slide.swiper-slide-active .swiper-video {
	filter: blur(0);
}
.set2-list .swiper-slide.swiper-slide-active .swiper-video::after {
	content: '';
	display: block;
	position: absolute;
	left: -.314rem;
    right: 0;
    top: -.4rem;
    bottom: 0;
    width: 49.313rem;
    height: 28.438rem;
	background: url(../img/set2-list-bg.png) no-repeat center;
}
.set2-list .swiper-slide .swiper-video-on {
	z-index: 1001;
	position:absolute;
	width:100%;
	height:100%;/* background: url(../img/swiper-video-on.png) no-repeat center #ffffff4a;*/
}
.set2-list .swiper-slide .swiper-video-on img {
	width: 48.625rem;
    height: 27.375rem;
}
.set2-list .swiper-slide .swiper-video video {
	position: relative;
	z-index: 10;
	width:100%;
	padding:0.625rem; /*background:url(../img/set2-list-bg.png) no-repeat;background-size: cover;*/
}
.set2-list .swiper-slide img {
	position: relative;
    z-index: 100;
	display: block;
	width: 100%;
}
.set2-list .swiper-slide p {
	line-height:1.875rem;
	color: #8c2752;
	width: 50%;
	margin: 0 auto 0.375rem;
	font-size: 1.25rem;
}
.set2-list .swiper-slide p strong {
	display:inline-block;
	background:url(../img/set2-hint-bg.png) no-repeat;
	text-align:center;
	line-height:2.375rem;
	width:9.6875rem;
	margin-right: 1.25rem;
	background-size: contain;
}
.set2-list .swiper-pagination {
	width:100%;
	bottom: 0;
}
.set2-list .swiper-pagination-bullets .swiper-pagination-bullet {
	margin:0 0.3125rem;
	width: 9.5rem;
	height: 5rem;
	opacity:1;
	border-radius: inherit;
	background: center;
	background-size: contain;
	background-repeat:no-repeat;
}
.set2-list .swiper-pagination-bullets .swiper-pagination-bullet:nth-child(1) {
background-image:url(../img/x01.png);
}
.set2-list .swiper-pagination-bullets .swiper-pagination-bullet:nth-child(2) {
background-image:url(../img/x02.png);
}
.set2-list .swiper-pagination-bullets .swiper-pagination-bullet:nth-child(3) {
background-image:url(../img/x03.png);
}
.set2-list .swiper-pagination-bullets .swiper-pagination-bullet:nth-child(4) {
background-image:url(../img/x04.png);
}
.set2-list .swiper-pagination-bullets .swiper-pagination-bullet:nth-child(5) {
background-image:url(../img/x05.png);
}
.set2-list .swiper-pagination-bullets .swiper-pagination-bullet:nth-child(6) {
background-image:url(../img/x06.png);
}
.set2-list .swiper-pagination-bullets .swiper-pagination-bullet-active {
	width: 13.375rem;
	height: 6.75rem;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}
.set2-list .swiper-pagination-bullets .swiper-pagination-bullet-active:nth-child(1) {
background-image:url(../img/d01.png);
}
.set2-list .swiper-pagination-bullets .swiper-pagination-bullet-active:nth-child(2) {
background-image:url(../img/d02.png);
}
.set2-list .swiper-pagination-bullets .swiper-pagination-bullet-active:nth-child(3) {
background-image:url(../img/d03.png);
}
.set2-list .swiper-pagination-bullets .swiper-pagination-bullet-active:nth-child(4) {
background-image:url(../img/d04.png);
}
.set2-list .swiper-pagination-bullets .swiper-pagination-bullet-active:nth-child(5) {
background-image:url(../img/d05.png);
}
.set2-list .swiper-pagination-bullets .swiper-pagination-bullet-active:nth-child(6) {
background-image:url(../img/d06.png);
}
.set2-list .swiper-button-prev {
	left: 4rem;
	width: 5.375rem;
	height: 5.375rem;
	background: url(../img/set2-list-l.png) no-repeat;
	background-position:0 0;
	background-size: contain;
	z-index: 999;
}
.set2-list .swiper-button-next {
	right: 4rem;
	width: 5.375rem;
	height: 5.375rem;
	background: url(../img/set2-list-r.png) no-repeat;
	background-size: contain;
	z-index: 999;
}
.set2-list .swiper-button-next:after, .swiper-button-prev:after {
	display:none;
}
.text-con {
	padding: 1rem 0;
	width: 100%;
	background: linear-gradient(#f8f6f9, #e8d3e2);
	text-align: center;
	opacity: 0;
}
.set2-list .swiper-slide.swiper-slide-active .text-con {
	opacity: 1;
}
/* section-2 */
.section-2 {
	width: 100%;
	background: url(../img/bg03.jpg) no-repeat center top;
}
.section-2 .section-title {
	margin-top: 6rem;
	background-image: url(../img/title02.png);
	height: 16rem;
	background-size: contain;
}
.vessel .whisper {
	width:60rem;
	margin:0 auto;
	display:flex;
	flex-direction: row;  /* 子元素横向排列 */
	justify-content: center; /* 相对父元素水平居中 */
	align-items: center; /*  子元素相对父元素垂直居中*/
	display:none;
}
.vessel .act {
	display:flex;
}
.whisper .whisper-list-img {
	position:relative;
	margin-right: 5rem;
}
.whisper-list-img .list-video {
	width:20.8125rem;
	height:26rem;
	position: relative;
}
.whisper-list-img .video-tier {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.whisper-list-img .v2 {
	background:url(../mp4/img02.jpg) no-repeat;
	background-size: contain;
}
.whisper-list-img .v3 {
	background:url(../mp4/img03.jpg) no-repeat;
	background-size: contain;
}
.whisper-list-img .v4 {
	background:url(../mp4/img04.jpg) no-repeat;
	background-size: contain;
}
.whisper-list-img .list-video video {
	width:100%;
	height:100%;
	border: 0.3125rem solid #fff;
}
.whisper-list-img a {
	width:5.375rem;
	height:5.375rem;
	display:block;
	position:absolute;
	top:40%;
	cursor:pointer;
}
.whisper-list-img a:hover {
	transform: scale(0.8);
}
.whisper-list-img .whisper-list-l {
	left:-5.625rem;
	background: url(../img/set2-list-l.png) no-repeat;
	background-size: contain;
}
.whisper-list-img .whisper-list-r {
	right:-5.625rem;
	background: url(../img/set2-list-r.png) no-repeat;
	background-size: contain;
}
.whisper .whisper-list-con {
	width:40%;
	margin-left: 5rem;
}
.whisper .whisper-list-con h3 {
	width:16.3125rem;
	height:4.25rem;
	margin:0 auto 3.75rem;
	background:url(../img/set3-title.png) no-repeat center;
	background-size: contain;
}
.whisper .whisper-list-con p {
	width: 90%;
	margin: 0 auto;
	font-size: 1.25rem;
	text-indent: 2.5rem;
	letter-spacing: 0.125rem;
	color: #a95372;
	min-height: 6.25rem;
}
.whisper .whisper-list-con a {
	cursor:pointer;
	width:17rem;
	height:4.375rem;
	margin:3.75rem auto 0;
	display:block;
	background:url(../img/set3-mp3.png) no-repeat center;
	background-size: contain;
}
.whisper .whisper-list-con a.v2 {
	background:url(../mp3/02.png) no-repeat;
	background-size: contain;
}
.whisper .whisper-list-con a.v3 {
	background:url(../mp3/03.png) no-repeat;
	background-size: contain;
}
.whisper .whisper-list-con a.v4 {
	background:url(../mp3/04.png) no-repeat;
	background-size: contain;
}
#cmusic {
	display: none;
}
.whisper-pagination {
	display:flex;
	flex-direction: row;  /* 子元素横向排列 */
	justify-content: center; /* 相对父元素水平居中 */
	margin-top: 1.875rem;
}
.whisper-pagination li {
	width:11.875rem;
	height:3.4375rem;
	margin:0 0.375rem;
	background-repeat:no-repeat;
	background-position:center;
	background-size: contain;
}
.whisper-pagination li:nth-child(1) {
background-image:url(../img/h01.png);
}
.whisper-pagination li:nth-child(2) {
background-image:url(../img/h02.png);
}
.whisper-pagination li:nth-child(3) {
background-image:url(../img/h03.png);
}
.whisper-pagination li:nth-child(4) {
background-image:url(../img/h04.png);
}
 .whisper-pagination li:nth-child(1).act {
background-image:url(../img/r01.png);
}
.whisper-pagination li:nth-child(2).act {
background-image:url(../img/r02.png);
}
.whisper-pagination li:nth-child(3).act {
background-image:url(../img/r03.png);
}
.whisper-pagination li:nth-child(4).act {
background-image:url(../img/r04.png);
}
/* section-3 */
.section-3 {
	width: 100%;
	background: url(../img/bg04.jpg) no-repeat center top;
	height:80rem;
	background-size: cover;
}
.section-3 .section-title {
	margin-bottom: 3.75rem;
	background-image: url(../img/title03.png);
	height:13.25rem;
	background-size: contain;
}
.goUrl {
	width:70.1875rem;
	margin: 0 auto 20px;
}
.goUrl a {
	margin: 0 auto;
    width: 200px;
    height: 44px;
    line-height: 40px;
    text-align: center;
    display: block;
    background: #8e060a;
    border-radius: 6px;
    color: #fff;
    letter-spacing: 1px;
}
.set3-main {
	width: 70.1875rem;
    height: 46.875rem;
	background:url(../img/set3-bg.png) no-repeat;
	margin:auto;
	padding: 2rem 0;
	background-size: contain;
}
.set3-main-list {
	width: 57.88rem;
    height: 12.2rem;
	margin: 0 auto 1.2rem;
	background:url(../img/set3-list-01.png) no-repeat;
	position:relative;
	background-size: contain;
}
.set3-main-list:nth-child(2) {
	background:url(../img/set3-list-02.png) no-repeat;
	background-size: contain;
}
.set3-main-list:nth-child(3) {
	background:url(../img/set3-list-03.png) no-repeat;
	background-size: contain;
}
.set3-main-list a {
	display:block;
	position:absolute;
	width: 5rem;
    height: 8.7rem;
	cursor:pointer;
	right:0;
	bottom:0;
}
.explain-main {
	width:43.3125rem;
	margin:auto;
}
.explain-title {
	padding: 0.25rem 0.75rem;
	font-size: 1.375rem;
	background:#8f0000;
	color:#fff;
	letter-spacing: 0.125rem;
	border-radius: 0.375rem;
}
.explain-ul {
	color:#8f0000;
	font-size: 1.1rem;
	letter-spacing:0.125rem;
	margin-top:0.5rem;
}
.explain-ul li {
	margin-bottom:0.375rem;
	line-height: 2rem;
}
/*
footer
*/
.footer {
	width:100%;
	padding: 6px;/* height: 97px; */
	position:relative;
	overflow:hidden;
	background-color:#222;
}
.foot {
	width: 900px;
	height:100%;
	margin:0 auto;
}
.foot span {
	color:#fff;
	font-family:Microsoft YAHEI;
	font-size: 12px;
}
.fl {
	float:left;/* width:731.25px; */
}
.footer .fl img {
	float:left;
	margin-top: 9.375px;
	height: 70px;
}
.fl span {
	float:right;
	margin-top:39.375px;
	margin-left: 18.75px;
}
.fr {
	float:right;
	margin-top:15px;/* width: 420px; */
}
.footer .fr img {
	float:left;
	margin-top: 9.375px;/* width: 82.5px; */
	margin-right: 11.25px;
}
.fr span {/* width: 362px; */
	float:right;
}

/* @media screen and (max-width: 1023px){
.banner {
    height: 44.4667rem;
    background: url(../img/bg01_m.jpg) no-repeat center;
}

.banner.onScreen {}
.slogon {
    width: 100%;
    margin: 28.3333rem auto 1.6667rem;
    background-size: contain;
}
.section .section-title{ width:100%;height: 7.25rem;
    margin-bottom: 2rem;}
.dow {
    width: 100%;
    height: unset;
    background-image: linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
    left: 0rem;
    top: 0%;
    border-bottom: 2px solid #000;
    padding: 0.6333rem 0 0 1rem;
}
.dow a {
    display: inline-block;
    width: 7rem;
    height: 2.0625rem;
    background-size: contain;
}
.loogin {
    cursor: pointer;
    background: url(../img/loogin.png) no-repeat center;
    position: fixed;
    background-size: contain;
    top: 0.2rem;
    right: 1rem;
    z-index: 100;
    width: 6.9333rem;
    height: 2.6667rem;
}
.quit {
    cursor: pointer;
    background: url(../img/exit.png) no-repeat center;
    position: fixed;
    background-size: contain;
    top: 0.2rem;
    right: 1rem;
    z-index: 100;
    width: 6.9333rem;
    height: 2.6667rem;
}
.section-2 {
    width: 100%;
    background: url(../img/bg03_m.jpg) no-repeat center top;
	height: 43rem;
}
.vessel .whisper{  width:69%; margin:auto;}
.whisper .whisper-list-img {
    position: relative;
    margin: 0 auto;
    width: 100%;
}
.whisper-list-img .whisper-list-l{ left: -2.1667rem;}
.whisper-list-img .whisper-list-r{ right:-2.1667rem;}
.whisper .whisper-list-con {
    width: auto;
    margin-left: inherit;
}
.whisper-list-img .list-video{ margin:auto;width: 100%;  height: auto;}
.whisper .whisper-list-con h3{ display:none;}
.whisper .whisper-list-con p {
    min-height: 2.6667rem;
    width: 100%;
    margin: 0.6667rem auto;
    font-size: 1rem;
}
.whisper .whisper-list-con a {
    height: 2.3333rem;
    margin: 0 auto 2rem;
}
.vessel .act {
    display: block;
}

.set2-list {
    width: 100%;
}

.operation-list li a {
    width: 6.6667rem;
}
.set3-main {
    width: 100%;
    background: url(../img/set3-bg.png) no-repeat;
	background-size: contain;
	padding: 1rem 0;
}
.set3-main-list {
	width: 20.7333rem;
    height: 5.4rem;
    background-size: cover;
    margin: 0 auto 0.6667rem;
}
.set3-main-list a {
    width: 5.3125rem;
    height: 4.25rem;
}
.explain {
    margin: 3.3333rem auto 0;
}
.foot {
    width: 100%;
}
} */

@media screen and (max-width: 1444px) {
	.banner {
		height: 50.375rem;
		background-size: 100% 100%;
	}
	.logo {
		height: 14.5rem;
	}
	.slogon {
		height: 14.7rem;
	}
}

@media screen and (max-width: 1023px) {
	.banner {
		height: 88rem;
		margin-top: 40px;
		background: url(../img/bg01_m.jpg) no-repeat center top;
		background-size: cover;
	}
	.banner::after {
		left: 2rem;
		right: auto;
		top: 34rem;
		width: 7.47rem;
		height: 15.422rem;
		background: url(../img/banner-f-m.png) no-repeat center;
		background-size: contain;
	}
	.banner::before {
		content: '';
		display: block;
		position: absolute;
		right: 2.5rem;
		top: 10rem;
		width: 7.47rem;
		height: 15.422rem;
		background: url(../img/banner-f-m2.png) no-repeat center;
		background-size: contain;
	}
	.slogon {
		width: 100%;
		height: 12rem;
		margin: 53rem auto 1.6667rem;
		background-size: contain;
	}
	.section .section-title {
		margin: 0 auto 2rem;
		width: 94%;
		height: 24rem;
	}
	.section-1 .section-title {
		background-image: url(../img/title01-m.png);
	}
	.section-2 .section-title {
		background-image: url(../img/title02-m.png);
	}
	.logo {
		bottom: 9rem;
		width: 100%;
		height: 20rem;
	}
	.dow {
		width: 100%;
		height: unset;
		background: none;
		background-color:#de7aa0;
		background: linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
		background:-moz-linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
		background:-webkit-linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
		background: -o-linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
		background: -ms-linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
		background: linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
		left: 0px;
		top: 0%;
		padding: 1rem 0 0 1rem;
	}
	.dow a {
		display: inline-block;
		width: 15.75rem;
		height: 4.0625rem;
		background-size: contain;
	}
	.loogin {
		cursor: pointer;
		background: url(../img/loogin.png) no-repeat center;
		position: fixed;
		top: 0.8rem;
		right: 2rem;
		z-index: 100;
		background-size: cover;
		width: 14.75rem;
		height: 4.1rem;
	}
	.quit {
		cursor: pointer;
		background: url(../img/exit.png) no-repeat center;
		position: fixed;
		top: 0.8rem;
		right: 2rem;
		z-index: 100;
		background-size: cover;
		width: 14.75rem;
		height: 4.1rem;
	}
	.section {
		padding: 4rem 0;
	}
	.section-1 {
		height: auto;
		background-size: cover;
	}
	.section-2 {
		width: 100%;
		background: url(../img/bg03_m.jpg) no-repeat center top;
		height: auto;
		background-size: cover;
	}
	.vessel .whisper {
		width:100%;
		margin:auto;
	}
	.whisper .whisper-list-img {
		position: relative;
		margin: 0 auto;
		width: 50%;
	}
	.whisper-list-img .whisper-list-l {
		left: -65px;
	}
	.whisper-list-img .whisper-list-r {
		right:-65px;
	}
	.whisper .whisper-list-con {
		width: auto;
		margin-left: inherit;
	}
	.whisper-list-img .list-video {
		margin:auto;
	}
	.whisper .whisper-list-con h3 {
		display:none;
	}
	.whisper .whisper-list-con p {
		min-height: 7rem;
		margin: 20px auto;
	}
	.whisper .whisper-list-con a {
		height: 5rem;
		margin: 0 auto 3rem;
	}
	.vessel .act {
		display: block;
	}
	.set2-list {
		width: 100%;
		height: auto;
	}
	.set2-list .swiper-container {
		padding-top: 17rem;
	}
	.set2-list .swiper-slide p {
		width: 100%;
		font-size: 2rem;
	}
	.set2-list .swiper-slide p strong {
		line-height: 4.4rem;
		width: 18rem;
		font-size: 2rem;
		height: 5rem;
	}
	.set2-list .swiper-button-prev {
		top: 56%;
		left: 0;
	}
	.set2-list .swiper-button-next {
		top: 56%;
		right: 0;
	}
	.goUrl {
		width: 100%;
	}
	.goUrl a {
		display: block;
		margin: 0 auto;
		padding: 0;
		width: 20rem;
		height: 5rem;
		text-align: center;
		line-height: 5rem;
		font-size: 2rem;
	}
	.operation-list li a {
		width: 14rem;
	}
	.set3-main {
		width: 100%;
		height: auto;
		background-size: 100% 100%;
	}
	.set3-main-list {
		height: 9rem;
	}
	.set3-main-list, .set3-main-list:nth-child(2) {
		width: 42rem;
		background-size: contain;
		margin: 0 auto 2rem;
	}
	.explain {
		margin: 8rem auto 0;
	}
	.set2-list .swiper-pagination-bullets .swiper-pagination-bullet {
		margin: 0 0 2rem 0;
		width: 33%;
	}
	.explain-title {
		padding: .6rem 2rem;
		font-size: 2rem;
	}
	.explain-ul {
		font-size: 2rem;
		margin-top: 2rem;
	}
	.explain-ul li {
		line-height: 4rem;
	}

	.foot {
		width: 100%;
	}
	.fl {
		float: initial;
		/* width: 731.25px; */
		height: 34px;
	}
	.footer .fl img{    height: 21px;}
	.foot span {
		color: #fff;
		font-family: Microsoft YAHEI;
		font-size: 9px;
	}
	.fl span{
		margin: 11px 0 0 0;
	}
	.fr {
		float: initial;
		margin: 2px auto 0;
		width: 216px;
	}

	.section-3 {
		height: 104rem;
	}

	.login-pop .pop-main {
		padding: 3.5rem 3.5rem 6.25rem;
		width: 94%;
		height: 35rem;
		background-size: 100% 100%;
	}
	.icon-b,.icon-e {
		width: 8rem;
		height: 4rem;
		line-height: 4rem;
		background-size: 30%;
	}
	.num_th_ip {
		flex: 1;
		width: 100%;
		height: 4rem;
		line-height: 4rem;
		font-size: 2rem;
	}
	.lg_b-btn a,.binding {
		height: 5rem;
		font-size: 2rem;
		line-height: 5rem;
	}
	.login-form > div.lg_bottom {
		height: auto;
		font-size: 2rem;
	}
	.facebook-link {
		width: 4rem;
	}

	.close-btn {
		right: 0;
		left: 0;
		margin: auto;
		top: auto;
		bottom: -7.5rem;
		width: 5rem;
		padding: 0;
		height: 5rem;
	}
	.serveBox > span {
		width: 15rem;
		font-size: 2rem;
		height: 4rem;
		line-height: 4rem;
	}
	.serveBox {
		flex: 1;
		width: 100%;
		height: 4rem;
		line-height: 4rem;
		font-size: 2rem;
		border: none;
	}
	.serveBox select {
		height: 100%;
		font-size: 2rem;
	}
	.form-server .server-tips {
		margin-top: 2rem;
	}
	.form-server .loginBox {
		margin-top: 2rem;
	}
}

/*兼容ipad ：*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px){
	.section .section-title {
		width: 90%;
	}
	.section-3 {
		height: 83rem;
	}
	.set3-main {
		width: 91%;
		height: 39.875rem;
		background-size: contain;
		background-position: center;
	}
	.goUrl {
		width: 91%;
	}
	.footer {
		width:100%;
		padding: 6px;/* height: 97px; */
		position:relative;
		overflow:hidden;
		background-color:#222;
	}
	.foot {
		width: 730px;
		height:100%;
		margin:0 auto;
	}
	.foot span {
		color:#fff;
		font-family:Microsoft YAHEI;
		font-size: 12px;
	}
	.fl {
		float:left;/* width:731.25px; */
	}
	.footer .fl img {
		float:left;
		margin-top: 9.375px;
		height: 70px;
	}
	.fl span {
		float:right;
		margin-top:39.375px;
		margin-left: 18.75px;
	}
	.fr {
		float:right;
		margin-top:15px;/* width: 420px; */
	}
	.footer .fr img {
		float:left;
		margin-top: 9.375px;/* width: 82.5px; */
		margin-right: 11.25px;
	}
	.fr span {/* width: 362px; */
		float:right;
	}
}

/*兼容ipad横屏 ：*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape){
	/*.banner {
		background: #000;
	}*/
}
/*兼容ipad横屏 ：*/
@media only screen and (min-device-width : 1024px) and (max-device-width : 1366px) and (orientation : landscape){
	.banner {
		height: 88rem;
		margin-top: 40px;
		background: url(../img/bg01.jpg) no-repeat center top;
		background-size: cover;
	}
	.slogon {
		width: 100%;
		margin: 53rem auto 1.6667rem;
		background-size: contain;
	}
	.section .section-title {
		width: 70%;
	}
	.dow {
		width: 100%;
		height: unset;
		background: none;
		background-color:#de7aa0;
		background: linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
		background:-moz-linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
		background:-webkit-linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
		background: -o-linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
		background: -ms-linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
		background: linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
		left: 0px;
		top: 0%;
		padding: 1rem 0 0 1rem;
	}
	.dow a {
		display: inline-block;
		width: 15.75rem;
		height: 4.0625rem;
		background-size: contain;
	}
	.loogin {
		cursor: pointer;
		background: url(../img/loogin.png) no-repeat center;
		position: fixed;
		top: 0.8rem;
		right: 2rem;
		z-index: 100;
		background-size: cover;
		width: 14.75rem;
		height: 4.1rem;
	}
	.quit {
		cursor: pointer;
		background: url(../img/exit.png) no-repeat center;
		position: fixed;
		top: 0.8rem;
		right: 2rem;
		z-index: 100;
		background-size: cover;
		width: 14.75rem;
		height: 4.1rem;
	}
	.set3-main{ width:79%;}
	.set3-main-list {
		/* margin: 4rem auto 4.875rem;*/
		margin: 1rem auto 1.875rem;
	}
	.section-3 {
		height: 87rem;
	}
	.explain {
		/*margin: 8.5rem auto 0;*/
		margin: 1.5rem auto 0;
	}

	.goUrl {
		width: 78%;
	}

	/*.banner {
		background: #000;
	}*/

}

/*兼容ipad竖屏 ：*/
@media only screen and (min-device-width : 1024px) and (max-device-width : 1366px) and (orientation : portrait){
	.banner {
		height: 88rem;
		margin-top: 40px;
		background: url(../img/bg01_m.jpg) no-repeat center top;
		background-size: cover;
	}
	.slogon {
		width: 100%;
		margin: 53rem auto 1.6667rem;
		background-size: contain;
	}
	.section .section-title {
		width: 70%;
	}
	.dow {
		width: 100%;
		height: unset;
		background: none;
		background-color:#de7aa0;
		background: linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
		background:-moz-linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
		background:-webkit-linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
		background: -o-linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
		background: -ms-linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
		background: linear-gradient(#fb9bbfba, #cd4f7fd4, #cc4e7ec4);
		left: 0px;
		top: 0%;
		padding: 1rem 0 0 1rem;
	}
	.dow a {
		display: inline-block;
		width: 15.75rem;
		height: 4.0625rem;
		background-size: contain;
	}
	.loogin {
		cursor: pointer;
		background: url(../img/loogin.png) no-repeat center;
		position: fixed;
		top: 0.8rem;
		right: 2rem;
		z-index: 100;
		background-size: cover;
		width: 14.75rem;
		height: 4.1rem;
	}
	.quit {
		cursor: pointer;
		background: url(../img/exit.png) no-repeat center;
		position: fixed;
		top: 0.8rem;
		right: 2rem;
		z-index: 100;
		background-size: cover;
		width: 14.75rem;
		height: 4.1rem;
	}
	.set3-main {
		width: 95%;
		height: 53.875rem;
		background-size: contain;
		background-position: center;
	}

	/*.banner {
		background: red;
	}*/

}
@media screen and (width: 1024px) and (orientation:landscape) {
	.set3-main-list {
		margin: 4rem auto 4.875rem;
	}
	.explain {
		margin: 8.5rem auto 0;
	}
}