html,body,img{
	margin:0;
	padding:0;
	border:none;
	background-color: #F7F7F7;
	font-family:Verdana;
}
#changeOrder,#wypl{
	background-image:url(images/up_down.png);
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:20px auto;
	width:30px;
	height:30px;
	position:fixed;
	top:10px;
	right:10px;
	background-color:#63cd52;
	color:#FFF;
	border-radius:15px;
	opacity:0.8;
	z-index:100;
}
#wypl{
	right:50px;
	background-image:url(images/cmt_pen.png);
	background-color:#FAFAFA;
	box-shadow:0 0 3px rgba(0,0,0,0.2);
	background-position:62% 46%;
}
body, article, section, h1, h2, hgroup, p, a, ul, li, em, div, small, span, footer, canvas, figure, figcaption, input{margin:0;padding:0;}
#top_banner img,.hfinfo img{
	width:100%;
	height:auto;
}
.hfinfo img{border-radius:5px;}
a {
	color:#333;
	cursor: pointer;
	text-decoration: none;
}
ul,li{
	list-style-type: none;
}
.clr{
	clear:both;
}
.cardexplain{
	/*margin:11px 10px 22px 9px;*/
	margin:11px 10px 0 9px;
	min-width:301px;
}
h2 {
	color: #373B3E;
	font-size: 14px;
	line-height: 32px;
	padding-left: 10px;
	padding-top: 5px;
	text-align: left;
	font-weight:normal;
}
/*history*/
#message{ background-color:#f7f7f7}
.history { background:url(images/line04.gif) repeat-y 15px 0;  position:relative; }
.history-date h2 { background:url(images/icon06.gif) no-repeat 0 0; font-size:24px; font-weight:normal; padding-left:38px; margin:0 0 30px 0; padding-top:0; background-size:32px auto;color:#1DB702; }
.history-date h2.first { position:absolute; left:0; top:0; z-index:99;}
.history-date h2 img { vertical-align:-5px;}
.history-date h2.date02 { background:none;}
.history-date ul {}
.history-date ul li{
	background:url(images/icon07.gif) no-repeat 8px 0;
	background-size:15px 14px;
	padding: 0 0 20px 30px;
	zoom:1;
}
.history-date ul li.last { padding-bottom:0;}
.history-date ul li:after{content:" "; display:block; height:0; clear:both; visibility:hidden;}
.history-date ul li h3 {
	color:#c3c3c3;
	margin: -2px 0 10px 0;
	-webkit-transition:all 1s ease-out;
	-moz-transition:all 1s ease-out;
	-o-transition:all 1s ease-out;
	transition:all 1s ease-out;
}
.history-date ul li h3.latest{background-color:#F90;color:#FFF !important;border-radius:5px;}
.history-date ul li h3.latest span{color:#fff !important;}
.history-date ul li h3 img { float:left; margin-right:5px; width:32px; height:32px;border-radius: 3px;}
.history-date ul li h3 span { display:block; color:#d0d0d0; font-size:12px; margin-top:2px;}
.history-date ul li dl { background-color: #FFFFFF;
	color: #666666;
	display: block;
	font-size: 12px;
	padding:10px;
	position:relative;
	border-radius: 5px 5px 5px 5px;
	box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.15);
	-moz-box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.15);
	-webkit-box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.15);
}
.history-date ul li dl.huifu { 
	background-color: #FFFFFF;
	box-shadow: none;
	-moz-box-shadow:none;
	-webkit-box-shadow:none;
}
.history-date ul li dl dt { font-size: 16px;line-height: 22px; color:#737373; }
.history-date ul li dl dt .czan{ display:inline-block; width:33%;}
/*.history-date ul li dl dt span { display:block; color:#999; font-size:12px; line-height: 18px;}*/
.history-date .hfinfo{word-wrap: break-word;word-break:break-all;overflow-x:hidden;}
.history-date .hfinfo span{display:inline;}
.history-date ul li.green h3 { color:#1db702;font-weight:normal;font-size:15px;}
.history-date ul li.green h3 span { color:#92CC88; }
.history-date ul li.green dl { margin:5px 0 10px 0;}
.history-date ul li.green dl dt { font-size: 14px;line-height: 22px;}
.history-date h2.first .more-history {font-size: 16px; background: transparent; margin-left: 30px;}
.history-date h2.first .more-history:hover {text-decoration: underline;}
*body .history-date ul li dl dt {_font-size:12px !important; _font-weight:bold;}
*body .history-date ul li dl dt span {_font-weight:normal !important;}
*body .history-date ul li.green dl dt a {_background:transparent !important; *background:transparent !important;*font-size:12px !important; _font-weight:normal !important;}

#footer{position:fixed;right:0;bottom:0;width:100%;height:20px;line-height:20px;text-align:right;padding:0 10px;color:#FFF;background-color:#85cc7a;text-shadow:0 0 3px rgba(0,0,0,0.5);border-top:2px solid #63cd52;font-size:12px;}


#loadingCmt{margin:10px;border-radius:6px;border:1px solid #DDD;background-color:#EEE;text-align:center;padding:6px;font-size:14px;cursor:pointer;}
#comments{margin:0;padding:0 0 40px 26px;background:url(images/line04.gif) repeat-y 24px 0;} 
#comments ul{list-style:none;padding:0;margin:6px;position:relative;border-bottom:1px solid #EEE;}
#comments ul li{color:#369;display:block;color:#AAA;margin:0 10px;padding:4px;font-size:14px;}
#comments ul li.name{color:#1976c1;display:block;margin:0 10px;padding:4px;}
#comments ul li.msg{color:#555;margin-bottom:8px;}
#comments ul li.posttime{text-align:right;font-size:80%;position:absolute;top:2px;right:10px;}
#comments ul li.goreply{text-align:right;color:#abc;}

#add_cmt{margin:0 10px;padding-bottom:30px;height:auto;position:relative;}
#cmt_con{display:block;width:100%;margin:10px auto;padding:6px 0;font-size:14px;border:1px solid #F90;box-shadow:0 0 2px #369;border-radius:3px;}
#cmt_submit{font-size:14px;padding:8px 20px;border:none;border-radius:5px;color:#515151;background:#E5E5E5;margin-bottom:1em;position:absolute;bottom:-18px;right:0;}
#cmt_username{padding:8px 6px;font-size:13px;border:1px solid #ABC;box-shadow:0 0 3px #EEE inset;border-radius:5px;margin-bottom:1em;position:absolute;bottom:-18px;left:-1px;width:50%;}

#comment_head{width: 100px;
text-align: center;position: relative;
margin: 0 auto;
font-weight: bold;
padding-left: 23px;
border-bottom: 2px solid #e5e5e5;
color: #515151;
line-height: 30px;
font-size: 16px;
background: #64D4FF url(images/cmt_pen.png) no-repeat 30% 50%;
height: 30px;
background-size: auto 27px;
border-radius: 5px;}
/*#goandpost{position:absolute;right:5px;top:0;height:30px;width:30px;background:url(images/cmt_pen.png) no-repeat 50% 50%;background-size:auto 27px;}*/
#seenew{
	position: fixed;
	right:5px;
	bottom:25px;
	font-size:12px;
	line-height: 20px;
	display:block;
	padding:5px;
	border-radius:3px;
	background-color: #F60;
	color:#FFF;
	opacity: 0.6;
}
.p600{
	-webkit-perspective:300;
	-moz-perspective:300;
	-ms-perspective:300;
	-o-perspective:300;
	perspective:300;
}
.c600{
	-webkit-transform-style:preserve-3d;
	-moz-transform-style:preserve-3d;
	-ms-transform-style:preserve-3d;
	-o-transform-style:preserve-3d;
	transform-style:preserve-3d;
}

.swing{
	display: inline-block;
	-webkit-animation:swing 4s infinite ease-in-out;
	-moz-animation:swing 4s infinite ease-in-out;
	-ms-animation:swing 4s infinite ease-in-out;
	-o-animation:swing 4s infinite ease-in-out;
	animation:swing 4s infinite ease-in-out;
}
@-webkit-keyframes swing{
	0%{-webkit-transform:rotateY(0deg);}
	10%{-webkit-transform:rotateY(30deg);}
	30%{-webkit-transform:rotateY(-30deg);}
	40%{-webkit-transform:rotateY(0deg);}
	80%{-webkit-transform:rotateY(0deg) rotateX(0deg);}
	100%{-webkit-transform:rotateY(0deg) rotateX(360deg);}
}
@-moz-keyframes swing{
	0%{-moz-transform:rotateY(0deg);}
	10%{-moz-transform:rotateY(30deg);}
	30%{-moz-transform:rotateY(-30deg);}
	40%{-moz-transform:rotateY(0deg);}
	80%{-moz-transform:rotateY(0deg) rotateX(0deg);}
	100%{-moz-transform:rotateY(0deg) rotateX(360deg);}
}
@-ms-keyframes swing{
	0%{-ms-transform:rotateY(0deg);}
	10%{-ms-transform:rotateY(30deg);}
	30%{-ms-transform:rotateY(-30deg);}
	40%{-ms-transform:rotateY(0deg);}
	80%{-ms-transform:rotateY(0deg) rotateX(0deg);}
	100%{-ms-transform:rotateY(0deg) rotateX(360deg);}
}
@-o-keyframes swing{
	0%{-o-transform:rotateY(0deg);}
	10%{-o-transform:rotateY(30deg);}
	30%{-o-transform:rotateY(-30deg);}
	40%{-o-transform:rotateY(0deg);}
	80%{-o-transform:rotateY(0deg) rotateX(0deg);}
	100%{-o-transform:rotateY(0deg) rotateX(360deg);}
}
@keyframes swing{
	0%{transform:rotateY(0deg);}
	10%{transform:rotateY(30deg);}
	30%{transform:rotateY(-30deg);}
	40%{transform:rotateY(0deg);}
	80%{transform:rotateY(0deg) rotateX(0deg);}
	100%{transform:rotateY(0deg) rotateX(360deg);}
}