@charset "utf-8";

/* ===================================================================
CSS information

 File Name  : main.css
 Author     : SeeVisions
 Style Info : PC用レイアウトと各コンテンツスタイル
=================================================================== */

/* -----------------------------------------------
 container
-------------------------------------------------- */

#container {
	min-width: 980px;
	background: #FFF;
}

/* -----------------------------------------------
 header
-------------------------------------------------- */

.index div#header {
	margin-bottom:0;
}

div#header {
	clear: both;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	margin-bottom:60px;
	min-width: 960px;
	width: 100%;
	height: 190px;
	background:url(../images/bcg_header.png) repeat-x center top;
	-moz-box-shadow: 0px 0px 3px #000;
	-webkit-box-shadow: 0px 0px 3px #000;
	box-shadow: 0px 0px 3px #000;
	z-index:5;
}

div#header div.wrapper {
	margin: 0 auto;
	width: 960px;
	position: relative;
}

div#header h1 {
	padding-top:10px;
	margin-bottom:10px;
	font-weight:normal;
}

div#header p#logo {
	width: 230px;
	height: 60px;
}

div#header div#hdNav {
	padding-top:10px;
	position:absolute;
	top:0;
	right:200px;
	width: 200px;
	height: 20px;
}

div#header div#hdNav ul li{
	float:left;
	margin-right:15px;
	font-size:80%;
}

div#header div#hdNav ul li a{
	padding-left:20px;
	background:url(../images/ico_arrow.png) no-repeat center left;
}

div#header div#hdNav ul li.home a{
	background:url(../images/ico_home.png) no-repeat center left;
}

div#header div#hdNav ul li.last-child{
	margin-right:0px;
}

div#header #hdFontChange {
	width: 190px;
	height: 40px;
	position: absolute;
	top: 5px;
	right: 0px;
	background: url(../images/bcg_hdFontChange.png) no-repeat top center;
}

div#header #hdFontChange ul{
	padding-left:100px;
}

div#header #hdFontChange li{
	height: 30px;
	float:left;
	cursor:pointer;
}

div#header #hdTel {
	width: 290px;
	height: 40px;
	position: absolute;
	top: 60px;
	right: 180px;
}

div#header #hdContact {
	width: 160px;
	height: 40px;
	position: absolute;
	top: 60px;
	right: 0px;
}

/* -----------------------------------------------
 global
-------------------------------------------------- */

div#global {
	position: absolute;
	clear: both;
	margin: 0 auto;
	top: 135px;
	right: 0px;
	width: 960px;
	height: 55px;
}

div#global ul {
	float: right;
	width: 960px;
}

div#global ul li {
	float: left;
}

div#global ul li.last-child {
	margin-right:0px;
	padding-right:0px;
	border-right:0px;
}

/* -----------------------------------------------
 mainImage
-------------------------------------------------- */

div#mainImage {
	margin: 0 auto;
	position:relative;
	margin-bottom:20px;
}

div#mainImage .mainImageCopy {
	margin: 0 auto;
	width: 960px;
	position: relative;
}

div#mainImage .mainImageCopy p{
	position:absolute;
	top:140px;
	left:0px;
	width:464px;
	height:106px;
	z-index:100;
	margin-left: -231px;
	left: 50%;
}

div#mainImage #image-bloc {
  height: 410px;
}
 
div#mainImage .slider {
  list-style: none;
  margin: 0;
  padding: 0;
}
 
div#mainImage .slider li {
  width: 960px!important;
  margin: 0;
  padding: 0;
}

/* -----------------------------------------------
 content
-------------------------------------------------- */

div#content {
	clear: both;
	padding-bottom: 50px;
	position: relative;
}

.index div#content div.wrapper {
	width: 920px;
}

div#content div.wrapper {
	clear: both;
	margin-left: auto;
	margin-right: auto;
	width: 960px;
	height: auto;
}

div#content .section {
	position: relative;
	clear: both;
	overflow: hidden;
	margin-bottom: 30px;
}

div#content .section h2.ttl01 {
	border-bottom:1px solid #C95361;
	margin-bottom:30px;
	padding-top:15px;
	padding-bottom:15px;
	padding-left:25px;
	font-size:140%;
	font-weight:normal;
	background: url(../images/bcg_ttl_h2.png) no-repeat center left;
}

div#content .section h3.ttl01 {
	margin-bottom:30px;
	padding-top:15px;
	padding-bottom:15px;
	padding-left:25px;
	font-size:120%;
	font-weight:bold;
	background: url(../images/bcg_dot_x.png) repeat-x bottom;
	color:#C95361;
}

