/* ================================================================== */
/*                                                                    */
/* ! Home */
/*                                                                    */
/* ------------------------------------------------------------------
*
*    1. Layout
*
*    2. Header (Right Area)
*       2.1. COIFFEUR - MAQUILLEUR
*       2.2. Global Navigation
*       2.3. Dropdown Menu
*            2.3.1. Buttun Difinition
*
*    3. Visual Box (Left Area)
*
*    4. News
*
*    5. Inquiry
*
* =================================================================== */

/* ================================================================== */
/*                                                                    */
/* ! 1. Layout */
/*                                                                    */
/* ================================================================== */

#bigpanel {
	width: 972px;
	height: 548px;
	margin: 0 auto 0 auto;
	background: #444444;
}

/* ---------------------------------
*    NEW リボン    */

.ribbon {
	position: absolute;
	z-index: 200;
	left: 0;
	top: 0;
}


/* ================================================================== */
/*                                                                    */
/* ! 2. Header (Right Area) */
/*                                                                    */
/* ================================================================== */

#homeHeader {
	position: relative;
	z-index: 100;
	float: right;
	width: 548px;
	height: 548px;
}


/* ------------------------------------------------------------------ */
/*                                                                    */
/* ! 2.1. COIFFEUR - MAQUILLEUR */
/*                                                                    */
/* ------------------------------------------------------------------ */

#cm {
	position: absolute;
	left: 12px;
	top: 12px;
	z-index: 100;
	width: 524px;
	height: 174px;
	background: #575757;
}

#cm h2 {
	width: 304px;
	height: 42px;
	margin: 16px 0 5px 13px;
	background: url(/images/cm_ttl.png) no-repeat;
}

#cm .desc {
	width: 304px;
	height: 16px;
	margin: 0 0 20px 13px;
	background: url(/images/cm_subttl.png) no-repeat;
}

#cm .catch {
	width: 353px;
	height: 55px;
	margin: 0 0 0 15px;
	background: url(/images/cm_desc.gif) no-repeat;
}

/* ------------------------------------------------------------------ */
/*                                                                    */
/* ! 2.2. Home Navigation */
/*                                                                    */
/* ------------------------------------------------------------------ */

#homeNavi {
	width: 524px;
	height: 349px;
	position: absolute;
	top: 186px;
	left: 12px;
}

#homeBtn {
	width: 524px;
	height: 349px;
	background: #666666;
}

#homeBtn li {
	float: left;
	width: 174px;
	height: 174px;
	cursor: pointer;
}

	li#hnAb { margin: 0 1px 1px 0; }
	li#hnMa { margin: 0 1px 1px 0; }
	li#hnSk { margin: 0 0 1px 0; }
	li#hnSa { margin: 0 1px 1px 0; }
	li#hnCa { margin: 0 1px 0 0; }
	li#hnQa { margin: 0 0 0 0; }
	li#hnOf { margin: 0 0 0 0; }

#homeBtn li .cont {
	position: relative;
	width: 174px;
	height: 174px;
	background: #000000;
}


/* ---------------------------------
*    ボタンテキスト    */

a.btnText {
	position: absolute;
	left: 0;
	top: 131px;
	width: 174px;
	height: 43px;
	background-image: url(/images/hn.png) !important;
	background-repeat: no-repeat;
}
	* html a.btnText { background-image: url(/images/hn_ie6.jpg) !important; }

	#hnAb a.btnText { background-position: 0      -43px; }
	#hnMa a.btnText { background-position: -174px -43px; }
	#hnSk a.btnText { background-position: -348px -43px; }
	#hnSa a.btnText { background-position: -522px -43px; }
	#hnCa a.btnText { background-position: -696px -43px; }
	#hnQa a.btnText { background-position: -870px -43px; }


/* ================================================================== */
/*                                                                    */
/* ! 3. Visual Box (Left Area) */
/*                                                                    */
/* ================================================================== */

#visualBox {
	float: left;
	width: 424px;
	height: 548px;
	overflow: hidden;
}

#visualBox .cont {
	width: 424px;
	height: 548px;
}


/* ================================================================== */
/*                                                                    */
/* ! 4. News */
/*                                                                    */
/* ================================================================== */

#news {
	width: 932px;
	margin: 24px auto 0 auto;
	padding: 0 12px 0 28px;
}

