@charset "UTF-8";
/*////////////////////////////////////////////////////////////
BEYES - men.css for Men, Women Site

Copyright (C) LightUp Shopping Club Inc. All Rights Reserved.
------------------------------------------------------------

    0. Import External CSS
    1. Common Style
    2. Top Page Style
        2-1. Feature
        2-2. Refine Unit 01
            - Label & Control
    3. Women Top Page Style
    4. Product Category Page
        4-1. Swf Refine Category
        4-2. Refine Unit 02
    5. Genre Page
    6. Ranking Page
    7. BEYES LIVE banner
	8. category page For iPhone

    99. Clearfix

////////////////////////////////////////////////////////////*/

/* ------------------------------------------------------------
    0. Import External CSS
   ------------------------------------------------------------ */
@import "common.css";
@import "common_branch_site.css";

/* ------------------------------------------------------------
    1. Common Style
   ------------------------------------------------------------ */

/* ------------------------------------------------------------
    2. Top Page Style
   ------------------------------------------------------------ */

/*  2-1. Feature
   ------------------------------------------------- */
div#swfFeatureContainer,
body.beyesWom div#swfFeature01 {
    width: 945px;
    height: 400px;
}
/* ------------------------------------------------------------
    2. Top Page Style
   ------------------------------------------------------------ */

/*  2-1. Feature
   ------------------------------------------------- */
div#topFeatureMen {
	position: relative;
	overflow: hidden;
	width: 945px;
	height: 400px;
}

div#topFeatureMen ul li {
    position: absolute;
}
div#topFeatureMen ul li#bnrFeatureReco {
	top: 0;
	left: 0px;
	width: 625px;
	height:400px;
	background-color: #D9D9D9;
}
div#topFeatureMen ul li#bnrFeatureTPU01 { top: 0; left: 640px; width: 152px; height: 152px; }
div#topFeatureMen ul li#bnrFeatureTPU02 { 
top: 0;
left: 793px;
width: 152px;
height: 152px;
display: block;
}
div#topFeatureMen ul li#bnrFeatureTPU02 a { 
top: 0;
left: 793px;
width: 152px;
height: 152px;
display: block;
text-decoration: none;
}
div#topFeatureMen ul li#bnrFeatureTPU02 span.txtDate {
	color: #000;
	right: 12px;
	bottom: 20px;
	font-size:8px;
	position: absolute;
	text-decoration: none;
}
div#topFeatureMen ul li#bnrFeatureTPU02 span.txtDay {
	color: #ff0000;
	text-align: right;
	right: 12px;
	bottom: 8px;
	font-size:8px;
	position: absolute;
	text-decoration: none;
}
div#topFeatureMen ul li#bnrFeatureTPU03 { top: 153px; left: 640px; width: 152px; height: 152px; }
div#topFeatureMen ul li#bnrFeatureTPU04 { top: 153px; left: 793px; width: 152px; height: 152px; }
div#topFeatureMen ul li#bnrFeatureHills { top: 305px; left: 640px; width: 152px; height: 95px; }
div#topFeatureMen ul li#bnrFeatureSale {
	top: 305px;
	left: 793px;
	height: 95px;
	width: 152px;
	display: block;
}
div#topFeatureMen ul li#bnrFeatureSale a {
	height: 95px;
	width: 152px;
	display: block;
	text-decoration: none;
}
div#topFeatureMen ul li#bnrFeatureSale span.txtDate {
	color: #cccccc;
	right: 12px;
	bottom: 20px;
	font-size:8px;
	position: absolute;
	text-decoration: none;
}
div#topFeatureMen ul li#bnrFeatureSale span.txtDay {
	color: #ff0000;
	text-align: right;
	right: 12px;
	bottom: 8px;
	font-size:8px;
	position: absolute;
	text-decoration: none;
}

div#topFeatureMen ul li#bnrFeatureBomb {
    z-index: 10;
}
div#topFeatureMen ul li#bnrFeatureBomb a {
	cursor: pointer;
}
div#topFeatureMen ul li#bnrFeatureBomb span {
	display: block;
	width: 130px;
	height: 130px;
}

div#topFeature01 ul li#bnrFeatureBomb a {
	cursor: pointer;
/*    display: block;
    width: 124px;
    height: 123px;
*//*    _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/swf/img/men_bomb_081203.png');
    _cursor: pointer;
*/}

