@charset "shift_jis";

/* =========================================================

	layout.css

========================================================= */

/* --------------------------------------------------------
	body
-------------------------------------------------------- */

body {
	width: 100%;
	font-size: 83%;
	line-height: 1.6;
	color: #333333;
}


/* --------------------------------------------------------
	header-container
-------------------------------------------------------- */

#header-container {
	clear: both;
	padding: 0 20px;
	border-top: 2px solid #004697;
}

/*	header
-------------------------------------------------------- */

#header {
	width: 100%;
	min-width: 950px;
}

/* site-logo */

#header #site-logo {
	float: left;
	width: 330px;
	padding: 2.2em 0 0 0;
}

/* header-utility */

#header #header-utility {
	float: right;
	width: 600px;
	padding-bottom: 9px;
}

/* header-info */

#header #header-info {
	float: right;
	width: 600px;
	padding-top: 5px;
	text-align: right;
	font-size: 83%;
}
#header #header-info li {
	display: inline;
	margin-left: 10px;
	padding-left: 16px;
	background: url(/img/usr/header_ic01.gif) 0% 50% no-repeat;
	white-space: nowrap;
	_zoom: 1;
}
#header #header-info li.nav01 {
	background-image: url(/img/usr/header_ic01.gif);
}
#header #header-info li.nav02 {
	background-image: url(/img/usr/header_ic02.gif);
}
#header #header-info li.nav03 {
	background-image: url(/img/usr/header_ic08.gif);
}
#header #header-info li.nav04 {
	background-image: url(/img/usr/header_ic09.gif);
}
#header #header-info li.nav05 {
	background-image: url(/img/usr/header_ic10.gif);
}
#search .detail-search {
	padding-left:10px;
}
#search .detail-search a {
	background: url(/img/usr/link_ic01.gif) 0% 50% no-repeat;
	padding-left:8px;
	font-size: 83%;	
}
/* guest-status */

#header #guest-status-container {
	float: right;
	width: 390px;
	margin-top: 5px;
	background: url(/img/usr/header_bg02.gif) 0% 100% no-repeat;
}
#header #guest-status-container #guest-status {
	padding: 7px 4px 7px 10px;
	background: url(/img/usr/header_bg01.gif) 0% 0% no-repeat;
	_zoom: 1;
	font-size:94%;
}
#header #guest-status-container #guest-status p {
	margin-bottom: 5px;
	color: #666666;
}
#header #guest-status-container #guest-status .guest-name {
	font-weight: bold;
}
#header #guest-status-container #guest-status .guest-login {
	font-size: 83%;
}
#header #guest-status-container #guest-status ul {
	clear: both;
}
#header #guest-status-container #guest-status ul li {
	float: left;
	margin-right: 5px;
	background: url(/img/usr/header_ic03.gif) 0% 0.3em no-repeat;
	white-space: nowrap;
}
#header #guest-status-container #guest-status ul li.nav01 {
	padding-left: 13px;
	background-image: url(/img/usr/header_ic03.gif);
}
#header #guest-status-container #guest-status ul li.nav02 {
	padding-left: 16px;
	background-image: url(/img/usr/header_ic04.gif);
}
#header #guest-status-container #guest-status-container-cart {
	padding-left:3px;
    vertical-align:middle
}

/* user-status */

