@charset "UTF-8";

/*

information{
	ファイル名 : /css/product/common.css;
	概要 : このCSSファイルは、「製品」ページでのみ使用しているCSSが設定されています。;
	サイト名 : NTTドコモのホームページ;
	URL : www.docomo.ne.jp/;
	コピーライト : (c) NTT DOCOMO, INC. All Rights Reserved.;
}

 */





/* コンテンツ
--------------------------------------------------------------------------
	
	1. 製品トップページ
	2. 製品内ナビゲーション
	3. 製品リスト（動的生成部分）
	5. 製品の更新情報
	6. スペックページTooltips
	7. メニュー（新体裁）

--------------------------------------------------------------------------
*/



/*	2. 製品内ナビゲーション
--------------------------------------------------------------------------	*/
.productsnav{
	padding-bottom:16px;
}

.productsnav p{
	margin:0;
	padding:0;
}
.productsnav img{vertical-align:bottom;}
.productsnav .subnav{width:672px; background:#d9d9d9 url("/product/images/common/bg_productsnav.gif") no-repeat;}
.productsnav .subnav p{float:right;}


/* 製品TOP用 060920追加 */
.productsnav .bottomnav{width:672px; background:#d9d9d9 url("/product/images/common/bg_productsnav02.gif") no-repeat;}
.productsnav .bottomnav p{float:right;}

/* 製品TOP用 081215追加 */
.productsnav .bottomnav02{width:672px; background:#f4dfe3 url("/product/images/common/bg_productsnav02_2.gif") no-repeat;}
.productsnav .bottomnav02 p{float:right;}

/* 製品中ページ用 081215追加 */
.productsnav .subnav02{width:672px; background:#f4dfe3 url("/product/images/common/bg_productsnav_2.gif") no-repeat;}
.productsnav .subnav02 p{float:right;}


/*	3. 製品リスト（動的生成部分）
--------------------------------------------------------------------------	*/
#maincol .boxArea table.squareArea .wrap{
	width:auto ;
	padding-bottom:0;
	background:none;
}

#maincol .boxArea table.squareArea .section{
	padding:0;
	border-left:none;
	border-right:none;
}

table.squareArea{
	width:648px !important;
}

table.squareArea td{
	width:24%;
	border:1px solid #d9d9d9 ;
}
table.squareArea td.dell{
	border:none;
}

div.squareArea{padding:2px;}

div.squareArea div.left{
	float:left;
	width:75px;
	margin:0;
	padding:5px 0;
}

/*\*//*/
div.squareArea .clear{clear:none !important;}
/**/


div.squareArea div.right{
	/*	\*/float:left;/* */
	width:95px;
	margin:0;
	padding: 5px 0;
}

div.squareArea p{
	margin:0 0 2px !important;
	padding-bottom:10px !important;
}


table.squareArea .type{
	padding-bottom:4px !important;
	text-align:right;
}

/*  シーズン強調アイコン画像 */
table.squareArea .seasonicon{
	padding-bottom: 2px !important;
}
table.squareArea .date{
	padding-bottom:0 !important;
}


table.squareArea .dateAdmb{
padding-bottom: 10px !important;
}



table.squareArea ul.normal li,
table.squareArea li.normal{
	margin-bottom:0;
}


div.squareArea .titlept02{
	margin: 0;
	padding:5px 5px 5px 13px;
	color: #3f3f3f;
	background:url("../../images/common/bg_boxcell4_h3.gif") 0 100% no-repeat;

}

div.squareArea .label{
	font-weight:normal;
	margin:0;
}


/* 製品リスト（動的生成部分）調整 070516追加 */


div.squareArea .titlept03{
	padding: 8px 0 0 5px;
}

div.squareArea .titlept03 .title{
	margin: 0;
	padding: 0 0 0 13px;
}


div.squareArea .titlept03 .bluept01{
	background:url("../../images/mark/blet_titlept03_bluept01.gif") 0 0 no-repeat;
}

div.squareArea .titlept03 .title{
	line-height:1em;
}


div .boxAjust .titlept01{
	margin-bottom:0;
	padding-bottom:0;
}


div .boxAjust .titlept02{
	margin-top:9px;
}


/*  2カラムデザイン変更 081105修正------------------------- */

table.squareArea2col{
	width:643px;
	margin:0px 0px 0px 5px !important;
}

table.squareArea2col .default{
	width:314px;
	background:url("../../product/images/common/bg_boxcell_off.gif") 0 0% no-repeat #fcfcfc;
	padding:0px 0px 0px 0px !important;
	margin:0px 0px 0px 0px !important;
}


/*  チップ画像下枠 */
table.squareArea2col .default .list-btm{
	background:url("../../product/images/common/bg_list_btm_off.gif") 0 0% no-repeat #ffffff;
	height:4px;
	margin:0px 0px 0px 0px !important;
	padding:0px 0px 8px 0px !important;
}


table.squareArea2col td.dell{
	background::none;

}


/*  商品タイトル */
table.squareArea2col .default .titlept02{
	margin: 0 !important;
	width:137px;
	padding:2px 5px 4px 5px;
	background:url("../../product/images/common/bg_boxcell_h3_off.gif") 0 100% no-repeat;
	height:auto;

}

/*  端末チップ画像 */
table.squareArea2col .list-image{
	padding:8px 0px 4px 8px !important;
	margin:0px !important;
}

/*  チップ画像右テキスト部分 */
table.squareArea2col .list-txt{
	margin: 0px !important;
	width:137px;
	padding:8px 0px 4px 8px;
}

/*  カラーチップ画像 */
table.squareArea2col .color{
	margin: 0 !important;
	padding:8px 0px 6px 5px !important;
}

/*  シーズン強調アイコン画像 */
table.squareArea2col .seasonicon{
	padding-bottom: 3px !important;
}

table.squareArea2col p.txt{
	margin: 0 !important;
	padding:0 !important;
}


/*	上線の追加 (add line top) （製品一覧専用）*/
#maincol .boxArea table.squareArea2col .adlt{
	width:137px;
	padding-top:8px;
	background:url("../../product/images/common/line_col.gif") repeat-x;
}

/*  発売中止（青バック）  */
table.squareArea2col .stop-date{
	margin: 0px 0px 4px 8px !important;
	padding:2px 0px 2px 1px !important;
	width:137px;
	background: #007bbc;
/*  	background: url("../../product/images/common/bg_data_blue.gif") 0 0% no-repeat #007bbc;  */
	text-align:center;
	font-weight:bold;
	color: #ffffff;
}

/*  発売中（赤バック）  */
table.squareArea2col .date{
	margin: 0px 0px 4px 8px !important;
	padding:2px 0px 2px 1px !important;
	width:137px;
	background: #cc0033;
/*  	background: url("../../product/images/common/bg_date_red.gif") 0 0% no-repeat #cc0033;  */
	text-align:center;
	font-weight:bold;
	color: #ffffff;
}

/*  発売リリースの発売予定（ゴールドバック） */
table.squareArea2col .md-date{
	margin: 0px 0px 4px 8px !important;
	padding:2px 0px 2px 1px !important;
	width:137px;
	background: #807800;
/*  	background: url("../../product/images/common/bg_date_gold.gif") 0 0% no-repeat #807800; */
	text-align:center;
	font-weight:bold;
	color: #ffffff;
}

/*  開発リリースの発売予定（グレーバック） */
table.squareArea2col .m-date{
	margin: 0px 0px 4px 8px !important;
	padding:2px 0px 2px 1px !important;
	width:137px;
	background: #747474;
/*  	background: url("../../product/images/common/bg_date_gray.gif") 0 0% no-repeat #747474; */
	text-align:center;
	font-weight:bold;
	color: #ffffff;
}

/*  開発リリースの発売予定（茶バック） */
table.squareArea2col .close-date{
	margin: 0px 0px 4px 8px !important;
	padding:2px 0px 2px 1px !important;
	width:137px;
	background: #9e5933;
/*  	background: url("../../product/images/common/bg_date_brown.gif") 0 0% no-repeat #9e5933; */
	text-align:center;
	font-weight:bold;
	color: #ffffff;
}


table.squareArea2col .date-btm{
	vertical-align:bottom;
}


div.squareArea2col{padding:0px;}



/*  2カラムデザインアクセシビリティ対応 140730修正------------------------- */

/*  端末画像外側のdiv */
table.squareArea2col .productlistArea .section{
	width:321px;
}
table.squareArea2col .productlistArea .list-wrap{
	min-height:178px;
	position: relative;
}

/*  チップ画像左画像部分 */
table.squareArea2col .productlistArea .list-left{
/* 	float:left; */
}


/*  チップ画像右コンテンツ部分 */
table.squareArea2col .productlistArea .list-right{
	width:153px;
	float:right;
	padding:0;
	overflow:visible;
}

/*  チップ画像右テキスト部分 */
table.squareArea2col .productlistArea .list-right .list-txt{
	padding:8px 16px 0 0;
}

table.squareArea2col .productlistArea .list-right .list-txt p{
	width:137px;
}

/*  発売日文言位置調整 */
table.squareArea2col .productlistArea .list-wrap .date-btm{
	padding:4px 0 0 0;
}


/*  発売中止（青バック）  */
table.squareArea2col .productlistArea .list-wrap .date-btm .stop-date{
	margin: 0px 0px 4px 0px !important;
	padding:2px 0px 2px 1px !important;
}

/*  発売中（赤バック）  */
table.squareArea2col .productlistArea .list-wrap .date-btm .date{
	margin: 0px 0px 4px 0px !important;
	padding:2px 0px 2px 1px !important;
}

/*  発売リリースの発売予定（ゴールドバック） */
table.squareArea2col .productlistArea .list-wrap .date-btm .md-date{
	margin: 0px 0px 4px 0px !important;
	padding:2px 0px 2px 1px !important;
}

/*  開発リリースの発売予定（グレーバック） */
table.squareArea2col .productlistArea .list-wrap .date-btm .m-date{
	margin: 0px 0px 4px 0px !important;
	padding:2px 0px 2px 1px !important;
}

/*  開発リリースの発売予定（茶バック） */
table.squareArea2col .productlistArea .list-wrap .date-btm .close-date{
	margin: 0px 0px 4px 0px !important;
	padding:2px 0px 2px 1px !important;
}



/*  マウスオーバー  081105修正------------------------- */

table.squareArea2col .selected{
	width:314px;
	background:url("../../product/images/common/bg_boxcell_on.gif") 0 0% no-repeat #fffbfc;
	padding:0px;
	margin:0px;
}


/*  チップ画像下枠 */
table.squareArea2col .selected .list-btm{
	background:url("../../product/images/common/bg_list_btm_on.gif") 0 0% no-repeat #ffffff;
	height:4px;
	padding: 0px 0px 8px 0px !important;
	margin: 0px !important;
}


/*  商品タイトル */
table.squareArea2col  .selected .titlept02{
	margin: 0 !important;
	width:137px;
	padding:2px 5px 4px 5px;
	background:url("../../product/images/common/bg_boxcell_h3_on.gif") 0 100% no-repeat;
	height:auto;

}
/*  /マウスオーバー  081105修正------------------------- */
/*  /2カラムデザイン変更 081105修正------------------------- */


/*	開く閉じるボタン
----------------------------------------- */

/*	H2の場合の位置調整	*/
.titlept01 .hBtnFunctionOpen a,
.titlept01 .hBtnFunctionClose a,
.titlept01 .hBtnServiceOpen a,
.titlept01 .hBtnServiceClose a,
.titlept01 .hBtnOpen a,
.titlept01 .hBtnClose a{line-height:0; margin:1px 1px 5px 0; outline:0px;}

/*	H3の場合の位置調整	*/
.titlept02 .hBtnOpen a,
.titlept02 .hBtnClose a{line-height:0; margin:0 5px 0 0; outline:0px;}


/*	マウスのオン、オフの設定（開くボタン）	*/
.hBtnOpen a{
	font-size:1px;
	display:block;
	width:88px; 
	height:22px; 
	background:url("/product/images/common/open.gif") 0 0 no-repeat; 
	text-indent:-9999px;
	}
.hBtnOpen a:hover{background-position:0 -22px;}

/*	マウスのオン、オフの設定（閉じるボタン）	*/
.hBtnClose a{
	font-size:1px;
	display:block;
	width:88px; 
	height:22px; 
	background:url("/product/images/common/close.gif") 0 0 no-repeat; 
	text-indent:-9999px;
	}
.hBtnClose a:hover{background-position:0 -22px;}


/*	マウスのオン、オフの設定（機能一覧をすべて開くボタン）	*/
.hBtnFunctionOpen a{
	font-size:1px;
	display:block;
	width:147px; 
	height:22px; 
	background:url("/product/images/common/open_function.gif") 0 0 no-repeat; 
	text-indent:-9999px;
	}
.hBtnFunctionOpen a:hover{background-position:0 -22px;}


/*	マウスのオン、オフの設定（機能一覧をすべて閉じるボタン）	*/
.hBtnFunctionClose a{
	font-size:1px;
	display:block;
	width:147px; 
	height:22px; 
	background:url("/product/images/common/close_function.gif") 0 0 no-repeat; 
	text-indent:-9999px;
	}
.hBtnFunctionClose a:hover{background-position:0 -22px;}


/*	マウスのオン、オフの設定（サービス一覧をすべて開くボタン）	*/
.hBtnServiceOpen a{
	font-size:1px;
	display:block;
	width:186px; 
	height:22px; 
	background:url("/product/images/common/open_service.gif") 0 0 no-repeat; 
	text-indent:-9999px;
	}
.hBtnServiceOpen a:hover{background-position:0 -22px;}


/*	マウスのオン、オフの設定（サービス一覧をすべて閉じるボタン）	*/
.hBtnServiceClose a{
	font-size:1px;
	display:block;
	width:186px; 
	height:22px; 
	background:url("/product/images/common/close_service.gif") 0 0 no-repeat; 
	text-indent:-9999px;
	}
.hBtnServiceClose a:hover{background-position:0 -22px;}




/*	カタログFLASH
----------------------------------------- */

#CatalogueFlashArea img{
	vertical-align:bottom;
}




