*{ box-sizing: border-box;  margin:0;padding:0;  outline:none;}
body,th,td,input,select,textarea,button {font-family: "PingFang SC",'HarmonyOS',  "Open Sans",  "Microsoft YaHei";color:#333; line-height: 1.5;} /* 重置页面文字属性 */
/*body,th,td,input,select,textarea,button {font-family: Swiss721BT-Roman, "苹方", "微软雅黑", arial;color:#333} */
fieldset,img {border:0 none}  /* 重置fieldset（表单分组）、图片的边框为0*/
dl,ul,ol,menu,li {list-style:none}   /* 重置类表前导符号为onne,menu在HTML5中有效 */
blockquote, q {quotes: none}   /* 重置嵌套引用的引号类型 */
blockquote:before, blockquote:after,q:before, q:after {content:'';content:none}  /* 重置嵌套引用*/
input,select,textarea,button {vertical-align:middle;resize:none;-webkit-appearance: none !important;outline: none; border:none; background:transparent;}  /* 重置表单控件垂直居中*/
button { cursor:pointer}  /* 重置表单button按钮效果 */
a {color:#333;text-decoration:none;border:0 none;}  /* 重置链接a标签 */
address,caption,cite,code,dfn,var {font-style:normal;font-weight:normal}  /* 重置样式标签的样式 */
caption {display:none;}    /* 重置表格标题为隐藏 */
table {border-collapse:collapse;border-spacing:0;}    /* 重置table属性 */
img{ border:0 none; max-width: 100%; vertical-align: middle; transition:all .6s ; -webkit-transition:all .6s ; -moz-transition:all .6s ; -ms-transition:all .6s ; -o-transition:all .6s ; }  /* 图片在当前行内的垂直位置 */
a img{border:0 none;}
i{font-style:normal;}
h3,h4,h5,h6{ font-weight: normal;}
table{margin:5px auto;width:100%;}
table,tr,td,th {border: 1px solid #bbb;padding: 0.4rem;border-collapse: collapse;text-align:center;}
table{ max-width: 100%;}
/* 取消a标签点击后的虚线框 */
a {outline: none;color: inherit;-webkit-tap-highlight-color: transparent; -webkit-touch-callout: none;  -webkit-user-select: none;}  
::-webkit-scrollbar {width:5px;background-color: #F5F5F5;}
/* 滚动槽 */::-webkit-scrollbar-track { border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; -ms-border-radius:0; -o-border-radius:0; }
/* 滚动条滑块 */::-webkit-scrollbar-thumb { border-radius:0; background:#004394; -webkit-border-radius:0; -moz-border-radius:0; -ms-border-radius:0; -o-border-radius:0; }
/*清除浮动*/
.fl{ float:left;}
.fr{ float:right;}
.clear10{height:10px;overflow:hidden;clear:both;}
.clear20{height:20px;overflow:hidden;clear:both;}
.clear30{height:30px;overflow:hidden;clear:both;}
.clear40{height:40px;overflow:hidden;clear:both;}
.clear15{height:15px;overflow:hidden;clear:both;}
.clearfix:after {content: "";display: block;clear: both;width: 100%;height: 0;line-height: 0;font-size: 0;}

.jumpUrl{ cursor: pointer;}

/* input 的 placeholder*/
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {color:#999;}
input:-moz-placeholder, textarea:-moz-placeholder {color:#999;}
input::-moz-placeholder, textarea::-moz-placeholder {color:#999;}
input:-ms-input-placeholder, textarea:-ms-input-placeholder {color: #999;}

/* padding */
.pt-5{ padding-top: 5px;}
.pl-5{ padding-left: 5px;}
.pr-5{ padding-right: 5px;}
.pb-5{ padding-bottom: 5px;}
.p5{ padding: 5px;}
.pt-10{ padding-top: 10px;}
.pl-10{ padding-left: 10px;}
.pr-10{ padding-right: 10px;}
.pb-10{ padding-bottom: 10px;}
.p10{ padding: 10px;}
.pt-15{ padding-top: 15px;}
.pl-15{ padding-left: 15px;}
.pr-15{ padding-right: 15px;}
.pb-15{ padding-bottom: 15px;}
.p15{ padding: 15px;}
.pt-20{ padding-top: 20px;}
.pl-20{ padding-left: 20px;}
.pr-20{ padding-right: 20px;}
.pb-20{ padding-bottom: 20px;}
.p20{ padding: 20px;}
.pt-25{ padding-top: 25px;}
.pl-25{ padding-left: 25px;}
.pr-25{ padding-right: 25px;}
.pb-25{ padding-bottom: 25px;}
.p25{ padding: 25px;}
.pt-30{ padding-top: 30px;}
.pl-30{ padding-left: 30px;}
.pr-30{ padding-right: 30px;}
.pb-30{ padding-bottom: 30px;}
.p30{ padding: 30px;}
.pt-40{ padding-top: 40px;}
.pl-40{ padding-left: 40px;}
.pr-40{ padding-right: 40px;}
.pb-40{ padding-bottom: 40px;}
.p40{ padding: 40px;}
.pt-50{ padding-top: 50px;}
.pl-50{ padding-left: 50px;}
.pr-50{ padding-right: 50px;}
.pb-50{ padding-bottom: 50px;}
.p50{ padding: 50px;}
.pt-60{ padding-top: 60px;}
.pl-60{ padding-left: 60px;}
.pr-60{ padding-right: 60px;}
.pb-60{ padding-bottom: 60px;}
.p60{ padding: 60px;}
.pt-70{ padding-top: 70px;}
.pl-70{ padding-left: 70px;}
.pr-70{ padding-right: 70px;}
.pb-70{ padding-bottom: 70px;}
.p70{ padding: 70px;}
.pt-100{ padding-top: 100px;}
.pl-100{ padding-left: 100px;}
.pr-100{ padding-right: 100px;}
.pb-100{ padding-bottom: 100px;}
.p100{ padding: 100px;}

/* margin */
.mt-5{ margin-top: 5px;}
.ml-5{ margin-left: 5px;}
.mr-5{ margin-right: 5px;}
.mb-5{ margin-bottom: 5px;}
.m5{ margin: 5px;}
.mt-10{ margin-top: 10px;}
.ml-10{ margin-left: 10px;}
.mr-10{ margin-right: 10px;}
.mb-10{ margin-bottom: 10px;}
.m10{ margin: 10px;}
.mt-15{ margin-top: 15px;}
.ml-15{ margin-left: 15px;}
.mr-15{ margin-right: 15px;}
.mb-15{ margin-bottom: 15px;}
.m15{ margin: 15px;}
.mt-20{ margin-top: 20px;}
.ml-20{ margin-left: 20px;}
.mr-20{ margin-right: 20px;}
.mb-20{ margin-bottom: 20px;}
.m20{ margin: 20px;}
.mt-25{ margin-top: 25px;}
.ml-25{ margin-left: 25px;}
.mr-25{ margin-right: 25px;}
.mb-25{ margin-bottom: 25px;}
.m25{ margin: 25px;}
.mt-30{ margin-top: 30px;}
.ml-30{ margin-left: 30px;}
.mr-30{ margin-right: 30px;}
.mb-30{ margin-bottom: 30px;}
.m30{ margin: 30px;}
.mt-40{ margin-top: 40px;}
.ml-40{ margin-left: 40px;}
.mr-40{ margin-right: 40px;}
.mb-40{ margin-bottom: 40px;}
.m40{ margin: 40px;}
.mt-50{ margin-top: 50px;}
.ml-50{ margin-left: 50px;}
.mr-50{ margin-right: 50px;}
.mb-50{ margin-bottom: 50px;}
.m50{ margin: 50px; }
.mt-60{ margin-top: 60px;}
.ml-60{ margin-left: 60px;}
.mr-60{ margin-right: 60px;}
.mb-60{ margin-bottom: 60px;}
.m60{ margin: 60px; }
.mt-70{ margin-top: 70px;}
.ml-70{ margin-left: 70px;}
.mr-70{ margin-right: 70px;}
.mb-70{ margin-bottom: 70px;}
.m70{ margin: 70px; }
.mt-100{ margin-top: 100px;}
.ml-100{ margin-left: 100px;}
.mr-100{ margin-right: 100px;}
.mb-100{ margin-bottom: 100px;}
.m100{ margin: 100px;}
.mlr{  margin-left: auto; margin-right: auto;}

.hidden{ overflow: hidden;}
.color-color{ color: #004394;}
.color-orange{ color: #ef7f0f;}
.color-green{ color: #1fc6e2;}
.color-red{color: #f00;}
.color-black{color: #1a1a1a;}
.color-white{ color: white;}
.color-white4{  color: rgba(255,255,255,0.4);}
.color-white6{  color: rgba(255,255,255,0.6);}
.color-000{ color: #000;}
.color-666{ color: #666; }
.color-888{ color: #888;}
.color-555{ color: #555;}
.color-333{ color: #333;}
.color-999{ color: #999;}
.color-aaa{ color: #aaa;}

.bg-33{background-color: #333;}
.bg-fa{background-color: #fafafa;}
.bg-f7{ background-color: #f7f7f7;}
.bg-f4{ background-color: #f4f5f7;}
.bg-f0{ background-color: #f0f0f0;}
.bg-f9{ background-color: #f9f9f9;}
.bg-color{background-color: #004394;}
.bg-orange{background-color: #ef7f0f;}
.bg-green{background-color: #1fc6e2;}
.bg-red{background-color: #f00;}
.bg-white{ background-color: white;}

.bg-black{ background-color: #1a1a1a;}
.bg-666{  background-color: #666;}
.bg-888{  background-color: #888;}
.bg-555{  background-color: #555;}
.bg-aaa{  background-color: #aaa;}

.flex-center-center{  display: flex; align-items: center; justify-content: center;}
.flex-between-center{  display: flex; justify-content: space-between; align-items: center;}
.flex-center{  display: flex; align-items: center;}
.flex-between{  display: flex; justify-content: space-between}
.flex-between-start{ display: flex; justify-content: space-between;align-items: flex-start;}
.flex-between-end{ display: flex; justify-content: space-between;align-items: flex-end;}
.flex{  display: flex;}
.flex-column{ flex-direction: column;}
.flex-wrap{ flex-wrap: wrap;}
.flex-end{display: flex; align-items: flex-end;}
.flex-content-end{display: flex; justify-content: flex-end;}
.flex-start{display: flex; align-items: flex-start;}
.iflex{ display: inline-flex}
.iblock{ display: inline-block}
.block{  display: block;}
.flex-shrink{ flex-shrink: 0 }

.justify-center{justify-content: center;}
.justify-end{justify-content: flex-end;}
.justify-start{justify-content: flex-start;}
.align-start{align-items: flex-start;}
.align-end{align-items: flex-end;}
.align-center{align-items: center;}

.light{ position: absolute; left: -100%; top: 0; width: 100%; height: 100%; transform: skewx(-25deg); z-index: 2;
        background-image: -webkit-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.5),rgba(255,255,255,0));}
.light-tri:hover .light{ left: 100%; transition: 1s;}
.light-tri:hover{ box-shadow: 0 0 10px rgba(43 ,23, 110, .5);}



.linka a:hover{ color: #004394;}
.posi{ position: relative;}
/*.posi-a-3{ position: absolute; top: 0; left: 0;z-index: 2}*/
.posi-a{ position: absolute; top: 0; left: 0;z-index: 3}
.posi-a-5{ position: absolute; top: 0; left: 0;z-index: 5}
.z5{ position: relative; z-index: 5;}
.z10{ position: relative; z-index: 10;}
.z20{ position: relative; z-index: 20;}
.hmax{ height: 100%  ;}
.wmax{ width: 100%  ;}
.w20{ width: 20%;}
.w25{ width: 25%;}
.w30{ width: 30%;}
.w32{ width: 32%;}
.w33{ width: calc(100% / 3);}
.w35{ width: 35%;}
.w38{ width: 38%;}
.w40{ width: 40%;}
.w45{ width: 45%;}
.w49-5{ width: 49.5%;}
.w50{ width: 50% ;}
.w55{ width: 55%;}
.w60{ width: 60%;}
.w64{ width: 64% }
.w65{ width: 65% }
.w70{ width: 70%;}
.w75{ width: 75%;}
.w48{ width: 48%;}
.w49{ width: 49%;}
.w80{ width: 80% }

.scaleImg:hover img{ transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); }
.bigImg{ width: 100%  ;height:100%; object-fit: cover;}
.maxImg img{ max-width: 100%; max-height: 100% ;}
.img{ position: relative; overflow: hidden;}

.transition{ transition: all .36s;}
.transition1{ transition: all 1s;}
.line-height{ line-height: 2;}
.text-center{ text-align: center;}
.text-justify{ text-align: justify;}
.text-indent{ text-indent: 2em}
.text-right{ text-align: right;}
.text-left{ text-align: left;}
.text-uppercase{ text-transform: uppercase;}
.text-capitalize{ text-transform: capitalize;}
.text-underline{ text-decoration: underline;}
.text-nowrap{ white-space: nowrap;}
.text-line{ text-decoration:line-through}
.text-italic{font-style: italic;}
.text-miao{  -webkit-text-stroke: 1px #ddd;text-stroke: 1px #ddd;color: transparent;}

.cursorNone{   -webkit-user-drag: none;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.cursor{ cursor: pointer;}
/* .cursor-shou{cursor: url("../images/icoN_shou.png"), auto;} */
.font-weight{ font-weight: bold;}
.font-lighter{ font-weight: lighter;}
.font-normal{ font-weight: normal;}
.fixed{  position: fixed; top: 0; left: 0; width: 100%; z-index: 9999;   -webkit-animation: 300ms ease-in-out 0s normal none fadeInDown;
         animation: 300ms ease-in-out 0s normal none fadeInDown;}
@-webkit-keyframes fadeInDown{0%{-webkit-transform:translate3d(0,-100%,0);opacity:0;transform:translate3d(0,-100%,0)}to{-webkit-transform:translateZ(0);opacity:1;transform:translateZ(0)}}
@keyframes fadeInDown{0%{-webkit-transform:translate3d(0,-100%,0);opacity:0;transform:translate3d(0,-100%,0)}to{-webkit-transform:translateZ(0);opacity:1;transform:translateZ(0)}}
/*  white-space: nowrap;   overflow: hidden;text-overflow:ellipsis; */

.line-clamp{  word-break:break-all;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;}
.line-clamp2{ word-break:break-all;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.line-clamp3{ word-break:break-all;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.line-clamp6{ word-break:break-all;display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden;}
.line-clamp5{ word-break:break-all;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;}
.line-clamp4{ word-break:break-all;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;}
.line-height2-4{ line-height: 2.4;}
.line-height2-5{ line-height: 2.5;}
.line-height2-8{ line-height: 2.8;}
.line-height1{ line-height: 1;}
.line-height1-6{ line-height: 1.6;}
.line-height3{ line-height: 3;}
.opacity8{ opacity: 0.8;}
.opacity6{ opacity: 0.6;}
.opacity4{ opacity: 0.4;}
.opacity2{ opacity: 0.2;}
.opacity0{ opacity: 0;}
.opacity9{ opacity: .9;}
.object{object-fit: cover;}
/* 栏目页banner手机端与pc端切换显示 */
.pc-show{  display: block; }
.wap-show{ display: none; }
.border{ border: 1px solid #e5e5e5;}
.border-bottom{ border-bottom: 1px solid #e5e5e5;}
.border-top{ border-top: 1px solid #e5e5e5;}
.border-left{ border-left: 1px solid #e5e5e5;}
.border-right{ border-right: 1px solid #e5e5e5;}

.border-color{ border: 1px solid #004394;  }
.border-bottom-color{ border-bottom: 1px solid #004394;}
.border-top-color{ border-top: 1px solid #004394;}
.border-left-color{ border-left: 1px solid #004394;}
.border-right-color{ border-right: 1px solid #004394;}

.border-black{ border: 1px solid #1a1a1a;}
.border-bottom-black{ border-bottom: 1px solid #1a1a1a;}
.border-top-black{ border-top: 1px solid #1a1a1a;}
.border-left-black{ border-left: 1px solid #1a1a1a;}
.border-right-black{ border-right: 1px solid #1a1a1a;}

.border-white{ border: 1px solid #fff;}
.border-bottom-white{ border-bottom: 1px solid #fff;}
.border-top-white{ border-top: 1px solid #fff;}
.border-left-white{ border-left: 1px solid #fff;}
.border-right-white{ border-right: 1px solid #fff;}

.border-white4{ border: 1px solid rgba(255, 255, 255, 0.4);}
.border-bottom-white4{ border-bottom: 1px solid rgba(255, 255, 255, 0.4);}
.border-top-white4{ border-top: 1px solid rgba(255, 255, 255, 0.4);}
.border-left-white4{ border-left: 1px solid rgba(255, 255, 255, 0.4);}
.border-right-white4{ border-right: 1px solid rgba(255, 255, 255, 0.4);}

.border-white2{ border: 1px solid rgba(255, 255, 255, 0.2);}
.border-bottom-white2{ border-bottom: 1px solid rgba(255, 255, 255, 0.2);}
.border-top-white2{ border-top: 1px solid rgba(255, 255, 255, 0.2);}
.border-left-white2{ border-left: 1px solid rgba(255, 255, 255, 0.2);}
.border-right-white2{ border-right: 1px solid rgba(255, 255, 255, 0.2);}

.border-bottom-left-radius{ border-bottom-left-radius: 3vw;}
.border-bottom-right-radius{ border-bottom-right-radius: 3vw;}
.border-top-left-radius{ border-top-right-radius: 3vw;}
.border-top-right-radius{ border-top-right-radius: 3vw;}

.shadow{ box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);}

.radius5{ border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; }
.radius8{ border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; }
.radius10{ border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; }
.radius15{ border-radius: 15px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -ms-border-radius: 15px; -o-border-radius: 15px; }
.radius20{ border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px; }
.radius40{ border-radius: 40px; -webkit-border-radius: 40px; -moz-border-radius: 40px; -ms-border-radius: 40px; -o-border-radius: 40px; }
.radius80{ border-radius: 80px; -webkit-border-radius: 80px; -moz-border-radius: 80px; -ms-border-radius: 80px; -o-border-radius: 80px; }
.radius50{ border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }

.mask-white { position:absolute; top:0; left:0; width:100%; height:100%; z-index: 4; background:rgba(255,255,255,.2); content:''; -webkit-transition:-webkit-transform .6s; 
              transition:transform .6s; -webkit-transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0); transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0) }
.maskBox:hover .mask-white{ -webkit-transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0); transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0)}

/*
.bubble{width:100%;height:100%;position:absolute;left:0;top:0;z-index: -1;} 
.bubble span,.back_bubble span{display:block;width:20px;height:20px;border-radius:50%;-webkit-border-radius:50%;z-index:-1; 
transition: ease 1s;-webkit-transition: ease 1s;position:absolute;left:50%;
bottom:0px;transform: translateX(-50%);-webkit-transform: translateX(-50%);opacity:0;-webkit-opacity:0;}
.bubble span:nth-child(1){animation:pao 4s linear infinite;-webkit-animation:pao 4s linear infinite;background: rgba(2,51,162,.6);}
.bubble span:nth-child(2){animation:pao3 6s linear infinite;-webkit-animation:pao3 6s linear infinite;
-webkit-transition-delay:0.3s;transition-delay:0.3s;background: rgba(2,51,162,.8);}
.bubble span:nth-child(3){animation:pao2 3s linear infinite;-webkit-animation:pao2 3s linear infinite;
-webkit-transition-delay:0.8s;transition-delay:0.8s;background: rgba(2,51,162,1);}
.bubble span:nth-child(4){animation:pao4 9s linear infinite;-webkit-animation:pao4 9s linear infinite; background: rgba(2,51,162,.3);}
.bubble span:nth-child(5){animation:pao5 7s linear infinite;-webkit-animation:pao5 7s linear infinite; background: rgba(2,51,162,.5);}
 @keyframes pao{
  0% {
    transform: translate(200%,-30px) rotate(360deg) scale(.4,.4);
    -webkit-transform: translate(200%,-30px) rotate(360deg) scale(.4,.4);
    opacity:1;-webkit-opacity:1;
  }
 
  50% {
    transform: translate(0%,-70px) rotate(360deg) scale(.8,.8);
    -webkit-transform: translate(0%,-70px) rotate(360deg) scale(.8,.8);
    opacity:.5;-webkit-opacity:.5;
  }
 
  100% {
    transform: translate(-200%,-100px) rotate(360deg) scale(1,1);
    -webkit-transform: translate(-200%,-100px) rotate(360deg) scale(1,1);
    opacity:0;-webkit-opacity:0;
  
  }
 }
 @keyframes pao2 {
  0% {
    transform:translate(-200%,0px) rotate(360deg) scale(1,1);
    -webkit-transform:translate(-200%,0px) rotate(360deg) scale(1,1);
    opacity:1;-webkit-opacity:1;
  }
 
  50% {
    transform: translate(250%,-50px) rotate(360deg) scale(.8,.8);
    -webkit-transform: translate(250%,-50px) rotate(360deg) scale(.8,.8);
    opacity:.5;-webkit-opacity:.5;
  }
 
  100% {
    transform: translate(100%,-100px) rotate(360deg) scale(.4,.4);
    -webkit-transform: translate(100%,-100px) rotate(360deg) scale(.4,.4);
    opacity:0;-webkit-opacity:0;
  
  }
 }
 @keyframes pao3 {
  0% {
    transform: translate(0%,0px) rotate(360deg) scale(1,1);
    -webkit-transform: translate(0%,0px) rotate(360deg) scale(1,1);
    opacity:1;-webkit-opacity:1;
  }
 
  50% {
    transform: translate(-250%,-50px) rotate(360deg) scale(.8,.8);
    -webkit-transform:translate(-250%,-50px) rotate(360deg) scale(.8,.8);
    opacity:.5;-webkit-opacity:.5;
  }
 
  100% {
    transform: translate(-300%,-100px) rotate(360deg) scale(.4,.4);
    -webkit-transform:translate(-300%,-100px) rotate(360deg) scale(.4,.4);
    opacity:0;-webkit-opacity:0;
  
  }
 }
@keyframes pao4 {
  0% {
    transform: translate(400%,0px) rotate(360deg) scale(1,1);
    -webkit-transform: translate(400%,0px) rotate(360deg) scale(1,1);
    opacity:1;-webkit-opacity:1;
  }

  50% {
    transform: translate(400%,-50px) rotate(360deg) scale(.8,.8);
    -webkit-transform: translate(400%,-50px) rotate(360deg) scale(.8,.8);
    opacity:.5;-webkit-opacity:.5;
  }

  100% {
    transform: translate(-100%,-100px) rotate(360deg) scale(.4,.4);
    -webkit-transform: translate(-100%,-100px) rotate(360deg) scale(.4,.4);
    opacity:0;-webkit-opacity:0;
  }
}
@keyframes pao5 {
  0% {
    transform: translate(-400%,0px) rotate(360deg) scale(.1,.1);
    -webkit-transform:translate(-400%,0px) rotate(360deg) scale(.1,.1);
    opacity:1;-webkit-opacity:1;
  }

  50% {
    transform: translate(-400%,-50px) rotate(360deg) scale(.6,.6);
    -webkit-transform: translate(-400%,-50px) rotate(360deg) scale(.6,.6);
    opacity:.5;-webkit-opacity:.5;
  }

  100% {
    transform: translate(0%,-100px) rotate(360deg) scale(1,1);
    -webkit-transform: translate(0%,-100px) rotate(360deg) scale(1,1);
    opacity:0;-webkit-opacity:0;
  }
}*/

.list-page li span,.list-page li a{position: relative;display: block;padding: 10px 15px;margin-left: -1px;line-height: 1.25;color: #004394;background-color: #fff;border: 1px solid #dee2e6;}
.list-page .disabled span{color: #6c757d;pointer-events: none;cursor: auto;background-color: #fff;border-color: #dee2e6;}
.list-page a:hover,.list-page li.active span{background-color: #004394 !important;border-color: #004394 !important; color: #fff!important;}
.pagination{justify-content: center!important;display: -ms-flexbox;display: flex;padding-left: 0;list-style: none;border-radius: 5px;}
.pagination li:first-child span,.pagination li:first-child a{margin-left: 0;border-top-left-radius: 5px;border-bottom-left-radius: 5px;}
.pagination li:last-child span,.pagination li:last-child a{border-top-right-radius: 5px;border-bottom-right-radius: 5px;}

/*#toolbar{ position: fixed; bottom: 0; left: 0; width: 100%; z-index: 150; display: none;}
#toolbar a {width: 25%;padding: 10px 0;text-align: center;color: #fff; display: flex; align-items: center; justify-content: center; flex-direction: column;}
#toolbar img{ height: 20px; margin-bottom:5px;}*/



.mask-white { position:absolute; top:0; left:0; width:100%; height:100%; z-index: 4; background:rgba(255,255,255,.2); content:''; -webkit-transition:-webkit-transform .6s; 
              transition:transform .6s; -webkit-transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0); transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0) }
.maskBox:hover .mask-white{ -webkit-transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0); transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0)}

/*.pig { width: 60px;height: 60px;background-color: rgba(255, 255, 255, 0.4);border-radius: 50%;opacity: 0;position: absolute;left: 100%;top: 100%;z-index: 10;margin-left: -30px;margin-top: -30px;pointer-events: none;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;-webkit-transition: opacity 0.4s linear, -webkit-transform 0.5s ease-in-out;transition: opacity 0.4s linear, -webkit-transform 0.5s ease-in-out;transition: opacity 0.4s linear, transform 0.5s ease-in-out;transition: opacity 0.4s linear, transform 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out;}
.pig.show {opacity: 1;}
.pig:active,.pig.active { -webkit-transform: scale(1.1);transform: scale(1.1);}
.pig s {width: 6px;height: 12px;cursor: pointer;position: absolute;margin-top: -6px;top: 50%;z-index: 2;background-color: transparent;background-position: center;background-repeat: no-repeat;-webkit-transition: 0.3s;transition: 0.3s;}
.pig s.i1 {left: 20px;background-image: url('../images/sjl-pig.png');}
.pig s.i2 {right: 20px;background-image: url('../images/sjr-pig.png');}
.pig:active s.i1,.pig.active s.i1 {  left: 14px;}
.pig:active s.i2,.pig.active s.i2 {  right: 14px;}*/

.infoImg img{  margin-top: 5px; margin-bottom: 5px}
.infoImg dl,.infoImg ul,.infoImg ol,.infoImg  menu,.infoImg  li{list-style:  disc ; list-style-position:inside}

.iPad-show{ display: none;}

@media screen and (max-width:900px){
    .pc-show{  display: none; }
    .wap-show{  display: block; }
    .wap-none{ display: none !important;  }
    .wapFlex{ flex-direction: column; align-items: flex-start; justify-content: flex-start;}
    .wapFlexF{ flex-direction: column-reverse; align-items: flex-start; justify-content: flex-start;}
    .wapFlexC{ flex-direction: column; align-items: center; justify-content: center;}

    .wap-w50{ width: 50% }
    .line-height2-4,.line-height3,.line-height2-8{ line-height: 2;}
    .w50,.w48,.w49-5,.w33,.w32,.w30,.w35,.w40,.w55,.w60,.w49,.w45,.w25,.w70{ width: 100% ;}
    .infoImg img{ height: auto !important;}

    .wapMax{ width: 100% !important}
    .wapBold{ font-weight:bold; }

    body::before{ display: block; content: ''; width: 100%; height: 60px; background-color: #fff;}
    .indexBody::after{ display: none;  }
    .bg-scoll{ background-attachment: scroll !important;}
}
.cursor-dot {position: fixed; top: 50%; left: 50%; pointer-events: none; border-radius: 50%; opacity: 0;
             width: 8px; height: 8px; background-color: rgba(0,0 ,0, 0.3); z-index: 999; transform: translate(-50%, -50%);
             transition: opacity 0.5s ease-in-out, transform 0.3s ease-in-out, width 0.5s, height 0.5s, background-color 0.5s ease;}

.mapBox img{ max-width: none; transition: all 0s;}

@media screen and (max-width:1600px) {
    /* padding */
    .pt-10{ padding-top: 8px;}
    .pl-10{ padding-left: 8px;}
    .pr-10{ padding-right: 8px;}
    .pb-10{ padding-bottom: 8px;}
    .p10{ padding: 8px;}
    .pt-15{ padding-top: 13px;}
    .pl-15{ padding-left: 13px;}
    .pr-15{ padding-right: 13px;}
    .pb-15{ padding-bottom: 13px;}
    .p15{ padding: 13px;}
    .pt-20{ padding-top: 16px;}
    .pl-20{ padding-left: 16px;}
    .pr-20{ padding-right: 16px;}
    .pb-20{ padding-bottom: 16px;}
    .p20{ padding: 16px;}
    .pt-25{ padding-top: 20px;}
    .pl-25{ padding-left: 20px;}
    .pr-25{ padding-right: 20px;}
    .pb-25{ padding-bottom: 20px;}
    .p25{ padding: 20px;}
    .pt-30{ padding-top: 26px;}
    .pl-30{ padding-left: 26px;}
    .pr-30{ padding-right: 26px;}
    .pb-30{ padding-bottom: 26px;}
    .p30{ padding: 26px;}
    .pt-40{ padding-top: 36px;}
    .pl-40{ padding-left: 36px;}
    .pr-40{ padding-right: 36px;}
    .pb-40{ padding-bottom: 36px;}
    .p40{ padding: 36px;}
    .pt-50{ padding-top: 40px;}
    .pl-50{ padding-left: 40px;}
    .pr-50{ padding-right: 40px;}
    .pb-50{ padding-bottom: 40px;}
    .p50{ padding: 40px;}
    .pt-60{ padding-top: 50px;}
    .pl-60{ padding-left: 50px;}
    .pr-60{ padding-right: 50px;}
    .pb-60{ padding-bottom: 50px;}
    .p60{ padding: 50px; }
    .pt-70{ padding-top: 60px;}
    .pl-70{ padding-left: 60px;}
    .pr-70{ padding-right: 60px;}
    .pb-70{ padding-bottom: 60px;}
    .p70{ padding: 60px;}
    .pt-100{ padding-top: 80px;}
    .pl-100{ padding-left: 80px;}
    .pr-100{ padding-right: 80px;}
    .pb-100{ padding-bottom: 80px;}
    .p100{ padding: 80px;}

    /* margin */
    .mt-10{ margin-top: 8px;}
    .ml-10{ margin-left: 8px;}
    .mr-10{ margin-right: 8px;}
    .mb-10{ margin-bottom: 8px;}
    .m10{ margin: 8px;}
    .mt-15{ margin-top: 13px;}
    .ml-15{ margin-left: 13px;}
    .mr-15{ margin-right: 13px;}
    .mb-15{ margin-bottom: 13px;}
    .m15{ margin: 13px;}
    .mt-20{ margin-top: 16px;}
    .ml-20{ margin-left: 16px;}
    .mr-20{ margin-right: 16px;}
    .mb-20{ margin-bottom: 16px;}
    .m20{ margin: 16px;}
    .mt-25{ margin-top: 20px;}
    .ml-25{ margin-left: 20px;}
    .mr-25{ margin-right: 20px;}
    .mb-25{ margin-bottom: 20px;}
    .m25{ margin: 20px;}
    .mt-30{ margin-top: 26px;}
    .ml-30{ margin-left: 26px;}
    .mr-30{ margin-right: 26px;}
    .mb-30{ margin-bottom: 26px;}
    .m30{ margin: 26px;}
    .mt-40{ margin-top: 36px;}
    .ml-40{ margin-left: 36px;}
    .mr-40{ margin-right: 36px;}
    .mb-40{ margin-bottom: 36px;}
    .m40{ margin: 36px;}
    .mt-50{ margin-top: 40px;}
    .ml-50{ margin-left: 40px;}
    .mr-50{ margin-right: 40px;}
    .mb-50{ margin-bottom: 40px;}
    .m50{ margin: 40px; }
    .mt-60{ margin-top: 50px;}
    .ml-60{ margin-left: 50px;}
    .mr-60{ margin-right: 50px;}
    .mb-60{ margin-bottom: 50px;}
    .m60{ margin: 50px; }
    .mt-70{ margin-top: 60px;}
    .ml-70{ margin-left: 60px;}
    .mr-70{ margin-right: 60px;}
    .mb-70{ margin-bottom: 60px;}
    .m70{ margin: 60px; }
    .mt-100{ margin-top: 80px;}
    .ml-100{ margin-left: 80px;}
    .mr-100{ margin-right: 80px;}
    .mb-100{ margin-bottom: 80px;}
    .m100{ margin: 80px;}

    .pglist{ margin-top: 80px }



}

@media screen and (max-width:1440px) {
    /* padding */
    .pt-10{ padding-top: 6px;}
    .pl-10{ padding-left: 6px;}
    .pr-10{ padding-right: 6px;}
    .pb-10{ padding-bottom: 6px;}
    .p10{ padding: 6px;}
    .pt-15{ padding-top: 10px;}
    .pl-15{ padding-left: 10px;}
    .pr-15{ padding-right: 10px;}
    .pb-15{ padding-bottom: 10px;}
    .p15{ padding: 10px;}
    .pt-20{ padding-top: 15px;}
    .pl-20{ padding-left: 15px;}
    .pr-20{ padding-right: 15px;}
    .pb-20{ padding-bottom: 15px;}
    .p20{ padding: 15px;}
    .pt-25{ padding-top: 18px;}
    .pl-25{ padding-left: 18px;}
    .pr-25{ padding-right: 18px;}
    .pb-25{ padding-bottom: 18px;}
    .p25{ padding: 18px;}
    .pt-30{ padding-top: 24px;}
    .pl-30{ padding-left: 24px;}
    .pr-30{ padding-right: 24px;}
    .pb-30{ padding-bottom: 24px;}
    .p30{ padding: 24px;}
    .pt-40{ padding-top: 34px;}
    .pl-40{ padding-left: 34px;}
    .pr-40{ padding-right: 34px;}
    .pb-40{ padding-bottom: 34px;}
    .p40{ padding: 34px;}
    .pt-50{ padding-top: 35px;}
    .pl-50{ padding-left: 35px;}
    .pr-50{ padding-right: 35px;}
    .pb-50{ padding-bottom: 35px;}
    .p50{ padding: 35px;}
    .pt-60{ padding-top: 40px;}
    .pl-60{ padding-left: 40px;}
    .pr-60{ padding-right: 40px;}
    .pb-60{ padding-bottom: 40px;}
    .p60{ padding: 40px; }
    .pt-70{ padding-top: 50px;}
    .pl-70{ padding-left: 50px;}
    .pr-70{ padding-right: 50px;}
    .pb-70{ padding-bottom: 50px;}
    .p70{ padding: 50px;}
    .pt-100{ padding-top: 66px;}
    .pl-100{ padding-left: 66px;}
    .pr-100{ padding-right: 66px;}
    .pb-100{ padding-bottom: 66px;}
    .p100{ padding: 66px;}

    /* margin */
    .mt-10{ margin-top: 6px;}
    .ml-10{ margin-left: 6px;}
    .mr-10{ margin-right: 6px;}
    .mb-10{ margin-bottom: 6px;}
    .m10{ margin: 6px;}
    .mt-15{ margin-top: 10px;}
    .ml-15{ margin-left: 10px;}
    .mr-15{ margin-right: 10px;}
    .mb-15{ margin-bottom: 10px;}
    .m15{ margin: 10px;}
    .mt-20{ margin-top: 15px;}
    .ml-20{ margin-left: 15px;}
    .mr-20{ margin-right: 15px;}
    .mb-20{ margin-bottom: 15px;}
    .m20{ margin: 15px;}
    .mt-25{ margin-top: 18px;}
    .ml-25{ margin-left: 18px;}
    .mr-25{ margin-right: 18px;}
    .mb-25{ margin-bottom: 18px;}
    .m25{ margin: 18px;}
    .mt-30{ margin-top: 24px;}
    .ml-30{ margin-left: 24px;}
    .mr-30{ margin-right: 24px;}
    .mb-30{ margin-bottom: 24px;}
    .m30{ margin: 24px;}
    .mt-40{ margin-top: 34px;}
    .ml-40{ margin-left: 34px;}
    .mr-40{ margin-right: 34px;}
    .mb-40{ margin-bottom: 34px;}
    .m40{ margin: 34px;}
    .mt-50{ margin-top: 35px;}
    .ml-50{ margin-left: 35px;}
    .mr-50{ margin-right: 35px;}
    .mb-50{ margin-bottom: 35px;}
    .m50{ margin: 35px; }
    .mt-60{ margin-top: 40px;}
    .ml-60{ margin-left: 40px;}
    .mr-60{ margin-right: 40px;}
    .mb-60{ margin-bottom: 40px;}
    .m60{ margin: 40px; }
    .mt-70{ margin-top: 50px;}
    .ml-70{ margin-left: 50px;}
    .mr-70{ margin-right: 50px;}
    .mb-70{ margin-bottom: 50px;}
    .m70{ margin: 50px; }
    .mt-100{ margin-top: 66px;}
    .ml-100{ margin-left: 66px;}
    .mr-100{ margin-right: 66px;}
    .mb-100{ margin-bottom: 66px;}
    .m100{ margin: 66px;}
}

@media screen and (max-width:1280px) {
    /* padding */
    .pt-10{ padding-top: 5px;}
    .pl-10{ padding-left: 5px;}
    .pr-10{ padding-right: 5px;}
    .pb-10{ padding-bottom: 5px;}
    .p10{ padding: 5px;}
    .pt-15{ padding-top:8px;}
    .pl-15{ padding-left:8px;}
    .pr-15{ padding-right:8px;}
    .pb-15{ padding-bottom:8px;}
    .p15{ padding:8px;}
    .pt-20{ padding-top: 12px;}
    .pl-20{ padding-left: 12px;}
    .pr-20{ padding-right: 12px;}
    .pb-20{ padding-bottom: 12px;}
    .p20{ padding: 12px;}
    .pt-25{ padding-top: 16px;}
    .pl-25{ padding-left: 16px;}
    .pr-25{ padding-right: 16px;}
    .pb-25{ padding-bottom: 16px;}
    .p25{ padding: 16px;}
    .pt-30{ padding-top: 22px;}
    .pl-30{ padding-left: 22px;}
    .pr-30{ padding-right: 22px;}
    .pb-30{ padding-bottom: 22px;}
    .p30{ padding: 22px;}
    .pt-40{ padding-top: 30px;}
    .pl-40{ padding-left: 30px;}
    .pr-40{ padding-right: 30px;}
    .pb-40{ padding-bottom: 30px;}
    .p40{ padding: 30px;}
    .pt-50{ padding-top:30px;}
    .pl-50{ padding-left: 30px;}
    .pr-50{ padding-right: 30px;}
    .pb-50{ padding-bottom: 30px;}
    .p50{ padding: 30px;}
    .pt-60{ padding-top: 35px;}
    .pl-60{ padding-left: 35px;}
    .pr-60{ padding-right: 35px;}
    .pb-60{ padding-bottom: 35px;}
    .p60{ padding: 35px; }
    .pt-70{ padding-top: 40px;}
    .pl-70{ padding-left: 40px;}
    .pr-70{ padding-right: 40px;}
    .pb-70{ padding-bottom: 40px;}
    .p70{ padding: 40px;}
    .pt-100{ padding-top: 55px;}
    .pl-100{ padding-left: 55px;}
    .pr-100{ padding-right: 55px;}
    .pb-100{ padding-bottom: 55px;}
    .p100{ padding: 55px;}

    /* margin */
    .mt-10{ margin-top: 5px;}
    .ml-10{ margin-left: 5px;}
    .mr-10{ margin-right: 5px;}
    .mb-10{ margin-bottom: 5px;}
    .m10{ margin: 5px;}
    .mt-15{ margin-top:8px;}
    .ml-15{ margin-left:8px;}
    .mr-15{ margin-right:8px;}
    .mb-15{ margin-bottom:8px;}
    .m15{ margin:8px;}
    .mt-20{ margin-top: 12px;}
    .ml-20{ margin-left: 12px;}
    .mr-20{ margin-right: 12px;}
    .mb-20{ margin-bottom: 12px;}
    .m20{ margin: 12px;}
    .mt-25{ margin-top: 16px;}
    .ml-25{ margin-left: 16px;}
    .mr-25{ margin-right: 16px;}
    .mb-25{ margin-bottom: 16px;}
    .m25{ margin: 16px;}
    .mt-30{ margin-top: 22px;}
    .ml-30{ margin-left: 22px;}
    .mr-30{ margin-right: 22px;}
    .mb-30{ margin-bottom: 22px;}
    .m30{ margin: 22px;}
    .mt-40{ margin-top: 30px;}
    .ml-40{ margin-left: 30px;}
    .mr-40{ margin-right: 30px;}
    .mb-40{ margin-bottom: 30px;}
    .m40{ margin: 30px;}
    .mt-50{ margin-top: 30px;}
    .ml-50{ margin-left: 30px;}
    .mr-50{ margin-right: 30px;}
    .mb-50{ margin-bottom: 30px;}
    .m50{ margin: 30px; }
    .mt-60{ margin-top: 35px;}
    .ml-60{ margin-left: 35px;}
    .mr-60{ margin-right: 35px;}
    .mb-60{ margin-bottom: 35px;}
    .m60{ margin: 35px; }
    .mt-70{ margin-top: 40px;}
    .ml-70{ margin-left: 40px;}
    .mr-70{ margin-right: 40px;}
    .mb-70{ margin-bottom: 40px;}
    .m70{ margin: 40px; }
    .mt-100{ margin-top: 55px;}
    .ml-100{ margin-left: 55px;}
    .mr-100{ margin-right: 55px;}
    .mb-100{ margin-bottom: 55px;}
    .m100{ margin: 55px; }
}

@media screen and (max-width:1000px) {

    .pt-10{ padding-top: 5px;}
    .pl-10{ padding-left: 5px;}
    .pr-10{ padding-right: 5px;}
    .pb-10{ padding-bottom: 5px;}
    .p10{ padding: 5px;}
    .pt-15{ padding-top:8px;}
    .pl-15{ padding-left:8px;}
    .pr-15{ padding-right:8px;}
    .pb-15{ padding-bottom:8px;}
    .p15{ padding:8px;}
    .pt-20{ padding-top: 15px;}
    .pl-20{ padding-left: 15px;}
    .pr-20{ padding-right: 15px;}
    .pb-20{ padding-bottom: 15px;}
    .p20{ padding: 15px;}
    .pt-25{ padding-top: 15px;}
    .pl-25{ padding-left: 15px;}
    .pr-25{ padding-right: 15px;}
    .pb-25{ padding-bottom: 15px;}
    .p25{ padding: 15px;}
    .pt-30{ padding-top: 18px;}
    .pl-30{ padding-left: 18px;}
    .pr-30{ padding-right: 18px;}
    .pb-30{ padding-bottom: 18px;}
    .p30{ padding: 18px;}
    .pt-40{ padding-top: 20px;}
    .pl-40{ padding-left: 20px;}
    .pr-40{ padding-right: 20px;}
    .pb-40{ padding-bottom: 20px;}
    .p40{ padding: 20px;}
    .pt-50{ padding-top: 25px;}
    .pl-50{ padding-left: 25px;}
    .pr-50{ padding-right: 25px;}
    .pb-50{ padding-bottom: 25px;}
    .p50{ padding: 25px;}
    .pt-60{ padding-top: 30px;}
    .pl-60{ padding-left: 30px;}
    .pr-60{ padding-right: 30px;}
    .pb-60{ padding-bottom: 30px;}
    .p60{ padding: 30px; }
    .pt-70{ padding-top: 35px;}
    .pl-70{ padding-left: 35px;}
    .pr-70{ padding-right: 35px;}
    .pb-70{ padding-bottom: 35px;}
    .p70{ padding: 35px;}
    .pt-100{ padding-top: 35px;}
    .pl-100{ padding-left: 35px;}
    .pr-100{ padding-right: 35px;}
    .pb-100{ padding-bottom: 35px;}
    .p100{ padding: 35px;}

    /* margin */
    .mt-10{ margin-top: 5px;}
    .ml-10{ margin-left: 5px;}
    .mr-10{ margin-right: 5px;}
    .mb-10{ margin-bottom: 5px;}
    .m10{ margin: 5px;}
    .mt-15{ margin-top:8px;}
    .ml-15{ margin-left:8px;}
    .mr-15{ margin-right:8px;}
    .mb-15{ margin-bottom:8px;}
    .m15{ margin:8px;}
    .mt-20{ margin-top: 15px;}
    .ml-20{ margin-left: 15px;}
    .mr-20{ margin-right: 15px;}
    .mb-20{ margin-bottom: 15px;}
    .m20{ margin: 15px;}
    .mt-25{ margin-top: 15px;}
    .ml-25{ margin-left: 15px;}
    .mr-25{ margin-right: 15px;}
    .mb-25{ margin-bottom: 15px;}
    .m25{ margin: 15px;}
    .mt-30{ margin-top: 18px;}
    .ml-30{ margin-left: 18px;}
    .mr-30{ margin-right: 18px;}
    .mb-30{ margin-bottom: 18px;}
    .m30{ margin: 18px;}
    .mt-40{ margin-top: 20px;}
    .ml-40{ margin-left: 20px;}
    .mr-40{ margin-right: 20px;}
    .mb-40{ margin-bottom: 20px;}
    .m40{ margin: 20px;}
    .mt-50{ margin-top: 25px;}
    .ml-50{ margin-left: 25px;}
    .mr-50{ margin-right: 25px;}
    .mb-50{ margin-bottom: 25px;}
    .m50{ margin: 25px; }
    .mt-60{ margin-top: 30px;}
    .ml-60{ margin-left: 30px;}
    .mr-60{ margin-right: 30px;}
    .mb-60{ margin-bottom: 30px;}
    .m60{ margin: 30px; }
    .mt-70{ margin-top: 35px;}
    .ml-70{ margin-left: 35px;}
    .mr-70{ margin-right: 35px;}
    .mb-70{ margin-bottom: 35px;}
    .m70{ margin: 35px; }
    .mt-100{ margin-top: 35px;}
    .ml-100{ margin-left: 35px;}
    .mr-100{ margin-right: 35px;}
    .mb-100{ margin-bottom: 35px;}
    .m100{ margin: 35px; }

    .list-page li span,.list-page li a{padding: 6px 12px;}
}

@media screen and (max-width:750px) { 

    .pt-40{ padding-top: 20px;}
    .pl-40{ padding-left: 20px;}
    .pr-40{ padding-right: 20px;}
    .pb-40{ padding-bottom: 20px;}
    .p40{ padding: 20px;}
    .pt-50{ padding-top: 20px;}
    .pl-50{ padding-left: 20px;}
    .pr-50{ padding-right: 20px;}
    .pb-50{ padding-bottom: 20px;}
    .p50{ padding: 20px;}
    .pt-60{ padding-top: 20px;}
    .pl-60{ padding-left: 20px;}
    .pr-60{ padding-right: 20px;}
    .pb-60{ padding-bottom: 20px;}
    .p60{ padding: 20px; }
    .pt-70{ padding-top: 20px;}
    .pl-70{ padding-left: 20px;}
    .pr-70{ padding-right: 20px;}
    .pb-70{ padding-bottom: 20px;}
    .p70{ padding: 20px;}
    .pt-100{ padding-top: 20px;}
    .pl-100{ padding-left: 20px;}
    .pr-100{ padding-right: 20px;}
    .pb-100{ padding-bottom: 20px;}
    .p100{ padding: 20px;}

    /* margin */

    .mt-40{ margin-top: 20px;}
    .ml-40{ margin-left: 20px;}
    .mr-40{ margin-right: 20px;}
    .mb-40{ margin-bottom: 20px;}
    .m40{ margin: 20px;}
    .mt-50{ margin-top: 20px;}
    .ml-50{ margin-left: 20px;}
    .mr-50{ margin-right: 20px;}
    .mb-50{ margin-bottom: 20px;}
    .m50{ margin: 20px; }
    .mt-60{ margin-top: 20px;}
    .ml-60{ margin-left: 20px;}
    .mr-60{ margin-right: 20px;}
    .mb-60{ margin-bottom: 20px;}
    .m60{ margin: 20px; }
    .mt-70{ margin-top: 20px;}
    .ml-70{ margin-left: 20px;}
    .mr-70{ margin-right: 20px;}
    .mb-70{ margin-bottom: 20px;}
    .m70{ margin: 20px; }
    .mt-100{ margin-top: 20px;}
    .ml-100{ margin-left: 20px;}
    .mr-100{ margin-right: 20px;}
    .mb-100{ margin-bottom: 20px;}
    .m100{ margin: 20px; }
    .radius8,.radius5{ border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; }
    .radius10,.radius20{ border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; }

}


@media screen and (max-width:420px) {

}