﻿@charset "utf-8";

/*
Theme Name: テーマ
Version 1.0
*/ 

@import "base.css";

/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
  全般設定
　━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/

body{
	padding:0;
	font-family : "メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic","MS P Gothic",sans-serif, Arial,Helvetica;
	font-size:16px;
	color:#2b2b2b;
	-webkit-text-size-adjust: 100%;

	}
	
#wrapper{
	padding:0;
	width:100%;
}


/*　header　
----------------------------------------------------------*/
header{
	height:798px;
	background-position:top center;
	background-repeat:no-repeat;
	position:relative;
}
.h_inner{
	width:100%;
	height:95px;
	background-color:#ffffff;
	position:fixed;
	top:0;
	z-index:5000;
	
    filter:alpha(opacity=80); /* IE 6,7*/
    -ms-filter: "alpha(opacity=80)"; /* IE 8,9 */
    -moz-opacity:0.8; /* FF , Netscape */
    -khtml-opacity: 0.8; /* Safari 1.x */
	opacity:0.8;
	
}
header h1{
	width:1100px;
	font-size:0.75em;
	margin:0 auto;
}
.index header{
	height:798px;
}

.business header ,
.performance header ,
.company header ,
.recruitment header ,
.contact header{
	height:597px;
}
.business header{
	background-image:url(../img/business/business_main.jpg);
}
.performance header{
	background-image:url(../img/performance/performance_main.jpg);
}
.company header{
	background-image:url(../img/company/company_main.jpg);
}
.recruitment header{
	background-image:url(../img/recruitment/recruitment_main.jpg);
}
.contact header{
	background-image:url(../img/contact/contact_main.jpg);
}
.h_ttl{
	width:1100px;
	margin:0 auto;
	padding:250px 0 0 50px;
}
.h_box01{
	width:350px;
	height:150px;
	background-color:#eabc73;
	color:#ffffff;
	font-size:2.31em;
	text-align:center;
	padding:15px 30px;
}
.recruitment .h_box01{
	width:410px;
}
.h_box01 img{
	margin-bottom:20px;
}
.h_box01 p{
	font-size:1.64em;
	border-bottom:1px solid #ffffff;
}
/*　navi
----------------------------------------------------------*/
nav{
	width:1100px;
	margin:1em auto 0;
}
nav ul{
	width:600px;
	float:right;
}
nav ul li{
	float:left;
}
nav ul li a:hover{
	text-decoration:none;
}
nav ul li{
	width:90px;
    font-size:1em;
	text-align:center;
	margin:0 5px;
}
nav ul li:hover{
	border-bottom:5px solid #eabc73;
}
nav ul li.current{
	border-bottom:5px solid #eabc73;
}


/*　footer　
----------------------------------------------------------*/
footer{
	background-color:#2b2b2b;
	color:#ffffff;
}
footer a{
	color:#ffffff;
}
footer a:hover{
	text-decoration:none;
}
footer ul{
	width:1050px;
	margin:0 auto;
	padding:0.5em 0;
}
footer ul li{
	text-align:center;
	float:left;
}
footer ul li.t:before{
	content:"/ 　　　";
}
footer ul li:before{
	content:" 　　　";
}
footer ul li:after{
	content:" 　　　/";
}
.copyright{
	background-color:#ffffff;
	color:#2b2b2b;
	font-size:0.875em;
	text-align:center;
	padding:1em 0;
}
.copyright img{
	margin:1em 0;
}
#pagetop {
    position: fixed;
    bottom: 20px;
    right: 20px;
}

/*　main　
----------------------------------------------------------*/


#main{
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1.5s;
 -ms-animation-duration:1.5s;
 animation-duration:1.5s;
 -webkit-animation-name: fuwatAnime;
 -ms-animation-name: fuwatAnime;
 animation-name: fuwatAnime;
 visibility: visible !important;
}

@-webkit-keyframes fuwatAnime {
 0% { opacity: 0; -webkit-transform: translateY(-20px); }
 100% { opacity: 1; -webkit-transform: translateY(0); }
}

@keyframes fuwatAnime {
 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); }
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}





article section{
	width:1100px;
	margin:0 auto;
}

