@charset "UTF-8";
/* CSS Document */

/*-------------------------------------------

name: index.css（TOPページ）

-------------------------------------------*/

/*===================================
	nav
====================================*/
nav #gNav li#n01 a{ background:#cdeccd;}


/*--------------------------------------
	mvTop
---------------------------------------*/
#mvTop{ height:510px; margin:0 0 20px;}
.bxslider li{ height:510px;}
.bxslider li#mv01{ background:url(../../img/mv/mv_top01.jpg) center no-repeat;}
.bxslider li#mv02{ background:url(../../img/mv/mv_top02.jpg) center no-repeat;}
.bxslider li#mv03{ background:url(../../img/mv/mv_top03.jpg) center no-repeat;}




/*--------------------------------------
	施工事例
---------------------------------------*/
#works{ background:#fcf8e8; padding:40px 0;}
#works  h2{ text-align:center; margin:0 0 20px; color:#000; font-size:22px;}
#works  h2 span.en{ display:block; font-family: 'Roboto Slab', serif; font-weight:400; font-size:16px;}
#works ul{ width:990px; margin:0 auto; overflow:hidden;}
#works ul li{ float:left; width:300px; margin:0 15px; text-align:center; position:relative;}
#works ul li:after{ content:"WORKS"; font-family: 'Roboto Slab', serif; display:block; position:absolute; top:2px; right:2px; padding:8px 10px; background:#9ecf9e; color:#fff; line-height:100%;}
#works ul li div{ border:2px solid #000;}
#works ul li .ph{ height:225px; overflow:hidden; text-align:center;}
#works ul li .ph img{ height:100%; max-width:auto; display:inline;}
#works ul li h3{ font-size:15px; color:#000; line-height:140%; letter-spacing:-0.01em; padding:15px 0 0;}
#works ul li a{ position:absolute; display:block; top:0; left:0; width:100%; height:100%;}
#works ul li:hover img{ opacity:0.8;}
#works ul li:hover h3{ text-decoration:underline;}
/*btn*/
#works .moreBtn{ width:330px; margin:20px auto 0;}
#works .moreBtn a{ display:block; background:#9ecf9e; color:#fff; text-align:center; padding:14px 0; line-height:100%; position:relative;}
#works .moreBtn a::before,
#works .moreBtn a::after{ position:absolute; top:0; bottom:0; right:10px; margin:auto; content:"";}
#works .moreBtn a::before{ width: 12px; height: 12px; background:#fff; -webkit-border-radius: 50%; border-radius: 50%;}
#works .moreBtn a::after{ right:10px; box-sizing:border-box; width:4px; height:4px; border:3px solid transparent; border-left:4px solid #9ecf9e;}
#works .moreBtn a:hover{ text-decoration:none; opacity:0.8;}




/*--------------------------------------
	containerTop
---------------------------------------*/
#containerTop{ width:1000px; margin:0 auto; padding:40px 0 100px; overflow:hidden;}
#containerTop #leftArea{ float:left; width:610px;}
#containerTop #rightArea{ float:right; width:350px;}


/*--------------------------------------
	お知らせ
---------------------------------------*/
#newsArea{}
#newsArea h2{ background:url(../../img/news_line.gif) bottom no-repeat; padding:0 0 15px; color:#000;}
#newsArea h2 span{ font-family: 'Roboto Slab', serif; font-weight:400; font-size:24px; margin:0 8px 0 0;}
#newsArea .newsBlock{ padding:20px 0;}
#newsArea .newsBlock dl{ line-height:140%; padding:10px 0;}
#newsArea .newsBlock dl dt{ width:120px; float:left; color:#333; font-weight:bold;}
#newsArea .newsBlock dl dd{ margin:0 0 0 120px;}
#newsArea .newsBlock dl dd a{ text-decoration:underline;}
#newsArea .newsBlock dl dd a:hover{ text-decoration:none;}
/*アイコン*/
/*#newsArea .newsBlock dl dt span{ display:inline-block; width:70px; margin-left:10px; padding:4px 0; text-align:center; color:#fff; line-height:100%; font-size:12px; border-radius:2px;}
#newsArea .newsBlock dl dt span.icon01{ background:#fdad6d;}
#newsArea .newsBlock dl dt span.icon02{ background:#9ecf9e;}
#newsArea .newsBlock dl dt span.icon03{ background:#f79fb6;}
#newsArea .newsBlock dl dt span.icon04{ background:#9eb2ee;}*/

/*btn*/
#newsArea .moreBtn{ width:200px; margin:0 auto;}
#newsArea .moreBtn a{ display:block; color:#333; border:1px solid #ccc; text-align:center; padding:10px 0; line-height:100%; position:relative;}
#newsArea .moreBtn a::before,
#newsArea .moreBtn a::after{ position:absolute; top:0; bottom:0; right:10px; margin:auto; content:"";}
#newsArea .moreBtn a::before{ width: 12px; height: 12px; background:#333; -webkit-border-radius: 50%; border-radius: 50%;}
#newsArea .moreBtn a::after{ right:10px; box-sizing:border-box; width:4px; height:4px; border:3px solid transparent; border-left:4px solid #fff;}
#newsArea .moreBtn a:hover{ text-decoration:none; background:#f8f8f8;}


/*--------------------------------------
	お問い合わせバナー
---------------------------------------*/
#contact ul{}




/*--------------------------------------
	採用関連バナー
---------------------------------------*/
#ft_Bnr ul{ text-align:center; padding:50px 0;}
#ft_Bnr ul li{ display:inline; margin:0 1px;}