/*	5. 製品の更新情報
-----------------------------------------------	*/

.titleSection{
	height:32px;
	background:#fff url("/product/images/index/bg_title_h2.gif") 0 0 no-repeat;
}

.titleSection h2{
	width:389px;
	margin:0;
	padding:7px 0 6px 11px;
	display:block;
	float:left;
}

html>body .titleSection h2{
	padding-bottom:2px;
}

#maincol .titleSection p{
	width:260px;
	margin:0;
	padding:7px 12px 6px 0;
	display:block;
	float:right;
	text-align:right;
}

html>body #maincol .titleSection p{
	padding-bottom:2px;

}




/*	6. スペックページTooltips
-----------------------------------------------	*/

#infoQmark{
	width:11px;
	height:11px;
	position: absolute;
	display:none;
}

#infoBox{
	width:356px;
	position: absolute;
  z-index: 90;
	display:none;
}

#infoBox #infoTextArea{
	text-align:left;
	background:url("/product/images/common/spec_tooltip_bg.gif") no-repeat scroll 0 0 transparent;
	padding:4px 10px 0px 10px;
}

#infoBox #infoBottom {
background:url("/product/images/common/spec_tooltip_bottom.gif") no-repeat scroll 0 100% transparent;
height:11px;
width:356px;
font-size:1%;
}

