﻿@charset "utf-8";
/* reset css 0719*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, input, textarea, p, th, td {margin:0; padding:0; -webkit-text-size-adjust:none;}
table {border-collapse:collapse; border-spacing:0;}
img {border:0;}
ol, ul {list-style:none;}
a{outline:none; /*hlbr:expression(this.onFocus=this.blur());*/ text-decoration:none;}
input , select , textarea , button{outline:none; border-radius:0;}

body{font-family:arial , "微軟正黑體"; background:#d0c0a6;}

/* header */
#header{position:absolute; left:0; top:0; width:100%; background:rgba(0,0,0,.7); z-index:100;}
#header .wrap{position:relative; max-width:1200px; margin:0 auto;}

#header .top{height:30px; background:#222;}
#header .top span{font-size:14px; color:#999; line-height:30px;}
#header .top span img{position:relative; top:5px; display:inline-block; width:20px; height:auto; margin:0 8px 0 5px;}

#sitemap {position:absolute; right:0; top:0; }
#sitemap a{display:inline-block; padding:0 10px; background:#555; font-size:14px; color:#FFF; line-height:30px; transition:all .3s;}
#sitemap a:hover{ background:#ff5632;}

#lang{position:absolute; right:76px; top:0; font-size:12px; color:#FFF;}
#lang a{display:inline-block; padding:0 6px; font-size:14px; color:#FFF; line-height:30px; transition:all .3s;}
#lang a:hover{background:#00ACED;}

#logo{display:inline-block; width:251px; height:55px; background:url(../images/logo.png) no-repeat left; text-indent:-9999px; cursor:pointer; margin:0 10px 0 0; box-sizing:border-box;}

#navigation{position:relative; display:inline-block; padding-left:30px;}
#navigation li{position:relative; display:inline-block; padding:0 5px;}
#navigation li > a{display:block; color:#EEE; line-height:55px; cursor:pointer; transition:all .3s;}
#navigation li > a:hover{color:#ff5632;}
#navigation li.sub > a:after{content:""; display:inline-block; width:10px; height:10px; background:url(../images/navi_arrow.png); margin-left:3px;}
#navigation li .sub-menu{position:absolute; left:-25%; top:55px; display:none; width:150%;}
#navigation li .sub-menu:before{content:""; position:absolute; left:50%; top:-5px; display:block; width:0; height:0; margin-left:-5px; border-style:solid; border-width:0 5px 5px 5px; border-color:transparent transparent #FFF transparent;}
#navigation li .sub-menu > a{display:block; background:#FFF; border-left:4px solid #cdcbcb; border-bottom:1px solid #edecea; font-size:14px; color:#777; line-height:40px; text-indent:20px; transition:all .3s;}
#navigation li .sub-menu > a:hover{border-left-color:#ff5632; background:#f9f8f5; color:#000;}

#navigation li.search>a:before{content:""; position:relative; top:8px; display:inline-block; width:25px; height:25px; background:url(../images/navi_icon.png) no-repeat; margin-right:3px;}
#navigation li.search dl{position:absolute; right:0; top:55px; display:none; width:450px; padding:20px; background:#FFF; box-sizing:border-box;}
#navigation li.search dl:before{content:""; position:absolute; right:10px; top:-5px; display:block; width:0; height:0; margin-left:-5px; border-style:solid; border-width:0 5px 5px 5px; border-color:transparent transparent #FFF transparent;}
#navigation li.search dt{padding-bottom:20px; font-size:16px; color:#000; font-weight:bold;}
#navigation li.search dd{position:relative; /*padding-right:90px;*/}
#navigation li.search dd input{display:block; width:100%; height:40px; padding:10px; border:1px solid #CCC; border-radius:3px; box-shadow:1px 1px 2px #eee; box-sizing:border-box;}
#navigation li.search dd button{position:absolute; right:0; top:0; display:block; width:80px; height:40px; background:#ff5632; border:none; border-radius:3px; font-size:14px; color:#FFF; text-align:center; cursor:pointer; transition:all .3s;}
#navigation li.search dd button:hover{ opacity:.8;}
#navigation li.search dl .keywords{ margin:20px 0 0 0;}
#navigation li.search dl .keywords b{ display:block; font-weight:normal; color:#333;}
#navigation li.search dl .keywords a{ display:inline-block; margin:10px 10px 10px 0; color:#ff5632; transition:all .3s;}
#navigation li.search dl .keywords a:hover{ opacity:.8;}
#navigation li.search dl .search-more a{ display:inline-block; line-height:15px; margin:10px 0 0 0; padding:0 0 0 15px; color:#333; background:url(../images/search-more.png) left top no-repeat;}
#navigation li.search dl .search-more a:hover{ color:#ff5632; background:url(../images/search-more.png) left bottom no-repeat;}

.facebook-pc { position: relative; top: -2px; display: inline-block; width: 18px; height: 18px; margin-right: 3px; }
.facebook-mobile { position: absolute; right: 48px; top: 13px; width: 22px; height: 20px; cursor: pointer; display: none; }

/* mobile */
#mobi-btn{position:absolute; right:10px; top:15px; display:none; width:22px; height:20px; background:url(../images/mobi_btn.png) left top no-repeat; cursor:pointer}
#mobi-btn:hover{background-position:left bottom;}
#mobile{display:none; background:#FFF;}
#mobile li{padding:15px 0; border-bottom:1px solid #EEE; text-align:right;}
#mobile li > a{display:block; padding:0 15px; font-size:18px; color:#333; cursor:pointer;}
#mobile li.sub > a:after ,
#mobile li.search > a:after{content:""; display:inline-block; width:10px; height:10px; background:url(../images/navi_arrow.png); margin-left:5px;}
#mobile li.search > a:before{content:"搜尋"; }
#mobile li.search .keywords{ margin:20px 0 0 0; text-align:left;}
#mobile li.search .keywords b{ display:block; font-weight:normal; color:#333;}
#mobile li.search .keywords a{ display:inline-block; margin:10px 10px 10px 0; color:#ff5632; transition:all .3s;}
#mobile li.search .keywords a:hover{ opacity:.8;}
#mobile li.search .search-more {text-align:left;}
#mobile li.search .search-more a{ display:inline-block; line-height:15px; margin:10px 0 0 0; padding:0 0 0 15px; color:#333; background:url(../images/search-more.png) left top no-repeat;}
#mobile li.search .search-more a:hover{ color:#ff5632; background:url(../images/search-more.png) left bottom no-repeat;}
#mobile li > a.active{color:#ff5632;}
#mobile li .sub-menu{display:none; padding:10px; overflow:hidden;}
#mobile li .sub-menu a{display:block; padding:10px 0; border-bottom:1px solid #EEE; font-size:14px; color:#666;}
#mobile li.search dl{display:none; padding:10px;}
#mobile li.search dt{display:none;}
#mobile li.search dd{position:relative; padding-right:90px;}
#mobile li.search dd input{display:block; width:100%; height:40px; padding:10px; border:1px solid #CCC; border-radius:3px; box-shadow:1px 1px 2px #eee; box-sizing:border-box;}
#mobile li.search dd button{position:absolute; right:0; top:0; display:block; width:80px; height:40px; background:#ff5632; border:none; border-radius:3px; font-size:14px; color:#FFF; text-align:center; cursor:pointer;}

#mobile #lang{text-align:center;margin:20px 0 10px 0;right: 0px;position: relative;}
#mobile #sitemap{right: 0px;position: relative;text-align: center;}
#mobile #sitemap a{background: none;color: #3f464e;line-height: 37px;padding-left: 32px;font-size:15px; }
/* #mobile .lang  a:first-child,#mobile .lang a:nth-child(2){display:none;} */
#mobile #lang  a{ display:inline-block; color:#3f464e; font-size:15px; padding:0 16px; line-height:37px; transition:all .3s; -webkit-transition:all .3s;}
#mobile #lang  a:hover{ color:#108f50;}

/* index-slide */
#index-slide{position:relative;margin-top:85px;}
#index-slide .item img{display:block; width:100%; height:auto;}

#index-slide .owl-buttons,#index-slide .owl-nav{position:absolute;left:0;top:50%;width:100%;margin-top:-15px;overflow:hidden;}
#index-slide .owl-buttons div,#index-slide .owl-nav span{display:block; width:30px; height:30px; background:url(../images/slide_arrows.png); text-indent:-9999px; }
#index-slide .owl-buttons .owl-prev,#index-slide .owl-nav .owl-prev {float:left; margin-left:20px; background-position:left top;}
#index-slide .owl-buttons .owl-next,#index-slide .owl-nav .owl-next {float:right; margin-right:20px; background-position:right top;}
#index-slide .owl-nav .owl-next span{
  background-position: right top;
}
#index-slide .owl-nav{
  padding: 2px;
  box-sizing: border-box;
}
.slides-pagination a{
  text-indent: -9999px;
}
#index-slide .owl-buttons div,#index-slide .owl-nav button:focus{
  outline: 2px #ff5632 dotted !important;
}
.slides-pagination{
  position: relative;
  z-index: 2;
  margin-top: -40px;
  height: 60px;
  text-align: center;
}
#index-slide .owl-pagination{position:absolute; left:0; bottom:5%; width:100%; text-align:center;}
#index-slide .owl-pagination .owl-page,.slides-pagination a{display:inline-block; width:20px; height:20px; margin:0 5px; background:url(../images/bullets.png) center 3px no-repeat; transition:all .3s;}
#index-slide .owl-pagination .owl-page.active,.slides-pagination a.active{background-position:center bottom;}