article section .ttl01{
	width:100%;
    position: relative;
    display: inline-block;
    font-size:2.3em;
	text-align:center;
    margin:2em 0 1.5em;
}
/*以下で線を表示*/
article section .ttl01:before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -15px;/*線の上下位置*/
  display: inline-block;
  width: 82px;/*線の長さ*/
  height: 5px;/*線の太さ*/
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);/*位置調整*/
  border-radius: 2px;/*線の丸み*/
}
article section .ttl01 p{
	font-size:0.48em;
}
article section.b01 .ttl01 p{
    color:#aad37b;	
}
article section.b01 .ttl01:before{
    background-color:#aad37b;
}
article section.b02 .ttl01 p{
	color:#5788bc;	
}
article section.b02 .ttl01:before{
	background-color:#5788bc;
}
article section.b03 .ttl01 p{
	color:#f5827e;	
}
article section.b03 .ttl01:before{
	background-color:#f5827e;
}
.txt01{
	font-size:3em;
	text-align:center;
	margin:1em 0 0;
}
.txt02{
	font-size:1.25em;
	text-align:center;
	margin:0.5em 0 2em;
}
.business #hvac ,
.business #plumbing ,
.recruitment #voice ,
.recruitment #guideline{
	margin-top:-90px;
	padding-top:90px;
}








/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
  index.html
　━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
article.i01{
	height:478px;
	background-color:#aad37b;
	background-image:url(../img/index/index_bg01.jpg);
	background-position:top center;
	background-repeat:no-repeat;
}
article.i02{
	height:478px;
	background-color:#5788bc;
	background-image:url(../img/index/index_bg02.jpg);
	background-position:top center;
	background-repeat:no-repeat;
}
article.i03{
	height:478px;
	background-color:#f5827e;
	background-image:url(../img/index/index_bg03.jpg);
	background-position:top center;
	background-repeat:no-repeat;
}
article.i04{
	height:318px;
	background-color:#997baf;
	background-image:url(../img/index/index_bg04.jpg);
	background-position:top center;
	background-repeat:no-repeat;
}
article.i05{
	background-color:#2b2b2b;
	color:#ffffff;
	padding:80px 0 100px;
}
article.i06{
	height:253px;
	background-color:#ffffff;
	background-image:url(../img/index/index_bg06.jpg);
	background-position:top center;
	background-repeat:no-repeat;
	color:#ffffff;
	font-size:1.09em;
	line-height:1.35;
	padding:26px 0;
}

.index_box01,
.index_box02,
.index_box03{
	width:360px;
	font-size:1.31em;
	color:#ffffff;
	text-align:center;
	float:right;
	margin-top:50px;
}
.index_box01,
.index_box03{
	float:right;
}
.index_box02{
	float:left;
}
.index_box01 a,
.index_box02 a,
.index_box03 a{
	color:#ffffff;
}
.index_box01 p,
.index_box02 p,
.index_box03 p{
	font-size:1.4em;
	margin:0.8em 0 0.3em;
}
.index_box01 div,
.index_box02 div,
.index_box03 div{
	text-align:left;
}
div.index_btn{
	border:2px solid #ffffff;
	text-align:center;
	margin-top:1em;
	padding:5px 0;
}
div.index_btn:hover{
    filter:alpha(opacity=60); /* IE 6,7*/
    -ms-filter: "alpha(opacity=60)"; /* IE 8,9 */
    -moz-opacity:0.6; /* FF , Netscape */
    -khtml-opacity: 0.6; /* Safari 1.x */
	opacity:0.6;
}
article section a:hover{
	text-decoration:none;
}
.index_recruitment ,
.index_company{
	width:500px;
	height:45px;
	color:#ffffff;
	font-size:1.68em;
	text-align:center;
	margin-top:260px;
	padding-top:5px;
}
.index_recruitment{
	float:left;
}
.index_company{
	float:right;
}
.index_contact{
	width:530px;
	float:left;
}
.index_access{
	width:545px;
	float:right;
}
.index_contact p,
.index_access p{
	font-size:1.68em;
	margin-bottom:1em;
}
.index_contact_btn{
	border:2px solid #ffffff;
	text-align:center;
	margin-top:1.85em;
	padding:20px 0;
}
.index_contact a{
	color:#ffffff;
}
.index_contact_btn:hover{
    filter:alpha(opacity=60); /* IE 6,7*/
    -ms-filter: "alpha(opacity=60)"; /* IE 8,9 */
    -moz-opacity:0.6; /* FF , Netscape */
    -khtml-opacity: 0.6; /* Safari 1.x */
	opacity:0.6;
}

.slide_txt{
	width:1100px;
	margin:0 auto;
	padding-top:300px;
}

