@charset "utf-8";
/* ===================================================================
CSS information

 file name  :style.css
 author     :rcs
 style info :layout関係 他
 
#container
#wrapper
#header
#footer
#contents
#page
#main
#sub
=================================================================== */

/*----------------------------------------------------
	基本設定、リンクカラーなど
----------------------------------------------------*/
html {
}
body {
	background:url(../images/common/page_bg.gif) repeat;
}

a:link {
	color:#008ae4;
}

a:visited {
}

a:hover {
	text-decoration:none;
}

a:active {
}


/*----------------------------------------------------
	汎用class
----------------------------------------------------*/




/* clearfix */
.clearfix:after{
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block; zoom:1;}
/* Hides from IE-mac \*/
* html .clearfix, * html #contents, * html #wrapper, * html #header #gNavi, * html #fNavi {height: 1%;}
.clearfix, #contents, #wrapper, #header #gNavi, #header #gNavi, #fNavi {display: block;}
/* End hide from IE-mac */




/* -----------------------------------------------------------
	#head
----------------------------------------------------------- */




#head{
	width:100%;
	background:url(../images/common/head_bg.gif) repeat-x;
	height:47px;	
}


#headWrap{
	width:1000px;
	margin:0 auto;
	height:47px;	
}














/* 	#headWrap  ----------------------------------------- */






/* -----------------------------------------------------------
	#gNavi
----------------------------------------------------------- */

#gNavi{
	width:100%;
	height:71px;
	background:url(../images/common/gnavi_bg.gif) repeat-x;
}



#gNavi ul{
	width:1000px;
	margin:0 auto;
	height:60px;
}

#gNavi ul li{
	float:left;
}








/* -----------------------------------------------------------
	#Contents
----------------------------------------------------------- */


#contentsMain h1{
	width:1400px;
	height:122px;
	background:url(../images/common/h1.gif) no-repeat center;
	display:block;
	text-indent:-9999px;
	font-size:0;
	line-height:0;	
	position:relative;
	left:50%;
	margin-left:-700px;
}

#contentsMain h1 a{
	width:1400px;
	height:122px;
	display:block;

}



#contentsWrap{
	width:1030px;
	margin:0 auto;
	padding:0;
	background:url(../images/common/contents_bg.gif) repeat-y 261px 0px;
}


h2{
	width:1030px;
	margin:0 auto;
	margin-bottom:10px;
}


#contentsWrap #contentsBgTop{
	background:url(../images/common/contents_bg_top.gif) no-repeat 261px 0px;
	width:1030px;
	height:33px;
	display:block;
}

#contentsBgBottom{
	background: url(../images/common/contents_bg_bottom.gif) no-repeat 261px 0px;
	width:1030px;
	height:33px;
	display:block;
	margin:0 auto;
}



#contentsWrap #coNavi{
	float:left;
	width:250px;
	padding:15px 0 0 15px;
}

#contentsWrap #coNavi ul{
	width:250px;
}

#contentsWrap #coNavi li{
	width:250px;
	font-size:0;
	line-height:0;
	position:relative;
}


#contentsWrap #coNavi li p{
	background: url(../images/common/con_new.gif) no-repeat;
	width:26px;
	height:9px;
	position:absolute;
	top:5px;
	left:9px;
	z-index:2;
}


#contentsWrap #contents{
	float:right;
	width:690px;
	padding:0 45px 20px 0px;
	font-family:"メイリオ","Meiryo","ＭＳ Ｐゴシック","MS PGothic",Arial, Helvetica, sans-serif, ;
	color:#483725;
}


/* -----------------------------------------------------------
	#product
----------------------------------------------------------- */

.tenpobetu{
	width:220px;
	float:left;
	text-align:center;
}

.tenpobetu p{
	padding:15px 0;
}

.tokuten_cd{
	margin-left: 60px;
	margin-bottom: 20px;
}

.tenpobetu  p .text_long{
	letter-spacing: 1px;
	font-size: 10px;
}