/* index-content */
#index-content{ overflow:hidden; padding:20px 0 0 0;}

/* index-list */
#index-list{ padding:20px 0 0 0;}
#index-list .links { text-align:center;overflow:hidden;}
#index-list .links li {display:block; width:24%; margin:0 .5% 1% .5%; float:left; box-sizing:border-box; text-align:center; border-radius:5px; background:#000; transition:all .3s; position:relative;}
#index-list .links li div{ position:relative; overflow:hidden; transition:all .3s; background:#000; }
#index-list .links li div:after { padding-top: 62.5%; content:""; display: block;}
#index-list .links li a{ transition:all .3s;}
#index-list .links li div img{ display:block; position:absolute; top:0; bottom:0; right:0; left:0; max-width:100%; margin:auto; transition:all .3s;}
#index-list .links li div:after{ padding-top: 62.5%; content:""; display: block;}
#index-list .links li div:before{content:""; position:absolute; left:50%; bottom:20px; display:none; width:44px; height:44px; margin:0 0 0 -22px; background:url(../images/hover_arrow.jpg); border-radius:3px; z-index:3;}
#index-list .links li span{ display:block; font-size:20px; padding:10px; border-radius:5px 5px 0 0; box-sizing:border-box; color:#fff; font-weight:bold; position:absolute; z-index:1; width:100%; bottom:0; transition:all .3s;}
#index-list .links li span b{ display:none; font-size:18px; margin:10px 0 0 0;font-weight:normal; }
#index-list .links li a:hover img{transform:scale(1.1,1.1); -webkit-filter:blur(1px); opacity:.4;}
#index-list .links li a:hover span{bottom:30%;}
#index-list .links li a:hover span b{ display:block;}
#index-list .links li:hover div:before{ display:block;}

