@charset "utf-8";
.newsbox{
          width: 570px;
          height: 455px;
          background: rgba(255, 255, 255, 0.1);
          box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
          position:absolute;
          left: calc(50% - 278px);
          top: calc(50% - 200px);
          z-index:200;
          -webkit-animation: news 2s;
          -moz-animation: news 2s;
          -ms-animation: news 2s;
          -o-animation: news 2s;
          animation: news 2s;
          }
.newsboxcon{width:98%;height:98%;display:block;margin: 1% 0 0 1%;position:relative;background: #f1f1f1;}

.poptext{
	      width:96%;
	      height:96%;
	      display:block;
	      position:absolute;
	      top:2%;
	      left:2%;
	      background:#FFF;
	      overflow:hidden;
	      line-height: 24px;
	      font-size: 14px;
	      border: 1px solid #333;
	      border-radius: 0;
	      }
.poptext b{display: block;padding: 2% 3%;font-size: 20px;font-weight: bold;color: #fff;background: #333;}
.poptext p{ display: block; padding: 3%}
.poptext i{ text-align: right; font-style: normal; display: block; margin-top: 2em; }

.popclose{width:30px;height:30px;display:block;position:absolute;top: 19px;right:20px;z-index: 100;}
.popclose a{ width:30px; height:30px; display:block; background:url(../images/close.png) no-repeat}
.popclose a:hover{ background:url(../images/closeon.png) no-repeat}
.newsboxcon ol{
	margin-left: 39px;
}
.newsboxcon ol li{
	list-style: decimal;
}
@-webkit-keyframes news{0%{top:-1200px;}50%{top:-1200px;}100% {top:calc(50% - 240px);}}
@-moz-keyframes news{0%{top:-1200px;}50%{top:-1200px;}100% {top:calc(50% - 240px);}}
@-ms-keyframes news{0%{top:-1200px;}50%{top:-1200px;}100% {top:calc(50% - 240px);}}
@-o-keyframes news{0%{top:-1200px;}50%{top:-1200px;}100% {top:calc(50% - 240px);}}
@keyframes news{0%{top:-1200px;}50%{top:-1200px;}100% {top:calc(50% - 240px);}}

.newsmask{ width:100%; height:100%; background:#FFF; display:block; opacity:.6; position:absolute; top:0; left:0; z-index:199;
          -webkit-animation: newsmask 1s ;
          -moz-animation: newsmask 1s ;
          -ms-animation: newsmask 1s ;
          -o-animation: newsmask 1s ;
          animation: newsmask 1s ;}
@-webkit-keyframes newsmask{0%{opacity:0;}50%{opacity:0;}100% {opacity:.6;}}
@-moz-keyframes newsmask{0%{opacity:0;}50%{opacity:0;}100% {opacity:.6;}}
@-ms-keyframes newsmask{0%{opacity:0;}50%{opacity:0;}100% {opacity:.6;}}
@-o-keyframes newsmask{0%{opacity:0;}50%{opacity:0;}100% {opacity:.6;}}
@keyframes newsmask{0%{opacity:0;}50%{opacity:0;}100% {opacity:.6;}}

@media (max-width: 580px) { 
    .newsbox{
	  width: 90%;
	  height: 80%;
	  top:50%;
      left: 50%;
      transform: translate(-50%, -50%);	  
	}
	.popclose {
		width: 20px;
		height: 20px;
		top: 15px;
	}

}