@charset "utf-8";



/* comic

----------------------------------------------------------------------*/

#comic {

position: relative;

margin-bottom: 10px;

width: 900px;

background: url(../image/history_bg_repeat.png) left top repeat-y;

}



#comic h2 {

position: absolute;

left: 50%;

top: 10px;

margin-left: -31px;

text-align: center;

line-height: 1;

}



#comic #comicTop {

width: 900px;

height: 372px;

background: url(../image/history_bg_top.png) left top no-repeat;	

}



#comic #comicBottom {

position: absolute;

bottom: 0;

left: 0;

width: 900px;

height: 122px;

background: url(../image/history_bg_bottom.png) left bottom no-repeat;	

}



#comic .wrapper {

position: relative;

margin: -322px auto 0;

padding: 20px 0 70px;

width: 790px;

}



#comic h3 {

margin: 0 auto 20px;

width: 780px;

}



#comic h3 * {

line-height: 24px;

vertical-align: middle;

}



#comic h3 strong {

margin-right: 15px;

}



#comic #itemContainer {

margin: 0 auto;

width: 748px;

}



#comic #itemContainer .inner {

position: relative;

margin: 0 auto;

width: 768px;

height: 188px;

}



#comic #itemContainer .item {

float: left;

margin-right: 20px;

margin-bottom: 20px;

width: 172px;

}



#comic #itemContainer .item h4 {

margin-bottom: 5px;

color: #FFF;

font-weight: bold;

font-size: 14px;

font-family: Arial, Helvetica, sans-serif;

line-height: 1;

background: url(../image/download_title_bg.png) 92px center no-repeat;

}



#comic #itemContainer .item .thumb {

position: relative;

margin-bottom: 10px;

}



#comic #itemContainer .item .thumb img {

border: 1px solid #666;

}



#comic #itemContainer .item ul {

list-style: none;

}



#comic #itemContainer .item li {

text-align: center;

margin-bottom: 3px;

}



#comic #itemContainer .item .badge {

position: absolute;

right: -15px;

top: 65px;

}



#comic #itemContainer .item .badge img {

border: none;

}