@charset "utf-8";

/*============================================
 2011.8
 top.css
============================================*/

/*============================================
  reset Css 
============================================*/
body,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,p,table,th,td,form,input,textarea,select { margin:0px; padding:0px; color:#333333; }
h1,h2,h3,h4 { font-size:1em; font-weight:normal; }
img { margin:0; padding:0; border:0; }
ul,dl{ list-style-type:none; }

/*============================================
  class
============================================*/
/* link
========================================== */
a{ outline:none; }
a:link{ color:#555; text-decoration:none; }
a:visited{ color:#555; text-decoration:none; }
a:hover{ color:#555; text-decoration:underline; }
a:active{ color:#555; text-decoration:underline; }
a.linkImage { display: block; }
a.linkImage img { border: 1px solid #D9D9D9; }
a.linkImage:hover img { border: 1px solid #FF9860; }

/*	float clear
============================================*/
.floatLeft{ float:left; }
.floatRight{ float:right; }
.clear{ clear:both; height:0; font-size:0; line-height:0; }
.clear2{ clear:both; }
.clearfix:after{
   content:".";
   display:block;
   height:0;
   visibility:hidden;
   clear:both;
}
/* clearfix
=========================================*/
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

.clearfix {
	min-height: 1px;
}

* html .clearfix {
	height: 1px;
	/*\*//*/
	height: auto;
	overflow: hidden;
	/**/
}

/* margin-bottom
=========================================*/
.mb3{margin-bottom:3px;}
.mb4{margin-bottom:4px;}
.mb5{margin-bottom:5px;}
.mb7{margin-bottom:7px;}
.mb8{margin-bottom:8px;}
.mb10{margin-bottom:10px;}
.mb12{margin-bottom:12px;}
.mb15{margin-bottom:15px;}
.mb20{margin-bottom:20px;}
.mb25{margin-bottom:25px;}
.mb30{margin-bottom:30px;}
.mb40{margin-bottom:40px;}
.mb50{margin-bottom:50px;}

/* margin-left
=========================================*/
.ml16{margin-left:16px;}

/* other
=========================================*/
.linetop01{ border-top:solid 1px #D2CFC9}
.linebottom01{ border-bottom:solid 1px #D2CFC9}


/*============================================
  base Css 
============================================*/
body {
	_height: 100%;
	background: #fff url(/english/shared/image/bg_body_01.gif) repeat-x;
	font-size: 12px;
	*font-size: 75%;
	font-family: arial, verdana, sans-serif;
	line-height: 1.7;
	color: #555;
}

/*	container
============================================*/
#container{ width:994px; margin:0 auto; padding-bottom:30px; }

/* ------------------------------------------------ */
/* reset                                            */
/* ------------------------------------------------ */
#headerArea ul,
#globalNavArea ul,
#footerArea ul{
	margin: 0;
}
#headerArea li,
#globalNavArea li,
#footerArea li {
	margin: 0;
	list-style-type: none;
}
#headerArea p img,
#footerArea p img {
	vertical-align: bottom !important;
}
#headerArea li img,
#footerArea li img {
	margin-right : 0;
	padding: 0 !important;
	*background: #f3f1e9; /* for IE */
	vertical-align: baseline !important;
}

.skipLink {
	position:absolute;
	top:0px;
	left:0px;
	display:block;
	width:1px;
	height:1px;
	margin:0px;
	padding:0px;
	overflow:hidden;
}

/* ------------------------------------------------ */
/* headerArea                                       */
/* ------------------------------------------------ */
#headerArea {
	position: relative;
	width: 950px;
	height: 56px;
	margin: 0 auto;
	z-index:600;
}
#headerArea p.ci {
	position: absolute;
	left: 0px;
	top: 23px;
}
#headerArea p.tagline {
	position: absolute;
	left: 116px;
	top: 23px;
}
#headerArea p.cn {
	position: absolute;
	right: 0;
	top: 13px;
}

/* utilityNav */
#headerArea ul.utilityNav {
	position: absolute;
	right: 214px;
	top: 31px;
}

* html #headerArea ul.utilityNav {
	position: absolute;
	right: 214px;
	top: 31px;
	font-size: 84%;
}

#headerArea ul.utilityNav li {
	float: left;
	padding: 4px 10px 4px 10px;
	border-right: 1px solid #ccc;
	line-height:1;
}
#headerArea ul.utilityNav li a {
	padding: 0 0 0 8px;
	background: url(/english/image/icon_arrow_gray.gif) left center no-repeat;
	color: #666;
}

/* utilityNav2 */
#headerArea ul.utilityNav2 {
	position: absolute;
	right: 240px;
	top: 9px;
}
* html #headerArea ul.utilityNav2 {
	position: absolute;
	right: 240px;
	top: 9px;
	font-size: 84%;
}
#headerArea ul.utilityNav2 li {
	float: left;
	padding: 4px 10px 4px 10px;
	line-height:1;
}
#headerArea ul.utilityNav2 li a {
	padding: 0 0 0 8px;
	background: url(/english/image/icon_arrow_gray.gif) left center no-repeat;
	color: #666;
}

