@charset "UTF-8";

/**
 * 全体・プロトタイプ
----------------------------------------------------------------------------------------------------*/
body{
	background:#eff4f4;
}
body > main{
	margin-top:80px;
}
ul{
	padding:0;
}
.black_bar{
	background:#000;
	height:90px;
	margin-bottom:50px;
	color:#fff;
	text-align:center;
	line-height:90px;
	font-size:20px;
}

/**
 * ヘッダー・Gナビ
----------------------------------------------------------------------------------------------------*/
body > header{
	width:980px;
	height:80px;
	margin:0 auto;
	position:fixed;
	top:0;
	left:0;
	right:0;
	z-index:20;
	background:#000;
}
body > header > h1:before{
	display:block;
	content:'';
	height:80px;
	background:#000;
	left:0;
	right:0;
	top:0;
	position:fixed;
	z-index:-1;
}
body > header > *{
	float:left;
}
body > header a:hover{
	background-color:rgba(255,255,255,.2) !important;
}
body > header > h1 > a{
	display:block;
	width:254px;
	height:80px;
}
body > header > nav > ul > li{
	float:left;
}
body > header > nav > ul > li > a{
	display:block;
	width:131px;
	height:80px;
	text-indent:-131px;
	overflow:hidden;
	background:url('./../image/ui_gnav.png') scroll no-repeat 0 top;
}
body > header > nav > ul > li[name="system"] > a	{ background-position:  -0px top; }
body > header > nav > ul > li[name="equipment"] > a	{ background-position:-131px top; }
body > header > nav > ul > li[name="cost"] > a		{ background-position:-262px top; }
body > header > nav > ul > li[name="faq"] > a		{ background-position:-393px top; }
#contact > a{
	background:url('./../image/ui_contact.png') scroll no-repeat center center;
	width:200px;
	height:80px;
	text-indent:-200px;
	overflow:hidden;
	display:block;
}

/**
 * LP記事
----------------------------------------------------------------------------------------------------*/
.lpa > *{
	margin:0 auto;
	width:980px;
	display:block;
}
.lpa > a:hover{
	background:rgba(0,0,0,.1);
}
.point:before{
	content:'';
	display:block;
	height:50px;
	background:#fff;
	position:absolute;
	width:100%;
	z-index:-1;
}
#lpa001{ background:; background:#fff; }
#lpa002{ background:#00d1ff; margin-top:330px; }
#lpa003{ background:black; margin-bottom:50px; }
#lpa004{ margin-bottom:20px; }
#lpa005{ background:url('./../image/ui_bg02.png') scroll repeat-x center top; margin-bottom:50px; }
#lpa006{ }
#lpa007{ }
#lpa008{ }
#lpa009{ background:black; margin-bottom:50px; margin-top:130px; }
#lpa010{ margin-bottom:30px; }
#lpa011{ margin-bottom:80px; }
#lpa012{ background:black; margin-bottom:50px; margin-top:90px; }
#lpa013{ margin-bottom:50px; }
#lpa014{ }
#lpa015{ background:#ef009f; margin-bottom:35px; }
#lpa016{ background:#fff; margin-bottom:20px; }
#lpa017{ background:#fff; margin-bottom:77px; }
#lpa018{ margin-top:-60px; }
#lpa019{ background:#00d1ff; margin-top:-208px; margin-bottom:45px; }
#lpa020{ }
#lpa021{ background:#000; margin-bottom:50px; margin-top:130px; }
#lpa022{ background:#fff; }
#lpa023{ margin-bottom:30px; }
#lpa024{ }
#lpa025{ background:#000; }
#lpa011p{
	width:980px;
	margin:0 auto;
}
#lpa011p > p{
	margin-left:100px;
	margin-right:400px;
	margin-top:-140px;
	font-size:14px;
	line-height:25px;
	letter-spacing:.1em;
	text-align:justify;
}

/**
 * LPリスト
----------------------------------------------------------------------------------------------------*/
.lpl{
	width:940px;
	margin:0 auto;
	padding:20px;
	position:absolute;
	left:0;
	right:0;
}
.lpl > li{
	background:#fff url('./../image/ui_bg01.png') scroll repeat-y left top;
	width:302px;
	height:140px;
	float:left;
	margin-left:17px;
}
.lpl > li:first-child{
	margin:0;
}
.lpl > li > header{
	margin:4px 6px 2px 40px;
	font-size:23px;
	line-height:30px;
	letter-spacing:.0em;
	font-weight:bold;
	color:#ef009f;
}
.lpl > li > p{
	margin:6px 6px 4px 40px;
	font-size:15px;
	line-height:22px;
	letter-spacing:.1em;
	text-align:justify;
}
.lpl.col2 > li{
	width:461.5px;
	height:100px;
}

