@charset "utf-8";
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,
details,figcaption,figure,footer,header,menu,nav,section{margin:0;padding:0}
article,aside,details,figcaption,figure,footer,header,menu,nav,section { display:block; }
table{border-collapse:collapse;border-spacing:0}
audio,canvas,video { display: inline-block;*display: inline;*zoom: 1;}
fieldset,img{border:0}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}
ol,ul{list-style:none}
caption,th{text-align:left}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;margin:0;padding:0;}
q:before,q:after{content:''}
abbr,acronym{border:0;font-variant:normal}
sup{vertical-align:text-top}
sub{vertical-align:text-bottom}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit}
input,textarea,select{*font-size:100%}
body{background:#fff;-webkit-text-size-adjust:none; font-family:'\5FAE\8F6F\96C5\9ED1';}
a{text-decoration:none;blr:expression(this.onFocus=this.blur());outline:none;}
html{-webkit-tap-highlight-color:rgba(0,0,0,0);}
a:hover{ text-decoration:none;}
.clearfix:after{content:" "; clear:both; height:0; visibility:hidden; display:block;}
.clearfix{*zoom:1;}
.hide{height:0; line-height:0; font-size:0; visibility:hidden; display:none;}
html{font-size:100px;}
body,html{width:100%;height:100%;}
html,body{overflow:hidden;height:100%;font-size:100px;margin:0;padding:0;}
img{width: 100%; height: auto;}
/* main page */
.main-part{background:#ffcc30 url("//game.gtimg.cn/images/yxzj/cp/a20181025poetry/main_bg.jpg") top center no-repeat; background-size: 100% auto; width: 100%; height: 100%; position: relative;}
.main-part .main-tit{width: 100%; height: 2.48rem;}
.main-part .main-tit img{width: 100%;}
.main-part .open-btn{ background: url("//game.gtimg.cn/images/yxzj/cp/a20181025poetry/main_open.png") no-repeat; background-size: 1.99rem auto;  width: 1.99rem; height: 2.02rem; margin: 0 auto; display: block; position: relative; z-index: 2;}
.main-part .main-role{ width: 3.93rem; height: 5.69rem; position: absolute; left: 1.21rem; top: 4.28rem;}

/* end page */
.end-part{font-size: 0.24rem;}
.end-part,.p_slide_end{background:#502426 url("//game.gtimg.cn/images/yxzj/cp/a20181025poetry/end_bg.jpg") top center no-repeat; background-size: 100% auto; width: 100%; height: 100%; position: relative;}
.end-part .main-tit{width: 100%; height: 2.48rem;}
.end-part .main-tit img{width: 100%;}
.end-part .start-btn{ background: url("//game.gtimg.cn/images/yxzj/cp/a20181025poetry/end_start.png") no-repeat; background-size: 1.95rem auto;  width: 1.95rem; height: 2.03rem; margin: 0 auto; display: block; position: relative; z-index: 2;}
.end-part .end-img{ width: 100%; height: 3.6rem; margin: 0 auto; padding-top: 0.24rem; }
.end-txt{ color: #f8b337; text-align: center; padding-top: 0.5rem;}

/*index page*/
.index-con{width: 100%; height:100%; overflow:hidden;  position: relative; display: none;}
.swiper-container,.content{ width: 100%;  height:100%; }
.swiper-slide {  font-size:.24rem; color: #000;  }
.mid{width: 100%; height: 10rem; position: absolute; left: 0; top: 50%; margin-top: -5rem;  font-family:'\5FAE\8F6F\96C5\9ED1';}
/*------- p_slide1 ------*/
.p_slide1{background: #ffcc30;}
.slide-con{background: #fff; width: 5.2rem; height: 4.1rem; margin: 0 auto; padding: 0.4rem 0.3rem; position: relative;}
.slide-con .user-top{ width: 100%;}
.slide-con .user-top .user{ width: .83rem; height: .83rem; border:2px #ffcc30 solid; display: inline-block; vertical-align: middle;}
.slide-con .user-top .area{ width: 3.8rem; margin-left: 0.2rem; display: inline-block;vertical-align: middle;}
.slide-con .user-top p{color: #e2b732;}
.slide-con .user-top .a-address{ font-size: .26rem;line-height: .28rem; }
.slide-con .user-top .a-name{font-size: .5rem; line-height: .5rem; font-weight: bold; }
.slide-con .slide-txt{ width: 5rem; height: 2.55rem; margin: 0 auto;  padding-top: 0.3rem; }
.arrow{background: url("//game.gtimg.cn/images/yxzj/cp/a20181025poetry/arrow.png") no-repeat; background-size: 0.97rem auto; width: 0.97rem; height: 0.7rem; display: block; position: absolute;}
.btn_next{     right: 0.14rem;  bottom: 0.14rem;}
.plan-box{width: 100%; height: auto; position: relative;}
.plan-box .plan-txt{width: 100%; height: 4rem; margin: 0.35rem auto 0;}
.plan-box .plan-user{width: 0.71rem; height: 0.71rem; border:2px #19170f solid; position: absolute;  right: 0.28rem;  top: 2.84rem;}
.p_slide1 .plan-box .plan-user{top: 3rem;}
.share_btn{ background: url("//game.gtimg.cn/images/yxzj/cp/a20181025poetry/share_btn1.png") no-repeat; background-size: 2.2rem auto; width: 2.2rem; height: 0.44rem; position: absolute; left: 0.26rem; bottom: 0.2rem; }

.p_slide2,.p_slide6{ background: #6284e4;}
.p_slide2 .slide-con .user-top .user,.p_slide6 .slide-con .user-top .user{ border: 2px #6284e4 solid; }
.p_slide2 .slide-con .user-top p,.p_slide6 .slide-con .user-top p{color: #6284e4;}
.p_slide2 .plan-box .plan-user,.p_slide6 .plan-box .plan-user{border: 2px #3e67db solid; top: 2.75rem;}
.p_slide2 .arrow,.p_slide6 .arrow{ background-position: 0 -0.7rem;}
.p_slide2 .share_btn,.p_slide6 .share_btn{ background: url("//game.gtimg.cn/images/yxzj/cp/a20181025poetry/share_btn2.png") no-repeat; background-size: 2.2rem auto;}

.p_slide3,.p_slide7 { background: #ff73ab;}
.p_slide3 .slide-con .user-top .user,.p_slide7 .slide-con .user-top .user{ border:2px #ff73ab solid; }
.p_slide3 .slide-con .user-top p,.p_slide7 .slide-con .user-top p{color: #ff73ab;}
.p_slide3 .plan-box .plan-user,.p_slide7 .plan-box .plan-user{border: 2px #fa4990 solid;}
.p_slide7 .plan-box .plan-user{top: 2.76rem;}
.p_slide3 .arrow,.p_slide7 .arrow{ background-position: 0 -1.4rem;}
.p_slide3 .share_btn,.p_slide7 .share_btn{ background: url("//game.gtimg.cn/images/yxzj/cp/a20181025poetry/share_btn2.png") no-repeat; background-size: 2.2rem auto;}

.p_slide4,.p_slide9 { background: #57a568;}
.p_slide4 .slide-con .user-top .user,.p_slide9 .slide-con .user-top .user{ border: 2px #57a568 solid; }
.p_slide4 .slide-con .user-top p,.p_slide9 .slide-con .user-top p{color: #57a568;}
.p_slide4 .plan-box .plan-user,.p_slide9 .plan-box .plan-user{border: 2px #228738 solid; top: 3.04rem;}
.p_slide4 .arrow,.p_slide9 .arrow{ background-position: 0 -2.8rem;}
.p_slide4 .share_btn,.p_slide9 .share_btn{ background: url("//game.gtimg.cn/images/yxzj/cp/a20181025poetry/share_btn2.png") no-repeat; background-size: 2.2rem auto;}

.p_slide5 { background: #ffcc30;}
.p_slide5 .slide-con .user-top .user{ border: 2px #ffcc30 solid; }
.p_slide5 .slide-con .user-top p{color: #e2b732;}
.p_slide5 .plan-box .plan-user{border:2px #e4b72e solid; top: 2.75rem;}
.p_slide5 .arrow{ background-position: 0 0;}
.p_slide5 .share_btn{ background: url("//game.gtimg.cn/images/yxzj/cp/a20181025poetry/share_btn1.png") no-repeat; background-size: 2.2rem auto;}

.p_slide8,.p_slide10 { background: #a568ea;}
.p_slide8 .slide-con .user-top .user,.p_slide10 .slide-con .user-top .user{ border: 2px #a568ea solid; }
.p_slide8 .slide-con .user-top p,.p_slide10 .slide-con .user-top p{color: #a568ea;}
.p_slide8 .plan-box .plan-user,.p_slide10 .plan-box .plan-user{border: 2px #8a4ccf solid; top: 2.76rem;}
.p_slide10 .plan-box .plan-user{top: 3.04rem;}
.p_slide8 .arrow,.p_slide10 .arrow{ background-position: 0 -2.1rem;}
.p_slide8 .share_btn,.p_slide10 .share_btn{ background: url("//game.gtimg.cn/images/yxzj/cp/a20181025poetry/share_btn2.png") no-repeat; background-size: 2.2rem auto;}


/*canvas分享弹窗*/
.pop{position:fixed;top:0;left:0;width:100%;height:100%;z-index:10000; font-size:0;font-family:'\5FAE\8F6F\96C5\9ED1'; text-align:center;display:none;}
.pop::before{content:"";display:inline-block;font-size:0;width:0;height:100%;vertical-align:middle;}
.pop-overlay{position:absolute;width:100%;height:100%;top:0;left:0;background:rgba(0,0,0,0.8);}
.pop .btn-close{width:0.59rem; height:0.64rem; position:absolute; background: url("//game.gtimg.cn/images/yxzj/cp/a20181025poetry/btn-close.png") no-repeat; background-size:100% auto; top:0;right:0; }
.pop .pop-con{width:100%; height: 10rem;  font-size: 0.3rem;  z-index: 1000;  vertical-align:middle; display:inline-block;position:relative; text-align: center; overflow: hidden;}
.pop .pop-con .canvas_div,.pop .pop-con .canvas_div .canvas,.share_img,.tips_center{width:100%;height: 10rem; }
.pop .pop-con .share-save{width:100%; height:0.9rem; position:absolute; left: 0; bottom:0; background: url("//game.gtimg.cn/images/yxzj/cp/a20181025poetry/share_save1.png") no-repeat; background-size:100% auto;}
.tips_center p{color:#000;font-size:0.3rem; width:100%;text-align:center; line-height:7rem;}
.save-txt{ color: #ffcc30; font-size: 0.22rem; text-align: left; z-index: 2; position: absolute; width: 100%; left: 0.68rem; top: 4.61rem;}

/*animation*/
.main-tit,.ani-a,.main-role{ opacity: 0; }
.main-tit{  -webkit-animation:fadeDown .4s .2s ease both;  animation:fadeDown .4s .2s ease both;}
.main-role{-webkit-animation:btnshow 0.1s 0.2s linear forwards; animation:btnshow 0.4s 0.2s linear forwards;}
.ani-a{  -webkit-animation:fadeIn 1s .2s ease both;  animation:fadeIn 1s .2s ease both;}
.ani-a .open-btn,.start-btn{animation:findenlarge 1s ease-in-out infinite alternate;-webkit-animation:findenlarge 1s ease-in-out infinite alternate; }

.swiper-slide-active .btn_next{-webkit-animation: btnnext .6s .2s  ease-out infinite alternate; animation: btnnext .6s .2s  ease-out infinite alternate;}
.share_btn{-webkit-animation: pulse_loop 1s .8s ease infinite;animation: pulse_loop 1s .8s ease infinite;}
@-webkit-keyframes fadeIn{ 0%{opacity:0} 100%{opacity:1} }
@keyframes fadeIn{ 0%{opacity:0} 100%{opacity:1} }
@keyframes findenlarge{
	from{transform: scale(0.8);}
	to{transform: scale(1)}
}
@-webkit-keyframes findenlarge{
	from{transform: scale(0.8);}
	to{transform: scale(1)}
}
@-webkit-keyframes fadeDown{
	0%{opacity:0;  -webkit-transform:translateY(-.2rem)}
	100%{opacity:1;  -webkit-transform:translateY(0)}
}
@keyframes fadeDown{
	0%{opacity:0;  transform:translateY(-.2rem)}
	100%{opacity:1;  transform:translateY(0)}
}
@-webkit-keyframes btnshow {
	0%{opacity: 0;-webkit-transform:translateY(0.3rem);}
	100%{opacity:1;-webkit-transform:translateY(0);}
}
@keyframes btnshow {
	0%{opacity: 0;transform:translateY(0.3rem);}
	100%{opacity:1;transform:translateY(0);}
}
@-webkit-keyframes pulse_loop{0%{-webkit-transform:scale(1);}50%{-webkit-transform:scale(1.02)}100%{-webkit-transform:scale(1)} }
@keyframes pulse_loop{0%{transform:scale(1);}50%{transform:scale(1.02)} 100%{transform:scale(1)}}
@-webkit-keyframes btnnext {
	0%{-webkit-transform: translate(-.12rem,0);}
	100%{-webkit-transform: translate(0,0);}
}
@keyframes btnnext {
	0%{transform: translate(-.12rem,0);}
	100%{transform: translate(0,0);}
}


@media all and (orientation:landscape) and (min-width:420px){
	html,body  { position:relative; overflow:hidden;width:100%; height:100%;padding:0;margin:0;}
	html::before {content: ""; position:fixed; top:0; left:0; height:100%; width:100%; background:rgba(0,0,0,0.9); z-index:10002; }
	html::after {content: "为了更好的体验，请将手机/平板竖过来";position:absolute; top:50%; left:0; height:30px; width:100%; margin-top:40px; z-index:10002; text-align:center; font-size:16px; color:#fff;  }
	body::before  { content: ""; position:absolute; z-index:10002; height:200px; width:100px; left:50%; top:30%; margin:-110px 0 0 -50px; color:#fff;
		-webkit-transform: rotate(-90deg);transform: rotate(-90deg);
		background: url("//game.gtimg.cn/images/yxzj/cp/a20181025poetry/tis.png") no-repeat;background-position:center center; background-size:100px auto;}
}