#animation01,
#animation02,
#animation03{
	width:1100px;
	margin:0 auto;
}
.fadeInDown01,
.fadeInDown02,
.fadeInDown03{
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-name: fadeInDown01;
 animation-name: fadeInDown01;
 visibility: visible !important;
}
.fadeInDown01{
 -webkit-animation-duration:2s;
 -ms-animation-duration:2s;
 animation-duration:2s;
}
.fadeInDown02{
 -webkit-animation-duration:3s;
 -ms-animation-duration:3s;
 animation-duration:3s;
}
.fadeInDown03{
 -webkit-animation-duration:4s;
 -ms-animation-duration:4s;
 animation-duration:4s;
}




@-webkit-keyframes fadeInDown01 {
 0% { opacity: 0; -webkit-transform: translateX(-200px); }
 100% { opacity: 1; -webkit-transform: translateX(0); }
}
@keyframes fadeInDown01 {
 0% { opacity: 0; -webkit-transform: translateX(-200px); -ms-transform: translateX(-200px); transform: translateX(-200px); }
 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); }
}
@-webkit-keyframes fadeInDown02 {
 0% { opacity: 0; -webkit-transform: translateX(-200px); }
 100% { opacity: 1; -webkit-transform: translateX(0); }
}
@keyframes fadeInDown02 {
 0% { opacity: 0; -webkit-transform: translateX(-200px); -ms-transform: translateX(-200px); transform: translateX(-200px); }
 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); }
}
@-webkit-keyframes fadeInDown03 {
 0% { opacity: 0; -webkit-transform: translateX(-200px); }
 100% { opacity: 1; -webkit-transform: translateX(0); }
}
@keyframes fadeInDown03 {
 0% { opacity: 0; -webkit-transform: translateX(-200px); -ms-transform: translateX(-200px); transform: translateX(-200px); }
 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); }
}




/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
  business.html
　━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
article.business01,
article.business02{
	height:465px;
	background-position:top center;
	background-repeat:no-repeat;
	padding:45px 0;
}
article.business01{
	background-image:url(../img/business/business02_img01.jpg);
}
article.business02{
	background-image:url(../img/business/business04_img01.jpg);
}
article.business01 section div,
article.business02 section div{
	width:415px;
	height:415px;
	border-radius:3px;
	color:#ffffff;
	font-size:2.68em;
 display: -webkit-flex;
 display: flex;
 -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
 align-items: center; /* 縦方向中央揃え */
 -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
 justify-content: center; /* 横方向中央揃え */
}
article.business01 section div{
	background-color:#aad37b;
	float:left;
	margin-left:55px;
}
article.business02 section div{
	background-color:#5788bc;
	float:right;
	margin-right:55px;
}
.b01 img,
.b02 img{
	float:left;
}
.business01_txt01,
.business02_txt01{
	width:540px;
	font-size:1.125em;
	float:right;
}
.business article section.b01,
.business article section.b02{
	margin-bottom:5em;
}

/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
  performance.html
　━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
/* 公共施設 */
.performance #main article section.b01 ul{
	width:100%;
	margin:1.25em 0 0.5em;
}
.performance #main article section.b01 ul li{
	width:350px;
	float:left;
}
.performance #main article section.b01 ul li img{
	margin-bottom:0.5em;
} 
.performance #main article section.b01 ul li:nth-child(3n+1),
.performance #main article section.b01 ul li:nth-child(3n+2){
	margin-right:1.25em;
}
.performance #main article section.b01 table{
	width:100%;
	border-top:2px solid #aad37b;	
	border-left:2px solid #aad37b;	
}
.performance #main article section.b01 table th,
.performance #main article section.b01 table td{
	font-size:1.125em;
	border-bottom:2px solid #aad37b;	
	border-right:2px solid #aad37b;
}
.performance #main article section.b01 table th{
	width:80px;
	background-color:#eef6e5;
	text-align:center;
	vertical-align:top;
	padding:10px 5px;
}
.performance #main article section.b01 table td{
	padding:10px;
}
/* 実績一覧 */
.performance article section.b02{
	margin-bottom:5em;
}
.performance #main article section.b02 table{
	width:100%;
	border-top:2px solid #5788bc;	
	border-left:2px solid #5788bc;	
}
.performance #main article section.b02 table th,
.performance #main article section.b02 table td{
	font-size:1.125em;
	border-bottom:2px solid #5788bc;	
	border-right:2px solid #5788bc;
	text-align:center;
	vertical-align:middle;
	padding:20px 20px;
}
.performance #main article section.b02 table th{
	background-color:#dde7f2;
}

/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
  company.html