#infoTextArea p{
	margin:0;
	padding:0;
}

#infoClose{
margin:0px 0px 8px 0px !important;
padding:0;
text-align:right;
}




/*	7. メニュー
--------------------------------------------------------------------------	*/


.productsnav ul{
	width: 672px;
	height: 55px;
	margin: 0;
	padding: 0;
}

.productsnav li {
	float: left;
	list-style: none outside none;
	text-decoration: none;
	text-indent: -9999px;
	margin: 0;
	padding: 0;
	overflow:hidden;
	}

.productsnav li a {
	display: block;
	height: 55px;
}


/*	2列 トップ 特長	*/

ul#navCol2 a{
	background: url("/product/images/common/navcol2.jpg") no-repeat scroll 0 0 transparent;
}


ul#navCol2 li#navTop a{
	background-position: 0 0;
	width: 336px;
}

ul#navCol2 li#navTopics01 a{
	background-position: -336px 0;
	width: 336px;
}


ul#navCol2 li#navTop a.on,
ul#navCol2 li#navTop a:hover{
	background-position: 0 -55px;
}

ul#navCol2 li#navTopics01 a.on,
ul#navCol2 li#navTopics01 a:hover{
	background-position: -336px -55px;
}

/*	3列	*/

ul#navCol3 a{
	background: url("/product/images/common/navcol3.jpg") no-repeat scroll 0 0 transparent;
}


