@charset "utf-8";


a,  address,  article, aside,  b, blockquote, body, caption, dd, div, dl, dt, em, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, header, hr, html, i, iframe, img, label, li, nav, object, ol, p, pre, section, small, span, strong, sub, sup, table, tbody, td, tfoot, th, thead, tr,  u, ul
{   border: 0;  margin: 0;  padding: 0; }

html,body{ height:100%;width: 100%;}

article, aside,section {   display: block; }

img {
  color: transparent;
  font-size: 0;
  vertical-align: middle;
  -ms-interpolation-mode: bicubic;
}


br {  letter-spacing:normal; }


html {
   overflow-y:scroll;
}

body {
	font-family : verdana, sans-serif;
	font-size: 98%;
	color: #454545;
	line-height : 1.5
}

a {
   color:#134D99;
   text-decoration:none;
}

a:hover {
   color:#134D99;
   text-decoration:underline;
}

h1,h2,h3,h4,h5,h6 { margin-bottom : 12px}

h3 {font-size: 16px; }

section, article {margin-bottom: 12px;}

.container  { 
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: 960px;
}

.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}

.clearfix:before,
.clearfix:after,
.container:before,
.container:after {
  content: '.';
  display: block;
  overflow: hidden;
  visibility: hidden;
  font-size: 0;
  line-height: 0;
  width: 0;
  height: 0;
}

.clearfix:after,
.container:after {
  clear: both;
}

.clearfix,
.container,  {
  zoom: 1;
}

/*box*/

header h1,
.header_navi,
.topi,
.main_l,
.main_r,
.top_column,
.footmenu
 {
  margin-left: 10px;
  margin-right: 10px;
  display: inline;
  float: left;
}

/*角丸*/
.top_column,
.information h3,
.top_column h3,
.top_column,
.banner li,
.submenu,
.submenu h3,
aside.container,
aside.banner,
aside.banner img,
.catch_copy a,
.edi,
.engi,
.inner100,
.face,
#pageTop {
      -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -khtml-border-radius: 4px;
    border-radius: 4px;
}


i {font-weight: normal;}

/* header */

header {padding-top:36px}

header h1 {
  margin-top: -12px;
  margin-bottom: -24px;
  width: 340px;
}
header h1 a {text-decoration: none;}

.jlogo {position: relative;top:-8px;left:8px}
.elogo {position: relative;top:-30px;left:108px;}


.header_navi {  width: 580px; }
.q_menu, .site_menu { text-align: right;}
.q_menu li, 
.site_menu li {
   display: inline;margin-left: 10px;
}

.q_menu {font-size: 12px;margin-bottom: 12px;}
.q_menu li {
   font-size:12px;
   overflow:hidden;
   margin:0;
   padding:0 0 0 15px;
}
.q_menu li a {
   color:#454545;
   outline:none;
}
.q_menu li a:hover {
   color:#0080c0;
   text-decoration:underline;
}
.q_menu li a:before,
.more a:before,
.eqe a:before
 {
   content: "\0025b6";padding-right: 5px;
   color:#0080c0;
}
.q_menu li.enavi a:before {
   content: "\0025b6";padding-right: 5px;
   color:#ff8000;
}

.site_menu {font-size: 14px;}
.site_menu li a {
   font-weight:bold;
   color:#454545;
   outline:none;
}
.site_menu li a:hover {
   color:#454545;
   border-bottom:3px solid #770000;
   padding-bottom: 2px;
   text-decoration:none;
}
/*
.site_menu li.mnavi a:before {
   content: "\0025b6";padding-right: 2px;
   color:#ff8000;
}
*/
.site_menu li.mnavi i {padding-right: 2px;
   color:#0080c0;
}
/*google*/
#cse-search-box {display: inline;} 


/* cover image */
.topimg {
   position: relative;
   max-height: 480px;
   overflow: hidden;
   text-align: center;
   background-color: #efefef;
}
.topimg img.cover{
   max-width: 100%;
   min-width: 960px;
   min-height: 320px;
}



/*100th*/

aside.container {
margin: 20px auto;
background-image: url(../images/catch_back.jpg);
}

/*100周年キャッチ画像*/
.catch_copy {
  position: relative;
   width:530px;   height: 180px;
   float:left;
	margin: 20px 10px;
}

.catch_copy a {
    text-decoration: none;
    display: block;
    padding:14px 0;
    opacity: 0.85;
    filter: alpha(opacity=85);
    -moz-opacity: 0.85;
    -webkit-box-shadow: 0 1px 5px 0 #bbb, inset 0 1px 1px #fff;
    -moz-box-shadow: 0 1px 5px 0 #bbb, inset 0 1px 1px #fff;
    box-shadow: 0 1px 5px 0 #bbb, inset 0 1px 1px #fff;
}
.catch_copy a:hover { position: relative;top:1px }
.catch_copy img {margin:0 10px;}

/*100周年新着*/
.inner100 {
	width:370px;   height: 180px;
	float:left;
	margin: 20px 0 20px 10px;
	font-size: 12px;
	text-align: center;
	background-color:#ffffff;
    box-shadow:#ddd 1px 1px 1px

}
.inner100 noscript h3 {
	padding-top: 30px;
}

