@charset "utf-8";
/*/////////////////////////////////////////////////////////
 name:           alternate.css
 description:    properties for alternate page
///////////////////////////////////////////////////////// */

/* GLOBAL RESET
============================================================*/
h1, h2, h3, h4, h5, h6 { 
margin: 0px;
padding: 0px;
font-size: 1em;
font-weight: normal;
line-height: 1;
}

ul, ol, li, dl, dt, dd  {
margin: 0px;
padding: 0px;
list-style: none;
}

form, fieldset, input, textarea, select, option, label {
margin: 0px;
padding: 0px;
}

fieldset, a img {
border: 0;
}

table{
border-collapse: collapse;
border-spacing: 0;
}

table, th, td, th {
margin: 0px;
padding: 0px;
font-weight: normal;
}

pre, address, blockquote, caption, cite, code {
margin: 0px;
padding: 0px;
font-weight: normal;
font-style: normal;
}


/* COMMON
============================================================*/
html { overflow: auto;}

body {
margin: 0px;
padding: 0px;
text-align: center;
font-size: 84%;
color: #666666;
background: #EEEEEE url(../img/bg_body.jpg) repeat-x top left;
}

hr, .nodisp{ display: none;}
.clear { clear: both;}
.bdr { border: 1px solid #CCCCCC;}

a, a:link, a:active, a:visited {
color: #666666;
text-decoration: underline;
background-color: #FFFFFF;
}
a:hover{
color: #666666;
text-decoration: none;
background-color: #FFFFFF;
}



/* CONTAINERS
============================================================*/
#container {
width: 750px;
margin: 0px auto;
text-align: left;
background: url(../img/bg_container.gif) repeat-y top left;
}

/* HEADER
============================================================*/
#header {
display: block;
width: 680px;
margin-left: 35px;
padding-top: 30px;
}
#header h1 {
margin: 0px 0px 30px 0px;
float: left;
}

#header .linkEnglish {
margin: 0px;
float: right;
}


/* CONTENT
============================================================*/
#content {
line-height: 1.5;
margin: 0px 35px;
clear: both;
}

.externalLink {
margin: 0px;
font-size: 90%;
}
.externalLink a {
background: url(../img/ico_external_link.gif) no-repeat 3px 0.4em;
padding: 1px 3px 1px 15px;
text-decoration: none;
}
.externalLink a:hover {
background: #323232 url(../img/ico_external_link_on.gif) no-repeat 3px 0.4em;
text-decoration: none;
color: #FFFFFF;
}


.pagetop {
width: 680px;
height: 29px;
border-bottom: 1px solid #EAEAEA;
clear: both;
}
.pagetop a {
display: block;
width: 142px;
height: 23px;
background: url(../img/btn_pagetop.gif) no-repeat top left;
text-indent: -9999px;
float: right;
overflow: hidden;
}
.pagetop a:hover {
background: url(../img/btn_pagetop_on.gif) no-repeat top left;
}

#content h2 {
display: block;
width: 680px;
height: 25px;
text-decoration: none;
text-indent: -9999px;
}


/* PLUGIN MESSAGE
============================================================*/
#pluginMessageArea {
width: 638px;
padding: 10px 20px;
border: 2px solid #CCCCCC;
text-align: center;
/*margin-bottom: 40px;*/
margin-bottom: 20px;
}


/* NEWS
============================================================*/
#newsArea {
margin-bottom: 40px;
}
#newsArea h2 {
background: url(../img/title_news.gif) no-repeat top left;
margin-bottom: 10px;
}

#newsArea .newsBlock {
border-bottom: 1px solid #EAEAEA;
margin-bottom: 10px;
padding-bottom: 10px;
}
#newsArea .newsBlock .leftBlock {
width: 120px;
float: left;
padding: 8px 0px;
}
#newsArea .newsBlock .rightBlock {
width: 535px;
margin-left: 120px;
padding: 8px 0px 8px 25px;
border-left: 1px solid #EAEAEA;
}
*+html #newsArea .newsBlock .rightBlock { margin-top: -2.15em;}
* html #newsArea .newsBlock .rightBlock { margin-top: -2.15em;}

#newsArea .newsBlock .title {
font-weight: bold;
margin-bottom: 10px;
}
#newsArea .newsBlock .body {
margin: 0px;
}
#newsArea .newsBlock .externalLink {
margin-top: 20px;
}

#newsArea .pagetop {
margin-top: -2px;
}



/* PORTFOLIO
============================================================*/
#portfolioArea {
margin-bottom: 40px;
clear: both;
}

#content #portfolioArea h2 {
background:#FFFFFF url(../img/title_portfolio.gif) no-repeat top left;
margin-bottom: 18px;
}

#portfolioArea .portfolioBlock {
display: table;
width: 680px;
border-bottom: 1px solid #EAEAEA;
margin-bottom: 18px;
padding-bottom: 18px;
}
#portfolioArea .portfolioBlock .leftBlock {
width: 269px;
float: left;
}

