@charset "UTF-8";
:root {
  --theme-color: #28af74;
  --theme-color-light:#e1fef1;
  --secondary-color: #e0e041;
 --highlight-color:#fe6d2c;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: -apple-system, "Noto Sans", "Helvetica Neue", Helvetica, "Nimbus Sans L", Arial, "Liberation Sans", "PingFang SC", "Hiragino Sans GB", "Noto Sans CJK SC", "Source Han Sans SC", "Source Han Sans CN", "Microsoft YaHei", "Wenquanyi Micro Hei", "WenQuanYi Zen Hei", "ST Heiti", SimHei, "WenQuanYi Zen Hei Sharp", sans-serif;
  vertical-align: baseline;
-webkit-tap-highlight-color: rgba(0,0,0,0);
scroll-behavior: smooth;
}
body {
  line-height: 1;
  color: black;
  background: white;}
ol, ul {
  list-style: none;}
table {
  border-collapse:collapse;
  border-spacing: 0;}
caption, th, td {
  text-align: left;
  font-weight: normal;}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";}
blockquote, q {
  quotes: "" "";}
abbr,acronym {
  border:0;}

/* Below are the CSS styles that aren't included with Blueprint. It's a good idea to keep them whether or not you use it unless you know what you're doing. */

/* Text styles */
.blog-featured h2 {
  font-size: 1.5em;
  margin-bottom:0em;}
p.readmore {
  text-indent:0;
  font-size: .9em;}
.joomla-footer {
  font-size: .9em;
  margin-bottom: 30px;}

/* Article functions */
ul.actions {
  clear:both;
  margin-top: -50px;
  float:right;}
ul.actions li {
  list-style-type: none;
  float:right;
  margin-left: 10px;}

/* Login styles */
p#form-login-username label,
p#form-login-password label {
  width: 160px;
  display:block;}
p#form-login-remember label {
  font-size: .9em;
  font-weight: normal;
  line-height: 25px;}
p#form-login-remember input {
  float:left;
  margin-right: 5px;}
form#form-login ul {
  margin: 0;
  padding: 0;}
form#form-login ul li {
  list-style-type: none;
  margin-left: 20px;
  font-size: .9em;}

/* Image float styles */
.img-fulltext-left {
  float:left;
  margin-right: 20px;
  margin-bottom: 20px;}

.img-intro-left {
  float: left;
  margin-right: 10px;
  margin-bottom: 10px;}

.img-fulltext-right {
  float: right;
  margin-left: 20px;
  margin-bottom: 20px;}

.img-intro-right {
  float: right;
  margin-left: 10px;
  margin-bottom: 10px;}

/*HNUSD*/
::selection,::-moz-selection,::-webkit-selection{background:#88ca29;color:#fff;}
body{
   
    background:#fff;}


.extlinks{color:#fff;min-height:40px;text-align: center;}
.extlinks ul li{display:inline-block;}
.extlinks ul li a{
  display:inline-block;
  padding:0 10px;
  line-height:40px;
  color:#999;
  font-size:12px;
  text-decoration:none;}
.extlinks ul li a:hover{background:#444;color:#eee;}


#globalheader{
  background:#fff;
  margin:0;
  box-shadow:4px 0 20px rgba(0,0,0,0.1);
    position: sticky;
top:0;
width:100%;
    z-index: 99;
box-sizing:border-box;
height:90px;
}
#globalheader .innerwrapper{  
  position:relative;
  height:100%;
    width:100%;
 box-sizing:border-box;
display:flex;
padding:0 30px;
    margin: auto;}
#logoheader{
flex:300px;
height:100%;
position:relative;
}
#logoheader a{
display:inline-block;
position:absolute;
top:50%;
left:0;
transform:translate(0,-50%);
transition:all 0.3s;
overflow:hidden;
}
#logoheader .textlogo{display:none;}
#logoheader img{
height: 80px;
}

#headline{
  width:100%;
  box-sizing:border-box;
 