/*カウントダウン*/
.inner100 .counter {
	font-size:16pt;
	color:#ff8000;
	text-shadow: #cccccc 1px 1px 3px
}

.eqe {font-weight: bold;margin:5px 0;text-align: left;}

#feed8 ul {text-align: left;}
#feed8 li { margin: 0 2em;}


/*土木とは*/
.topi {
background-color: #ffffff;
width: 320px;
height: 320px;
position: absolute;
top: -330px;
left:-20px;
      -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    -khtml-border-radius: 50%;
    border-radius: 50%;
            opacity: 0.70;
    filter: alpha(opacity=70);
    -moz-opacity: 0.70;
    box-shadow:#ddd 1px 1px 1px

}
.topi h2 {color: #ff8040;font-size: 16px;}
.topi_in {widt:200px;margin:60px}
.topi_in p {margin-bottom: 1em;font-size: 15px;}

/*パンフレットリンクボタン*/

a.pamp  {
  background: #3498db;
  background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
  background-image: -moz-linear-gradient(top, #3498db, #2980b9);
  background-image: -ms-linear-gradient(top, #3498db, #2980b9);
  background-image: -o-linear-gradient(top, #3498db, #2980b9);
  background-image: linear-gradient(to bottom, #3498db, #2980b9);
  -webkit-border-radius: 22;
  -moz-border-radius: 22;
  border-radius: 22px;
  font-family: Arial;
  color: #ffffff;
  font-size: 13px;
  padding: 10px 20px 10px 20px;
  text-decoration: none;
}

a.pamp :hover {
  background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
  background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
  text-decoration: none;
}

/*左右コンテナ*/
.main_l,
.main_r {
  font-size: 15px;
  margin-top: 1em;
}
.main_l {
  width: 620px;
}
.main_r{
  margin-bottom: 10px;
  width: 300px;
}

/*3列コラム*/
.top_column {
  position: relative;
  margin-bottom: 10px;
  width: 300px;
  height:180px;
   background-color: #fffbf8;
 border-bottom: 1px #ffcda1 solid; 
}

.top_column h3 { 
   padding:5px 0 5px 20px ; 
  background-color: #ffe6ca;
 border-top: 1px #ffcda1 solid; 
 	text-shadow: #cccccc 1px 1px 3px;

 /**/
    position: relative;
    margin: 0 0 1.5em;
}

/* 
.top_column h3:before{
    content: "\0025b6";
    font-size: 120%;
    color: #ff6b6e;
    padding-right: 10px;
}
*/
.top_column h3 i{
    font-size: 120%;
    color: #ff6b6e;
    padding-right: 10px;
}
 
/**/

.top_column p,
.top_column ul {
   margin:0 10px;
   font-size: 14px;
}
.top_column li{ 
   margin-left: 1em;
   font-size: 13px;
}

.more {
   position: absolute;
   top:150px;
   left: 180px;
}


/*バナーリンク*/
.banner li { 
  position: relative;
  list-style-type: none;
  display: inline;
  float: left;
  margin-bottom: 10px;
  height:60px;
  width: 300px;
  overflow: hidden;
}
.banner li span {
   font-size: 11px;
   position: relative;
   top:-28px;
   left:120px;
   letter-spacing: -0.5px;
}


.banner li a {
   display: block;
   font-size: 14px; 
   color: #454545;   
   text-shadow: 0 1px 1px #7f7f7f;
   background-repeat: no-repeat ;
   background-position:  5px;
   padding-left:120px;
   height: 58px;
   line-height: 50px;
  border: 1px #cccccc solid;
}

.main_l .banner li a {
   background-color: #f5f5f5;
}
.main_r .banner li a {
   background-color: #f7fbff;
}

.banner li a:hover {
   background-color: #ffffe1;
   color:#134D99;
   text-decoration: none;
}


.lef {
  margin-left: 0;
  margin-right: 10px;
}/*左*/
.rig {
  margin-left: 10px;
  margin-right: 0;
}/*右*/

.committees {background-image: url(../images/ico_com.jpg);}
.publication {background-image: url(../images/ico_pub.jpg);}
.jjournal {background-image: url(../images/ico_jj.jpg);}
.journal {background-image: url(../images/ico_journal.jpg);}
.cpd  {background-image: url(../images/ico_cpd.jpg);}
.branch {background-image: url(../images/ico_branch.jpg);}

.events {background-image: url(../images/ico_events.jpg);}
.library {background-image: url(../images/ico_lib.jpg);}
.day {background-image: url(../images/ico_day.jpg);}
.prize {background-image: url(../images/ico_prize.jpg);}
.heritage {background-image: url(../images/ico_heritage.jpg);}
.dvd {background-image: url(../images/ico_dvd.jpg);}
.jscejp {background-image: url(../images/ico_jp.jpg);}
.zenkoku {background-image: url(../images/h26zenkoku.jpg);}
.edi_banner {background-image: url(../images/ico_edi.jpg);}
.banner li em {font-style: normal;font-size: larger;margin: 0 5px;}

.ico {background-image: url(../images/ico.jpg);}

/*Footer*/
footer {background-color:#5ea9da; margin-top: 24px;}

footer .container{
   background-color: #5ea9da;
   padding-top: 24px;
   padding-bottom: 24px;
   color: #ffffff;
   font-size: 13px;
}

footer a {color: #ffffff;}

.footmenu {  width: 220px; }
.footmenu h4 {margin-bottom: 0;}
.footmenu ul {margin-bottom: 1em;}
.footmenu li {margin-left: 1.5em;}

address {font-style: normal;}
.copy {text-align: left;padding: 24px 0 6px 0;}


/* INFORMATION */

.information {
   width:620px;
}

.information h3 {
   padding:0 10px;
   line-height:2.0;
   font-size:15px;
   font-weight:normal;
   margin:0 0 0.5em 0;
   color:#000;
   border:1px solid #ddd;
   background:#ccc;
   text-shadow: 0 1px 1px #7f7f7f;
}

.information h4{   
    margin-top: 0.5em;
    border-color:#cccccc;
    border-style: solid;
    border-width: 1px 1px 1px 8px;
    
    display:block;   
    padding:3px 0 3px 10px 
} 


.information dl {
   margin:0;
}
.information dt {
   float:left;
   padding-top:5px;
   margin-left: 5px;
}

.information dd {
   margin:0;
   padding:5px 0px 5px 9em;
   background-color:#ffffff
}

.topics dt {width:8.5em;text-align: center;font-size:11px;background-color: #ffc68c;}

dl.maintenance,
dl.topics {
	margin:15px 0;
}
dl.maintenance dt {width:8.5em;text-align: center;
	background-color:#ff8040;color:#ffffff;font-size:11px;letter-spacing: -0.1px;
}

/*news tab*/
#tabs {
height: 410px;

}

ul.tab
{ 
  margin: 0 ;
  padding: 0;
  float: left;
  list-style: none;
  height: 32px;
  border-bottom: 1px solid #c4c4c4;
  border-left: 1px solid #c4c4c4;
  width: 100%;
}

.tab li{
  float: left;
  margin: 0;
  padding: 0;
  height: 31px;
  line-height: 31px;
  border: 1px solid #c4c4c4;
  border-left: none;  
  margin-bottom: -1px;
  position: relative;
   background:#eeeeee;
   font-size: 12px;
		text-shadow:#fff 1px 1px 2px

}
.tab li a{
  text-decoration: none;
  color: #000000;
  display: block;
  padding: 0 20px;
  border: 1px solid #ffffff;
  outline: none;

}
.tab li a:hover
{
  background: #cccccc;
}

.ui-tabs-active a{
    background-color:#ffffff;
    text-decoration:none;
    color:#333;
    cursor:default;
}
.panel{
  border: 1px solid #c4c4c4;
  border-top: none;
  clear: both;
  float: left;
  width: 100%;
  height: 380px;overflow-y: auto;
  background: #ffffff;
}


.nbox {margin: 0.5em 0; font-size: 13px;}

.panel div {margin:1em 0.5em}

/*右トピ*/
aside.banner a:hover {
    opacity: 0.85;
    filter: alpha(opacity=85);
    -moz-opacity: 0.85;
}


/*論説*/
.edi {border: 1px #eee solid;margin-top: 1em;
height: 80px;
background-image: url(../images/edi_back.jpg);}
.edi i,
.engi i {font-size: 15px;margin-right:5px ;}
.edi h3,
.engi h3
 {font-size: 13px;padding:5px 8px 0 8px;margin: 0;letter-spacing: 0.1em;color: #006699;
/*
background-color: #edeff4;
*/
}

#feed_editorial,
#feed_engi 
	 {margin:5px 10px;}
#feed_editorial li,
#feed_engi li
	{ 
	overflow:hidden;font-size:9pt;width:260px;
	text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis; /* Safari */
	-o-text-overflow: ellipsis; /* Opera */
	white-space: nowrap;
}
#feed_editorial li a:before,
#feed_engi li a:before
 {
	content:"\002666";padding-right: 5px;"
}

/*行動*/
.engi {
	border: 1px #eee solid;margin-top: 1em;
	margin-bottom: 10px;
	height: 58px;
	background-image: url(../images/engi_back.jpg);
}


/*facebook*/
.face {
   width:285px;
   padding:5px;
	background-color: #ffffff;
	border:#aed5e8 1px solid ;
}

/*新刊*/
#feed_publication .post {width:154px;height: 260px;float:left;margin-right:10px;padding:8px;box-shadow:#c0c0c0 1px 1px 6px;font-size:0.9em}
#feed_publication .post img {margin:5px 18px}

/* --------PAGRTOP--------= */
#pageTop {
   position:fixed;
   right:0;
   bottom:0;
   padding:10px;
   background:#589fcb
}

#pageTop a {
   padding:0 0 0 12px;
   color:#fff;
   font-size:11px;
}



