@charset "utf-8";

@import "/css/common.css";
@import "/css/system.css";

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

/* cms：CMS（Web更新システム） */

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

#g-system a{background:url('/common_img/header/global.gif') no-repeat -456px -48px;}


/* 共通 */
.cms #webcruiser h2,
.cms #other h2,
.application #kaihatsu h2,
.cart #intro h3,
.flash #seizu h2,
.flash #flex h2,
.location #example h2,
.location #dokokoko h2{
	margin:0 auto 1em;
	padding:0 6px 0 12px;
	border-left:18px solid #e0670f;
	color:#fff;
	background:#000;
	font-size:18px;
}

a{
	color:#e0670f;
}

.cms #webcruiser .right p.more,
.cms #other .left p.more{
	margin:0 0 2em auto;
	padding:0;
	width:220px;
	line-height:3;
	background:#e0670f;
	text-align:center;
}

.cms #webcruiser .right p.more a,
.cms #other .left p.more a{
	padding:2px 0 1px;
	display:block;
	color:#fff;
}

.cms #webcruiser .right p.more a:hover,
.cms #other .left p.more a:hover{
	background-color:#ff872f;
	text-decoration:none;
}


.system{
	margin:0 0 2em auto;
	padding:0;
	width:220px;
	line-height:3;
	background:#e0670f;
	text-align:center;
}
.system a{
	padding:2px 0 1px;
	display:block;
	color:#fff;
}
.system a:hover{
	background-color:#ff872f;
	text-decoration:none;
	color:#fff;
}

/* ---------------------------------------------------------------- */
/* comment */
/* ---------------------------------------------------------------- */
/* リセット */
.cms #comment *{margin:0;padding:0;}
.cms #comment{
	margin:0 1em 2em;
	background:url('/system/image/cms_image.gif') no-repeat 100% 0;
}

.cms #comment h2{
	margin-bottom:1em;
}

.cms #comment h3{
	margin:0 0 1.5em 0.1em;
}

.cms #comment p{
	margin-bottom:1em;
}

/* ---------------------------------------------------------------- */
/* webcruiser */
/* ---------------------------------------------------------------- */
/* リセット */
.cms #webcruiser *{margin:0;padding:0;}
.cms #webcruiser{
	margin-bottom:3em;
}

.cms #webcruiser .inner{
	padding:0 1em;
}

/* clear hack */
.cms #webcruiser .inner{zoom:1;}
.cms #webcruiser .inner:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

.cms #webcruiser .right{
	float:right;
	width:350px;
	padding-top:1em;
}

.cms #webcruiser .right p{
	margin-bottom:1em;
}

.cms #webcruiser .inner img{
	float:left;
}

/* ---------------------------------------------------------------- */
/* other */
/* ---------------------------------------------------------------- */
/* リセット */
.cms #other *{margin:0;padding:0;}
.cms #other{
	margin-bottom:3em;
}

.cms #other .inner{
	padding:0 0.5em 0 1em;
}

/* clear hack */
.cms #other .inner{zoom:1;}
.cms #other .inner:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

.cms #other .left{
	float:left;
	width:380px;
	padding-top:1.5em;
}

.cms #other .left p{
	margin-bottom:1em;
}

.cms #other .right{
	float:right;
}

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

/* application：CART（Webアプリケーション） */

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

/* ---------------------------------------------------------------- */
/* comment */
/* ---------------------------------------------------------------- */
/* リセット */
.application #comment *{margin:0;padding:0;}
.application #comment{
	margin:0 0.8em 2em;
	padding-top:0.2em;
	background:url('/system/image/application_api.jpg') no-repeat 100% 0;
}

.application #comment h2{
	width:422px;
	margin:0 0 1em 0.2em;
}

.application #comment p{
	margin:0 0 3.7em 0.3em;
	width:410px;
}

/* ---------------------------------------------------------------- */
/* kaihatsu */
/* ---------------------------------------------------------------- */
/* リセット */
.application #kaihatsu *{margin:0;padding:0;}
.application #kaihatsu{
	margin:0 0 2em;
}

.application #kaihatsu .inner{
	margin:0 1.5em 1em;
}
/* clear hack */
.application #kaihatsu .inner{zoom:1;}
.application #kaihatsu .inner:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

.application #kaihatsu .inner div{
	float:right;
	width:530px;
	padding-top:1em;
}

.application #kaihatsu .inner h3{
	font-family:"メイリオ",Meiryo,Osaka,"MS P Gothic","ＭＳ Ｐゴシック",Verdana,Chicago,sans-serif;
	font-size:1.2em;
}

.application #kaihatsu .inner p span{
	padding:2px 5px 0;
	background:#f47518;
	color:#fff;
	font-weight:bold;
}

.application #kaihatsu .inner img{
	float:left;
}

.application #kaihatsu .other{
	margin:0 1.5em 1em;
}

.application #kaihatsu .other img{
	margin:0 0 0.8em;
}

.application #kaihatsu .other h4{
	margin-left:0.6em;
	padding-left:1.2em;
	background:url('/system/image/application_mark.gif') no-repeat 0 50%;
	font-size:1em;
	color:#e0670f;
}

.application #kaihatsu .other p{
	margin:0 0 1em 1.6em;
}

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

/* cart：CART（ショッピングカート開発） */

