@charset "utf-8";

/*===================================================
*
*	home style sheet
*
*	1. outline
*	2. contentrs
*		2-1. flash area
*		2-2. pickup
*		2-3. audition
*	3. sidebar
*		3-1. news
*		3-2. mobile
*		3-3. sidebar
*	4. main footer
*		4-1. group search
*
====================================================*/

/* ---------------------------------------
 1. outline
----------------------------------------*/

div.contents {
	width: 640px;
	float: left;
}

div.sidebar {
	position: relative;
	width: 300px;
	float: right;
}

div.mainFoot {
	clear: both;
	text-align:center;
	width:954px;
	margin-left:-2px;
}

div.mainFoot #footerBanner img{
	padding-left:2px;
	padding-bottom:10px;
}

/* ---------------------------------------
 2. contents
----------------------------------------*/

/*
 2-1. flash area
---------------------------------*/

div#topFlashArea {
	margin-bottom: 10px;
}

/*
 2-2. pickup
---------------------------------*/

div#pickupBox {
	padding: 27px 0 0 0;
	border:1px solid #AAAAAA;
}

*html div#pickupBox {
	margin-top:10px;
	padding: 33px 0 0;
}

*+html div#pickupBox {
	margin-top:10px;
	padding: 33px 0 0;
}


div#pickupBox h2.head-01 {
	left:-1px;
	top:-1px;
}

div#pickupBox h3 {
	font-size: 100%;
}

div#pickupBox ul {
	width:612px;
	margin:6px 14px;
	background: url("/image/home/bg_news.gif") repeat-y 0 0;
}

div#pickupBox ul:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

div#pickupBox li {
	width: 204px;
	float: left;
	background: url("/image/common/bg_dotline.gif") repeat-x 0 bottom;
	position: relative;
	height: 100px;
	overflow: hidden;
}

div#pickupBox li#pickup04, 
div#pickupBox li#pickup05, 
div#pickupBox li#pickup06  {
	background: none;
}

div#pickupBox h3 {
	padding: 4px 0 ;
}

div#pickupBox h3,
div#pickupBox p {
	padding-left: 92px;
	padding-right: 3px;
}

div#pickupBox p.authorImage {
	position: absolute;
	top: 5px;
	left: 8px;
	padding: 0;
}

div#pickupBox p.authorImage a img {
	width:70px;
	padding: 1px;
	border: 1px solid #aaa;
}

div#pickupBox p.authorImage a:hover img {
	border: 2px solid #e00;
	padding: 0;
}

div#pickupBox li#pickup01 p.authorImage,
div#pickupBox li#pickup04 p.authorImage{
	left: 0px;
padding:0;
}

div#pickupBox li#pickup01 h3,
div#pickupBox li#pickup01 p ,
div#pickupBox li#pickup04 h3,
div#pickupBox li#pickup04 p {
	padding-left: 86px;
	padding-right: 3px;
}

div#pickupBox p.description{
	line-height:1.12;
	font-size:92%;
}

div#pickupBox p.guide {
	padding: 0 10px 0 15px;
	position: absolute;
	bottom: 5px;
	right: 0;

}

/*
 2-3. audition
---------------------------------*/

div#auditionBox{
	padding:35px 16px 10px
}

div#auditionBox ul li {
	margin:5px ;
	padding-bottom:8px;
	background: url("/image/common/bg_dotline.gif") 0 bottom repeat-x;
}

div#auditionBox p.guide {
	text-align: right;
}

/*

 2-4. official site & blog list
---------------------------------*/

div#siteListBox{
	padding:33px 0 7px 7px
}

div#siteListBox ul li {
	width:270px;
	float:left;
	padding-right:7px;
}



div#siteListBox ul li span{
	display:block;
	padding-top:6px;
	text-align:right;
}


/* ---------------------------------------
 3. sidebar
----------------------------------------*/

/*
 3-1. news
---------------------------------*/

div#newsBox {
	padding: 25px 0 5px 5px;
	position:relative;
	height:176px;
	border:1px solid #AAAAAA;
	
}

div#newsBox h2.head-01 {
	left:-1px;
	top:-1px;
}

*html div#newsBox {
	margin-bottom:0;
}

*+html div#newsBox {
	margin-bottom:0;
}

