@charset "UTF-8";

/* - LAYOUT- 
--------------------------------------------------------------*/
div#container{
width: auto;
background: #000;
}
div#header{
position: static;
width: auto;
height: 65px;
margin: 0 auto;
overflow: visible;
background: #000 url('/ex/ranse/common/images/img_header_s.jpg') no-repeat center top;
}
div#contentWrap{
width: auto;
padding-top: 0;
}
div#contentWrap div.bgSquare{
margin: 0;
padding: 0 0 15px;
background: url('/ex/ranse/common/images/bg_footerbar_sm.png') no-repeat center bottom ;
}
div#contentWrap div.bgSquareInner,
div#contentWrap div.bgSquareInner02{
margin: 0;
padding: 0;
background: none !important;
}

div#contentsArea{
width: auto;
margin: 0;
padding: 0;
background: none;
}
div#contentsArea div.inner,
div#contentsArea div.inner02{
width: auto;
margin: 0;
padding: 0;
background: none !important;
}

div#contentWrap div#mainArea{
width: auto;
float: none;
margin: 0 auto 20px !important;
padding: 0;
color: #DDD;
background: #000;
}
div#contentWrap div#mainArea div#content{
width: auto;
padding: 20px 0 0;
background: url('/ex/ranse/character/images/bg_cont_smt.png') repeat left top;
color: #333;
}

div.footer{
width: auto;
margin: 0 auto;
padding: 0 10px;
background: none;
}
div#contentWrap div#mainArea div#content div.section{
margin: 0 10px 10px;
}

/* 2 Column */
#outline #contentsArea #mainArea{
float: none;
margin-right: 0;
display: inline;
}
#outline #contentsArea #side{
float: none;
width: auto;
margin-right: 0;
padding-top: 0;
display: inline;
}

/* home */
#home div#contentWrap{
min-width: 320px;
padding-top: 0;
background: none;
}
#home div#contentWrap div#billboard{
position: static;
width: auto;
height: auto;
overflow: auto;
background: none;
}
#home div#content{
background: none;
}
#home div#content div#feature{
width: auto;
margin: 0 auto;
padding-top: 0;
}
div.floatings{
display: none;
}

/* -HOME HEADER- 
--------------------------------------------------------------*/
#home #header h1,
#header p#logo{
width: 113px;
height: 59px;
float: none;
padding: 1px 0 0 10px;
}
#home #header h1 a.haribotekit,
#header p#logo a.haribotekit{
width: 113px;
height: 59px;
}
#home #header h1 a.haribotekit span.panel,
#header p#logo a.haribotekit span.panel{
background: url('/ex/ranse/common/images/logo_s.png') no-repeat left top;
}
#header p.release{
display: none;
position: static;
top: 68px;
left: 200px;
}
#header div#sound{
display: none;
position: static;
top: 77px;
left: 860px;
}

/* Btn Menu Blk */
#header p.btnMenuBlk{
position: absolute;
top:7px;
right: 10px;
width: 80px;
height: 32px;
}
#header p.btnMenuBlk a{
display: block;
height: 25px;
padding: 7px 0 0 21px;
border: 1px solid #222;
color: #FFF;
font-size: 12px;
text-decoration: none;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.3), 0px 1px 1px rgba(0, 0, 0, 0.2);
-moz-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.3), 0px 1px 1px rgba(0, 0, 0, 0.2);
-webkit-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.3), 0px 1px 1px rgba(0, 0, 0, 0.2);
background: #bb4b4a url(/ex/ranse/common/images/icn_arw_s.png) no-repeat 7px -38px;
background: url(/ex/ranse/common/images/icn_arw_s.png) no-repeat 7px -88px, -moz-linear-gradient(top,  #bb4b4a 0%, #a50002 100%);
background: url(/ex/ranse/common/images/icn_arw_s.png) no-repeat 7px -88px, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#bb4b4a), color-stop(100%,#a50002));
background: url(/ex/ranse/common/images/icn_arw_s.png) no-repeat 7px -88px, -webkit-linear-gradient(top,  #bb4b4a 0%,#a50002 100%);
background: url(/ex/ranse/common/images/icn_arw_s.png) no-repeat 7px -88px, -o-linear-gradient(top,  #bb4b4a 0%,#a50002 100%);
background: url(/ex/ranse/common/images/icn_arw_s.png) no-repeat 7px -88px, -ms-linear-gradient(top,  #bb4b4a 0%,#a50002 100%);
background: url(/ex/ranse/common/images/icn_arw_s.png) no-repeat 7px -88px, linear-gradient(top,  #bb4b4a 0%,#a50002 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bb4b4a', endColorstr='#a50002',GradientType=0 );
}
/*  BB4B4A   #A50002  */

/* gnav for tease */
#header ul#gnav{
display: none;
}
/* Tease Nav in Directory */
ul#teaseNav{
display: none;
}

#header p.gotoProduct{
display: none;
}


/* - HOME billboard - 
--------------------------------------------------------------*/
/*
billboard
*/
div#contentWrap div#billboard div#kv{
position: static;
width: auto;
height: 322px;
overflow: hidden;
margin: 0 auto;
background: url('/ex/ranse/images/img_kv_s.jpg') no-repeat center top;
}
div#contentWrap div#billboard div#kv div.kvBase{
display: none;
position: static;
top:  0;
left: 0;
width: auto;
height: auto;
}
div#contentWrap div#billboard div#kv ul{
display: none;
}
/* Arrow */
div#contentWrap div#billboard p.itemArrowL,
div#contentWrap div#billboard p.itemArrowR{
display: none;
position: static;
top: 130px;
width: 68px;
height: 161px;
z-index: 500;
}