div#content .section h2.ttl_f2 {
	font-size: 130%;
	padding-top:5px;
	padding-bottom:5px;
	padding-left:15px;
	border-left:8px solid #402100;
	background:url(../images/bcg_f2_ttl.png) repeat-x left;
	margin-bottom: 30px;
}

/* -----------------------------------------------
 mainBox
-------------------------------------------------- */

.index div#mainBox {
	width: 600px;
	float: left;
}

div#mainBox {
	position: relative;
	width: 690px;
	float: right;
}

div#mainBox .section {
	position: relative;
	clear: both;
	overflow: hidden;
	margin-bottom: 30px;
}

div#mainBox .section .section{
	position: relative;
	clear: both;
	overflow: hidden;
	margin-bottom: 30px;
}

div#mainBox .section h2.ttl {
	margin-bottom: 30px;
}

div#mainBox .section p {
	margin-bottom: 1em;
}

/* breadcrumb */
#breadcrumb {
	margin-bottom: 20px;
}

#breadcrumb ul {
	overflow: hidden;
}

#breadcrumb ul li {
	float: left;
	padding-left: 20px;
	margin-right: 10px;
	background: url(../images/ico_breadclumbList.png) left center no-repeat;
	font-size: 80%;
}

#breadcrumb ul li#home {
	padding-left: 20px;
	background: url(../images/ico_home.png) left center no-repeat;
}

/* -----------------------------------------------
 index
-------------------------------------------------- */

/* topConcept */
div#topConcept {
	clear: both;
	width:920px;
	margin-bottom: 30px;
	overflow: hidden;
	position:relative;
	height:260px;
	background:url(../images/bcg_top_concept.png) no-repeat top center;
}

div#topConcept h2{
	text-align:center;
	margin-top:30px;
	margin-bottom:30px;
	font-size:130%;
}

div#topConcept p{
	text-align:center;
}

/* topMenuList */
div#topMenuList {
	clear: both;
	margin-bottom: 80px;
	overflow: hidden;
	position:relative;
}

div#topMenuList h2.ttl {
	margin-bottom: 30px;
}

div#topMenuList p.moreBtn {
	position:absolute;
	top:0;
	left:200px;
}

div#topMenuList li {
	float:left;
	background-color:#FFF;
}

.effect6
{
    position:relative;
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.effect6:before, .effect6:after
{
    content:"";
    position:absolute;
    z-index:-1;
    -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:50%;
    bottom:0;
    left:10px;
    right:10px;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
}
.effect6:after
{
    right:10px;
    left:auto;
    -webkit-transform:skew(8deg) rotate(3deg);
       -moz-transform:skew(8deg) rotate(3deg);
        -ms-transform:skew(8deg) rotate(3deg);
         -o-transform:skew(8deg) rotate(3deg);
            transform:skew(8deg) rotate(3deg);
}

/* topNews */
.index div#topNews {
	clear: both;
	overflow: hidden;
	width: 600px;
	position:relative;
}

.index div#topNews p.moreBtn a{
	position:absolute;
	top:8px;
	right:0px;
	padding-left:20px;
	background:url(../images/ico_arrow_02.png) no-repeat center left;
	font-size:80%;
}

.index div#topNews p.moreBtn a:hover{
	background:url(../images/ico_arrow_02_on.png) no-repeat center left;
}

.index div#topNews li {
	overflow: hidden;
	margin-bottom: 15px;
	padding-bottom: 0px;
	background:url(../images/bcg_dot-x.png) repeat-x bottom;
}

.index div#topNews li.last-child {
	overflow: hidden;
	margin-bottom: 0;
	padding-bottom: 0;
	border-bottom: 0px;
	background:none;
}

.index div#topNews div.post {
	width: 600px;
	overflow: hidden;
}

.index div#topNews div.post p.pict {
	float: left;
	margin-right:15px;
	margin-bottom: 15px;
	background-color:#FFF;
	padding:3px;
	border:1px solid #42210B;
}

.index div#topNews div.post p.category {
	float:left;
	color:#FFF;
	padding:0 5px;
	margin-right:10px;
	margin-bottom:0px;
	background:#1B5B38;
	border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	-ms-border-radius: 5px 5px 5px 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	-o-border-radius: 5px 5px 5px 5px;
	behavior: url("PIE.htc");
}

.index div#topNews div.post p.date {
	margin-bottom: 10px;
	color:#42210B;
	font-size:100%;
}

.index div#topNews div.post p.ttl {
	margin-bottom: 10px;
	font-size:120%;
}

