﻿@charset "utf-8";

@import url("../packages/tpl20090411/css/import.css");

* {
	margin				:	0;
	padding				:	0;
}

li {
	list-style			:	none;
}

img {
	border				:	none;
	vertical-align		:	bottom;
}

body {
	text-align			:	center;
	color				:	#FFF;
	font-size			:	14px;
	background-color	:	#000;
	font-family			:	Osaka,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
}

* + html body {
	font-family			:	"メイリオ","Meiryo";
}

hr {
	height				:	0;
}

/***/
.clear {
	clear				:	both;
	height				:	0;
}

a {
	color				:	#FFF;
	text-decoration		:	underline;
}

a:hover {
	color				:	#F00;
	text-decoration		:	underline;
}

#preview{
	position			:	absolute;
	border				:	1px solid #ccc;
	background			:	#333;
	padding				:	5px;
	color				:	#fff;
}

/********************** Header Assembly ***********************/
#header {
	width				:	820px;
	margin				:	0 auto;
	font-size			:	12px;
	border				:	1px solid #333;
}

#header .box_1 {
	height				:	60px;
}

#header .logo {
	width				:	174px;
	height				:	60px;
	position : absolute;
	top : 0;
}

#header .box_1 h1,
#header .box_1 p {
	width				:	636px;
	float				:	right;
	text-align			:	right;
}

#header .box_1 h1 {
	padding				:	10px 0;
	font-size			:	12px;
	font-weight			:	bold;
	color				:	#F90;
}
.box_flash {
	font-size:26px;
	color:#FFC;
	text-align:left;
}
/********************** Global Navi Assembly ***********************/

.box_navi li {
	float				:	left;
}
/********************** FotterAssembly ***********************
******************2010年5月1日全面改訂　脇屋******************/
#footer {
	clear				:	both;
	width				:	820px;
	margin:0 auto;
	background-color: #1d1d1d;
	border-top:solid 1px #333333;
}
#footer .camarea li {
	width:818px;
	height:136px;
}
#footer .okomearea {
	background:url(../packages/tpl20090411/img/index/bg_okomearea.jpg) no-repeat left top;
	border:#333333 solid 1px;
	width:785px;
	height:303px;
	margin:13px 15px 13px 16px;
	position:relative;
}
#footer .profile {
	position:absolute;
	top:0;
	left:0;
	width:785px;
	height:109px;
}
#footer .profile a {
	width:785px;
	height:109px;
	text-indent:0;
}
#footer .CL_1,
#footer .CL_2,
#footer .CL_3 {
	position:absolute;
	top:128px;
}
#footer .CL_4 {
	position:absolute;
	top:214px;
}
#footer .CL_1,
#footer .CL_2 {
	width:250px;
	height:160px;
}
#footer .CL_1 {
	left:18px;
}
#footer .CL_2 {
	left:286px;
}
#footer .CL_3,
#footer .CL_4 {
	right:18px;
	width:217px;
	height:74px;
}
#footer .ryoteilink {
	width:786px;
	height:108px;
}
#footer .ryoteilink {
	margin:0 16px 13px 16px;
}
#footer .footer_nav {
	width:808px;
	padding:12px 10px 7px 0;
	border-top:#333333 solid 1px;
	text-align:right;
}
#footer .footer_nav a {
	font-size:12px;
}
#footer .clear p {
	padding:8px 0;
}

/********************** MainAssembly ***********************/
#container {
	width				:	818px;
	margin				:	0 auto;
	text-align			:	left;
	/*display				:	inline-block;*/
	padding				:	0;
	border-left			:	1px solid #353535;
	border-right		:	1px solid #353535;
}

#container:after {
	content				:	".";
	height				:	0;
	clear				:	both;
	display				:	block;
	visibility			:	hidden;
}

/********************** Two-Column(Left)Assembly ***********************/
#leftcolumn {
	width				:	218px;
	float				:	left;
	text-align			:	center;
	padding				:	16px 0 16px 10px;
}

/*********/
#banner_box_1_basic_area {
	text-align			:	left;
	margin-bottom: 10px;
}

/*********/
#loginarea {
	text-align			:	left;
	width				:	218px;
}
#loginarea .login {
	background-color	:	#A60000;
	padding				:	10px;
	line-height			:	1.4;
	font-size			:	12px;
	border: 1px solid #333333;
	margin-bottom: 5px;
}
#loginarea .login p .box96 {
	width			:	120px;
}