top:0;
  z-index: 7;
   overflow:hidden;
}
#headline>.titlebox{
position:absolute;
top:30px;
left:30px;
width:300px;
height:300px;
background:url(../images/ui/logo_white.png) no-repeat;
background-size: contain;
z-index:9;
}
#headline .title{
    font-size: 120px;
    font-weight: bold;
    text-align: left;
    color: #fff;
    width: 100%;
    height: 1em;
    letter-spacing: -.05em;
}
#headline .subtitle{
    font-size: 100px;
    text-align: left;
    color: #fff;
    width: 100%;
    height: 1em;
    letter-spacing: -.1em;
}
/*
#headline::before{
    z-index: 8;
    content: "HNU.Design";
    font-size: 120px;
    font-weight: bold;
    text-align: left;
    color: #fff;
    width: 100%;
    height: 1em;
    letter-spacing: -.05em;
    position: absolute;
    left: 30px;
    bottom: -0.15em;
   }
*/
#headline .swiper-container{
    height:450px;
    width:100%;
}
#headline .swiper-slide img{
   height:450px;
   min-width:100%;
}

#headline .swiper-container-horizontal>.swiper-pagination-bullets, #headline .swiper-pagination-custom, .swiper-pagination-fraction{
   width:100px;
   bottom:auto;
   top:10px;
   right:10px;
   left:auto;
}

.wrapper{
  width:80vw;
  padding:40px 0;
  background:#fff;
  margin:auto;
  display:flex;
box-sizing: border-box;
    position: relative;
    z-index: 9;}

.mainmenugroup{
   flex:100%;
    z-index: 90;
    display:flex;
position:relative;
}
#mainmenubtn{
display:none;
}


.searchbox{width:100%;margin-bottom:20px;}
.searchbox .inputbox{
  color:#333;
  border: #ddd 1px solid;
    font-size: 16px;
    font-family: sans-serif;
  padding:6px 6px 6px 50px;
  width:100%;
  line-height: 2.5em;
border-radius:50px;
  box-sizing: border-box;
  background:url(../images/ui/icon_search_16.jpg) no-repeat 20px center;}
.searchbox .inputbox:focus{
    background-color:#efefef;
    color:#333;
    outline: none;}
.searchbox .inputbox:blur{}
#mainmenu{
    flex: 100%;
    padding:0 20px;
   box-sizing:border-box;
}

#mainmenu>ul{
    position:relative;
    /*background:url(../images/ui/mainmenu_leading_bg.jpg) no-repeat 0 70px;*/
    display: flex;
    width:100%;}
#mainmenu>ul>li{
position:relative;
flex:1;
transition: all .3s;
}
#mainmenu>ul>li:hover{
background:#eee;
   flex:1.5;
}
#mainmenu>ul>li>a{
  display:inline-block;
  padding:0 10px;
  text-decoration:none;
  color:#333;
  font-size:16px;
  height:90px;
  line-height:90px; 
  width: 100%;
  box-sizing: border-box;
  text-align:center;
}
#mainmenu>ul>li>a:hover{
background:#eee; 
  }
#mainmenu>ul>li.nav_active>a{
  border-bottom:var(--theme-color) 3px solid;}
#mainmenu>ul>li>ul.sub_menu{
position: absolute;
top:90px;
left: 50%;
transform:translate(-50%,0);
display: none;
width:100%;

}
#mainmenu>ul>li:hover>ul.sub_menu{
display: flex;
flex-direction: column;
background:#eee;
}
#mainmenu>ul>li>ul.sub_menu>li{
width:100%;
}
#mainmenu>ul>li>ul.sub_menu>li:last-child{
 padding-bottom:1em;
}
#mainmenu>ul>li>ul.sub_menu>li>a{
text-align: center;
    border: none;
    text-decoration: none;
    background: none;
    color: #333;
    font-size: 14px;
    box-sizing: border-box;
    
    width: 100%;
    display: block;
    line-height: 3em;
}

#mainmenu>ul>li>ul.sub_menu>li>a:hover{
color:#fff;
background:var(--theme-color); 
}
#mainmenu>ul>li>ul.sub_menu>li.selected>a{
  color: #358900;}


#maincol{flex: 100%;
    overflow: hidden;
    padding-right: 80px;
    box-sizing: border-box;}