/* form */
#headerArea form.search {
	position: absolute;
	right: 20px;
	top: 33px;
}
#headerArea form.search input.query {
	float: left;
	width: 138px;
	border: 1px solid #b2b2b2;
	padding: 1px 0;
	background: #fff;
	font-size: 84%;
}
#headerArea form.search input.submit {
	float: left;
	margin: 0 0 0 2px;
}
#headerArea p.help {
	position: absolute;
	right: 0;
	top: 33px;
}

/* ------------------------------------------------ */
/* globalNavArea                                    */
/* ------------------------------------------------ */
#globalNavArea {
	width: 950px;
	margin: 0 auto 10px auto;
}
/* globalNav */
#globalNavArea ul.globalNav {
	z-index: 100;
	width: 950px;
	height: 36px;
	margin-left:-3px;
}
#globalNavArea ul.globalNav li {
	float: left;
}
#globalNavArea ul.globalNav li.current {
	position: relative;
	z-index: 300;
}

/* localNav */
#globalNavArea ul.localNav {
	height: 31px;
	border-bottom: 1px solid #b3b3b3;
}
#globalNavArea ul.localNav li {
	float: left;
	position: relative;
	margin-bottom: -1px;
	z-index: 210;
}

/*	mainvisual
============================================*/
@media print{
#mainvisual{ display: none; }
} 

#mainvisual_top{ width:994px; height:8px; margin:0 auto; background:url(/english/image/head_bg_top.gif) no-repeat 0 0; overflow: hidden;}
#mainvisual{ width:994px; height: 363px; margin:0 auto; background:url(/english/image/head_bg_middle.gif) repeat-y; }
#mainvisual_inner {
	/*display: none;*/
	position: relative;
	width:978px;
	height: 363px;
	margin:0 auto;
	font-size: 0;
	line-height: 0;
}
#wrapVisual {
	position: absolute;
	top: 0;
	left: 0;
}

#wrapVisual p {
	/*display: none;*/
	position: absolute;
	top: 0;
	left: 0;
}
#wrapThumb {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
}
#wrapThumb p {
	position: absolute;
	top: 297px;
	/*width: 180px;
	height: 48px;*/
	width: 181px;
	height: 52px;
	border: solid 1px #ffffff;
	cursor: pointer;
}
#thumb_1 { left: 16px; }
#thumb_2 { left: 207px; }
#thumb_3 { left: 398px; }
#thumb_4 { left: 589px; }
#thumb_5 { left: 780px; }

#thumbArrow {
	position: absolute;
	top: 286px;
	left: 16px;
	z-index: 100;
	/*width: 182px;
	height: 61px;*/
	width: 183px;
	height: 65px;	
	background: url(/english/image/bg_thumb_arrow.png) no-repeat;
}



/*	contents
============================================*/
#contents_outer{ width:994px; margin:0 auto; background:url(/english/image/main_bg_middle.gif) repeat-y 0 0; padding-bottom:0px;}
#contents{ width:955px; margin:0 auto; padding:9px 12px 10px 11px; position:relative; font-family:"メイリオ","Meiryo",'ＭＳ Ｐゴシック','MS Pゴシック','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif; *font-family: "ＭＳ Ｐゴシック";}
#contents_bottom{ width:994px; height:6px; background:url(/english/image/main_bg_bottom.gif) no-repeat 0 0; }
#contents #main{ width:712px; float:left; }
#contents #rightSide{ width:226px; float:right; padding-top:4px; }
* html #contents #rightSide{ width:226px; float:right; padding-top:4px;  }


/*	main
============================================*/
ul.list{ list-style: none; margin: 0px; margin-left: 0px; padding: 0px; line-height: 1.4;}
ul.list li {  margin: 0; padding: 0px 0px 0px 16px; background: url(/english/image/ico_arrow_orange.gif) no-repeat 3px 0.1em; list-style: none;}
ul.list li span{display:inline-block; width:80px; float: left;}
ul.list li span.heading{
	display:inline-block;
	_display:inline;
	width:580px;
	padding-left:15px;
	float: none;
	_float: left;
}


/*	menu
============================================*/
.menu_box{ background:url(/english/image/menu_bg.gif) repeat-y 0 0; min-height:251px;}
.left_column01{ width:228px; padding:0 7px 20px 0; float:left; display:inline; position:relative; }
.left_column01 p{ margin:10px; line-height:1.3 }
.center_column01{ width:228px; padding:0 0 20px 7px; float:left; display:inline; position:relative; }
.right_column01{ width:228px; float:right; display:inline; position:relative;  padding:0 0 20px 0;}
 
.left_column01 ul.list{ margin-left:0px; }
.center_column01 ul.list, .right_column01 ul.list{ margin-left:5px; }
.left_column01 ul.list li, .center_column01 ul.list li, .right_column01 ul.list li{ _width:200px; margin-left:5px; }

