@charset "utf-8";
/* CSS Document */

body {	font-family: "微軟正黑體", "蘋果儷中黑", "Lucida Grande", "Arial", "Arial Narrow";	margin: 0px;padding: 0px;font-size: 13px;	line-height: 20px; background-color:#CFE0FF; }
h1,h2,h3,h4,h5,ul,ol,li,p { margin:0; padding:0}
ul {list-style: none;margin: 0;	padding: 0;}
a {color:#FFF;text-decoration: none; }
a:link, a:visited {}
a:hover {}
h1{ font-size:30px; }
h1 a{ color:#000; }
.clearboth { clear:both;}
.f { position:fixed;}
.o5 { opacity:0.5;}
.o8 { opacity:0.8;}
.o9 { opacity:0.9;}
.cg { color:#393;}
.cr { color:#F00;}
.cs { color:#444;}
.cs2 { color:#999;}
.fs13 { font-size:13px;}
.fs15 { font-size:15px;}
.fs17 { font-size:17px;}
.fs19 { font-size:19px;}
.w200 { width:200px;}
.fs11 { font-size:11px;}
textarea {  resize: none; }

/*ui*/
.text { color: #fff; text-shadow: 0 0 3px rgba(255,0,0,0.6); }
.text2 { color: #fff; text-shadow: 0 0 3px rgba(30,87,153,0.6); }
.text3 { color: #fff; text-shadow: 1px 1px 3px rgba(18,19,88,0.6); }
.text_main { color: #fff; text-shadow: 0 0 1px rgba(30,87,153,0.6); }

.text:hover {}
.skin_b {
	background: #1e5799; /* Old browsers */
	background: -moz-linear-gradient(top, #1e5799 0%, #2989d8 50%, #7db9e8 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(50%,#2989d8),  color-stop(100%,#7db9e8)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #1e5799 0%,#2989d8 50%,#7db9e8 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #1e5799 0%,#2989d8 50%,#7db9e8 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #1e5799 0%,#2989d8 50%,#7db9e8 100%); /* IE10+ */
	background: linear-gradient(to bottom, #1e5799 0%,#2989d8 50%,#7db9e8 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */
}
.skin_b2 {
	background: #2989d8; /* Old browsers */
	background: -moz-linear-gradient(top, #2989d8 0%, #2989d8 50%, #7db9e8 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2989d8), color-stop(50%,#2989d8),  color-stop(100%,#7db9e8)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #2989d8 0%,#2989d8 50%,#7db9e8 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #2989d8 0%,#2989d8 50%,#7db9e8 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #2989d8 0%,#2989d8 50%,#7db9e8 100%); /* IE10+ */
	background: linear-gradient(to bottom, #2989d8 0%,#2989d8 50%,#7db9e8 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2989d8', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */
}
.skin_b3 {
	background: #2989d8; /* Old browsers */
	background: -moz-linear-gradient(top, #2989d8 0%, #7db9e8 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2989d8),  color-stop(100%,#7db9e8)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #2989d8 0%,#7db9e8 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #2989d8 0%,#7db9e8 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #2989d8 0%,#7db9e8 100%); /* IE10+ */
	background: linear-gradient(to bottom, #2989d8 0%,#7db9e8 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2989d8', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */
}
.skin_b4 {
	background: #2989d8; /* Old browsers */
	background: -moz-linear-gradient(top, #2989d8 0%, #2989d8 50%, #44aaff 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2989d8), color-stop(50%,#2989d8),  color-stop(100%,#44aaff)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #2989d8 0%,#2989d8 50%,#44aaff 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #2989d8 0%,#2989d8 50%,#44aaff 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #2989d8 0%,#2989d8 50%,#44aaff 100%); /* IE10+ */
	background: linear-gradient(to bottom, #2989d8 0%,#2989d8 50%,#44aaff 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2989d8', endColorstr='#44aaff',GradientType=0 ); /* IE6-9 */
}
.skin_b5 {
	background: #c8e0ff ; /* Old browsers */
	background: -moz-linear-gradient(top, #c8e0ff  0%, #CFE0FF 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c8e0ff ),  color-stop(100%,#CFE0FF)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #c8e0ff  0%,#CFE0FF 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #c8e0ff  0%,#CFE0FF 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #c8e0ff  0%,#CFE0FF 100%); /* IE10+ */
	background: linear-gradient(to bottom, #c8e0ff  0%,#CFE0FF 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c8e0ff ', endColorstr='#CFE0FF',GradientType=0 ); /* IE6-9 */
}


.skin_g {
	background: #a8e25a; /* Old browsers */
	background: -moz-linear-gradient(top, #a8e25a 0%, #a8e25a 50%, #baf765 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a8e25a), color-stop(50%,#a8e25a),  color-stop(100%,#baf765)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #a8e25a 0%,#a8e25a 50%,#baf765 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #a8e25a 0%,#a8e25a 50%,#baf765 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #a8e25a 0%,#a8e25a 50%,#baf765 100%); /* IE10+ */
	background: linear-gradient(to bottom, #a8e25a 0%,#a8e25a 50%,#baf765 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a8e25a', endColorstr='#baf765',GradientType=0 ); /* IE6-9 */
}

.button {
	background: #1e5799; /* Old browsers */
	background: -moz-linear-gradient(top, #1e5799 0%, #2989d8 50%, #7db9e8 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(50%,#2989d8),  color-stop(100%,#7db9e8)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #1e5799 0%,#2989d8 50%,#7db9e8 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #1e5799 0%,#2989d8 50%,#7db9e8 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #1e5799 0%,#2989d8 50%,#7db9e8 100%); /* IE10+ */
	background: linear-gradient(to bottom, #1e5799 0%,#2989d8 50%,#7db9e8 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0
); /* IE6-9 */
	
	border:0px solid #fff;
	box-shadow:2px 2px 5px #000;
	-moz-box-shadow:2px 2px 5px #000;
	-webkit-box-shadow:2px 2px 5px #000;
	border-radius:10px 10px 10px 10px;
	-moz-border-radius:10px 10px 10px 10px;
	-webkit-border-radius:10px 10px 10px 10px;
	
	display: inline-block;
	line-height: 20px;
	padding: 5px 8px;
}
.button:hover { box-shadow: none; color: #ddd;}

.button2 {
	background: #1e5799; /* Old browsers */
	background: -moz-linear-gradient(top, #1e5799 0%, #2989d8 50%, #7db9e8 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(50%,#2989d8),  color-stop(100%,#7db9e8)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #1e5799 0%,#2989d8 50%,#7db9e8 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #1e5799 0%,#2989d8 50%,#7db9e8 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #1e5799 0%,#2989d8 50%,#7db9e8 100%); /* IE10+ */
	background: linear-gradient(to bottom, #1e5799 0%,#2989d8 50%,#7db9e8 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0
); /* IE6-9 */
	
	border:1px solid #aaa;
	box-shadow: none;
	border-radius:10px 10px 10px 10px;
	-moz-border-radius:10px 10px 10px 10px;
	-webkit-border-radius:10px 10px 10px 10px;
	
	display: inline-block;
	line-height: 20px;
	padding: 5px 8px;
}
.button2:hover { 
	box-shadow:0px 0px 5px #7db9e8;
	-moz-box-shadow:0px 0px 5px #7db9e8;
	-webkit-box-shadow:0px 0px 5px #7db9e8;
	color: #ddd;
}


/*圓角*/
.radius { 
	border-radius:10px 10px 10px 10px;
	-moz-border-radius:10px 10px 10px 10px;
	-webkit-border-radius:10px 10px 10px 10px;
}
.radius2 { 
	border-radius:20px 20px 20px 20px;
	-moz-border-radius:20px 20px 20px 20px;
	-webkit-border-radius:20px 20px 20px 20px;
}

/*陰影*/
.shadow {
-moz-box-shadow: 5px 5px 10px rgba(30,87,153,0.2);
-webkit-box-shadow: 5px 5px 10px rgba(30,87,153,0.2);
box-shadow: 5px 5px 10px rgba(30,87,153,0.2);
}

/*自訂ui*/
.mg_ui_text { padding:5px; width:200px; border:1px #7db9e8 solid; letter-spacing: 1px; color: #1e5799;}
.mg_ui_select { padding:3px; border:1px #7db9e8 solid; letter-spacing: 1px; color: #1e5799;}




/*login*/
#login {}
#login .l_login {padding: 5px;font-size: 15px;color: #fff; border:1px solid #aaa; margin:0 auto; width:222px;}
#login .l_btn { padding-top:20px; text-align:center; margin:0 auto; width:222px;}
#login .l_btn a{ }


/*訊息*/
.message { padding:15px;}
.message_body, .message_pop{ overflow:hidden;}
.message_text { color: #1e5799; font-size:19px; padding: 10px 15px 2px 15px; line-height:25px;}
.message_text .datetime{ color: #aaa; font-size:13px;}
.message .avater { height:234px; float:left; }
.message .avater_name { height:24px; width:170px; color: #1e5799;font-size: 19px; text-align:center; padding: 5px; text-overflow:ellipsis; line-height: 24px;}
.message .avater_180x200{ width:180px; height:200px; background-size:cover;}
.message .kanban { background-image:url(/images/normal/avatar/kanban_musume.gif); background-repeat:no-repeat; background-position:center center;}

/*小*/
.message .target { top: 140px; left: -9px; position: relative; z-index: 4; height: 0;}
.message .target_area {  width: 5px; height:20px; overflow:hidden;  overflow: hidden;	padding:5px 0 0 5px; }
.message .target_arrow { width: 10px;height: 10px;border-top: 2px solid;	border-right: 2px solid;border-color: #7db9e8; display: inline-block; background-color: #CFE0FF; transform:rotate(-135deg);-ms-transform:rotate(-135deg);
-webkit-transform:rotate(-135deg); }

/*大*/
.message .target { top: 140px; left: -13px; position: relative; z-index: 4; height: 0;}
.message .target_area {  width: 10px; height:25px; overflow:hidden;  overflow: hidden;	padding:5px 0 0 5px; }
.message .target_arrow { width: 20px;height: 20px;border-top: 2px solid;	border-right: 2px solid;border-color: #7db9e8; display: inline-block; background-color: #CFE0FF; transform:rotate(-135deg);-ms-transform:rotate(-135deg);
-webkit-transform:rotate(-135deg); }

.message .target_auto { top: 17px; left: -9px; position: relative; z-index: 4; height: 0;}

/*訊息內容區高度設定*/
.message .textarea { height:210px;  width:0; float:left; font-size: 17px; color: #1e5799; line-height:23px; }
.message_pop .textarea { height:210px; width: 0; padding:10px; border: 2px solid #7db9e8; }
.message_body .textarea { height:210px; width: 0; padding:10px; border: 2px solid #7db9e8; }

.message .textarea_auto { height:auto; width:300px; float:left; font-size: 17px; color: #1e5799; line-height:23px; }
.message_pop .textarea_auto {  height:auto; width: 566px; padding:10px; border: 2px solid #7db9e8; }
.message_body .textarea_auto {  height:auto; width: 566px; padding:10px; border: 2px solid #7db9e8; }

.message .next { top: 195px; left: 0; position: relative; z-index: 4; height: 0; display:none; cursor:pointer;} 
.message .prev { top: 195px; left: 0; position: relative; z-index: 4; height: 0; display:none; cursor:pointer;} 


.message .show{ display:block;}
.message .hide{ display:none;}


.textarea p { display:block; line-height:30px; height:30px;}
.textarea .mg_ui_search { padding: 0px 5px; width: 200px; border: 1px #7db9e8 solid; letter-spacing: 1px; color: #1e5799; margin: 0 4px; height: 20px;}
.textarea .mg_ui_text { padding: 2px 5px; width: 200px; border: 1px #7db9e8 solid; letter-spacing: 1px; color: #1e5799; margin: 0 4px; height: 16px;}
.textarea .mg_ui_textarea { padding: 2px 5px; width: 400px; border: 1px #7db9e8 solid; letter-spacing: 1px; color: #1e5799; margin: 0 4px; height: 100px;}
.textarea #code { width:100px; }
.textarea .button2 { padding: 0 20px;}
.textarea .page { padding: 0 8px; }
.textarea .select { color:#444;}


.b-shadow { box-shadow: 3px 3px 8px #894930;}
.t-shadow { text-shadow: 3px 3px 8px #894930;}
.radius {-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
.b1 { border: 1px solid #552512;}
.btn { background:url(/images/common/bg_btn.jpg) repeat 0 0; padding:3px; }
.btn:hover { border: 1px solid #CCCCCC;}
.btn.here { border: 1px solid #CCCCCC;}
.header { height:45px; line-height:45px; text-align:center;  border-bottom: 1px solid #64b9e8; }
.header .header_title { height: 0; position: relative; z-index: 101; }
.header .header_title h2{ display:inline-block;}
.header .menu_header { position: relative; z-index: 102;}
.header .menu_header li { width:45px; height:40px; display:inline-block; float:left; padding-top: 5px; margin:0 5px; }
.header .menu_header .left { float:left;}
.header .menu_header .right { float:right;}
.header .menu_header li a {  }
.header .menu_header li .button_menu_main {}
.header .menu_header li .button_login {}


/*區塊*/
.body #content { width:300px; float:left;}
.body #sidebar { width:300px; float:left;}


/*menu*/
.menu { padding:10px; text-align:center;}
.menu a { width:260px; font-size:17px; padding: 5px 8px 2px 8px; letter-spacing: 2px; margin-bottom:5px;}

/*pop*/
.body_pop { position:absolute; top:80px; z-index:120; left:3000px; width:700px;  -moz-box-shadow:0px 0px 30px rgba(18,19,88,0.6)
-webkit-box-shadow:0px 0px 30px rgba(18,19,88,0.6);box-shadow:0px 0px 30px rgba(18,19,88,0.6);; }
.body_pop .body_pop_content { position:relative; height:0; width:700px;  }
.body_pop .body_pop_content .body_pop_loader { text-align:center; padding: 30px 0 ; }
.body_bg { position:fixed; width:100%; height:100%; top:0;  z-index:119;  background-color:#000; filter:alpha(opacity=30); opacity:0.3;}

/*status*/
.status { padding: 10px; border: 2px solid #7db9e8; margin: 15px 10px; color:#1e5799; }
.status h3 { height:0; top: -26px; text-align:center; line-height: 30px; position: relative;  }
.status h3 strong { display:inline-block;background-color:#CFE0FF; padding: 0 10px; }
.status .avater_54x60 { width: 54px;height: 60px;background-size: cover;}
.status .kanban  {background-image: url(/images/normal/avatar/kanban_musume.gif);background-repeat: no-repeat;background-position: center center;}
.status .commoner {background-image: url(/images/normal/avatar/avatar_commoner.png);background-repeat: no-repeat;background-position: center center;}
.status .avatar_1 {background-image: url(/images/normal/avatar/avatar_commoner.png);background-repeat: no-repeat;background-position: center center;}
.status .avater { float:left; margin-right: 5px;margin-bottom: 5px;}
.status .avater a{ display:block;}
.status .HPPic { background-color: black; height: 4px;	padding: 1px; width:254px; border: 1px solid #3d8fce;}
.status .HPPic div{background-color: #87B7E7;	height: 3px; }
.status .c_both { clear:both;}

.textarea .directions { height:auto;  padding: 5px 10px; border: 1px solid #7db9e8; font-size: 15px;line-height: 21px; color:#1e5799;}
