@charset "utf-8";

/*
	Site Name: ABC プリキュア
	Description: initial setting
	Version: 
	Author: 
*/

/*
===== CONTENTS ===========================================

	 1: BASE STYLE
		: wrap
		: header
		: footer
	 2: main_body
		: main_left
			 on air
			 topics
			 news
			 goods
		: main_right
			 on air

==========================================================
*/

/*
===== 1: BASE STYLE ====================================
*/

/*   wrap
-------------------------------------------------------*/
#wrap {
	background: url(../img/bg_main.jpg) no-repeat center 0 transparent;
	background-attachment:fixed; 
	margin:0 auto;
	width:100%;
}

#top_wrap {
	background: url(../img/top_news/bg_news.png) center top no-repeat transparent;
	height: 435px;
}

.general { background: url(../img/bg_ordinary.png) center top no-repeat transparent !important;}

#main_wrap {
	width:980px;
	height: auto;
	margin:0 auto;
/*	overflow: hidden;*/
}



/*   header
-------------------------------------------------------*/
#header{
	height:310px;
	position:relative;
}

h1 {
	position:absolute;
	top: 20px;
	left: -25px;
}


/*** top_news ***/

#top_news {
	position:absolute;
	top: 20px;
	left: 302px;
	width: 660px;
	height: 250px;
}

.general #top_news { display: none !important;}




/*   footer
-------------------------------------------------------*/

#footer {
	clear:both;
	background:url(../img/footer_bg.png) repeat-x transparent;
/*	height: 380px;*/
	margin:0 auto;
}


#footer #wrap {
	position: relative;
	width: 980px;
	background-image: none;}



/*** official ***/

#footer #official { padding-top: 50px;}

#footer #official p {
	float: left;
	width: 200px;
	padding-left: 50px;
}

#footer #official .navi {
	background: url(../img/footer_pre_line.gif) repeat-y transparent;
	overflow: hidden;
	margin-bottom: 15px;
}

#footer ul {
	float: left;
	width: 350px;
	padding-top: 12px;
	padding-left: 30px;
}


#footer #official ul.right {
	float: right;
	text-align: left;
	width: 310px;
}


#footer li {
	background: url(../img/footer_li.gif) left no-repeat transparent;
	padding-left: 12px;
	margin-bottom: 15px;
	line-height: 1.0;
	vertical-align: bottom;
}


#footer li a {
	color: #E1F8FE;
	text-shadow: 1px 1px 0px #9E00C6;
}



/*** incident ***/

#footer #incident {
	clear: both;
	background: url(../img/footer_line.gif) top repeat-x transparent;
	padding: 30px 0 20px 0;
/*	height: 27px;*/
	overflow: hidden;
}

#footer #incident p {
	float: left;
	width: 215px;
	padding-top: 5px;
	padding-left: 35px;	
}

#footer #incident ul {
	background: url(../img/footer_line1.jpg) left repeat-y transparent;
	float: right;
	padding-top: 7px;
	width: 700px;	
}

#footer #incident li {
	float: left;
	width: 230px;
	margin-bottom: 10px;
}

#footer #incident li.last {
	width: auto;
}





/*** copyright ***/

#footer #copyright {
	clear: both;
	overflow: hidden;
	padding-top: 10px;
	background-color: #BA1FAE;
}


#footer #copyright .wrap {
	width: 980px;
	margin: 0 auto;
}

#footer #copyright p {
	float: left;
	width: 760px;
	padding: 5px 0;
	background: url(../img/footer_line2.gif) right repeat-y transparent;
	font-size: 98%;
	color: #EBC1FC;
}

#footer #copyright address {
	float: right;
	width: 210px;
	padding-top: 20px;
	text-align: center;
}



#footer .totop {
	position: absolute;
	right: 0;
	top: -120px;}


/*
===== 2: main_body ====================================
*/

#main_body { /*padding-bottom: 40px;*/}

/*   main_left
-------------------------------------------------------*/

#main_left {
	float: left;
	width: 665px;
}


/******    on air    ******/

#onair_precure {
	background: url(../img/oa_pre/oapre_bg.png) left top no-repeat transparent;
	height: 300px;
	margin-bottom: 15px;
	padding: 15px 30px 0 60px;
}

#onair_precure .main {
	position: relative;
	background: url(../img/oa_pre/happiness/image.jpg) left 12px no-repeat transparent;
	height: 285px;
}

#onair_precure .main h2 {
	position: absolute;
	top: 0;
	left: 200px;
}


#onair_precure .main .onair{
	position: absolute;
	top: 100px;
	left: 180px;
}

#onair_precure .main .bt{
	position: absolute;
	top: 230px;
	left: 0;
}

#onair_precure .main dl{
	position: absolute;
	top: 95px;
	left: 375px;
	width: 147px;
	height: 153px;
	background: url(../img/oa_pre/happiness/game_bg.png) left top no-repeat transparent;
	padding: 25px 38px 0 15px;

}

#onair_precure .main dd{ text-align: center;}




/******    news    ******/

#news { margin-bottom: 10px;}


#news .main {
	padding: 0 30px 10px 30px;
	margin-bottom: 35px; /* topicsがニュースの上の場合 */
	overflow: hidden;
	background: url(../img/news/news_bg.png) left bottom no-repeat transparent;
}

