@charset "utf-8";
/* CSS Document */


#step{
	margin-top:25px;
}

#step ul{
	width:603px;
	margin:0 auto;
}

#step ul li{
	width:190px;
	height:63px;
	float:left;
	margin-left:12px;
	cursor:pointer;
}

#step ul li:first-child{
	margin-left:0px;
}

#step ul li.active{
	/*cursor:auto;*/
}

#step ul li#step_btn1{
	background:url(../img/card_list/btn1.gif)
}

#step ul li#step_btn2{
	background:url(../img/card_list/btn2.gif)
}

#step ul li#step_btn3{
	background:url(../img/card_list/btn3.gif)
}

#step ul li#step_btn1.active{
	background:url(../img/card_list/btn1_ov.gif)
}

#step ul li#step_btn2.active{
	background:url(../img/card_list/btn2_ov.gif)
}

#step ul li#step_btn3.active{
	background:url(../img/card_list/btn3_ov.gif)
}

#main .page_nation{
	padding:0px 20px;
	margin-bottom:44px;
}

#main .page_nation:last-child{
	padding-bottom:90px;
	margin-bottom:0px;
}

#main .page_nation p.note{
	color:#FFF;
	font-size:20px;
}

#main .page_nation nav{
	padding:40px 0px;
	background:url(../img/card_list/card_back.gif) no-repeat center center;
}

#main .page_nation:last-child nav{
	padding:0px 0px;
	background:none;
}

#main .page_nation ul{
	width:498px;
	margin:0 auto;
}

#main .page_nation ul li{
	width:112px;
	height:114px;
	float:left;
	margin-right:80px;
	cursor:pointer;
}

#main .page_nation ul li.active{
	cursor:auto;
}

#main .page_nation ul li.pn_btn1{
	background:url(../img/card_list/1.png);
}
#main .page_nation ul li.pn_btn2{
	background:url(../img/card_list/2.png);
}
#main .page_nation ul li.pn_btn3{
	background:url(../img/card_list/3.png);
}

#main .page_nation ul li.pn_btn1.active{
	background:url(../img/card_list/1_ac.png)
}
#main .page_nation ul li.pn_btn2.active{
	background:url(../img/card_list/2_ac.png)
}
#main .page_nation ul li.pn_btn3.active{
	background:url(../img/card_list/3_ac.png)
}


.n_click{
pointer-events : none;
}

#main .page_nation ul li:last-child{
	margin-right:0px;
}

.card_list ul{
	padding:0px 16px 40px 16px;
	display:none;
}

.card_list ul li.margin{
	position:relative;
	top:-24px;
	left:0px;
}

.card_list #loading{
	display:block;
	position:relative;
	left:50%;
	margin-left:-12px;
	margin-bottom:20px;
}

.card_list ul.active{
	display:block;
}

.card_list ul li{
	width:280px;
	display:inline-block;
	
}

.card_list ul li:nth-child(2n){
	margin-left:40px;
}

.card_list ul li .card_id{
	width:282px;
	height:80px;
	color:#FFF;
	padding-top:23px;
	background:url(../img/card_list/normal.png),url(../img/card_list/namber_back.gif);
	background-repeat:no-repeat;
	background-position:top right,bottom left;
}

.card_list ul li.r .card_id{
	background:url(../img/card_list/rare.png),url(../img/card_list/namber_back.gif);
	background-repeat:no-repeat;
	background-position:top right,bottom left;
}

.card_list ul li.sr .card_id{
	background:url(../img/card_list/s_rare.png),url(../img/card_list/namber_back.gif);
	background-repeat:no-repeat;
	background-position:top right,bottom left;
}

.card_list ul li.hr .card_id{
	background:url(../img/card_list/h_rare.png),url(../img/card_list/namber_back.gif);
	background-repeat:no-repeat;
	background-position:top right,bottom left;
}

.card_list ul li.ur .card_id{
	background:url(../img/card_list/u_rare.png),url(../img/card_list/namber_back.gif);
	background-repeat:no-repeat;
	background-position:top right,bottom left;
}

.card_list ul li .card_id p{
	font-size:24px;
	line-height:40px;
	padding-left:20px;
}

.card_list ul li .card{
	margin-top:8px;
	margin-bottom:20px;
}

.card_list ul li .card_name{
	color:#cbb99d;
	font-size:26px;
	text-align:center;
	margin-bottom:21px;
}

.card_list{
	display:none;	
}

#card_list3{
	display:block;
}

