@charset "utf-8";
/*++++++++++++++++++++++++++++++++++++++++++
CSS Document
+++++++++++++++++++++++++++++++++++++++++++*/
* {
	margin: 0;
	padding: 0;
}
img {
	border: 0;
}

body {
	margin:auto;
	padding: 0px;
	font-size: small;
	background: #fff;
	height:100%;
}
body/**/ {
	font-size: /**/small;
}
p,h1,h2,h3,h4,h5,ul,li,ol,dl,dt,dd {
	padding: 0px;
	margin: 0px;
}
/*++++++++++++++++++++++++++++++++++++++++++
リンク
+++++++++++++++++++++++++++++++++++++++++++*/
a,a:visited {
	color: #383f44;
}
a:hover {
	color: #383f44;
	text-decoration: none;
}
a img {
	border: none;
}
.clear{
	clear: both;
}
.clear hr{
	display: none;
}

.cl{
    display: inline-block;  
   }
 
 
.clearfix:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    
clear: both;
height: 0;
}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */
.clear{
	clear: both;
}

/*++++++++++++++++++++++++++++++++++++++++++
全体
+++++++++++++++++++++++++++++++++++++++++++*/
#wrapper{
	margin:auto;
	background-color: #ffffff;
  	width: 900px; 
}
/*++++++++++++++++++++++++++++++++++++++++++
ヘッダー
+++++++++++++++++++++++++++++++++++++++++++*/
#header{
	text-align: left;
	width: 900px;
}

#head_left{
	float: left;
	width: 180px;
	padding-top:5px;
}

#head_right{
	float: right;
	text-align: right;
	padding-right: 10px;
	width: 690px;
	font-size: 12px;
}
#head_right img{
	margin-bottom:10px;
}


/*++++++++++++++++++++++++++++++++++++++++++
グローバルナビ
+++++++++++++++++++++++++++++++++++++++++++*/

#gnavi_base {
	text-align: left;
	width: 900px;
	height: 37px;
	background: url(../images/navi-bg.gif) repeat-x;
}

#navi_left{
	float: left;
	width: 882px;
	height: 29px;
	margin-top:4px;
}
    #navi_left ul {
	    list-style-type: none;
	    margin: 0px;
    }

        #navi_left ul li {
	        float: left;
	        height: 29px;
	        width: 147px;
        }

        #navi_left ul li a {
	        background: url(../images/navi.gif) no-repeat scroll 0 0;
	        height: 29px;
	        display: block;
	        width: 147px;
        }

        #navi_left ul li span {
	        overflow: hidden;
	        z-index: -1;
	        position: relative;
	        display: block;
        }
        
        #navi_left ul li.home a {background-position: 0px 0px;}
        #navi_left ul li.merit a {background-position: -147px 0px;}
        #navi_left ul li.riyou a {background-position: -294px 0px;}
        #navi_left ul li.case a {background-position: -441px 0px;}
        #navi_left ul li.zirei a {background-position: -588px 0px;}
        #navi_left ul li.plan a {background-position: -735px 0px;}
        #navi_left ul li.home a:hover {background-position: 0px -29px;}
        #navi_left ul li.merit a:hover {background-position: -147px -29px;}
        #navi_left ul li.riyou a:hover {background-position: -294px -29px;}
        #navi_left ul li.case a:hover {background-position: -441px -29px;}
        #navi_left ul li.zirei a:hover {background-position: -588px -29px;}
        #navi_left ul li.plan a:hover {background-position: -735px -29px;}


/*++++++++++++++++++++++++++++++++++++++++++
メイン
+++++++++++++++++++++++++++++++++++++++++++*/
#main{
	text-align: left;
	width: 900px;
	background-color:#E6F4FB;
	padding:5px 0px;
}

/*++++++++++++++++++++++++++++++++++++++++++
メイン(上部分）
+++++++++++++++++++++++++++++++++++++++++++*/
#main #main_top{
	text-align: left;
	width: 880px;
	margin:5px 10px;
	height:205px;
}

