/*-----------------------------------------------------------------
 TOPページ　コンテンツスタイリングシート 
 -----------------------------------------------------------------*/

/************************************
レイアウト
*************************************/

#contents_box_L{
  width:660px;
  float:left;
  margin:20px 0 0 0;
  }
  
#contents_box_R{
  width:270px;
  float:right;
  margin:20px 0 0 0;
  }
.main_img { background-image: url(../img/main_img.jpg); background-repeat: no-repeat; background-position: left top; height: 300px; width: 660px; }

/************************************
contents_L
*************************************/

/*-----バナーリスト--------*/

#sub_banner1{background:url(../img/sub_banner1_rollout.jpg) top left no-repeat; width:210px; height:80px; text-indent:-9999px; margin:15px 15px 0px 0; float:left;}
#sub_banner1 a{background:url(../img/sub_banner1_rollout.jpg) top left no-repeat; width:210px; height:80px; text-indent:-9999px; display:block; overflow:hidden;}
#sub_banner1 a:hover{background:url(../img/sub_banner1_rollover.jpg) top left no-repeat; width:210px; height:80px; text-indent:-9999px; display:block; overflow:hidden;}

#sub_banner2{background:url(../img/sub_banner2_rollout.jpg) top left no-repeat; width:210px; height:80px; text-indent:-9999px; margin:15px 15px 0px 0; float:left;}
#sub_banner2 a{background:url(../img/sub_banner2_rollout.jpg) top left no-repeat; width:210px; height:80px; text-indent:-9999px; display:block; overflow:hidden;}
#sub_banner2 a:hover{background:url(../img/sub_banner2_rollover.jpg) top left no-repeat; width:210px; height:80px; text-indent:-9999px; display:block; overflow:hidden;}

#sub_banner3{background:url(../img/sub_banner3_rollout.jpg) top left no-repeat; width:210px; height:80px; text-indent:-9999px; margin:15px 0px 0px 0; float:left;}
#sub_banner3 a{background:url(../img/sub_banner3_rollout.jpg) top left no-repeat; width:210px; height:80px; text-indent:-9999px; display:block; overflow:hidden;}
#sub_banner3 a:hover{background:url(../img/sub_banner3_rollover.jpg) top left no-repeat; width:210px; height:80px; text-indent:-9999px; display:block; overflow:hidden;}

#sub_banner4{background:url(../img/sub_banner4_rollout.jpg) top left no-repeat; width:210px; height:80px; text-indent:-9999px; margin:15px 15px 15px 0; float:left;}
#sub_banner4 a{background:url(../img/sub_banner4_rollout.jpg) top left no-repeat; width:210px; height:80px; text-indent:-9999px; display:block; overflow:hidden;}
#sub_banner4 a:hover{background:url(../img/sub_banner4_rollover.jpg) top left no-repeat; width:210px; height:80px; text-indent:-9999px; display:block; overflow:hidden;}

#sub_banner5{background:url(../img/sub_banner5_rollout.jpg) top left no-repeat; width:210px; height:80px; text-indent:-9999px; margin:15px 15px 15px 0; float:left;}
#sub_banner5 a{background:url(../img/sub_banner5_rollout.jpg) top left no-repeat; width:210px; height:80px; text-indent:-9999px; display:block; overflow:hidden;}
#sub_banner5 a:hover{background:url(../img/sub_banner5_rollover.jpg) top left no-repeat; width:210px; height:80px; text-indent:-9999px; display:block; overflow:hidden;}

#sub_banner6{background:url(../img/sub_banner6_rollout.jpg) top left no-repeat; width:210px; height:80px; text-indent:-9999px; margin:15px 0px 15px 0; float:left;}
#sub_banner6 a{background:url(../img/sub_banner6_rollout.jpg) top left no-repeat; width:210px; height:80px; text-indent:-9999px; display:block; overflow:hidden;}
#sub_banner6 a:hover{background:url(../img/sub_banner6_rollover.jpg) top left no-repeat; width:210px; height:80px; text-indent:-9999px; display:block; overflow:hidden;}

#sub_banner_ra{ background:url(../img/banner_ra.jpg) top left no-repeat; width:660px; height:140px; text-indent:-9999px; margin:0; }
#sub_banner_ra a{ background:url(../img/banner_ra.jpg) top left no-repeat; width:660px; height:140px; text-indent:-9999px; display:block; overflow:hidden; }
#sub_banner_ra a:hover{ background:url(../img/banner_ra_r.jpg) top left no-repeat; width:660px; height:140px; text-indent:-9999px; display:block; overflow:hidden; }

