@charset "utf-8";

@import "./common.css";
/*==================================================================*/

/* style css */

/*==================================================================*/
body{background:url('../image/back.gif') repeat-x 0 0;}
#wrapper{width:920px;}


/* ---------------------------------------------------------------- */
/* mainvisual：メインビジュアル */
/* ---------------------------------------------------------------- */
#mainvisual{
	margin:0 auto;
}

/* ---------------------------------------------------------------- */
/* read：リード文 */
/* ---------------------------------------------------------------- */
#read{
	margin:1em 24px;
	padding:0;
	border:none;
	font-size:1em;
	font-weight:normal;
}

/* ---------------------------------------------------------------- */
/* result：実績紹介 */
/* ---------------------------------------------------------------- */
/* リセット */
#result *{margin:0;padding:0;}
#result img{vertical-align:bottom;}

#result{
	margin:0 auto 2em;
	width:912px;
	background:url('../image/result_bottom.gif') no-repeat 0 100% #eefe8e;
}
/* clear hack */
#result{zoom:1;}
#result:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

/* 見出し */
#result .headline{
	margin:0 0 12px;
	background:url('../image/result_top.gif') no-repeat 0 0;
}
/* clear hack */
#result .headline{zoom:1;}
#result .headline:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

#result h2{
	float:left;
	width:148px;
}
/* 詳細 */
#result p{
	float:right;
	width:148px;
	text-align:right;
}

/* 事例 */
#result .block{margin:0 0 0.5em;}
/* clear hack */
#result .block{zoom:1;}
#result .block:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

#result dl{
	width:152px;
	float:left;
	text-align:center;
}
#result dt{
	margin:0 auto 6px;
	padding:2px 0;
	background:url('../image/_result_cap.gif') no-repeat 0 0;
	width:142px;
	font-size:0;
}

#result dd{
	padding:0 6px;
	line-height:1.3;
	font-size:0.81em;
}
#result dd a{color:#333;}
#result dd a:hover{color:#ff1741;}

/* ---------------------------------------------------------------- */
/* box */
/* ---------------------------------------------------------------- */
.box{
	margin:0 auto 2em;
	width:920px;
}
.box{zoom:1;}
.box:after{content:".";clear:both;height:0;display:block;visibility:hidden;}


/* ---------------------------------------------------------------- */
/* news */
/* ---------------------------------------------------------------- */
/* リセット */
#news *{margin:0;padding:0;}
#news img{vertical-align:bottom;}

#news{
	margin:7px auto 0;
	float:left;
	width:446px;
	background:url('../image/news_back.gif') repeat-y 0 100%;
}
/* clear hack */
#news{zoom:1;}
#news:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

#news .headline{
	background:url('../image/news_top.gif') no-repeat 0 0;
}
/* clear hack */
#news .headline{zoom:1;}
#news .headline:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

#news .headline h2{
	float:left;
	width:244px;
}

#news .headline p{
	padding:4px 0 0;
	float:right;
	width:120px;
	text-align:right;
}
#news .headline p a{
	padding:0 6px 0 18px;
	color:#333;
	background:url('/common_img/arrow.gif') no-repeat 0 48%;
}
#news .headline p a:hover{color:#ff1741;}
#news .headline p img{
	margin:0 4px 0 0;
	vertical-align:middle;
}

#news .block{
	margin:0 6px 0 0;
	height:152px;
	overflow:auto;
	scrollbar-arrow-color:#ccc;
	scrollbar-face-color:#fff;
	scrollbar-track-color:#fff;
	scrollbar-3dlight-color:#ccc;
	scrollbar-darkshadow-color:#ccc;
	scrollbar-highlight-color:#fff;
	scrollbar-shadow-color:#fff;
}

#news dl{
	margin:0 12px 12px 16px;
	border-bottom:1px solid #e5e5e5;
}
#news dt{
	margin:0 0 6px;
	padding:2px 0 0;
	width:136px;
	line-height:15px;
	font-weight:bold;
	text-indent:12px;
}
#news .site dt{background:url('../image/news_site.gif') no-repeat 106px 52% #5fc7ff;}
#news .news dt{background:url('../image/news_news.gif') no-repeat 106px 52% #e1ff1c;}