#loginarea .login .left {
	width				:	120px;
	float				:	left;
}

#loginarea .login .right {
	width				:	60px;
	float				:	right;
	font-size			:	12px;
	text-decoration		:	underline;
	text-align			:	right;
}

/*********/
#cartarea {
	text-align			:	left;
	margin-bottom:10px;
}

#cartarea .cart {
	border				:	1px solid #383838;
	padding				:	6px 15px;
	background:url(../packages/tpl20090411/img/index/bg_cart.gif) repeat-y left top;

}

#cartarea .cart .number {
	font-size			:	12px;
	border-bottom		:	1px dashed #383838;
	padding				:	9px 5px;
}

#cartarea .cart .total {
	color				:	#F00;
	padding				:	9px 5px 10px;
}

#cartarea .cart .priceress {
	font-size			:	12px;
	margin-bottom		:	8px;
	padding				:	5px;
	border				:	1px solid #383838;
}

#cartarea .cart .look {
	text-align			:	center;
}

/*********/
#purpose {
	margin-bottom		:	20px;
	text-align			:	left;
}

#purpose {
	border				:	1px solid #383838;
	background: url(../packages/tpl20090411/img/index/bg_itembox2.gif) repeat-y left top;
	margin-bottom: 10px;
}

#purpose dt {
	margin			:	0 0 10px 0;
}

#purpose dd {
	width				:	88px;
	float				:	left;
	padding				:	0 0 10px 20px;
}

#purpose dd.bottom {
	padding-bottom		:	20px;
}

#purpose dd.dot_1 {	background	:url(../packages/tpl20090411/img/common/side_dot_1.gif) no-repeat 10px 5px;	}
#purpose dd.dot_2 {	background	:url(../packages/tpl20090411/img/common/side_dot_2.gif) no-repeat 10px 5px;	}
#purpose dd.dot_6 {	background	:url(../packages/tpl20090411/img/common/side_dot_6.gif) no-repeat 10px 5px;	}
#purpose dd.dot_7 {	background	:url(../packages/tpl20090411/img/common/side_dot_7.gif) no-repeat 10px 5px;	}
#purpose dd.dot_8 {	background	:url(../packages/tpl20090411/img/common/side_dot_8.gif) no-repeat 10px 5px;	}
#purpose dd.dot_9 {	background	:url(../packages/tpl20090411/img/common/side_dot_9.gif) no-repeat 10px 5px;	}

#purpose dd.dot_1 a:hover {	color	:#CD0B0C;}
#purpose dd.dot_2 a:hover {	color	:#FF9999;}
#purpose dd.dot_6 a:hover {	color	:#FFCC00;}
#purpose dd.dot_7 a:hover {	color	:#006699;}
#purpose dd.dot_8 a:hover {	color	:#99CC00;}
#purpose dd.dot_9 a:hover {	color	:#6600CC;}


/*********/
#guide {
	font-size			:	10px;
	text-align			:	left;
	margin-bottom		:	10px;
}

#guide ul {
}

#guide li.text {
	line-height			:	2;
}

/*********/
#banner_box_2_basic_area {
	margin-bottom		:	10px;
}
/********************** Two-Column(Right)Assembly ***********************/
#two_maincolumn {
	width				:	570px;
	padding				:	16px 10px 16px 0;
	float				:	right;
}



#two_maincolumn #message_image{
	width				:	545px;
	margin              :   0 0 18px 12px;
}


#two_maincolumn #message_image p.bannerTxt{
color:#999999;
font-size:12px;
margin:5px 0 0;
text-align:left;
}

#two_maincolumn #message_text{
	border:solid 1px #353535;
	padding:5px;
	width				:	535px;
	margin              :   0 0 10px 12px;
	font-size:14px;
	line-height:150%;
	color               :   #cccccc;
}
#two_maincolumn #message_text a{
	color               :   #ffcc00;
}
#two_maincolumn #pickup{
width:537px;
	margin              :   0 0 0 12px;
}
#two_maincolumn #pickup h3{
margin:0 0 20px;
	background :#000000 url(../packages/tpl20090411/img/index/top_ttl_bg.jpg) no-repeat 0px -16px;
}
#two_maincolumn #pickup .pickup_list{
width:537px;
margin-bottom:20px;
}
#two_maincolumn #pickup .pickup_list .left_item{
width:267px;
float:left;
}
#two_maincolumn #pickup .pickup_list .right_item{
width:267px;
float:right;
}