/* index-news */
#index-news{ overflow:hidden; padding:20px 0; width:96%; max-width:1120px; margin:0 auto;}

#index-news .media{  width:45%; float:left; padding-left:5%; box-sizing:border-box;padding-right:2px;}
#index-news .media a{display:block; padding:10px 0 20px 0; font-size:20px; color:#000;}
#index-news .media a:hover{color:#ff5632;}
#index-news iframe{width:100%; height:288px;}

#index-news .news{ width:55%; float:left;}
#index-news .news .tab{width:220px; overflow:hidden;}
#index-news .news .tab li{float:left; width:50%; border-top:3px solid transparent; font-size:20px; color:#555; line-height:44px; text-align:center; box-sizing:border-box; cursor:pointer; transition:all .3s;}
#index-news .news .tab li:hover{color:#ff5632;}
#index-news .news .tab li.active{background:#FFF; border-top:3px solid #ff5632;}
#index-news .news .tab li.active:hover{color:#555;}

#index-news .news .content > li{display:none; background:#FFF; padding:20px 20px 10px 20px; overflow:hidden;}
#index-news .news .content dl{padding:0 20px; border:1px solid #ddd; border-top:none;}
#index-news .news .content dt{position:relative; padding:15px 30px 5px 0; cursor:pointer;}
#index-news .news .content .con-01 dt:after{content:""; position:absolute; right:0; top:20px; display:block; width:18px; height:18px; background:url(../images/index_news_icon1.png) left top no-repeat;}
#index-news .news .content .con-02 dt:after{content:""; position:absolute; right:0; top:25px; display:block; width:7px; height:13px; background:url(../images/index_news_icon2.png) left top no-repeat;}