#header #user-status-container {
	float: right;
	width: 600px;
	margin-top: 5px;
	background: url(/img/usr/header_bg04.gif) 0% 100% no-repeat;
}
#header #user-status-container #user-status {
	padding: 7px 10px;
	background: url(/img/usr/header_bg03.gif) 0% 0% no-repeat;
	_zoom: 1;
	font-size:94%;
}
#header #user-status-container #user-status p {
	margin-bottom: 5px;
	color: #666666;
}
#header #user-status-container #user-status .user-name {
	font-weight: bold;
}
#header #user-status-container #user-status .user-logout {
	font-size: 83%;
}
#header #user-status-container #user-status ul {
	clear: both;
}
#header #user-status-container #user-status ul li {
	float: left;
	margin-right: 8px;
	background: url(/img/usr/header_ic04.gif) 0% 0.3em no-repeat;
	white-space: nowrap;
}
#header #user-status-container #user-status ul li.nav01 {
	padding-left: 16px;
	background-image: url(/img/usr/header_ic04.gif);
}
#header #user-status-container #user-status ul li.nav02 {
	padding-left: 14px;
	background-image: url(/img/usr/header_ic05.gif);
}
#header #user-status-container #user-status ul li.nav03 {
	padding-left: 11px;
	background-image: url(/img/usr/mypage_ic02.gif);
}
#header #user-status-container #user-status ul li.nav04 {
	padding-left: 15px;
	margin-right: 0;
	background-image: url(/img/usr/header_ic07.gif);
}
#header #user-status-container #user-status ul li.nav04 a {
	font-weight: bold;
	color: #f72e0a;
}
#header #user-status-container #user-status-cart {
	padding-left: 10px;
	vartical-align: middle;
}

/* --------------------------------------------------------
	globalnav-container
-------------------------------------------------------- */

#globalnav-container {
	padding: 0 20px;
}

/*	globalnav
-------------------------------------------------------- */

#globalnav {
	width: 64.5em;
	*width: 1086px; /* for IE6,7 */
	overflow: hidden;
	margin: 0 auto;
	padding: 0;
	list-style: none;
	font-family: Verdana, メイリオ, Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", sans-serif;
	font-size: 100%;
}

#globalnav li {
	float: left;
	margin: 0 .5em 0 0;
	min-width: 3em;
}

#globalnav a {
	position: relative;
	background: #004697;
	background-image: linear-gradient(to bottom, #4074b1, #004697);  
	padding: .4em 1.5em;
	min-width: 3em;
	float: left;
	text-decoration: none;
	text-align: center;
	font-weight: bold;
	color: #FFFFFF;
	border-radius: 5px 0 0 0;
	box-shadow: 0 2px 2px #666;
}

#globalnav a:hover,
#globalnav a:hover::after,
#globalnav a:focus,
#globalnav a:focus::after {
	background: #eeeeee;
	background-image: linear-gradient(to bottom, #afccec, #EEE);    
	color: #333;
	text-shadow: -1px 1px 0 rgba(255,255,255,.5); 
}

#globalnav a:focus {
	outline: 0;
}

#globalnav a::after {
	content:'';
	position:absolute;
	top: 0;
	right: -.5em;  
	bottom: 0;
	width: 1em;
	background: #004697;
	background-image: linear-gradient(to bottom, #4074b1, #004697); 
	box-shadow: 2px 2px 2px rgba(0,0,0,.4);
	transform: skew(10deg);
	border-radius: 0 5px 0 0;
	z-index: 1;
}

#globalnav .current a,
#globalnav .current a::after {
	background: #eeeeee;
	background-image: linear-gradient(to bottom, #afccec, #EEE);      
	color: #333;
	text-shadow: -1px 1px 0 rgba(255,255,255,.5); 
	z-index: 2;
}

/* --------------------------------------------------------
	search-container
-------------------------------------------------------- */

#search-container {
	clear: both;
	padding: 14px 20px 6px;
	background: #eeeeee;
	box-shadow: 0 0 6px 0 rgba(0,0,0,.6);
	_zoom: 1;
}
/* --------------------------------------------------------
	fullcontents
-------------------------------------------------------- */
/*#fullcontents #main  {
	margin: 30px auto 0;
}
#fullcontents #main .item-txt {
	font-weight:bold;
	font-size:115%;
}
#fullcontents #main .full-inner {
	width:920px;
	padding:0 15px;
}*/
/*	search
-------------------------------------------------------- */

