@charset "UTF-8";

@import "base.css";

@import "fonts.css";



/*==========================================================================*/

/*//////////////////////////////////////////////////////////////////////////*/

/*//////                                                              //////*/

/*//////  Copyright (C) 2009 株式会社フリーセル All Rights Reserved.  //////*/

/*//////                                                              //////*/

/*//////////////////////////////////////////////////////////////////////////*/

/*                                                                          */

/*    base.css  --> スタイルの初期設定を行うため、変更しないで下さい。      */

/*    fonts.css --> フォントの初期設定を行うため、変更しないで下さい。      */

/*                                                                          */

/*==========================================================================*/



/*==========================================================================*/

/*                           Common-Setting                                 */

/*==========================================================================*/



/* 基本タグのフォントサイズを指定（12px -> 120% or 1.2em ） */

h1,h2,h3,h4,h5,h6,input,button,textarea,select,p,blockquote,table,pre,address,ul,ol,dl {

	font-size: 120%;

}

	

h1 {} /* Header内で設定 */

h2 { line-height: .1; }

h3 {}

h4 {}



a { color: #f41; }

a:hover,

a:active { color: #f96; text-decoration: none; }

a:visited {

}



ul {

}

li {

}



dl {

}

dt {

}

dd {

}



table {

}



th,

td {

}

th {

}

td {

}



p { margin: 0 0 1em; }



.section { padding: .5em 1em 1em; }

.section .section { padding: .5em .5em 1em; }



.image_l { float: left; margin: 0 8px 8px 0; }

.image_r { float: right; margin: 0 0 8px 16px; }



.case {

	margin: 10px 20px;

	background: url(../images/arrow_h.jpg) center center no-repeat;

}

.case-narrow {

	margin: 10px 40px;

	background: url(../images/arrow_h.jpg) center center no-repeat;

}

.case-noimg { margin: 10px 20px; }



ul.totop {

	clear: both;

	padding-bottom: 20px;

}

ul.totop li {

	float: right;

	list-style: none;

}

ul.totop li a {

	display: block;

	width: 100px;

	height: 20px;

	background: url(../images/to_top.jpg) 0 0 no-repeat;


	outline: none;

}

ul.totop li a:hover { background-position: bottom; }



#main p { margin: 5px; 

		  line-height:22px;

		  font-size:12px;}

/*==========================================================================*/

/*                            Container                                     */

/*==========================================================================*/



html {

	background: none;

	height:100%;

}



body {

  background: url(../images/body_bg.jpg) top;

	color: #333;

	text-align: center;

	height:100%;

	

}



#bgimg {

    background: url(../images/body_hd_bg.png) 0 0 repeat-x;

    height:520px;

    width:auto;

    }



#bg_naka_img {

    background: url(../images/naka_hd_bg.png) 0 0 repeat-x;

    height:520px;

    width:auto;

    }



#wrapper {

	position:relative;

	width: 850px;

	margin: 0 auto;

    background: url(../images/wrapper_bg.jpg) top repeat-y;

    min-height: 100%;

    height:auto;

    }

    

#wrapper_pre {

	width: 850px;

	margin: 0 auto;

    background: url(../images/pre.jpg) top no-repeat;

    height:auto;

    }



#container {

	width: 850px;

	margin: 0 auto;

	padding-bottom:50px;

	}

	

#main {

	width: 640px;

	margin: 0 auto;

	text-align: left;

  float: right;

  

}





/*==========================================================================*/

/*                               Header                                     */

/*==========================================================================*/



#header {

	width: 850px;

	height: auto;

	margin: 0 auto;

	text-align: left;

  background: url(../images/header_bg.jpg) 0 0 no-repeat;

}



#index_header {

	width: 850px;

	height: 300px;

	margin: 0;

  background: url(../images/main_bg.jpg) 0 0 no-repeat;

}



#naka_header {

	width: 850px;

	height: 150px;

	margin: 0;

  background: url(../images/naka_main_bg.jpg) 0 0 no-repeat;

}

#studio_header {
	width: 850px;
	height: 150px;
	margin: 0;
  background: url(../images/studio_main_bg.jpg) 0 0 no-repeat;
}

#company_header {
	width: 850px;
	height: 150px;
	margin: 0;
  background: url(../images/company_main_bg.jpg) 0 0 no-repeat;
}

#header .header_text {

	height: 20px;

	line-height: 20px;

	text-indent: 1em;

	background: #333;

	color: #fff;

	margin: 0;

	font-size: 90%;

}

#header h1 { 
	float: left;
	height: 108px;
	
	 }

#header h1 a {

  display: block;

	width: 250px;

	height: 108px;



}

#header #header02 {

	float: right;

	padding-top: 10px;

}

#header #header02 a {

	display: block;

	width: 150px;

	height: 40px;

  background: url(../images/header_link.jpg) 0 0 no-repeat;


	outline: none;

}

#header #header02 a:hover { background-position: bottom; }

#cam {
	background: url(../images/img_cam02.jpg) 0 0 no-repeat;
	width:830px;
	height:804px;
	}

#cam a {
	display:block;
	position:relative;
	left:443px;
	top:670px;
	width:377px;
	height:132px;
	}

/*==========================================================================*/

/*                              Footer                                      */

/*==========================================================================*/