#index-news .news .content dt .h1{font-size:14px; color:#555; line-height:25px; font-weight:normal; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; transition:all .3s;}
#index-news .news .content dt span{display:block; font-size:12px; color:#999;}

#index-news .news .content dl:hover dt .h1{color:#ff5632}
#index-news .news .content .con-01 dl:hover dt:after{background-position:left center;}
#index-news .news .content .con-02 dl:hover dt:after{background-position:left bottom;}

#index-news .news .more{}
#index-news .news .more a{display:inline-block; font-size:13px; color:#ff5632; font-weight:bold;}
#index-news .news .more a:after{content:""; display:inline-block; width:4px; height:10px; background:url(../images/more_arrow.png) left top; margin-left:5px;}
#index-news .news .more a:hover{color:#5b5b5b;}
#index-news .news .more a:hover:after{background-position:left bottom;}

#index-news .news .more-btn{ float:right; margin:10px 0 0 0;}
#index-news .news .more-btn a{display:inline-block; font-size:13px; color:#ff5632; font-weight:bold;}
#index-news .news .more-btn a:after{content:""; display:inline-block; width:4px; height:10px; background:url(../images/more_arrow.png) left top; margin-left:5px;}
#index-news .news .more-btn a:hover{color:#5b5b5b;}
#index-news .news .more-btn a:hover:after{background-position:left bottom;}

#index-news .news .content dl.active dt .h1{color:#ff5632;}
#index-news .news .content dl.active dt:after{background-position:left bottom;}

#index-news .news .content dl.active:hover dt .h1{color:#ff5632;}
#index-news .news .content dl.active:hover dt:after{background-position:left bottom;}

#index-news .news .content dd{display:none; padding:20px 0;}
#index-news .news .content dd .wrap{overflow:hidden;}
#index-news .news .content dd .wrap .img{float:left; width:45%; padding-right:20px; box-sizing:border-box;}
#index-news .news .content dd .wrap .img img{display:block; width:100%; height:auto;}
#index-news .news .content dd .wrap .intxt{float:left; width:55%; font-size:14px; color:#999; line-height:22px;}