div#newsBox ul {
	padding:5px 5px 0;
	height: 177px;
}


*html div#newsBox ul {
	height: 170px;
}

div#newsBox li {
	background: url("/image/common/bg_dotline.gif") 0 bottom repeat-x;
	padding: 5px 0;
	line-height: 1.08;
	margin-right:5px;
}

div#newsBox li span {
	display: block;
}

div#newsBox li span.newsType {
	float: left;
	padding-top: 5px;
	width: 50px;
}

div#newsBox li span.newsBody{
	display: block;
	overflow: hidden;
	height: 1em;
}

div#newsBox li span.newsBodynoTalent{
	display: block;
	overflow: hidden;
	height: 1.5em;
	padding-top:0.5em;
}

div#newsBox p.guide {
	text-align: right;
	margin-top:5px;
	margin-right:5px;
}

div#newsBox li a.arrow-01 {
	background:none;
	padding-left:0px;
}

.btnNewsList {
	position:absolute;
	top:4px;
	left:485px;
}

/*
 3-2. Official
---------------------------------*/

div#officialBox {
	padding: 25px 0 5px 5px;
	position:relative;
	height:176px;
	border:1px solid #AAAAAA;
}

div#officialBox h2.head-01 {
	left:-1px;
	top:-1px;
}


*html div#officialBox {
	margin-bottom:0;
}

*+html div#officialBox {
	margin-bottom:0;
}

div#officialBox h3 {
	padding:14px 0 5px;
}

div#officialBox div.list {
	float:left;
	width:128px;
	padding-left:8px;
}

div#officialBox div.list ul{
	margin-bottom:6px;
	height:110px;
	overflow:hidden;
}

div#officialBox li {
	padding: 5px 0;
	line-height: 1.08;
	/padding: 4px 0;
}

div#officialBox li a{
	background:transparent url(/image/common/bg_arrow_01.gif) no-repeat scroll 0 4px;
	padding-left:13px;
}

div#officialBox p.btnlist,
div#officialBox p#btnlist {
	font-size:92%;
}

div#officialBox li span {
	display: block;
}


div#officialBox li a.arrow-01 {
	background-position: 0 2px;
}

/*
 3-2. mobile
---------------------------------*/

div#mobileBox {
	border: 1px solid #aaa;
	padding-bottom: 5px;
}

div#mobileBox p {
	margin: 5px 10px;
}

div#mobileBox p img.qrcode {
	float: right;
	margin-left:5px;
}

/*
 3-2. banner
---------------------------------*/

ul.bannerList li {
	margin: 10px 0;
}

ul.bannerListTop {
	margin: 0 0 20px;
}

ul.bannerListTop li.bannerListTopLeft {
	float: left;
}

ul.bannerListTop li.bannerListTopRight {
	float: right;
}

ul.bottomBannerList{
    zoom: 100%;
}
ul.bottomBannerList:after{
    content: "";
    clear: both;
    height: 0;
    display: block;
    visibility: hidden;
}

ul.bottomBannerList li{
	float:left;
}

ul.bottomBannerList li a img{
	margin:5px;
}

div#bottomBannerArea img{
	margin-bottom:5px;
}

div.mainFoot a{
	margin-bottom:10px;
}

div.mainFoot a{
	display : block ;
	float : left ;
	padding-left:1px;
}

div.mainFoot a img{
	margin-bottom:5px;
}

div.flashBanner{
	display : block ;
	float:left;
}


div#RandomBanner{
	width:224px;
	display:inline;
}



/* ---------------------------------------
 4. main footer
----------------------------------------*/
/*
 4-1. group search
---------------------------------*/

form#groupSearch {
	border: 1px solid #BBB;
	text-align: center;
	clear:both;
}

form#groupSearch fieldset {
	background: url("/image/common/bg_stripe.gif");
	margin: 2px;
	padding: 3px 0;
}

form#groupSearch div.legend {
	display: inline;
	margin-right: 5px;
	margin-top: 3px;
}


/* ---------------------------------------
 5. Other
----------------------------------------*/
/*
 5-1. Matataki jack
---------------------------------*/
#matatakiBanner {
	position:absolute;
	top:0px;
	right:0px;
}

span#soundBtn {
	position:absolute;
	top:185px;
	right:6px;
	cursor:pointer ;
}