/* topWorks */
.index div#topWorks {
	clear: both;
	overflow: hidden;
	position:relative;
}

.index div#topWorks h2{
	margin-bottom:30px;
}

.index div#topWorks li{
	float:left;
	margin-right:20px;
}

.index div#topWorks li img{
	border:4px solid #402100;
}

.index div#topWorks li.last-child{
	margin-right:0px;
}

.index div#topWorks p.moreBtn a{
	position:absolute;
	top:8px;
	right:0px;
	padding-left:20px;
	background:url(../images/ico_arrow_02.png) no-repeat center left;
	font-size:80%;
}

.index div#topWorks p.moreBtn a:hover{
	background:url(../images/ico_arrow_02_on.png) no-repeat center left;
}

/* -----------------------------------------------
 news
-------------------------------------------------- */

.news div#mainBox div.post {
	width: 690px;
	overflow:hidden;
	clear: both;
	margin-bottom:30px;
	background:url(../images/bcg_dot-x.png) repeat-x bottom;
}

.news div#mainBox div.post li.last-child{
	border-bottom:0px;
	margin-bottom:0px;
}

.news div#mainBox div.post h2.ttl {
	font-size: 130%;
	padding-top:5px;
	padding-bottom:5px;
	padding-left:15px;
	border-left:8px solid #402100;
	background:url(../images/bcg_f2_ttl.png) no-repeat center top;
}

.news div#mainBox div.post ul.meta {
	float: right;
	margin-bottom: 20px;
}

.news div#mainBox div.post ul.meta li {
	float: left;
	font-size: 80%;
	margin-right: 15px;
	padding-right: 15px;
	border-right: 1px solid #42210B;
}

.news div#mainBox div.post ul.meta li.last-child {
	margin-right: 0px;
	padding-right: 0px;
	border-right: 0px;
}

.news div#mainBox div.post p.date {
	font-size: 80%;
	margin-bottom: 10px;
	text-align:right;
}

.news div#mainBox div.post p.pict {
	float: left;
	margin-right:30px;
	margin-bottom: 30px;
	background-color:#FFF;
	padding:3px;
	border:1px solid #736357;
	border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	-ms-border-radius: 5px 5px 5px 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	-o-border-radius: 5px 5px 5px 5px;
	behavior: url("PIE.htc");
}

.news div#mainBox div.post div.exp {
	clear: both;
	margin-bottom: 20px;
}

.news div#mainBox div.post div.exp p {
	margin-bottom: 1em;
}

.news div#mainBox div.post p.moreBtn{
	float:right;
}

/* pageNav */
.pageNav {
	margin-bottom: 30px;
	padding: 10px 10px 5px;
	text-align: center;
}

.pageNav li {
	display: inline;
	margin: 0 2px;
	padding: 0;
}

.pageNav li span {
	display: inline-block;
	margin-bottom: 5px;
	padding: 1px 8px;
	background: #42210B;
	border: 1px solid #42210B;
	color: #FFF;
	text-decoration: none;
	vertical-align: middle;
}

.pageNav li a {
	display: inline-block;
	margin-bottom: 5px;
	padding: 1px 8px;
	background: #fff;
	border: 1px solid #42210B;
	text-decoration: none;
	vertical-align: middle;
}

.pageNav li a:hover {
	background: #42210B;
	color: #FFF;
}

/* -----------------------------------------------
 company
-------------------------------------------------- */

.company .listTable {
	overflow: hidden;
	background: url(../images/bcg_listTable.png) repeat-y left;
}

.company .listTable li {
	padding:0px 0;
	clear:both;
	zoom:100%;
	overflow: hidden;
	background:url(../images/bcg_dot-x.png) repeat-x bottom;
}

.company .listTable li.last-child {
	background:none;
}

.company .listTable dt {
	float: left;
	width: 120px;
	padding-left:20px;
	padding-top: 8px;
	padding-bottom:8px;
	font-weight: normal;
}

.company .listTable dd {
	float:left;
	width:530px;
	padding-left:20px;
	padding-top: 8px;
	padding-bottom:8px;
	background:url(../images/bcg_dot_y.png) repeat-y;
}

.company #access .leftBox{
	width:210px;
	float:left;
}

.company #access .rightBox{
	width:450px;
	float:right;
}

.company .section #gmap{
	width:448px;
	height:448px;
	border:1px solid #CCC;
}

/* -----------------------------------------------
 works
-------------------------------------------------- */

.works #worksList{
	clear:both;
	overflow:hidden;
	padding-top:50px;
}