/* 各武将詳細  Home & Character */
#character div.bushoDetail{
text-align: center;
}
#character div.bushoDetail h2.haribotekit{
width: 300px; height: 195px;	
}
#character div#hero h2.haribotekit span.panel{
background: url('/ex/ranse/character/images/img_busho_detail_smt_01.jpg') no-repeat center top;
}
#character div#heroine h2.haribotekit span.panel{
background: url('/ex/ranse/character/images/img_busho_detail_smt_02.jpg') no-repeat center top;	
}
#character div#nobunaga h2.haribotekit span.panel{
background: url('/ex/ranse/character/images/img_busho_detail_smt_03.jpg') no-repeat center top;	
}
#character div#oichi h2.haribotekit span.panel{
background: url('/ex/ranse/character/images/img_busho_detail_smt_04.jpg') no-repeat center top;	
}
#character div#mitsuhide h2.haribotekit span.panel{
background: url('/ex/ranse/character/images/img_busho_detail_smt_05.jpg') no-repeat center top;	
}
#character div#shingen h2.haribotekit span.panel{
background: url('/ex/ranse/character/images/img_busho_detail_smt_06.jpg') no-repeat center top;	
}
#character div#kenshin h2.haribotekit span.panel{
background: url('/ex/ranse/character/images/img_busho_detail_smt_07.jpg') no-repeat center top;	
}

/* close btn */
div.kvBase ul li span.close{
display: none;
position: static;
left: 637px;
bottom: 15px;
width: 78px;
height: 34px;
background: url('/ex/ranse/images/btn_busho_close.png') no-repeat left top;
cursor: pointer;
z-index: 100;
}
div.kvBase ul li.nobunaga span.close,
div.kvBase ul li.shingen span.close{
left: 691px;
}
div.kvBase ul li span.close:hover{
background-position: 0 -50px;
}
div.kvBase ul li .curr span.close{
display: block;
}

/*
Modal Panel
*/
#billboard #modalBase{
position: static;
left: 0;
top: 0;
width: 100%;
height: 469px;
display:none;
z-index:900;
background:#000;
filter:alpha(opacity=90) !important;
-moz-opacity:0.9;
-khtml-opacity:0.9;
opacity:0.9;
}
#billboard #modalCont{
display: none;
position: static;
width: 810px;
height: 440px;
top: 20px;
z-index:1000;
}
#billboard #modalCont #closeBtn{
position: static;
right: 5px;
top: 0;
width: 47px;
height: 47px;
cursor: pointer;
}
#billboard #modalCont #include{
position: static;
right: 25px;
top: 10px;
width: 736px;
height: 390px;
padding: 10px;
border: 1px solid #333;
}
/* content */
#billboard #modalCont #include .imgHalfLaterL div.img{
width: 390px;
float: left;
}
#billboard #modalCont #include .imgHalfLaterL div.text{
width: 310px;
float: right;
}
/* product */
#billboard #modalCont #include .imgHalfLaterL div.text h2{
margin-bottom: 30px;
padding-top: 30px;
font-size: 123%;
}
#billboard #modalCont #include .imgHalfLaterL div.text dl{
margin-bottom: 30px;
}
#billboard #modalCont #include .imgHalfLaterL div.text dl dt{
float: left;
clear: both;
width: 80px;
height: 24px;
padding-top: 6px;
}
#billboard #modalCont #include .imgHalfLaterL div.text dl dd{
padding-left: 80px;
height: 24px;
padding-top: 6px;
border-bottom: 1px solid #999;
}
/* movie */
#billboard #modalCont #include .movWrap{
padding-top: 20px;
text-align: center;
}
/* 一覧ボタン */
div#contentWrap div#billboard p#btnShowList{
display: none;
position: static;
}