#index-news .news .content dd .share a{position:relative; display:inline-block; margin-right:5px; text-indent:-9999px;}
#index-news .news .content dd .share .fb{width:8px; height:15px; background:url(../images/share_1.png);}
#index-news .news .content dd .share .twitter{top:2px; width:13px; height:11px; background:url(../images/share_2.png);}
#index-news .news .content dd .share .google{top:1px; width:13px; height:13px; background:url(../images/share_3.png);}
#index-news .news .content dd .share .linkedin{top:2px; width:12px; height:11px; background:url(../images/share_4.png);}
#index-news .news .content dd .more{text-align:right;}
#index-news .news .content dd .more a{display:inline-block; font-size:13px; color:#ff5632; font-weight:bold;}
#index-news .news .content dd .more a:after{content:""; display:inline-block; width:4px; height:10px; background:url(../images/more_arrow.png) left top; margin-left:5px;}
#index-news .news .content dd .more a:hover{color:#5b5b5b;}
#index-news .news .content dd .more a:hover:after{background-position:left bottom;}

/* my-group */
#my-group{ clear:both; padding:0 0 35px 0; overflow:hidden; width:96%; margin:0 auto;max-width:1140px; }
#my-group ul.group1{width:100%; margin:0 auto; overflow:hidden;}
#my-group ul.group2{width:100%; margin:20px 0 0 0; overflow:hidden;}
#my-group .group1 li{float:left; width:31.3%; margin:0 1%; box-sizing:border-box;padding:2px 0}
#my-group .group2 li{float:left; width:25%; padding:0 1% 1% 1%; box-sizing:border-box;padding-top:2px;}
#my-group li a{position:relative; display:block; background:#000; overflow:hidden;}
#my-group li a:after{ padding-top: 62.5%; content:""; display: block;}
#my-group li a img{display:block; width:100%; position:absolute; top:0; bottom:0; right:0; left:0; max-width:100%; margin:auto; transition:all .3s;}
#my-group li a span{position:absolute; left:0; bottom:0; display:block; width:100%; font-size:18px; color:#FFF; line-height:30px; text-align:center;}
#my-group li a span.g1{ background:#e68b1f;}
#my-group li a span.g2{ background:#2e5390;}
#my-group li a span.g3{ background:#684597;}
#my-group li a span.g4{ background:#c4205d;}
#my-group li a span.g5{ background:#d74028;}
#my-group li a span.g6{ background:#22a4bb;}
#my-group li a span.g7{ background:#6a60cf;}
#my-group li a span.g8{ background:#2C1001;}

#my-group li a:hover img{transform:scale(1.1,1.1); -webkit-filter:blur(1px); opacity:.4;}

/* footer */
#footer{background:#FFF; padding:30px 0;}
#footer .wrap{width:96%; max-width:1120px; margin:0 auto 20px auto; overflow:hidden;}
#footer  h2{font-size:20px; padding-bottom:20px;}
#footer  h2:after{content:""; display:block; width:80px; height:4px; background:#ff5632; margin-top:15px;}

#footer .wrap .left{float:left; width:25%; padding-right:30px; box-sizing:border-box;}
#footer .wrap .left{padding-bottom:30px;}
#footer .wrap .left p{font-size:14px; color:#333; line-height:25px; padding-top:10px;}

#footer .wrap .right{float:left; /*width:70%;*/ width:45%; overflow:hidden;}
#footer .wrap .right li{float:left; width:45%; margin-right:5%; padding:10px 0; border-bottom:1px solid #eee;padding: 10px 2px;box-sizing: border-box;}
#footer .wrap .right li a{display:inline-block; font-size:14px; color:#333;}
#footer .wrap .right li a:before{content:""; display:inline-block; width:4px; height:8px; background:url(../images/links_arrow.png); margin-right:5px;}
#footer .wrap .right li a:hover{color:#ff5632;}
#footer .wrap .right li a:hover:before{background-position:left bottom;}

#footer .wrap .last{ width:30%; }
#footer .wrap .last p{font-size:14px; color:#333; line-height:25px;}