ul#navCol3 li#navTop a{
	background-position: 0 0;
	width: 225px;
}

ul#navCol3 li#navTopics01 a{
	background-position: -225px 0;
	width: 223px;
}

ul#navCol3 li#navSpec a{
	background-position: -448px 0;
	width: 224px;
}

ul#navCol3 li#navTop a.on,
ul#navCol3 li#navTop a:hover{
	background-position: 0 -55px;
}

ul#navCol3 li#navTopics01 a.on,
ul#navCol3 li#navTopics01 a:hover{
	background-position: -225px -55px;
}

ul#navCol3 li#navSpec a.on,
ul#navCol3 li#navSpec a:hover{
	background-position: -448px -55px;
}



/*	3列 トップ 特長 便利機能	*/

ul#navCol3-2 a{
	background: url("/product/images/common/navcol3_2.jpg") no-repeat scroll 0 0 transparent;
}


ul#navCol3-2 li#navTop a{
	background-position: 0 0;
	width: 225px;
}

ul#navCol3-2 li#navTopics01 a{
	background-position: -225px 0;
	width: 223px;
}

ul#navCol3-2 li#navTopics02 a{
	background-position: -448px 0;
	width: 224px;
}

ul#navCol3-2 li#navTop a.on,
ul#navCol3-2 li#navTop a:hover{
	background-position: 0 -55px;
}