/*
Info Block */
#home div.infoblock{
width: auto !important;
margin: 0 auto;
padding-top: 0;
}
#home div.infoblock div.newsBar{
float: none;
width: auto;
height: 51px;
padding: 5px 10px;
background: url('/ex/ranse/common/images/img_bar-s02.png') repeat-x left top;
font-size: 85%;
overflow: hidden;
display: block;
}
#home div.infoblock div.shareBtn{
float: right;
width: auto !important;
min-height: 30px;
margin-left: 0;
display: block;
padding: 2px 5px 0;
}
#home div.infoblock div.shareBtn .btns{
text-align:left;
}
#home div.infoblock div.shareBtn .btns li{
display:inline-block;
/display:inline;
padding-bottom: 3px;
vertical-align:middle;
}

/* - COMMON - 
--------------------------------------------------------------*/
/* PAGE TITLE */
#mainArea h1.h1.haribotekit{
display: block;
width: auto !important;
height: 34px;
margin: 0;
padding: 10px 0 0 10px;
color: #FFF;
background: url('/ex/ranse/common/images/img_bar-s02.png') repeat-x left top;
font-size: 18px;
box-shadow: 0px 2px 1px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0px 2px 1px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0px 2px 1px rgba(0, 0, 0, 0.5);
letter-spacing: -0.05em;
}
#mainArea h1.h1.haribotekit span.panel{
display: none;
}
#mainArea h2.h2, #mainArea p.h2,
#mainArea h3.h3, #mainArea p.h3 {
width: auto;
margin-left: 10px;
margin-right: 10px;
}

/* share button in header */
#mainArea .shareBtn{
width: auto;
margin: 0;
padding: 10px 0;
background: #5e5e5e;
background: -moz-linear-gradient(top,  #5e5e5e 0%, #333333 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5e5e5e), color-stop(100%,#333333));
background: -webkit-linear-gradient(top,  #5e5e5e 0%,#333333 100%);
background: -o-linear-gradient(top,  #5e5e5e 0%,#333333 100%);
background: -ms-linear-gradient(top,  #5e5e5e 0%,#333333 100%);
background: linear-gradient(top,  #5e5e5e 0%,#333333 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5e5e5e', endColorstr='#333333',GradientType=0 );

}
/* .shareBtn .btns{
text-align:right;
}
.shareBtn .btns li{
display:inline-block;
vertical-align:middle;
}*/

/* breadcrumb */
div#contentWrap div.breadcrumb{
display: none;
}

/* pageUpBtm */
div#contentWrap p#pageUpBtm{
width: auto;
margin: 0 10px 20px;
padding: 0;
text-align: right;
}
div#contentWrap p#pageUpBtm a{
/*display: block;*/
color: #DDD;
margin: 0;
padding-left: 18px;
color: #FFF;
background: url(/ex/ranse/common/images/icn_arw_pageup.png) no-repeat 0 50%;
text-decoration: none;
}
div#contentWrap p#pageUpBtm a:hover{
color: #BBB;
text-decoration: none;
}


/* - HOME CONTENT - 
--------------------------------------------------------------*/
#home div#feature div.newsUnit{
width: auto;
margin: 15px 10px 0;
}
#home div#feature div.newsUnit h4{
float: none;
width: auto;
margin-bottom: 5px;
padding-bottom: 5px;
border-bottom: 1px dotted #CCC;
}
#home div#feature div.newsUnit div.newsList{
float: none;
padding-left: 0;
border-left: none;
display: inline;
}
#home div#feature div.newsUnit div.newsList dl{
margin-bottom: 3px;
}
#home div#feature div.newsUnit div.newsList dl dt{
clear: both;
float: none;
width: auto;
margin-bottom: 4px;
/* font-weight: bold; */
display: inline;
}
#home div#feature div.newsUnit div.newsList dl dd{
width: auto;
margin: 0 0 5px 0;
}
#home div#feature p.btnMovie{
display: none;
}

