/* vim: set expandtab tabstop=4 shiftwidth=4 foldmethod=marker: */

/* {{{ + tags */ 
html {
margin: 0;
padding: 0;
}
body {
font-family: 'メイリオ', 'Lucida Sans Unicode', Verdana,'ヒラギノ角ゴ Pro W3', 'ヒラギノ角ゴ3', 'ＭＳ Ｐゴシック','Bitstream Vera Sans',Osaka, sans-serif;
font-size: 0.9em;
margin:0; 
padding:0;
text-align: center; 
background-color: #003366;
}
div,dl,ul,ol,p,form,input,textarea,acronym,table,tr,td {
margin: 0;
padding: 0;
}
img {
border: 0;
}

acronym {
border:none;
text-decoration:none;
display: none; 
}
script {
display: none; 
}
a:visited,
a:link {
color: #386ba5;
text-decoration:none;
border-bottom: 1px dotted #ddf;
}
a:hover,
a:focus {
/* background: #FFFFD7; */
color: #C00;
border-bottom: 1px solid #b4cfed;
}
/* }}} */ 

/* {{{ + a button */ 

.clear { /* generic container (i.e. div) for floating buttons */
    overflow: hidden;
    width: 100%;
}

a.button {
background: transparent url('/img/pub/button/bg_button_a.gif') no-repeat scroll top right;
color: #444;
display: block;
float: left;
font: normal 12px arial, sans-serif;
height: 24px;
margin-right: 6px;
padding-right: 18px; /* sliding doors padding */
text-decoration: none;
border:none;
}

a.button span {
background: transparent url('/img/pub/button/bg_button_span.gif') no-repeat;
display: block;
line-height: 14px;
padding: 5px 0 5px 18px;
font-weight:bold;
color: #036;
} 

a.button.orenge {
background: transparent url('/img/pub/button/bg_button_a_orenge.gif') no-repeat scroll top right;
}

a.button.orenge span {
background: transparent url('/img/pub/button/bg_button_span_orenge.gif') no-repeat;
color: #333;
}

a.button:hover {
background-position: bottom right;
}

a.button:hover span {
background-position: bottom left;
} 

a.button:active {
background-position: -24px right;
color: #000;
outline: none; /* hide dotted outline in Firefox */
}

a.button:active span {
background-position: -24px left;
padding: 6px 0 4px 18px; /* push text down 1px */
} 

a.button_clicked {
background-position: -24px right;
color: #c00;
font-weight:bold;
outline: none; /* hide dotted outline in Firefox */
}

a.button_clicked span {
background-position: -24px left;
padding: 6px 0 4px 18px; /* push text down 1px */
} 

/* }}} - a button */ 

/* {{{ + flame */ 
div.wrap {
clear: both;
margin: 0;
text-align: left;
}

div#f_main_wrap {
background-color: #FFF;

float: left;
width: 100%;
min-width: 20.0em;
}
div#f_main {
margin-right: 17.0em;
min-width: 18.0em;
/* safari hack */
/* background: #d0d0d0 url(/img/pub/body_bg_1.gif); */
}
div#f_sub {
float: right;
width: 17.0em;
margin-left: -17.0em;
} 

div#f_main_contents {
text-align: left;
margin: 10px 20px 10px 20px;
} 

div#f_sub_contents {
background: #fffff4;
text-align: left;
margin: 0 10px 10px 0;
} 

div#bg {
background-color: #FFF;
}
/* }}} - frame */ 


/* {{{ +　contents */ 
#f_main_contents {
min-height:400px;
padding-bottom:20px;
}

#f_main_contents ul#page_nav {
text-align: center;
list-style: none;
}
#f_main_contents ul#page_nav li {
font-size: 0.9em;
display: inline;
background: url(/img/icon/all.gif) no-repeat;
} 
#f_main_contents ul#page_nav li.next {
padding: 0 1.0em 0 0;
background-position: 100% -740px;
} 
#f_main_contents ul#page_nav li.prev {
border-right: 1px solid #999;
padding: 0 0.5em 0 1.0em;
background-position: 0% -713px;
} 
ul#page_nav li.next a,
ul#page_nav li.prev a {
margin: 0 0.5em;
} 

#contents {
min-width: 400px;
}


#contents .subtitle {
background: url(/img/pub/bar_gray.jpg) repeat-x;
height:30px;
line-height:30px;
font-size:1.1em;
font-weight:bold;
border-bottom: solid #ccc 1px;
border-right: solid #ccc 1px;
}

#contents .subtitle img{
vertical-align:middle;
padding: 0 0 0 10px;
}

#contents .subtitle span.mark{
color:#036;
font-size:21px;
padding-right: 10px;
}

#contents .subtitle .btn_clear {
width:82px;
height:22px;
float:right;
position:relative;
top:4px;
right:20px;
}

#contents .subtitle .btn_clear img{
width:82px;
height:22px;
}

#contents #results .count{
font-weight:normal;
font-size:0.8em;
}

