@charset "UTF-8";
@import url("base.css");

/* 全体領域
-----------------------------------*/
body {
	TEXT-ALIGN: center;
	margin-top: 0px;
	MARGIN-right: auto;
	MARGIN-left: auto;
	margin-bottom: 0px;
	background-color: #ffffff;
	background-image: url(../../img/style/body.gif);
	background-repeat: no-repeat;
	background-position: center top;
}

#top_mainimage{
	margin: 2px 0px 0px 0px;
	float: left;
}


/* パンくず
-----------------------------------*/
#pankuzu {
	TEXT-ALIGN: left;
	font-size: 10px;
	margin-top: 5px;
	MARGIN-right: 0px;
	MARGIN-left: 23px;
	margin-bottom: 0px;
	width: 900px;
	height: 13px;
	float: left;
}

#pankuzu ol {
	text-align:left;
	margin: 0;
	padding: 0;
}


#pankuzu #topicPath li {
	float:left;
	list-style-type:none;
	margin-right: 12px;
	padding-left: 12px;
	background-image: url(../../img/base/marker01.gif);
	background-repeat: no-repeat;
	background-position: left center;
}

#pankuzu #topicPath li.topicPath01 {
	background-image:none;
	padding-left:0;
}

#pankuzu #topicPath li a {
	color: #666666;
	text-decoration: none;
}

#pankuzu #topicPath li a:hover{
	color: #ff6600;
	text-decoration: none;
}


/* 左メイン領域
-----------------------------------*/
#left_main {
	TEXT-ALIGN: left;
	margin-top: 15px;
	MARGIN-right: 0px;
	MARGIN-left: 23px;
	margin-bottom: 0px;
	width: 240px;
	float: left;
	display: inline;
}

/* leftnavi */
#leftnavi {
	padding: 0px;
	float: left;
	width: 240px;
	height: 180;
	display: inline;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 13px;
	margin-left: 0px;
}

#leftnavi ul {
	PADDING: 0px; MARGIN: 0px; 
}
#leftnavi li{
    list-style-type:none; 
	PADDING: 0px; MARGIN: 0px; DISPLAY: inline;
}

#leftnavi li.seonavi a {
    display: block; 
    width: 240px;
	height: 45px;
	text-indent:-9877em;
	text-decoration: none;
	background-image: url(../../img/style/seonavis.gif);
	background-repeat: no-repeat;
}
#leftnavi li.flownavi a {
    display: block; 
    width: 240px;
	height: 45px;
	text-indent:-9877em;
	text-decoration: none;
	background-image: url(../../img/style/flownavis.gif);
	background-repeat: no-repeat;
}
#leftnavi li.faqnavi a {
    display: block; 
    width: 240px;
	height: 45px;
	text-indent:-9877em;
	text-decoration: none;
	background-image: url(../../img/style/faqnavis.gif);
	background-repeat: no-repeat;
}
#leftnavi li.privacynavi a {
    display: block; 
    width: 240px;
	height: 45px;
	text-indent:-9877em;
	text-decoration: none;
	background-image: url(../../img/style/privacynavis.gif);
	background-repeat: no-repeat;
}

#leftnavi li.seonavi a:hover,
#leftnavi li.flownavi a:hover,
#leftnavi li.faqnavi a:hover,
#leftnavi li.privacynavi a:hover {
   background-position: -240px 0px;
}

#leftnavi li.seoactive a {
	display: block;
	width: 240px;
	height: 45px;
	text-indent:-9877em;
	text-decoration: none;
	background-image: url(/img/style/seonavis.gif);
	background-repeat: no-repeat;
	background-position: -240px 0px;
}
#leftnavi li.flowactive a {
    display: block; 
    width: 240px;
	height: 45px;
	text-indent:-9877em;
	text-decoration: none;
	background-image: url(/img/style/flownavis.gif);
	background-repeat: no-repeat;
	background-position: -240px 0px;
}
#leftnavi li.faqactive a {
    display: block; 
    width: 240px;
	height: 45px;
	text-indent:-9877em;
	text-decoration: none;
	background-image: url(/img/style/faqnavis.gif);
	background-repeat: no-repeat;
	background-position: -240px 0px;
}
#leftnavi li.privacyactive a {
    display: block; 
    width: 240px;
	height: 45px;
	text-indent:-9877em;
	text-decoration: none;
	background-image: url(/img/style/privacynavis.gif);
	background-repeat: no-repeat;
	background-position: -240px 0px;
}