#maincol img{max-width: 100%;}
#maincol a{text-decoration:none;color:var(--theme-color);}
#maincol h1{font-size:14px;font-weight:bold;margin:0 0 20px 0;}
#maincol h2 {
  padding:10px 0;
  margin-top:30px;
  line-height:30px;
  font-size:24px;
  text-decoration:none;
  color:var(--theme-color);
  font-weight:bold;}
#maincol h2 a{
  font-size:22px;
  text-decoration:none;
  color:#333;
  font-weight:bold;}
#maincol h2 a:hover{color:var(--theme-color);}

#maincol h4{font-size:18px;font-weight:bold;margin:1em 0;}
#maincol h5{font-size:14px;font-weight:bold;}
#maincol p{font-size:16px;margin:10px 0;line-height:2em;}

#maincol ul li{list-style-type:disc;margin:4px 40px;font-size:14px;line-height:24px;}
#maincol ol li{list-style-type:decimal;margin:4px 40px;font-size:14px;line-height:24px;}
#maincol ul>ul li{list-style-type:circle;margin-left:80px;}

#maincol .article-info{padding:4px 0;font-size:14px;color:#666;margin-bottom:1em;}
#maincol .article-info .article-info-term{display:none;}
#maincol .article-info .published{text-shadow:0 1px rgba(255,255,255,1);}
#maincol .article-info .portrait{ width:60px;height:60px;float:left;margin-right:10px;}

#maincol .v_news_content img.photo{align:left;padding-right:10px;}


#maincol .search{font-size:14px;} 
#maincol .search .searchintro{
  border-bottom:#ccc 1px solid;}
#maincol .search .phrases{
  font-size:14px;
  border-bottom:#ccc 1px solid;
  padding:10px 0;
  margin:10px 0;}
#maincol .search .phrases .ordering-box{margin-top:10px;}
#maincol .search .only{
  border-bottom:#ccc 1px solid;
  padding:10px 0;
  margin:10px 0;}
#maincol .search-results .result-title{
  font-weight:bold;
  font-size:16px;
  margin:30px 0 10px 0;
  line-height:30px;}
#maincol .search-results .result-category{
  font-size:12px;
  color:#666;
  margin:0 0 10px 10px;
  font-weight:bold;}
#maincol .search-results .result-text{
  font-size:14px;
  line-height:24px;
  color:#666;}
#maincol .search-results .result-created{
  padding: 4px 10px;
  background: #EEE;
  position: relative;
  font-size: 12px;
  color: #666;
  border-left: #CCC 6px solid;
  margin: 10px 0;
  text-shadow:0 1px rgba(255,255,255,0.5);}
#maincol .search-results .highlight{
  background:#FC0;}
  
#maincol .itemtable{font-size:12px;}
#maincol .itemtable th{background:#999;color:#eee;font-weight:bold;}
#maincol .itemtable td{padding:4px;border-collapse:collapse;border:#ccc 1px solid;}
#maincol .itemthumbnail{padding-right:10px;}
#maincol .photowall{font-size:0; margin-bottom:40px;}
#maincol .photowall img{
margin:4px;
max-width:60px;
filter:grayscale(100%)
}
#maincol .btn{
background: #eee;
    padding: 0 0 0 10px;
    line-height: 3em;
    font-size: 16px;
    color: #333;
    margin: 1em 0;
    font-weight: bold;
    border-left: var(--theme-color) 6px solid;
}
#maincol .btn a{text-decoration:none;color:var(--theme-color);
  line-height:32px;display:inline-block;}
#maincol .btn a:hover{color:#000;}

#maincol .itemsidebar{
  width:200px;
  box-sizing:border-box;
  float:right;
  clear: both;
  margin:8px 4px 8px 8px;
  padding:10px;  
  background: #EEE;
  border-bottom: var(--theme-color) 3px solid;
  border-right: #CCC 3px solid;
  overflow: hidden;
  text-shadow: 0 1px rgba(255, 255, 255, 1);}
#maincol .itemsidebar h4{
  border:none; 
  border-bottom:#fff 1px dotted;
  padding:8px;margin:0;
  font-size:12px;}