#search {
	width: 897px;
	margin: 0 auto;
	padding-left: 53px;
	background: url(../img/usr/search_bg02.gif) 0% 50% no-repeat;
}
#search .searchtitle {
	display: none;
}
#search .search-category select {
	color: #494949;
	vertical-align: middle;
	font-size: 125%;
	height: 28px;
}
#search input.search-keyword {
	width: 100%;
	min-width: 320px;
	max-width: 460px;
	font-size: 125%;
	height: 20px;
	padding: 2px;
	margin-left: 8px;
	vertical-align: middle;
	border: 2px solid #7f9db9;
	background-color: #FFFFFF;
}

#search input.pre-txt {
	color: #a4a4a4;
}
#search input.search-bt {
	margin: 0 0 0 8px;
	vertical-align: middle;
}

/* --------------------------------------------------------
	tagline
-------------------------------------------------------- */

/* tagline-header */
#tagline-header {
	width: 50%;
	min-width: 440px;
	position: absolute;
	top:  5px;
	left: 20px;
	font-size: 83%;
	color: #627997;
        line-height:12px;
}

/* tagline-footer */
#tagline-footer {
	width: 100%;
	min-width: 950px;
	position: absolute;
	bottom:  -50px;
	left: 0;
	font-size: 83%;
	color: #627997;
	text-align: center;
}

/* --------------------------------------------------------
	contents-container
-------------------------------------------------------- */

#contents-container {
	clear: both;
	margin-top: 18px;
	padding: 0 20px;
}

/*	header
-------------------------------------------------------- */
#contents {
	position: relative;
	width: 100%;
	min-width: 950px;
}

/* --------------------------------------------------------
	side
-------------------------------------------------------- */

.side {
	position: relative;
	display: inline;
	z-index: 99;
}

/* l-nav */

#l-nav {
	float: left;
	width: 190px;
	margin-right: -190px;
}

#l-nav .box-bar {
  width: 170px;
  height: 160px;
  overflow: auto;
}
/* r-nav */

#r-nav {
	float: right;
	width: 280px;
	margin-left: -280px;
}
.column-2 #r-nav {
	margin-top: 10px;
}

/* box01 */

.side .box01 {
	margin-bottom: 10px;
	_zoom: 1;
}
.side .box01 .box-title {
	padding: 9px 9px 0;
	border: 1px solid #cccccc;
	border-bottom: none;
	_zoom: 1;
}
.side .box01 .box-title-txt {
	display: block;
	padding-left: 7px;
	border-left: 3px solid #004697;
	line-height: 1.2;
	font-weight: bold;
}
.side .box01 .box-inner {
	padding: 9px;
	border: 1px solid #cccccc;
	border-top: none;
	_zoom: 1;
}

/* categorynav-area */

.side .categorynav-area li.categorynav-tree01 {
	font-weight: bold;
}
.side .categorynav-area li.categorynav-tree02 {
	padding-left: 14px;
	background: url(/img/usr/l_nav_ic01.gif) 5px 0.35em no-repeat;
	font-weight: normal;
	_zoom: 1;
}
.side .categorynav-area li.categorynav-tree03 {
	padding-left: 28px;
	background: url(/img/usr/l_nav_ic01.gif) 19px 0.35em no-repeat;
	font-weight: normal;
	_zoom: 1;
}
.side .categorynav-area li.categorynav-tree04 {
	padding-left: 42px;
	background: url(/img/usr/l_nav_ic01.gif) 33px 0.35em no-repeat;
	font-weight: normal;
	_zoom: 1;
}
.side .categorynav-area li.categorynav-current {
    font-weight: bold;
    background-color: #E5ECF4;
}
.side .categorynav-area li.categorynav-current a {
    text-decoration: none;
    color: #333333;
}
/*.side .categorynav-area ul li {
	font-weight: bold;
}
.side .categorynav-area ul li ul li {
	padding-left: 14px;
	background: url(/img/usr/l_nav_ic01.gif) 5px 0.35em no-repeat;
	font-weight: normal;
	_zoom: 1;
}
.side .categorynav-area ul.categorynav-link li {
	font-weight:normal;
}
*/
/* pickup-area */