#sub_banner_sc{ background:url(../img/banner_sc.jpg) top left no-repeat; width:660px; height:140px; text-indent:-9999px; margin:0; float:left; }
#sub_banner_sc a{ background:url(../img/banner_sc.jpg) top left no-repeat; width:660px; height:140px; text-indent:-9999px; display:block; overflow:hidden; }
#sub_banner_sc a:hover{ background:url(../img/banner_sc_r.jpg) top left no-repeat; width:660px; height:140px; text-indent:-9999px; display:block; overflow:hidden; }


/*-----バナーリスト/////--------*/

/*-----NEWS--------*/
#news_box{position:relative; clear:left;}

#news_title{
   width:660px;
   height:45px;
   font-size:12px;
   }

#news_titles{position:absolute; top:0; left:0;}

#news{
  width:618px;
  height:140px;
  border:1px #CCCCCC solid;
  padding:30px 20px 20px 20px;
  overflow-y:auto;
  margin-bottom:40px;
  }
  
#news li{
  border-bottom:1px dotted #CCCCCC;
  margin-bottom:3px;
  }   
  
#news li span.date{font-weight:normal; font-size:12px; color:#666; text-decoration:none; font-style:italic;}
#news li span.bold{text-decoration:none;}

/*-----NEWS/////--------*/

/*-----制作実績--------*/

#result_box{position:relative;}

#result_title{
   width:660px;
   height:51px;
   font-size:12px;
   }

#result_titles{position:absolute; top:0; left:0;}

#result{ width:618px; border:1px #CCCCCC solid; overflow-y:auto; margin-bottom:40px; margin-top: 10px; padding-top: 10px; padding-right: 20px; padding-bottom: 20px; padding-left: 20px;
  }
  
#result div{
  float:left;
  }

#result span{
  display:block;
  width:618px;
  text-align:right;
  clear:left;
  padding:30px 0 0 0;
  }
/*-----制作実績/////--------*/  
  
/*-----５種のプロ--------*/

#pro5_box{position:relative;   clear:both;}

#pro5_title{
   width:660px;
   height:88px;
   font-size:12px;
   }

#pro5_titles{ position:absolute; top:-18px; left:0; }

#pro5{ width:658px; border:1px #CCCCCC solid; padding:0px 0px 20px 0px; margin-bottom:20px; position:relative;
  
  }
  
#pro5_img{
  width:658px;
  height:383px;
  }
  
#pro5_img div{ position:absolute; top:0px; left:0;
  }


.pro5_box_in{
  position:relative;
  margin-left:13px;
  clear:both;
  }

  
.pro5_title1{
  font-size:10px;
  }
  
.pro5_title1s{
  position:absolute;
  top:0;
  left:0;
  }
  
.pro5_border{
  width:610px;
  border:1px #CCCCCC solid;
  padding:15px 10px 10px 10px;
  margin-bottom:30px;
  display:inline-block;
  display:block;
  }
  
.pro5_border:after{  
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
  
.pro5_border div{
  float:left;
  }

.pro5_border p{
  padding:0 0 0 30px;
  width:420px;
  float:right;
  }
  
.strong{
  font-weight:bold;
  font-size:17px;
  width:658px;
  text-align:center;
  }

.pro5_btn{
  width:637px;
  text-align:right;
  margin:30px 0px 0 0;
  padding-right:15px;
  }

  
/*-----５種のプロ/////--------*/


/*-----Blog--------*/
#blog_box{position:relative; clear:left;}

#blog_title{
   width:660px;
   height:51px;
   font-size:12px;
   }

#blog_titles{position:absolute; top:0; left:0;}

#blog{
  width:618px;
  border:1px #CCCCCC solid;
  padding:30px 20px 20px 20px;
  margin-bottom:40px;
  }
  
.mt_top_box h3{
width:578px;
border-bottom:1px #CCCCCC dotted;
font-size:15px;
font-weight:bold;
background:url(../img/blog_list_img.jpg) center left no-repeat;
padding:5px 0 3px 30px;
}

.mt_top_box h3 a{color:#333333;}
.mt_top_box h3 a:hover{color:#0066CC; text-decoration:underline;}

.mt_top_box h3 span{font-size:11px; padding-right:20px; position:relative; top:3px;}

.blob_name{font-size:11px; width:200px; height:10px; position:relative; top:5px; left:35px; color:#CC0033;}

.mt_top_text{
width:550px;
margin:10px 0 15px 40px;
}

.mt_top_next{/* width:590px; text-align:right; */ margin-bottom:25px;margin-left:425px;}
.mt_top_next a{display:block;width:165px;}

/*-----Blog/////--------*/


/*※※右バナーはlayout.cssの共通CSSに記述*/