#news div.details {
	clear: both;
	border-top: 1px #E6CC51 solid;
	padding: 10px 20px;
	overflow: hidden;
}

#news div.non {	border-top: none !important;}


#news p.date {
	float: left;
	width: 125px;
	margin-right: 10px;
	font-size: 98%;
	line-height: 1.0;
	vertical-align: baseline;
}

#news p.date img { margin-left: 5px;}


#news p.details {
	float: right;
	width: 430px;
	margin-bottom: 10px;
}


#news div.add_phot p.details {
	float: left;
	width: 350px;
}


#news div.add_phot p.details img.movie {
	margin-right: 5px;
	vertical-align: middle;
}


#news div.add_phot p.details img.story {
	margin-right: 3px;
	margin-top: -2px;
	vertical-align: middle;
}


#news div.add_phot p.phot {
	float: right;
	width: 74px;
}


#news div.add_phot p.phot img {
	border-radius: 5px;
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */
	border: 2px #E6CC51 solid;
}




/******    topics    ******/


#topics {
	clear: both;
	overflow: hidden;
	margin-top: 35px; /* topicsがニュースの上の場合 */
/*	margin-bottom: 35px;*/
}

/* small */
#topics .small {
	float: left;
	background: url(../img/topics/topics_s_bg.png) left top no-repeat transparent;
	width: 285px;
	height: 130px;
	margin-right: 10px;
	margin-bottom: 10px;
	padding: 16px 18px;
}


#topics div.wrap {
	background-position: right top;
	background-repeat: no-repeat;
	background-color: transparent;
	height: 120px;
	line-height:1.3;
}

#topics .small div.wrap { padding-right: 130px;}
#topics .no_phot div.wrap { padding-right: 0;}


/* large */
#topics .large {
	clear: both;
	background: url(../img/topics/topics_l_bg.png) left top no-repeat transparent;
	width: 620px;
	height: 121px;
	margin-right: 10px;
	margin-bottom: 10px;
	padding: 16px 18px;
}

#topics .large div.wrap {
	background-position: right top;
	background-repeat: no-repeat;
	background-color: transparent;
}


#topics h3 {
	padding: 10px 0 5px 0;
	line-height: 1.3;
	font-weight: bold;
	color: #CC188C;
}

#topics .date {
	font-size: 80%;
	line-height: 1.0;
	padding: 3px 0 5px 0;
	color: #CC0099;
}



/******    goods    ******/

#goods { font-size: 98%; margin-bottom: 40px;}
#goods h2 { margin-bottom: 10px;}

#goods .goods_wrap { margin-bottom: 20px;}


/* abc amazon */
#goods .abc,
#goods .amazon {
	padding: 10px 0 0;
	overflow: hidden;
}

#goods .abc { background: url(../img/goods/goods_abc_bg.gif) repeat transparent;}
#goods .amazon { background: url(../img/goods/goods_amazon_bg.gif) repeat transparent;}

#goods .product {
	float: left;
	width: 190px;
	padding: 0 15px;
	margin-bottom: 30px;
}

#goods .abc .product { background: url(../img/goods/goods_abc_line.gif) right repeat-y transparent;}
#goods .amazon .product { background: url(../img/goods/goods_amazon_line.gif) right repeat-y transparent;}

#goods .non { background: none !important;}

#goods .product p { padding-top: 10px; margin: 0 auto;}
#goods .product p.image {
	display: table-cell;
	width: 190px;
	height: 160px;
	text-align: center;
	vertical-align: middle;
	padding: 5px 0;
	background-color: #fff;
}




/*   main_right
-------------------------------------------------------*/

#main_right {
	float: right;
	width: 300px;
}



/******    slider    ******/

#slides {
	background: url(../img/slider/rectangle_bg.png) 0 0 no-repeat;
	display: none;
	width: 300px;
	height: 290px;
	padding-top: 29px;
}
#slides .slidesjs-navigation {
	margin-top:3px;
}
#slides .slidesjs-previous ,
#slides .slidesjs-next {
	display: none;
}
.slidesjs-pagination {
	list-style: none;
	margin: 8px 0 0;
	text-align: center;
}
.slidesjs-pagination li {
	display: inline-block;
	margin: 0 4px;
}
.slidesjs-pagination li a {
	background: url(../img/slider/ico_pagination.png) 0 0 no-repeat;
	display: block;
	height:14px;
	overflow: hidden;
	text-indent: 100%;
	width: 15px;
}
.slidesjs-pagination li a.active,
.slidesjs-pagination li a:hover.active {
	background: url(../img/slider/ico_pagination_act.png) 0 0 no-repeat;
}
.navbar {
	overflow: hidden
}


/******    history    ******/


#history ul { background: url(../img/history/history_bg.png) left repeat-y transparent;}

#history li a {
	display: block;
	width: 290px;
	height: 83px;
	padding: 10px 0 2px 10px;
	background: url(../img/history/history_bt_off.png) top left no-repeat transparent;
}

#history li a:hover {
	background: url(../img/history/history_bt_on.png) top left no-repeat transparent;
}