/* - FOOTER - 
--------------------------------------------------------------*/
div.footer div.cr{
float: none;
width: auto;
padding-top: 70px;
margin-bottom: 15px;
color: #AAA;
font-size: 85%;
display: block;
background: url('/ex/ranse/common/images/img_ftr_s01.png') no-repeat center top;
}
div.footer div.sentence{
display: none;
float: none;
width: auto;
padding-top: 0;
}
div.footer div.company{
float: none;
width: auto;
padding-top: 0;
display: block;
}
div.footer div.company ul li{
float: none;
text-align: center;
margin-bottom: 8px;
}
div.footer div.inquiry_footer.haribotekit{
color: #AAA;
font-size: 85%;
width:auto;
height:auto;
}
div.footer div.inquiry_footer.haribotekit span.panel{
background:none;
}

div.footer div.inquiry_footer p{
margin-bottom:10px;
}
div.footer div.inquiry_footer .tit_inquiry_footer{
color:#d6ba32;
}


/* Smart List 
--------------------------------------------------------------*/
div#smartList{
clear: both;
padding: 10px 0;
}
div#smartList ul{
width: auto;
color: #111;
}
div#smartList ul li{
width: auto;
float: none;
margin: 0 10px 5px;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
box-shadow: inset 0px 1px 1px #FFF, 0px 1px 1px rgba(0, 0, 0, 0.2);
-moz-box-shadow: inset 0px 1px 1px #FFF, 0px 1px 1px rgba(0, 0, 0, 0.2);
-webkit-box-shadow: inset 0px 1px 1px #FFF, 0px 1px 1px rgba(0, 0, 0, 0.2);
background: #EEE url(/ex/ranse/common/images/icn_arw_s.png) no-repeat 7px -38px;
background: url(/ex/ranse/common/images/icn_arw_s.png) no-repeat 97% 16px, -moz-linear-gradient(top, #ffffff 0%, #b5b5b5 100%);
background: url(/ex/ranse/common/images/icn_arw_s.png) no-repeat 97% 16px, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#b5b5b5));
background: url(/ex/ranse/common/images/icn_arw_s.png) no-repeat 7px -38px, -o-linear-gradient(top, #ffffff 0%,#b5b5b5 100%);
background: url(/ex/ranse/common/images/icn_arw_s.png) no-repeat 7px -38px, -ms-linear-gradient(top, #ffffff 0%,#b5b5b5 100%);
background: url(/ex/ranse/common/images/icn_arw_s.png) no-repeat 7px -38px, linear-gradient(top, #ffffff 0%,#b5b5b5 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#b5b5b5',GradientType=0 );
}
div#smartList ul li a{
display: block;
width: auto;
height: 32px !important;
padding: 12px 0 0 12px;
color: #111;
background: url(/ex/ranse/common/images/sl_icn_arrow.gif) no-repeat 95% 50%;
text-decoration: none;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
text-shadow: 0 1px 0px rgba(255,255,255, 0.6);
}
/* current */
/*
#home div#smartList ul li#sl01{
box-shadow: inset 0px 1px 1px #FFF, 0px 1px 1px rgba(0, 0, 0, 0.2);
-moz-box-shadow: inset 0px 1px 1px #FFF, 0px 1px 1px rgba(0, 0, 0, 0.2);
-webkit-box-shadow: inset 0px 1px 1px #FFF, 0px 1px 1px rgba(0, 0, 0, 0.2);
}
*/

#home div#smartList ul li#sl01 a,
#outline div#smartList ul li#sl02 a,
#story div#smartList ul li#sl03 a,
#character div#smartList ul li#sl04 a,
#movie div#smartList ul li#sl05 a,
#episode div#smartList ul li#sl06 a,
#news div#smartList ul li#sl07 a,
#product div#smartList ul li#sl08 a{
/* height: 26px !important; */
/* padding: 8px 0 0 12px; */
/* border: 4px solid #FFF; */
color: #A10004;
font-weight: bold;
/* border-radius: 4px; */
/* -webkit-border-radius: 4px; */
/* -moz-border-radius: 4px; */
}


/* Product 
--------------------------------------------------------------*/
#product dl.productDetail{
margin: 0 10px;
}
#product dl.productDetail dd{
margin-bottom: 1em;
}


/* - OUTLINE - 
--------------------------------------------------------------*/
/* catch up box */
#mainArea div.catchUp{
margin-bottom: 20px;
border: 3px solid #CCC;
background: none;
background-color: rgba(255,255,255, 0.8);
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
}
#mainArea div.catchUp div.btm{
padding: 10px;
background: none;
}
#mainArea div.catchUp .twoColumn{
width:auto;
margin-bottom:1em;
}
#mainArea div.catchUp .twoColumn div.left{
width:auto;
float:left;
}
#mainArea div.catchUp .twoColumn div.right{
width: auto;
float:right;
}
/* h1 adjust */
.bastlink #mainArea h1.h1{
font-size: 14px;
letter-spacing: -0.1em;
}
.pass #mainArea h1.h1{
font-size: 14px;
letter-spacing: -0.1em;
}
.uketori #mainArea h1.h1{
font-size: 14px;
letter-spacing: -0.1em;
}

