@charset "utf-8";

/*　中面共通　//////////////////////////////////////*/

#pan{
	padding-top:10px;
}

#main_area{
	padding:20px 15px 15px 15px;
	margin-left:28px;
	background-color:#fff;
	width:636px;
}

.naka_link a{
	background:url(../img/icon.jpg);
	background-repeat:no-repeat;
	padding-left:20px;
	padding-bottom:3px;

}	
.naka_link p{
	margin-bottom:40px;
}
/*　中面見出し文章　//*/

#naka_top_obi{
	font-size:20px;
	font-weight:bold;
	padding:5px 10px 15px 10px;
	width:616px;
	margin-bottom:20px;
	background:url(../img/line626.jpg);
	background-repeat:no-repeat;
	background-position:bottom left;
	letter-spacing:3px;
	}
.en{
	padding-left:10px;
}
#main_area .top_text span{
	font-size:16px;
	font-weight:bold;
	}
.top_text{
	width:616px;
	padding:0 10px 10px 10px;
	color:#3c1b26;
	margin-bottom:20px;
}
	
#naka_top{
	margin-bottom:30px;
}
.center{
	text-align:center;
}

/*　中面文章　//*/

#naka_under{
	margin-left:80px;
	padding-right:10px;
	}
#naka_under2{
	padding-right:10px;
	}
	
.naka_under_obi{
	background:url(../img/line545.jpg);
	background-repeat:no-repeat;
	background-position:bottom left;
	padding:0px 10px 15px 10px;
	margin-bottom:20px;
	font-size:18px;
	font-weight:bold;
	letter-spacing:3px;
}

.naka_under_obi2{
	background:url(../img/line626.jpg);
	background-repeat:no-repeat;
	background-position:bottom left;
	padding:0px 10px 15px 10px;
	margin-bottom:20px;
	font-size:16px;
	font-weight:bold;
	letter-spacing:3px;
}

.naka_under_obi .cyan,.naka_under_obi2 .cyan{
	color:#00abf2;
}

.under_box{
	margin-bottom:20px;
	}

.naka_left_img{
	margin:0 10px 10px 0;
	float:left;
	padding:5px;
	border:1px solid #CCC;
}
.naka_right_text{
	color:#3c1b26;
}
.naka_link{
	margin-bottom:20px;
}	
.right_btn{
	margin-left:220px;
	margin-bottom:30px;
}


/*　コンセプト　//////////////////////////////////////*/

#conxept_link1 a {
     width: 315px;
     height: 102px;
     overflow: hidden;
     display: block;
	 text-indent:-9999px;
     background: url(../img/concept_btn1.jpg) no-repeat 0 0;
	}
#conxept_link1 a:hover { background: url(../img/concept_btn1.jpg) no-repeat 0 -102px; }

#conxept_link2 a {
     width: 315px;
     height: 102px;
     overflow: hidden;
     display: block;
	 text-indent:-9999px;
     background: url(../img/concept_btn2.jpg) no-repeat 0 0;
	}
#conxept_link2 a:hover { background: url(../img/concept_btn2.jpg) no-repeat 0 -102px; }

#conxept_link3 a {
     width: 315px;
     height: 102px;
     overflow: hidden;
     display: block;
	 text-indent:-9999px;
     background: url(../img/concept_btn3.jpg) no-repeat 0 0;
	}
#conxept_link3 a:hover { background: url(../img/concept_btn3.jpg) no-repeat 0 -102px; }

#conxept_link4 a {
     width: 315px;
     height: 102px;
     overflow: hidden;
     display: block;
	 text-indent:-9999px;
     background: url(../img/concept_btn4.jpg) no-repeat 0 0;
	}
#conxept_link4 a:hover { background: url(../img/concept_btn4.jpg) no-repeat 0 -102px; }

#conxept_link5 a {
     width: 315px;
     height: 102px;
     overflow: hidden;
     display: block;
	 text-indent:-9999px;
     background: url(../img/concept_btn5.jpg) no-repeat 0 0;
	}
#conxept_link5 a:hover { background: url(../img/concept_btn5.jpg) no-repeat 0 -102px; }


/*　お客さんの声　//////////////////////////////////////*/

.voice_text{
	margin-bottom:10px;
}
.naka_link_voice{
	background:url(../img/icon.jpg);
	background-repeat:no-repeat;
	padding-bottom:3px;
	margin-bottom:20px;
	margin-left:470px;
	text-align:right;
}	

.naka_right_text ul{
	margin-bottom:20px;
}

.naka_right_text li{
	color:#00abf2;
	list-style:disc;
	list-style-position:outside;
	margin-left:15px;
	}
	