#news dt img{
	margin:0 0 0 9px;
	vertical-align:middle;
}

#news dd{
	margin:0 0 6px;
	line-height:1.4;
}

#news dd a{color:#333;}
#news dd a:hover{color:#ff1741;}

#news dd span{
	padding:0 0 0 6px;
	color:#ff1741;
	font-weight:bold;
	font-family:Verdana,Chicago,sans-serif;
}
#news p.bottom{
	margin:0;
	padding:0;
	width:446px;
	font-size:0;
	line-height:0;
}
#news p.bottom img{
	margin:0;
	vertical-align:bottom;
}

/* ---------------------------------------------------------------- */
/* secret */
/* ---------------------------------------------------------------- */
#secret{
	width:454px;
	float:right;
	font-size:0;
}
#secret img{margin:0 0 0;}


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

/* contents */

/* ---------------------------------------------------------------- */
#contents{
	float:right;
	width:656px;
}

/* ---------------------------------------------------------------- */
/* service */
/* ---------------------------------------------------------------- */
/* リセット */
#service *{margin:0;padding:0;}
#service img{vertical-align:bottom;}

#service{
	margin:0 auto 2em;
	padding:0 0 12px;
	width:656px;
	background:url('../image/service_back.jpg') repeat-y 0 0;
}
/* clear hack */
#service{zoom:1;}
#service:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

#service h3{
	margin:0 0 12px;
	background:url('../image/service_top.gif') no-repeat 0 0;
}

#service .block{
	float:left;
	width:216px;
}
#service h4{
	margin:0 8px;
	padding:6px 0;
}

#service dl{
	margin:0 auto;
	width:200px;
}
#service dt{
	margin:0 6px;
	padding:12px 6px;
	line-height:1.5;
	background:#fff;
	letter-spacing:0;
}
#service dd{
	margin:0 6px;
	background:#fff;
}

#service li{
	list-style:none;
	padding:4px 0;
}
#service li a{
	padding:0 6px 0 24px;
	line-height:1.4;
	display:block;
	color:#333;
	background:no-repeat 6px 5px;
}
#service li.odd{background-color:#e8e8e8;}

#service li.other{
	padding-left:12px;
	color:#fff;
	background:#ea132c;
	font-weight:bold;
}

#service p{
	margin:0 8px;
	padding:0 12px;
	line-height:2em;
	text-align:right;
}
#service p a{
	margin:0 0 0 auto;
	padding:0 0 0 18px;
	display:block;
	width:102px;
	color:#fff;
}

/* color */
/* -------------------------------- */
#service #web{width:220px;}
#service #web dl,#service #web p{margin-left:12px;}
#service #web h4{margin:0 0 0 4px;background:url('../image/service_web_back.gif') repeat-y 0 0;}
#service #web dl,#service #web p{background:#ea132c;}
#service #web li a{background-image:url('../image/service_web_listmark.gif');}
#service #web p a{background:url('../image/service_web_arrow.gif') no-repeat 24px 48%;}

#service #system h4,#service #system dl,#service #system p{background:#ff8126;}
#service #system li a{background-image:url('../image/service_system_listmark.gif');}
#service #system p a{background:url('../image/service_system_arrow.gif') no-repeat 24px 48%;}

#service #consul h4,#service #consul dl,#service #consul p{background:#7edf15;}
#service #consul li a{background-image:url('../image/service_consul_listmark.gif');}
#service #consul p a{background:url('../image/service_consul_arrow.gif') no-repeat 24px 48%;}


/* ---------------------------------------------------------------- */
/* faq */
/* ---------------------------------------------------------------- */
/* リセット */
#faq *{margin:0;padding:0;}
#faq img{vertical-align:bottom;}

#faq{
	margin:0 0 2em;
	padding:0 0 9px;
	width:656px;
	background:url('../image/faq_bottom.gif') no-repeat 0 100%;
}

#faq .headline{background:url('../image/faq_top.gif') no-repeat 0 0;}
/* clear hack */
#faq .headline{zoom:1;}
#faq .headline:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