.works #worksList li{
	float:left;
	margin-right:36px;
	margin-bottom:36px;
}

.works #worksList li.nth-child-4n{
	margin-right:0px;
}

.works #worksList li img{
	border:3px solid #402100;
}

.works #worksList li p.pict{
	margin-bottom:20px;
}

.works #worksList li p.ttl{
	margin-bottom:5px;
	text-align:center;
	font-size:80%;
}

.works #worksList li p.name{
	margin-bottom:0px;
	text-align:center;
	font-size:80%;
	color:#999999;
}

/* worksArea */

#worksArea{
	clear:both;
}

#worksArea .leftBox{
	float:left;
	width:620px;
}

#worksArea .leftBox img{
	border:3px solid #402100;
}

#worksArea .rightBox{
	float:right;
	width:300px;
}

#worksArea .rightBox p{
	margin-bottom:1em;
}

#worksArea #subImageBox li{
	float:left;
	margin-right:15px;
	margin-bottom:15px;
}

#worksArea #subImageBox li.nth-child-5n{
	margin-right:0px;
}

#worksArea #subImageBox li img{
	border:3px solid #402100;
}

#worksArea #worksBack{
	width:180px;
	left:50%;
	margin-left:-90px;
}

#worksArea  ul.meta {
	float: right;
}

#worksArea  ul.meta li {
	float: left;
	font-size: 80%;
	margin-right: 15px;
	padding-right: 15px;
	border-right: 1px solid #42210B;
}

#worksArea  ul.meta li.last-child {
	margin-right: 0px;
	padding-right: 0px;
	border-right: 0px;
}

/* -----------------------------------------------
 voice
-------------------------------------------------- */

.voice .voiceBox{
	clear:both;
	overflow:hidden;
	margin-bottom:20px;
	border:1px solid #42210B;
	padding:15px;
}

.voice .voiceBox h3.ttl{
	border-bottom:3px solid #42210B;
	margin-bottom:20px;
	padding-bottom:5px;
	padding-left:20px;
	background:url(../images/ico_voice.png) no-repeat center left;
}

/* -----------------------------------------------
 flow
-------------------------------------------------- */

.flow .flowBox{
	clear:both;
	overflow:hidden;
	margin-bottom:30px;
}

.flow #flowList li{
	background:url(../images/ico_flowArrow.png) no-repeat left bottom;
}

.flow #flowList li.last-child{
	background:none;
}

.flow #flowList h3{
	height:50px;
	margin-bottom:10px;
	padding-top:10px;
	padding-left:60px;
	font-size:130%;
}

.flow #flow01 h3{	background:url(../images/flow_step_01.png) no-repeat top left;}
.flow #flow02 h3{	background:url(../images/flow_step_02.png) no-repeat top left;}
.flow #flow03 h3{	background:url(../images/flow_step_03.png) no-repeat top left;}
.flow #flow04 h3{	background:url(../images/flow_step_04.png) no-repeat top left;}
.flow #flow05 h3{	background:url(../images/flow_step_05.png) no-repeat top left;}
.flow #flow06 h3{	background:url(../images/flow_step_06.png) no-repeat top left;}
.flow #flow07 h3{	background:url(../images/flow_step_07.png) no-repeat top left;}
.flow #flow08 h3{	background:url(../images/flow_step_08.png) no-repeat top left;}
.flow #flow09 h3{	background:url(../images/flow_step_09.png) no-repeat top left;}
.flow #flow10 h3{	background:url(../images/flow_step_10.png) no-repeat top left;}
.flow #flow11 h3{	background:url(../images/flow_step_11.png) no-repeat top left;}
.flow #flow12 h3{	background:url(../images/flow_step_12.png) no-repeat top left;}
.flow #flow13 h3{	background:url(../images/flow_step_13.png) no-repeat top left;}
.flow #flow14 h3{	background:url(../images/flow_step_14.png) no-repeat top left;}
.flow #flow15 h3{	background:url(../images/flow_step_15.png) no-repeat top left;}
.flow #flow16 h3{	background:url(../images/flow_step_16.png) no-repeat top left;}
.flow #flow17 h3{	background:url(../images/flow_step_17.png) no-repeat top left;}
.flow #flow18 h3{	background:url(../images/flow_step_18.png) no-repeat top left;}
.flow #flow19 h3{	background:url(../images/flow_step_19.png) no-repeat top left;}
.flow #flow20 h3{	background:url(../images/flow_step_20.png) no-repeat top left;}

/* -----------------------------------------------
 contact
-------------------------------------------------- */

.contact #contactImage{
	padding-top:70px;
}