#two_maincolumn #pickup .pickup_list:after,#two_maincolumn #pickup .pickup_list .left_item:after,#two_maincolumn #pickup .pickup_list .right_item:after {
    content: " ";
    display: block;
    visibility: hidden;
    clear: both;
    height: 0.1px;
    font-size: 0.1em;
    line-height: 0;
}
#two_maincolumn #pickup .pickup_list .left{
width:90px;
float:left;
}
#two_maincolumn #pickup .pickup_list .right{
width:168px;
float:right;
}
#two_maincolumn #pickup .pickup_list .right p{
margin-top:10px;
font-size:87%;
color:#cccccc;
line-height:130%;
letter-spacing:0px;
}

#two_maincolumn #pickup .pickup_list .right .title_p{
margin-top:0;
}
#two_maincolumn #pickup .pickup_list .right .title_p a{
font-size:14px;
color:#ffcc00;
line-height:150%;
}

/*********************************************/

#container .white_box .logout {
	text-align			:	right;
	margin				:	0 0 30px 0;
}

#container .white_box .logout a {
	color				:	#FFF;
	text-decoration		:	underline;
}

#container .white_box .logout a:hover {
	color				:	#F00;
	text-decoration		:	underline;
}

/*********************************************/

.logout {
	text-align			:	right;
	margin				:	0 20px 30px 0;
}





/********************** best5 ***********************/
#recomendrankingarea {
margin:0 auto;
width:545px;
}

#recomendrankingarea h2{
margin-bottom:14px;
}

#recomendrankingarea #recomendwrapp{
width:513px;
border:solid 1px #666666;
padding:16px 16px 0;
font-size:12px;
line-height:150%;
margin-bottom:18px;
}

#recomendrankingarea #first_item{
width:513px;
padding-bottom:24px;
}
#recomendrankingarea #first_item:after {
    content: " ";
    display: block;
    visibility: hidden;
    clear: both;
    height: 0.1px;
    font-size: 0.1em;
    line-height: 0;
}
#recomendrankingarea #first_item .left{
width:267px;
text-align:left;
float:left;
}
#recomendrankingarea #first_item .right{
width:246px;
float:right;
}

#recomendrankingarea #first_item .code_p{
}
#recomendrankingarea #first_item .title_p{
font-size:15px;
font-weight:bold;
}
#recomendrankingarea #first_item .price_p{
margin-bottom:2em;
/letter-spacing:-1px;
}

#recomendrankingarea #second_listarea{
border-top:dashed 1px #666666;
padding-top:28px;
}
#recomendrankingarea .second_list{
width:513px;
margin-bottom:34px;
}
#recomendrankingarea .second_list:after {
    content: " ";
    display: block;
    visibility: hidden;
    clear: both;
    height: 0.1px;
    font-size: 0.1em;
    line-height: 0;
}

#recomendrankingarea .second_list .second_list_left{
width:265px;
float:left;
}
#recomendrankingarea .second_list .second_list_right{
width:248px;
float:right;
}

#recomendrankingarea .second_item{
width:243px;
}
#recomendrankingarea .second_item:after {
    content: " ";
    display: block;
    visibility: hidden;
    clear: both;
    height: 0.1px;
    font-size: 0.1em;
    line-height: 0;
}

#recomendrankingarea .second_item .left{
width:85px;
float:left;
padding:0 0 12px;
margin:0;
}
#recomendrankingarea .second_list .second_list_left .second_item .left{
width:90px;
text-align:left;
}

#recomendrankingarea .second_item .right{
width:150px;
float:right;
}
#recomendrankingarea .second_item .price_p{
margin-bottom:1em;
/letter-spacing:-1px;
}
#recomendrankingarea .second_item .cap_p{
font-size:12px;
line-height:150%;
}

#rankingarea {
width:545px;
margin:0 auto;
}
#rankingarea .rankingwrapp{
width:545px;
font-size:12px;
line-height:150%;
margin-bottom:18px;
}
#rankingarea .rankingwrapp .rankinglist{
width:545px;
margin-bottom:18px;
}
#rankingarea .rankingwrapp .rankinglist:after {
    content: " ";
    display: block;
    visibility: hidden;
    clear: both;
    height: 0.1px;
    font-size: 0.1em;
    line-height: 0;
}
#rankingarea .rankingwrapp h3{
margin-bottom:18px;
}
#rankingarea .rankingwrapp .ranking_itemlist{
width:261px;
border:solid 1px #666666;
}
#rankingarea .rankingwrapp .leftlist{float:left;}
#rankingarea .rankingwrapp .rightlist{float:right;}
#rankingarea .rankingwrapp .ranking_itemlist h4{
background:url(../packages/tpl20090411/img/commonhd_bg.gif) left top no-repeat;
border-bottom:solid 1px #666666;
line-height:100%;
font-size:16px;
padding:9px 16px 9px;
margin-bottom:24px;
}