#main #main_top #top_left{
	float:left;
	text-align: left;
	width: 579px;
}

#main #main_top #top_right{
	float:right;
	text-align: left;
	width: 288px;
	height:204px;
}

#main #main_top #top_right .news-area{
	background-color:#F0F2F2;
	padding:2px 5px;
	border-bottom: 1px solid #3cb5ed;
	border-right: 1px solid #3cb5ed;
	border-left: 1px solid #3cb5ed;
	width: 279px;
	height:168px;
	overflow-y:scroll;
	scrollbar-face-color: #ffffff;      
	scrollbar-3dlight-color: #3cb5ed;   
	scrollbar-highlight-color: #ffffff; 
	scrollbar-shadow-color: #ffffff;   
	scrollbar-darkshadow-color: #3cb5ed;
	scrollbar-arrow-color: #3cb5ed;     
	scrollbar-track-color: #ffffff;     
}

#main #main_top #top_right .news-area dl{margin-bottom:5px;}
#main #main_top #top_right .news-area dd{padding-left:10px;}

/*++++++++++++++++++++++++++++++++++++++++++
メイン(下部分）
+++++++++++++++++++++++++++++++++++++++++++*/
#main #main_bottom{
	text-align: left;
	width: 820px;
	margin:0px 40px;
	font-size:12px;
}
#main #main_bottom #first{
	background:#FFFFFF;
	padding:10px 20px;
	margin-top:20px;
	line-height:200%;
}

#main #main_bottom h3{
	margin-top:20px;
}
#main #main_bottom .con{
	margin-left:20px;
	widht:680px;
	padding:10px 20px;
	background:#FFFFFF;
}
#main #main_bottom .con p{
	line-height:170%;
}
#main #main_bottom .con .cms{
 	margin-top:10px;
	line-height:0;
	background:url(../images/cms_2.jpg) repeat-y;
}
#main #main_bottom .con .cms_bg{
	padding:10px 20px;
	width:714px;
	line-height:100%;
}
#main #main_bottom .con .cms_bg p{
	color:#717171;
}
#main #main_bottom .con .cms_bg .cms_a{
	float:left;
	margin-top:10px;
}
#main #main_bottom .con .cms_bg .cms_a ul{
	list-style:none;
	float:left;
}
#main #main_bottom .con .cms_bg .cms_a ul li{
	line-height:150%;
}
#main #main_bottom .con .cms_bg .cms_a ul li.pic{
	font-weight:bold;
	font-size:14px;
}
#main #main_bottom .con .cms_bg .cms_a ul li label{
	color:#9DC100;
	margin-right:5px;
}
#main #main_bottom .con .cms_bg .cms_a img{
	margin-top:20px;
	margin-left:10px;
}
#main #main_bottom .con .cms_bg .cms_b{
	float:right;
	padding-top:10px;
}
#main #main_bottom .con .con_top{
	padding:10px 0px;
	_height:0px;
}
#main #main_bottom .con .con_top .con_top_box{
	width:347px;
	height:80px;
	padding-left:15px;
	padding-right:15px;
	padding-top:10px;
	float:left;
}
#main #main_bottom .con .con_top img{
	float:left;
	margin-right:20px;
}
#main #main_bottom .con .con_top p{
	margin-top:10px;
	font-size:14px;
}
#main #main_bottom .con .con_top .o_a{
	border-right:1px dashed #00A0E9;
	border-bottom:1px dashed #00A0E9;
}
#main #main_bottom .con .con_top .o_b{
	border-bottom:1px dashed #00A0E9;
}
#main #main_bottom .con .con_top .o_c{
	border-right:1px dashed #00A0E9;
}
#main #main_bottom .con .con_top .o_d{
	border-right:1px dashed #CEDD43;
	border-bottom:1px dashed #CEDD43;
}
#main #main_bottom .con .con_top .o_e{
	border-bottom:1px dashed #CEDD43;
}
#main #main_bottom .con .con_top .o_f{
	border-right:1px dashed #CEDD43;
}
#main #main_bottom .con .con_top .con_top_box2{
	width:720px;
	height:60px;
	padding-left:15px;
	padding-right:15px;
	padding-top:10px;
}
/*++++++++++++++++++++++++++++++++++++++++++
ＨＰを持つメリット
+++++++++++++++++++++++++++++++++++++++++++*/
#main #main_bottom .melit_box{
	width:400px;
	height:172px;
	margin-top:10px;
	color:#FFFFFF;
	float:left;
	margin-left:10px;
	_margin-left:5px;
}
#main #main_bottom .melit{
	width:820px;
}
#main #main_bottom .melit_box h4{
	font-size:20px;
	margin-left:20px;
	margin-top:10px;
	width:300px;
	font-weight:bold;
}
#main #main_bottom .melit_box p{
	margin-top:10px;
	font-size:14px;
	line-height:150%;
	margin-right:10px;
	margin-left:130px;
}