.contact #contactImage h3{
	font-size:120%;
	margin-bottom:5px;
}

.contact .mailformBox{
	border:3px solid #42210B;
}


/* -----------------------------------------------
 item
-------------------------------------------------- */

.item .leftBox{
	float:left;
}

.item .rightBox{
	float:right;
}

.item .makerLink li a{
	background: url(../images/ico_arrow_04.png) no-repeat center left;
	padding-left:20px;
}

.item .makerLink li a:hover{
	background: url(../images/ico_arrow_04_on.png) no-repeat center left;
	padding-left:20px;
}


/* -----------------------------------------------
 leftBox
-------------------------------------------------- */

div#leftBox{
	width:240px;
	float:left;
}

div#leftBox .section{
	margin-bottom:30px;
}

div#leftBox h2{
	margin-bottom:30px;
}

div#leftBox .menu{
	width:230px;
	background:#42210B;
	padding:5px;
}

div#leftBox .menu li{
	background-color:#FFF;
	margin-bottom:1px;
}

div#leftBox .menu p.ttl{
	padding-left:25px;
	padding-top:5px;
	padding-bottom:10px;
	color:#FFF;
	font-weight:bold;
	font-size:110%;
	background:url(../images/ico_list_disc_01.png) no-repeat left 10px;
}

div#leftBox .menu dt{
	padding-left:25px;
	background:url(../images/ico_arrow_04.png) no-repeat center left;
	font-size:80%;
	color:#666666;
	margin-bottom:5px;
}

div#leftBox .menu li p a{
	display:block;
	padding:5px;
	padding-left:20px;
	background:url(../images/ico_arrow_04.png) no-repeat center left;
}

div#leftBox .menu li p a:hover{
	text-decoration:none;
	background:url(../images/ico_arrow_04_on.png) no-repeat center left;
}

div#leftBox .menu li:hover{
	background-color: #EAE6DF;
}

/* -----------------------------------------------
 rightBox
-------------------------------------------------- */

.index div#rightBox {
	width: 280px;
	float:right;
}

/* -----------------------------------------------
 footer
-------------------------------------------------- */

div#footer {
	position: relative;
	clear: both;
	margin-left: auto;
	margin-right: auto;
	min-width: 980px;
	width: 100%;
	height: 380px;
	background:url(../images/bcg_footer.png) repeat-x top left;
	-moz-box-shadow: 0px 0px 3px #000;
	-webkit-box-shadow: 0px 0px 3px #000;
	box-shadow: 0px 0px 3px #000;
}

div#footer div.wrapper {
	margin: 0 auto;
	width: 920px;
	min-width: 920px;
	position: relative;
}

div#footer div#pageTop {
	width: 90px;
	height: 90px;
	position: fixed;
	right: 50px;
	bottom: 200px;
	z-index: 100;
}

div#footer div#ftBanner {
	width:920px;
	padding-top:30px;
	height:50px;
	margin-bottom:50px;
}

div#footer div#ftBanner li{
	float:left;
	margin-right:17px;
}

div#footer div#ftBanner li.last-child{
	margin-right:0px;
}

div#footer p#footer-logo {
	width: 190px;
	height: 50px;
	position: absolute;
	top: 220px;
	left: 0px;
	color:#FFF;
}

div#footer #footer-address {
	width: 350px;
	height: 105px;
	position: absolute;
	top: 230px;
	left: 210px;
	color:#FFF;
}

div#footer #ftBnr {
	width: 245px;
	height: 75px;
	position: absolute;
	top: 210px;
	right: 75px;
}

div#footer #ftGsl {
	width: 60px;
	height: 75px;
	position: absolute;
	top: 210px;
	right: 0px;
}

/* ftNav */
div#footer div#ftNav {
	position: absolute;
	width: 920px;
	top: 135px;
	right: 0px;
}

div#footer div#ftNav ul li {
	float: left;
	padding-left: 15px;
	margin-right: 20px;
	background:url(../images/ico_arrow_03.png) no-repeat center left;
}

div#footer div#ftNav ul li.last-child {
	padding-right: 0px;
	margin-right: 0px;
}

div#footer div#ftNav a {
	color: #FFF;
}

div#footer p#copyright {
	clear: both;
	position: absolute;
	width:500px;
	top: 345px;
	color: #FFF;
	text-align:center;
	left:50%;
	margin-left:-250px;
}

/* -----------------------------------------------
 clearfix
-------------------------------------------------- */

div#content:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

div#content {
	zoom: 1;
}

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix {
	zoom: 1;
}