* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; max-height: 999999px; }
html{background:#5c0f12;}
body{ margin:0;padding:0; width:100%; margin:auto; max-width:750px; overflow-x:hidden;}
html,body {position: relative;height:100%;color:#fff;}
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:#fff;}
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;}
.swiper-container-vertical>.swiper-scrollbar { right: -1000px; }
.swiper-container {  width: 100%;  height: 100%; }
.swiper-slide { position: relative; overflow: hidden;}
.layer{ position: absolute; width: 100%; height: 100%; left: 0; top: 0;}
.pa_btm { width: 100%; bottom: 0;}
.arrow {  position: absolute; left: 50%; margin-left: -35px; bottom: 15px; width: 70px;  height: 38px;  background: url("../../../../images/static/lange2021/m/arrow.png") no-repeat;  -webkit-animation: arrow 1s linear infinite;  animation: arrow 1s linear infinite;  z-index: 999; }
/*loading*/
.loading{position: fixed; left: 50%; top: 0; width: 750px; margin-left: -375px; height: 100%; z-index: 999; color:#cebc9c; text-align: center; background-color: #5c0f12;}
.loading_logo { top: 360px; left: 233px;}
.range-tip{ position: absolute;left: 50%; margin-left: -375px; top: 660px; font-size: 36px; text-align: center; width: 100%; }
.loading_dot {  width: 100%; left: 0; top: 550px; text-align: center; font-size: 36px;}
.loading_dot i,.loading_dot em,.loading_dot b {animation:loading_dot 0.5s linear infinite both; font-weight: 100;}
.loading_dot i { animation-delay: 300ms;}
.loading_dot em { animation-delay: 200ms;}
.loading_dot b { animation-delay: 100ms;}
@-webkit-keyframes loading_dot {
  from { opacity: 0}
  to { opacity: 1}
}
@keyframes loading_dot {
  from { opacity: 0}
  to { opacity: 1}
}
.progress_bar{  width: 450px;  height: 8px;  background: #d2d2d2;  position: absolute;  top:616px;  left:50%;  margin-left: -225px; border-radius: 4px;}
.progress_bar span{  float: left;  height: 100%;  background: #cebc9c;border-radius: 4px;}
/*swiper*/
.index_title{ left: 114px; top: 2%;}
.index_watch_left { top: 30%; left: 106px;}
.index_watch_right { top: 30%; right: 112px; margin-top: 50px;}
.index_foot{ bottom: 0; left: 0;}
.index_arrow { bottom: 165px; width: 100%;}
.p1 ul{top: 6%; width: 100%;}
.p1 ul li { width: 100%; text-align: center; font-size: 30px; line-height: 72px;}
.p1 ul li span { font-size: 36px; color: #cebc9c; font-weight: bold;}

.p2_title,.p3_title,.p9_title{ top:4%; left: 0;}
.p2_watch { width: 100%; top: 22%; left: 0;}
.p2_watch i{ font-size: 24px; padding-left: 26px; width: 200px; }
.p2_watch i::before{ content: ""; position: absolute; top: 10px; left: 0px;  width: 14px;height: 14px; border-radius: 7px; background-color: #edcfac;}
.p2_watch i::after{ content: ""; position: absolute; left: 3px; top: 13px; display: inline-block; width: 8px;height: 8px; border-radius: 4px; background-color: #ca915f;}
.p2_watch_0{ top: 10px; left: 210px;}
.p2_watch_1{ top: 5px; left: 40px;}
.p2_watch_1 i{left: 0;bottom: -50px;}
.p2_watch_2{ top: 25px; left: 560px;}
.p2_watch_2 i{left: 6px;bottom: -50px;}
.p2_watch_3{ top: 346px; left: 25px;}
.p2_watch_3 i{left: 15px;bottom: -40px;}
.p2_watch_4{ top: 365px; left: 536px;}
.p2_watch_4 i{left: -15px;bottom: -44px;}
.p2_watch_5{ top: 645px; left: 132px;}
.p2_watch_5 i{left: 157px;bottom: 77px; width: 400px;}
.h4_title { width: 100%;font-size: 40px; color: #cebc9c; text-align: center; top: 4%; margin-top: 180px; font-weight: 500;}

.p3_bg{ background: url("../../../../images/static/lange2021/m/p3_bg.jpg") bottom center; background-size: cover;}
.p3_watch_left{top: 26%; left: 100px;}
.p3_watch_right{top: 26%; right: 110px; margin-top: 42px;}
.p4_watch1{ width: 100%; height: 62%; top: 20%; left: 0; object-fit: cover;}
.p4_watch_tag { width: 324px; height:88px; background-color: #5c0f12; left: 24px; top: 82%; margin-top: -38px; line-height: 76px; padding-left: 52px;font-size: 40px;color: #cebc9c;}
.p4_watch_tag::before{ content: ""; position: absolute; width: 16px;height: 45px; background-color: #cebc9c; left: 18px;top: 12px;}
.p4_jixin1{bottom:8%; right: 23px;}
.p4_jixin2 {bottom:14%; right: 23px;}
.p4_watch_desc { bottom: 24%; left: 23px; width: 410px; }
.p4_watch_desc em{ font-size: 20px; color: #cebc9c; display: block;}
.p4_watch_desc span { display: block; font-size: 18px; line-height: 24px;margin-top: 5px;text-align: justify;}
.p4_watch_plus { width: 46px;height: 46px;border-radius: 50%; background-color: rgba(206,188,156,0.4); text-align: center; animation: scale 1s linear infinite alternate;-webkit-animation: scale 1s linear infinite alternate;}
.p4_watch_plus i{ display: inline-block;width: 32px; height: 32px; margin-top: 7px; border-radius: 50%; background: url(../../../../images/static/lange2021/m/i_plus.png) center no-repeat #cebc9c;}
.p4_jixin1 .p4_watch_plus {left: 239px;top: 246px;}
.window{ display: none; bottom: 11%; left: 125px;width: 495px;height: 263px; border:1px solid #c3ae91;border-radius: 10px; background-color: rgba(49,49,49,0.92); z-index: 2;}
.window p { font-size: 22px; line-height: 34px; color: #cebc9c; margin: 70px 55px 0;}
.window p.more {margin: 40px 35px 0;}
.window_close { width: 46px;height: 43px; top:0; right: -2px;background: url(../../../../images/static/lange2021/m/win_close.png);}
.p4_jixin2 .p4_watch_plus {left: 50%; margin-left: -23px; bottom:-60px;}

.swiper-button-prev{ left: 40px; width: 39px; height: 28px;background: url(../../../../images/static/lange2021/m/prev.png);-webkit-animation:prev 0.5s infinite alternate both;animation:prev 0.5s infinite alternate both;}
.swiper-button-next{ right: 40px; width: 39px; height: 28px;background: url(../../../../images/static/lange2021/m/next.png);-webkit-animation:next 0.5s infinite alternate both;animation:next 0.5s infinite alternate both;}



.p5_bg{ background: url("../../../../images/static/lange2021/m/p5_bg.jpg") bottom center; background-size: cover;}
.p5_watch_left{top: 26%; left: 115px;}
.p5_watch_right{top: 26%; right: 74px; margin-top: -5px;}

.p7_bg{ background: url("../../../../images/static/lange2021/m/p7_bg.jpg") bottom center; background-size: cover;}
.p7_watch_left{top: 26%; left: 106px;}
.p7_watch_right{top: 26%; right: 90px; margin-top: 25px;}

.p9_scroll { top:26%; width: 100%; height: 650px; overflow: visible;}
.p9_scroll .swiper-slide { overflow: visible;}
.p9_scroll .swiper-slide img{ display: block; margin-left: auto;margin-right: auto;}
.p9_scroll .swiper-slide span{ color: #fff; font-size: 26px; display: block; text-align: center;margin-top: 120px; font-weight: bold;}
.p9_scroll .swiper-slide span i {font-size: 22px; font-weight: normal;}

.show-focus-point{ width: 100%; top: 700px; text-align: center;}
.show-focus-normal{ width: 20px; height: 20px; border:1px solid #cebc9c; border-radius: 10px; display: inline-block; margin: 0 18px;}
.show-focus-active{background-color: #cebc9c;}

.share_arow{top:10px; right: 75px;}
.share_logo{ top: 25%; left: 255px;}
.share_bg {top: 25%; margin-top: 95px;}

@-webkit-keyframes prev {
  from { -webkit-transform: translateX(0);}
  to { -webkit-transform: translateX(-10px);}
}
@keyframes prev {
  from { transform: translateX(0);}
  to { transform: translateX(-10px); }
}
@-webkit-keyframes next {
  from { -webkit-transform: translateX(0);}
  to { -webkit-transform: translateX(10px); }
}
@keyframes next {
  from { transform: translateX(0);}
  to { transform: translateX(10px); }
}

@-webkit-keyframes scale {
  from { -webkit-transform: scale(0.8);}
  to { -webkit-transform: scale(1.1);}
}
@keyframes scale {
  from { transform: scale(0.8); }
  to { transform: scale(1.1); }
}

@-webkit-keyframes arrow {
    0%{bottom: 20px;}
    50%{bottom: 65px;}
    100%{bottom: 20px;}
}

@keyframes arrow {
  0%{bottom: 20px;}
  50%{bottom: 65px;}
  100%{bottom: 20px;}
}

.visibility{visibility: hidden;position: absolute;z-index: -1;}
/*swiper-end*/


@keyframes circle {
    0% {-webkit-transform: rotate(0deg);}
    100% {-webkit-transform: rotate(360deg);}
}

/*iphone <6s-safari*/
@media screen and (max-height: 1200px) {
  .p9_scroll{ top: 20%;}
}
/*iphone >X*/
@media screen and (min-height: 1350px) {
  .p1 ul{top: 10%; width: 100%;}
}