　━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
/* ごあいさつ */
.company #main article section.b01 img{
	float:right;
}
.company01_box01{
	width:545px;
	font-size:1.125em;
	float:left;
}
.company01_box01 p{
	text-align:right;
	margin-top:0.5em;
}
/* 会社概要 */
.company #main article section.b02 table{
	width:100%;
	border-top:2px solid #5788bc;	
	border-left:2px solid #5788bc;	
}
.company #main article section.b02 table th,
.company #main article section.b02 table td{
	font-size:1.125em;
	border-bottom:2px solid #5788bc;	
	border-right:2px solid #5788bc;
}
.company #main article section.b02 table th{
	width:260px;
	background-color:#dde7f2;
	text-align:center;
	vertical-align:top;
	padding:20px 0;
}
.company #main article section.b02 table td{
	padding:10px 70px;
}
/* 沿革 */
.company article section.b03{
	margin-bottom:5em;
}
.company #main article section.b03 table{
	width:100%;
	border-top:2px solid #f5827e;	
	border-left:2px solid #f5827e;	
}
.company #main article section.b03 table th,
.company #main article section.b03 table td{
	font-size:1.125em;
	border-bottom:2px solid #f5827e;	
	border-right:2px solid #f5827e;
}
.company #main article section.b03 table th{
	width:260px;
	background-color:#fde6e5;
	text-align:center;
	vertical-align:top;
	padding:20px 0;
}
.company #main article section.b03 table td{
	padding:20px 70px;
}
.company #main article section.b03 table th.w01{
	letter-spacing:2px;
}
.company #main article section.b03 table th.w02{
	letter-spacing:4px;
}

/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
  recruitment.html
　━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
/* 募集概要 */
.recruitment article section.b01{
	margin-bottom:5em;
}
.recruitment #main article section.b01 table{
	width:100%;
	border-top:2px solid #aad37b;	
	border-left:2px solid #aad37b;	
}
.recruitment #main article section.b01 table th,
.recruitment #main article section.b01 table td{
	font-size:1.125em;
	border-bottom:2px solid #aad37b;	
	border-right:2px solid #aad37b;
}
.recruitment #main article section.b01 table th{
	width:260px;
	text-align:center;
	vertical-align:top;
	padding:20px 0;
}
.recruitment #main article section.b01 table th.top{
	background-color:#aad37b;
	color:#ffffff;
	font-weight:bold;
}
.recruitment #main article section.b01 table td{
	padding:10px 40px;
}
.recruitment #main article section.b01 table td a{
	color:#5788bc;
	text-decoration:underline;
}
.recruitment #main article section.b01 table td a:hover{
	text-decoration:underline;
}

/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
  contact.html
　━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
.contact article section.b01{
	text-align:center;
}
.contact article section.b01 .contact_txt01{
	font-size:1.25em;
	margin:2em 0 3em;
}
.contact_btn{
	width:375px;
	background-color:#aad37b;
	color:#ffffff;
	font-size:1.3em;
	text-align:center;
	margin:2em auto;
	padding:12px;
}
.contact_btn:hover{
    filter:alpha(opacity=80); /* IE 6,7*/
    -ms-filter: "alpha(opacity=80)"; /* IE 8,9 */
    -moz-opacity:0.8; /* FF , Netscape */
    -khtml-opacity: 0.8; /* Safari 1.x */
	opacity:0.8;
}
/* お客様情報 */
.contact #main article section.b01 table{
	width:100%;
	border-top:2px solid #aad37b;	
	border-left:2px solid #aad37b;	
}
.contact #main article section.b01 table th,
.contact #main article section.b01 table td{
	font-size:1.125em;
	border-bottom:2px solid #aad37b;	
	border-right:2px solid #aad37b;
}
.contact #main article section.b01 table th{
	width:300px;
	background-color:#eef6e5;
	text-align:center;
	vertical-align:top;
	padding:20px 5px;
}
.contact #main article section.b01 table td{
	text-align:left;
	padding:7px;
}
.contact #main article section.b01 table th span.red{
	color:#ff0000;
	float:right;
}
.input_txt01{
	width:98%;
	height:40px;
	padding:3px 0  3px 10px;
	font-size:1.025em;
}
.input_txt02{
	width:98%;
	height:300px;
	padding:5px 0  5px 10px;
	overflow:auto;
	font-size:1.025em;

}
.input_txt03{
	width:50%;
	height:40px;
	padding:3px 0  3px 10px;
	font-size:1.025em;

}
























	