#maincol .itemsidebar ul li{font-size:12px;padding:8px;margin:0;list-style-type:none;}
#maincol .itemsidebar ul li a{color:var(--theme-color);text-decoration:none;}
#maincol .itemsidebar ul li a:hover{color:#000;}


#maincol .image_description,#maincol .imginfo{
  text-align:center;
  text-shadow:0 1px rgba(255,255,255,1);
  font-size:12px;
  margin:0 0 20px 0;
  color:#333;
  font-style:italic;
  background:#eee;
  background:-webkit-linear-gradient(top, #eee, #fff);
  background:-moz-linear-gradient(top, #eee, #fff);
  background:-ms-linear-gradient(top, #eee, #fff);
  background:-o-linear-gradient(top, #eee, #fff);}
#maincol .readmore{

}
#maincol .readmore a{
  text-decoration:none;
  display:inline-block;
  padding:6px 1em;
line-height:2.5em;
  border-radius:3em;
  color:#666;
  background-color:#eee;}
#maincol .readmore a:hover{color:#fff;background-color:#333;}

#maincol .filters{background:#eee;padding:6px 10px;font-size:12px;}
#maincol .filters .hidelabeltxt{display:none;}
#maincol .category{width:100%;}
#maincol .category th{
  padding:10px;
  background:var(--theme-color);
  background:-webkit-linear-gradient(top, #8BC53F, #339900);
  background:-moz-linear-gradient(top, #8BC53F, #339900);
  background:-ms-linear-gradient(top, #8BC53F, #339900);
  background:-o-linear-gradient(top, #8BC53F, #339900);}
#maincol .category th a{text-decoration:none;color:#fff;font-weight:bold;font-size:12px;}
#maincol .category th a:hover{color:#000;}
#maincol .category td{padding:10px;}
#maincol .category td a{text-decoration:none;color:var(--theme-color);font-weight:bold;font-size:14px;}
#maincol .category td a:hover{color:#000;}
#maincol .list-title{font-size:14px;line-height:1.5em}
#maincol .list-date{min-width:100px;font-size:12px;text-align:right;}
#maincol .pagination{
  background:#eee;
  height:3em;
 margin:2em 0;
  position:relative;
  font-size:16px;}
#maincol .pagination ul{position:absolute;right:10px;top:0;}
#maincol .pagination .counter{margin:0 0 0 10px;line-height:48px;}
#maincol .pagination ul li{display:inline-block;line-height:48px;text-align:center;color:#ccc;
  min-width:30px;margin:0;}
#maincol .pagination ul li a{
  padding:0 10px;
  text-decoration:none;
  display:inline-block;
  box-sizing:border-box;
  color:#333;
  text-shadow:0 1px rgba(255,255,255,1);}
#maincol .pagination ul li a:hover{background:#ccc;}

#maincol ul.pagenav{
  margin:20px 0;
  clear:both;
  position:relative;
  overflow:hidden;
  background:#eee;
height:3em;
display:flex;
  }
#maincol ul.pagenav li{
margin:0;list-style-type:none;
flex:1;
}
#maincol ul.pagenav li a{
  display:inline-block;
  width:100%;
  padding:10px 2em;
  height:100%;  
  box-sizing:border-box;
  color:#333;
font-size:14px;
font-weight:bold;
  }
#maincol ul.pagenav li a:hover{background:#ccc;}
#maincol ul.pagenav .pagenav-next{right:0;text-align:right;}
#maincol ul.pagenav .pagenav-prev{left:0;}

#maincol .hightlights{
  color:#333;
  font-weight:bold;
  font-size:13px;
  background:#FF9;
  padding:10px;}
#maincol .highlights{
  color:#333;
  font-weight:bold;
  font-size:13px;
  background:#FF9;
  padding:10px;}
#maincol ul.photo-list{
    display: grid;
    grid-template-columns: repeat(8,1fr);
}
#maincol ul.photo-list li{
  list-style:none;
  display: inline-block;
  width:60px;
  margin:10px;
  vertical-align:top;}

#maincol ul.photo-list li a{
  display:inline-block;
  vertical-align:top;
width:100%;
}

#maincol ul.photo-list li span{
  display:block;
  width:100%;
  text-align:center;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}



