@charset "UTF-8";
/*////////////////////////////////////////////////////////////
UNIQLO - L1-2.css

Copyright (C) UNIQLO Co., Ltd. All Rights Reserved.
------------------------------------------------------------

	0. Import External CSS
	1. Common Style
	2. Unit
	3. Sidebar: Utility Nav
	4. Sidebar: News Block

	99. Others

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

/* ------------------------------------------------------------
	0. Import External CSS
   ------------------------------------------------------------ */

/* ------------------------------------------------------------
	1. Common Style
   ------------------------------------------------------------*/
/*
div#blkTopicList
    div.feature-L
        div.unitTopic.campaign-L
        [div.unitTopic.unit-M]
    div#wrap-1.wrap-M
        div.unitTopic.feature-M
        div#col-1.col
            div.unitTopic.unit-(L | M | S )
        div#col-2.col
            :
        div#wrap-2.wrap-M
            :
*/

/*
div#blkTopicList {
	background: url(/jp/top/img/material/bg-grid-570-horizon.gif) repeat-x 0 100%;
}
*/

div#content {
	background: url(/jp/top/img/material/bg-grid-950.gif) repeat-y -1px 0;
}

div#content div#sub { float: right; width: 190px; }
div#content div#main { float: left; }

/* ------------------------------------------------------------
	2. Unit
   ------------------------------------------------------------ */
/* --- wrap col --- */
div.wrap-M {
	float: left;
	width: 380px;
	background: url(/jp/top/img/material/bg-grid-950.gif) repeat-y -1px 0;
}

div#wrap-1 { position: relative; z-index: 201; }
div#wrap-2 { position: relative; z-index: 200; }

/* --- colums --- */
div.col {
	float: left;
	width: 190px;
}
div#col-1 { background: none; }

div#col-1 { position: relative; z-index: 104; }
div#col-2 { position: relative; z-index: 103; }
div#col-3 { position: relative; z-index: 102; }
div#col-4 { position: relative; z-index: 101; }

/* --- unit --- */
div.unitTopic {
	position: relative;
	width: 171px;
	padding: 9px 9px 0 9px;
	border-right: 1px solid #dcdcdc;
	border-bottom: 1px solid #dcdcdc;
}

div.unitTopic .object {
	margin: 0;
	padding: 0;
}

div.unitTopic .title {
	margin-top: 10px;
	margin-bottom: 7px;
/*	color: #d83f3f;*/
	font-size: 93%;
	line-height: 1.2;
	font-weight: bold;
}

div.unitTopic .summary,
div.unitTopic .price {
	margin: 0;
	padding: 0 0 7px;
}

div.unitTopic .summary {
	font-size: 85%;
	line-height: 1.6;
}

div.unitTopic .summary a:link,
div.unitTopic .summary a:visited,
div.unitTopic .summary a:hover,
div.unitTopic .summary a:active {
	color: #069;
}

div.unitTopic .price {
	color: #f00;
	font-weight: bold;
	font-size: 93%;
}

/* --- feature --- */
div.feature-L {
	width: 760px;
	border-bottom: 1px solid #dcdcdc;
}

div.feature-L div.unitTopic {
	display: inline; /* for IE6 */
	float: left;
	border-bottom: none;
}

div.feature-L div.campaign-L {
	width: auto;
	border-right: none;
}

div.feature-L div.unit-M {
	float: right;
	border-left: 1px solid #dcdcdc;
}

div.feature-M {
	width: 361px;
	background: #fff;
}

/* --- Icon --- */
/*
ico1 = store
ico2 = special
*/
div.unitTopic div.object a {
	position: relative;
	display: block;
}

div.unitTopic div.object a:hover {
	background: #fff; /* for ie6 */
}

div.unitTopic a .ico1,
div.unitTopic a .ico2 {
	position: absolute;
	top: 0;
	left: -9999px;
	width: 100px;
	height: 19px;
	background: url(/jp/top/img/ico-store-01.gif) no-repeat 0 0;
}
div.unitTopic a .ico2 { background-image: url(/jp/top/img/ico-special-01.gif); }

div.unitTopic a:hover .ico1,
div.unitTopic a:hover .ico2 {
	left: 0;
}

/* --- tooltip --- */
div.unitTopic div.tooltip {
	display: none;
	position: absolute;
	top: 0;
	left: 105px;
	width: 135px;
	height: 151px;
	padding: 0;
	background: url(/jp/top/img/bg-tooltip-01.png) no-repeat 0 0;
}

div.unitTopic-L div.tooltip { top: 105px; }
div.unitTopic-M div.tooltip { top: 20px; }
div.unitTopic-S div.tooltip { top: -25px; }

div.unitTopic div.tooltip ul {
	position: absolute;
	top: 30px;
	left: 36px;
/*
5 items = top: 30px;
4 items = top: 39px;
3 items = top: 48px;
2 items = top: 57px;
1 item  = top: 63px;
*/
}

div.unitTopic div.tooltip ul li {
	width: 64px;
	font-size: 8px;
}

div.unitTopic div.tooltip ul li a {
	display: block;
	width: 64px;
	height: 13px;
	padding-top: 3px;
	padding-bottom: 3px;
}

/* ------------------------------------------------------------
    3. Sidebar: Utility Nav
   ------------------------------------------------------------ */
div#sidebar ul.navUtility {
	width: 143px;
	margin: 9px auto 17px;
	padding: 2px 14px;
	background: #666;
}

div#sidebar ul.navUtility li {
	float: left;
	padding: 6px 0;
}

/* ------------------------------------------------------------
    4. Sidebar: News Block
   ------------------------------------------------------------ */
div#sidebar div.blkNews,
div#sidebar div.blkPress {
	width: 171px;
	margin: 0 auto;
	padding: 15px 9px 0;
	border-bottom: 1px solid #dcdcdc;
	font-size: 85%;
}

div#sidebar div.blkNews {
	margin-top: -1px;
	border-top: 1px solid #dcdcdc;
}

div#sidebar div.blkNews h2,
div#sidebar div.blkPress h2,
div#sidebar div.blkNews ul.list li,
div#sidebar div.blkPress ul.list li { padding-bottom: 13px; }

div#sidebar div.blkNews ul.list li a,
div#sidebar div.blkPress ul.list li a {
	display: block;
	position: relative;
	padding-top: 2px;
	padding-left: 22px;
	background: url(/jp/top/img/material/spr-arrow-01.gif) no-repeat -3000px 0;
	color: #000;
}

* html div#sidebar div.blkNews ul.list li a,
* html div#sidebar div.blkPress ul.list li a {
	display: inline;
	zoom: 1;
}

div#sidebar div.blkNews ul.list li a:hover,
div#sidebar div.blkPress ul.list li a:hover {
	background-position: -1000px 0;
}

/* ------------------------------------------------------------
	99. Others
   ------------------------------------------------------------ */

/* ################################################################################
	[Clearfix] Clearfix CSS Hack
   ################################################################################ */
/* use "clearfix" class name, but not main elements */
div#sidebar ul.navUtility:after,
.clearfix:after {content:".";display:block;clear:both;height:0;visibility:hidden;}

div#sidebar ul.navUtility,
.clearfix {display:inline-block;}

/* exclude MacIE5 [start] \*/
* html div#sidebar ul.navUtility,
* html .clearfix {height:1%;}

div#sidebar ul.navUtility,
.clearfix {display:block;}
/* exclude MacIE5 [end] */