/**
* author: dss
* date: 2020-02-12
**/

/*reset*/
* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
html{background:#fff;}
body{ margin:0;padding:0; width:100%; font-family:"Microsoft Yahei"; margin:auto; max-width:1000px; overflow-x:hidden;}
html,body {position: relative;height:100%;}
h1,h2,h3,h4,h5,h6,dl,dt,dd,ul,ol,li,th,td,p,blockquote,pre,form,fieldset,legend,input,button,textarea,hr,figure{ margin:0; padding:0; color:#000;}
h1,h2,h3,h4,h5,h6{ font-size:100%; font-weight:100;}
img,fieldset,iframe,table{ border:0;}
ul,ol,dl,dt,dd,li{ list-style:none;}
b{ font-weight:100;}
em,i{ font-style:normal;}
a{ color:#333; text-decoration:none;}
a:hover{ text-decoration:none;}
img { vertical-align: top; }
.clear{ clear:both;}
.clearfix{ zoom:1;}
.clearfix:after{ content:'.'; display:block; visibility:hidden; clear:both; width:1px; height:1px;}
.left{ float:left;}
.right{ float:right;}
.ta_c { text-align: center;}
.ta_r { text-align: right; }
.pos_abs{ position:absolute;}
.pos_rel{ position:relative;}
.wrapper{ margin:auto;width: 850px; position:relative;}
.hidden{ display:none;}
.indent{ text-indent:2em;}
.weixinPic { height:1px; overflow:hidden; position:absolute; left:0; top:-2px;}
.box_h { position:absolute; top:0; left:0; width:100%; height:100%; z-index:3;}
.pa{ position:absolute;}
.pr{ position:relative;}
.hide{display: none;}

/*
************
**  Main  **
************
*/
/* pc */
.pc-handle{height: 100%;}
.pc{
	height: 1200px;overflow: hidden; width: 750px; transform: scale(0.5) translate(190px, -400px);
}
/* loading */
.loading{z-index: 999;width: 100%; height: 100%; }
.range{position: absolute; left: 50%; margin-left: -200px; top: 50%; margin-top: 0px; width: 400px; height: 10px; background-color: #fff; border-radius: 5px;}
.range2{position: absolute; left: 50%; margin-left: -200px; top: 50%; margin-top: 0px; width: 0px; height: 10px; background-color: #1b3885;border-radius: 5px;}
.load-txt{position: absolute; left: 0%; top: 50%; margin-top: 50px; width: 750px; height: 10px; font-size: 30px; text-align: center;}
/* public */
.swiper-container {width: 100%;height: 100%;}
.swiper-slide{position: relative;}
.ani{
   animation-timing-function:linear;
   -webkit-animation-timing-function:linear;
}
.bg {width: 100%; height: 100%; background-color: #fff; background-size:cover; background-position: center top; background-repeat: no-repeat; position: absolute; left: 0px; top:0px;}
.bg00{background-color: rgba(0, 0, 0, 0.5);}
.bg01{background-color: rgba(0, 0, 0, 0.9);	z-index: 9999;}
.bg0 {background-color: fff;}
.bg1 {background-image: url(../../../images/static/valentinesday2020/bg1.jpg);}
.bg-boy1 {background-image: url(../../../images/static/valentinesday2020/bg-boy1.jpg);}
.bg-boy2 {background-image: url(../../../images/static/valentinesday2020/bg-boy2.jpg);}
.bg-boy3 {background-image: url(../../../images/static/valentinesday2020/bg-boy3.jpg);}
.bg-boy4 {background-image: url(../../../images/static/valentinesday2020/bg-boy4.jpg);}
.bg-boy5 {background-image: url(../../../images/static/valentinesday2020/bg-boy5.jpg);}

.bg-girl1 {background-image: url(../../../images/static/valentinesday2020/bg-girl1.jpg);}
.bg-girl2 {background-image: url(../../../images/static/valentinesday2020/bg-girl2.jpg);}
.bg-girl3 {background-image: url(../../../images/static/valentinesday2020/bg-girl3.jpg);}
.bg-girl4 {background-image: url(../../../images/static/valentinesday2020/bg-girl4.jpg);}
.bg-girl5 {background-image: url(../../../images/static/valentinesday2020/bg-girl5.jpg);}

.bg-man {background-image: url(../../../images/static/valentinesday2020/bg-man.jpg);}
.bg-woman {background-image: url(../../../images/static/valentinesday2020/bg-woman.jpg);}
.sure{left: 50%; margin-left: -122px; bottom: 50px; z-index: 999;}
.save{left: 50%;     margin-left: -257px; bottom: 70px; z-index: 9999;}
.share-txt{top: 5px; right: 65px; z-index: 9999;}
.share-flash{
	animation: flash 2s 4;
}
.erweima{
	right: 90px;
    top: 60px;
}
.name,
.content{font-size: 30px; line-height: 50px; z-index: 999;
border: 0;
outline: none;
background-color: transparent;
color: #666;
}
.name{
    left: 200px;
    top: 168px;
}
.content{
	left: 90px;
    top: 271px;
    width: 450px;
    height: 250px;
}

.picture{
	left: 50%;
	top: 20px;
	margin-left: -250px;
	width: 500px;
	height: auto;
	z-index: 99999;
}
.picture img{
	width: 100%;
}

.tip{
	left: 0;
	bottom: 150px;
	font-size: 24px;
	width: 100%;
	height: 50px;
	color: #aaa;
	text-align: center;
	z-index: 99999;
}


@-webkit-keyframes circle {
	from { -webkit-transform: rotate(0deg);	}
	to {  -webkit-transform: rotate(360deg); }
}
@-moz-keyframes circle {
	from { -moz-transform: rotate(0deg);	}
	to {  -moz-transform: rotate(360deg); }
}
@-o-keyframes circle {
	from { -o-transform: rotate(0deg);	}
	to {  -o-transform: rotate(360deg); }
}
@keyframes circle {
	from {transform: rotate(0deg);	}
	to { transform: rotate(360deg); }
}







.arrow{left: 50%; bottom: 20px; margin-left: -19px; width: 39px; height: 33px; background: url(../../../../images/static/skp2016/m/dss-arr.png) no-repeat 0 0;
-webkit-animation: arrow 1s linear infinite;
-o-animation: arrow 1s linear infinite;
animation: arrow 1s linear infinite;
}
/* animate */
@-webkit-keyframes arrow{
  0%  { -webkit-transform: translateY(-40px); opacity: 1;}
  100%{ -webkit-transform: translateY(0px); opacity: 0.2;}
}
@keyframes arrow{
  0%  { transform: translateY(-40px); opacity: 1;}
  100%{ transform: translateY(0px); opacity: 0.2;}
}

html{
	/* background-color: red; */
	height: 100%;
}
body{
	height: 100%;
}

.swiper-container {
    width: 750px;
	height: 100%;
	background-color: sandybrown;
}
/* part1 */
.select{
	left: 50%;
	top: 50%;
	margin-left: -288px;
	margin-top: -170px;
	width: 576px;
	height: 369px;
	background: url(../../../images/static/valentinesday2020/select.png) no-repeat 0 0;
}
.start{
	left: 50%;
	top: 50%;
	margin-left: -134px;
	margin-top: 500px;

}
.man{
    left: 50%;
    top: 50%;
    margin-left: 10px;
    margin-top: -440px;
}
.woman{
    left: 50%;
    top: 50%;
    margin-left: -700px;
    margin-top: -400px;
}
.title{
    left: 50%;
    top: 50%;
    margin-left: -130px;
    margin-top: -510px;
}
.title-en{
    left: 50%;
    top: 50%;
    margin-left: -130px;
    margin-top: -470px;
}
.select-man{
    left: 0;
    top: 93px;
    width: 576px;
    height: 70px;
}
.select-woman{
    left: 0;
    top: 215px;
    width: 576px;
    height: 70px;
}
.selected{
	background: url(../../../images/static/valentinesday2020/selected.png) no-repeat 130px 50%;
}
/* 文字样式 */
.font{background-color: #fff; padding: 0px 20px; height: 40px; font-size: 30px; line-height: 40px;}
.font1{
	left: 0px;
	top: 40px;
}
.font2{
	left: 0px;
	top: 100px;
}
.font3{
	left: 0px;
	top: 160px;
}

.font4{
	right: 0px;
	bottom: 160px;
}
.font5{
	right: 0px;
	bottom: 100px;
}
.font6{
	right: 0px;
	bottom: 40px;
}
.font-strong{
	font-weight: bold;
}

/* 手按钮 */
.hand{
	width: 122px; height: 91px;
	left: 50%;
	top: 50%;
	margin-left: -70px;
	margin-top: -50px;
	background: url(../../../images/static/valentinesday2020/continue.png);
}
.hand1{
	width: 177px;
    height: 91px;
    left: 50%;
    top: 50%;
    margin-left: -111px;
    margin-top: 160px;
    background: url(../../../images/static/valentinesday2020/hand1.png);
}
.hand2{
	width: 177px; height: 85px;
	left: 50%;
	top: 50%;
    margin-left: 60px;
    margin-top: 130px;
	background: url(../../../images/static/valentinesday2020/hand2.png);
}

@-webkit-keyframes myFlash {
	50%, 100% {
	  opacity: 1;
	}
  
	0%, 25%, 75% {
	  opacity: 0;
	}
  }
  
  @keyframes myFlash {
	50%, 100% {
	  opacity: 1;
	}
  
	0%, 25%, 75% {
	  opacity: 0;
	}
  }
  
  .myFlash {
	-webkit-animation-name: myFlash;
	animation-name: myFlash;
  }


  .swiper-container2{
	left: 0%;
	top: 0%;
	width: 100%;
	height: 100%;
	overflow: hidden;
  }
  .swiper-prev{
	  left: 0;
	  top: 50%;
	  width: 89px;
	  height: 92px;
	  background: url(../../../images/static/valentinesday2020/left.png) no-repeat center center;
	  z-index: 999;
	  border: 0;
  }
  .swiper-next{
	right: 0;
	top: 50%;
	width: 89px;
	height: 92px;
	background: url(../../../images/static/valentinesday2020/right.png) no-repeat center center;
	z-index: 999;
	border: 0;
}
  .letter{
	left: 50%;
	top: 50%;
	margin-left: -341px;
	margin-top: -475px;
	width: 683px;
	height: 950px;
	background: url(../../../images/static/valentinesday2020/letter.png) no-repeat center center;
	z-index: 9999;
  }

/*music*/
.music{position: fixed; right: 20px; top: 20px; z-index: 99999;}
.play{width: 60px; height: 60px; background: url(../../../images/static/valentinesday2020/music.png) no-repeat center center;
animation: circle 5s infinite linear;
}
.pause{width: 60px; height: 60px; background: url(../../../images/static/valentinesday2020/music_no.png) no-repeat center center;}