.side .pickup-area .box-inner {
	padding: 0 9px 9px;
}
.side .pickup-area .heading01,
.side .history-area .heading01,
.side .ranking-area .heading01{
	margin: 0 !important;
}
.side .pickup-area ul,
.side .history-area ul,
.side .ranking-area ul {
	overflow: hidden;
	_zoom: 1;
}
.side .pickup-area ul li,
.side .history-area ul li,
.side .ranking-area ul li {
	margin: -1px 0 10px 0;
	padding-top: 11px;
	background: url(/img/usr/hr_bg01.gif) 0% 0% repeat-x;
	_zoom: 1;
}

/* history-area */

.side .history-area .box-inner {
	padding: 0 9px;
}

/* ranking-area */

.side .ranking-area .box-inner {
	padding: 0 9px 9px;
}

/* banner-area */

.side .banner-area li {
	margin-bottom: 10px;
}

/* mobile-area */

.side .mobile-area .box-inner {
	padding: 9px 9px 2px;
	line-height: 1.4;
	font-size: 83%;
	text-align: center;
}
.side .mobile-area .box-inner p {
	margin-bottom: 7px;
}

/* order-flow-area */
.side .order-flow-area .box-inner,
.side .affiliate-flow-area .box-inner{
	background: #fff9df;
}
.side .order-flow-area .box-title,
.side .affiliate-flow-area .box-title {
	background: #fff9df;
}
.side .order-flow-area .box-title-txt,
.side .affiliate-flow-area .box-title-txt {
	border-left: 3px solid #359600;
}
.side .order-flow-area .box-inner,
.side .affiliate-flow-area .box-inner {
	background: #fff9df;
}
.side .order-flow-area .box-inner ul,
.side .affiliate-flow-area .box-inner ul {
	margin-bottom: -24px;
	line-height: 1.2;
	overflow: hidden;
	_zoom: 1;
}
*:first-child+html .side .order-flow-area .box-inner ul,
*:first-child+html .side .affiliate-flow-area .box-inner ul { /* for IE7 */
	margin-bottom: 0;
}
.side .order-flow-area .box-inner ul li,
.side .affiliate-flow-area .box-inner ul li {
	margin: -19px 0 24px;
	padding-top: 19px;
	background: url(/img/usr/flow_bg02.gif) 50% 0% no-repeat;
	_zoom: 1;
}
.side .order-flow-area .box-inner ul li .flow-inner,
.side .affiliate-flow-area .box-inner ul li .flow-inner {
	display: block;
	padding: 13px 0;
	border: 2px solid #60ba20;
	text-align: center;
	background: #f5f5f5;
	color: #999999;
	_zoom: 1;
}
.side .order-flow-area .box-inner ul li.current .flow-inner/*,
.side .affiliate-flow-area .box-inner ul li.current .flow-inner*/ {
	padding: 10px 0;
	background:url(/img/usr/flow_bg01.gif) 50% 0% repeat-x #62bb23;
	color: #ffffff;
	font-size: 125%;
	font-weight: bold;
}
.side .order-flow-area .box-inner ul li.current .flow-inner .small-txt,
.side .affiliate-flow-area .box-inner ul li.current .flow-inner .small-txt {
	font-size: 73% !important;
	font-weight: normal;
}

