@charset "utf-8";
 /* Dafault
-------------------------------------------------- */
* { margin: 0; padding: 0;}
body { background: url(../images/common/header_back.jpg) repeat-x; text-align: center; font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif; line-height: 130%; color: #020202;}
h1, h2, h3, h4 { clear: both;}
img { border: none;}

 /* Common
-------------------------------------------------- */
.clearfix { height: 100%; overflow: hidden;}
.text-center { text-align: center;}
.img-left { float: left; margin-right: 10px; margin-bottom: 10px;}
.img-right { float: right;}
.img-center {text-align: center;}

 /* Layout
-------------------------------------------------- */
div#container { background: url(../images/common/background.jpg) 50% 25px no-repeat;}
div#header { width: 881px; height: 25px; position: relative; margin: 0 auto; background: url(../images/common/header_back.jpg) repeat-x;}

div#top { width: 881px; position: relative; margin: 0 auto 10px; padding-top: 29px; background: url(../images/common/line_top.jpg) 50% 10px no-repeat;}
div#wrapper { background: url(../images/common/back_wrapper.jpg)  0 57px repeat-y; text-align: left;}
div#content { height: 100%; overflow: hidden; padding-bottom: 15px; background: url(../images/common/line_bottom.jpg) bottom no-repeat;}

 /* Header
-------------------------------------------------- */
#header-logo { height: 25px;  position: absolute; top: 0; right: 16px; font-size: 11px; font-weight: normal; line-height: 100%; text-align: right; color: #faea89;}
#header-logo img { margin-left: 1em; vertical-align: middle;}
*:first-child+html #header-logo img { margin-top: -1px;} 

ul#header-navi { padding-top: 2px; padding-left: 12px; height: 23px; list-style: none;}
* html ul#header-navi { height: 25px;}
ul#header-navi li { float: left; height: 25px; padding-right: 15px; font-size: 12px;}
ul#header-navi li a { display: block; padding-left: 23px; background: url(../images/common/navi.jpg) left no-repeat; text-decoration: none; color: #faea89;}
ul#header-navi li a:hover { background: url(../images/common/navi_active.jpg) left no-repeat;}

 /* Footer
-------------------------------------------------- */
div#footer { height: 25px; background: url(../images/common/header_back.jpg) repeat-x;}
div#footer-menu { position: relative; width: 881px; margin: 0 auto;}
div#footer-menu ul { position: absolute; top: 4px; right: 0; list-style: none;}
div#footer-menu li { float: left; padding: 0 10px 0; background: url(../images/common/line_footer_menu.jpg) 0 5px no-repeat; font-size: 11px;}
div#footer-menu li a { text-decoration: none; color: #faea89;}
div#footer-menu li a:hover { text-decoration: underline;}

 /* Top
-------------------------------------------------- */
div#right-content { width: 323px; padding-right: 16px; float: right;}
div#left-content { width: 331px; padding-right: 16px; float: right;}
div#headline { text-align: left;}

div#produce-manage { width: 323px; height: 378px; position: relative; margin-bottom: 13px;}
div#renewal { width: 291px; height: 378px; position: relative; margin-bottom: 13px; padding: 1px 20px; background: url(../images/back_renewal.jpg) no-repeat;}
* html div#renewal { width: 331px;}
div#townpage { clear: both; width:323px;  height: 211px; position: relative; background: url(../images/top/back_townpage.jpg) bottom no-repeat;}
div#performance { width: 331px; height: 208px; position: relative; background: url(../images/top/back_performance.jpg) no-repeat;}

h2.title-banner { float: right;}
h3.contents-title { font-size: 13px;}
p.vertical-writing { float: right; font-size: 13px;}

div#performance h2.title-banner { float: none;}

div#produce-manage h3.contents-title { position: absolute; top: 11em; right: 20px;}
div#renewal h3.contents-title { position: absolute; top: 11em; right: 38px;}
div#townpage h3.contents-title { position: absolute; top: 24px; right: 75px;}

div#produce-manage p.vertical-writing { position: absolute; top: 2px; right: 68px;}
div#renewal p.vertical-writing { position: absolute; top: 2px; right: 138px;}
div#townpage  p.vertical-writing { position: absolute; top: 24px; right: 160px;}

/* 縦書き */
.vertically { display: block; float: right; width: 1em; padding-left: 4px; line-height: 100%; font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ ゴシック',sans-serif;}
* html .vertically { padding-left: 3px;}
/* 読点 (`) */
span.kana-dot { display: block; padding-left: 0.6em;}
* html span.kana-dot { margin-right: -0.6em;}
/* 句点 (゜) */
span.kana-round { display: block; padding-left: 0.7em;}
* html span.kana-round { margin-right: -0.7em;}
/* 捨て仮名 (小さいかな) */
span.kana-lower-case { display: block; margin-top: -1px; padding-left: 0.1em; padding-bottom: 1px;}
* html span.kana-lower-case { margin-right: -0.1em;}
/* 踊り字 (々| ゝ) */
span.kana-special-symbol { display: block;}
/* 小文字 (全角英小文字) */
span.lower-case { display: block;}
span.margin-top { padding-top: 11em;}

p.link-inquiry { position: absolute; bottom: 0; left: 0;}
p.link-more { position: absolute; bottom: 0; right: 0;}
p.icon-townpage { position: absolute; bottom: 10px; left: 28px;}

ul#link-performance { padding-left: 16px; list-style: none;}
ul#link-performance li { float: left; width: 96px; height: 72px; padding: 0 2px 4px;}
* html ul#link-performance li { padding: 0 2px 0;}
ul#link-performance li a img { border: 1px solid #e1be2a ! important;}
ul#link-performance li a:hover img  { border: 1px solid #202020 ! important; }

div#news-headline { width: 161px; height: 159px; margin-left: 16px; margin-bottom: 12px; background: url(../images/top/back_news.jpg) no-repeat; font-size: 11px; line-height: 120%;}
div#news-headline h2.title-banner { float: none;}
div#news-headline dl { padding: 3px 15px;}
div#news-headline dt, div#blog-headline dt { font-size: 10px; color: #7c1200;}
div#news-headline dd, div#blog-headline dd { margin-bottom: 0.5em; font-size: 11px; color: #202020;}

div#blog-headline { width: 161px; margin-left: 16px; margin-bottom: 12px; font-size: 11px; line-height: 120%;}
div#blog-headline h2.title-banner { float: left; padding-right: 5px;}
div#blog-headline dl { margin: 0; padding: 0;}
div#blog-headline dd a { text-decoration: none; color: #202020;}
div#blog-headline dd a:hover { text-decoration: underline;}

div#address { clear: left; width: 166px; height: 290px;  margin-left: 12px; background: url(../images/top/back_address.jpg) no-repeat; font-size: 10px; line-height: 120%;}
div#address ul { margin-left: 3em; margin-bottom: 30px; padding-top: 30px;}
div#address p { margin-left: 1.2em; margin-bottom: 1em; font-size: 10px;}

 /* page
-------------------------------------------------- */
#page-content { float: right; width: 686px; padding-right: 2px;}
#side-menu { width: 169px;}
.contents { height: 100%; overflow: hidden; margin-bottom: 1em; padding-right: 10px;}

#page-title { position: absolute; top: 11px; left: 0px;}
.main-title { margin-bottom: 25px;}
.sub-title { margin-bottom: 1em; padding: 8px 8px 8px 60px; background: url(../images/page/sub_title.jpg) no-repeat; font-weight: normal; font-size: 13px; color: #202020;}

p.text { margin-bottom: 1em; padding: 0 20px 0 10px; font-size: 80%;}
p.image { margin-bottom: 1em;}
p.summary { clear: both; margin: 1.5em 0; padding: 0 10px; font-size: 80%;}
p.list-header { margin-bottom: 0.5em; padding: 0 10px; font-size: 80%;}

ul#breadcrumbs { height: 100%; overflow: hidden; margin-bottom: 5px; list-style: none;}
ul#breadcrumbs li { float: left; font-size: 11px; line-height: 120%;}
ul#breadcrumbs li a { margin-right: 8px; padding-right: 12px; background: url(../images/page/arrow_navigation.jpg) right no-repeat;}
ul#breadcrumbs li.no-link { margin-right: 8px; padding-right: 12px; background: url(../images/page/arrow_navigation.jpg) right no-repeat;}

.content-footer { margin-right: 20px; padding: 2px 0 1.5em; background: url(../images/common/line_dot.jpg) repeat-x;}
p.go-top { background: url(../images/page/arrow_up.jpg) right no-repeat; text-align: right; padding-right: 15px; font-size: 80%;}
p.go-top a { text-decoration: none; color: #020202;}
p.go-top a:hover { text-decoration: underline;}

/* side-menu */
#side-menu { padding-top: 136px; padding-left: 2px;}

ul#local-navigation { margin-bottom: 40px; list-style: none; line-height: 100%;}
ul#local-navigation li { width: 166px; height: 35px; margin-bottom: 10px;}

dl#inquiry-navigation { margin: 0 5px; padding-bottom: 10px; background: url(../images/common/line_dot.jpg) bottom left repeat-x;}
dl#inquiry-navigation-company { margin: 0 5px; padding-bottom: 10px; background: bottom left repeat-x;}
dt.inquiry-title { clear: none; margin: 0 0 15px; padding-top: 10px;  background: url(../images/common/line_dot.jpg) top left repeat-x;}
p.inquiry-text { margin: 0 0 20px; font-size: 75%; line-height: 120%;}

/* website */
dl#integration-flow { margin-bottom: 30px;}

dl#integration-flow dt { clear: left; float: left; width: 122px; height: 35px; padding-top: 24px; text-align: center; font-size: 12px;}
* html dl#integration-flow dt { height: 59px;}

dl#integration-flow dd { height: 35px; padding: 24px 25px 0;  margin-left: 122px; font-size: 12px;}
* html dl#integration-flow dd { height: 59px;}

dt.survey { height: 35px ! important; padding-top: 15px ! important; background: url(../images/website/chart_01_left.jpg) no-repeat;}
* html dt.survey { height: 50px ! important;}
dd.survey { height: 35px ! important; padding-top: 15px ! important; background: url(../images/website/chart_01_right.jpg) no-repeat;}
* html dd.survey { height: 50px ! important;}

dt.planning { background: url(../images/website/chart_02_left.jpg) no-repeat;}
dd.planning { background: url(../images/website/chart_02_right.jpg) no-repeat;}

dt.projecting { background: url(../images/website/chart_03_left.jpg) no-repeat;}
dd.projecting { background: url(../images/website/chart_03_right.jpg) no-repeat;}

dt.designing { background: url(../images/website/chart_04_left.jpg) no-repeat;}
dd.designing { background: url(../images/website/chart_04_right.jpg) no-repeat;}

dt.building { background: url(../images/website/chart_05_left.jpg) no-repeat;}
dd.building { background: url(../images/website/chart_05_right.jpg) no-repeat;}

dt.promotion { background: url(../images/website/chart_06_left.jpg) no-repeat;}
dd.promotion { background: url(../images/website/chart_06_right.jpg) no-repeat;}

dt.operation { background: url(../images/website/chart_07_left.jpg) no-repeat;}
dd.operation { background: url(../images/website/chart_07_right.jpg) no-repeat;}

/* case_study */
div.case-study { width: 643px; height: 100%; overflow: hidden; margin-bottom: 36px; position: relative; padding: 8px 9px; border-top: #cfc070 solid 1px; border-bottom: #cfc070 solid 1px; background: url(../images/website/back_case_study.jpg) repeat-y;}
* html div.case-study { width: 661px;}
 
ul.case-study-summary { float: right; width: 437px; position: absolute; top: 12px; bottom: 8px; right: 9px; list-style: none; font-size: 12px;}

ul.case-study-summary li.works { margin-bottom: 0.5em; padding: 0 5px;}
ul.case-study-summary li.url { margin-bottom: 0.5em; padding: 0 5px;}
ul.case-study-summary li.summary { padding: 10px; background: url(../images/website/summary_case_study.jpg) repeat-y;}

/* townpage */

/* company */
dl#company { height: 100%; overflow: hidden; margin-bottom: 1.5em; padding: 0 10px; font-size: 80%;}
dl#company dt { clear: left; float: left; margin-bottom: 0.5em;}
dl#company dd { padding-left: 8em; margin-bottom: 0.5em;}

dl#company dd ol { margin-left: 1.5em;}
dl#company dd ol li {} 

dl#address { margin-bottom: 1.5em; padding: 0 10px; font-size: 80%;}
dl#address dt { margin-bottom: 1em; font-weight: bold;}

/* site */
dl#sitemap { margin-bottom: 1.5em; padding: 0 10px; font-size: 80%;}
dl#sitemap dt { margin-bottom: 0.5em;}
dl#sitemap dd { margin-bottom: 0.5em; padding-left: 1.5em;}

ul.usage { margin-left: 1.5em; margin-bottom: 1.5em; padding: 0 10px; font-size: 80%;}

dl.usage { margin-bottom: 1em; padding: 0 10px; font-size: 80%;}
dl.usage dd { margin-left: 1em;}
dl.usage dd ul { margin-left: 0.5em;}

ol.privacy { margin-left: 1.5em; margin-bottom: 1.5em; padding: 0 10px; font-size: 80%;}

/* access */
dl#access { height: 100%; overflow: hidden; margin-bottom: 1.5em; padding: 0 10px; font-size: 80%;}
dl#access dt { clear: left; float: left; margin-bottom: 0.5em;}
dl#access dd { padding-left: 6.5em; margin-bottom: 0.5em;}