ul#navCol3-2 li#navTopics01 a.on,
ul#navCol3-2 li#navTopics01 a:hover{
	background-position: -225px -55px;
}

ul#navCol3-2 li#navTopics02 a.on,
ul#navCol3-2 li#navTopics02 a:hover{
	background-position: -448px -55px;
}

/*	3列 トップ 特長 スペック	*/

ul#navCol3-3 a{
	background: url("/product/images/common/navcol3_3.jpg") no-repeat scroll 0 0 transparent;
}


ul#navCol3-3 li#navTop a{
	background-position: 0 0;
	width: 225px;
}

ul#navCol3-3 li#navTopics01 a{
	background-position: -225px 0;
	width: 223px;
}

ul#navCol3-3 li#navSpec a{
	background-position: -448px 0;
	width: 224px;
}

ul#navCol3-3 li#navTop a.on,
ul#navCol3-3 li#navTop a:hover{
	background-position: 0 -55px;
}

ul#navCol3-3 li#navTopics01 a.on,
ul#navCol3-3 li#navTopics01 a:hover{
	background-position: -225px -55px;
}

ul#navCol3-3 li#navSpec a.on,
ul#navCol3-3 li#navSpec a:hover{
	background-position: -448px -55px;
}

/*	4列	*/

ul#navCol4 a{
	background: url("/product/images/common/navcol4.jpg") no-repeat scroll 0 0 transparent;
}


