@charset "utf-8";

/*-----------------------------------------------------
各pxに対応する、IEハックで指定するパーセント
12px 	75%
13px 	82%
14px 	88%
15px 	94%
16px 	100%

基本サイズ12px	基本サイズ13px	基本サイズ14px
10px 	 84%			10px 	 77%			10px 	 72%
11px 	 92%			11px 	 85%			11px 	 79%
12px 	100%			12px 	 93%			12px 	 86%
13px 	109%			13px 	100%			13px 	 93%
14px 	117%			14px 	108%			14px 	100%
15px 	125%			15px 	116%			15px 	108%
16px 	134%			16px 	124%			16px 	115%
17px 	142%			17px 	131%			17px 	122%
18px 	150%			18px 	139%			18px 	129%
19px 	159%			19px 	147%			19px 	136%
20px 	167%			20px 	154%			20px 	143%
21px 	175%			21px 	162%			21px 	150%
22px 	184%			22px 	170%			22px 	158%
23px 	192%			23px 	177%			23px 	165%
24px 	200%			24px 	185%			24px 	172%
25px 	209%			25px 	193%			25px 	179%
26px 	217%			26px 	200%			26px 	186%


基本サイズ15px;
15px	100%
17px	113%
18px	120%
20px	133%
25px	166%
27px	180%

-------------------------------------------------------*/
html {
	height:100%;
}
body {
	font-family:"メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック",sans-serif;
	font-size:15px;
	color:#eee8a9;
	line-height:1.6;
	height:100%;
	margin:0px;
	padding:0px;
	text-align: center;
	background-color: #191c2f;
}

/* for IE8 */
head~/* */body {font-size: 100%;}
html:not(:target) body {font-size:14px;}

#wrapper {
	width:100%;
	height:100%;
	min-height: 100%;
	margin:0px auto;
	overflow: hidden;
	position: relative;
}

#bg {
	background: rgba(25, 28, 47, 0) url("../img/common/bg.png") no-repeat scroll 0 0;
	height: 1772px;
	left: 50%;
	margin-left: -1050px;
	position: absolute;
	width: 2100px;
	z-index: -1; 
}

body > #wrapper {
	height:auto;
}

.atn {
	color:#ebaf27;
}

.btn a{
	display: inline-block;
	font-size: 133%;
	border: 1px solid #e7b01e;
	background: transparent;
	color: #e7b01e;
	text-align: center;
	text-decoration: none;
	line-height: 1;
	transition: .3s;
}

.change:hover a {
background: #e7b01e;
color: #fff;
}
#pagetop{
	display: block;
	bottom: 50px;
	right: 50px;
	position: fixed;
}
#pagetop a{
	background: #ddb32b none repeat scroll 0 0;
	border-radius: 35px;
	display: block;
	padding: 18px 19px;
	outline: medium none;
}
#pagetop span{
	background: rgba(221,179,43,1) url("../img/common/pagetop.png") no-repeat scroll 0 0;
	display: block;
	text-indent: -9999px;
	height: 30px;
	width: 29px;
}

#pagetop2 {
	bottom: 0;
	left: 50%;
	margin-left: -75px;
	position: absolute;
	width:146px;
}

#pagetop2 a{
	background: rgba(0,0,0,0) url("../img/common/pagetop_btm.png") no-repeat scroll 0 36px;
	display: block;
	height: 0;
	overflow: hidden;
	padding-top: 72px;
	transition: all 0.2s ease-in 0s;
}

#pagetop2 a:hover{
	background-position: 0 0;
}


/* 01 header
-------------------------------------------------------*/
#header {
	width:100%;
}

}
#header h1 {
	text-align: center;
}

#header h1 img {
	margin-top: 46px;
}

#header nav {
	width: 100%;
	margin-top: 201px;
	margin-bottom: 65px;
	text-align: center;
}

#navInner{
	display: inline-block;
	margin: 0 auto;
	width: 785px;
	height: 157px;
	position: relative;
}

p.cover{
	position: absolute;
	z-index: 2;
	display: none;
}

p.base{
	position: absolute;
	z-index: 1;
}


#header ul li {
	float:left;
}
#header ul li img{
	vertical-align:bottom;
}

#navSRV{padding-left: 157px;}
#navCMP{padding-left: 314px;}
#navJOB{padding-left: 471px;}
#navCNT{padding-left: 628px;}


/* 02 philosophy
-------------------------------------------------------*/
#philosophy {
	font-size: 100%;
	padding-top: 139px;
	margin-bottom: 32px;
	text-align: center;
}

#philosophy p.title{
	display: inline-block;
	margin-top: 26px;
}

#philosophy h3 {
	margin-bottom: 25px;
}

#philosophy p {
	line-height: 2.1;
}

#philosophy p.title {
	border-bottom: 1px solid #ebaf27;
	padding-bottom: 10px;
	margin-bottom: 28px;
	width: 113px;
}

#philosophy p.strong {
	display: inline-block;
	border-bottom: 1px solid #ebaf27;
	padding-bottom: 39px;
	font-size: 113%;
	width: 579px;
}

/* 03 service
-------------------------------------------------------*/
#service {
	margin: 0 auto 24px;
	width: 1100px;
}

#service div.service_caps00{
	float: left;
	margin-bottom: 56px;
	text-align: left;
}

#service h2{
	float: left;
	padding: 0 10px 0 21px;
}

#service h3.service_caps01{
	padding: 177px 0 18px 0;
}

#service h3.service_caps01 img{
	vertical-align: bottom;
}