#footer .info{width:96%; max-width:1120px; margin:0 auto;}
#footer .info a{display:inline-block; border-radius:5px; font-size:14px; color:#FFF; transition:all .3s;}
#footer .info a:hover{opacity:.8;}
#footer .info .link-1{background:#ff5632; margin-right:10px; padding:10px 30px;}
#footer .info .link-2{background:#333; padding:10px 30px 10px 30px;}
#footer .contact{width:96%; max-width:1120px; margin:0 auto; border-top:1px solid #000; margin-top:20px; padding-top:20px;}
#footer .contact ul{overflow:hidden;}
#footer .contact li{ float:left; width:33%; padding-right:30px; height:150px; font-size:14px; line-height:20px; box-sizing:border-box;padding-left:2px;}
#footer .contact li .h3{margin-bottom:10px; font-size:15px; color:#000;}
#footer .contact li > a{color:#ff5632;}
#footer .contact li p{color:#999;}
#footer .contact li b a{ display:inline-block; height:20px; color:#f44336; font-weight:normal; font-size:12px; background:url(../images/map.png) no-repeat left; padding-left:25px; margin:5px 0 0 0;}
#footer .contact li span{ margin:5px 0 0 10px;}
#footer .contact li span a{ height:20px; display:inline-block; color:#f44336; background:url(../images/contact-icon.png) no-repeat left center;padding-left:25px;}

/* copyright */
#copyright{width:96%; max-width:1120px; margin:0 auto; padding:20px 0; font-size:13px; color:#333; overflow:hidden;}
#copyright .left{position:relative; float:left; padding-left:100px;}
#copyright .left .accessibility{position:absolute; left:0; top:4px; display:block; width:88px; height:31px; background:url(../images/footer_icon.jpg);}
#copyright .left span{display:block; padding-bottom:3px;}
#copyright .right{float:right; line-height:40px;}
#copyright .bottom{ clear:both; margin-left:100px;}
#copyright .bottom a{ display:inline-block; color:#333; transition:all .3s;}
#copyright .bottom a:hover{ color:#ff5632;}
/* gotop */
#gotop{position:fixed; right:20px; bottom:20px; display:block; width:40px; height:40px; border-radius:5px; background:url(../images/gotop.png) center center no-repeat rgba(0,0,0,.8); text-indent:-9999px; cursor:pointer; z-index:100; display:none;}

/*subcribe*/
#subscribe{position: absolute; top: 10%; left: 50%; width: 500px; margin-left: -250px; background: #fff; padding: 20px; z-index: 102; min-height: 200px; box-sizing: border-box; overflow: hidden; display:none;}
#subscribe .h1{ font-size:24px; margin-bottom:20px; padding:0 0 20px 0; border-bottom:1px solid #eee; text-align:center;}
#subscribe .h1 a{ position:absolute; right:10px; top:20px; cursor:pointer; background:url(../images/close.png) no-repeat; text-indent:-99999px; width:20px; height:20px;}
#epaper-search{position:relative; width:100%; overflow:hidden;}
#epaper-search option{ line-height:20px;}
#epaper-search dl{ margin:0 0 20px 0;}
#epaper-search dl dt{ margin:10px 0;}
#epaper-search dd input{display:inline-block; width:100%; border:1px solid #cbc9c5; height:45px; padding:10px; border-radius:5px; box-shadow:0 0 3px #e8e6de; box-sizing:border-box;}
#epaper-search div b{ display:block; margin:10px 0; font-weight:normal;}
#epaper-search div li{ float:left; margin:0 10px 5px 0;}
#epaper-search .button{ width:240px; float:right; overflow:hidden; margin:20px 0 0 0;}
#epaper-search a{ float:left; margin:10px; display:inline-block; width:100px; border:none; background:#ff5632; border-radius:5px; font-size:14px; color:#FFF; line-height:42px; text-align:center; font-weight:bold; cursor:pointer; transition:all .3s;}
#epaper-search a.cancel{ background:#aaa; }
#epaper-search a:hover{ opacity:.8;}
#cover{ position:fixed; top:0; left:0; width:100%; height:100%; z-index:101; background:url(../images/cover.png) repeat; display:none;}

