@charset "utf-8";
/* CSS Document */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; list-style: none;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);  }
body { width: 100%; height:100%; font-size: 1rem; font-family:"STHeiti Light", "Microsoft YaHei", "Helvetica", "Arial", "Verdana", "sans-serif"; -webkit-font-smoothing: antialiased; overflow:hidden;}
/*去除a标签的虚线框*/
a {blr:expression(this.onFocus=this.blur()); outline: none; text-decoration:none;}
html { width: 100%; height:100%; font-size: 10px;}
h1,h2,h3,h4,h5,h6{ font-weight: normal;}
.fl{float:left;}
.fr{float:right;}
.clearfix{*zoom:1;}
.clearfix:before,.clearfix:after{display:table;line-height:0;content:"";}
.clearfix:after{clear:both;}
@media only screen and (min-width: 360px) {
    html {  font-size: 12px;  }
}
@media only screen and (min-width: 410px) {
    html {  font-size: 13px;  }
}
.none{ display:none;}

/*声音元件*/
#bgsound{ width:30px; height:30px; display:block; position:fixed; top:1rem; right:1rem; z-index:10;}
#sound_image{ width:2.4rem; height:2.4rem; background: url(../images/ccbg.png) no-repeat center; background-size:100% 100%; text-align:center; border-radius:50%; -webkit-border-radius:50%; }
#sound_image img{ width:48%; height:auto; margin:.5rem 0 0 .3rem; animation:rota both 1.8s ease-in-out infinite; -webkit-animation:rota both 1.8s ease-in-out infinite;}