#service p.service_caps02{
}

#service div.service_kind img{
	vertical-align: bottom;
}

/* 04 company
-------------------------------------------------------*/
#company {
	font-size:100%;
	margin: 0 auto 43px;
	text-align: left;
	width: 1100px;
}

#company div.company_caps00{
	float: left;
	margin-bottom: 56px;
}

#company h2{
	float: left;
	padding: 0 10px 0 21px;
}

#company h3.company_caps01{
	padding: 177px 0 18px 0;
}

#company h3.company_caps01 img{
	vertical-align: bottom;
}

#company p.company_caps02{
	bottom: 103px;
	left: 317px;
}

#company .detail div.left{
	font-size: 133%;
	line-height: 1.4;
}

#company .left {
	float: left;
	width: 500px;
}

#company .right {
	float: right;
	width: 500px;
}

#company .detail{
	padding-bottom: 70px;
	border-bottom: 1px solid #ebaf27;
	margin-bottom: 70px;
	display: inline-block;
	width: 100%;
}

#company .detail .btn a{

	margin-top: 143px;
	padding: 26px 182px;
}

#company .detail dt {
	border-bottom: 1px solid #c59a25;
	clear: left;
	float: left;
	padding: 23px 0;
	width: 155px;
}

#company .detail dt.business{
	border-bottom: 1px solid #c59a25;
	clear: left;
	float: left;
	padding: 23px 0 75px;
	width: 155px;
}

#company .detail dd {
	border-bottom: 1px solid #c59a25;
	padding: 23px 0;
	float: left;
	width: 345px;
}

#company .detail div.right{
	position: relative;
	width: 500px;
}

#company div.detail img{
	border: 2px solid #c59a25;
}

#company div.detail img.building{
	position: absolute;
	right: 10px;
	bottom: 116px;
}

#company div.border_office{
	position: absolute;
	border: 2px solid #c59a25;
	right: 23px;
	bottom: 211px;
	width: 462px;
	height: 279px;
	z-index: -1;
}

#company div.border_building{
	position: absolute;
	border: 2px solid #c59a25;
	right: 0px;
	bottom: 105px;
	width: 229px;
	height: 190px;
}

.osaka {
	margin-bottom: 90px;
}

.osaka h3, .tokyo h3{
	padding-top: 16px;
}

.tokyo .btn a,.osaka .btn a{
	font-size:133%;
	margin-top: 23px;
	padding: 30px 180px;
}

#gmap_osaka{
	height: 272px;
	width: 500px;
}

#gmap_tokyo{
	height: 272px;
	width: 500px;
}

/* 05 conatct
-------------------------------------------------------*/
#contact {
	margin: 0 auto;
	height: 1172px;
	font-size: 133%;
	text-align: left;
	width: 911px;
}

#contact_line {
/* 	width: 100%; */
	background: url(../img/common/bg_contact_top.png) no-repeat scroll 0 0,
				url(../img/common/bg_contact_under.png) no-repeat scroll 100% 100%;
	padding: 48px 0 60px;
	margin-bottom: 26px;
/* 	text-align: left,
		    right; */
/* 	margin-top: 100px 200px; */
/*	position: absolute;
	height: 151px;*/
/*	z-index: -1;*/
}

#contact div.title{
	text-align: center;
}

#contact p.title_border {
	font-size: 75%;
	display: inline-block;
	border-bottom: 1px solid #ebaf27;
	padding-bottom: 10px;
	margin-bottom: 57px;
	width: 58px;
}

#contact p.info{
	font-size: 125%;
	margin-bottom: 14px;
}

.by_phone {

}

ul.by_phone {
	border-top: 1px solid #c59a25;
	border-bottom: 1px solid #c59a25;
	padding: 11px 0;
	margin-bottom: 25px;
}

.by_phone li {
	float: left;
}

.by_phone li.tel_left{
	padding-top: 11px;
}

.by_phone li span {
	font-size: 90%;
}

.by_phone li.tel {
	border-left: 1px solid #c59a25;
	padding: 7px 0 7px 28px;
	margin-left: 29px;
}

.by_phone li.tel img {
	vertical-align: bottom;
}

#contact h3 img {
	vertical-align: middle;
}

#contact div.form {
	margin-top: 10px;
}

.form dt {
	border-top: 1px solid #c59a25;
	clear: left;
	float: left;
	padding-top: 22px;
	width: 198px;
}

.form dd {
	border-top: 1px solid #c59a25;
	padding: 14px 0;
	float: left;
	width: 713px;
}

.form dd.txt_area {
	padding: 14px 0 6px;
}

.form .kind{
	border: none;
	padding-top: 20px;
}

.form .txt_input {
	border-top: 1px solid #c59a25;
	background-color: #191c2f;
	border: 1px solid #c59a25;
	padding: 14px 0;
	color: #eee8a9;
	width: 100%;

}

.form .txt_area textarea{
	background-color: #191c2f;
	border: 1px solid #c59a25;
	padding: 14px 0;
	color: #eee8a9;
	width: 100%;
}

.form_btn{
	width: 713px;
	margin-left: auto;
}
.conf{
	font-size: 80%;
	text-align: left;
}

.form_btn p.btn a{
	float: left;
	padding: 26px 77px;
	margin: 20px 50px 0 0;
	font-size: 100%
}


/* 06 footer
-------------------------------------------------------*/
#footer {
	height: 73px;
	width: 1100px;
	margin: 0 auto;
}


#footer div.name{
	display: inline-block;
	padding-top: 28px;
	float: left;
}