@charset "utf-8";
/* CSS Document */
* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
      outline: none; /* for Firefox Google Chrome  */
      behavior:expression(this.onFocus=this.blur()); /* for IE */
}
input,button,select,textarea{outline:none}
*:focus { outline: none; }

body{
	font-family: "微軟正黑體", Arial, "Arial Black", "新細明體";
	font-size: 1em;
	line-height: 1.5em;
}
a{
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear;
	-o-transition: all 0.2s linear;
	transition: all 0.2s linear;
}
.f_img{
	width:100%;
	height:auto;
}

/*header*/
header{
	background-color: #5c5c5c;
}
header .navbar-default{
	background-color:transparent;
	border:0;
}
header .navbar-default .navbar-nav>li>a{
	color:#FFF;
}
header .navbar-default .navbar-nav>li>a:hover{
	color:ffd800;
}
header .navbar-default .navbar-nav>.active>a, header .navbar-default .navbar-nav>.active>a:focus, header .navbar-default .navbar-nav>.active>a:hover{
	color:ffd800;
	background-color:transparent;
}

.logo01{
	width:140px;
	height:32px;
	margin:40px 10px 20px 0;
	display:inline-block;
	-webkit-transition: all 0s 0s;
	-moz-transition: all 0s 0s;
	-ms-transition: all 0s 0s;
	-o-transition: all 0s 0s;
	transition: all 0s 0s;
}
.logo02{
	width:130px;
	margin:40px 0 20px 0;
	display:inline-block;
	-webkit-transition: all 0s 0s;
	-moz-transition: all 0s 0s;
	-ms-transition: all 0s 0s;
	-o-transition: all 0s 0s;
	transition: all 0s 0s;
}
.logo02 img{
	max-width:none;
	width:100%;
}
header .container{
	position:relative;
}
#navbar.menu{
	max-width:450px;
}

.toptour{
	font-size:0.8em;
	margin:10px 0 5px 0;
	position:absolute;
	top:0px;
	right:10px;
}
.toptour li a{
	padding:5px 10px;
}
.toptour li.language a{
	font-weight:bold;
	color:ffd800 !important;
}
.toptour li.language a:hover{
	color:#FF0 !important;
}
.toptour li+li:before,.toptour li.language+li+li:before{
	display:inline;
	content:"· ";
	color:#FFF;
	float:left;
	margin-top:5px;
}
.toptour li.language+li a{
	padding:5px 10px 5px 15px;
}
.toptour li.language+li+li a{
	padding:5px 10px;
}
.toptour li.language+li:before{
	content:"/ ";
}

.topmenu{
	position:absolute;
	top:45px;
	right:10px;
}

.topmenu li a{
	padding:10px 20px;
	font-size:1.4em;
}
.topmenu li+li:before{
	display:inline;
	content:"/";
	color:#FFF;
	float:left;
	margin-top:9px;
}
.search_bar{
	padding:5px 0;
	margin:2px 10px 0 15px;
}
.search_bar .s_text{
	padding:0px 5px;
	border: 1px solid #d8d8d8;
	height:23px;
}
.search_bar .s_btn{
	background-color: #FFF;
	margin-left: -5px;
	padding: 2px;
	border: 1px solid #d8d8d8;
}

/*登入後修正*/
#navbar.menu.log{
	max-width:640px;
}
#navbar.menu.log .toptour li.name{
	color:#FFF;
	padding:5px 10px 5px 0;
}
#navbar.menu.log .toptour li.name:before{
	margin:0 10px 0 0px;
}
#navbar.menu.log .toptour li.logout a{
	color:#680000;
}
/*英文版*/
body.en #navbar.menu{
	max-width:520px;
}
body.en #navbar.menu.log{
	max-width:790px;
}




/*左方修正*/
.left_select{
	margin: 0px 0 15px 0;
	color: #FFF;
	background-color: #a46b24;
	padding:5px;
	overflow:hidden;
}
.left_select select{
	margin-left:5px;
	display:inline-block;
	width:70%;
	color:#000;
	float:right;
}