/* 右メイン領域
-----------------------------------*/
#right_main {
	text-align: left;
	margin-top: 15px;
	MARGIN-right: 40px;
	MARGIN-left: 0px;
	margin-bottom: 0px;
	width: 607px;
	float: right;
	display: inline;
}

h3 span { display: none}

.title01 { background-image: url(../../img/style/c_fee.gif); background-repeat: no-repeat; }
.title02 { background-image: url(../../img/style/peculiarity.gif); background-repeat: no-repeat; }
.title03 { background-image: url(../../img/style/point.gif); background-repeat: no-repeat; }
.title04 { background-image: url(../../img/style/web_d.gif); background-repeat: no-repeat; }
.title05 { background-image: url(../../img/style/merit.gif); background-repeat: no-repeat; }
.title06 { background-image: url(../../img/style/service.gif); background-repeat: no-repeat; }
.title07 { background-image: url(../../img/style/portfolio.gif); background-repeat: no-repeat; }
.title08 { background-image: url(../../img/style/recruit.gif); background-repeat: no-repeat; }
.title09 { background-image: url(../../img/style/desieditor.gif); background-repeat: no-repeat; }
.title10 { background-image: url(../../img/style/company_p.gif); background-repeat: no-repeat; }
.title11 { background-image: url(../../img/style/access.gif); background-repeat: no-repeat; }
.title12 { background-image: url(../../img/style/inquiry.gif); background-repeat: no-repeat; }
.title13 { background-image: url(../../img/style/inquiry2.gif); background-repeat: no-repeat; }
.title14 { background-image: url(../../img/style/inquiry3.gif); background-repeat: no-repeat; }
.title15 { background-image: url(../../img/style/seo.gif); background-repeat: no-repeat; }
.title16 { background-image: url(../../img/style/policyofsun.gif); background-repeat: no-repeat; }
.title17 { background-image: url(../../img/style/workflow.gif); background-repeat: no-repeat; }

#gazo {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 15px;
	float: right;
}

.cf_img {
	width: 607px;
	text-align: center;
	float: left;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 30px;
	margin-left: 0px;
}


/* 成功報酬・デザイン　ポイント
-----------------------------------*/
#s_list {
	width: 591px;
	font-size: 75%;
	margin-left: 16px;
	float: left;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 20px;
	display: inline;
}

#s_list dl.serviceList {
	margin: 0 0 20px;
}

#s_list dl.serviceList dt {
	position: relative;
	width: 511px;
	margin-bottom: 2px;
	padding-top: 5px;
	padding-left: 80px;
	font-weight: bold;
}

#s_list dl.serviceList dt.firstChild,
#s_list dl.serviceList dt:first-child {
	border-top: 0;
	padding-top: 0;
}

#s_list dl.serviceList dt img {
	position: absolute;
	top: 5px;
	left: 0;
}

#s_list dl.serviceList dt.firstChild img,
#s_list dl.serviceList dt:first-child img {
	top: 0;
}

#s_list dl.serviceList dd {
	margin-bottom: 10px;
	padding-left: 40px;
	height: 55px;
}

#s_list dl.serviceList > dd {
	min-height: 55px;
	height: auto;
}



/* 制作実績
-----------------------------------*/
.p_folio {
	width: 607px;
	height: 140px;
	line-height: 17px;
	margin-top: 45px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	float: left;
}