.naka_right_text li .bla{
	color:#3C1B26;
	}

.center2{
	text-align:center;
	margin:25px 0;
}
.ma20{
	margin-bottom:50px;
}


.order_obi{
	background:url(../img/icon_big.jpg);
	background-repeat:no-repeat;
	padding-left:40px;
	height:22px;
	padding-top:10px;
	font-size:16px;
	font-weight:bold;
	margin-bottom:20px;
	
	}
.order_left{
	padding-left:15px;
	float:left;
	width:255px;
	margin-right:10px;
	}
.order_right{
	float:left;
	width:255px;
	}
	
/*　制作実績　//////////////////////////////////////*/

.naka_right_text .portfolio li{
	color:#00abf2;
	list-style:disc;
	list-style-position:outside;
	margin-left:300px;
	}
.naka_link_port	{
	background:url(../img/icon.jpg);
	background-repeat:no-repeat;
	padding-left:20px;
	padding-bottom:3px;
}

.naka_right_text .portfolio ul.none .naka_link_port{	
	list-style:none;
}

.port_text{
	border:1px solid #CCC;
	padding:15px;
	margin-bottom:30px;
	color:#3C1B26;
	}

.port_text .cyan{
	color:#00abf2;
}

.port_text2{
	margin-bottom:10px;
}

/*　会社概要　//////////////////////////////////////*/
.company{
	border:5px #f5f5f5 solid;
	width:605px;
	margin-bottom:30px;
	padding:20px 0 30px 0;
	padding-left:13px;
	color:#3C1B26;
}
.company_left{
	float:left;
	margin-top:10px;
	margin-right:10px;
	width:191px;
}
.company_left2{
	float:left;
	margin-top:10px;
}
.company_left img{
	margin-bottom:10px;

}

.under_box2 table{
	width:605px;
}
.under_box2 table th{
	width:30%;
	color:#00abf2;
	padding:15px 8px 15px 15px;
	text-align:left;
	border-top: #666 1px solid;
}
.under_box2 table td{
	width:70%;
	color:#3C1B26;
	padding:15px 8px 15px 15px;
	text-align:left;
	border-top:#ccc 1px dotted;
}



/*　プラン　//////////////////////////////////////*/

#new_plan{
	margin-top:120px;
	position:relative;
}

#new_plan .box{
	color:#3c1b26;
	width:555px;
	border:solid #CCC 1px;
	border-top:none;
	padding:40px;
}

/*--------------border*/
.bar{
	height:18px;
	width:636px;
	position:absolute;
	top:-8px;
}
.bar_a{
	background:url(../img/plan/bar_a.jpg) 0 0 repeat-x;
}
.bar_b{
	background:url(../img/plan/bar_b.jpg) 0 0 repeat-x;
}
.bar_c{
	background:url(../img/plan/bar_c.jpg) 0 0 repeat-x;
}
.bar_d{
	background:url(../img/plan/bar_d.jpg) 0 0 repeat-x;
}

/*--------------tab*/
#new_plan ol{
	width:626px;
	position:absolute;
	top:-100px;
	left:4px;
}
#new_plan ol li{
	display:inline;
	float:left;
	margin-left:6px;
	background:yellow;
}
#new_plan ol li a{
	display:block;
	width:149px;
	height:100px;
}
#new_plan ol li a.on{
	display:block;
	width:149px;
	height:190px;
}
#new_plan ol li a:hover{
	display:block;
	width:149px;
	height:190px;
	background:transparent;
}
#new_plan ol li a:hover img{
	visibility:hidden;
}

#new_plan ol .tab1{
	background:url(../img/plan/plan_a_on.jpg) no-repeat;
}
#new_plan ol .tab2{
	background:url(../img/plan/plan_b_on.jpg) no-repeat;
}
#new_plan ol .tab3{
	background:url(../img/plan/plan_c_on.jpg) no-repeat;
}
#new_plan ol .tab4{
	background:url(../img/plan/plan_d_on.jpg) no-repeat;
}

/*--------------title*/
#new_plan h3{
	padding-top:60px;
	margin-bottom:15px;
	font-size:210%;
	font-weight:lighter;
	letter-spacing:0.1em;
}

/*--------------exsample*/
#new_plan .example{
	width:495px;
	position:relative;
	z-index:1;
	padding:20px;
	margin-left:20px;
}
#new_plan h4{
	font-size:140%;
	height:50px;
	letter-spacing:0.1em;
	line-height:50px;
	margin-top:30px;
	margin-bottom:-5px;
	padding-left:80px;
	position:relative;
	z-index:2;
}