/**
 * メインビジュアル
----------------------------------------------------------------------------------------------------*/
#mvis > li{
	height:290px;
}
#mvis > li > header{
	color:#000;
	font-weight:bold;
	font-size:18px;
	line-height:22px;
	letter-spacing:0;
}
#mvis > li > p{
	font-size:13px;
	line-height:18px;
}
#mvis > li > img{
	display:block;
	margin-left:40px;
}

/**
 * よくある御質問
----------------------------------------------------------------------------------------------------*/
#faq{
	margin-top:40px;
	position:relative;
	overflow:hidden;
}
#faq > li{
	background:#fff;
	margin-bottom:23px;
	position:relative;
	left:50%;
	margin-left:-450px;
}
#faq > .q{
	width:700px;
}
#faq > .a{
	margin-left:-344px;
}
#faq > li > .sec > header{
	width:106px;
	height:60px;
	color:#fff;
	line-height:60px;
	text-align:center;
	font-size:28px;
	position:absolute;
}
#faq > .q > .sec > header{
	background:#00D1FF;
}
#faq > .a > .sec > header{
	background:#EF009F;
}
#faq > li > .sec > p{
	padding:10px;
	min-height:40px;
	margin-left:130px;
	line-height:20px;
	text-align:justify;
	width:500px;
	position:relative;
}
#faq > .q > .sec > p{
	font-weight:bold;
}
#faq > li > .sec > p:before{
	content:'';
	display:block;
	background:#fff;
	position:absolute;
	height:100%;
	top:0;
	z-index:-1;
}
#faq > .q > .sec > p:before{
	left:-1000%;
	right:0;
}
#faq > .a > .sec > p:before{
	left:0;
	right:-1000%;
}

#lpa014_02{
	margin-left:130px;
}
#faq > .a > .sec > p{
	padding:30px 10px;
}

/**
 * お問い合わせフォーム
----------------------------------------------------------------------------------------------------*/
#contactform{
	width:980px;
	margin:40px auto;
}
#contactform > .layout > *{
	width:49%;
}
#contactform label{
	display:block;
	padding:10px 4px;
	height:30px;
	background:#fff;
	width:100%;
	margin:10px 0;
	position:relative;
	font-size:12px;
	color:#999;
}
#contactform label:hover{
	background:#f5f5f5;
}
#contactform label:active > input,
#contactform label:active > textarea{
	background:#ddd;
}
#contactform .left > label > header{
	position:absolute;
	line-height:15px;
	margin-left:10px;
	margin-top:10px;
}
#contactform .left > label > input{
	display:block;
	position:absolute;
	line-height:30px;
}
#contactform .left > label > input,
#contactform .right > label > textarea{
	border:0;
	font-weight:bold;
}
#contactform [name="comkana"]{ left:60px; width:327px; }
#contactform [name="comname"]{ left:60px; width:420px; }
#contactform [name="kana"]{ left:60px; width:327px; }
#contactform [name="name"]{ left:100px; width:380px; }
#contactform [name="tel"]{ left:70px; width:410px; }
#contactform [name="mail"]{ left:110px; width:370px; }
#contactform [name="address"]{ left:50px; width:430px; }
#contactform .area{
	height:340px;
}
#contactform .area > header{
	border-bottom:1px solid #ccc;
	margin:10px;
}
#contactform [name="cont"]{
	display:block;
	margin:10px;
	width:440px;
	height:300px;
	line-height:20px;
	padding:0 10px;
}
#contactform [type="submit"]{
	border:0;
	width:400px;
	height:80px;
	margin:10px auto;
	background:#EF009F;
	color:#fff;
	font-size:20px;
	letter-spacing:1em;
}
#contactform [type="submit"]:hover{
	background:#F666C6;
}
#contactform .required:after{
	content:'*必須';
	display:block;
	background:#dc143c;
	position:absolute;
	width:40px;
	height:16px;
	line-height:16px;
	font-size:11px;
	color:#fff;
	text-align:center;
	left:0;
	top:0;
}
#contactform .sub{
	height:30px;
	padding:0 4px;
	margin-left:100px;
	background:none;
	margin-bottom:-5px;
}
#contactform .left > .sub > header{
	line-height:30px;
	margin:0;
}
dialog{
	position:fixed;
	z-index:10000;
	width:400px;
	height:100px;
	background:#fff;
	border:10px solid #EF009F;
	border-radius:10px;
	top:50%;
	left:50%;
	padding:20px;
	text-align:center;
	margin-left:-230px;
	margin-top:-80px;
}