.text_pro{
	font-size: 10px;
	}



/*  guide  */


.guide_wrap ul li{
	float: left;
	padding-bottom: 15px;
}





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




#footer{
	width:100%;
	height:71px;
	background:url(../images/common/foot_bg.gif) repeat-x;
}

#footer #footerWrap{
	width:1000px;
	height:71px;
	margin:0 auto;
}

#footer #footerWrap{
	width:1000px;
	height:71px;
	margin:0 auto;
	position:relative;
}


#footer #footerWrap address{
	width:620px;
	height:56px;
	margin:0;
	float:left;
	color:#FFFFFF;
	font-size:10px;
	line-height:17px;
	letter-spacing:0px;
	padding:18px 0 0 0;
	font-family:"ＭＳ Ｐゴシック","MS PGothic",verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,Sans-Serif;
}


#footer #footerWrap #footSns{
	width:360px;
	height:56px;
	margin:0;
	float:right;
	padding:15px 0 0 0;
}


#footer #footerWrap #footSns #cero{
	width:28px;
	height:46px;
	float:left;
	padding-right:20px;
	padding-top:2px;
}


#footer #footerWrap #footSns #twOfficial{
	width:197px;
	height:50px;
	float:left;
	padding-right:20px;
}

#footer #footerWrap #footSns #snsBtn{
	width:90px;
	float:right;
	padding-top:1px;
}

#footer #footerWrap #footSns #snsBtn ul{
}

#footer #footerWrap #footSns #snsBtn ul li{
	height:28px;
	/*width:73px;*/
	overflow:hidden;
	margin:0;
	padding:0;
}




/*----------------------------------------------------
	#top
----------------------------------------------------*/









#footerTop{
	width:100%;
	height:71px;
	background:url(../images/common/foot_bg.gif) repeat-x;
}

#footerTop #footerWrap{
	width:1000px;
	height:71px;
	margin:0 auto;
}

#footerTop #footerWrap{
	width:1000px;
	height:71px;
	margin:0 auto;
	position:relative;
}

#footerTop #footerWrap #gold{
	width:307px;
	height:32px;
	position:absolute;
	bottom:0px;
	left:0px;
}

#footerTop #footerWrap address{
	width:620px;
	height:56px;
	margin:0;
	float:left;
	color:#FFFFFF;
	font-size:10px;
	line-height:12px;
	letter-spacing:0px;
	padding:5px 0 0 0;
	font-family:"ＭＳ Ｐゴシック","MS PGothic",verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,Sans-Serif;
}


#footerTop #footerWrap #footSns{
	width:360px;
	height:56px;
	margin:0;
	float:right;
	padding:15px 0 0 0;
}


#footerTop #footerWrap #footSns #cero{
	width:28px;
	height:46px;
	float:left;
	padding-right:20px;
	padding-top:2px;
}


#footerTop #footerWrap #footSns #twOfficial{
	width:197px;
	height:50px;
	float:left;
	padding-right:20px;
}

#footerTop #footerWrap #footSns #snsBtn{
	width:90px;
	float:right;
	padding-top:1px;
}

#footerTop #footerWrap #footSns #snsBtn ul{
}

#footerTop #footerWrap #footSns #snsBtn ul li{
	height:28px;
	/*width:73px;*/
	overflow:hidden;
	margin:0;
	padding:0;
}




























#topMain{
width:100%;
height:552px;
background:url(../images/top/top_main.jpg) no-repeat center;
}



#topMain #mainFlash{
width:1400px;
position:relative;
left:50%;
margin-left:-700px;
height:552px;
}


#topContents{
	width:1024px;
	margin:0 auto 15px auto;
	padding:0 24px 0 0;
}

#topContents #news{
	width:659px;
	height:99px;
	margin:8px 0 0 0;
	padding:0;
	background:url(../images/top/top_news_bg.gif) no-repeat;
	float:left;
	display:block;
	position:relative;
}