/*例えば*/
#new_plan .ex_a{
	background:url(../img/plan/ex_a.gif) no-repeat left center;
}
#new_plan .ex_b{
	background:url(../img/plan/ex_b.gif) no-repeat left center;
}
#new_plan .ex_c{
	background:url(../img/plan/ex_cc.gif) no-repeat left center;
}
#new_plan .ex_d{
	background:url(../img/plan/ex_d.gif) no-repeat left center;
}
/*dot color*/
#new_plan .dot_a{
	border-top:dotted 1px #338eff;
	/*border-bottom:dotted 1px #338eff;*/
}
#new_plan .dot_b{
	border-top:dotted 1px #f24c4c;
	/*border-bottom:dotted 1px #f24c4c;*/
}
#new_plan .dot_c{
	border-top:dotted 1px #acdf3d;
	/*border-bottom:dotted 1px #acdf3d;*/
}
#new_plan .dot_d{
	border-top:dotted 1px #ffbc01;
	/*border-bottom:dotted 1px #ffbc01;*/
}

/*装飾*/
#new_plan .center{
	text-align:center;
	padding-bottom:10px;
}
#new_plan .right{
	float:right;
	margin-left:20px;
}
#new_plan .left{
	float:left;
	width:240px;
	margin-top:30px;
	padding-left:20px;
	padding-right:10px;
}
#new_plan .left h4{
	height:32px;
	line-height:32px;
	background:url(../img/plan/ex_c.png) left top no-repeat;
	padding:0 40px;
	margin:0;
}

#new_plan .end{
	clear:both;
}

/*予算*/
#new_plan dl{
	margin-top:20px;
	margin-left:15px;
}
#new_plan dt{
	display:list-item;
	list-style:disc;
	margin-top:5px;
}
#new_plan .color_a{
	color:#338eff;
}
#new_plan .color_b{
	color:#f24c4c;
}
#new_plan .color_c{
	color:#acdf3d;
	margin-top:0;
	padding-right:10px;
}
#new_plan .color_c2{
	color:#3c1b26;
}
#new_plan .left dl{
	margin-top:10px;
	margin-left:20px;
}
#new_plan .color_d{
	color:#ff9c01;
}

/*order*/
#new_plan .order{
	text-align:right;
	padding-top:15px;
}

/*link*/
#new_plan .box a{
	color:#3c1b26;
}
#new_plan .page{
	background:url(../img/plan/maru_b.jpg) no-repeat right center;
	padding-right:20px;
	margin-top:15px;
	float:right;
}
#new_plan .page2{
	background:url(../img/plan/maru_c.jpg) no-repeat right center;
	padding-right:20px;
	margin-top:15px;
	float:right;
}
#new_plan .page3{
	background:url(../img/plan/maru_a.jpg) no-repeat left center;
	padding-left:20px;
	margin-top:15px;
	margin-left:20px;
}
#new_plan .page4{
	background:url(../img/plan/maru_d.jpg) no-repeat right center;
	padding-right:20px;
	margin-top:15px;
	float:right;
}
#new_plan .page5{
	background:url(../img/plan/maru_b.jpg) no-repeat left center;
	padding-left:20px;
	margin-top:15px;
	margin-left:20px;
}
#new_plan .page6{
	background:url(../img/plan/maru_c.jpg) no-repeat left center;
	padding-left:20px;
	margin-top:15px;
	margin-left:20px;
}


/*　　　採用ページ　　　*/
.rec_box{margin-bottom:30px; position:relative;}

.rec_box .naka_under_obi {
    background: url("../img/line620.jpg") no-repeat scroll left bottom transparent;
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 3px;
    margin-bottom: 20px;
    padding: 0 10px 15px;
}

.rec_box #rec_text{ border:2px solid #258ce1; width:596px; padding:10px; text-align:center; font-size:20px; font-weight:bold; margin:30px 0; line-height:1.5em}

.rec_box .rec_img{background: url("../img/rec_img1.jpg") no-repeat ; height:331px; width:397px; margin:40px auto; position:relative; text-align:center;}
.rec_box .rec_img span{font-weight:bold; font-size:16px; color:#3f2e2f;}

.rec_box .rec_img #text1{ position:absolute; top:60px; left:145px;}
.rec_box .rec_img #text2{ position:absolute; top:215px; left:48px;}
.rec_box .rec_img #text3{ position:absolute; top:215px; left:250px;}
.rec_box .rec_img #text4{ position:absolute; top:60px; left:155px;}
.rec_box .rec_img #text5{ position:absolute; top:215px; left:55px;}
.rec_box .rec_img #text6{ position:absolute; top:215px; left:258px;}