/*container*/
.head_vedio{
	padding:10px;
background: #6e4d6c; /* Old browsers */
background: -moz-linear-gradient(top, #6e4d6c 0%, #ffffff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #6e4d6c 0%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #6e4d6c 0%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6e4d6c', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */

-moz-box-shadow:0px 0px 12px 2px rgba(70%,70%,70%,1);
-webkit-box-shadow:0px 0px 12px 2px rgba(70%,70%,70%,1);
box-shadow:0px 0px 12px 2px rgba(70%,70%,70%,1);
margin-bottom:25px;
}
.ad a{
	display: block;
	margin-bottom: 15px;
	border: 1px solid #CCC;
}
.ad a img{
	width:100%;
	height:auto;
}

h1.imedia{
	color:#e36b00;
	font-size:2.8em;
	font-weight:bolder;
	margin-top:0px;
	margin-bottom:15px;
	overflow:hidden;
}

h1.imedia img.title{
	width:95px;
	display:inline-block;
	vertical-align:middle;
	margin-top:-10px;
	margin-right:10px;
}
h1.imedia .search_part{
	overflow:hidden;
	width:300px;
	margin-top:-5px;
	text-align:right;
}
h1.imedia .search_part .search_bar,h1.imedia select{
	padding:0;
	margin:0;
	font-size:0.5em;
	font-weight:normal;
	display:inline-block;
	float:none !important;
}

h1.imedia .search_part .search_bar .s_text{
	padding:3px 5px;
	border: 1px solid #cacaca;
	color:#898989;
	display:inline-block;
	margin-top:-2px;
	height:23px;
}
h1.imedia .search_part .search_bar .s_btn{
	background-color: #7e7e7e;
	padding: 4px 1px 2px 4px;
	display:inline-block;
	border: 0px solid #cacaca;
	height:23px;
}
h1.imedia .search_part .search_bar .s_btn img{
	max-width:100%;
}

h1.imedia .search_part select{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;	
	color: #898989;
	margin-right: 10px;
	border: 1px solid #cacaca;
	margin-top: 1px;
	background-image: url(../images/arrow_down.png);
	background-repeat: no-repeat;
	background-position: right+4px center;
	padding:3px 5px;
}
h1.imedia .search_part select::-ms-expand { /* for IE 11 */
    display: none;
}
.n_music,.music_list{
	margin:0px 0 20px 0;
	display:block;
	overflow:hidden;
	clear:both;
}
.n_music .pic{
	width:100%;
	overflow:hidden;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear;
	-o-transition: all 0.2s linear;
	transition: all 0.2s linear;
	margin-bottom:5px;
	position:relative;
}

.n_music .pic .timer{
	position:absolute;
	right:0px;
	bottom:0px;
	text-align:right;
	padding:2px 5px;
	color:#FFF;
	background-color:rgba(0,0,0,0.7);
}

.n_music .intro{
	color:#b2b2b2;
}

/*.n_music .intro h2{
	color:#e36b00;
	margin:0 0 5px 0;
	font-size:2em;
	font-weight:bold;
	height:20px;
	overflow:hidden;
}*/
.n_music .intro h2{
	color: #000;
	margin: 0 0 5px 0;
	font-size: 1.6em;
	font-weight: bold;
	overflow: hidden;
	background-color: #DDD;
	padding:5px;
	text-align:center;
	overflow:hidden;
}
.n_music .intro{
	position:relative;
	padding-bottom:23px;
	margin-bottom:20px;
}
.n_music .intro ul{
	display:none;
}
.n_music .intro ul li{
	font-size: 0.8em;
}

.n_music .intro .visitor{
	position:absolute;
	bottom:0px;
	left:0;
	font-size:1em;
	font-weight:bold;
	color:#e36b00;
}

.n_music .intro .visitor span{
	display:inline-block;
	vertical-align:middle;
	background-color:#adcc37;
	padding:0px 5px;
	border-radius:5px;
	color:#FFF;
	margin-right:10px;
	font-weight:normal;
	font-size:0.8em;
	margin-top:-2px;
}
.n_music:hover>.pic,.music_list:hover>.pic{
	opacity:0.8;
}
.n_music:hover>.intro>ul li,.music_list:hover>.intro>ul li{
	text-decoration: underline;
}
.music_list:hover{
	text-decoration: none;
}

.f_pic{
	overflow:hidden;
	margin-bottom:10px;
}

.n_music2{
	display:block;
	overflow:hidden;
	width:50%;
	padding: 1% 0 1% 2%;
	float:left;
}
.n_music2+.n_music2{
}
.n_music2:hover{
	opacity:0.8;
}
.list{
	margin:30px 0;
}

.music_list {
	margin-bottom:0;
}
.music_list .pic{
	width:100%;
	overflow:hidden;
	margin-bottom:10px;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear;
	-o-transition: all 0.2s linear;
	transition: all 0.2s linear;
	height:119px;
	position:relative;
}
.index_use .music_list .pic{
	height:147px;
}


.music_list .pic .timer{
	position:absolute;
	right:0px;
	bottom:0px;
	text-align:right;
	padding:2px 5px;
	color:#FFF;
	background-color:rgba(0,0,0,0.7);
}
.music_list .intro{
	width:100%;
	color:#b2b2b2;
	/*height:105px;*/
	height:auto;
}
.music_list .intro h2{
	color: #000;
	margin: 0 0 5px 0;
	font-size: 1.6em;
	font-weight: bold;
	overflow: hidden;
	background-color: #DDD;
	padding:5px;
	text-align:center;
	height:42px;
	overflow:hidden;
}

.music_list .intro ul{
	height:55px;
	overflow:hidden;
	display:none;
}

.music_list .intro ul li{
	font-size: 0.8em;
	color:#b2b2b2;
	word-break: break-all;
}

.list_visitor{
	font-size:1em;
	font-weight:bold;
	color:#e36b00;
	margin-bottom:10px;
}

.list_visitor span{
	display:inline-block;
	vertical-align:middle;
	background-color:#adcc37;
	padding:0px 5px;
	border-radius:5px;
	color:#FFF;
	margin-right:10px;
	font-weight:normal;
	font-size:0.8em;
	margin-top:-2px;
}
.list_visitor a.likes{
	display:inline-block;
	vertical-align:middle;
	margin-top:-3px;
	margin-left:10px;
}
/*頁數按鈕*/

.pagination>li>a{
	color:#5c5c5c;
}
.pagination>li>a:hover, .pagination>li>span:hover, .pagination>li>a:focus, .pagination>li>span:focus{
	background-color:#a46b24;
    color: #FFF;
}
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover{
	background-color:#a46b24;
    border-color: #a46b24;
    color: #FFF;

}
.pagination>li.active>a,.pagination>li.active>a:hover{
	color: #FFF;
	background-color: #a46b24;
	border: 1px solid #a46b24;
}
.pagination>li>a, .pagination>li>span{
	
}
.pagination>li.disabled>a,.pagination>li.disabled>a:hover{
	color: #CCC;
	background-color: #F6F6F6;
}

/*會員登入*/

.log-btn{
	padding:0;
}

.log-btn button.btn-login{
	height:85px;
	line-height:75px;
	color: #FFF;
    background-color: #adcc37;
    border-color: #ccc;
	width:100%;
}
.log-btn button.btn-login:hover{
    color: #FFF;
    background-color: #e36b00;
    border: 1px solid #e36b00;
}

/*網站地圖*/
/*ul.webmap{
	overflow:auto;
	padding:0;
	margin:10px 0;
}
ul.webmap li{
	width:25%;
	padding:1% 0;
	margin-bottom:5px;
	display:block;
	float:left;
}
ul.webmap li a{
	display: block;
	font-size: 1.6em;
	padding:5px;
	font-weight:bold;
	background-color: #adcc37;
	color: #FFF;
}
ul.webmap li a.sub{
	margin-top: 5px;
	padding-left: 15px;
	font-weight: normal;
}
*/
 a.webmap{
	display: block;
	font-size: 1.6em;
	padding: 10px;
	font-weight: bold;
	color: #adcc37;
	margin-bottom: 5px;
	border: 1px solid #adcc37;
}
 a.webmap:hover{
	background-color: #adcc37;
	color: #FFF;
	text-decoration: none;
}

.webgroup{
	border: 1px solid #adcc37;
	margin-bottom:15px;
}

.webgroup a.webmap{
	border: 0px solid #adcc37;
	margin-bottom:0;
}

a.webmap.sub{
	padding-left: 20px;
	font-weight: normal;
	margin-top:0px;
	
}
/*錯誤驗面*/
.e_msg{
	margin: 10px 10px 50px 10px;
	text-align: center;
	font-size: 2.8em;
	font-weight: bold;
	letter-spacing: 0.2em;
	line-height:1.4em;
}
.e_msg img{
	margin:10px auto 20px auto;
}
.e_msg .red{
	color:#f71236;
}
.e_msg .blue{
	color:#29abe2;
}
.e_msg .orange{
	color:#fbb03b;
}

.about{
	font-size:1.5em;
	line-height:1.5em;
}
.about p{
	margin-bottom:15px;
	margin-top:15px;
}


/*footer*/
footer{
	background-color:#5c5c5c;
	color:#d8d8d8;
	padding:20px 0 10px 0;
	width:100%;
}
footer a{
	color:#FFF;
}
footer ul li{
	text-align:center;
}

/*201706更新新聞訊息*/
.BreakingNewsController{
	width: 100%;
	overflow: hidden;
	background: #FFF;
	height: auto;
	position: relative;
	margin-bottom: 30px;
}
.BreakingNewsController .bn-title{display:inline-block; float:left; padding:10px 20px; background:#5aa628; color:#FFF;}
.BreakingNewsController ul{padding:0; margin:0; display:block; list-style:none; position:absolute; left:180px; right:50px;}
.BreakingNewsController ul li{list-style:none; padding:10px 20px; display:none;}
.BreakingNewsController ul li a{text-decoration:none; color:#333; display:inline-block; overflow:hidden; padding:0;}
.BreakingNewsController .bn-arrows{display:inline-block; float:right; width:50px; position:absolute; right:0; top:0; bottom:0;}
.BreakingNewsController .bn-arrows span{display:block; width:20px; position:absolute; top:0; bottom:0; cursor:pointer; opacity:0.2;}
.BreakingNewsController .bn-arrows span:hover{opacity:1;}
.BreakingNewsController .bn-arrows-left{ left:0; background:url(../images/bn-arrows.png) left center no-repeat;}
.BreakingNewsController .bn-arrows-right{right:10px; background:url(../images/bn-arrows.png) right center no-repeat;}

.easing a, .easing span{transition:.25s linear; -moz-transition:.25s linear; -webkit-transition:.25s linear;}





@media (max-width: 1199px) {
header{
	min-height:90px;
}
body.en .logo01{
	max-width:100px;
	height:auto;
	margin:15px 10px 20px 0;
}
body.en .logo02{
	max-width:100px;
	margin:15px 0 20px 0;
}
body.en #navbar.menu.log{
	margin-top:-66px;
}
.music_list .pic{
	height:96px;
}
.index_use .music_list .pic{
	height:118px;
}

}

@media (max-width: 1000px) {
body.en #navbar.menu.log .topmenu li a{
	padding:10px ;
}
}

@media (max-width: 980px) {
header{
	min-height:90px;
}	
	

.logo01{
	max-width:100px;
	height:auto;
	margin:15px 10px 20px 0;
}
.logo02{
	max-width:100px;
	margin:15px 0 20px 0;
}
.music_list .pic{
	height:141px;
}
.index_use .music_list .pic{
	height:193px;
}

/*登入後修正*/
#navbar.menu.log{
	margin-top:-66px;
}
body.en #navbar.menu{
	margin-top:-66px;
}

}

