@charset "utf-8";
@font-face{font-family:'DIN Condensed';src:url("https://www.cens.com/cens/font/DINWeb-CondMedium.eot");font-weight:normal}
@font-face{font-family:'DIN Condensed';src:url("https://www.cens.com/cens/font/DINWeb-CondBold.eot");font-weight:bold}
@font-face{font-family:'DIN Condensed';src:url("https://www.cens.com/cens/font/DINWeb-CondMedium.woff") format("woff");font-weight:normal}
@font-face{font-family:'DIN Condensed';src:url("https://www.cens.com/cens/font/DINWeb-CondBold.woff") format("woff");font-weight:bold}
/* CSS Document */
body { margin:0px; padding:0px; }
/* div, ul, li, p, input, select, tt { font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#666666; } */

* {margin:0;padding:0;}
A {outline: none; /* for Firefox */ hlbr:expression(this.onFocus=this.blur()); /* for IE */}
A:link 	{ color : #000000; }
A:visited { color : #666666; }
A:hover { color : red; }


.basetitle { clear:both; position:relative; display:block; line-height:25px; font-weight: bold; font-family: var(--title); text-transform:uppercase; color:#006CB8; padding-left: 0.25em; border-left: 0.25em solid;}
.basetitle a { color:#006CB8; text-decoration:none; }
.basetitle a:hover { color : red; }


.featuredsupplier { clear:both; }
.featuredsupplier .supplier { width:995px; height:414px; display:block; overflow:hidden; }
.featuredsupplier .original { position:relative; width:995px; height:220px; display:block; margin-top:30px; overflow:hidden; }
.featuredsupplier .adv2 { overflow:hidden; padding-bottom:10px; border:1px #dfddff solid; }
.featuredsupplier .adv2 div { width:146px; height:50px; overflow:hidden; float:left; margin-left:16px; margin-top:10px; }

/* adv */
.mainpro .adv .banner-special { width:240px; height:170px; margin:5px auto; overflow:hidden; text-align:center; }
.mainpro .adv .banner-mov { width:240px; height:135px; margin:5px auto; overflow:hidden; background:#000000; text-align:center; }
.mainpro .adv .banner-insite { width:240px; /*height:74px; overflow:hidden;*/ margin: 5px auto; margin-bottom:5px; margin-top:12px; text-align:center; background:#000000; }
.mainpro .adv .banner-insite a { width:240px; height:74px; overflow:hidden; display:inline-block; }
.mainpro .adv-category { float:left; width:240px; margin-left:15px; margin-top:10px;}
.banner-area { display:table; margin-bottom: 16px;  border-bottom: 1px #dfdfdf solid; margin-top: 12px; }
.banner-adv2 { width:146px; display:block; overflow:hidden; margin-bottom:3px; margin-bottom:12px; padding:1px; border:1px #efefef solid; }
.banner-insite-33 { width:630px; height:150px; overflow:hidden; margin-bottom:12px; }

/* Hot Products */
.hotproduct .products_list {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: space-between;
  margin-bottom: 1rem;
}
.hotproduct .each { overflow:hidden; margin:0 0 10px 10px;
  width: 160px;
  display: flex;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: 18%;
  flex-direction: column;
  justify-content: space-between;
}
.hotproduct .each:nth-child(6) {
  display: none;
}
.hotproduct .each div { border:1px #ECECEC solid; width:105px; height:105px; margin:0 auto; overflow:hidden;text-align: center; }
/* .hotproduct .each div:before { content:''; display:inline-block;  vertical-align: middle; height:100%; } */
.hotproduct .each div img {  display: inline-block;  vertical-align: middle;}
.hotproduct .each #company,
.hotproduct .each #product {height:30px; margin:0 auto; overflow:hidden; font: 12px var(--zh-small); text-align: center;}
.hotproduct .each #company { margin-top:5px; color: #707070;}
.hotproduct .each #company a:hover { color : red; }
.hotproduct .each #product a { color : #007bff; }
.hotproduct .each #product a:hover { color : red; }
.hotproduct .each-big div  {  width:155px; height:155px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.hotproduct .each-big div img  { max-height:150px; max-width:150px; align-self: center;}



.web-selected-supplier { width:995px; height:122px;  background: url(https://www.cens.com/cens/images/newhome/web-selected-supplier-shadow.gif) bottom no-repeat; margin-top:30px;  }
.web-selected-supplier a  {}

.image-shadow { margin-bottom:10px; }
.image-shadow::after {
    content: '';
    background: url(https://www.cens.com/cens/images/newhome/web-selected-supplier-shadow.gif) bottom no-repeat;
    width: 100%;
    display: block;
    padding-top: 2.311%;
  }
.image-shadow img {width: 100%;}



/* 期刊頁 */
.pub-list { }
.pub-top-main { position:relative; margin-bottom: 1rem; min-height: 460px;}
.pub-top-main nav ul { list-style:none; }
.pub-top-main nav ul li {height:45px; width:262px; overflow:hidden; padding-left:10px;  font:bold 18px var(--title);  line-height:45px; color:#006CB8; border-bottom: 1px solid #ddd;}
.pub-top-main .selected {  color:#fff; line-height:45px; background:url(https://www.cens.com/cens/images/newhome/pubitems.gif) no-repeat #fff 0 0; background-size: contain;}
.pub-content-right { float:left; margin-left:10px; width:713px; }

.m-nav-bar {
  display: none;
  background: #006CB8;
  padding: 3px;
}

.m-pub-top-main {
  display: none;
  -webkit-appearance: none;  /* no ios style */
  -moz-appearance: none;     /* FireFox */
  appearance: none;
  border: none;
  background: rgb(210,210,210);
  background: linear-gradient(to bottom, rgba(210,210,210,1) 0%,rgba(220,220,220,1) 10%,rgba(182,182,182,1) 100%);
  color: #006cb7;
  text-shadow: #fff 1px 1px;
  text-align: left;
  white-space: nowrap;
  /* width: 280px; */
  max-width: 100%;
  height: 40px;
  padding: 0 20px 0 15px;
  overflow: hidden;
  cursor: pointer;
  border: 1px solid #006cb7;
  border-radius: 5px;
  z-index: 99;
}

.top-container {display: flex; flex-direction: row;}
.top-r-container {width: calc(100% - 282px);}

.right-content { display:none; font-family: initial;}
.selected .right-content {display: block;}
.right-content > .d-flex > div {margin-bottom: 2rem;}
.right-content .n-left { flex: 0 0 calc(230px + 1.5rem); }
.right-content .n-right { width: calc(100% - 240px - 1.5rem); flex: 1 0 300px; overflow: auto; margin-right: 2rem;}
.pub-top-main ul .selected { display:block !important; }
.pub-hotproduct { display:none; }
.sub-cate { font:15px arial; line-height: 1.4; display: flex; flex-direction: row; flex-wrap: wrap;}
.sub-cate span { flex: 0 0 auto; display:block; overflow:hidden; margin-right: 1em; position: relative;}
.sub-cate span::before {
  content: "\2022";
  color: #006CB8;
  font-weight: bold;
  display: inline-block;
  width: 1em;
  text-align: center;
}
.sub-cate a		 { color:#555; text-decoration:none;}
.sub-cate a:hover { color: red; /*text-decoration:underline;*/ }
.right-content h4 {  color:#006CB8; font:bold 1.5rem var(--title); }
.right-content .right-img { margin-right: 1.5rem; display:block; background:#fff;}
.pub-adv-off { display:none; }
.right-content .e-magazine { position:absolute; left:720px; top:0px; }
.right-content .n-left img.a { width:240px; box-shadow: -3px -1px 5px #333;}
.right-content .n-left img.b { width:42px; margin-right:4px; display: inline-block; box-shadow: 2px 1px 3px #333; }
.right-content .n-left img.m { margin-top:4px; margin-bottom:4px; }
.right-content .n-left .s { font:bold 12px arial; display:block; line-height:30px; color: #666;}
.right-content h1 { font:bold 2rem var(--title); color:#006CB8; margin-bottom: 0.5em; padding-left: 0.25em; border-left: 0.25em solid;}
.right-content h2 { font:bold 1.75rem var(--title); }
.right-content h3, h1 small { font:bold 1.5rem var(--title); color:#E5A645; margin-bottom:6px; margin-left: 0.5em; white-space:nowrap}
.right-content .n-right h5 { display:none; }
.right-content .n-right p { line-height:1.5; display:block; font-size:1rem; font-weight:normal; color: #666;}
.showmore {display: none;}

.e-magazine  { display:block; width:150px; height:211px; }
.e-magazine:hover { background:url(https://www.cens.com/cens/images/newhome/pdfdownload.png) no-repeat center; }

.e-magazine-area { background:#efefef; display:block; padding:10px; height:144px; margin-bottom:30px; width:100%; overflow:hidden; }
.e-magazine-area a { display:table; margin:7px; float:left; margin-bottom:12px; }
.e-magazine-area .select { border:4px #ffff00 solid; margin:3px; }
.e-magazine-area .nselect { margin-left:8px; margin-right:8px; }
.e-magazine-area img { max-width:92px; }
.e-magazine-area .npart { border-left:1px #ccc solid;border-right:1px #fff solid; height:130px; }

.moreline {margin-bottom: 1rem;}
.samplepages {display: none;}

.n-tail {flex: 0 1 298px; margin: 0 auto;}
.videolink {position: relative; margin-bottom: 2rem;}
.YT-icon {
    position: absolute;
    top: 0;
    width: 100%;
    height: 224px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 24 24"><path fill="%23ff0000CC" d="M19.615 3.184c-3.604-.246-11.631-.245-15.23 0-3.897.266-4.356 2.62-4.385 8.816.029 6.185.484 8.549 4.385 8.816 3.6.245 11.626.246 15.23 0 3.897-.266 4.356-2.62 4.385-8.816-.029-6.185-.484-8.549-4.385-8.816zm-10.615 12.816v-8l8 3.993-8 4.007z"/><path id="svg_2" d="m9,16l0,-8l8,3.993l-8,4.007l0,-10l0,3l0,7z" fill="%23ffffffCC"/></svg>');
    background-repeat: no-repeat;
    background-position: center center;
}
.obv-btn-list a {
  opacity: 1
  -webkit-transition-property: opacity;
  transition-property: opacity;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.obv-btn-list a:hover, .obv-btn-list a:focus {
  opacity: 0.7;
}

@media (max-width: 991.98px) {
  .hotproduct .each {
    width: 130px;
  }
}
@media (max-width: 767.98px) {
  .m-nav-bar {
    display: block;
  }
  .m-pub-top-main {
    display: inline-block;
  }
  .m-pub-top-main span {
    white-space: nowrap;
    width: calc(100% - 30px);
    display: inline-block;
    font-weight: bold;
    font-size: 18px;
  }
  /* .pub-top-main li:not(.selected) {
    display: none;
  } */
  /* .pub-top-main li,
  .pub-top-main li .name, {
    display: none;
  } */
  .pub-top-main nav {
    display: none;
  }
  .pub-top-main.m-show nav {
    display: block;
  }
  .pub-top-main.m-show ul {
    border: 3px solid #006CB8;
    display: inline-block;
  }
  .pub-top-main.m-show li,
  .pub-top-main.m-show li .name  {
    display: block;
  }
  .pub-top-main .selected .name {
    background: #006cb7;
  }

  .pub-top-main ul li {
    width: auto; /* for ie */
    height: auto;
    padding-left: 0;
    position: static;
    overflow: hidden;
  }
  .pub-top-main .name {
    padding: 0 15px;
  }

  .right-content {
    max-height: none;
    position: static;
    padding-top: 20px;
    background: white;
  }

  .right-content .n-left {
    float: none;
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin-bottom: 1rem;
  }
  .right-content .n-left .moreline {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    margin-bottom: 0;
  }

  .right-content .n-left .s {
    display: none;
  }
  .right-content .n-right {
    width: 100%;
    overflow: hidden;
    max-height: none;
    margin-right: 0;
  }
  .right-content .n-right p {
    font-size: 13px;
  }
  .sub-cate {
    font: 15px/1.5 arial;
    max-height: 300px;
    overflow: hidden;
  }
  .sub-cate span {width: auto; float: none;} /* for ie */
  /* .right-content .sub-cate.expand { max-height:100%; } */
  .showmore {display: none; cursor: pointer; color: #006CB8; background: #eee; text-align: center; padding: 10px 0;
      position: absolute;
      bottom: 0;
      width: 100%;
    }
  .showmore.show {display: block;}
  .hotproduct .each {
    margin: 0.5rem 1%;
    width: 48%;
    flex-basis: auto;
  }
  .hotproduct .each:nth-child(6) {
    display: flex;
  }
  .hotproduct .each-big div {
  }
  .hotproduct .each-big div img {
    max-width: 100%;
    max-height: 200px;
  }
  .hotproduct .each #company,
  .hotproduct .each #product {
    width: 100%;
    height: initial;
    text-align: center;
    line-height: 18px;
  }
  .featuredsupplier .adv2 div {
    width: 50%;
    text-align: center;
    margin-left: 0;
  }

  .pub-top-main.m-show .right-content {display: none !important;}

  .top-r-container {width: 100%;}

}

/* news */
.news-content {display: none;}
.news-content ul {
    margin-bottom: 2rem;
}
.news-content li {
  margin-bottom: 1.25rem;
}
.news-content h6 {
  color: inherit;
  font-size: 0.9rem;
  text-align: left;
}
.media {
    border: 1px solid #AAA;
    border-radius: 0.5em;
    padding: 0.5em;
    color: #555;
    height: 100%;
  }
a.piclink {
    flex: 0 0 108px;
    text-align: center;
}

/* hvr */
.hvr-fade {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    overflow: hidden;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: color, background-color;
    transition-property: color, background-color;
}
.hvr-underline-from-left:before, .sub-cate a:after {
    content: "";
    position: absolute;
    z-index: -1;
    left: 0;
    right: 100%;
    bottom: 0;
    background: red;
    height: 2px;
    -webkit-transition-property: right;
    transition-property: right;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}
.piclink:hover .hvr-fade, .piclink:focus .hvr-fade, .piclink:active .hvr-fade {
    background-color: #006cb8;
    color: white;
}
.hvr-underline-from-left:hover:before, .hvr-underline-from-left:focus:before, .hvr-underline-from-left:active:before,
.sub-cate a:hover:after, .sub-cate a:focus:after, .sub-cate a:active:after {
    right: 0;
}