#topContents #news ul{
	width:590px;
	height:79px;
	margin:0;
	padding:0;
	position:absolute;
	top:13px;
	left:62px;
	overflow-y: scroll;
	overflow-x:hidden;
}


#topContents #news ul li{
	width:570px;
	margin:0;
	padding:6px 0 6px 0;
	background:url(../images/top/news_dot.gif) bottom repeat-x;
	font-size:10px;
	line-height:14px;
	color:#5a432d;
	letter-spacing:1px;
}

#topContents #news ul li a{
	text-decoration:underline;
	color:#5a432d;
}

#topContents #news ul li a:hover{
	color:#5a432d;
	text-decoration:none;
}

#topContents #news ul li span{
	color:#9f9786;
	letter-spacing:1px;
	padding-right:10px;
	font-family:Arial, Helvetica, sans-serif,"メイリオ","Meiryo","ＭＳ Ｐゴシック","MS PGothic";
	
}





#topContents h1{
	width:355px;
	height:93px;
	margin:14px 0 0 0;
	padding:0;
	float:right;
	background:url(../images/top/top_product.gif) no-repeat;
	text-indent:-9999px;
}









/*----------------------------------------------------
	#contents
----------------------------------------------------*/




#contentsWrap #contents h3{
	font-size:0;
	line-height:0;
	padding:0;
	margin:0 0 30px 0;
}


#contentsWrap #contents h4{
	font-size:0;
	line-height:0;
	padding:0;
	margin:0 0 20px 0;
}














/*----------------------------------------------------
	#comic
----------------------------------------------------*/

.comicBox{	
border:#ddd 1px solid;
margin-bottom:20px;
}

.comicBox .comicL{
	float:left;	
	width:363px;
	padding:24px 0 0 13px;
}

.comicBox .comicL h4{
	padding:0;
	margin:0;
	width:363px;
	height:59px;
}

.comicBox .comicL h5{
	margin:0;
	padding:0;
	line-height:20px;
	font-size:16px;
	font-weight:bold;
}


.comicBox .comicL p{
	padding:10px 0 0 20px;
	margin:0;
	width:363px;
}

.comicBox .comicImg{
	float:right;
}


/*----------------------------------------------------
	#voice
----------------------------------------------------*/



.voice{
	margin-top: 0;
	margin-right: -10px;
	margin-bottom: 0px;
	margin-left: 0;
}


.voice ul{
	height:246px;
	margin: 0 -10px 20px 0;
}

.voice ul li{
	width:165px;
	height:246px;
	float:left;
	margin-right:10px;
	position:relative;
	padding-top:5px;
}

.voice ul embed{
	width:165px;
	height:246px;
}

.voice ul li p{
	background:url(../images/special/new_voice02.gif) no-repeat;
	width:165px;
	height:15px;
	position:absolute;
	top:0px;
	left:0px;
	z-index:2;
}



.voice dl{
	width:165px;
	float:left;
	margin-right:10px;
}

.voice dl dt{
	width:165px;
	height:210px;
	padding-top:5px;
	margin-bottom:5px;
	position:relative;
}

.voice dl dt p{
	background:url(../images/special/new_voice02.gif) no-repeat;
	width:165px;
	height:15px;
	position:absolute;
	top:0px;
	left:0px;
	z-index:2;
}

.voice dl dd{
	width:165px;
	height:31px;
	margin-bottom:20px;
	position:relative;
}


/* -----------------------------------------------------------
	3Dギャラリー
----------------------------------------------------------- */


.gl_list{
	margin-left: 19px;
}


.gl_list li{
	background: url(../images/special/gallery/3d_frame.gif) no-repeat;
	float: left;
	height: 121px;
	width: 192px;
	padding-top: 12px;
	padding-left: 12px;
	margin-right: 18px;
	margin-bottom: 20px;
}


/* -----------------------------------------------------------
	comment
----------------------------------------------------------- */


/*

#comment_s{
	width: 530px;
	margin-right: auto;
	margin-left: auto;
}



#comment_s dl{
	margin-right: 50px;
}





*/