@media (max-width: 768px) {
header{
	min-height:auto;
}	

.logo01,body.en .logo01{
	max-width:140px;
	height:auto;
	width:30%;
	margin:10px 10px;
	display:inline-block;
}
.logo02,body.en .logo02{
	max-width:140px;
	width:30%;
	margin:10px;
	display:inline-block;
}
#navbar.menu{
	max-width:none;
}
.navbar-collapse{
	padding:0;
}
.navbar-default .navbar-toggle{
    border-color: #FFF;
	margin:8px 8px 8px 0;
}	
.navbar-default .navbar-toggle:hover,.navbar-default .navbar-toggle:focus{
    border-color: #ffd800;
	background-color:transparent;
}	
.navbar-default .navbar-toggle .icon-bar{
    background-color: #FFF;
}
.navbar-default .navbar-toggle:hover .icon-bar, .navbar-default .navbar-toggle:focus .icon-bar{
	background-color: #ffd800;
}
.navbar-toggle .icon-bar{
    height: 3px;
}
.navbar-toggle .icon-bar+.icon-bar {
    margin-top: 5px;
}
.toptour{
	margin:0;
	font-size:1em;
	position:static;
}
.toptour li+li:before,.toptour li.language+li+li:before{
	display:none;
}
.toptour li.language+li a{
	padding:5px 10px;
}
.topmenu li+li:before,.toptour li.language+li+li:before{
	display:none;
}
.toptour li:hover{
	background-color: #ffd800;
}
.toptour li:hover>a{
	color:#a46b24 !important;
}
.toptour li.language:hover>a{
	color:#a46b24 !important;
}