#rightcol{flex:400px;overflow:hidden;margin-bottom:20px;}
#rightcol .sidebar_1col{
  clear:both;}
#rightcol .sidebar_1col h3{
  background:#eee;
  padding:0 0 0 10px;
  line-height:3em;
  font-size:16px;
  margin:20px 0 10px 0;
  text-shadow:0 1px rgba(255,255,255,0.8);
  color:#333;
  border-left:var(--theme-color) 6px solid;
  font-weight:bold;}
#rightcol .sidebar_1col ul{margin-left:10px;}
#rightcol .sidebar_1col ul li{
  font-size:14px;
  padding:6px 10px 6px 0;
  margin-left:20px;
  list-style-type:disc;
  line-height:24px;}
#rightcol .sidebar_1col ul li a{
  text-decoration:none;
  color:#444;}
#rightcol .sidebar_1col ul li a:hover{color:var(--theme-color);}

#rightcol .sidebar_2col{
  position:relative;  
  overflow:hidden;
  clear:both;}
#rightcol .sidebar_2col h3{
  background:#eee;
  padding:0 0 0 10px;
  line-height:3em;
  font-size:16px;
  color:#333;
  margin:1em 0;
  font-weight:bold;
  border-left:var(--theme-color) 6px solid;}
#rightcol .sidebar_2col ul{
 }
#rightcol .sidebar_2col ul li{
  font-size:12px;}
#rightcol .sidebar_2col ul li a{
  text-decoration: none;
    color: #444;
    display: inline-block;
    font-size: 14px;
    padding: .5em 1em;
    width: 100%;
    box-sizing: border-box;
    line-height: 1.5em;
}
#rightcol .sidebar_2col ul li a:hover{color:var(--theme-color);}

#rightcol .sidebar_2col .morebtn{
  position:absolute;
  right:0;
  top:0;}
#rightcol .sidebar_2col .morebtn a{
  display:inline-block;
  line-height:3em;  
  font-size:16px;
  text-decoration:none;
  padding:0 1em;
  color:#666;
  text-shadow:0 1px rgba(255,255,255,0.4);
  }
#rightcol .sidebar_2col .morebtn a:hover{background:#ccc;}
/*
#rightcol .sidebar_3col{clear:both;}
#rightcol .sidebar_3col h3{
  background:#ddd;
  padding:0 0 0 10px;
  line-height:30px;
  font-size:12px;
  margin:20px 0 10px 0;
  text-shadow:0 1px rgba(255,255,255,0.8);
  color:#333;
  border-left:#390 6px solid;
  font-weight:bold;}

#rightcol .sidebar_3col ul {margin:10px 0;overflow:hidden;font-size:0;display: flex;}

#rightcol .sidebar_3col ul li{
    flex:1;
    display:inline-block;
    box-sizing:border-box;
    vertical-align:top;
    font-size:14px;
    text-align: center;
    padding:10px 0;}
*/

#bulletinbox{width:100%;position:relative;}
#newsbox{width:100%;position:relative;}


.resource-list{

display:flex;
flex-direction:column
}
.resource-list li{list-style:none;}
.resource-list li img{width:100%;}
.resource-list li a{text-decoration:none;line-height:20px;font-size:12px;color:#333;}
.resource-list li a:hover{color:var(--theme-color);}
.resource-list li .p_info{padding:0 10px;display:block;}

#toolbar{
  font-size:0;
  margin:10px 0;
  background:#eee;
display:flex;
}
#toolbar li {flex:1;}

#toolbar li a{
  line-height:5em;
  font-size:12px;
  padding:0 6px 0 40px;
  display:inline-block;
  width:100%;
  box-sizing:border-box;
  text-decoration:none;
  color:#333;
  text-shadow: 0 1px rgba(255, 255, 255, 0.5);
  font-weight:bold;
    text-align: center;}
#toolbar .btn_download a{background:url(../images/ui/icon_doc_36.jpg) no-repeat 10px center ;}
#toolbar .btn_faq a{background:url(../images/ui/icon_faq_36.jpg) no-repeat 10px center ;}
#toolbar .btn_contact a{background:url(../images/ui/icon_location_36.jpg) no-repeat 10px center ;}
#toolbar li a:hover{background-color:#ddd;}
#mainfooter{
  clear:both;
  background:#333;
  padding:20px 10px;
  color:#eee;
  font-size:14px;
  text-align: center;}
