@charset "UTF-8";
/* WHITEFOOD PC CSS Document */

a{ color:#0044cc; text-decoration:none; }
a:hover{ text-decoration:underline; }
a img:hover{ filter:alpha(opacity=50); -moz-opacity:0.5; opacity:0.5; }


/*LAYOUT
*********************************************************************************************/
#wrap{ width:980px; margin:0 auto; }
header{ position:relative; margin:0 auto !important; margin-bottom:10px !important; height:105px; }
#container{ clear:both; }
#side{ width:180px; float:left; }
#content{ width:760px; float:right; }
#top-main{ width:540px; float:left; margin:0 0 0 -10px; }
#top-right{ width:200px; float:right; }
footer{ margin-top:50px; }


/*HEADER
*********************************************************************************************/
header h1{ position:absolute; top:33px; left:250px; width:400px; font-size:85%; line-height:140%; }

header h2{ position:absolute; left:0; top:25px; width:240px; }
header h2 img:hover{ filter:alpha(opacity=50); -moz-opacity:0.5; opacity:0.5; }

header .topnav{ position:absolute; right:0; top:30px; }
header .topnav li{ float:left; width:122px; font-size:85%; font-weight:bold; text-align:center; margin-left:10px; }
header .topnav li a{ color:#fff !important; display:block; padding:10px 0 8px; text-decoration:none; }
header .topnav li a:hover{ filter:alpha(opacity=50); -moz-opacity:0.5; opacity:0.5; }
header .topnav li.tnLogin a{ background:#333333 url(../img/common/header/icon_login.png) no-repeat scroll 22% 50%; padding-left:5px; }
header .topnav li.tnCart a{ background:#333333 url(../img/common/header/icon_cart.png) no-repeat scroll 15% 50%; padding-left:10px; }
header .topnav li.tnGuide a{ background:#333333 url(../img/common/header/icon_guide.png) no-repeat scroll 10% 50%; padding-left:5px; }


/*SIDE
*********************************************************************************************/
#side a.btn-guide{ background-color:#fe0000; color:#ffffff; display:block; padding:10px 0; text-align:center; width:180px; }
#side a.btn-guide:hover{ text-decoration:none; }

#side nav{ margin-top:20px; border-top:1px solid #ddd; }
#cssmenu, #cssmenu ul, #cssmenu li, #cssmenu a{ margin:0; padding:0; border:0; list-style:none; font-weight:normal; text-decoration:none; position:relative; line-height:120%; }
#cssmenu a{ padding:2px 5px 1px 1px; color:#444; }
#cssmenu{ width:180px; }
#cssmenu > ul > li{ cursor:pointer; border-bottom:1px solid #ddd;min-height: 47px }
#cssmenu > ul > li:last-child{ border-bottom:1px solid #ddd; }
#cssmenu > ul > li > a{ display:block; }
#cssmenu > ul > li > a:hover{ text-decoration:none; background-color:#ebebeb; }
#cssmenu > ul > li.active{ border-bottom:1px solid #ddd; }
#cssmenu > ul > li.active > a{ background-color:#ebebeb; }
#cssmenu > ul > li.has-sub > a:after{ content:""; position:absolute; top:10px; right:10px; }
#cssmenu > ul > li.has-sub.active > a:after{ right:14px; top:12px; }
/* Sub menu */
#cssmenu ul ul{ padding:0; display:none; }
#cssmenu ul ul a{ display:block; color:#2e2e2e; border-top:1px dotted #ddd; padding-bottom:5px; padding-top:5px; }
#cssmenu ul ul li{ text-align:left; text-indent:15px; }
#cssmenu ul ul li:hover{ background-color:#fbfbfb; }
#cssmenu ul ul li:last-child{ border:none; }

.navparent{ width:170px;display: table; }
.navimg{ display: table-cell; vertical-align: middle; width:50px; }
.navtxt{ display: table-cell; vertical-align: middle; width:120px; }


#side .sidein{ border-bottom:1px dotted #ddd; padding:10px 0 15px; }
#side .sidein img{ margin-top:15px; }
#side .sidein h3{ color:#000; }
#side .sidein p{ font-size:11px; line-height:140%; margin-top:5px; }

#side h2{ border-bottom:1px solid #ddd; color:#000; font-size:18px; margin-top:20px; padding:10px 0; }
#side h2.blank-link{ background:url(../img/common/side/ico_win.png) no-repeat scroll right center; }

#side ul.sidenav li{ border-bottom:1px dotted #ddd; color:#000; display:block; padding:8px 8px 8px 0; }
#side ul.sidenav li a{ color:#000; }
#side ul.sidenav li a:hover{ filter:alpha(opacity=50); -moz-opacity:0.5; opacity:0.5; text-decoration:none; }

.searchbar { margin-bottom:20px; }
.searchbar input { padding-left:1em; width:90%; margin:0 0 5px; }


/*TOP PAGE
*********************************************************************************************/
/*toppage center*/
.top-bnnr img{ margin-bottom:20px; }

.sns-box li{ float:left; }
.sns-box li.tw{ width:87px; }
.sns-box li.fb{ width:99px; }

.pickup{ margin-top:30px; }
.pickup h2{ border-bottom:1px solid #dddddd; color:#000; font-size:18px; font-weight:normal; margin:0 0 15px; padding:0 0 10px; }
.pickup ul{}
.pickup ul li{ float:left; width:120px; margin:0 20px 20px 0; text-align:left; }
.pickup ul li.last{ margin-right:0; }
.pickup ul li a{ color:#444; text-decoration:none; width:118px; height:118px; }
.pickup ul li a:hover{ color:#444; text-decoration:none; }
.pickup ul li h3{ margin:0 0 10px 0; }
.pickup ul li img{ width:118px; border:0px solid #ccc; }
.pickup ul li p.price{ font-size:95%; }

.news{ margin-top:30px; }
.news h2{ border-bottom:1px solid #dddddd; color:#000; font-size:18px; font-weight:normal; margin:0 0 15px; padding:0 0 10px; }
.news ul li{ border-bottom:1px dotted #ccc; padding-bottom:10px; margin-bottom:12px; }
.news ul li p{ float:left; }
.news ul li p.date{ margin-right:10px; }
.news ul li p.txt{ font-size:95%; }

.fb-box{ border:1px solid #ddd; }

/*toppage right*/
.bnnr{ border-bottom:1px solid #dddddd; }
.bnnr p{ text-align:center; }
.bnnr span{ font-size:85%; }
.bnnr p a{ background-color:#fe0000; color:#fff; display:block; font-size:90%; margin:6px 30px; padding:5px 10px; line-height:130%; }
.bnnr p a:hover{ text-decoration:none; }
.bnnr h4{ font-weight:bold; font-size:15px; }

.btnA{ padding-bottom:10px; }
.btnA img{ padding-bottom:10px; }

.btnB{ padding:20px 0; }
.btnB img{ padding-bottom:5px; }


/*CONTENT
*********************************************************************************************/
.path-box{ font-size:95%; margin-bottom:35px; }
.path-box li{ margin-bottom:5px; }

/*category page*/
.itemlist-box{}
.itemlist-box h2{ color:#000; font-size:22px; font-weight:normal; margin:0 0 15px; padding:0 0 10px; }
.itemlist-box ul{}
.itemlist-box ul li{ float:left; width:135px; min-height:260px; margin:0 0 20px 20px; text-align:left; }
.itemlist-box ul li:nth-child(5n+1){ margin-left:0; }
.itemlist-box ul li a{ color:#444; text-decoration:none; }
.itemlist-box ul li a:hover{ color:#444; text-decoration:none; }
.itemlist-box ul li a:hover img{ filter:alpha(opacity=50); -moz-opacity:0.5; opacity:0.5; }
.itemlist-box ul li a{ width:133px; height:133px; }
.itemlist-box ul li h3{ margin:0 0 10px 0; font-weight:bold; }
.itemlist-box ul li img{ width:133px; border:0px solid #ccc; }
.itemlist-box ul li p.price{ font-size:95%; }

.sort-box{ background-color:#fcfcfc; border-bottom:1px solid #f1f1f1; border-top:1px solid #f1f1f1; margin:15px 0 40px; padding:15px; }
.sort-box p.sort-sum span{ font-weight:bold; }

.pager{ text-align:center; margin:15px 0; font-size:90%; }
.pager a.current{ background-color:#333; color:#fff; }
.pager a{ background-color:#f4f4f4; margin:0 10px; padding:5px 8px; color:#222; }
.pager a:hover{ background-color:#999; color:#fff; }

/*detail page*/
.itemdetail-box{ margin-bottom:30px; }

.free-area{ margin-bottom:50px; }

.item-img{ float:left; width:420px; }
.item-img .mainimg{ width:420px; height:420px; border:1px solid #ccc; }
.item-img ul{ margin:10px 0; }
.item-img ul li{ float:left; width:75px; height:75px; margin-left:11px; margin-bottom:10px; }
.item-img ul li:nth-child(5n+1){ margin-left:0; }
.item-img ul li img{ width:75px; }

.item-info{ float:right; width:310px; }
.item-info h2{ font-size:150%; font-weight:bold; color:#000; margin-bottom:15px; }
.item-info p.item-txt{ margin:20px 0; line-height:150%; }

table.item-spec{ width:310px; border-top:1px solid #ccc; margin-bottom:20px; }
table.item-spec th{ background-color:#f3f3f3; border-bottom:1px solid #ccc; color:#666; margin:1px 0; width:80px; padding:10px; font-weight:normal; }
table.item-spec td{ padding:10px; border-bottom:1px solid #ccc; }
table.item-spec td.price{ font-size:130%; font-weight:bold; }

ul.status-icon{ margin:10px 0 20px 0; }
ul.status-icon li{ color:#fff; float:left; font-size:80%; margin-right:10px; padding:4px 5px 3px 5px; }
ul.status-icon .icon1{ background:#ff8400; }
ul.status-icon .icon2{ background:#0086cd;}
ul.status-icon .icon3{ background:#f00000; }
ul.status-icon .icon4{ background:#008000;}
ul.status-icon .icon5{ background:#cccccc;}

p.shipping{ margin:15px 0; }

ul.order-form{}
ul.order-form li{ margin-bottom:5px; }
.btn-cart{ background-color:#fe0000; color:#ffffff; display:block; padding:15px 0; text-align:center; font-weight:bold; margin-top:20px; }
.btn-cart:hover{
    color:#ffffff;
    text-decoration: none;
}
.btn-cart-one-click{ background-color:#bc0012; color:#ffffff; display:block; padding:15px 0; text-align:center; font-weight:bold; }
.btn-cart-one-click:hover{
    color:#ffffff;
    text-decoration: none;
}
.btn-rethink{ background-color:#aeb0b0; color:#ffffff; display:block; padding:15px 0; text-align:center; font-weight:bold; margin-top:20px; }

h2.cart-area {
    border-top: 1px solid #767676;
    margin:23px 0 0;
    text-align:center;
    padding:0; height:24px;
}
h2 span.cart-area {
    position: relative;
    font-size:50%;
    color:#767676;
    top: -15px;
    padding: 0 10px;
    background:#ffffff;
}

.itemsub-box{ clear:both; margin:30px 0; }

.item-menu{ background-color:#fcfcfc; border-bottom:1px solid #f1f1f1; border-top:1px solid #f1f1f1; margin:15px 0 40px; }
.item-menu li{ background:url(../img/common/icon_03.png) no-repeat left center; float:left; font-size:90%; margin:1px 0 1px 30px; padding:15px; }
.item-menu li a{ color:#444; }
.item-menu li a:hover{ text-decoration:none; }

.itemsub-box h3{ border-bottom:1px solid #ddd; font-size:138.5%; font-weight:normal; letter-spacing:0.1em; margin-bottom:25px; margin-top:0; padding:0 0 7px; }
.itemsub-box h4{ font-size:18px; color:#000; margin-bottom:15px; }
.itemsub-box section{ border:1px solid #f3f3f3; margin-bottom:15px; padding:25px; }
.itemsub-box table{ width:100%; }
.itemsub-box th{ background:#f3f3f3 none repeat scroll 0 0; border:1px solid #dcdcdc; font-weight:bold; padding:10px 20px 10px 10px; }
.itemsub-box td{ border:1px solid #dcdcdc; padding:10px; }

.sub-box{ margin-bottom:30px; }
.sub-box .txtbox{ float:left; width:480px; }
.sub-box .txtbox p{ line-height:150%; }
.sub-box .imgbox{ float:right; width:200px; }
.sub-box .imgbox img{ width:200px; }

ul.review{}
ul.review li{ border-bottom:1px solid #ddd; padding:10px; margin-bottom:10px; line-height:150%; }
ul.review li p{ color:#ffcc00; margin:0; }
ul.review li span{ font-size:90%; }
a.btn-review{ float:right; font-size:11px; color:#fff; display:block; padding:7px 10px 6px; background-color:#999999; letter-spacing:0; }
a.btn-review:hover{ background-color:#444; text-decoration:none; }
.btn-reviewtop{ text-align:right; margin-top:15px; }


/*FOOTER
*********************************************************************************************/
.f-sub{ margin:50px 0 0 0; text-align:right; }
.f-sub p.btn-pagetop{ float:right; }
.f-sub p.btn-pagetop a{ border:1px solid #ddd; color:#444; display:block; font-size:11px; margin-bottom:-1px; padding:6px 10px; }
.f-sub p.btn-pagetop a:hover{ text-decoration:none; }
	
footer nav{ border-top:1px solid #ddd; padding:20px 0; }
footer nav dl{ float:left; font-size:100%; margin-left:0; margin-right:30px; width:220px; }
footer nav dl.last{ margin-right:0; }
footer nav dl dt{ font-weight:bold; margin:10px 0; color:#000; font-size:16px; font-weight:normal; }
footer nav dl dt a{ color:#000; }
footer nav dl dd{ font-size:105%; margin:7px 0; }
footer nav dl dd a.blank-link{ background:url(../img/common/side/ico_win.png) no-repeat scroll right center; padding-right:20px; }

.f-copy{ padding:10px 0; text-align:left; }
.f-copy p.comment{ border-top:1px dotted #ddd; font-size:80%; font-weight:normal; margin:0 auto; padding:10px 0; }
.f-copy p.copy{ border-top:1px solid #ddd; font-size:80%; padding:10px 0; }

/* footer --------------------------------*/
#ft_sub,
#ft_box { width: 1014px; margin: 0 auto; position: relative;}

#ft_sub p.toPageTop { float: right; }
#ft_sub p.toPageTop a { display: block; padding: 8px 8px 0; }
#ft_box a:link,
#ft_box a:visited { }

#ft_box {
    padding: 20px 0;
    border-top: 1px dotted #444;
}
#ft_box nav { float: right; margin-right: 10px;}
#ft_box nav dl { float: left; margin-left: 35px; font-size: 90%; }
#ft_box nav dl dt {
    margin: 10px 0 8px;
    font-weight: bold;
}
#ft_box nav dl a.tit {
    padding-left: 10px;
    font-weight: bold;
    background: url(../images/icon/ico_arrow_right.gif) left no-repeat;
}
#ft_box nav dl dd { margin: 5px 0; }
#ft_box nav dl dd a { font-size: 95%; padding: 2px 0 0 10px;}
#ft_box nav dl dd a:hover { text-decoration: underline;}

.ft_company { width: 250px; float: left;}
.ft_company dt.tit { font-size: 110%; font-weight: bold; margin: 10px 0 8px;}
.ft_company dd { margin-bottom: 2px; font-size: 90%;}
.ft_company dd a { border-left: none; padding-left: 0; margin: 0;}
.ft_company dd.add { line-height: 140%;}
.ft_company dd.tel { margin: 3px 0; font-weight: bold;}
.ft_company dd.mail {  font-weight: bold;}
.ft_company dd.social { margin: 10px 0 0;}
.ft_company dd.social span { float: left; width: 110px;}

#ft_copy { position: relative; text-align: center; background: #f7f7f7; padding: 10px ;}
#ft_copy .copy { font-size: 80%;}
#ft_copy .comment { margin: 20px auto; font-weight: bold; font-size: 100%;}
#ft_copy .comment span { font-size: 80%; font-weight: normal;}

.footer_box .sub_box {
    float: left;
    margin-bottom: 25px;
    color: #333333;
}
.sub_box {
    width: 47%;
    text-align: left;
    font-size: 12px;
    float: left;
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 10px;
    line-height: 15px;
    display: inline-block;
    padding-top: 20px;
}
.sub_box table tbody tr td{
    padding: 5px;
}

.footer_box .sub_box p.tit {
    background: #ffffff;
    padding: 3px 0;
    font-weight: bold;
    font-size: 100%;
    margin-right: 0;
    margin-left: 0;
    margin-bottom: 10px;
    text-align: center;
}
.sub_box_tit {
    margin-bottom: 10px;
    font-size: 16px;
}
.footer_box .sub_box p {
    font-size: 12px;
}
.footer_box .sub_box p span {
    font-size: 85%;
    display: block;
}
.wf_attention{
    background-color: #333333;
    color: #FFFFFF;
    margin-top: 0px;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 12px;
    text-align: center;
}
#ft_box {
    width: 100%;
    margin-bottom: 20px;
}