/* affiliate-flow-area */
.side .affiliate-flow-area .box-title-txt {
	border-left: 3px solid #004697;
}
.side .affiliate-flow-area .box-inner ul li {
	background-image: url(/img/usr/flow_bg04.gif);
	
	background-repeat: no-repeat;
	zoom:1;
}
.side .affiliate-flow-area .box-inner ul li .flow-inner {
	border: 2px solid #4c8bd8;
}
.side .affiliate-flow-area .box-inner ul li.current .flow-inner {
/*	background-image: url(/img/usr/flow_bg03.gif);*/
	padding: 10px 0;
	background:url(/img/usr/flow_bg03.gif) 50% 0% repeat-x #4C8BD8;
	color: #ffffff;
	font-size: 125%;
	font-weight: bold;
}

/* mypage-area */
.side .mypage-area {
	background: #e6f4dc;
}
.side .mypage-area .box-title {
	padding: 1px;
}
.side .mypage-area .box-title-txt {
	padding: 6px 8px;
	border: none;
	background: #32a927;
	color: #ffffff;
}
.side .mypage-area .box-inner {
	line-height: 1.4;
}
.side .mypage-area .mypage-name {
	margin-bottom: 8px;
}
.side .mypage-area .mypage-name span {
	font-size: 115%;
	font-weight: bold;
}
.side .mypage-area .mypage-point,
.side .mypage-area .mypage-shop {
	margin-bottom: 8px;
	padding-left: 16px;
	text-indent: -16px;
}
.side .mypage-area .mypage-point span,
.side .mypage-area .mypage-shop span {
	font-weight: bold;
}
.side .mypage-area .mypage-list {
	clear: both;
	margin: 15px 0 0;
}
.side .mypage-area .mypage-list li {
	margin-bottom: 8px;
	padding-left: 16px;
	background: url(/img/usr/header_ic03.gif) 0% 0.25em no-repeat;
	_zoom: 1;
}
.side .mypage-area .mypage-list li li {
	margin-bottom: 0;
}
.side .mypage-area .mypage-list li.nav01 {
	background-image: url(/img/usr/header_ic05.gif);
}
.side .mypage-area .mypage-list li.nav02 {
	background-image: url(/img/usr/mypage_ic01.gif);
}
.side .mypage-area .mypage-list li.nav03 {
	background-image: url(/img/usr/mypage_ic02.gif);
}
.side .mypage-area .mypage-list li.nav04 {
	background-image: url(/img/usr/header_ic06.gif);
}
.side .mypage-area .mypage-list li.current a {
	color: #333333;
	font-weight: bold;
	text-decoration: none;
}
.side .mypage-area .mypage-list li.current li a {
	color: #003399;
	font-weight: normal;
	text-decoration: underline;
}
.side .mypage-area .mypage-list li li.current a {
	color: #333333;
	font-weight: normal;
	text-decoration: none;
}
.side .mypage-area .mypage-nav {
	margin-top: 18px;
	padding-top: 20px;
	background: url(/img/usr/affiliate/affiliate_bg01.gif) 0% 0% repeat-x;
	_zoom: 1;
}
.side .mypage-area .mypage-nav dt {
	margin-bottom: 3px;
	padding-left: 10px;
	background: url(/img/usr/link_ic01.gif) 0% 0.55em no-repeat;
	_zoom: 1;
}
.side .mypage-area .mypage-nav dd {
	margin-bottom: 8px;
	padding-left: 10px;
}

/* --------------------------------------------------------
	main
-------------------------------------------------------- */

#main-container {
	float: left;
	width: 100%;
}

/* column-3 */
.column-3 #main-container #main {
	margin: 0 300px 0 210px;
}
.column-3 #main-container #main hr {
	width: 440px;
	height: 1px;
}

/* column-2 */
.column-2 #main-container #main {
	margin: 30px 300px 0 0;
}
.column-2 #main-container #main hr {
	width: 650px;
	height: 1px;
}
.column-2-1 #main-container #main {
	/*margin: 10px 110px 0 210px;*/
	margin: 0 0 0 210px;
}
.column-2-1 #main-container #main hr {
	width: 650px;
	height: 1px;
}
/* column-1 */
.column-1 #main {
	/* width: 650px; */
	/*margin: 30px auto 0; */
	width: 950px;
	margin: 0 auto;
}