#faq .headline h3{
	float:left;
	width:193px;
}
#faq .headline p{
	margin:6px 0 0;
	float:right;
	width:120px;
	line-height:25px;
	text-align:right;
}
#faq .headline p a{
	padding:0 6px 0 18px;
	color:#333;
	background:url('/common_img/arrow.gif') no-repeat 0 48%;
}
#faq p a:hover{color:#ff1741;}

#faq .headline p img{
	margin:0 4px 0 0;
	vertical-align:middle;
}

#faq .block{
	padding:12px 28px;
	background:url('../image/faq_back.gif') repeat-y 0 0;
	zoom:1;
}

#faq dl{
	margin:0 0 6px;
	line-height:1.5;
}
/* clear hack */
#faq dl{zoom:1;}
#faq dl:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

#faq dt{
	float:left;
	width:132px;
	background:#000;
	font-size:11px;
	text-align:center;
}
/* 価格 */
#faq dt.price-line{border-left:5px solid #002cbd;}
/* web制作 */
#faq dt.web-line{border-left:5px solid #bd0016;}
/* system */
#faq dt.system-line{border-left:5px solid #e0670f;}
/* コンサル */
#faq dt.consul-line{border-left:5px solid #7dc133;}
/* カート */
#faq dt.cart-line{border-left:5px solid #0069d1;}
/* リクルート */
#faq dt.recruit-line{border-left:5px solid #009fb2;}

#faq dt.price-line{border-left:5px solid #002cbd;}
#faq dt a{
	padding:3px 0 0;
	color:#fff;
	display:block;
}
#faq dt a:hover{
	background:#666;
	text-decoration:none;
}

#faq dd{
	padding:3px 0 0;
	float:right;
	width:444px;
}
#faq dd a{
	display:block;
	color:#333;
}
#faq dd a:hover{color:#ff1741;}


/* ---------------------------------------------------------------- */
/* other */
/* ---------------------------------------------------------------- */
/* リセット */
#other *{margin:0;padding:0;}
#other img{vertical-align:bottom;}

#other dl{
	float:left;
	width:210px;
	text-align:center;
	padding:3px;
	margin-bottom:7px;
}
#other dd{
	font-size:10px;
	width:210px;
}

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


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

/* menu */

/* ---------------------------------------------------------------- */
#menu{
	float:left;
	width:244px;
}

/* ---------------------------------------------------------------- */
/* m-staff */
/* ---------------------------------------------------------------- */
#menu #m-staff{
	margin:0 0 2em 4px;
	width:240px;
}
#menu #m-staff h3{margin:0 0 6px;}

#menu #m-staff p.comment{
	margin:0 0 12px;
	padding:0 12px;
	line-height:2;
}

#menu #m-staff dl{
	padding:0 6px 6px;
}
/* clear hack */
#menu #m-staff dl{zoom:1;}
#menu #m-staff dl:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

#menu #m-staff dt{
	float:left;
	width:72px;
}

#menu #m-staff dd{
	float:right;
	width:138px;
	line-height:1.5;
}
#menu #m-staff dd a{color:#333;}

#menu #m-staff p.more{
	padding:0 12px;
	line-height:2em;
	text-align:right;
}
#menu #m-staff p.more a{
	margin:0 0 0 auto;
	padding:0 0 0 18px;
	display:block;
	width:82px;
	color:#333;
	background-repeat:no-repeat;
	background-position:24px 48%;
}
/* -------------------------------- */
#menu .pink{background:url('../image/staff_back_pink.gif') repeat-x 0 0 #ffbfe3;}
#menu .pink p.comment,#menu .pink p.more{background:#ffddf1;}
#menu .pink p.more a{background:url('../image/staff_arrow_pink.gif');}

#menu .orange{background:url('../image/staff_back_orange.gif') repeat-x 0 0 #ffd817;}
#menu .orange p.comment,#menu .orange p.more{background:#ffec23;}
#menu .orange p.more a{background:url('../image/staff_arrow_orange.gif');}

#menu .blue{background:url('../image/staff_back_blue.gif') repeat-x 0 0 #9ce1ff;}
#menu .blue p.comment,#menu .blue p.more{background:#c7f0ff;}
#menu .blue p.more a{background:url('../image/staff_arrow_blue.gif');}