/*加载动画*/
.loading {position: fixed;top: 0;left: 0;bottom: 0;right: 0;z-index: 99999;width: 100vw;height: 100vh;background-color: #fff;text-align: center;}
.loading .l-wrapper { position: absolute;top: 0; right: 0; bottom: 0; left: 0; width: 5rem; height: 5rem; margin: auto; text-align: center; }
.loading svg { height: 5rem; width: 5rem; margin: auto; overflow: visible; }
.loading .g-circles { -webkit-transform: scale(0.9) translate(7px, 7px); -ms-transform: scale(0.9) translate(7px, 7px); transform: scale(0.9) translate(7px, 7px); }
.loading .g-circles circle {  fill: #fff ; fill-opacity: 0; -webkit-animation: opacityLoad 1.2s linear infinite; animation: opacityLoad 1.2s linear infinite; }
.loading .g-circles circle:nth-child(12n + 1) { -webkit-animation-delay: -0.1s; animation-delay: -0.1s; }
.loading .g-circles circle:nth-child(12n + 2) { -webkit-animation-delay: -0.2s; animation-delay: -0.2s; }
.loading .g-circles circle:nth-child(12n + 3) { -webkit-animation-delay: -0.3s; animation-delay: -0.3s; }
.loading .g-circles circle:nth-child(12n + 4) { -webkit-animation-delay: -0.4s; animation-delay: -0.4s; }
.loading .g-circles circle:nth-child(12n + 5) { -webkit-animation-delay: -0.5s; animation-delay: -0.5s; }
.loading .g-circles circle:nth-child(12n + 6) { -webkit-animation-delay: -0.6s; animation-delay: -0.6s; }
.loading .g-circles circle:nth-child(12n + 7) { -webkit-animation-delay: -0.7s; animation-delay: -0.7s; }
.loading .g-circles circle:nth-child(12n + 8) { -webkit-animation-delay: -0.8s; animation-delay: -0.8s; }
.loading .g-circles circle:nth-child(12n + 9) { -webkit-animation-delay: -0.9s; animation-delay: -0.9s; }
.loading .g-circles circle:nth-child(12n + 10) { -webkit-animation-delay: -1s; animation-delay: -1s; }
.loading .g-circles circle:nth-child(12n + 11) { -webkit-animation-delay: -1.1s; animation-delay: -1.1s; }
.loading .g-circles circle:nth-child(12n + 12) { -webkit-animation-delay: -1.2s; animation-delay: -1.2s; }
.loading .g-circles circle {fill: #d3d1d0;}
@-webkit-keyframes opacityLoad { 3% { fill-opacity: 1; } 75% { fill-opacity: 0; } }
@keyframes opacityLoad { 3% { fill-opacity: 1; } 75% { fill-opacity: 0; }}

#abaSvg{
    -webkit-transition-property: -webkit-transform;
    -webkit-transition-duration: 1s;
    -webkit-animation: rotateSvg 3s linear infinite;
    animation: rotateSvg 3s linear infinite;
}
@-webkit-keyframes rotateSvg{ from{ -webkit-transform: rotate(0deg)} to{-webkit-transform: rotate(360deg)} }
@keyframes rotateSvg{ from{ transform: rotate(0deg)} to{transform: rotate(360deg)} }

/*版块*/
.section{ position: relative; background: #fff; overflow: hidden; }

/*背景大图*/
.pic-anim{-webkit-animation-play-state:paused;animation-play-state:paused; height: 100%; }
.active .pic-anim{-webkit-animation-play-state:running;animation-play-state:running; }

/*向上滑动图标*/
.ic_up{ display:block; width:70px; position:absolute; bottom:.7rem;text-align:center; margin-left:-35px; left:50%; z-index:1000; animation: upHid 1.6s both infinite; -webkit-animation:upHid 1.6s both infinite;}
.ic_up img{ display:block;width: 20px;height:26px;margin: 0 auto;}
.ic_up span{ display:block;margin-top:5px;font-size:1.2rem;}
@-webkit-keyframes upHid{
    0%{ -webkit-opacity:.1;  -webkit-transform:translateY(0); color:#fff;}
    50%{ -webkit-opacity:1;  -webkit-transform:translateY(-16px);color:#0cc;} 100%{ -webkit-opacity:.1; color:#22abf2;}
}
@keyframes upHid{
    0%{ opacity:.1; transform:translateY(0); color:#fff; }
    50%{ opacity:1; transform:translateY(-16px);color:#0cc; } 100%{ opacity:.1; color:#22abf2;}
}

/*右边图标*/
.right_icon,.book_icon{ position: absolute; top: 15%; right: 1.5rem; z-index: 10; width:3.2rem;text-align:center; }
.right_icon a,.book_icon a{ display: inline-block; width: 3.2rem; height: 3.2rem; vertical-align: top; margin-top: 1.5rem; line-height: 3.2rem;font-size: 1.1rem; color: #fff; text-align: center; background: url(../images/right_icon.png) no-repeat; background-size: 50% auto; -webkit-border-radius: 50%; border-radius: 50%;}
.right_icon .rt_icon1,.book_icon .rt_icon1{ background-color:rgba(0,0,0,.6); background-position: center .8rem; }
.right_icon .rt_icon2,.book_icon .rt_icon2{ background-color:rgba(0,0,0,.6); background-position: center -1.8rem; }
.right_icon .rt_icon3,.book_icon .rt_icon3{ background-color:rgba(0,0,0,.6); background-position: center -4.4rem; }
.right_icon .rt_icon4,.book_icon .rt_icon4{ background-color:rgba(0,0,0,.6); background-position: center -7rem; }
.right_icon .rt_icon5,.book_icon .rt_icon5{ background-color:rgba(0,0,0,.6); background-image: none }
.right_icon .rt_icon6,.book_icon .rt_icon6{ background-color:rgba(0,0,0,.6); background-image: none }
.book_icon{ position: relative; right: auto; top: 1.5rem; width: 100%; text-align: center;}
.book_icon a{ margin: 0 .3rem;}
.zan_num{display: inline-block;font-size: 1rem; color: #fff; padding-top: .3rem;-webkit-text-shadow: 1px 1px 3px rgba(0,0,0,.8); text-shadow: 1px 1px 3px rgba(0,0,0,.8);}
.right_icon .tm_close{background:url(../images/tmclose.png) no-repeat center;background-size:100% 100%;}
.right_icon .tm_close.curr{background:url(../images/tmclose1.png) no-repeat center;background-size:100% 100%;}

.active .book_icon .rt_icon1{ -webkit-animation: scrollR_L both .5s ease-in-out .2s; animation: scrollR_L both .5s ease-in-out .2s; }
.active .book_icon .rt_icon2{ -webkit-animation: scrollR_L both .5s ease-in-out .4s; animation: scrollR_L both .5s ease-in-out .4s; }
.active .book_icon .rt_icon3{ -webkit-animation: scrollR_L both .5s ease-in-out .6s; animation: scrollR_L both .5s ease-in-out .6s; }
.active .book_icon .rt_icon4{ -webkit-animation: scrollR_L both .5s ease-in-out .8s; animation: scrollR_L both .5s ease-in-out .8s; }
/*从右向左滚动出现*/
@-webkit-keyframes scrollR_L{ 0%{ -webkit-opacity:0; -webkit-transform:translateX(100px) rotate(1080deg);} 100%{ -webkit-opacity:1; -webkit-transform:translateX(0px) rotate(0deg);} }
@keyframes scrollR_L{ 0%{ opacity:0; transform:translateX(100px) rotate(1080deg);} 100%{ opacity:1; transform:translateX(0px) rotate(0deg);} }

.mainbg{width:100%;height:100%;position:relative;overflow:hidden;}
.fullcon{width:100%;height:100%;}
.lastTip{ position: absolute; bottom: 1.5rem; z-index: 2; width: 100%; font-size: 1rem; color: #ccc; text-align: center; }

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




/*page1*/
.ind_user{ position: absolute; left: 1.5rem; top: 1.6rem; z-index: 1; width: 5.4rem; height: 5.4rem; border: .25rem solid #fff;  -webkit-border-radius: 50%; border-radius: 50%;}
.ind_user > img{ width: 100%; height: 100%; vertical-align: top; -webkit-border-radius: 50%; border-radius: 50%;}
.ind_radio{ position: absolute; right: .4rem; bottom: 0; width: 2rem; height: 2rem; background: #fff url(../images/ind_radio.png) no-repeat center .4rem; background-size: 62% auto; -webkit-border-radius: 50%; border-radius: 50%;opacity:0; }
.ind_close{ background-position:  center -1.4rem;}
.ind_price{ margin: .4rem auto; font-size: 1.8rem; color: #fff; -webkit-text-shadow: 1px 1px 3px rgba(0,0,0,.4); text-shadow: 1px 1px 3px rgba(0,0,0,.4);}
.ind_label{ font-size: 0;}
.ind_label > span{ display: inline-block; height: 1.7rem; line-height: 1.7rem; margin: .8rem .5rem 0 0; padding: 0 .6rem; font-size: 1rem; color: #fff; border: .1rem solid #fff;
    -webkit-border-radius: 1.7rem; border-radius: 1.7rem; -webkit-text-shadow: 1px 1px 3px rgba(0,0,0,.4); text-shadow: 1px 1px 3px rgba(0,0,0,.4); -webkit-box-shadow: 1px 1px 3px rgba(0,0,0,.3); box-shadow: 1px 1px 3px rgba(0,0,0,.3);}
.ind_box{ margin-top: 1.4rem; font-size: 0; }
.ind_box > span{ line-height: 1.6rem; margin-right: 1.5rem; font-size: 1.6rem; color: #fff; -webkit-text-shadow: 1px 1px 3px rgba(0,0,0,.4); text-shadow: 1px 1px 3px rgba(0,0,0,.4);}
.ind_box > span img{ vertical-align: top; height: 1.4rem; margin: .1rem .3rem 0 0;}
/*page2*/
.about_lst{ width: 64%; margin: 8% auto auto 12%; }
.about_lst > li{ position: relative; padding: 0 0 5rem 16%; border-left:.1rem solid rgba(45,211,185,.4);}
.about_lst > li:last-child{ border-left: none;}
.icon{ position: absolute; text-align: center; background:#2dd3b9; -webkit-border-radius: 50%; border-radius: 50%;}
.icon img{ width: 45%; vertical-align: top; margin-top:1.2rem; }
.about_ico1{ left: -2.35rem; top: -.5rem; width: 4.8rem; height: 4.8rem; line-height: 4.8rem; }
.icon_small{ left: -3.6rem; top: -.3rem; width: 3.2rem; height: 3.2rem; line-height: 3.2rem; text-align: center;}
.icon_small img{ width: 50%; vertical-align: top; margin-top: .8rem;}
.about_tit{ line-height: 2.4rem; font-size: 1.8rem;color: #222;}
.abt_icon{ display: inline-block; width: 1.2rem ;height: 1.3rem; vertical-align: top; margin-right: .5rem; background: url(../images/about_img2.png) no-repeat; background-size: 100% auto;}
.abt_addr{ background-position: 0 -1.75rem; }
.abt_info{ line-height: 1.2rem; margin-top: .5rem; font-size: 1.2rem; color: #999;}
.abt_info span{ display: inline-block; vertical-align: top; max-width: 88%;}
.abt_info2{ line-height: 1.8rem; font-size: 1.4rem; color: #555;}
.abt_zan{ position: absolute; left: -1.2rem; top: -.5rem; display: inline-block; width: 2.4rem ;height: 2.4rem; line-height: 2.4rem; text-align: center; background-color: #fff;}
.abt_zan img{ vertical-align: top; width: 100%;}

.active .about_lst > li:nth-child(1){ -webkit-animation: fdIn_R both .5s ease-in-out .2s; animation: fdIn_R both .5s ease-in-out .2s; }
.active .about_lst > li:nth-child(2){ -webkit-animation: fdIn_R both .5s ease-in-out .4s; animation: fdIn_R both .5s ease-in-out .4s; }
.active .about_lst > li:nth-child(3){ -webkit-animation: fdIn_R both .5s ease-in-out .6s; animation: fdIn_R both .5s ease-in-out .6s; }
.active .about_lst > li:nth-child(4){ -webkit-animation: fdIn_R both .5s ease-in-out .7s; animation: fdIn_R both .5s ease-in-out .8s; }
/*从右出现*/
@-webkit-keyframes fdIn_R{ 0%{ -webkit-opacity:0; -webkit-transform:translateX(100%);} 100%{-webkit-opacity:1; -webkit-transform:translateX(0);} }
@keyframes fdIn_R{ 0%{ opacity:0; transform:translateX(100%);} 100%{ opacity:1; transform:translateX(0);} }

/*pg3*/
.intro_box{ position: absolute; left: 16.5%; bottom:16.7% ; z-index: 10; width: 77%;}
.intro_tit{position: relative;font-size: 1.9rem;color: #fff;-webkit-text-shadow: 1px 1px 3px rgba(0,0,0,.4);text-shadow: 1px 1px 3px rgba(0,0,0,.4);}
.intro_info{ font-size: 1.2rem; color: #fff; -webkit-text-shadow: 1px 1px 3px rgba(0,0,0,.4);  text-shadow: 1px 1px 3px rgba(0,0,0,.4); }

.active .intro_tit{ -webkit-animation: fdIn_D both .5s ease-in-out .2s; animation: fdIn_D both .5s ease-in-out .2s; }
.active .ind_price{ -webkit-animation: fdIn_D both .5s ease-in-out .3s; animation: fdIn_D both .5s ease-in-out .3s; }
.active .intro_info{ -webkit-animation: fdIn_D both .5s ease-in-out .4s; animation: fdIn_D both .5s ease-in-out .4s; }
.active .ind_label{ -webkit-animation: fdIn_D both .5s ease-in-out .5s; animation: fdIn_D both .5s ease-in-out .5s; }
.active .ind_box{ -webkit-animation: fdIn_D both .5s ease-in-out .6s; animation: fdIn_D both .5s ease-in-out .6s; }
/*从下出现*/
@-webkit-keyframes fdIn_D{ 0%{-webkit-opacity:0; -webkit-transform:translateY(100%);} 100%{-webkit-opacity:1; -webkit-transform:translateY(0);} }
@keyframes fdIn_D{ 0%{ opacity:0; transform:translateY(100%); } 100%{ opacity:1; transform:translateY(0);} }


/*9*/
.map_tit{ margin-top: 8.6%; font-size: 1.9rem; color: #2dd3b9; text-align: center;}
.map_addr{ margin-top: 1rem; font-size: 1.4rem; color: #555; text-align: center;}
.map_addr > label{ color: #999;}
.map_img{ position: relative; width: 100%; height: 50%; margin: 7% auto 0; -webkit-border-radius: 50%;  border-radius: 50%; overflow: hidden; }
.map_btn{ display: block; width: 75%; height: 3rem; line-height: 3rem; margin: 0 auto; font-size: 1.3rem; text-align: center; -webkit-border-radius: 3rem; border-radius: 3rem; overflow: hidden; }
.map_btn img{ height: 1.6rem; vertical-align: bottom; margin:5px;float:left}
.map_dz{ height: 30px;line-height:30px; min-height: 2rem; margin-top: 7%; color: #fff; background-color: #2dd3b9; border: .1rem solid #2dd3b9; cursor: default; }
.map_dz span{ display: inline-block;float:left; vertical-align: middle; max-width: 80%; line-height: 30px; margin-top: 0; font-size: 1.2rem; text-align: left;    text-overflow: ellipsis;  white-space: nowrap;  overflow: hidden;}
.map_nearby{ margin-top: 1.5rem; color: #2dd3b9; background-color: #fff; border: .1rem solid #2dd3b9; }
/*地图*/
#fullPage #allmap{ position: absolute; width: 100%; height: 100%; }
.amap-logo,.amap-copyright{ display: none!important; }
#fullPage .amap-marker{ width: 1px; height: 1px; }
#fullPage .amap-marker-label{margin-left: 14px; left: 50%!important;-webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); transform: translateX(-50%); top: 44px!important; padding: 0 3px; border: none; background-color: #ffb400; font-size: 1rem; line-height: 1.7rem; color: #fff; }
#fullPage .amap-marker-label:after{ position: absolute; left: 50%; bottom: 1.6rem; margin-left: -.35rem; border-bottom: .4rem solid #ffb400; border-right: .35rem solid transparent; border-top: .4rem solid transparent; border-left: .35rem solid transparent; content: ''; }
#fullPage .amap-icon, #fullPage .BMap_Marker > div { border-radius: 0; border: none; overflow: auto; }

/*10*/
.book_img,.buy_img{ width: 100%; overflow: hidden; object-fit: cover; }
.book_img > img,.buy_img > img{ vertical-align: top; width: 100%;}
.book_tit{ margin-top: 1rem; font-size: 1.8rem; color: #222; text-align: center;}
.book_price{ margin-top: .7rem; font-size: 2.3rem; color: #ff7000; text-align: center;}
.book_price i{font-size: 1.3rem;color:#999;text-decoration: line-through;}
.book_info{ width: 80%; line-height: 1.8rem; margin: .3rem auto 0; font-size: 1.2rem; color: #555; text-align:justify;display: -webkit-box;text-overflow: ellipsis;  overflow : hidden;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-line-clamp: 2;  -webkit-box-orient: vertical;}
.book_btn{ display: block; width: 75%; height: 4rem; line-height: 4rem; margin: 1.5rem auto 0; font-size: 1.8rem; color: #fff; text-align: center; background-color: #ff7000; -webkit-border-radius: .5rem; border-radius: .5rem;}
.book_time{margin-top:.7rem;font-size: 1.6rem; color: #666; text-align: center;}
.book_time img{margin: 0 .5rem}


/*11*/
.buy_user{ position: relative; z-index: 1; display: block; width: 9.5rem; height: 9.5rem; margin: -4.5rem auto 0; border: .2rem solid #fff; -webkit-border-radius: 50%; border-radius: 50%;}
.buy_user img{ width: 100%; height: 100%; vertical-align: top; -webkit-border-radius: 50%; border-radius: 50%; }
.buy_addr{ display: block; line-height: 1.9rem; margin-top: .6rem; padding: 0 1rem; font-size: 1.4rem; color: #999; text-align: center; }
.buy_addr img{ height:1.2rem; vertical-align: middle; margin-right: .5rem; }
.buy_box{ margin-top: .8rem; font-size: 0; text-align: center;}
.buy_box > a{ display: inline-block; vertical-align: top; height: 1.4rem; line-height: 1.4rem; padding: 0 2.5rem; font-size: 1.4rem; color: #999; }
.buy_box > a:first-child{ border-right: .1rem solid #ccc;}
.buy_box > a img{ height: 1.2rem; vertical-align: top; margin-right: .3rem;}
.buy_boss{ position: relative; width:81%; margin: .8rem auto 0; text-align: center;}
.buy_boss > i{ position: absolute; left: 0; bottom: .8rem; z-index: -1; display: block; width: 100%; height: .1rem; background-color: #d5d5d5;}
.buy_boss > span{ display: inline-block; line-height: 1.9rem; padding: 0 1rem; font-size: 1.6rem; color: #2dd3b9; background-color: #fff;}
.buy_boss > span img{ width: 1.6rem;}
.buy_mess{ width: 90%; margin: .6rem auto 0; line-height: 1.9rem; font-size: 1.4rem; color: #555; text-align: center; }
.tuans{ width: 100%; height: 100%; overflow: hidden; position: absolute; left: 0; top: 0; background-color: #fff; z-index: 3; display: block; }
.anone{ display:none!important; }
.ashow{ display:inline-block!important; }

/*评论弹窗*/
.online_tit{ position: relative; line-height: 2rem; padding: 1.2rem 1rem; font-size: 1.8rem; color: #2dd3b9; border-bottom: .1rem solid #d5d5d5;}
.online_tit img{ height: 2rem; vertical-align: top; margin-right: .5rem;}
.online_box{ padding: 1.4rem 1rem; border-bottom: .1rem solid #d5d5d5;}
.online_my{ line-height: 1.6rem; font-size: 1.4rem; color: #222;}
.online_my > i{ display: inline-block; vertical-align: top; height: 1.5rem; width: .3rem; margin-right: .5rem; background-color: #2dd3b9;}
.online_radio{ float: right;}
.online_radio img{ height:1.2rem; margin-top: .15rem; }
.online_text{ display: block; width: 100%; height: 14rem; margin-top: .8rem; padding: 0 1rem; font: 1.4rem/1.8rem "Microsoft YaHei"; resize: none; border: none; -webkit-box-sizing: border-box; box-sizing: border-box;}
.online_btn{ width: 95%; height: 4.4rem; margin: 1rem auto; background-color: #2dd3b9;}
.shadow{ position: fixed; left: 0; top: 0; z-index: 11; display: none; width: 100%; height: 100%; background-color: rgba(0,0,0,.5); }
.comment{ position: fixed; left: 0; bottom: 0; z-index: 12; display: none; width: 100%; background-color: #fff; }
.right_icon .is_icon1,.book_icon .is_icon1{ background-position: center -9.5rem; }
.online_tit span{ display: inline-block; max-width: 78%;}
.online_close{ position: absolute; right: 1rem; top: 1.7rem; display: inline-block; width: 1rem; height: 1rem; background: url(../images/close.png) no-repeat; background-size: 100% auto; }



#bg_h{display:none;}
#bg_v{display:block;}

.p-z-con {position:absolute;left:0;top:0;width:100%;height:100%;background-color:#fff;overflow:hidden;z-index:99;display:none;}
.map-button{ position:absolute;bottom:16%; width: 100%;}
.layoutbg{width:100%;height:100%;}
.over_map{ width:100%; height: 100%;}




/*新增语音样式*/
.voice{ position: absolute;left: 6.3rem; top: .7rem; display: inline-block; vertical-align: middle; padding: 0; margin: 0; width: 5rem; height: 3rem;line-height: 3rem; font-size: 0; background: rgba(0,0,0,.6); border-radius: .3rem; -webkit-border-radius: .3rem;box-shadow: 0 0  2px 0 #fff; }
.voice span{font-size: 1.4rem}
.voice .video_time{position:absolute;bottom:1.2rem;right:1rem;font-size: 1rem;line-height:.5rem;color:#fff;}
.voice_arr{ position: absolute; left: -.46rem; top: .9rem; display: inline-block; width: 0; height: 0; border-right: .5rem solid rgba(0,0,0,.6); border-top: .5rem solid transparent; border-bottom: .5rem solid transparent; }
.voice_dot{ position: absolute; right: -.3rem;top: -.3rem; display: inline-block;width: .8rem;height: .8rem;border-radius: 100%;background-color:#ff6633;}
.voice_img1{ height: .7rem; vertical-align: top; margin: 1.15rem 0 0 .5rem; }
.voice_img2{ height: 1.2rem; vertical-align: top; margin: .89rem 0 0 .05rem; }
.voice_img3{ height: 1.9rem; vertical-align: top; margin: .53rem 0 0 0; }
.voc_play .voice_img1{ -webkit-animation: fdIn2 both 1s infinite  ease-in-out; animation: fdIn2 both 1s infinite  ease-in-out;}
/*渐显*/
@-webkit-keyframes fdIn2{ 0%{ -webkit-opacity:0.4;} 100%{-webkit-opacity:1;} }
@keyframes fdIn2{ 0%{ opacity:0.4; } 100%{ opacity:1; } }
.voc_play .voice_img2{ -webkit-animation: fdIn both 1s infinite  ease-in-out .3s; animation: fdIn both 1s infinite  ease-in-out .3s;}
.voc_play .voice_img3{ -webkit-animation: fdIn both 1s infinite  ease-in-out .6s; animation: fdIn both 1s infinite  ease-in-out .6s;}
/*渐显*/
@-webkit-keyframes fdIn{ 0%{ -webkit-opacity:0.1;} 100%{-webkit-opacity:1;} }
@keyframes fdIn{ 0%{ opacity:0.1; } 100%{ opacity:1; } }

.btn_box{width: 80%;margin: .5rem auto 0;padding-top:1rem;border-top:1px dashed #3cc;}
.btn_box a{display: inline-block;float:left;width:50%;font-size: 1.4rem;color: #666;text-align:center;}
.btn_box a img{display:block;width:4.4rem;margin: 0 auto 1rem;border-radius:100%;}
.share_mask{position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index:9999;text-align:right;background:rgba(0,0,0,.7);}
.share_mask img{width: 84%;margin-right: 4%; }
.share_p{margin-top: .7rem; font-size: 1.2rem; text-align: center;}

/*弹幕*/
.barrage{position:fixed;top:0;left:0;z-index:9;width:100%;height:100%;pointer-events: none;}
.barrage .mask{position:relative;width:100%;height:100%;filter:alpha(opacity:1);z-index:1;overflow:hidden;}
.barrage .mask p{position:absolute;left:-9999px;display:inline-block;max-width:20rem;height: 2.4rem;padding: .1rem 1.5rem .05rem .1rem; background:rgba(0,0,0,.6);
    font-size:1.2rem;color:#fff; line-height:2.3rem;white-space:nowrap;z-index:40;border-radius:20rem;overflow: hidden;  text-overflow: ellipsis;  white-space: nowrap;  }
.barrage .mask img{display:inline-block;width:2rem;height:2rem;margin-right:.7rem; vertical-align: bottom;border-radius: 100%;border: .2rem solid #fff; }



@media screen and ( max-width:374px ) and (max-height:620px) {
    .map_dz span{ margin-top: -.2rem;}
    .voice_arr{ left: -.37rem; }
}

/*针对自带内置操作条的安卓手机*/
@media screen and (min-width:321px) and (max-width:390px) and (min-height:481px)and (max-height:567px){
    .map_dz span{ margin-top: -.2rem;}
    .voice_arr{ left: -.36rem; }
}

/*竖屏*/
@media screen and (max-aspect-ratio: 999/1000) {
    body{font-size:0.45em;}
    .pagination{left:100%;top:50%;}
}

/*横屏*/
@media screen and (min-aspect-ratio: 1/1)  {
    body{font-size:0.45em;}
    .pagination{left:50%;top:100%;}
}

/*大屏竖*/
@media screen and (min-height:768px) and (max-aspect-ratio: 999/1000) {
    .mainbg{width:320px;height:504px;padding:30px 40px;border-radius:20px;background:#111;border:3px solid white;margin: 5px auto;box-shadow: 0 0 5px #000;}
}

/*大屏横*/
@media screen and (min-width:768px) and (min-aspect-ratio: 1/1)  {
    .mainbg{width:504px;height:320px;padding:30px 40px;border-radius:20px;background:#111;border:3px solid white;margin: 5px auto;box-shadow: 0 0 5px #000;}
}