/* -----------------------------------------------------------
	TOP PAGE
----------------------------------------------------------- */





/* -----------------------------------------------------------
	SERVICE
----------------------------------------------------------- */




/* -----------------------------------------------------------
	FAQ
----------------------------------------------------------- */





/* -----------------------------------------------------------
	GALLERY
----------------------------------------------------------- */
















/* -----------------------------------------------------------
	contact
----------------------------------------------------------- */












/* twitter */




.frame1{
	background-image: url(../images/twitter/frame1.gif);
	background-repeat: no-repeat;
	height: 236px;
	width: 653px;
	letter-spacing: 1px;
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 30px;
	line-height: 25px;
	margin-left: 15px;
}


.twi_chara li p .new {
	margin-bottom: 4px;
}
.twi_chara li p .name {
	margin-left: 11px;
}


.twi_content {
	padding: 5px 10px 10px 29px;
}


.twi_chara {
	width: 680px;
	margin-left: 23px;

	margin-top: -33px;
}

.twi_chara li p .image {
	padding-left: 14px;
}
.twi_chara li {
	float: left;
	margin-right: 2px;
	margin-bottom: 9px;
}
#twi_btn {
	margin-left: 80px;
}
#f_sp {
	margin-right: 300px;
}
.senchaku-text {
	width: 670px;
	margin-left: 10px;
}

/* twitter */



/* banner */

.bnr_content{
	width: 690px;
	margin-top: 20px;
}

.bnr_frame{
	background: url(../images/special/frame_bnr.gif) no-repeat;
	height: 172px;
	width: 625px;
	padding-top: 20px;
	padding-left: 23px;
	letter-spacing:1px;
	line-height:23px;
	margin-left: 30px;
	margin-top: 16px;
}

.bnr_frame p{
	padding-bottom: 8px;
}

.bnr_bnr{
	margin-left:59px;
}

.bnr_bnr dl{
	float: left;
	padding-right: 45px;
	padding-bottom: 25px;
}

.bnr_bnr dl dd textarea{
	width:158px;
	font-size: 10px;
	}
	


.bnr_bnr dt{
	padding-bottom: 8px;
}	


/*  bnr_2wrap  */

.bnr_2wrap p{
	padding-bottom: 8px;
}


.bnr_2wrap{
	margin-left:30px;
}

.bnr_2wrap dl{
	float: left;
	padding-right: 20px;
	padding-bottom: 25px;
}

.bnr_2wrap dl dd textarea{
	width:298px;
	font-size: 10px;
	}
	


.bnr_2wrap dt{
	padding-bottom: 8px;
}	



/* banner */


/* 壁紙ダウンロード */


.frame_download{
	
background: url(../images/frame_bnr.gif) no-repeat;
height: 172px;
width: 595x;
padding-top: 19px;
padding-left: 30px;
line-height: 23px;
margin-left: 30px;

}


.img_dl_wrap{
	height: 250px;
	width: 690px;
}

.img_dl_wrap ul li{
	float: left;
	
}

/* 壁紙ダウンロード */



/* web4コマ */

.frame_download2{
	background: url(../images/frame_bnr.gif) no-repeat;
	height: 172px;
	width: 595px;
	padding-top: 25px;
	padding-left: 30px;
	line-height: 25px;
	margin-left: 30px;
	letter-spacing: 1px;
}

.web4_font{
	font-size: 20px;
	font-weight: bold;
	text-align: center;
}


.frame_download3{
	background: url(../images/system/sys_frame2.gif) no-repeat;
	height: 130px;
	width: 649px;
	padding-top: 25px;
	padding-left: 30px;
	line-height: 25px;
	margin-left: 30px;
	letter-spacing: 1px;
}


.frame_coma {
	background-image: url(../images/special/coma/frame_b.gif);
	background-repeat: no-repeat;
	height: 195px;
	width:586px;
	letter-spacing: 1px;
	padding-top: 18px;
	padding-bottom: 15px;
	padding-left: 35px;
	line-height: 28px;
	margin-left: 29px;
}