#menu .green{background:url('../image/staff_back_green.gif') repeat-x 0 0 #e1ff1c;}
#menu .green p.comment,#menu .green p.more{background:#f9ff32;}
#menu .green p.more a{background:url('../image/staff_arrow_green.gif');}


/* ---------------------------------------------------------------- */
/* m-blog */
/* ---------------------------------------------------------------- */
#menu #m-blog{
	margin:0 0 2em 4px;
	width:240px;
	background:url('../image/blog_back.gif') repeat-x 0 0 #5fc7ff;
}
#menu #m-blog .headline{margin:0 0 12px;}
/* clear hack */
#menu #m-blog .headline{zoom:1;}
#menu #m-blog .headline:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

#menu #m-blog .headline h3{
	float:left;
	width:193px;
}
#menu #m-blog .headline p{
	padding:6px 0 0;
	width:12px;
	float:right;
}

#menu #m-blog li{
	padding:0 12px;
	list-style-type:none;
	zoom:1;
}
#menu #m-blog li.even{background:#9ce1ff;}

#menu #m-blog li a{
	padding:3px 0 3px 24px;
	display:block;
	color:#333;
	background:url('../image/blog_listmark.gif') no-repeat 0 4px;
	line-height:1.5;
}

#menu #m-blog p.more{
	padding:0 12px;
	line-height:2em;
	text-align:right;
}
#menu #m-blog p.more a{
	margin:0 0 0 auto;
	padding:0 0 0 18px;
	display:block;
	width:82px;
	color:#333;
	background:url('../image/blog_arrow.gif') no-repeat 24px 48%;
}
#menu #m-blog p.more a:hover{color:#ff1741;}

/* ---------------------------------------------------------------- */
/* m-banner */
/* ---------------------------------------------------------------- */
#menu .m-banner dl{width:240px;}

/* ---------------------------------------------------------------- */
/* m-magazine */
/* ---------------------------------------------------------------- */
#menu #m-magazine{
	margin:0 0 1em 4px;
	padding:12px 0;
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
	width:240px;
	background:url('../image/magazine_back.gif') no-repeat 0 50%;
}

#menu #m-magazine h4{
	padding:0 0 0 50px;
	font-size:15px;
}
#menu #m-magazine h4 a{
	padding:0 18px 0 0;
	display:block;
	color:#333;
	background:url('/common_img/arrow.gif') no-repeat 70% 48%;
}
#menu #m-magazine h4 a:hover{color:#ff1741;}
#menu #m-magazine p{padding:0 0 0 50px;}


/* ---------------------------------------------------------------- */
/* m-mobile */
/* ---------------------------------------------------------------- */
#menu #m-mobile{
	margin:0 0 1em 4px;
	width:240px;
	background:#5fc7ff;
}

#menu #m-mobile h4{margin:0 0 6px;}
#menu #m-mobile dl{
	margin:0 auto 12px;
	width:216px;
}
/* clear hack */
#menu #m-mobile dl{zoom:1;}
#menu #m-mobile dl:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

#menu #m-mobile dt{
	float:left;
	width:105px;
}
#menu #m-mobile dd{
	margin:24px 0 0;
	float:right;
	width:93px;
}

#menu #m-mobile p{
	line-height:2;
	background:#9ce1ff;
	text-align:center;
}

/* ---------------------------------------------------------------- */
/* m-other */
/* ---------------------------------------------------------------- */
#menu #m-other{margin:0 0 1em 4px;}
#menu #m-other ul{list-style-type:none;}
#menu #m-other li{
	padding-left:17px;
	background:url('/common_img/arrow.gif') no-repeat 0 3px;}

#menu #m-other a{color:#000;}

/* ---------------------------------------------------------------- */
/* notfound： */
/* ---------------------------------------------------------------- */
/* リセット */
#notfound *{margin:0;padding:0;}
#notfound img{vertical-align:bottom;}

#notfound{
	width:864px;
	margin:8em auto 10em;
}
/* clear hack */
#notfound{zoom:1;}
#notfound:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

#notfound .left{
	float:left;
}

#notfound .right{
	float:right;
}

#notfound .right ul{
	list-style:none;
	padding-top:30px;
}
/* clear hack */
#notfound .right ul{zoom:1;}
#notfound .right ul:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

#notfound .right li{
	float:left;
	margin-right:2em;
}

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