@charset "UTF-8";
/*チャートジャパンWEBサイト
Theme Name: chartjapan_style
Theme URl: http://www.chartjapan.com
Description: 
Version: 1.3
Author: Yagi
*/

/************************************************************************************************************************
 1.General setting 
*************************************************************************************************************************/

html, body, div, span, applet, object, iframe, strong,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
form, legend, caption, 
tbody, tfoot, thead, table, label, tr, th, td{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
	list-style:none;
	}

fieldset{margin:0,0,0,0px; border: none;}

html{height: 100%;}

body{height: 100%;  background-color: #F0F0F0; margin: 0; padding: 0; font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; color: #333; position: relative; min-width: 1100px;} 

a{text-decoration: none;}
	a:hover{color: #09C; text-decoration: none;}

.clear{ clear: both; line-height: 0;}

hr {
   border:solid #000;
   border-width:1px 0 0 0;
   margin: 20px 30px 20px 0;
   height:1px;/* for IE6 */
   clear:both;/* for IE6 */
} 
/************************************************************************************************************************
　2.Basic structure 
*************************************************************************************************************************/

#page{height: auto; 
margin: 0; padding: 0;
position: relative;
}

#wrapper{width: 960px; 
	min-height: 100%;
	height: auto !important;
	border: 1px #ddd solid; margin: 0 auto;
	position: relative;
	padding: 0;
	background-color: #fff; 
	}

#header{
	width: 960px; height: 124px; margin: 0px auto; padding: 0px 0px 0px 0px;
	text-indent: -9999px;
	text-decoration: none; 
	background-image: url(image/bg_home.png); width: 100%; height: 124px; display: block;
	border: 0px #000 solid;}


#fontSize{width: 160px; height: 25px; position: absolute; top: 15px; left: 780px; background-color: #fff; display: block; border: 0px #d7d solid;}
#fontSize ul{margin: 3px 0 0 7px; }
#fontSize li{float: left; padding: 0 8px 0 0; font-size: 70%; line-height:200%;}


h1 a{
	top: 30px; left: 36px; width: 180px; height: 43px;
	position: absolute;
	text-indent: -9999px;
	text-decoration: none;
	/**background-image: url(image/chart_logo.png);**/ display: block;
	}


#contents{
	width: 960px;
	height: auto;
	margin: 0 0 0px 0;
	padding: 0 0 0px 0;  
	border: 0px #d7d solid;}

	.kuzu {position: absolute; top: 145px; left: 30px; display: block; border: 0px #d3d solid;}
	.kuzu {padding: 0; margin: 0px 0px 0px 20px; font-size:11px;}

	.lang {position: absolute; top: 145px; left: 820px; display: block; font-size:12px; font-weight: bold;}


	.container{
	width:960px; height: auto; padding: 0px 0px 0 0px;
	}


	.container-a{
		position: relative; margin-top: 30px; margin-left: 40px;
		width:460px;
		height: 170px;
		padding:0;
		float: left;
		display: inline;}

	.container-a li	{width: 230px
			height: 170px;
			margin: 0;
			padding: 0;
			display: inline;
			float: left;}

	.container-a a{
			text-indent: -9999px;
			text-decoration: none;
			display: block;
			width: 230px;
			height: 170px;
			background-image: url(image/sitebutton_e.jpg);
			background-repeat: no-repeat;}


	.container-a01 a{ background-position: -0px 0; }
	.container-a02 a{ background-position: -240px 0; }

	.container-a01 a:hover{ background-position: -0px -170px; }
	.container-a02 a:hover{ background-position: -240px -170px; }

	.container-a01 a:active{ background-position: -0px -170px; }
	.container-a02 a:active{ background-position: -240px -170px; }

	.container-a01 a.current{ background-position: -0px -170px; }
	.container-a02 a.current{ background-position: -240px -170px; }



	.container-news{
		position: relative; margin-top: 30px; margin-left: 10px;
		width: 410px; height: auto;
		padding: 0px;
		float: left;
		display: inline;}

	.container-news_top{
		width: 410px; height: 50px;
		background-image: url(image/whatsnew_back_top_e.jpg);}

	.container-news_middle{
		width: 410px; height: auto;
		background-image: url(image/whatsnew_back_middle.jpg);
		overflow: hidden; repeat-y top left;}

		.news_box{
		width: 370px;
		height: auto;
		margin: 0 0 0 0;
		padding: 0px 15px 0 20px;
		display: block;}

		.news_box ul li{font-size: 80%; line-height: 180%; padding-bottom: 5px;}

	.container-news_bottom{
		width: 410px; height: 20px;
		background-image: url(image/whatsnew_back_bottom.jpg);
		overflow: hidden;}


	.container-b{
	width:900px; height: auto; padding: 0px 30px 0 30px;
	}

	.container-c{
	width:400px; height: auto; padding: 20px 0 0 20px; float: left;
	display:inline;}

	.container-d{
	width:400px; height: auto; padding: 20px 0 0 10px; float: left;
	display:inline;}

	.container-e{
	width:800px; height: auto; margin: 0px auto; padding: 20px 0 0 10px; 
	}
	.container-e img{margin: 0 auto; display: block;}

	.container-e2{
	width:800px; height: auto; margin: 0px auto;
	}

	.container-e2 ul{position: relative; left: 50%; float: left; margin: 0 auto;}

	.container-e2 ul li{display: table-cell; vertical-align: bottom; width: auto; height: auto; position: relative; left: -50%; 
				text-align: center; padding: 10px 10px 50px 10px;}

	.container-e2 img{display: inline-block;}


	.container-e3{
	width:800px; height: auto; margin: 0px auto;
	text-align: center;}

	.container-e3 img{display: inline-block;}


	.container-f{
	width:800px; height: auto; margin: 0px auto; padding: 20px 0 10px 30px;
	}
	.container-f p{
	padding: 10px 0 10px 20px;
	}

	.sslicon{position: relative; display: block; margin: 20px 0 0 50px;}
	.sslicon_top{position: absolute; display: block; top: 560px; right: 50px;}

	.container-bottom{width:960px height 50px; position: relative; margin: 30px 0 0 0; background-image: url(image/gradient.png); repeat-x top left; width: 100%; height: 50px; display: block; clear: both;}

	.pages_title{margin: 70px 0 20px 0; padding: 0px 0px 0px 0px; display: block;}
	.block_title{padding: 20px 0px 0px 0px; display: block;}

#skitter{width:960px;height:280px;}


/************************************************************************************************************************
　3.Global navi
*************************************************************************************************************************/
#globalnavi {
	position: absolute; top: 80px; left: 142px;
	list-style-type: none;
	width: 675px; height: 30px;}