#portfolioArea .portfolioBlock .rightBlock {
width: 391px;
margin-left: 289px;
}
* html #portfolioArea .portfolioBlock .rightBlock { margin-top: -202px;}

#portfolioArea .portfolioBlock .image {
margin: 0px;
/*background-color: #000000;*/
border: 1px solid #EAEAEA;
}
/*
#portfolioArea .portfolioBlock .image img {
}
#portfolioArea .portfolioBlock .image a:hover img {
opacity:0.6;
filter:alpha(opacity=60);
-moz-opacity:0.6;
}
*/

#portfolioArea .portfolioBlock .title {
font-weight: bold;
margin-bottom: 5px;
}
#portfolioArea .portfolioBlock .client {
margin-bottom: 20px;
}
#portfolioArea .portfolioBlock .body {
margin: 0px 0px 5px 0px;
}
#portfolioArea .portfolioBlock .externalLink {
margin-bottom: 5px;
}
#portfolioArea .portfolioBlock .staff {
font-size: 90%;
margin: 0px 0px 20px 0px;
}
#portfolioArea .portfolioBlock .date {
text-align: right;
font-size: 90%;
margin: 0px;
}

#portfolioArea .pagetop {
margin-top: -12px;
}


/* NEWS
============================================================*/
#projectArea {
margin-bottom: 40px;
}
#projectArea h2 {
background: url(../img/title_project.gif) no-repeat top left;
margin-bottom: 10px;
}

/* ABOUT US
============================================================*/
#aboutArea {
margin-bottom: 40px;
clear: both;
}
#aboutArea h2 {
background: url(../img/title_about_us.gif) no-repeat top left;
margin-bottom: 18px;
}

#aboutArea .intro {
margin: 0px 0px 25px 0px;
}
#aboutArea dl {
border-bottom: 1px solid #EAEAEA;
margin-bottom: 10px;
padding-bottom: 10px;
}
#aboutArea dl dt {
width: 200px;
float: left;
}
#aboutArea dl dd {
width: 455px;
margin-left: 200px;
padding: 0px 0px 0px 25px;
border-left: 1px solid #EAEAEA;
}
*+html #aboutArea .aboutBlock dd { margin-top: -1.55em;}
* html #aboutArea .aboutBlock dd { margin-top: -1.55em;}

#aboutArea .pagetop {
margin-top: -2px;
}


/* ACCESS MAP
============================================================*/
#accessMapArea {
clear: both;
}
#accessMapArea h2 {
background: url(../img/title_access_map.gif) no-repeat top left;
margin-bottom: 18px;
}
#accessMapArea .text {
margin: 0px 0px 20px 0px;
}
#accessMapArea .text span  {
display: block;
margin-bottom: 10px;
}
#accessMapArea .map {
margin: 0px 0px 10px 0px;
}
#accessMapArea .map img {
border: 1px solid #EAEAEA;
}
#accessMapArea .btnPdf {
float: left;
margin: 0px;
}
#accessMapArea .qrCode {
width: 74px;
margin: 0px 0px 0px 497px;
}

#accessMapArea .pagetop {
height: 39px;
margin-top: 40px;
border-top: 1px solid #EAEAEA;
border-bottom: none;
}
#accessMapArea .pagetop a {
margin: 8px 0px 0px 0px;
}


/* FOOTER
============================================================*/
#footer {
height: 100px;
margin: 0px 35px;
border-top: 1px solid #EAEAEA;
}
#footer address {
display: block;
width: 164px;
height: 8px;
background: url(../img/copyright.gif) no-repeat top left;
text-indent: -9999px;
margin-top: 10px;
float: right;
}
#footer img {
margin-top: 10px;
}

/* ENGLISH
============================================================*/
#containerE {
width: 750px;
margin: 0px auto;
text-align: left;
background: url(../img/bg_container.gif) repeat-y top left;
}

#containerE .pagetop a {
width: 100px;
background: url(../img/btn_pagetop_e.gif) no-repeat top left;
}
#containerE .pagetop a:hover {
background: url(../img/btn_pagetop_e_on.gif) no-repeat top left;
}
#containerE #newsArea h2 {
background: url(../img/title_news_e.gif) no-repeat top left;
}
#containerE #portfolioArea h2 {
background: url(../img/title_portfolio_e.gif) no-repeat top left;
}
#containerE #aboutArea h2 {
background: url(../img/title_about_us_e.gif) no-repeat top left;
}
#containerE #accessMapArea h2 {
background: url(../img/title_access_map_e.gif) no-repeat top left;
}
#containerE #accessMapArea .btnPdf {
margin-bottom: 40px;
}

/* BLOG RANKING
============================================================*/
div.blogRanking {
width: 638px;
font-size: 80%;
padding: 10px 20px;
border: 2px solid #CCCCCC;
text-align: center;
margin-bottom: 40px;
}