ul.list li.second {  margin: 0 0 0 16px;}
ul.list li.pattern01 {  margin: 0 0 0 0px; padding: 0px 0px 0px 24px; background: url(/english/image/ico_list.gif) no-repeat 3px 0px/*0.3em*/; list-style: none; float:left; display:inline; text-align:right;}
ul.list li.pattern02 {  margin: 0 0 0 10px; padding: 0px 0px 0px 24px; background: url(/english/image/ico_rss.gif) no-repeat 3px 0.3em; list-style: none; float:left; display:inline; text-align:right;}

.menu_pic{ margin-bottom:8px; }
.menu_title{ margin-bottom:12px; }
.line{ border-bottom:solid 1px #CCC; margin:0 0 13px -11px;}
.list_bn{ float:right; display:inline; margin:10px 5px 0 0;}

.menu_box a:link{ color:#555; text-decoration:none; }
.menu_box a:visited{ color:#555; text-decoration:none; }
.menu_box a:hover{ color:#F78A0B; text-decoration:underline; }
.menu_box a:active{ color:#F78A0B; text-decoration:underline; }

/*	rightside
============================================*/
#sidetopmenu{ margin:0 0 20px 6px; }
#support_erea{ width:221px; height:110px; position:relative; background:url(/english/image/banner_support_bg.gif) no-repeat 0 0;}
#support_erea .support_bn{ position:absolute; left:16px; top:120px; }
#support_erea .support_title{ position:absolute; left:16px; top:17px; }
#support_erea .support_link{
	width:200px;
	position:absolute;
	left:0px;
	top:43px;
	padding: 0 13px;
	line-height:1.4;
	font-size: 11px;
	*font-size: 12px;
}

#support_erea .support_link ul.list li a:hover{
	color: #555555;
	text-decoration: underline;
}
/*
#support_erea .support_text{
	position:absolute;
	left:0px;
	top:50px;
	padding: 0 20px;
	line-height:1.4;
}
*/
/*	footer
============================================*/
#footer{ width:100%; clear:both; padding:20px 0; border-top:solid 1px #F76B1E; line-height:1.2; font-family: "ＭＳ Ｐゴシック"¥9;}
#footer .inner{ width:978px; clear:both; margin:0 auto; }
#footer p a{ width:81px; height:39px; display:block; background:url(/english/image/logo_kddi.gif) no-repeat 0 0; text-indent:-9999px; margin-left:17px; }
#footer div.footerLinkTop{ width:859px; float:right; }
#footer div.footerLinkBottom{ width:859px; float:right; }
#footer ul li{ display:inline; }
#footer ul li a{ padding:0 5px 0 8px; background:url(/english/image/icon_arrow_gray.gif) no-repeat 0 4px; font-size:0.83em; }
#footer div.footerLinkTop{ margin-bottom:5px; padding-bottom:5px; border-bottom:#cdcdcd 1px solid; }
#footer div.footerLinkBottom .floatRight{ font-size:0.83em; }

#footerArea {
	position: relative;
	width: 958px;
	*width: 918px;
	margin: 10px auto 0;

/*	padding: 5px 0 28px 0;
	*padding:  5px 30px 0;  */
	padding: 0px 0 0px 0;
	*padding:  0px 40px 5px;	
	font-size: 84%;
	
}
#footerArea .firstBlock ul.topCategoryNav li a {
	padding: 0 0 0 8px;
	background: url(/image/bg_arrow_01.gif) left center no-repeat;
}
#footerArea .firstBlock ul.categoryNav li a {
	padding: 0 0 0 8px;
	background: url(/image/bg_arrow_01.gif) left center no-repeat;
}
#footerArea .lastBlock ul.utilityNav li a {
	padding: 0 0 0 8px;
	background: url(/image/bg_arrow_01.gif) left center no-repeat;
}
/* ------------------------------------------------ */
/* wrapper                                          */
/* ------------------------------------------------ */
#wrapper {
	min-width: 848px;
	/*padding: 0 20px;*/
	padding: 0 20px 20px;
	background: url(/english/image/bg_footerarea_v3.gif) left bottom repeat-x;
}



/*	pageTop
============================================*/
html>body #pageTop { position: fixed; bottom: 0; right: 0; z-index: 500; }
#pageTop{
	_position: absolute;
	_right: 0;
	_top:expression(eval(document.compatMode &&
	document.compatMode=='CSS1Compat') ?
	documentElement.scrollTop
	+(documentElement.clientHeight-this.clientHeight) - 0
	: document.body.scrollTop
	+(document.body.clientHeight-this.clientHeight) - 0);
	_z-index: 500;
	margin: 0;
}

/* MessageBoard
=========================================*/
#mBoard{
	margin: 0 auto;
	width:978px;

}

#mBoard td.mesB{
	background-color:#FFFFFF;
	border-style: solid; border-color: #ff0000;
}