@charset "utf-8";
/* CSS Document */
/*
dark color #428bca;
mid color #cfdfff;
/*通用*/
.vidimagebox img{width:10vw;  -webkit-transition: all 0.5s;   transition: all 0.5s;}
.bkhead{
  min-height:30px;
  background:#428bca;
  padding:20px;
  font-size:20px;
  line-height:30px;
  font-weight:bold;
  color:#fff;
}
.pagewrap a {
    display: inline-block;
    font-size: 15px;
    line-height: 23px;
    width: 25px;
    height: 25px;
    border: 1px solid #999;
    color: #fff!important;
    background: #555;
    margin: 0 5px;
}
.bkhead h1,.bkhead h2{
  font-size:20px;
  line-height:30px;
  font-weight:bold;
  color:#fff;
}
.bkheadin{
  max-width:1100px;
}
.onoffwarp{
  width:160px;
  max-width:25%;
  height:30px;
  background:#eee;
  border:1px solid #ccc;
  border-radius: 10px;
  overflow:hidden;
  float:right;
  margin-right:10px;
}
.onoffwarp .switch{
  width:50%;
  font-size:15px;
  line-height:30px;
  color:#ccc;
  text-align:center;
  float:left;
}
.onoffwarp .switch:first-child{
  border-right:1px solid #ccc;
}
.onoffwarp .switch:nth-child(2){
  margin-right:-5px;
}