.frame_coma dt{float: left;
	padding-top: 7px;
}

.frame_coma dd{
	float: left;
	width:440px

}


.coma_ul{
	height: 42px;
	padding-bottom: 5px;
}

.coma_ul2{
	height: 68px;
	
}


.frame_coma2 {
	height: 130px;
	width: 625px;
	letter-spacing: 1px;
	padding-top: 28px;
	padding-bottom: 20px;
	padding-left: 30px;
	line-height: 28px;
	margin-left: 30px;
	background: url(../images/frame_bnr.gif) no-repeat;
		
}

.frame_coma2 dt{float:left;}

.frame_coma2 dd{
	float:left;
	width:440px
	
	}




/* web4コマ */


/* 　応援キャンペーン　 */

.ouen_text{
	font-size: 16px;
	font-weight: bold;
}

.ouen_t{
	
	width:652px;
}

.ouen_t p{
	padding-bottom: 10px;
}

.ou_mad{
	height:198x;
	width:480px;
	margin-right: auto;
	margin-left: auto;
}


.lighter{
	font-weight: lighter;
}


.ouen_div01 {
	width: 700px;
}

.ouen_div01  li{
	float: left;
	
}


/*　応援キャンペーン 　*/





/*　関連商品　*/


.item_table{
	border: 1px solid #CCCCCC;
	width: 632px;
	margin-right: auto;
	margin-left: auto;
	font-size: 11px;
	vertical-align: bottom;
}

.item_table .left_box{
	width: 100px;
	text-align: center;
	line-height: 18px;
	padding: 3px;
	background: #CAF0E3;
}

.item_table .right_box{
	padding: 6px 6px 6px 9px;
	background: #E6E6E6;
	width:530px;
}

.table_i{
	border-collapse: collapse; /* 枠線の表示方法 */
	border: 1px #fff solid;
	
	}
	
.table_i td{
	border-collapse: collapse; /* 枠線の表示方法 */
	border: 3px #fff solid;

}

.item_comic{
	width: 630px;
	margin-bottom: 20px;
}
	
.item_comic dt{
	width: 152px;
	float: left;
	margin-right: 30px;
	margin-left: 60px;
}	
	
.item_comic dd{
	width: 363px;
	float: left;
	margin-top: 70px;
	}

/*　関連商品　*/



/*　イベント情報　*/

.item_table .evt_left_box{
	width: 120px;
	text-align: center;
	line-height: 18px;
	padding: 3px;
	background: #CAF0E3;
}

.item_table .evt_right_box{
	padding: 6px 6px 6px 9px;
	background: #E6E6E6;
	width:510px;
}


/*　イベント情報　*/



/* -----------------------------------------------------------
	system
----------------------------------------------------------- */

#system_frame1 {
	background-image: url(../images/system/sys_frame2.gif);
	background-repeat: no-repeat;
	height: 130px;
	width: 649px;
	margin-left: 17px;
	padding-top: 25px;
	padding-right: 25px;
	padding-bottom: 25px;
	padding-left: 37px;
	line-height: 26px;
	font-weight: bold;
	font-size: 13px;
}

#select_img {
	margin-left: 30px;
	margin-top: -20px;
}
#check_img {
	margin-top:30px;
	margin-left: 220px;
	margin-bottom: 14px;
}
.monster_frame {
	background-image: url(../images/system/sys_frame2.gif);
	height: 110px;
	width: 597px;
	padding-top: 25px;
	padding-right: 27px;
	padding-bottom: 0px;
	padding-left: 30px;
	background-repeat: no-repeat;
	line-height: 27px;
	margin-left: 10px;
	margin-bottom: 20px;
	font-size: 13px;
	font-weight: bold;
}
#monster_img {
	margin-left:4px;
	margin-top: 0px;
}

#sigoto_img {
	margin-left: 6px;
}


/*  adventure  */