#globalnavi li{
	width: 135px
	height: 30px;
	margin: 0;
	padding: 0;
	display: inline;
	float: left;}

#globalnavi a{
	text-indent: -9999px;
	text-decoration: none;
	display: block;
	width: 135px;
	height: 30px;
	background-image: url(image/global_button_e.png);
	background-repeat: no-repeat;}

	.globalnavi01 a{ background-position: -0px 0; }
	.globalnavi02 a{ background-position: -135px 0; }
	.globalnavi03 a{ background-position: -270px 0; }
	.globalnavi04 a{ background-position: -405px 0; }
	.globalnavi05 a{ background-position: -540px 0; }

	.globalnavi01 a:hover{ background-position: -0px -30px; }
	.globalnavi02 a:hover{ background-position: -135px -30px; }
	.globalnavi03 a:hover{ background-position: -270px -30px; }
	.globalnavi04 a:hover{ background-position: -405px -30px; }
	.globalnavi05 a:hover{ background-position: -540px -30px; }

	.globalnavi01 a:active{ background-position: -0px -30px; }
	.globalnavi02 a:active{ background-position: -135px -30px; }
	.globalnavi03 a:active{ background-position: -270px -30px; }
	.globalnavi04 a:active{ background-position: -405px -30px; }
	.globalnavi05 a:active{ background-position: -540px -30px; }

	.globalnavi01 a.current{ background-position: -0px -30px; }
	.globalnavi02 a.current{ background-position: -135px -30px; }
	.globalnavi03 a.current{ background-position: -270px -30px; }
	.globalnavi04 a.current{ background-position: -405px -30px; }
	.globalnavi05 a.current{ background-position: -540px -30px; }

/****************************************
  4.Footer
*****************************************/

#footer{
	width: 960px; height: 130px; background-color: #FE8F00;
	/* background-image: url(image/footer_back.jpg); repeat-x top left;*/
	margin: 0px auto 0 auto; padding: 0 0 0 0; position: relative;
	text-align: center; font-size:90%;}

	.p-copy{text-align:center; font-size:80%; padding:0 0 0 0;}