div#topFeature01 ul li#bnrFeatureBomb img {
/*    _display: none;*/
}



/*  2-2. Refine Unit 01
   ------------------------------------------------- */
/*
div#refineUnit01
    h2
    div.utility
        div#labelRefine01.labelRefine
        div#labelRefine02.labelRefine
        div#labelRefine03.labelRefine
        div#ctrlRefine01.labelRefine
            p.label
            ul.select
        div#ctrlRefine02.labelRefine
            p.label
            ul.select
            ul.select
        div#ctrlRefine03.labelRefine
            p.label
            ul.select
*/

div#refineUnit01 {
    position: relative;
    width: 945px;
    height: 81px;
    margin-top: 15px;
    z-index: 5; /* TEMP */
}

div#refineUnit01 h2 {
    position: absolute;
    top: 17px;
    left: 13px;
    z-index: 10; /* TEMP */
}

div#refineUnit01 div.utility {
    position: relative;
    height: 44px;
    background: #b3b3b3 url(/img/men/top/line_01.png) no-repeat 827px 7px;
    line-height: 1;
}  

/* TEMP:default position & style
div#labelRefine01,
div#ctrlRefine02,
div#ctrlRefine03 { display: none; }

div#ctrlRefine01  { left: 498px; }
div#labelRefine02 { left: 665px; }
div#labelRefine03 { left: 743px; }

[temp position for design check]
div.utility.DUMMY-TYPE01 {}
div.DUMMY-TYPE01 div#labelRefine01,
div.DUMMY-TYPE01 div#ctrlRefine02,
div.DUMMY-TYPE01 div#ctrlRefine03,
div.DUMMY-TYPE02 div#ctrlRefine01,
div.DUMMY-TYPE02 div#labelRefine02,
div.DUMMY-TYPE02 div#ctrlRefine03,
div.DUMMY-TYPE03 div#ctrlRefine01,
div.DUMMY-TYPE03 div#ctrlRefine02,
div.DUMMY-TYPE03 div#labelRefine03 { display: none; }

div.DUMMY-TYPE02 div#labelRefine01,
div.DUMMY-TYPE03 div#labelRefine01,
div.DUMMY-TYPE01 div#ctrlRefine01,
div.DUMMY-TYPE02 div#ctrlRefine02,
div.DUMMY-TYPE03 div#ctrlRefine03 { display: block !important; }

[ on: newer ]
div.DUMMY-TYPE01 div#ctrlRefine01  { left: 499px; }
div.DUMMY-TYPE01 div#labelRefine02 { left: 665px; }
div.DUMMY-TYPE01 div#labelRefine03 { left: 743px; }

[ on: category ]
div.DUMMY-TYPE02 div#labelRefine01 { left: 362px; }
div.DUMMY-TYPE02 div#ctrlRefine02  { left: 415px; }
div.DUMMY-TYPE02 div#labelRefine03 { left: 743px; }

[ on: brand]
div.DUMMY-TYPE03 div#labelRefine01 { left: 497px; }
div.DUMMY-TYPE03 div#labelRefine02 { left: 550px; }
div.DUMMY-TYPE03 div#ctrlRefine03  { left: 628px; }
*/

/* --- Label & Control --- */
div#refineUnit01 div.utility div.labelRefine,
div#refineUnit01 div.utility div.ctrlRefine {
    position: absolute;
    top: 7px;
    height: 20px;
    padding: 5px 10px;
}

/* Refine Label - for swtich control refine */
div#refineUnit01 div.utility div.labelRefine {
    height: 30px;
    padding: 0;
    cursor: pointer;
}

div#refineUnit01 div.utility div#labelRefine01 { width: 52px; }
div#refineUnit01 div.utility div#labelRefine02 { width: 78px; }
div#refineUnit01 div.utility div#labelRefine03 { width: 78px; }

div#refineUnit01 div.utility div.labelRefine p { height: 30px; }

/* Refine Control */
div#refineUnit01 div.utility div.ctrlRefine {
    padding-right: 5px;
    background: #000;
}

div#refineUnit01 div.utility div#ctrlRefine01 { width: 150px; }
div#refineUnit01 div.utility div#ctrlRefine02 { width: 312px; }
div#refineUnit01 div.utility div#ctrlRefine03 { width: 177px; }