#mainfooter .copyright{margin:1em 0;}
#mainfooter .copyright a{
  color:#eee;
}
#mainfooter .copyright a:hover{
  color:#fff;
}
#InfoPanel{
  display:none;
  width:100%;
  position:fixed;
  bottom:0;
  left:0;
  font-size:14px;
  background:#FC0;
  padding:10px 0;
  overflow:hidden;
  z-index = 99;
  border-top:#333 6px solid;}
#InfoPanel p{padding-left:10px;}
#InfoCloseBTN{
  color:#fff;
  cursor:pointer;
  display:inline-block;
  padding:10px;
  background:#333;
  position:absolute;
  top:0;
  right:0;}
.djslider-default .load-button{
    background-color:var(--theme-color);}
/* media query */
@media screen and (max-width: 1010px) {

    #globalheader{
      height:70px;}
    #globalheader .innerwrapper{
        width:100%;}
    #globaltopbar .innerwrapper{
    width: 100%;}
    #logoheader a{
    height:60px;
    width:62px;
   
}
      #mainmenubtn{
    display:block;
    width:70px;
    height:70px;
    line-height: 70px;
    text-align: center;
    font-size:0;
    position:absolute;
    top:0;
    right:0;
    cursor:pointer;
    z-index:999;
    letter-spacing:0.5em;
    color:#fff;
transition:all 0.3s;
}
  #mainmenubtn:before{
        content:"+";
        font-size: 30px;
        color:#999;
        position:absolute;
       top:50%;
       left:50%;
       transform:translate(-50%,-50%);
}
.menustate #mainmenubtn{
      position:fixed;
      transform:rotate(45deg);
}
    .mainmenugroup{
        position:fixed;
        top:0;
right:0;
bottom:0;
        box-shadow:0 4px 6px rgba(0,0,0,0.4);
        background: #fff;
        width:540px;
        display: none;
        
        left:auto;
padding-top:70px;
box-sizing:border-box;
}
body.menustate{
touch-action:none;
}
.mainmenugroup{
        display: block;
overflow:auto;
touch-action:auto;
transform:translateX(101%);
transition:all .4s;
}
.menustate .mainmenugroup{
        transform:translateX(0);
}
  #mainmenu{
        position:relative;
        background: none;
      float: none;
    padding:0 30px;
}
  #mainmenu>ul{    
    background: #fff;
    z-index:99;
    position:static;
    display: block;
    width:100%;}  
  #mainmenu>ul>li {
    display: block;
    position: relative;
}
#mainmenu>ul>li:hover{
  background-color:transparent;
}
  #mainmenu>ul>li>a {
    display:block;
    text-decoration: none;
    color: #666;
    font-size: 32px;
font-weight:bold;
    height: 60px;
    width:auto;
    line-height: 60px;
    background: #fff;
text-align:left;
}  
  #mainmenu>ul>li>a:hover{color:#333;}
  
  #mainmenu>ul>li.selected{
    background:#8BC53F;}
  #mainmenu>ul>li.selected>a{
      border: none;
      border-top: #358900 3px solid;
      color: #fff;
      background: #8BC53F;}
  #mainmenu>ul>li.parent>ul {
    position: static;
    width: auto;
    display: block;
    box-shadow:none;
    white-space: normal;}
  #mainmenu>ul>li.parent>ul>li {
      display:inline-block;
    background: #eee;}
  #mainmenu>ul>li.parent>ul>li>a{text-shadow: 0 1px rgba(255, 255, 255, 0.3);border:none;}
  #mainmenu>ul>li.parent>ul>li.selected>a{
      font-weight:bold;
      background:#fff;
      border-top: #B3B3B3 3px solid;}
#mainmenu>ul>li>ul.sub_menu{
display: block;
    position: static;
    transform: none;
    background: #fff;