.p_folio a { color: #434343; }
.p_folio a:visited { color: #434343; } 
.p_folio a:hover {	color: #FF6600; text-decoration: underline; } 

.p_folio2 {
	width: 607px;
	height: 145px;
	line-height: 17px;
	margin-top: 45px;
	margin-right: 0px;
	margin-bottom: 40px;
	margin-left: 0px;
	float: left;
}

.p_folio2 a { color: #434343; }
.p_folio2 a:visited { color: #434343; } 
.p_folio2 a:hover {	color: #FF6600; text-decoration: underline; } 

.p_gazo {
	width: 190px;
	height: 140px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	float: left;
}

.r_box {
	width: 397px;
	float: right;
}

.r_name {
	height: 19px;
	width: 397px;
    font-size: 75%;
    line-height: 17px;
	float: right;
	font-weight: bolder;
	color: #404040;
	display: inline;
	background-image: url(../../img/style/p_line.gif);
	background-repeat: repeat-x;
	margin-top: 0px;
	margin-bottom: 4px;
	margin-left: 0px;
	margin-right: 0px;
}



/* 採用情報・会社概要
-----------------------------------*/
#recruitbox {
	width: 578px;
	font-size: 75%;
	float: left;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 40px;
	margin-left: 8px;
}

#recruitbox dl {   
    width: 578px; 
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 8px; 
}  

#recruitbox dl a {
	color: #434343; 
}

#recruitbox dl a:hover {
	color: #434343; 
}

#recruitbox dt {
	float: left;
	width: 70px;
	clear: both;
	text-align: left;
	background-image: url(../../img/index/marker.gif);
	background-repeat: no-repeat;
	background-position: right;
	padding-top: 4px;
	padding-right: 0px;
	padding-bottom: 4px;
	padding-left: 0px;
}
  
#recruitbox dd {
	width: 458px;
	margin-left: 72px;
	padding-top: 4px;
	padding-right: 0px;
	padding-bottom: 4px;
	padding-left: 0px;
}



/* 会社概要
-----------------------------------*/
#map {
	width: 575px;
	height:250px;
	float: left;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 40px;
	margin-left: 16px;
}


/* 制作の流れ
-----------------------------------*/

#flow1 {
	width: 591px;
	height: 61px;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 16px;
	background-image: url(../../img/style/flow1.gif);
	float: left;
	background-color: #eeeeee;
	background-repeat: no-repeat;
	background-position: left top;
}

#flow2 {
	width: 591px;
	height: 61px;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 16px;
	background-image: url(../../img/style/flow2.gif);
	float: left;
	background-color: #eeeeee;
	background-repeat: no-repeat;
	background-position: left top;
}

#flow3 {
	width: 591px;
	height: 61px;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 16px;
	background-image: url(../../img/style/flow3.gif);
	float: left;
	background-color: #eeeeee;
	background-repeat: no-repeat;
	background-position: left top;
}

#flow4 {
	width: 591px;
	height: 90px;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 16px;
	background-image: url(../../img/style/flow4.gif);
	float: left;
	background-color: #eeeeee;
	background-repeat: no-repeat;
	background-position: left top;
}

#flow5 {
	width: 591px;
	height: 90px;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 16px;
	background-image: url(../../img/style/flow5.gif);
	float: left;
	background-color: #eeeeee;
	background-repeat: no-repeat;
	background-position: left top;
}

#flow6 {
	width: 591px;
	height: 61px;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 16px;
	background-image: url(../../img/style/flow6.gif);
	float: left;
	background-color: #eeeeee;
	background-repeat: no-repeat;
	background-position: left top;
}

#flow7 {
	width: 591px;
	height: 61px;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 16px;
	background-image: url(../../img/style/flow7.gif);
	float: left;
	background-color: #eeeeee;
	background-repeat: no-repeat;
	background-position: left top;
}

#flow8 {
	width: 591px;
	height: 61px;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 40px;
	margin-left: 16px;
	background-image: url(../../img/style/flow8.gif);
	float: left;
	background-color: #eeeeee;
	background-repeat: no-repeat;
	background-position: left top;
}

#flow1 span { display: none;}
#flow2 span { display: none;}
#flow3 span { display: none;}
#flow4 span { display: none;}
#flow5 span { display: none;}
#flow6 span { display: none;}
#flow7 span { display: none;}
#flow8 span { display: none;}

.tt_field {
	width: 513px;
	height: 32px;
	float: right;
	padding: 0px;
	background-color: #f6f6f6;
	margin-top: 29px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

.tt_field2 {
	width: 513px;
	float: right;
	padding: 0px;
	background-color: #f6f6f6;
	margin-top: 29px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

.in_coments {
	FLOAT: left;
	width: 513px;
	height: 32px;
	font-size: 75%;
	line-height: 30px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-left: 9px;
	padding-top: 0px;
	padding-right: 0px;
}

.in_coments2 {
	FLOAT: left;
	width: 513px;
	height: 50px;
	font-size: 75%;
	margin-top: 9px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-left: 9px;
	padding-top: 0px;
	padding-right: 0px;
}

.n_step {
	margin-top: 10px;
	margin-bottom: 0px;
	margin-left: 315px;
	margin-right: 0px;
	float: left;
}