div#refineUnit01 div.utility div.ctrlRefine p.label {
    display: block;
    float: left;
    height: 10px;
    padding: 5px 10px 0 0;
}
* html div#refineUnit01 div.utility div.ctrlRefine p.label { /* For IE6 */
    padding-right: 7px;
}

/* select */
div#refineUnit01 div.utility ul.select {
    float: left;
}

div#refineUnit01 div.utility div.ctrlRefine ul.select {
    width: 108px;
}

div#refineUnit01 div.utility div.ctrlRefine ul.select li.current {
    width: 88px;
}

/* control category selectbox */
div#refineUnit01 div.utility div#ctrlRefine02 {
    background: #000 url(/img/men/top/txt_cross_01.png) no-repeat 196px 12px;
}

/* control display number */
div#refineUnit01 div.utility div.ctrlNumber01 {
    position: absolute;
    top: 7px;
    right: 10px;
    width: 85px;
    height: 20px;
    margin: 0;
    padding: 5px 5px 5px 10px;
    background: #000;
}

div#refineUnit01 div.utility div.ctrlNumber01 p.label {
    display: block;
    float: left;
    height: 10px;
    padding: 5px 10px 0 0;
}
* html div#refineUnit01 div.utility div.ctrlNumber01 p.label { /* For IE6 */
    padding-right: 7px;
}

div#refineUnit01 div.utility div.ctrlNumber01 ul.select {
    float: left;
}

/* ------------------------------------------------------------
    3. Women Top Page Style
   ------------------------------------------------------------ */
/* Sub Nav */
div#navWomSub {
    margin-top: 20px;
    margin-bottom: 5px;
}

div#navWomSub ul li {
    float: left;
}

/* ------------------------------------------------------------
    4. Product Category Page
   ------------------------------------------------------------ */


/*  4-1. Swf Refine Category
   ------------------------------------------------- */
div#swfRefineCategoryContainer {
    width: 945px;
    height: 170px;
	clear:both;	
}

div#swfRefineCategoryContainer p.noteSwf01 {
    padding-top: 50px;
}

/*  4-2. Refine Unit 02
   ------------------------------------------------- */
div#refineUnit02 {
    position: relative;
    height: 30px;
    background: #b3b3b3;
    z-index: 10; /* TEMP */
}

div#refineUnit02 div.utility {
    width: 318px;
    margin: 0 auto;
    line-height: 1;
}

body.beyesWom div#refineUnit02 div.utility {
    width: 86px;
}

div#refineUnit02 div.utility p.label {
    display: block;
    float: left;
    height: 10px;
    padding: 5px 10px 0 0;
}
* html div#refineUnit02 div.utility p.label { /* For IE6 */
    padding-right: 7px;
}

div#refineUnit02 div.utility div.refine01,
div#refineUnit02 div.utility div.ctrlNumber01 {
    float: left;
    height: 15px;
    margin: 0 11px 0 0;
    padding: 5px 0;
}

div#refineUnit02 div.utility ul.select {
    float: left;
}

/* genre */
div#refineUnit02 div.utility div.refine01 { width: 210px; }
div#refineUnit02 div.utility div.refine01 ul.select { width: 160px; }
div#refineUnit02 div.utility div.refine01 ul.select li.current { width: 140px; }

/* control display number */
div#refineUnit02 div.utility div.ctrlNumber01 { width: 86px; }
div#refineUnit02 div.utility div.ctrlNumber01 ul.select { width: 45px; }
div#refineUnit02 div.utility div.ctrlNumber01 ul.select li.current { width: 25px; }
div#refineUnit02 div.utility div.ctrlNumber01 ul.select li.list { width: 43px; }

/* category men women genre navi 090325 add  */
body#pageWomCategoryTop h1,
body#pageMenCategoryTop h1,
body#pageMenRankingTop h1,
body#pageWomRankingTop h1,
body#pageMenBrandTop h1,
body#pageWomBrandTop h1 {
    float:left;
}

body#pageWomCategoryTop div.navWithinPage,
body#pageMenCategoryTop div.navWithinPage,
body#pageMenRankingTop div.navWithinPage,
body#pageWomRankingTop div.navWithinPage,
body#pageMenBrandTop  div.navWithinPage,
body#pageWomBrandTop  div.navWithinPage {
    float:right;
	  width: 119px;
    padding-top:20px;
		border:none;
}