/* ---------------------------------------------------------------- */
/* ---------------------------------------------------------------- */
/* comment */
/* ---------------------------------------------------------------- */
/* リセット */
.cart #comment *{margin:0;padding:0;}
.cart #comment{
	margin-bottom:1em;
	padding:0 1em;
}

.cart #comment .inner{
}

/* clear hack */
.cart #comment .inner{zoom:1;}
.cart #comment .inner:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

.cart #comment .left{
}

.cart #comment .left h2{
	margin-bottom:0.8em;
}

.cart #comment .left p{
	margin-bottom:1em;
}

.cart #comment .right{
	float:right;
	padding-right:3em;
}

/* ---------------------------------------------------------------- */
/* intro */
/* ---------------------------------------------------------------- */
/* リセット */
.cart #intro *{margin:0;padding:0;}
.cart #intro{
	margin-bottom:2em;
}

.cart #intro .inner{
	margin-bottom:5em;
	padding:0 1em;
}
/* clear hack */
.cart #intro .inner{zoom:1;}
.cart #intro .inner:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

.cart #intro .inner .left{
	float:left;
	width:430px;
}

.cart #intro .inner img,
.cart #intro .inner-i img,
.cart #intro .inner-m img{
	float:right;
}

.cart #intro .inner-i{
	margin-bottom:5em;
	padding:0 2.5em 0 1em;
}
/* clear hack */
.cart #intro .inner-i{zoom:1;}
.cart #intro .inner-i:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

.cart #intro .inner-i .left{
	float:left;
	width:520px;
}

.cart #intro .inner-m{
	margin-bottom:5em;
	padding:0 1em 0 1em;
}
/* clear hack */
.cart #intro .inner-m{zoom:1;}
.cart #intro .inner-m:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

.cart #intro .inner-m .left{
	float:left;
	width:300px;
}

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

/* flash：flash（Flashによるシステム開発） */

/* ---------------------------------------------------------------- */
/* ---------------------------------------------------------------- */
/* comment */
/* ---------------------------------------------------------------- */
/* リセット */
.flash #comment *{margin:0;padding:0;}
.flash #comment{
	margin-bottom:2em;
	padding:0 1em;
}

.flash #comment h2{
	margin-bottom:1.2em;
}

/* ---------------------------------------------------------------- */
/* seizu */
/* ---------------------------------------------------------------- */
/* リセット */
.flash #seizu *,
.flash #flex *{margin:0;padding:0;}
.flash #seizu,
.flash #flex{
	margin-bottom:3em;
}

.flash #seizu div,
.flash #flex div{
	margin:0 1em;
}

/* clear hack */
.flash #seizu div,.flash #flex div{zoom:1;}
.flash #seizu div:after,.flash #flex div:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

.flash #seizu img,
.flash #flex img{
	float:right;
}

.flash #seizu p,
.flash #flex p{
	float:left;
	width:380px;
	padding-top:0.5em;
}

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

/* location：location（携帯電話を利用した位置情報取得システム） */

/* ---------------------------------------------------------------- */
/* ---------------------------------------------------------------- */
/* comment */
/* ---------------------------------------------------------------- */
/* リセット */
.location #comment *{margin:0;padding:0;}
.location #comment{
	margin:0 1em 2em;
	padding-top:0.5em;
	background:url('/system/image/location_image.gif') no-repeat 100% 0;
}

.location #comment h2{
	margin-bottom:1em;
}

.location #comment p{
	width: 560px;
	margin-bottom:1.5em;
}

.location #comment .inner{
	margin-bottom:3em;
}
/* clear hack */
.location #comment .inner{zoom:1;}
.location #comment .inner:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

.location #comment .inner p{
	width:auto;
}

.location #comment .inner img{
	float:right;
	margin:0 0 0 1.5em;
}

/* ---------------------------------------------------------------- */
/* example */
/* ---------------------------------------------------------------- */
/* リセット */
.location #example *{margin:0;padding:0;}
.location #example{
	margin:0 0 4em;
	padding-top:0.5em;
}

.location #example .inner{
	padding:0 1em;
}

.location #example h2{
	margin-bottom:1em;
}

.location #example ul{
}

.location #example li{
	list-style:none;
	margin-bottom:1em;
	padding:0.2em 0 0 1.9em;
	background:url('/system/image/mark_check.gif') no-repeat 0 0;
	font-size:1.2em;
	font-weight:bold;
}

.location #example li ul{
	margin:0;
	padding-top:0.3em;
}

.location #example li ul li{
	margin:0;
	padding:0;
	background:none;
	font-size:0.85em;
	font-weight:normal;
}

/* ---------------------------------------------------------------- */
/* Dokokoko */
/* ---------------------------------------------------------------- */
/* リセット */
.location #dokokoko *{margin:0;padding:0;}
.location #dokokoko{
	margin:0 0 2em;
}

.location #dokokoko .inner{
	padding:0 1em;
}
/* clear hack */
.location #dokokoko .inner{zoom:1;}
.location #dokokoko .inner:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

.location #dokokoko .inner .left{
	float:left;
	width:340px;
	padding-top:1em;
}

.location #dokokoko .inner .btn{
	text-align:center;
}

.location #dokokoko .inner .btn img{
	margin-bottom:0.3em;
}

.location #dokokoko .inner .right{
	float:right;
}