.onoffwarp .on{
  color:#444!important;
  background:#cfdfff!important;
  -moz-box-shadow: 0px 1px 5px #999;
  -webkit-box-shadow: 0px 1px 5px #999;
  box-shadow: 0px 1px 5px #999;
}
.btn{cursor:pointer;}
/*  TAB */
.tagwrap{margin:10px;}
.taghead{position:relative;height:45px;z-index:1;}
.tagitem{position:relative;width:16%;height:36px;background:#ccc;margin-top:8px;z-index:1;font-size:18px;float:left;line-height:36px;color:#888;margin-left:-2px;border-top:1px solid #ddd;border-left:1px solid #ddd;border-right:1px solid #ddd;-webkit-border-top-left-radius: 5px;-webkit-border-top-right-radius: 5px;-moz-border-radius-topleft: 5px;-moz-border-radius-topright: 5px;border-top-left-radius: 5px;border-top-right-radius: 5px;}
.tagitem:first-child{margin-left:0;}
.tagitem:hover{background:#eeeef3;}
.tagitem.on{margin-top:0px;padding:6px 0 4px 0;color:#2266cc;background:#fff!important;color:#555;z-index:3;margin-bottom:-2px;}
.tagitem.on div{color:#2266cc;font-weight:bold;}
.tagin{padding:0 10px;}
.tagbody{position:relative;border:1px solid #ddd;z-index:0;}
.tagbodyin{padding:10px;}




table{max-width:100%!important;}
th,td,span{word-wrap: break-all;}
/**/
/* INPUTS */
input[type=text] {
    font-size: 15px;
    line-height: 26px;
    border: 1px solid #cccccc;
    height: 26px;
    background: #fff;
    margin:0 auto;
	width:70%;
	padding:0 4px;
    max-width:500px;
    min-width:40px;
    border-radius: 4px;
}
select {
    font-size: 15px;
    line-height: 26px;
    border: 1px solid #cccccc;
    height: 26px;
    background: #fff;
    margin:0 auto;
    max-width:300px;
    min-width:100px;
    border-radius: 4px;
}
textarea{
  border:1px solid #ccc;
  padding:5px;
  margin:0 auto;
  border-radius: 4px;
  height:60px;
  width: 70%;
  min-width:100px;
}
table.forms {
    min-width: 700px;
    max-width: 960px;
    border: 1px solid #fff;
    margin-bottom: 50px;
}
    table.forms td, table.forms th {
        text-align: center;
        position: relative;
        border-right: 1px solid #fff;
        vertical-align: top;
    }

	.formtable,.formtable01,.formtable02 {
		margin-top: 20px;
		margin-bottom: 40px;
		border: 1px double #ddd;
		border-collapse:collapse;
	}
	.formtable tr,.formtable01 tr,.formtable02 tr{
		background: #fff;
	}
    .formtable th,.formtable01 th,.formtable02 th {
        height: 26px;
        background-color: #eeeeee;
        font-size: 15px;
        line-height: 26px;
        padding: 5px 0;
        color: #428bca;
		    border: 1px solid #ddd;
		    border-collapse:collapse;
    }
    .formtable th a,.formtable01 th a,.formtable02 th a,.formtable td a{
        color: #426699;
        font-weight:bold;
        text-decoration: underline;
    }
    .formtable td,.formtable01 td ,.formtable02 td {
		position:relative;
        height: 26px;
        border: 1px solid #ddd;
		border-collapse:collapse;
        font-size: 14px;
        line-height: 22px;
        color: #292929;
        padding: 3px 10px;
		text-align:center;
    }
    .formtable02 span{
        font-size: 8px;
    }
	.formtable tr:nth-child(2n),.formtable01 tr:nth-child(2n),.formtable02 tr:nth-child(2n){
		background: #fbfbfb;
	}
    .formtable th select ,.formtable th select01,.formtable02 th select{
            padding-left: 5px;
            border: 1px solid #cccccc;
            height: 26px;
            background: #fff;
			margin:0 auto;
			width: 90%;
			border-radius: 4px;
     }
    .formtable th input[type=text],.formtable01 th input[type=text],.formtable02 th input[type=text] {
        padding-left: 5px;
        border: 1px solid #cccccc;
        height: 26px;
        width: 90%;
        background: #fff;
		margin:0 auto;
		max-width:300px;
		border-radius: 4px;
    }
    .formtable td input[type=text],.formtable01 td input[type=text],.formtable02 td input[type=text] ,.formtable td input[type=password],.formtable01 td input[type=password],.formtable02 td input[type=password]{
        padding-left: 5px;
        border: 1px solid #cccccc;
        height: 26px;
        width: 90%;
        background: #fff;
		margin:0 auto;
		max-width:500px;
		border-radius: 4px;
    }
    .formtable td input[type=date],.formtable01 td input[type=date],.formtable02 td input[type=date] ,.formtable td input[type=number],.formtable01 td input[type=number],.formtable02 td input[type=number]{
		padding-left: 5px;
		border: 1px solid #cccccc;
		height: 26px;
		width: 20%;
		background: #fff;
		margin: 0 auto;
		max-width: 500px;
		border-radius: 4px;
    }	
    .formtable td select,.formtable01 td select,.formtable02 td select {
        padding-left: 5px;
        border: 1px solid #cccccc;
        height: 26px;
        min-width: 60px;
        background: #fff;
		margin:0 auto;
		max-width:300px;
		border-radius: 4px;
    }
	.formtable td textarea{
		border:1px solid #ccc;
		padding:5px;
		margin:0 auto;
		border-radius: 4px;
		height:60px;
		width: 90%;
	}
input[type=checkbox],input[type=radio]{
	border:1px solid #ccc;
	padding:5px;
	margin-left:10px;
	border-radius: 4px;
}
.lineclick {
    display: block;
    height: 24px;
    background-color: #fff;
    font-size: 15px;
    line-height: 24px;
    color: #885a36;
    width: 24px;
    text-align: center;
    border: 1px solid #2495bf;
    float: left;
    margin: 0 10px;
}

#lanselect {
    padding: 10px 0;
    text-align: right;
    font-size: 15px;
    color: #666;
    line-height: 26px;
    width: 950px;
}

    #lanselect select {
        height: 26px;
        width: 200px;
        padding: 0 5px;
        font-size: 15px;
        color: #666;
        line-height: 30px;
        margin-left: 10px;
    }

#lanreq {
    font-size: 50px;
    color: #999;
    padding: 150px;
    text-align: center;
}

a {
    text-decoration: none;
    color: #aaaaaa;
}

    a:hover {
        color: #aaaaaa;
        text-decoration: underline;
    }

p {
    line-height: 22px;
}


h2 {
    color: #3F4140;
    margin-left: 20px;
    margin-bottom: 20px;
}

.b-left {
  /*  border-left: 1px solid #fff;*/
}

.b-right {
  /*  border-right: 1px solid #fff;*/
}


.b-bottom {
  /*  border-bottom: 1px solid #fff;*/
}

.img-border {
    margin-left: 15px;
    width: 400px;
    height: 155px;
    border: 1px solid #333;
    text-align: left;
    background-color: #FFF;
}
#wrapper{
    margin:0;
    min-height:100%;
}

.wrapper {
    width: 100%;
    height: 100%;
    margin:0;
}

.content {
    background: #ffffff;
}
.contentin{
/*  max-width:1150px; */
}
/* ### LEFT MENU ####  */
.nav-box {
    min-height: 100%;
    width: 200px;
    overflow-y:auto;
    overflow-x:hidden;
    position: fixed;
    background: #226baa;
	  border-right:1px solid #aaa;
}
.nav-boxm {
   height: 80px;
    width: 100%;
    position: relative;
    background: #fafafa;
	  display:none;
    z-index:99;
}
.nav-boxmin{
   height: 80px;
    width: 100%;
    position: relative;
    background: #428bca;
    z-index:99;
}
/*左手全部 */
.nav-logo {
    position:static;
    margin: 0px;
    padding: 20px;
    text-align: center;
}
/* logo wrap */
.nav-login {
    position: relative;
    margin: 0px;
    padding: 0 0 12px 20px;
    width: 180px;
    background: #fafafa;
}
    /* 使用者列 */
    .nav-login table {
        margin: 0;
    }
        /* 使用者列 */
        .nav-login table td {
            padding: 3px 5px 3px 0;
            font-size: 13px;
            line-height: 18px;
        }
    /* 使用者列 */
    .nav-login p {
        color: #3F4140;
    }
/* 主分類目錄 */
	.menuheader {
		color: #2266cc;
		background: #e6e6ee;
	}
    .menuheader:hover {
        color: #FFF;
        background: #66aaca!important;
    }
    .menuheader.on{
      color: #FFF;
      background: #428bca!important;
  	}

.operate ul li.selected .menuheader,.J_navlist li.selected .menuheader {
    color: #FFF;
    background: url(../img/nav-sub-select.jpg) repeat-x!important;
}
.J_navlist li{
	border-bottom:1px solid #dddddd;
}
.J_navlist li:first-child{
	border-top:1px solid #dddddd;
}
.operate {
    height: auto;
    margin-bottom: 50px;
    width: 200px;
    background: #fafafa;
}
/* 功能列表區塊 */
.operate ul li .nav {
        padding-left: 15px;
        cursor: pointer;
        display: block;
        width: 185px;
        height: 33px;
        font-size: 15px;
        line-height: 33px;
}
.J_navlist li .nav{
        padding-left: 15px;
        cursor: pointer;
        display: block;
        height: 33px;
        font-size: 15px;
        line-height: 33px;
}

    .operate ul li .nolsit {
        padding-left: 15px;
        cursor: pointer;
        display: block;
        width: 185px;
        height: 33px;
        font-size: 15px;
        color: #fff;
        font-weight: bold;
        line-height: 33px;
    }
	.J_navlist li .nolsit{
        padding-left: 15px;
        cursor: pointer;
        display: block;
        height: 33px;
        font-size: 15px;
        color: #fff;
        font-weight: bold;
        line-height: 33px;
    }
    .operate li .list-item {
        position: relative;
        width: 200px;
        height: auto;
        zoom: 1;
    }
	.J_navlist li .list-item {
		font-size:15px!important;
        position: relative;
        height: auto;
        zoom: 1;

    }
	.J_navlist li .list-item .am01{
		border-top:1px solid #ccc;
	}
/* 功能列表 */
.am01 {
    padding-left: 20px;
    height: 33px;
    background: #fff;
}
    /*	regular	*/
    .am01 p {
        line-height: 33px;
        color: #444;
        font-size: 15px;
    }

    .am01 a {
        color: #2266cc;
        text-decoration: none;
    }



.am01:hover {
    background-color: #aabbcc;
    color:#fff;
}
.am01:hover a{
    color:#fff;
}
.am01-select {
    background-color: #cfdfff!important;
    color:#fff;
}
    /*	selected	*/
    .am01-select a {
        color: #226699!important;
        font-weight:bold;
    }
/*	hover	*/
/* 按鍵 */
.white-btn {
    color: #3F4140;
    background-color: #fff;
    text-align: center;
    font-size:14px;
    line-height: 26px;
    min-height:26px;
    padding: 0px 10px;
    display: inline-block;
    margin: auto;
}

    .white-btn:hover {
        color: #3F4140;
        text-decoration: none;
        background-color: #eee;
    }
.purple-login-btn {
    padding: 2px 10px 2px 10px;
    color: #FFF;
    background-color: #b956a5;
    text-align: center;
    line-height: 25px;
    display: inline-block;
    margin: auto;
    width:366px;
}

    .purple-login-btn:hover {
        color: #fff;
        text-decoration: none;
        background-color: #a9418c;
    }
.green-btn {
    text-align: center;
    font-size:14px;
    line-height: 26px;
    min-height:26px;
    padding: 0px 10px;
    display: inline-block;
    margin: auto;
	  border-radius: 4px;
    border: 1px solid #bbb;
}

.gray-btn {
    color: #fff!important;
    background-color: #428bca!important;
    text-decoration: none!important;
    text-align: center;
    font-size:14px;
    line-height: 26px;
    min-height:26px;
    padding: 0px 10px;
    display: inline-block;
    margin: auto;
	  border-radius: 4px;
    border: 1px solid #bbb;
}
a.gray-btn {
    color: #fff!important;
    background-color: #428bca!important;
    text-decoration: none!important;
    text-align: center;
    font-size:14px;
    line-height: 18px;
    min-height:18px;
    padding: 4px 10px;
    display: inline-block;
    margin: auto;
	  border-radius: 4px;
    border: 1px solid #bbb;
}
.gray-btn.red{background:#ff0000!important;}
.gray-btn:hover {
    color: #444!important;
    text-decoration: none;
    background-color: #aff!important;
}
.Add-btn {
    background-color: #5cb85c;
    border-color: #4cae4c;
    color: #fff;
    text-align: center;
    font-size:14px;
    line-height: 26px;
    min-height:26px;
    padding: 0px 10px;
    display: inline-block;
    border-radius: 4px;
    cursor: pointer;
    white-space: nowrap;
    display: inline-block;
    margin:3px;
}
.Add-btn:hover {
        background-color: #47a447;
        border-color: #398439;
        color: #fff;
        text-decoration:none;
    }
.Update-btn {
    background-color: #428bca;
    border-color: #357ebd;
    color: #fff;
    border-radius: 4px;
    cursor: pointer;
    white-space: nowrap;
    font-size:14px;
    line-height: 26px;
    min-height:26px;
    padding: 0px 10px;
    display: inline-block;
}
.Update-btn:hover, .Update-btn:focus, .Update-btn:active, .Update-btn.active, .open .dropdown-toggle.Update-btn {
    background-color: #3276b1;
    border-color: #285e8e;
    color: #fff;
    text-decoration:none;
}
.Update-sbtn {
    background-color: #428bca;
    border-color: #357ebd;
    color: #fff;
    border-radius: 4px;
    cursor: pointer;
    white-space: nowrap;
    font-size:14px;
    line-height: 26px;
    min-height:26px;
    padding: 0px 10px;
    /*height:100%;*/
    display: inline-block;
}
.Update-sbtn:hover, .Update-sbtn:focus, .Update-sbtn:active, .Update-sbtn.active, .open .dropdown-toggle.Update-sbtn {
    background-color: #3276b1;
    border-color: #285e8e;
    color: #fff;
    text-decoration:none;
}
.Page-btn,a.Page-btn {
    background-color: #428bca;
    border-color: #357ebd;
    color: #fff!important;
    text-decoration: none!important;
    border-radius: 4px;
    cursor: pointer;
    white-space: nowrap;
    display: inline-block;
    font-size:14px;
    line-height: 26px;
    min-height:26px;
    padding: 0px 3px;
    min-width:20px;
}
.Page-btn:hover, .Page-btn:focus, .Page-btn:active, .Page-btn.active, .open .dropdown-toggle.Page-btn {
    background-color: #3276b1;
    border-color: #285e8e;
    color: #fff;
    text-decoration:none;
}
.Page-btn.on{
  background-color: #ccc!important;
  color: #fff!important;
}
.Del-btn,.delbtn,.delbtn2 {/*delbtn2 避免被呼叫 */
    background-color: #d9534f;
    border-color: #d43f3a;
    color: #fff!important;
    text-decoration: none!important;
    border-radius: 4px;
    cursor: pointer;
    white-space: nowrap;
    text-align: center;
    font-size:14px;
    line-height: 26px;
    min-height:26px;
    padding: 0px 10px;
    display: inline-block;
    margin: auto;
}
.Del-btn:hover, .delbtn:hover {
    background-color: #d2322d;
    border-color: #ac2925;
    color: #fff;
    text-decoration:none;
}
.input01 {
    margin-left: 10px;
    padding-left: 5px;
    border: 1px solid #cccccc;
    height: 30px;
    width: 95%;
}

.input02 {
    padding-left: 5px;
    border: 1px solid #cccccc;
    height: 30px;
    width: 90%;
}

.input03 {
    padding-left: 5px;
    border: 1px solid #cccccc;
    height: 100px;
    width: 90%;
}

.input04 {
    padding-left: 5px;
    border: 1px solid #cccccc;
    height: 30px;
    width: 210px;
}

.list01 {
    border: 1px solid #cccccc;
    height: 30px;
    width: 85px;
}

.list02 {
    border: 1px solid #cccccc;
    height: 30px;
    width: 35px;
}

.textarea1 {
    margin-left: 10px;
    padding-left: 5px;
    border: 1px solid #cccccc;
    height: 80px;
    width: 95%;
}

table {
    margin-top: 20px;
    margin-bottom: 40px;
}

th {
    height: 36px;
    background-color: #3F4140;
    font-size: 15px;
    color: #FFF;
}

td {
    padding-top: 10px;
    padding-bottom: 10px;
}

.tr36 {
    height: 36px;
}

.tr01 {
    background-color: #eee;
}

.tr02 {
    background-color: #ddd;
}

.news-update-img {
    width: 400px;
    height: 250px;
    background: #FFF;
}
/* FOR font awson */
i {
    margin-right: 5px;
}

#listpage {
    position: relative;
    padding: 30px 0;
    text-align: center;
}

    #listpage a {
        position: relative;
        display: inline-block;
        height: 30px;
        width: 30px;
        margin: 0 5px;
        font-size: 15px;
        line-height: 30px;
        color: #fff;
        background: #428bca;
        border: 1px solid #357ebd;
    }

        #listpage a:hover {
            color: #fff;
            background: #3276b1;
        }

        #listpage a.on {
            color: #fff;
            background: #3276b1;
        }
.redtext{color:#ff0000!important;}
/* NAV */
@media screen and (max-width: 1200px) {
	.J_navlist{position:absolute;top:-1000px;left:0;width:100%;backgroundurl(../img/w30.png);z-index:1;}
}
@media screen and (max-width: 980px) {
	table{width:100%!important;}

}
@media screen and (max-width: 800px) {
	#contentwrap input,#contentwrap a,#contentwrap select{font-size:12px!important;padding-left:1!important;padding-right:1!important;margin-right:0!important;margin-left:0!important;}
	td,th{font-size:12px!important;}
}
@media screen and (max-width: 500px) {
	#contentwrap input,#contentwrap  a,#contentwrap  select{font-size:10px!important;}
	td,th{font-size:10px!important;}
}