.column-1 #main-w800 {
	width: 800px;
	margin: 30px auto 0;
}
.column-1 #main hr {
	width: 650px;
	height: 1px;
}
.column-1 .main-w100 {
	width: 100% !important;
	margin-top: 20px !important;
}
.column-1 .main-w100 hr {
	width: 100% !important;
	height: 1px;
}


/* --------------------------------------------------------
	footer-container
-------------------------------------------------------- */

#footer-container {
	clear: both;
	margin-top: 60px;
	padding: 0 20px;
}

/*	footer
-------------------------------------------------------- */

#footer {
	min-width: 950px;
	margin-top: 10px;
	padding-bottom: 13px;
}

#footer #site-info {
	margin: 0 auto;
	padding: 10px 0 8px;
	background: url(/img/usr/footer_bg01.gif) 0% 0% repeat-x #ebebeb;
}

#footer #site-info #utility-nav {
	float: left;
}

#footer #site-info #utility-nav ul {
	overflow: hidden;
}

#footer #site-info #utility-nav ul li {
	float: left;
	margin: 0 10px 0 -1px;
	padding-left: 11px;
	background: url(/img/usr/footer_ic01.gif) no-repeat 0 50%;
}

#footer #site-info .page-top {
	float: right;
	padding: 0 11px 0 18px;
	background: url(/img/usr/footer_ic02.gif) no-repeat 0 50%;
	_zoom: 1;
}

#footer #site-copyright {
	clear: both;
	padding: 10px 0;
	text-align: center;

	color: #999999;
	background: url(/img/usr/footer_bg02.gif) 0% 100% repeat-x;
	_zoom: 1;
}

/* --------------------------------------------------------
	popup
-------------------------------------------------------- */
.popup #header-container {
	border-top: none;
	border-bottom: 2px solid #004697;
}
.popup #header,
.popup #pagetitle,
.popup #main {
	width: 650px;
	min-width: 650px;
	margin: 0 auto;
}
.popup #main {
	margin: 30px auto;
}
.popup #footer-container {
	margin-top: 0;
}
.popup #footer-container #footer {
	border-top: 2px solid #5e97dc;
}

/* --------------------------------------------------------
	clearfix for this files selectior
-------------------------------------------------------- */

#header:after,
#header #header-utility:after,
#header #guest-status-container #guest-status ul:after,
#header #user-status-container #user-status ul:after,
#globalnav:after,
#search:after,
#contents:after,
#footer #site-info:after {
	display:block;
	clear:both;
	height:0;
	visibility:hidden;
	content:".";
}

#header,
#header #header-utility,
#header #guest-status-container #guest-status ul,
#header #user-status-container #user-status ul,
#globalnav,
#search,
#contents,
#footer #site-info {
	min-height:1%;
}

/* IE6 hacks */
* html #header,
* html #header #header-utility,
* html #header #guest-status-container #guest-status ul,
* html #header #user-status-container #user-status ul,
* html #globalnav,
* html #search,
* html #contents,
* html #footer #site-info {
	height:1px;
}

/* IE7 hacks */
*:first-child+html #header,
*:first-child+html #header #header-utility,
*:first-child+html #header #guest-status-container #guest-status ul,
*:first-child+html #header #user-status-container #user-status ul,
*:first-child+html #globalnav,
*:first-child+html #search,
*:first-child+html #contents,
*:first-child+html #footer #site-info {
	zoom:1;
}/* end hacks */

#search .detail-search-gudie {
	padding-left:10px;
}
#search .detail-search-guide a {
	background: url(/img/usr/link_ic01.gif) 0% 50% no-repeat;
	padding-left:8px;
	font-size: 83%;
}

/* パンくず */
.navitopicpath_ {
	margin: 0 0 10px 0;
}