#news h3 {
	float: left;
	width: 42px;
	height: 14px;
	margin-top: 17px;
	background: url(/images/news_ttl.gif) no-repeat;
	line-height: 100%;
}

#news ul#ticker {
	float: left;
	width: 525px;
	margin-top: 19px;
}

	*:first-child+html #news ul#ticker { margin-top: 16px; }

#news ul#ticker li {
	position: relative;
	color: #CCCCCC;
	padding-left: 12px;
	background: url(/common/images/li_arrow.gif) 0 -958px no-repeat;
	line-height: 100%;
	vertical-align: top;
}

	*:first-child+html #news ul#ticker li { background-position: 0 -956px; }

#news ul#ticker li span { color: #666666; }
#news ul#ticker li strong { font-weight: bold; }

#news a:link    { color: #CCCCCC; text-decoration: none; }
#news a:visited { color: #CCCCCC; text-decoration: none; }
#news a:hover   { color: #FBFBFB; text-decoration: underline; }
#news a:active  { color: #FBFBFB; text-decoration: underline; }


/* ---------------------------------
*    Banner    */

#news .bnr {
	position: relative;
	float: right;
	left: 1px;
	width: 350px;
}

#news .bnr .cont {
	position: absolute;
	z-index: 10;
	left: 148px;
	top: -34px;
}

a#bnr_mailmagazine {
	position: relative;
	z-index: 10;
}

a#bnr_mailmagazine:hover {
	z-index: 10;
}

a#bnr_brand {
	position: relative;
	z-index: 0;
	margin-left: -1px;
}
a#bnr_brand:hover { z-index: 50; }


/* ================================================================== */
/*                                                                    */
/* ! 5. Inquiry */
/*                                                                    */
/* ================================================================== */

#globalheader {
	display: block !important;
}

#inquiryBtn {
	position: absolute;
	top: -112px;
	left: 28px;
	width: 524px;
}

#inquiryBtn p {
	margin: 8px 0 0 0;
	color: #BBBBBB;
	line-height: 140%;
}

#tn {
	position: relative;
	width: 948px;
	height: 232px;
	margin: 30px auto 0 auto;
	padding: 0;
	border: 12px solid #222222;
	background: url(/images/tn_bg.jpg);
}

#tn .sign {
	margin: 16px 0 10px 16px;
}

#tn .desc {
	margin: 0 0 16px 16px;
}

#tn .ttl {
	margin: 0 0 10px 12px;
}

#tn .date {
	position: absolute;
	left: 16px;
	bottom: 16px;
}

#tn .date .btn {
	padding: 0 0 0 16px;
}


/* ================================================================== */
/*                                                                    */
/* ! 6. Footer */
/*                                                                    */
/* ================================================================== */

#copyright { margin: 0; }
#footerBanner { margin-left: 12px; }


/* ================================================================== */
/*                                                                    */
/* ! 7. サイト改修 */
/*                                                                    */
/* ================================================================== */

.homeCopy {
	width: 525px;
	padding: 12px 0 0 11px;
}
.homeNav {
	height: 242px;
	border-top: 1px solid #434343;
	padding: 0 0 77px 11px;
	/*background: url(../images/home_bg_01.jpg) 11px 100% no-repeat;*/
}
.homeCopy * {
	zoom: 1;
}
.homeNav li {
	float: left;
	border-bottom: 1px solid #434343;
}
.homeNav li a img {
	transition: opacity 0.2s linear;
	-webkit-transition: opacity 0.2s linear;
	-ms-transition: opacity 0.2s linear;
}
.homeNav li a:hover img {
	opacity: 0;
	filter: alpha(opacity=0);        /* ie lt 8 */
	-ms-filter: "alpha(opacity=0)";  /* ie 8 */
}
.homeNav li.nav01 { background: url(../images/homeNav_01_on.jpg) 0 0 no-repeat; }
.homeNav li.nav02 { background: url(../images/homeNav_02_on.jpg) 0 0 no-repeat; }
.homeNav li.nav03 { background: url(../images/homeNav_03_on.jpg) 0 0 no-repeat; }
.homeNav li.nav04 { background: url(../images/homeNav_04_on.jpg) 0 0 no-repeat; }
.homeNav li.nav05 a:hover img { opacity: 0.6; }

.homeNav li.nav01,
.homeNav li.nav03 {
	border-right: 1px solid #434343;
}
