@charset "utf-8";

/****************************************
		1. General Setting 
*****************************************/

html, body, div, span, applet, object, iframe, strong,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, sub, sup, tt, var,dl, dt, dd, ol, ul, li,fieldset, form, legend, caption, tbody, tfoot, thead, table, label, tr, th, td{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
	list-style:none;
	}

/****************************************
		2. Basic Layout 
*****************************************/

body {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #000;
	margin: 0; 
	padding: 0;
	text-align: center; 
	color: #000000;
	font-size:14px;
}
#container {
	width: 1000px;
	background:#000 url(../img/bg_main.jpg) no-repeat top center;
	margin: 0 auto; 
	border: 1px solid #000000;
	text-align: left;
}
#header {
	padding: 0;
	margin:0;
	z-index:1;
        position:relative;
}

#header .info{
    position:absolute;
    right:25px;
    bottom:90px;
}

#history{
	width:350px;
	height:250px;
	position:absolute;
	background:url(../img/bg_news.png) no-repeat top center;
	margin:150px 610px 0px 40px;
	color:#FFFFCC;
}

#history dl{
	width:320px;
	height:180px;
	margin:65px 10px 10px 20px;
	padding:0 10px 0 0;
	overflow:auto;
}

#history dt{
	clear:both;
	width:100px;
	float:left;
	margin-bottom:3px;
}

#history dd{
	width:200px;
	float:right;
	margin-bottom:3px;
}

#twitter_box{
	position:absolute;
	width:350px;
	height:250px;
	margin:430px 610px 0 40px; 
	background:url(../img/bg_twitter.png) no-repeat top center;

}

.twi_text{
	width:340px;
	height:200px;
	margin:50px 0 0 10px;
}

.enter{
	width:180px;
	height:25px;
	padding:640px 0 90px 0;	
	margin:0 375px 0 445px;	
	position:relative;
	z-index:50;

}

#mainContent {
	padding: 0;
	margin:0 0 0 0;
	color:#0b1c09;
	z-index:5;
}

#mainContent p{
	padding:5px 0 5px 5px;
}

.cursor{
	cursor:pointer;
}
#tabs_container #tabs-2 ul{
	margin:20px 0;

}

#tabs_container #tabs-2 li.comic{
	width:150px;
	float:left;
	margin-right:5px
}

#tabs_container #tabs-2 li.text{
	width:150px;
	float:left;
	margin-right:5px
}

#tabs_container #tabs-2 .text a{
	background:#999966;

}

#tabs-2 dl{
	width:350px;
}

#tabs_container #tabs-2  dt{
	clear:both;
	width:100px;
	float:left;
	text-align:left;
	margin:5px 15px;
}

#tabs_container #tabs-2 dd{
	width:220px;
	float:right;
	text-align:left;
	vertical-align:top;
	margin:5px 0;

}


/****************************************
		3. footer 
*****************************************/

#footer {
	background:url(../img/bg_footer.jpg) no-repeat top center;
	padding:20px;
	color:#FFFFCC;
	font-size:12px;
}

#footer p {
	margin: 0;
	padding: 10px 0;
	text-align:center;
}

#footer table{
	position:relative;
	margin:15px auto 10px auto;
}

#footer td{
	vertical-align:top;
}

#socialbuttons{
	width:450px;
	text-align:center;
	margin:0 auto;
}

#socialbuttons div {
	float:left;
	margin:0 10px;
}

/*
Back to top button 
*/
#back-top {
    position: fixed;
    bottom: 3%;
    right: 3%;
	z-index:50;
	width:100px;
	height:100px;
    display: block;}
	
#slider{
	width:550px;
	position:relative;
	margin:10px auto;
	background:#666666;
}


/****************************************
	special interview
*****************************************/

div.interview table{

    margin-bottom:150px;
}


div.interview th{

    background:black;
    color:white;
    padding:0.5em;
	text-align:center;

}



div.interview p{
    width:100%;
    margin:1em auto;
    font-weight:bold;
    padding:0;
}

div.interview p.photo{

    text-align:center;
}
div.interview p.photo img{
    margin:0 10px;
}

div.interview dl{
    width:840px;
    margin:2em auto;
    padding:0;
}

div.interview dt{
    font-weight:bold;
    border-bottom:2px solid;
    padding:0.5em;
    margin-top:2em;
}

div.interview dd{
    padding:0.5em;

}


div.interview dd span{
    color:darkred;
    
}


div.interview dd span:after{
	content:"\FF1A";
}

/****************************************
	btn
*****************************************/

#tabs_container #tabs-1 h3{
	font-size:18px;
}


#tabs_container #tabs-1 ul.product{
	overflow:hidden;
}
#tabs_container #tabs-1 ul.product li{
	float:left;
        font-size:0.9em;

}

#tabs_container #tabs-1 table{
	width:900px;
	margin:5px 0px 30px 10px;
}

#tabs_container #tabs-1 td{
	width:280px;
	padding:10px;
	margin:10px;
	background:#000000;
	color:#FFFFFF;
}

#tabs_container #tabs-1 .cast dl{
}

#tabs_container #tabs-1 .cast  dt{
	clear:both;
	width:6em;
	float:left;
	text-align:left;
	margin-left:15px;
   	
}

#tabs_container #tabs-1 .cast dd{
	width:150px;
	float:left;
	text-align:left;
}

#tabs_container #tabs-1 .cast  dd:before{
    content:"\FF1A";
}



#tabs-1 p.right img{
    display:inline-block;
    background:url(../img/btn_bg.png) no-repeat top center;
    width:85px;
    height:40px;
    cursor:pointer;

}
#tabs-1 p.right img:hover {
    background-position:bottom;
}



/****************************************
	tabs-3 CHARACTER
*****************************************/
#tabs-3 ul{
    padding-top:100px;
}
#tabs-3 table {
    margin-bottom:20px;
}

#tabs-3 table td{

    vertical-align:top;

}

#tabs-3 ul.handyman{
     background:url(../img/chara/group_handyman.png) no-repeat top left;
}

#tabs-3 ul.clinic{
    background:url(../img/chara/group_clinic.png) no-repeat top left;
}


#tabs-3 ul.police{
    background:url(../img/chara/group_police.png) no-repeat top left;
}

#tabs-3 ul.monroe{
    background:url(../img/chara/group_monroe.png) no-repeat top left;
}

#tabs-3 ul.guild{
    background:url(../img/chara/group_guild.png) no-repeat top left;
}


#tabs-3 ul.tabaco{
    background:url(../img/chara/group_tabaco.png) no-repeat top left;
}


#tabs-3 ul.cristiano{
    background:url(../img/chara/group_cristiano.png) no-repeat top left;
}

#tabs-3 li{
	width:440px;
	margin:0 auto;
	padding:10px;
}
#tabs-3 dl{
        overflow:hidden;

}
#tabs-3 dt{
	width:150px;
	float:left;
	margin:0 0 25px 0;
}

#tabs-3 dd{
	width:280px;
	padding:10px 0 0 0;
	float:right;
	margin:0 0 25px 0;
}