@charset "utf-8";

.headShow{ position: fixed; left: 0; top:0; z-index: 5; width: 100%; }
.headShow .top{  background:rgba(0,0,0,.8)!important}
.headShow .top .fl a{ color: #999; display: inherit; }
.headShow .top .fl a:hover{ color: #cc2929 }

.showDtlWrap {padding-top:400px; padding-bottom: 20px; min-width:1200px}
.showDtlWrap .showItm{ padding:20px 30px; width: 940px; margin:0 auto; background: #fff; border-radius: 10px; margin-bottom: 20px }
.showDtlWrap .showItm .tit{ line-height: 50px; color: #000; font-size: 24px; margin-bottom: 5px }
.showDtlWrap .showItm p{ line-height: 24px; font-size: 14px; margin-bottom: 15px }
.showDtlWrap .showItmApply .tips{ text-align: center; margin-left: 30px }
.showDtlWrap .showItmApply .btn-join{ height: 50px; line-height: 50px; text-align: center;margin-bottom: 70px }
.showDtlWrap .showItmApply .btn-join a{ display:inline-block; height: 50px; line-height: 50px; padding:0 20px; background: #cc2929; border-radius: 5px; color: #fff; font-size: 18px }
.showDtlWrap .showItmApply .btn-join a:hover{ background: #c11717 }

.libInfoListVer{ margin:0 auto; width:940px }
.libInfoListVer .imgBanner{ margin:0 auto 20px; border-radius: 5px; overflow: hidden;}
.libInfoListVer .imgBanner:hover{    transform: translateY(-1px);transition: all .3s;box-shadow: 0 10px 15px -5px rgba(0, 0, 0, .25)}
.libInfoListVer .imgBanner img{ display: block; width:940px; height: auto;}
.libInfoListVer ul{ width: 960px }
.libInfoListVer li{ width:220px; height:275px}
.libInfoListVer li .img{ width:220px; height: 146px;}
.dio-libInfoListVer{ height: 550px; overflow-y: auto; overflow-x: hidden; width:970px; padding-left: 30px;}
.dio-libInfoListVer::-webkit-scrollbar { width: 5px; height: 5px; }
.dio-libInfoListVer::-webkit-scrollbar-track-piece { background: #fff; -webkit-border-radius: 2px; }
.dio-libInfoListVer::-webkit-scrollbar-thumb:vertical { height: 3px; background-color: #666; -webkit-border-radius: 2px; }

.showDtlWrap .applyBtn{ text-align: center; line-height: 30px; height: 30px }
.showDtlWrap .applyBtn a{ font-size: 12px; color: rgba(255,255,255,.5); text-decoration: underline; }
.showDtlWrap .applyBtn a:hover{ color: #cc2929 }

.gc-diolog .diolog-choose-cnt{ padding:30px 0 0; width: 1060px; margin-left: -530px }
.gc-diolog .diolog-imgBanner-cnt{ width: 1000px; margin-left: -500px; padding:30px 0 0 }
.gc-diolog .diolog-choose-cnt .tit,.gc-diolog-apply .diolog-apply-cnt .tit,.gc-diolog-imgBanner .diolog-imgBanner-cnt .tit{ padding:0 30px; margin-bottom: 0 }
.diolog-choose-cnt .tips{ background: #fef4e5; margin:20px 30px; padding:0 10px 0 0; color: #666; border:1px solid #f6c090; border-radius: 3px }
.diolog-choose-cnt .tips img{ display:inline-block; margin:0 10px; }
.diolog-choose-cnt .libInfoList { margin:0 30px; height: 400px; overflow: auto; }
.diolog-choose-cnt .list-itm{ position: relative; padding-left: 210px; height: 125px; margin-bottom: 20px; padding-right: 80px }
.diolog-choose-cnt .list-itm .img{ width: 190px; height: 125px }
.diolog-choose-cnt .list-itm .tit{ padding:0; }
.diolog-choose-cnt .list-itm .desc{ height: 48px }
.diolog-choose-cnt .list-itm .icon-check{ position: absolute; right:0; top:50%; margin-top:-8px; display:inline-block; width:16px; height: 16px; background: url(../img/icon-check-red-16.png) center no-repeat; background-size: 16px }
.diolog-choose-cnt .list-itm.checked .icon-check{ background: url(../img/icon-checked-red-16.png) center no-repeat; background-size: 16px   }
.diolog-choose-cnt .btns,.diolog-apply-cnt .btns{ height: 60px; line-height: 60px; text-align: center; border-top: 1px solid #ddd }
.diolog-choose-cnt .btns a,.diolog-apply-cnt .btns a{ display:inline-block; height: 40px; line-height: 40px; padding:0 70px; border-radius: 5px; background: #cc2929; font-size: 16px; color: #fff }
.diolog-choose-cnt .btns a:hover,.diolog-apply-cnt .btns a:hover{ background: #bb1818 }

.diolog-choose-cnt .chooseClfy { margin:0 0 0 30px; height: 400px; overflow: auto; }
.diolog-choose-cnt .chooseClfy a{ float: left; width: 190px; padding:0 20px; height: 48px; line-height: 48px; border:1px solid #ccc; border-radius: 5px; margin:0 20px 20px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.diolog-choose-cnt .chooseClfy a.checked,.diolog-choose-cnt .chooseClfy a:hover{ color: #cc2929; border:1px solid #cc2929}

.gc-diolog-apply .diolog-apply-cnt{ padding:30px 0 0; width: 1060px; margin-left: -530px}
.diolog-apply-cnt .applyIn{ padding: 0 30px; max-height: 500px; overflow-y: auto; }
.diolog-apply-cnt .applyIn .itm h4{ font-size: 12px; color: #999; height: 60px; line-height: 80px }
.diolog-apply-cnt .applyIn .itm .desc{ line-height: 24px }
.diolog-apply-cnt .upLoadBox ul{ min-height: auto }
.diolog-apply-cnt li.addPro a{ display:inline-block; width:inherit; height: inherit; }

.gc-diolog-imgBanner .diolog-imgBanner-cnt li .tit{ padding:0}

/*申办展览*/
.showCreateWrap .tit{ line-height: 60px; font-size: 24px }
.showForms .itm .txtDesc{ height: 110px }
.showForms .itm .ipt{ background: #f7f7f7; }
.showForms .itm .ipt .fileName{ display:inline-block; background: none; vertical-align: top; line-height: 38px; text-indent: 10px; height: inherit; width: 450px; font-size: 12px; color: #000 }
.showForms .itm .ipt .upBtn{  position: absolute;right: 0;top: 0; display: block;height: 38px;text-align: center;line-height: 38px;background: #fff;border-radius: 0 5px 5px 0;border-left: 1px solid #ddd;font-size: 12px; color: #666; width: 100px }
.showForms .upFile .ipt{ border:1px solid #ddd; border-radius: 5px }
.showForms .upFile .ipt .ipt-upFile{ cursor: pointer; font-size: 0; position: absolute; right: 0; top: 0; z-index: 1; display: inline-block; width: 100px;height: 38px;border: none;background: none; opacity: 0; padding:0;}

.gcBiaoyin .itm .ipt input.input_cxcolor{ margin:10px; width: 18px; height: 18px;padding: 0; border: 0; background: #000 url(../img/cxcolor.png) no-repeat; font-size: 0;line-height: 0;vertical-align: middle;cursor: pointer; border-radius: 0}
.gcBiaoyin .itm .ipt .showColor{ color: #666; font-size: 12px;  font-family: Arial }

.upWrap .tit{ line-height: 30px; display: inline-block; height: inherit; line-height: inherit;font-size: 12px;color: #666; }
/*.upLoadBox ul{ min-height: 4  }*/
.upLoadBox li{ position: relative; width: 190px; text-align: center; height: 160px; line-height: 125px; margin:0 10px 10px 0; float: left; border-radius: 5px; overflow: hidden;}
.upLoadBox li .img{ position: relative; display: block; width: 100%; height: 125px; overflow: hidden; border-radius: 5px }
.upLoadBox li .img .icon-del{ position: absolute; right: 0; top:0; border-radius: 0 5px 0 10px; display: block; width: 20px; height: 20px; background: rgba(0,0,0,.8) url(../img/icon-close-white-8.png) center no-repeat }
.upLoadBox li .img .upSucc{ position: absolute; right:5px; bottom:5px; display:inline-block; width: 16px; height: 16px;  }
.upLoadBox li .img .percent{ position: absolute; z-index: 1; left: 0; bottom:0; width: 190px; height: 15px; background: rgba(0,0,0,.8) }
.upLoadBox li .img .percent .in{ position: absolute; z-index: 2; left: 0; bottom:0;  height: 15px; background: #cc2929 }
.upLoadBox li .img .percent .txt{ position: absolute; z-index: 3; right:0; bottom:0; height: 15px; line-height: 15px; padding: 0 5px; display:inline-block; font-size: 12px; color: #fff }
.upLoadBox li .name{ font-size: 12px; color: #000; line-height: 30px; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.upLoadBox li .imgWrap{ width: 190px; height: 125px; border-radius: 5px; overflow: hidden; background:#ddd url('../img/loading.gif') center no-repeat; background-size: 20px}
.upLoadBox li.addPro a{ display:inline-block; width:inherit; height: inherit; }
.showCreateWrap .upBtns{ text-align: center; line-height: 60px }

.showItm .btn-uploadShow{ height: 36px; line-height: 36px; padding:0 10px; margin-top:7px}
.showItm .showItemTab{ height: auto; overflow: auto; line-height: 24px;}
.showItm .showItemTab a{ float: left; height: inherit; line-height: inherit; margin-right: 10px; padding:0 8px; font-size: 12px; color: #000; border-radius: 5px;}
.showItm .showItemTab a.current{ background:#666; color: #fff;}
.showItm .showItemTab a:hover{ color:#cc2929; font-weight: bold;}

.picWallLink{ }
.picWallLink a{ display: block; width: 1000px; height:230px; margin:0 auto 20px}
.picWallLink img{ display: block;}

.headImageWall{ height: 30px; line-height: 30px; text-align: center; background:#fff; padding:0 30px; font-size: 12px; color: #000;}
.headImageWall a:hover{ font-weight: bold;}
.imageWall { margin:auto; font-size:0px }
.photo { position: relative }

.demo-gallery {
    width: 100%;
    height: auto;
  }
  .demo-gallery a {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-touch-callout: none;
    display: block;
    /* float: left; */
    margin: 0 12px 12px 0;
    width: 171px;
    line-height: 0;
  }
  
  
  
  a.demo-gallery__img--main {
    width: auto;
    height: auto;
  }
  
  .ukraine-flag {
    width: 21px;
    height: 14px;
    position: relative;
    background: #ffcc00;
    top: 1px;
    display: inline-block;
  }
  .ukraine-flag:before {
   content:'';
   position: absolute;
   width: 21px;
   height: 7px;
   left:0;
   top:0;
   background: #0066cc;
  }
  
  .demo-gallery figure {
    display: none;
  }
  .demo-gallery__title {
    line-height: 14px;
    font-size: 14px;
    opacity: 0.8;
    margin-top: 5px;
    width: 100%;
    float: left;
  }
  
  .share-buttons h2 {
    text-align: center;
    border: 0;
    
  }
  .share-buttons {
    text-align: center;
    position: relative;
    margin: 0 0 24px;
  }
  .share-buttons a {
    -moz-border-radius: 2px;
    border-radius: 2px;
    display: inline-block;
    padding: 10px 20px;
    margin: 10px;
    color: #FFF;
    text-decoration: none;
    background: #5AAF63;
    font-size: 16px;
    line-height: 22px;
    cursor: pointer;
  }
  .share-buttons a:hover {
    opacity: 0.7;
  }
  #tweet {
    background: #0096c4;
  }
  #like {
    background: #3b5998;
  }
  #gplus {
    background: #d34836;
  }
  
  
  
  @media screen and (max-width: 1000px) {
  
   
  
    .row--wide {
      max-width: 800px;
    }
    .row--wide img {
      float: none;
    }
    .img-desc {
      margin-left: 0;
    }
    .section {
      margin-top: 132px;
    }
  
    .row--docs {
      max-width: 800px;
      padding-left: 30px;
  
    }
    
    .section--head {
      margin-top:0;
      padding: 30px 0;
    }
  
    .docs {
      margin-top: 48px;
    }
  
    .docs-menu {
      position: relative;
      margin: 15px 0;
      left:0;
      top:0;
    }
    .docs-menu  ul {
      position: relative;
    }
    .docs-menu__ad {
      display: none;
    }
  
    .row--nav {
      font-size: 24px;
      line-height: 1.1; 
    }
  
  }
  
  
  
  @media screen and (max-width: 650px) {
     h1 {
      font-size: 40px;
    }
    .block__ui-separated .col-50 {
      position: relative;
      top: 0;
    }
    .block__ui-separated img {
      max-width: 100%;
      width: 100%;
      float: left;
    }
  }
  
  @media screen and (max-width: 450px) {
    
  
    .col-50:nth-child(1) {
      margin-right: 0;
    }
    .row--wide img {
      margin-bottom: 6px;
    }
    .col-50 {
      width: 100%;
      margin-bottom: 12px;
    }
    .row {
      padding: 0 18px;
    }
    .docs .highlight,
    .codepen-embed {
      padding-left: 18px;
      padding-right: 18px;
      margin-left: -18px;
    }
    .section {
      margin-top: 88px;
    }
    .docs {
      margin-top: 32px;
    }
    .section--head {
      margin-top:0;
      padding: 24px 0;
    }
    .row--nav {
      font-size: 18px;
      line-height: 26px; 
    }
  
  
  }
  
  @media screen and (max-width: 700px) {
  
    .row--nav {
      font-size: 18px;
      line-height: 26px; 
    }
  
    .demo-gallery {
      max-width: 500px;
    }
    .demo-gallery a {
      width: 120px;
      margin: 0 4px 4px 0;
    }
    a.demo-gallery__img--main {
      width: 164px;
    }
    .section--head p {
      font-size: 18px;
      line-height: 24px;
    }
  }
  
  /*@media screen and (max-width: 490px) {
    .demo-gallery a {
      width: 100px;
      margin: 0 4px 4px 0;
    }
    a.demo-gallery__img--main {
      width: 137px;
    }
  }
  */
  
  
  @media screen and (max-width: 450px) {
    .demo-gallery a {
      width: 95px;
      margin: 0 1px 1px 0;
    }
    a.demo-gallery__img--main {
      width: 127px;
    }
  }
  
  
  @media screen and (max-width: 350px) {
    .demo-gallery a {
      width: 81px;
  margin: 0 1px 1px 0;
    }
    a.demo-gallery__img--main {
      width: 109px;
    }
  }