padding-left: 10px;
margin-bottom:1em;
}
#mainmenu>ul>li:hover>ul.sub_menu{
  display:block;
  background-color:transparent;
}
#mainmenu>ul>li>ul.sub_menu>li{
font-size:0;
width:auto;
display:inline-block
}
#mainmenu>ul>li>ul.sub_menu>li>a{
 text-align:left;
display:inline-block;
padding-right:1.5em;
}
#mainmenu>ul>li>ul.sub_menu>li>a:hover{
background-color:transparent;
}
    #logoheader{
        }
    #logoheader img{
        height:60px;}
   
    

  .wrapper{
      width:100%;
      padding:40px;
      box-sizing: border-box;
      position: relative;}
  #maincol{}
  #maincol img{max-width: 100%;}
#maincol ul.photo-list{
grid-template-columns: repeat(5,1fr);
}
  #rightcol{
}
 
  #bulletinbox{width:100%;}
  #newsbox{width:100%;position:relative;}
  #rightcol .sidebar_2col ul li a{padding:10px 0;}
  #toolbar li {
    display:block;
    width: 100%;}
  #rightcol .sidebar_3col ul li {
    
    box-sizing: border-box;
    vertical-align: top;
    font-size: 14px;
    text-align: center;}
  #featuredproduct li{height:auto;}
  }
@media screen and (max-width:710px){
  #globaltopbar .innerwrapper{
      width:100%;
      height:40px;}
  #globalheader{
      height:70px;}
  #globalheader .innerwrapper{
      width:100%;}  
    .mainmenugroup{
        width:100%;}

  
    #logoheader{
        }
    #logoheader img{
        height:60px;}
 
  .wrapper{width:100%;padding:30px;box-sizing:border-box;display:block;}

  #maincol{padding-right: 0}
  #maincol img{max-width:100%;}
#maincol ul.photo-list{
grid-template-columns: repeat(4,1fr);
}
  #rightcol{ margin-top:20px;}
    #rightcol .sidebar_3col ul{display: flex;flex-direction:column;}
  #bulletinbox{width:100%;}
  #newsbox{width:100%;position:relative;}
  #rightcol .sidebar_2col ul li a{padding:10px 0;}
  
  #featuredproduct li{text-align:center;}
  }



.item1031,.item1032,.item1051,.item1052 ,.item1053,.item1081 {display:none!important;}

#mainmenu ul li.id_parent ul {
    position: absolute;
    top: 40px;
        
    display: block;
    white-space: nowrap;
    border-top: #eee 3px solid;
}






/*站群系统 分页样式*/
.pagination{
  padding: 0 10px !important;
 display:flex;
align-items:center;
}

.pagination>table{
  padding:0px !important;
}
.pagination td, .pagination div{
font-size:16px !important;
}
.pagination>table span, .pagination>table a{
  width: 40px !important;
  text-align:center !important;
  height:40px !important;
  line-height:40px !important;
  border: none !important;
  background: transparent !important;
}
.pagination .PrevDisabled, .pagination .NextDisabled{
font-size:16px !important;
}
.pagination .Prev, .pagination .Next{
font-size:16px !important;
}
.pagination .defaultButtonStyle{
font-size: 16px !important;
    padding: 0 10px;
    line-height: 40px !important;
    box-sizing: border-box;
    height: 40px !important;
    background: var(--theme-color-light);
    border: none;
}
.pagination .defaultInputStyle{
    padding: 0 10px;
    line-height: 30px !important;
    box-sizing: border-box;
    height: 30px !important;
    margin: 0 important;
    border:none;
}


#style_menu { float: left; width:560px }

#style_menu li { display:inline-block }
#style_menu a{display: inline-block;
    padding: 0 15px;
    text-decoration: none;
    color: #333;
    font-size: 14px;
    height: 40px;
    line-height: 40px;
    width: 100%;
    box-sizing: border-box;}


#style_menu a:hover {background: #eee;}

.nav_active a{ border-bottom: #358900 3px solid;}


ul.sub_menu { display:none; position: absolute;left: 0; }
.nav_active ul.sub_menu { display:block;  }


#p5Box{
 height: 450px;
min-width: 100%;
position:relative;
}
#p5Box iframe{
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
width:100%;
height:450px;
}