ul#navCol4 li#navTop a{
	background-position: 0 0;
	width: 169px;
}

ul#navCol4 li#navTopics01 a{
	background-position: -169px 0;
	width: 168px;
}

ul#navCol4 li#navTopics02 a{
	background-position: -337px 0;
	width: 167px;
}

ul#navCol4 li#navSpec a{
	background-position: -504px 0;
	width: 168px;
}


ul#navCol4 li#navTop a.on,
ul#navCol4 li#navTop a:hover{
	background-position: 0 -55px;
}

ul#navCol4 li#navTopics01 a.on,
ul#navCol4 li#navTopics01 a:hover{
	background-position: -169px -55px;
}

ul#navCol4 li#navTopics02 a.on,
ul#navCol4 li#navTopics02 a:hover{
	background-position: -337px -55px;
}


ul#navCol4 li#navSpec a.on,
ul#navCol4 li#navSpec a:hover{
	background-position: -504px -55px;
}


/*	4列（トップ、特長、スペック、オプション）	*/

ul#navCol4-2 a{
	background: url("/product/images/common/navcol4_2.jpg") no-repeat scroll 0 0 transparent;
}


ul#navCol4-2 li#navTop a{
	background-position: 0 0;
	width: 169px;
}

ul#navCol4-2 li#navTopics01 a{
	background-position: -169px 0;
	width: 168px;
}

ul#navCol4-2 li#navSpec a{
	background-position: -337px 0;
	width: 167px;
}

ul#navCol4-2 li#navOption a{
	background-position: -504px 0;
	width: 168px;
}



ul#navCol4-2 li#navTop a.on,
ul#navCol4-2 li#navTop a:hover{
	background-position: 0 -55px;
}

ul#navCol4-2 li#navTopics01 a.on,
ul#navCol4-2 li#navTopics01 a:hover{
	background-position: -169px -55px;
}

ul#navCol4-2 li#navSpec a.on,
ul#navCol4-2 li#navSpec a:hover{
	background-position: -337px -55px;
}

ul#navCol4-2 li#navOption a.on,
ul#navCol4-2 li#navOption a:hover{
	background-position: -504px -55px;
}


/*	5列	*/

ul#navCol5 a{
	background: url("/product/images/common/navcol5.jpg") no-repeat scroll 0 0 transparent;
}


ul#navCol5 li#navTop a{
	background-position: 0 0;
	width: 135px;
}

ul#navCol5 li#navTopics01 a{
	background-position: -135px 0;
	width: 134px;
}

ul#navCol5 li#navTopics02 a{
	background-position: -269px 0;
	width: 135px;
}

ul#navCol5 li#navSpec a{
	background-position: -404px 0;
	width: 134px;
}

ul#navCol5 li#navOption a{
	background-position: -538px 0;
	width: 134px;
}



ul#navCol5 li#navTop a.on,
ul#navCol5 li#navTop a:hover{
	background-position: 0 -55px;
}

ul#navCol5 li#navTopics01 a.on,
ul#navCol5 li#navTopics01 a:hover{
	background-position: -135px -55px;
}

ul#navCol5 li#navTopics02 a.on,
ul#navCol5 li#navTopics02 a:hover{
	background-position: -269px -55px;
}


ul#navCol5 li#navSpec a.on,
ul#navCol5 li#navSpec a:hover{
	background-position: -404px -55px;
}


ul#navCol5 li#navOption a.on,
ul#navCol5 li#navOption a:hover{
	background-position: -538px -55px;
}


/*	20140730 アクセシビリティ対応	*/

.productsnavBtn{
	padding-bottom:16px;
}


.productsnavBtn ul{
	margin: 0;
	padding: 0;
}

.productsnavBtn li {
	float: left;
	list-style: none outside none;
	text-decoration: none;
	margin: 0;
	padding: 0;
	}