.ad_frame {
	height: 110px;
	width: 673px;
	line-height: 27px;
	font-size: 13px;
	font-weight: bold;
	background: url(../images/system/ad_frame.gif) no-repeat;
	padding-top: 30px;
	padding-left: 27px;
}

.magic_content{
	width:650px;
	padding-left: 30px;
	float: left;
	}
	
.magic_content dl{
	float: left;
	width: 304px;
	margin-right: 13px;
	margin-bottom: 12px;
	}
	
.magic_ttl{
	padding-top: 8px;
	padding-bottom: 8px;
}
	
	
.magic_content dd{
	width: 260px;
	font-size: 96%;
	letter-spacing: 1px;
	padding-left: 18px;
	padding-top: 4px;
	}

.ad_bottom{
	width: 680px;
	margin-top: 10px;	
	}
	
.ad_bottom dl{
	float: left;
	padding-right: 23px;	
	
	}		

	
.magic_dt{
	margin-left: -15px;
	margin-bottom:-3px;
}

.magic_mv{
	
}

.magic_mh{
	margin-left: 12px;
	
}

.magic_mr{
	margin-left: 8px;
}




.fam_frame{
	background: url(../images/frame_bnr.gif) no-repeat;
	height: 172px;
	width: 583px;
	padding-top: 25px;
	padding-left: 23px;
	padding-right: 50px;
	line-height: 30px;
	font-size: 13px;
	font-weight: bold;
	margin-left: 30px;
	}
	

.sys_fam_wrap span{
	float: left;
	margin-right: 10px;
}


/*  sehcaku  */

.sen_ul li{
	float: left;
	padding-left: 30px;	
	}
	
	
.ma_ul li{
	float: left;
	padding-left: 65px;	
	
	}	
	
.toku_i{
	height: 255px;
	width: 165px;
	float: left;
	margin-bottom: 15px;
}



/*  system fantasy  */


.fan_content{
	width: 690px;
	
	}
	
.fan_content dl{
	width: 690px;
	margin-bottom: 30px;
	height: 275px;
	background: url(../images/system/fantasy/fan_back.gif) no-repeat;
	padding-left: 20px;
	padding-top: 23px;
	}
	
.fan_content dt{
	float: left;
	width: 210px;
	padding-left: 10px;
	
	font-size: 12px;
	line-height: 20px;
}	
	
.fan_ttl{
	padding-top: 8px;
	padding-bottom: 8px;
}
	
	
.fan_content dd{
	width: 400px;
	font-size: 96%;
	letter-spacing: 1px;
	padding-left: 19px;
	float: left;
	padding-top:6px;	
	}
		

	
.fan_dt{
	
}

.fan_mv{
	
}



/*  system fantasy  */



/*  system セルフィア */

.sel_map ul{
	float: left;	
	
	}
	
	
.sel_map{
	height: 195px;
	width: 790px;
}	
	
	
/*  system セルフィア  */	



/*  まるわかりコミック  */	

.m_com{
	width: 548px;
	margin-right: auto;
	margin-left: auto;
	position:absolute;
	top:492px;
	left:18px;
}

#gallery_m{
	background: url(../images/special/mcomic/m_comic.jpg);
	height: 540px;
	width: 391px;
	margin-right: auto;
	margin-left: auto;
	position:relative;
}


/*  まるわかりコミック  */


div.expired {
	margin-top: 10px;
	padding: 5px 0;
	border-radius: 4px;
	background-color: #ccc;
	color: #fff;
	font-size: 11px;
	line-height: 1;
	text-align: center;
}

#mainFlash .comic {
	position: absolute;
	right: 530px;
	bottom: 13px;
}

#mainFlash .comic img {
	width: 160px;
	filter: brightness(1);
	transition: filter .3s ease;
}

#mainFlash .comic:hover img { filter: brightness(1.2); }

#mainFlash .rf4bc {
	position: absolute;
	right: 204px;
	bottom: -8px;
}

#mainFlash .rf4bc img {
	filter: brightness(1);
	transition: filter .3s ease;
}

#mainFlash .rf4bc:hover img { filter: brightness(1.2); }