#contents .noResult {
margin: 30px 0 0 0;
padding:10px;
font-size:1.1em;
font-weight:bold;
color:#666;
}

#contents #newProducts {
padding-top: 0px;
height:543px;
overflow:hidden;
}

#contents #newProductsMore{
text-align:right;
}

#contents #favoriteProducts {
padding-top: 50px;
overflow:hidden;
}

#contents #historyProducts {
overflow:hidden;
}

#contents #favoriteProducts #noFavorite,
#contents #historyProducts #noHistory{
padding: 20px;
color:#666;
font-weight:bold;
}

#contents #Product {
}

#contents #Product #salesInfo{
margin: 100px 0 0 0;
}

#contents .topicPath { 
margin:0 0 5px 5px;
font-size:0.8em;
}   
#contents .topicPath li {
display:inline;
line-height:110%;
list-style-type:none;
}   
#contents .topicPath li a {
padding-right:10px;
background:url(/img/pub/topicpath.gif) no-repeat right center;
}  

/* }}} - contents */ 


/* {{{ + head */ 
#wrap_head {
min-width: 52.0em;
background-color: #FFF;
}
#head {
} 
#head h1 {
height:21px;
float: left;
margin:0;
padding:0;
font-size:0.7em;
font-weight:normal;
line-height:20px;
overflow:hidden;
}
#head h1 a {
border: none;
background: none;
} 

#head ul {
float: right;
list-style: none;
} 
#head ul li {
display: inline;
padding: 0 0 0 5px;
font-size: 0.8em;
border-left: 1px solid #ccc;
line-height: 170%;
} 

#head #head_top {
margin: 0 0 10px 0;
}

#head #head_top #head_top_line {
height:3px;
background-color:#003366;
}

#head #head_top #head_top_text {
height:20px;
color:#003366;
padding: 0 10px;
background:#F6F6F6 url(/img/pub/head_top_bg_1.jpg) repeat-x;
border-bottom: 1px solid #ddd;
}

#head .searchBoxW {
height:30px;
float:left;
margin: 5px 0 0 20px;
padding: 10px 30px ;
border: 1px solid #ddd;
background:#f9f9f9;
/* background: url(/img/pub/bg/gradeGray.jpg) repeat-x; */
}

#head .searchBoxW .searchfromRadio{
float:left;
margin: 0 0 0 20px;
font-size: 0.8em;
}

#head .searchBoxW .searchWord {
float:left;
}

#head #viewCartTop {
float:right;
margin: 20px 10px 0 0;
}

#head #siteTitle {
float:left;
margin: 0 5px 10px 5px;
}

#head #siteTitle .common{
margin: 0 0 0 10px;
}

#head #siteTitle .sub{
margin: 0 0 0 10px;
}

#head .line {
clear:both;
height:1px;
border-top: 1px dotted #CCC;
border-bottom: 1px dotted #003366;
}


/* }}} - head */ 
/* {{{ + foot */ 
#foot a:visited,
#foot a:link {
color: #FFF;
text-decoration:none;
border-bottom: 1px dotted #ddf;
}
#foot a:hover,
#foot a:focus {
color: #C00;
border-bottom: 1px solid #b4cfed;
}


#wrap_foot {
min-width: 42em;
}

#foot {
padding: 20px 10px 0 10px;
border-top:1px solid #666;
} 

#foot ul#foot_menu,
#foot ul#foot_menu2 {
float:left;
list-style: none;
} 

#foot #foot_menu li,
#foot #foot_menu2 li {
display: inline;
padding: 0 0.4em 0 0.4em;
font-size: 0.8em;
border-right: 1px solid #ccc;
line-height: 200%;
} 

#foot_copy {
font-size: 0.71em;
margin: 0 0.5em 0 0;
padding: 20px 45px 0 0;
color: #999;
background: url(/img/foot/wity_logo.gif) no-repeat;
background-position: 100% 70%;
}

#cacheinfo {
font-size: 0.6em;
color: #666;
text-align:right;
padding-right:10px;
}

/* }}} - foot */ 

/* {{{ + sub */ 

#sub {
padding: 1.0em;
}

#sub #categoryList {
margin: 20px 0 0 0;
}

#sub #categoryList .ctitle{
margin: 0 0 5px 0;
}

#sub #categoryList ul{
width:100%;
}

#sub #categoryList ul li{
padding: 10px 0 10px 3px;
display: block;
border:none;
border-bottom: 1px dotted #666;
font-size:0.8em;
font-weight:bold;
background: url(/img/pub/bg/gradeGray.jpg) repeat-x;
}

#sub #categoryList ul li.top{
border-top: 1px dotted #666;
}

#sub #categoryList ul li.title{
font-size:0.8em;
}

#sub #categoryList ul li a{
color:#333;
border:none;
}

#sub #categoryList ul li img{
vertical-align:middle;
padding-right:5px;
}

/* }}} - sub */