#footer .footer_menu {font-size:90%;
	position: relative; overflow:hidden; width: 100%; padding: 20px 0 10px 0;
	}
	.footer_menu ul{position: relative; left: 50%; float: left;}
		.footer_menu ul li{
			position: relative; right: 50%; float: left;
			list-style: none !important
			}
			.footer_menu li a{color: #0E2769;}
				.footer_menu li a:hover{color:  #fff;}

/************************************************************************************************************************
　5.text
*************************************************************************************************************************/
p {font-size: 95%; padding:5px 30px 10px 0;}
 .right{font-size: 95%; padding:5px 30px 10px 0; text-align: right;}
 .center{font-size: 95%; padding:5px 0px 0px 0; text-align: center;}
 .s {font-size: 95%; padding:5px 0px 10px 0;}
 .exam{font-size: 80%; padding: 0px 30px 10px 10px;}
 .midashi{font-size: 105%; font-weight: bold;  color: #003A81; padding:5px 0 5px 0;}
 .midashi_s{font-size: 95%; font-weight: bold;  color: #003A81; padding:25px 0 5px 0;}
 .midashi_sb{font-size: 95%; font-weight: bold;  color: #000; padding:5px 0 5px 0;}
 .midashi_s2{font-size: 90%; font-weight: bold;  color: #003A81; padding:5px 0 5px 0;}
 .comment{font-size: 75%; text-align:left; padding: 5px 0px;}
 .comment_red{font-size: 75%; text-align:left; padding: 5px 0px 5px 0px; color: #CC0000;}
 .comment_red2{font-size: 85%; text-align:left; font-weight: normal; padding: 5px 0px 5px 0px; color: #CC0000;}
 .sup{font-size:65%; vertical-align: super;}
 .retop{font-size:75%; margin: 15px 20px 0 0; text-align:right; line-height:170%;}

ul li{font-size: 95%;}
	 .sitemap{font-size: 85%; margin: 20px 0px 0 0; padding:0px 0px 0px 20px;  line-height:170%;}
	 .privacy{font-size: 95%; margin: 0 0 0 20px; padding: 5px 0px 10px 0px; list-style-type: decimal;  line-height:170%;}
	 .privacy_b{font-size: 90%; margin: 0 0 0 20px; padding: 5px 0px 10px 0px; list-style-type: disc;  line-height:150%;}

/************************************************************************************************************************
  6.table
*************************************************************************************************************************/

#table01{width: 800px; margin: 0px 0px 0px 0px; border-spacing: 0; border-collapse: collapse;}
#table01 th {padding: 5px 10px 5px; vertical-align: top; text-align: left;  border: 0px #003A81 solid; font-size:80%; color: #CC0000;}
#table01 th.c {padding: 5px 10px 5px; vertical-align: middle; text-align: center; background-color: #003A81; border: 1px #003A81 solid; font-size:80%; color: #CC0000;}
#table01 td {padding: 10px 30px 10px 10px; vertical-align: top; text-align: left; border: 0px #003A81 solid;  font-size:80%;}
#table01 td.bold {padding: 5px 10px 5px; vertical-align: middle; text-align: center; font-weight: bold; border: 1px #003A81 solid;  font-size:75%;}
#table01 td.bold2 {padding: 5px 10px 5px; vertical-align: middle; text-align: left; font-weight: bold; border: 0px #003A81 solid;  font-size:80%;}
#table01 td.td-r {padding: 5px 0px 5px; vertical-align: middle; border: 0px #003A81 solid; text-align: right;}
#table01 td.td-l {padding: 5px 0px 5px; vertical-align: middle; border: 0px #003A81 solid;}
#table01 td.gray{padding: 5px 10px 5px; vertical-align: middle; text-align: left; background-color: #f0f0f0; border: 1px #003A81 solid;}
#table01 td.gray-b{padding: 5px 10px 5px; vertical-align: middle; text-align: left; font-weight: bold; background-color: #f0f0f0; border: 1px #003A81 solid;  font-size:80%;}
#table01 td.blue{padding: 5px 10px 5px; vertical-align: middle; background-color: #003A81; border: 1px #000000 solid;}


#table02{width: 600px; margin: 30px 0px 0px 10px; border-spacing: 0; border-collapse: collapse;}
#table02 td {padding: 0px 0px 30px 20px;  vertical-align: middle; text-align: left; border: 0px #003A81 solid;  font-size:90%;}


#table-form{width: 750px; margin: 10px 0px 0px 0px; border-spacing: 0; border-collapse: collapse; table-layout: fixed;}
#table-form th {padding: 10px 10px 10px 20px; width: 150px; vertical-align: top; text-align: left; background-color: #E0E0E0; border: 1px #ccc solid; font-size:80%; color: #003A81;}
#table-form td {padding: 10px 10px 10px 20px; vertical-align: middle; text-align: left;  background-color: #F5F5F5; border: 1px #ccc solid;  font-size:70%;}


/************************************************************************************************************************
  7.  Form
*************************************************************************************************************************/

#form-container-a{
	width:800px; height: auto; margin: 0px auto;}


input[type="text"], textarea{
	border:1px solid #ccc;
	padding: 5px;
	color: #666;
	
	/* Webkit */
	background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(#eee),
		to(#fff)
		);
	
	/* FF */
	background: -moz-linear-gradient(
		top,
		#eee,
		#fff
		);
		
	/* IE */
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffeeeeee,endColorstr=#ffffffff);
	zoom: 1;
	}
	
input[type="submit"]{
	border:1px solid #ccc;
	padding: 4px 10px;
	color: #666;
	cursor: pointer;

	/* Webkit */
	background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(#eee),
		to(#ccc)
		);
	
	/* FF */
	background: -moz-linear-gradient(
		top,
		#eee,
		#ccc
		);
		
	/* IE */
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffeeeeee,endColorstr=#ffcccccc);
	zoom: 1;
	}


#contact-submit-a{height: 41px; margin: 20px auto 10px auto;}

#contact-submit-a a{
	display: block;
	text-decoration: none;
	padding: 0px;
	width: 256px; 
	height: 41px;
	background: url(image/contact_button_a_e.jpg) no-repeat;
}


#contact-submit-a ul li{
	list-style: none;
	display: block;
	margin: 0px;
	padding: 0px;
	width: 256px; 
	height: 41px;
	text-indent: -9999px;
}