.ranking_item{
width:245px;
margin:0 0 30px 15px;
}
.ranking_item:after {
    content: " ";
    display: block;
    visibility: hidden;
    clear: both;
    height: 0.1px;
    font-size: 0.1em;
    line-height: 0;
}

.ranking_item .left{
width:85px;
float:left;
}
.ranking_item .right{
width:155px;
float:right;
}

.ranking_item .rank_p{
margin-bottom:8px;
}
.ranking_item .code_p{
font-size:12px;
line-height:120%;
}
.ranking_item .title_p{
font-size:12px;
}
.ranking_item .price_p{
font-size:12px;
/letter-spacing:-1px;
}

/*********************************************/
/*====================================================
左カラム、フッター改訂にあたり作成
2010年3月15日　脇屋
2010年6月9日　改定　脇屋
=====================================================*/
#message_text_new ul {
	border:#333333 solid 1px;
	margin-bottom:10px;
}
#message_text_new ul li p {
	padding:5px 8px;
	color:#999999;
	text-align:left;
}
#message_text_new .intotoroku {
	padding:0px 0px 8px 15px;
	font-size:12px;
	color:#999999;
	background:url(../packages/tpl20090411/img/index/bg_card.gif) no-repeat left top;
}
#message_text_new .intotoroku a {
	font-size:16px;
	color:#999999;
}
#message_text_new .intotoroku a:hover {
	color:#CC0000;
}
#message_text_new .intodeliv a {
	display:block;
	width:216px;
	height:45px;
}
.QAbnr,
.side_noshi,
.side_letter,
.side_doukon {
	margin-bottom:5px;
}
/*
-----------------------アイテムリンクボックス*/
#itemlink {
	width: 216px;
	border:1px solid #333333;
	margin-bottom:10px;
}
#itemlink dl {
	background:url(../packages/tpl20090411/img/index/bg_itembox2.gif) repeat-y left top;
}
.srname {
	width: 216px;
	height:30px;
	clear:both;
	margin-bottom:7px;
}
.srname a {
	display:block;
	width:202px;
	height:16px;
	padding: 7px;
	background-color: transparent;
}
.sr1 {
	background-color:#ffe4e1;
}
.sr1 a {
	background:url(../packages/tpl20090411/img/index/ttl_ryoen.gif) no-repeat left top;
}
.sr2 {
	background-color:#da70d6;
}
.sr2 a {
	background:url(../packages/tpl20090411/img/index/ttl_jyuni.gif) no-repeat left top;
}
.sr3 {
	background-color:#f5deb3;
}
.sr3 a {
	background:url(../packages/tpl20090411/img/index/ttl_tsume.gif) no-repeat left top;
}
.sr4 {
	background-color:#00008b;
}
.sr4 a {
	background:url(../packages/tpl20090411/img/index/ttl_hayashi.gif) no-repeat left top;
}
.sr5 {
	background-color:#9999CC;
}
.sr5 a {
	background:url(../packages/tpl20090411/img/index/ttl_kenjo.gif) no-repeat left top;
}
.sr6 {
	background-color:#ffc0cb;
}
.sr6 a {
	background:url(../packages/tpl20090411/img/index/ttl_hana.gif) no-repeat left top;
}
.srname a:hover {
	background-image:none;
}
#itemlink dd {
	float:left;
	width:98px;
	padding: 0 0 7px 10px;
}
#guide .guide_new {
	margin:5px 0;
}
#guide .guide_old {
	margin-bottom:2px;
}
/*
--------------------------7月15日デザイン改変のため追記　脇屋*/
#guide .guide_new_fax,
#guide .guide_new_excel {
	position:relative;
	margin-bottom:5px;
}
#guide .guide_new_fax a, 
#guide .guide_new_excel a {
	display:block;
	width:195px;
	height:34px;
	position:absolute;
	left:12px;
	bottom:10px;
}