.topmenu{
	margin:0;
	font-size:1.2em;
	position:static;
}

.topmenu li a{
	padding:5px 10px;
}
.topmenu li:hover{
	background-color: #ffd800;
}
.topmenu li:hover>a{
	color:#a46b24 !important;
}
.search_bar{
	margin:	2px 0px 0 0px;
	padding:10px;
}
.search_bar .form-group{
	display:inline-block;
	width:90%;
	margin-bottom:0;
}
.search_bar .s_text{
	width:100%;
	
}
.search_bar .s_btn{
    margin-left: -4px;
	display:inline-block;
    margin-top: -3px;
    vertical-align: middle;
}
.music_list .pic{
	height:auto;
}
.index_use .music_list .pic{
	height:auto;
}

/*登入後修正*/
#navbar.menu.log{
	margin-top:0px;
}
#navbar.menu.log .toptour li.name{
	margin-left:10px;
}
#navbar.menu.log .toptour{
    border-bottom: 1px solid #e7e7e7;
}
#navbar.menu.log .toptour li.name:hover{
	background-color:transparent;
}

/*container*/

h1.imedia .search_part .search_bar .form-group{
	width:auto;
	padding-top:1px;
}

h1.imedia .search_part .search_bar .s_text{
	width:auto;
}
.n_music .intro{
	margin-bottom:0;
}
.n_music2{

}
.n_music2+.n_music2{
}
.music_list .intro{
	height:auto;
}