/* lnav */
#outline #side ul#lnav{
width: auto;
height: auto;
margin: 0 10px 10px;
background:  none;
}
#outline #side ul#lnav li{
width: auto;
height: auto;
float: none;
margin: 0;
display: block;
}
#outline #side ul#lnav li a{
display: block;
height: auto !important;
padding: 12px 20px 12px 10px;
border: none !important;
border-bottom: 1px solid #333 !important;
color: #333;
background: #FFF url(/ex/ranse/common/images/icn_arw_s.png) no-repeat 97% 17px;
text-decoration: none;
}
#outline #side ul#lnav li a:hover,
#outline.index #side ul#lnav li#ln01 a,
#outline.ikusa #side ul#lnav li#ln02 a,
#outline.tsushin #side ul#lnav li#ln03 a{
color: #666;
background: #DDD url(/ex/ranse/common/images/icn_arw_s.png) no-repeat 97% 17px;
}
#outline #side ul#lnav li:first-child a{
border-top-left-radius: 4px;
-webkit-top-left-border-radius: 4px;
-moz-border-top-left-radius: 4px;
border-top-right-radius: 4px;
-webkit-border-top-right-radius: 4px;
-moz-border-top-right-radius: 4px;
}
#outline #side ul#lnav li:last-child a{
border-bottom: none !important;
border-bottom-left-radius: 4px;
-webkit-bottom-left-border-radius: 4px;
-moz-border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
-webkit-border-bottom-right-radius: 4px;
-moz-border-bottom-right-radius: 4px;
}

/*
#outline #side ul#lnav li#ln01 a.haribotekit span.panel,
#outline #side ul#lnav li#ln02 a.haribotekit span.panel,
#outline #side ul#lnav li#ln03 a.haribotekit span.panel{
display: none !important;
}
*/
#outline #side ul#lnav li a.haribotekit span.panel{
display: none !important;
}

/* Table.dlTbl Re:Style   */
#outline table.dlTbl{
border: none;
background: none;
}
#outline table.dlTbl tr{
margin-bottom: 3px;
}
#outline table.dlTbl th{
margin-top: 15px;
padding: 0.5em;
border: none;
border-top: 1px solid rgba(0,0,0, 0.3);
border-bottom: 1px solid rgba(0,0,0, 0.3);
background: #DDD;
background: rgba(255, 255, 255, 0.5);
}
#outline table.dlTbl tr:first-child th{
margin-top: 0;
}
#outline table.dlTbl th.subTh{
margin: 0;
padding: 0.5em 0;
border: none;
/* border-bottom: 1px dotted #AAA; */
background: none;
font-weight: bold;
}
#outline table.dlTbl td{
margin: 0;
padding: 0.5em;
border: 1px solid rgba(0,0,0, 0.3);
border-radius: 4px;
-webkit-border-radius: 4px;
-ms-border-radius: 4px;
}

#outline table.dlTbl p{
margin: 0;
padding: 0;
}


/* fnav */
#outline #content div.fnav{
margin: 0 10px 20px;
padding-bottom: 20px;
}
#outline #content div.fnav li{
margin: 0 0 5px;
}
#outline #content div.fnav ul li.prev{
width: auto;
float: none;
}
#outline #content div.fnav ul li.prev a{
padding: 1px 0 3px 22;
background: url(/ex/ranse/common/images/icn_arw_l.png) no-repeat 0 0;
}
#outline #content div.fnav ul li.next{
width: auto;
float: none;
text-align: left;
}
#outline #content div.fnav ul li.next a{
padding: 1px 0 3px 22px;
background: url(/ex/ranse/common/images/icn_arw_r.png) no-repeat 0 0;
}

/* - MOVIE - 
--------------------------------------------------------------*/
#movie  #content div.movThum{
display: none;
}

/* - BANNER - 
--------------------------------------------------------------*/
div#content div#banner{
width: auto;
margin:10px auto;
padding:0px;
}
div#content div#banner .banner_wrap{
margin: 0 auto;
text-align:center;
}
div#content div#banner .banner_wrap p,
div#content div#banner .banner_wrap p.b2w2{
float:none;
padding-bottom:10px;
padding-left:0px;
}