#main #main_bottom .m_a{
	background:url(../images/melit_1.jpg) no-repeat;
	margin-top:20px;
}
#main #main_bottom .m_b{
	background:url(../images/melit_2.jpg) no-repeat;
	margin-top:20px;
}
#main #main_bottom .m_c{
	background:url(../images/melit_3.jpg) no-repeat;
}
#main #main_bottom .m_d{
	background:url(../images/melit_4.jpg) no-repeat;
}
#main .flow_img{
	margin-top:20px;
}

#main #main_bottom .melit_box2{
	width:370px;
	margin-top:10px;
	color:#FFFFFF;
	background:#00A0E9;
	float:left;
	margin-left:10px;
	padding:15px;
	_margin-left:5px;
}
#main #main_bottom .melit_box2 h4{
	font-size:20px;
	text-align:center;
	font-weight:bold;
	margin-bottom:10px;
}
#main #main_bottom .melit_box3{
	background:#DFEDEF;
	margin-bottom:15px;
	padding:10px;
}
#main #main_bottom .melit_box3 td{
	padding-left:10px;
}
#main #main_bottom .melit_box2 p{
	font-size:14px;
	color:#666666;
	line-height:150%;
}
#main #main_bottom .melit_box2 h5{
	font-size:20px;
	text-align:left;
	font-weight:bold;
	margin-bottom:10px;
}
/*++++++++++++++++++++++++++++++++++++++++++
利用イメージ
+++++++++++++++++++++++++++++++++++++++++++*/
#main #second_bottom #riyou_head{
	text-align:center;
	width: 780px;
	padding:10px;
	font-size:20px;
	color:#FFFFFF;
	margin-top:20px;
	margin-left:20px;
	background:#00A0E9;
}
#main #second_bottom #riyou_head a{
	color:#FFFFFF;
}
#main #second_bottom .riyou_con{
	margin:30px;
}
#main #second_bottom .riyou_con h5{
	border-bottom:2px solid #00A0E9;
	font-size:16px;
	color:#00A0E9;
	font-weight:bold;
}
#main #second_bottom .riyou_con .img_box{
	margin-top:20px;
	padding-bottom:20px;
	border-bottom:2px dotted #00A0E9;
}
#main #second_bottom .riyou_con p{
	margin:20px;
}
/*++++++++++++++++++++++++++++++++++++++++++
プラン
+++++++++++++++++++++++++++++++++++++++++++*/
#main #second_bottom{
	text-align: left;
	width: 820px;
	margin:0px 30px;
	font-size:12px;
}
#main #second_bottom .plan{
	background:#FFFFFF;
	width:842px;
	border:#CECECE;
}
#main #second_bottom .plan p{
	color:#545454;
	line-height:200%;
	padding:0px 20px;
	margin-top:5px;
}
#main #second_bottom .plan .plan_l{
	background:url(../images/bg1.jpg) repeat-y;
	width:381px;
	padding:0 20px;
	height:236px;
	float:left;
}
#main #second_bottom .plan .plan_r{
	background:url(../images/bg2.jpg) no-repeat;
	width:381px;
	padding:0 20px;
	height:236px;
	float:right;
}
#main #second_bottom .plan .plan_l .plan_l_box{
	height:98px;
}
#main #second_bottom .plan h5{
	border-bottom:#00A0E9 1px dashed;
	margin-top:20px;
	line-height:150%;
	color:#00A0E9;
}
#main #second_bottom .plan img{
	margin-top:10px;
	float:left;
	margin-right:30px;
}
#main #second_bottom .plan .plan_l .plan_l_box ul{
	margin-top:15px;
	color:#545454;
	list-style:none;
}
#main #second_bottom .plan .plan_l2{
	background:url(../images/bg3.jpg) repeat-x;
	width:842px;
	height:118px;
}
#main #second_bottom .plan .plan_l2 img.diku{
	padding-top:10px;
	padding-left:5px;
}
#main #second_bottom .plan .plan_l2 .plan_l_box{
	width:361px;
	padding-right:0 20px;
	float:left;
}
#main #second_bottom .plan .plan_l_box ul{
	margin-top:15px;
	color:#545454;
	list-style:none;
}
/*++++++++++++++++++++++++++++++++++++++++++
こんな方にオススメ、素早く対応します
+++++++++++++++++++++++++++++++++++++++++++*/