/* ------------------------------------------------------------
    5. Genre Page
   ------------------------------------------------------------ */
body#pageMenGenreTop h1 { float: left; }

div#genreIndex01 {
	clear: both;
    margin-top: 20px;
    padding-bottom: 20px;
    background: url(/img/men/genre/bcg_genre_index_01.png) no-repeat 0 100%;
}

div#genreIndex01 div.descGenre {
    float: left;
    width: 305px;
    padding-left: 15px;
}
div#genreIndex01 div.descDre {
    padding-left: 0;
}

div#genreIndex01 div.descGenre p {
    margin-top: 15px;
    color: #333;
}
div#genreIndex01 p.brandTxt {
    height: 150px;
	font-size:12px;
}
div#genreIndex01 div.descGenre ul.linkList02 {
    margin-top: 15px;
    font-size: 85%;
}

div#genreIndex01 div.descGenre ul.linkList02 li a {
    background-position: 0 2px;
    text-decoration: none;
}
div#genreIndex01 div.descGenre ul.linkList02 li a:hover {
    text-decoration: underline;
}

/* Mixture Banner */
body#pageMenGenreTop div.bnrMix {
    float: right;
    padding: 20px 0;
}

/* Women Banner */
body#pageMenGenreTop div.bnrWom {
    float: right;
    padding: 20px 20px 0;
}

/* ------------------------------------------------------------
    6. Ranking Page
   ------------------------------------------------------------ */
p#rankingTerm {
    margin-top: 6px;
    color: #aaa;
    font-size: 85%;
	clear:both;
}

div.contRanking {
    padding-top: 30px;
}

div.contRanking h2 {
    padding: 7px 10px;
    background-color: #f55500;
}
div.contRanking.even h2 {
    background-color: #000;
    color: #fff;
}
body.beyesWom div.contRanking h2 {
    background-color: #8fc41f;
}
body.beyesWom div.contRanking.even h2 {
    background-color: #b3b3b3;
}

div.contRanking dl.item {
    float: left;
    width: 305px;
    margin-right: 15px;
}

/* top3 */
div.contRanking dl.item.top3 {
    margin-top: 10px;
}

div.contRanking dl.item.top3 dt.rankNumber {
    position: relative;
    width: 305px;
}

div.contRanking dl.item.top3 dt span.lastRank {
    position: absolute;
    bottom: 0;
    right: 0;
    color: #333;
    line-height: 1;
}

div.contRanking dl.item.top3 div.unit01 {
    float: none;
    margin-top: 5px;
    margin-right: 0;
}

/* lower */
div.contRanking dl.item.lower {
    margin-top: 15px;
}

div.contRanking dl.item.lower dt {
    float: left;
    width: 35px;
}

div.contRanking dl.item.lower dd {
    float: left;
    width: 270px;
    padding-top: 2px;
    font-size: 85%;
    line-height: 1.3;
}
/* ------------------------------------------------------------
    7. BEYES LIVE banner
   ------------------------------------------------------------ */

div#container div#contLivearea {
    padding-top: 30px;
}
div#container div#contLivearea p {
     float: left;
     width: 306px;
     padding-bottom: 30px;
}
div#container div#contLivearea dl {
     float: left;
     width: 306px;
     padding-left:10px;
}
div#container div#contLivearea dt {
     padding-bottom: 5px;
}
div#container div#contLivearea dl dd a img {
     padding-top: 5px;
}

div#container div#contLivearea ul {
float:right;
padding-left:10px;
width:300px;
}
div#container div#contLivearea ul li {
float:left;
padding-left:3px;
height: 110px;
line-height: 110px;
}
/* ------------------------------------------------------------
    8. category page For iPhone
   ------------------------------------------------------------ */
div#iPhoneCategory {
	clear: both;
	padding-top: 11px;
}
div#iPhoneCategory ul.navUtility {
	border:1px solid #B3B3B3;
	height:145px;
	padding:14px 0 0 11px;
	width:932px;
}
div#iPhoneCategory ul.navUtility li {
	float:left;
	position:relative;
	margin-right: 5px;
}
div#iPhoneCategory ul.navUtility li ul.subItem {
	display:none;
	left:0;
	position:absolute;
	top:119px;
	width: 320px;
}
div#iPhoneCategory ul.navUtility li ul.subItem li {
	float:left;
	margin-right: 0;
}

