﻿/* CSS Document */
@charset "utf-8";
*{ margin:0; padding:0}
body, div, address, blockquote, iframe, ul, ol, dl, dt, dd, li, dl, h1, h2, h3, h4, h5, h6, p, pre, table, caption, th, td, form, legend, fieldset, input, button, select, textarea {margin:0; padding:0; font-weight: normal;font-style: normal;font-size: 100%;font-family:'黑体';}
ol, ul ,li{list-style: none;}
img {border: 0;}
body {color:#000;
      background:#FFF; 
	  height:100%;
	  width:100%;
	  font-size:12px;
	  line-height:1.5;
	 /* font-family: 'Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3',"メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",Meiryo,Osaka,sans-serif;*/}
.clearfix:after {clear:both; content:"."; display:block; height:0pt; visibility:hidden; overflow:hidden;}
.clear{clear:both;height:1px; margin-top:-1px; width:100%;}
a{
	text-decoration:none;
	color:#000;}
.left{
	float:left;}
.right{
	float:right;} 
.f14{ font-size:14px;}
.f12{ font-size:12px;}
.f16{ font-size:16px;}
.f18{ font-size:18px;}
.m-r{ margin-right:20px;}
.m-r a:hover{ color:#f00;}
.blue{ color:#fff; width:200px; margin-left:2px;}
.f-blue{ color:#1b46a2;}
.color-1{ background:#231815;}
.color-2{ background:#18448e;}
.color-3{ background:#006934;}
.color-4{ background:#f39800;}
.heit{ height:10px; margin-top:5px;}
.header{ width:956px; margin:2px 0 2px 2px; overflow:hidden;
	-webkit-box-shadow:0 0 5px rgba(0,0,0,0.2);
	-moz-box-shadow: 0 0 5px rgba(0,0,0,0.2);
	box-shadow: 0 0 5px rgba(0,0,0,0.2);}
.header ul.country{ display:block; overflow:hidden; zoom:1;}
.header ul.country li{ float:left; padding:0 10px 0 3px; font-family:'黑体'; color:#fff;}
.header ul.country li.bg{ background:url(../images/ico_01.jpg) no-repeat left 4px; width:90px;}
.header ul.country li.bg a:hover{ color:#f00;}

.header ul.country li a{ color:#fff;}
.header ul.country li.t-contact{ background:#000;width:90px;}
.top{ height:25px;     background: #606367; line-height:25px; overflow:hidden;}
.top span{ color:#fff; padding:0 0 0 15px; font-weight:bold; font-size:12px; font-family: Helvetica,Arial, sans-serif;}
.logomenu{ padding:0px 20px; overflow:hidden; position:relative;}
.logo{ background:url(../images/logo.png) no-repeat left center; display:block; width:181px; height:40px; padding:10px 0;}
.menu{ display:block; position:absolute; bottom:0; right:20px; overflow:hidden; zoom:1; border-right:1px solid #e0e0e0;}
.menu li{  float:left;display:inline-block; width:115px;font-family:'黑体'; font-size:16px; text-align:center; height:42px; line-height:42px; border-left:1px solid #e0e0e0;}
.menu li:hover,.menu li.current{background: #0d74b6;}
.menu li a{ display:block; width:100%; height:42px; cursor:pointer;}
.menu li a:hover,.menu li.current a{color:#fff;}





#total_kawam, #kawa-bana, #kawa-center, #kawa-news-bottom{ width:960px; margin:0 auto;}
 #kawa-bana{ width:960px; height:457px; overflow:hidden;}
.kawa-center-title{ width:960px;}
#kawa-center{ height:300px; background:url(../images/kawa-center-bg.jpg) no-repeat;}
.kawa-center-title{ height:89px; line-height:155px; font-size:24px; text-align:center;}


#kawa-news-bottom{ height:380px; overflow:hidden; margin-bottom:30px;}
#kawa-news-bottom ul{width:830px;  margin-left:60px; margin-top:25px;}
#kawa-news-bottom ul li.last{border-right:none;}
#kawa-news-bottom ul li.last img{ padding:16px 0;}
#kawa-news-bottom ul li.last img a:hover{ opacity:0.7; 
 filter:alpha(opacity=70);       /* IE */
 -moz-opacity:0.7;              /* 老版Mozilla */
 -khtml-opacity:0.7;              /* 老版Safari */}


.foot{ background:#ececec;}
.foot a.logo-s{ display:block; background:url(../images/logo-s.jpg) no-repeat left 6px;; width:198px; height:47px; padding:0px 10px 0px 0px; margin:10px 0 5px 28px;}
.foot div.left{ font-size:12px; line-height:42px; padding:0 15px; margin:10px 0; border-left:0px solid #adadac;}
.f-grey{ color:#a9a9a9;}
.f-grey{ color:#a9a9a9;}
.blue-bg{ background:#0d74b6; color:#fff; height:24px; line-height:24px; text-align:center; /*padding:0 10px 0 210px;*/}
.blue-bg a{ color:#fff;}



#kawa-news-bottom ul li:first-child{ margin-left:0px;}
#kawa-news-bottom ul li{ width:260px; height:400px; float:left; border-right:1px solid #c9c9c7; padding-left:15px;}
#kawa-news-bottom ul li a:hover{ opacity:0.7; 
 filter:alpha(opacity=70);       /* IE */
 -moz-opacity:0.7;              /* 老版Mozilla */
 -khtml-opacity:0.7;  color:#0d74b6;              /* 老版Safari */}

.kawa-news-title{ font-size:20px; height:35px; line-height:35px;}
.kawa-product{ display:block; overflow:hidden; width:100%;}
.kawa-product dt{ width:120px;}
.kawa-product dd, .kawa-product dt{ float:left; height:64px; padding:8px 0; width:50%;}
.p-b5{ padding-bottom:5px;}

.news-center{ width:260px; margin:0 10px 30px 15px; position:relative;}
.news-center h3{ padding-bottom:3px;}
.news-center dl{
	margin-top:12px; z-index:10;}
#set_tab01,#set_tab02{ display:block; position:absolute; font-size:14px; text-indent:25px;}
#set_tab01.tabs_act,#set_tab02.tabs_act{ background:#fbfbfb url(../images/tab_on.jpg) no-repeat; width:134px;height:34px; line-height:34px; color:#fff; font-weight:bold;}
#set_tab02.tabs,#set_tab01.tabs{ background: url(../images/tab_off.png) no-repeat; width:134px; height:34px;line-height:32px; z-index:5;}
#set_tab01.tabs_act{ left:13px; top:42px;}
#set_tab01.tabs{ left:13px; top:42px;}
#set_tab02.tabs{ right:0px; top:42px;}
#set_tab02.tabs_act{ right:0px; top:42px;}
.news-center dl.tablist{ padding-bottom:12px; height:253px;}
.news-center dl.tablist a{ display:inline-block; width:60%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.news-center dl.tablist span{ float:right; margin-right:10px;}
.tablist dd{ padding-bottom:3px; height:25px; }
.tablist dd:hover{ color:hsl(203, 87%, 38%);}
.tablist dt{ position:relative; color:#336699; height:25px;}
.icon-news{ position:absolute; left:80px; display:inline-block; top:1px; background:url(../images/icon-new_1.jpg) no-repeat; width:33px; height:15px;}

.center-title-box1,.center-title-box2,.center-title-box3,.center-title-box4{ margin:0 1px 0 2px;}
.center-title-box1:hover{border-bottom:10px solid #231815;}
.center-title-box2:hover{border-bottom:10px solid #18448e;}
.center-title-box3:hover{border-bottom:10px solid #006934;}
.center-title-box4:hover{border-bottom:10px solid #f39800;}
.m-b5{ margin-bottom:5px;}
#kawa-center .blue{ margin-left:0;}

.kawa-product dd p a:hover{ color:#F00;}
.kawa-product dd p a{ color:#2b3f7c;}



--------------------------------------------*/
div#container {
     width: 100%;
     margin: 0 auto;
     overflow: hidden;
}
div.examples_body {
     width: 960px;
	 margin:0 auto;
	 clear: both;
	 overflow: hidden;
	 position: relative;
}


/* The main banner unordered list */
.bannerHolder {
    width: 920px;
	 margin: 10px;
	 padding: 20px 10px 20px 10px;
/*	 background-color: #f7f7f7;*/
	 border: 0px solid #eee;
	 overflow: hidden;

	/* CSS3 rounded corners */
	 -moz-border-radius:12px;
	 -webkit-border-radius:12px;
	 border-radius:12px;
}

/* Hiding the bullets of the li elements: */
.bannerHolder li {
	 list-style: none;
	 display: inline;
		 margin-left:40px;
	 margin-right:40px;
	 float:left;
	  border:0px solid #336799;
}

.bannerHolder li:hover p.bp{ color:#336799;}

/* The banner divs */
.banner {
     width: 125px;
	 height: 125px;
	 position: relative;
	 overflow: hidden;
	 float: left;
	 display: inline;
	 margin: 0 10px
}
.bannerHolder li p{text-align:center; line-height:30px; font-size:14px;}
.bannerHolder li:hvoer .banner p.companyInfo{ color:#0d74b6;}
/* The banner divs */
.banner img {
	 display: block;
	 border: none;
}

/* The dark animated divs */
.banner div {
	 position: absolute;
	 z-index: 100;
	 background-color: #222;
	 width: 60px;
	 height: 60px;
	 cursor: pointer;

	/*	Setting a really big value for border-radius
		will make the divs perfect circles */
	 -moz-border-radius:100px;
	 -webkit-border-radius:100px;
	 border-radius:100px;
}

/*	Positioning the animated divs outside the
	corners of the visible banner area: */
.banner .cornerTL { left:-63px; top:-63px; }
.banner .cornerTR { right:-63px; top:-63px; }
.banner .cornerBL { left:-63px; bottom:-63px; }
.banner .cornerBR { right:-63px; bottom:-63px; }

/* The "Visit Company" text */
.banner p {
     width: 100%;
	 left: 0;
	 top: 57px;
	 z-index: 200;
	 position: absolute;
	 font-family: Tahoma, Arial, Helvetica, sans-serif;
	 color: #FFF;
	 font-size: 11px;
	 text-align: center;
	 cursor: pointer;
	 display: none;	/* hidden by default */
}