#main #main_bottom #bottom_left ul li {
	background: url(../images/osusume_2.gif) no-repeat scroll 0 0;
	color:#555;
	padding:5px; 
}

#main #main_bottom #bottom_left ul {
	list-style-type:        none;
}



#main #main_bottom #bottom_right ul li {
	background: url(../images/supead_2.gif) no-repeat scroll 0 0;
	color:#555;
	padding:5px; 
}

#main #main_bottom #bottom_right ul {
	list-style-type:        none;
}

/*++++++++++++++++++++++++++++++++++++++++++
コンテンツ
+++++++++++++++++++++++++++++++++++++++++++*/


/*発注から完了までの流れ*/
#main #con table.flow{
	margin-top:20px;
	margin-bottom:100px;
}

/*ホームページを持つメリット*/
#main #con .text_area{
	background-color:#fff;
	margin-left:50px;
	width:643px;
	padding:20px 15px 15px 15px;
	line-height:20px;
	font-size:12px;
}

#main #con .text_area ul{
	font-size:14px;
	font-weight:bold;
}

#main #con .text_area li{
	list-style:none;	
	margin-top:5px;
}

#main #con .text_area h3{
	font-size:20px;
	marigin-bottom:15px;
	}

#main #con .img{
	margin-left:50px;
	margin-bottom:30px;
	padding:0px;
	font-size:12px;
}


#main #con .text_area p{margin-bottom:10px;}


/*事例紹介*/
#main #con .zirei dl{
	background-color:#d3d3d3;
	margin:10px 12px;
	padding: 0px;
	float: left;
	width: 240px;
	font-size: 12px;
	height: 270px;
	padding-top: 1px;
}

#main #con .zirei dl dt{
	padding-left:35px;
	}

#main #con .zirei dl dd{
	text-align:center;
	}

#main #con .zirei dl dd img{border:5px solid #AAA;}
#main #con .zirei dl dd p{
	margin:5px;
	}
#main #con .zirei dl dd .text
	{background-color:#FFFFFF;
	padding:5px 2px;
	margin:2px 5px;
	}

/*++++++++++++++++++++++++++++++++++++++++++
フッター
+++++++++++++++++++++++++++++++++++++++++++*/

#foot_body{
	border-top:#7E9110 2px solid;
	background:#ffffff;
	text-align: center;
	width: 900px;
}