div#iPhoneCategory ul.navUtility li ul.subItem02 {
	display:none;
	right:0;
	position:absolute;
	top:119px;
	width: 317px;
}
div#iPhoneCategory ul.navUtility li ul.subItem02 li {
	float:right;
	margin-right: 0;
}
/* ------------------------------------------------------------
    99. Clearfix
   ------------------------------------------------------------ */
/* Men Top */
div#refineUnit02 div.utility:after,
div#refineUnit02 div.utility div.refine01:after,
div#refineUnit02 div.utility div.ctrlNumber01:after,
/* Women Top */
div#navWomSub ul:after,
/* Product Detail */
div.cart01:after,
div#prdHeader:after,
div#prdHeader div.info ul.spec:after,
div#prdContent:after,
div#prdContent div#prdBrand:after,
div#prdContent div#prdDetails table td ul.stock li:after,
div#prdContent div#prdDetails table td ul.stock li dl:after,
div#prdContent div#prdDetails table td ul.stock li dl dd.size ul li:after,
div#prdContent dl#beyerBlogInfo:after,
div#prdContent div#sub ul.descImg01:after,
div#prdContent div#sub div#prdGenre dl:after,
div#prdContent div#sub div#prdMaterial dl:after,
/* Men Genre */
div#genreIndex01:after,
/* Ranking */
div.contRanking:after,
div.contRanking dl.item.lower:after {
   content: ".";
   display: block;
   clear: both;
   height: 0;
   visibility: hidden;
}

div#refineUnit02 div.utility,
div#refineUnit02 div.utility div.refine01,
div#refineUnit02 div.utility div.ctrlNumber01,
div#navWomSub ul,
div.cart01,
div#prdHeader,
div#prdHeader div.info ul.spec,
div#prdContent,
div#prdContent div#prdBrand,
div#prdContent div#prdDetails table td ul.stock li,
div#prdContent div#prdDetails table td ul.stock li dl,
div#prdContent div#prdDetails table td ul.stock li dl dd.size ul li,
div#prdContent dl#beyerBlogInfo,
div#prdContent div#sub ul.descImg01,
div#prdContent div#sub div#prdGenre dl,
div#prdContent div#sub div#prdMaterial dl,
div#genreIndex01,
div.contRanking,
div.contRanking dl.item.lower { display: inline-block; }

/* exclude MacIE5 [start] \*/
* html div#refineUnit02 div.utility,
* html div#refineUnit02 div.utility div.refine01,
* html div#refineUnit02 div.utility div.ctrlNumber01,
* html div#navWomSub ul,
* html div.cart01,
* html div#prdHeader,
* html div#prdHeader div.info ul.spec,
* html div#prdContent,
* html div#prdContent div#prdBrand,
* html div#prdContent div#prdDetails table td ul.stock li,
* html div#prdContent div#prdDetails table td ul.stock li dl,
* html div#prdContent div#prdDetails table td ul.stock li dl dd.size ul li,
* html div#prdContent dl#beyerBlogInfo,
* html div#prdContent div#sub ul.descImg01,
* html div#prdContent div#sub div#prdGenre dl,
* html div#prdContent div#sub div#prdMaterial dl,
* html div#genreIndex01,
* html div.contRanking,
* html div.contRanking dl.item.lower { height: 1% }

div#refineUnit02 div.utility,
div#refineUnit02 div.utility div.refine01,
div#refineUnit02 div.utility div.ctrlNumber01,
div#navWomSub ul,
div.cart01,
div#prdHeader,
div#prdHeader div.info ul.spec,
div#prdContent,
div#prdContent div#prdBrand,
div#prdContent div#prdDetails table td ul.stock li,
div#prdContent div#prdDetails table td ul.stock li dl,
div#prdContent div#prdDetails table td ul.stock li dl dd.size ul li,
div#prdContent dl#beyerBlogInfo,
div#prdContent div#sub ul.descImg01,
div#prdContent div#sub div#prdGenre dl,
div#prdContent div#sub div#prdMaterial dl,
div#genreIndex01,
div.contRanking,
div.contRanking dl.item.lower { display: block; }
/* exclude MacIE5 [end] */