/* RWD */
@media screen and (max-width:1170px){
/* index-list */
#index-list .links li a:hover span{ bottom:35%; } 
}
@media screen and (max-width:1140px){
/* header */
#navigation{ padding:0 0 0 0;}
#navigation li{padding:0 8px;}
/* index-list */
#index-list .links li a span b{ font-size:16px;}
}
@media screen and (max-width:1120px){
/* header */
#navigation li{padding:0 5px;}

}
@media screen and (max-width:1080px){
/* header */
#navigation li{padding:0 4px;}  
/*copyright*/
#copyright .left{float:none;}
#copyright .right{float:none; line-height:normal; padding:0 0 0 100px;}
}
@media screen and (max-width:1050px){
/* header */
#logo{ margin:0 0 0 5px;}
#navigation{padding-left:0;}
#navigation li{padding:0 1px;}
/* copyright */
#copyright{text-align:center;}
#copyright .left{padding-left:0; padding-bottom:5px;}
#copyright .left .accessibility{position:static; margin:0 auto 10px auto;}
#copyright .right{float:none; line-height:normal; text-align:center; padding:0;}
#copyright .bottom{ clear:both; margin-left:0; text-align:center;}
/* index-list */
#index-list{ padding:0;}
#index-list .links li {width:48%; margin:0 1% 1% 1%; }

}

@media screen and (max-width:997px){
/* header */
#navigation,#header .top{display:none;}
/* mobile */
#mobi-btn{display:block;}

    #navigation .facebook-pc { display: none; }
    .facebook-mobile { display: block; }
}
@media screen and (max-width:970px){
/*header*/
#logo{ margin:0 0 0 1%; }
}
@media screen and (max-width:860px){
/* index-slide */
#index-slide{margin-top:85px;}
#index-slide .owl-pagination{position:static; padding:10px 0;}
/* index-content */
#index-content{ padding:0;}
/* index-list */
#index-list{ padding:0;}
/* index-news */
#index-news{padding:0 0 20px 0;}
#index-news .media{float:none; width:100%; padding:0;}
#index-news iframe{height:500px;}
#index-news .news{float:none; width:100%; margin-top:30px;}
/* footer */
#footer{padding:30px 0;}
#footer .wrap .left{float:none; width:100%;}
#footer .wrap .right{float:none; width:100%; padding-bottom:30px;}

}

@media screen and (max-width:620px){
/* index-news */
#index-news iframe{height:400px;}

/* footer */
#footer .contact li{width:50%;}
/* index-list */
#index-list .links li a:hover span{ bottom:50%;}
#index-list .links li a:hover span b{ display:none; }

}

@media screen and (max-width:550px){
/* my-group */
#my-group li{float:none; width:100%;}
/* index-news */
#index-news iframe{height:300px;}
#index-news .news .content dd .wrap .img{float:none; width:100%;}
#index-news .news .content dd .wrap .intxt{float:none; width:100%; padding:20px 0;}
/* footer */
#footer .wrap .right li{float:none; width:100%;}
/* subscribe */
#subscribe{ width:300px; margin-left:-150px;}
#epaper-search .button{ width:240px; float:none; margin:20px auto 0 auto;}
}

@media screen and (max-width:450px){
/* my-group */
#my-group{ padding:15px 0; width:96%; margin:0 auto;}
#my-group ul.group1 li{ width:100%; float:none; margin:0 auto 10px auto; border-radius:5px;}
#my-group ul.group2{ margin:0;}
#my-group ul.group2 li{ width:100%; float:none; margin:0 auto 10px auto; border-radius:5px; padding:0; }
#my-group li {margin:0 0 10px 0;}
#my-group li a { height:35px; border-radius:5px; background:none;}
#my-group li a img{ display:none;}
#my-group li a span{ line-height:35px; border-radius:5px; }
/* index-news */
#index-news iframe{height:250px;}
/* index-list */
#index-list .links li {width:98%; margin:0 1% 10px 1%;}
/* footer */
#footer .contact li{float:none; width:100%; height:auto; padding-bottom:40px;}


}