#footer {
	clear: both;
	text-align: center;
    background: url(../images/footer_bg.jpg) bottom repeat-x;
    padding:5px;
    margin: 0;
}
*:first-child+html #footer { font-size: 9px; } /*  for IE7 only */
* html body #footer { font-size: 9px; } /*  for IE6 only */

#footer address {

	{ margin: 8px 1em; }

}





/*==========================================================================*/

/*                             gnavi                                  */

/*==========================================================================*/



#gnavi {

}

#gnavi ul {

	margin: 0;

}

#gnavi ul li {

	display: block;

	float: left;

	width: 170px;

	height: 40px;

	list-style: none;

}

#gnavi ul li a {

	display: block;

	width: 170px;

	height: 40px;

	text-align: left;



}








/*==========================================================================*/

/*                            Navigation                                    */

/*==========================================================================*/



#navi {

	float: left;

	width: 200px;

	text-align: center;

}



#navi dl,

#navi ul {

	margin: 0 0 10px;

	text-align: left;

}



#navi dl dt,

#navi dl dd,

#navi ul li { list-style: none; margin: 0; }



#navi dl dt { text-indent: -9999em; }



#navi dl dd a,

#navi ul li a {

	display: block;


    }



#navi ul li.nav01 a { background-position: 0 0; no-repeat; height:40px;}

#navi ul li.nav02 a { background-position: 0 -40px; no-repeat; height:30px;}



#navi ul li.nav01 a:hover { background-position: -180px 0; }

#navi ul li.nav02 a:hover { background-position: -180px -40px; }



#navi #navi_navi {
	margin: 10px 0 0 15px;
}

#navi #navi_navi li {
	margin: 0;
	width: 180px;
}

#navi #navi_navi li a {
	width: 180px;
	height:auto;
}





#navi #navi_banner {

	margin: 10px 0 0 15px;

}

#navi #navi_banner li {

	margin-bottom: 5px;

}

#navi #navi_banner li a {

	display: block;

	width: 180px;


	outline: none;

	background: url(../images/navi_banner.jpg) 0 0 no-repeat;

}



#navi #navi_banner li.banner01 a { background-position: 0 0; height: 120px;}

#navi #navi_banner li.banner02 a { background-position: 0 -129px; height:111px;}





/*==========================================================================*/

/*                             Contents                                     */

/*==========================================================================*/



/* index

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



#index h3#h3-01 { background: url(../images/index_h3-01.jpg) 0 0 no-repeat; }



.contents {

	width:620px;

	margin: 10px 15px 0 0;

	clear:both;

	}



.contents_co {

	width:620px;

	margin-top:5px;

	clear:both;

	}



.contents_co table{

	width:620px;

	margin-top:5px;

	}



.contents_co table th{

	border: 0px;

	padding:0;

	margin:0;

	border: 1px #666666 solid;

	background-color:#FFF8FC;

	padding:3px;

	}



.contents05 table{

	width:620px;

	margin-top:5px;

	}



.contents05 table th{

	border: 0px;

	padding:0;

	margin:0;

	border: 1px #666666 solid;

	background-color:#fff8da;

	padding:3px;

	}



.step {

	width:600px;

	margin:5px;

	height:auto;

	float:left;

	}



.step2 {

	width:300px;

	margin-right:10px;

	float:left;

	}



.bar {

	width:600px;

	background: url(../images/bar01.jpg) no-repeat;;

	padding: 8px 0 0 8px;

	height: 30px;

	color:#532c01;

	font-weight:bold;
	font-size:14px;

	}



.bar2 {

	width:300px;

	background: url(../images/bar01.jpg) no-repeat;;

	padding: 8px 0 0 8px;

	height: 30px;

	color:#532c01;

	font-weight:bold;

	}



	

.mtitle00a {

	background: url(../images/title_index02.jpg);

	width:620px;

	height:90px;


	}

	


#stitle0101 {

	background: url(../images/stitle_0101.jpg);

	width:620px;

	height:40px;


	margin-bottom:5px;

	}

	

#stitle0102 {

	background: url(../images/stitle_0102.jpg);

	width:620px;

	height:40px;


	margin-bottom:5px;

	}

	

#stitle0103 {

	background: url(../images/stitle_0103.jpg);

	width:620px;

	height:40px;


	margin-bottom:5px;

	}

	

#stitle0104 {

	background: url(../images/stitle_0104.jpg);

	width:620px;

	height:40px;


	margin-bottom:5px;

	}

	

.icon01 {

	background: url(../images/navi01.jpg) no-repeat;

	width:620px;

	height:30px;


	margin-bottom:5px;

	}

	

.step .option_r {

	float:right;

	display:block;

	margin:0;

	width:285px;

	height:auto;

	padding:5px;

	font-size:10px;

	border: 1px #666666 dashed;

	}

	

.step .option_l {

	float:left;

	display:block;

	margin:0;

	width:.285px;

	height:auto;

	padding:5px;

	font-size:10px;

	border: 1px #666666 dashed;

	}

.step .option {

	float:left;

	display:block;

	margin:0;

	width:580px;

	height:auto;

	padding:5px;

	font-size:10px;

	border: 1px #666666 dashed;

	}

.step2 .option_l {

	float:left;

	display:block;

	margin:0;

	width:285px;

	height:auto;

	padding:5px;

	font-size:10px;

	border: 1px #666666 dashed;

	}

	

#pre {

	width:900px;

	height:600px;

	text-align:center;

	}