.music_list .intro h2{
	height:auto;
}

.music_list .intro ul{
	height:auto;
}


/*會員登入*/
a.forget{
	margin-right:15px;
}

.log-btn{
	padding:0 15px;
}

.log-btn button.btn-login{
	height:auto;
	line-height:1.8em;

}



}

@media (max-width: 640px) {
}
@media (max-width: 500px) {
	
.n_music{
	margin-bottom:10px;
}
.n_music .pic{
	width:100%;
	overflow:hidden;
	margin-right:0%;
	margin-bottom:10px;
}
.n_music .intro{
	width:100%;
	padding-bottom:15px;
}




	
	
}

@media (max-width: 360px) {
.left_select select{
	width:65%;
}

h1.imedia{
	margin-bottom:0px;
}

h1.imedia .search_part{
	width:100%;
	overflow:hidden;
	margin:5px 0;
	text-align:center;
}
h1.imedia .search_part select{
	width:99%;
	margin:2px 0 8px 0;
}
h1.imedia .search_part .search_bar {
	margin-bottom:10px;
	width:100%;
}
h1.imedia .search_part .search_bar .form-group{
	width:90%;
	padding-top:1px;
}

h1.imedia .search_part .search_bar .s_text{
	width:100%;
}
h1.imedia .search_part .search_bar .s_btn{
    margin-left: -5px;
}

}