#foot_body .foot_navi{
	margin:20px 0;
	color:#7E9110 ;
	font-weight:bold;
}
#foot_body .copy{
	color:#ffffff;
	width:900px;
	background: url(../images/footer_bg.gif) repeat-x;
}
#foot_body a,#foot a:visited {
	color: #7E9110 ;
}
#foot_body a:hover {
	color: #7E9110 ;
	text-decoration: none;
}

/*++++++++++++++++++++++++++++++++++++++++++
文字、画像、背景関係
+++++++++++++++++++++++++++++++++++++++++++*/
/*+align+*/
.right{
	text-align:				right;
	padding-right:			10px;
	padding-top:			10px;
}

.center{text-align:			center;}

/*+font+*/
.bold{font-weight:			bold;}
.c_w{color:					#FFFFFF;}
.c_b{color:					#000000;}
.c_bl{color:				#06a6ff;}
.c_r{color:				    red;}

/*+border+*/
.b{border:					1px solid #ccc;}
.b2{border:					1px solid #0094a0;}

/*+padding+*/
.pd3{padding:		    	3px;}
.pd5{padding-left:			5px;}
.pd20{padding-left:         20px;}
.pd150{padding-left:		150px;}
.pd7{padding:	    		7px;}
.pd10{padding:	    		10px;}

/*+background+*/
.bg_g{background:			#0094a0;}
.bg_bc{background:			#000000;}

/*+width+*/
.w50{width:                 50px;}
.w80{width:                 80px;}
.w100{width:                100px;}
.w150{width:                150px;}
.w170{width:				170px;}
.w180{width:				180px;}
.w300{width:                300px;}
.w410{width:				410px;}
.w440{width:				440px;}
.w450{width:				450px;}
.w541{width:				541px;}
.w544{width:				544px;}
.w540{width:				540px;}
.w740{width:				740px;}

/*+height+*/
.h100{height:               100px;}

/*+float+*/
.float_l{float:             left;}
.float_r{float:             right;}

/* ベリーショート */
#main input.text_ss
{
	width:60px;
	padding:2px;
	border:1px solid #7f9db9;
}

/*短いテキストボックス*/
input.text_s{
	width:120px;
	padding:2px;
	border:1px solid #7f9db9;
	color:#000;
}
/*数字用テキストボックス*/
input.number{
	width:70px;
	padding:2px;
	border:1px solid #7f9db9;
	color:#000;
	text-align:right;
}

/*中くらいテキストボックス*/
input.text_m{
	width:200px;
	padding:2px;
	border:1px solid #7f9db9;
	color:#000;
}

/*ちょっと長いテキストボックス*/
input.text_ml{
	width:300px;
	padding:2px;
	border:1px solid #7f9db9;
	color:#000;
}
/*長いテキストボックス*/
input.text_l{
	width:460px;
	padding:2px;
	border:1px solid #7f9db9;
	color:#000;
}

textarea
{
	padding:2px;
	border:1px solid #7f9db9;
	color:#000;
}


/*************** case ***************/
#case
{
	width:800px;
	margin:0px;
	padding-left:20px;
	padding-rigth:20px;
	padding-top:30px;
}
#case .box1
{
	width:182px;
	height:92px;
	margin-left:30px;
	font-size:16px;
	_margin-left:7px;
	padding:10px 15px;
	line-height:180%;
	font-weight:bold;
	margin-bottom:15px;
	float:left;
	color:#666666;
	background:#EFF4C6;
}
#case .box2
{
	width:182px;
	line-height:180%;
	font-weight:bold;
	height:92px;
	color:#666666;
	font-size:16px;
	margin-bottom:15px;
	margin-left:30px;
	_margin-left:7px;
	padding:10px 15px;
	float:left;
	background:#c1ebf6;
}
#case .box1 a,#case .box2 a{
	color:#666666;
}