@charset "UTF-8";

/* Readjust
--------------------------------------------------------------*/
/* imgHalfLaterR */
#mainArea div.imgHalfLaterR div.img{
width: 300px;
margin: 0 auto;
}

/*
 2column 260px
*/
#mainArea div.capUnit260{
margin: 0 0 20px;
}
#mainArea div.capUnit260 ul li{
float: none;
width: 200px;
margin: 0 auto 10px;
}


/* w210 3pane */
#mainArea div.w210ThumbList ul li{
display: block;
width: auto;
float: none;
margin: 0 auto;
text-align: center;
}

/* w210 2pane */
#mainArea div.w210ThumbList.glid02{
width: auto;
margin: 0 auto;
}
#mainArea div.w210ThumbList.glid02 ul li{
width: auto;
float: none;
margin: 0 0 10px 0;
}
#mainArea div.w210ThumbList.glid02 ul li.last{
margin: 0 0 10px 0;
}
#mainArea div.w210ThumbList.glid02 ul li:last-child{
margin: 0 0 10px 0;
}


/* w210 3pane キャプション貫通*/
#mainArea div.w210ThumbList ul li.wSize{
width: auto;
}
#mainArea div.w210ThumbList ul li.wSize li{
margin-bottom:10px;
}

/* 2カラム貫通時のキャプション(マージン調整) */
.longCap { position: static; }


/* LAYOUT
--------------------------------------------------------------*/
html{
background: #333;
overflow: auto;
}
body{
background: #333 url(/ex/xy/common/images/bg_body_sml.jpg) repeat-y 50% 0;
background-size: 100% auto;
overflow: auto;
-webkit-text-size-adjust: 100%;
}
#container{
width: 100%;
margin: 0 auto;
padding: 0;
}
#header{
position: static;
width: auto;
height: auto;
text-align: left;
margin: 0 auto 10px;
padding: 14px 10px 0;
background: none;
}
#contentWrap{
width: auto;
margin: 0 auto;
padding: 0 0 30px;
}

/* Secondly Content */
#contentWrap.secondlyCont #mainArea{
width: auto;
margin: 0;
padding: 15px 10px 0;
background: none;
}

/* Lowest Content */
#contentWrap.lowestCont #mainArea{
float: none;
width: auto;
margin: 0;
padding: 15px 10px 0;
background-image: none;
box-shadow: none;
}

#contentWrap.lowestCont #side{
float: none;
width: auto;
padding: 30px 0 0;
background-image: none;
box-shadow: none;
}

#contentWrap.lowestCont #mainArea #content{
width: auto;
}

div#footerWrap{
position: static;
width: 100%;
height: auto;
margin: 0;
padding: 0px;
color: #FFF;
background-image: none;
font-size: 11px;
}
div#footer{
position: static;
width: auto;
height: auto;
margin: 0 auto;
padding: 10px;
}






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

/* - Global - */

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

/* H E A D E R - - - -
--------------------------------------------------------------*/
#header #headerInner{
width: auto;
height: auto;
margin: 0 auto 10px;
}
#header #siteTtl{
float: none;
padding: 5px 0 0;
width: auto;
}
#header #siteTtl a img{
width: 148px;
}
/* gNav */
#header #gNav{
display: none;
}

/* Btn Menu Blk */
#header p.btnMenuBlk{
position: absolute;
top: 16px;
right: 10px;
width: 87px;
height: auto;
}
#header p.btnMenuBlk a{
display: block;
width: 60px;/* 87 */
height: 24px;/* 34 */
padding: 8px 0 0 25px;
border: 1px solid #C3C3C3;
color: #666;
background: url(/ex/xy/common/images/icn_sml.png) no-repeat 9px 9px;
background-size: 20px auto;
text-decoration: none;
font-size: 12px;

border-radius: 4px;
-webkit-border-radius: 4px;
-ms-border-radius: 4px;
}

/*
Orverlay Menu #olMenu
*/
#header div#olMenu{
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
margin: 0;
padding: 0 0 10px;
background: rgba(255, 255, 255, 0.8);
z-index: 2000;
}
/* close btn ***** */
#header div#olMenu .clsMenu{
position: absolute;
top:18px;
right: 10px;
width: 87px;
}
#header div#olMenu .clsMenu a{
display: block;
width: 57px;/* 87 */
height: 28px;/* 38 */
padding: 10px 0 0 30px;
color: #FFF;
background: #848484 url(/ex/xy/common/images/icn_sml.png) no-repeat 14px -38px;
background-size: 20px auto;
text-decoration: none;
font-size: 12px;

border-top-left-radius: 4px;
-webkit-border-top-left-radius: 4px;
-ms-border-top-left-radius: 4px;
border-top-right-radius: 4px;
-webkit-border-top-right-radius: 4px;
-ms-border-top-right-radius: 4px;
}

/* List ***** */
#header div#olMenu #listBlk{
position: relative;
height: 405px;
margin: 55px 10px 0;
/* border-top: 1px solid #b0b0b0; */
background: #FFF;
overflow: hidden;

box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3);
}
#header div#olMenu #listBlk .listView{
position: absolute;
width: 100%;
height: 100%;
background: #FFF;
-webkit-transition: margin .3s ease-out;
}
#header div#olMenu #listBlk #listViewSecond.listView,
#header div#olMenu #listBlk #listViewThird.listView{
margin-left: 100%;
background: #FFF;
}


#header div#olMenu #listBlk ul li{
border-top: 1px solid #b0b0b0;
}
#header div#olMenu #listBlk ul li:last-child{
border-bottom: 1px solid #b0b0b0;
}
#header div#olMenu #listBlk ul li a{
display: block;
padding: 11px 0 12px 12px;
color: #333;
background: url(/ex/xy/common/images/icn_sml.png) no-repeat 100% -85px;
background-size: 20px auto;
font-size: 14px;
text-decoration: none;
}
/* backlist */
#header div#olMenu #listBlk p.backList{
padding: 3px 5px;
}
#header div#olMenu #listBlk p.backList a{
display: block;
width: 45px;
border: 1px solid #CCC;
border-radius: 4px;
padding: 5px 5px 5px 35px;
margin: 5px 10px;
color: #555;
background: url(/ex/xy/common/images/icn_sml.png) no-repeat 8px -193px;
background-size: 20px auto;
text-decoration: none;
font-size: 13px;
}
/* top */
#header div#olMenu #listBlk ul li.top{
background: #666;
}
#header div#olMenu #listBlk ul li.top a{
color: #FFF;
}




/* C O N T E N T
--------------------------------------------------------------*/
img{
height: auto !important;
}

/*
* P A G E I N F O  #pageInfo
*/
#pageInfo{
position: static;
width: auto;
height: auto;
margin: 0 10px;
}
/* breadcrumb */
#pageInfo .breadcrumb{
display: none
}
/* shareBtn */
#pageInfo div.shareBtn{
float: none;
width: auto;
margin: 0 0 0;
}
#pageInfo div.shareBtn .btns{
text-align: left;
}
#pageInfo div.shareBtn .btns ul{
position: static;
padding: 0;
}
#pageInfo div.shareBtn .btns ul li{
float: left;
width: 120px;
height: 22px;
margin: 0 0 4px;
overflow: hidden;
}



/*
* M A I N
*/
/* Page Title */
/* h1 */
#mainArea h1{
font-size: 19px;
line-height: 1.3;
}
#contentWrap.secondlyCont #mainArea h1,
#contentWrap.lowestCont #mainArea h1{
width: auto;
height: auto;
margin: 0 0 12px;
padding: 0 0 0 10px;
border-left: 5px solid #28dcbe;
text-indent: 0;
background-image: none;

text-shadow: 0px 1px 3px rgba(255, 255, 255, 0.4);
-moz-text-shadow: 0px 1px 3px rgba(255, 255, 255, 0.4);
-webkit-text-shadow: 0px 1px 3px rgba(255, 255, 255, 0.4);
}

/* h2 */
#contentWrap.lowestCont #mainArea h2{
width: auto;
height: auto;
margin: 0 0 12px;
padding: 0 0 0 10px;
border-left: 5px solid #28dcbe;
text-indent: 0;
font-size: 17px;
background-image: none !important;
text-shadow: 0px 1px 3px rgba(255, 255, 255, 0.4);
-moz-text-shadow: 0px 1px 3px rgba(255, 255, 255, 0.4);
-webkit-text-shadow: 0px 1px 3px rgba(255, 255, 255, 0.4);
}
/* h3 */
#contentWrap.lowestCont #mainArea h3{
margin: 0 0 12px !important;
}
/* h4 */
#contentWrap.lowestCont #mainArea h4{
margin: 0 0 12px;
}


/* breadcrumb */
#mainArea #content .breadcrumb{
display: none;
width: auto;
}


/* ------------------
Secondly Content MAIN
#contentWrap.secondlyCont #mainArea
-------------------- */
#contentWrap.secondlyCont #mainArea ul.selectPanel{
margin: 0 0 50px -6px;
}
#contentWrap.secondlyCont #mainArea ul.selectPanel.glid02{
width: auto;
margin: 0 0 50px;
}
#contentWrap.secondlyCont #mainArea ul.selectPanel li{
float: none;
width: 312px;
height: 86px;
margin: 0 auto;
}
#contentWrap.secondlyCont #mainArea ul.selectPanel li a{
width: auto;
height: 86px;
}
#contentWrap.secondlyCont #mainArea ul.selectPanel li a:hover{
background-position: 0 inherit !important;
}


/* toTop */
#contentWrap p.toTop{
text-align: center;
margin-bottom: 20px;
padding: 25px 0 0;
font-size: 12px;
}
#contentWrap p.toTop a{
color: #333;
text-decoration: none;
}

/* shareBtn */
#contentWrap .contBtm div.shareBtn{
float: none;
width: auto;;
margin: 10px 0 40px 10px;
}
#contentWrap .contBtm div.shareBtn .btns{
text-align: left;
}
#contentWrap .contBtm div.shareBtn .btns ul{
padding: 10px 0 0;
}
#contentWrap .contBtm div.shareBtn .btns ul li{
float: left;
width: 120px;
height: 22px;
overflow: hidden;
}


/* btn_official_movie */
.btn_official_movie a,
.btn_detail a,
.btn_detail2 a{
width: 211px;
height: 34px;

color: #333;


font-size: 13px;
text-indent: 0;
text-decoration: none;
border-radius: 4px;
}
.btn_detail a span,
.btn_detail a img,
.btn_detail2 a span,
.btn_detail2 a img{ display:none; }

.btn_official_movie span{
padding-right: 12px;
}
	/* hover */
	.btn_official_movie a:hover{
	background-position: 0 -85px;
	}
.btn_detail a:hover,
.btn_detail2 a:hover { background-position: 0 0; }

/* Mov Area */
#content .smlMovBox{
width: 300px;
margin: 0 auto 15px;
}

/* threeColumn キャプション */
#content .threeColumn p.p_note{
clear: both;
margin: 0 0 10px;
}

#content div.nColumnCenter * { margin-left:0!important; margin-right:0!important; }


/*
* side
*/
#side {
display: none;
}

#content div.nColumnCenter ul {	margin:0 ;}




/* stepArrowMini */
.stepArrowMini { margin:0 auto 10px; overflow:hidden; }
.stepArrowMini ul { margin-right:0; text-align:center; margin-bottom:0; }
.stepArrowMini li {
	display:block; float:none; margin:0;}
.stepArrowMini li.arrow {
	margin-bottom:3px; padding:0 0 20px 0; background: url(/ex/xy/common/images/miniArrowV.png) no-repeat bottom center; }
.stepArrowMini li.arrow.posLeft {
	margin-bottom:3px; padding:20px 0 0 0; background: url(/ex/xy/common/images/miniArrowV.png) no-repeat top center; }
.stepArrowMini { width:auto !important;}
.stepArrowMini.addPadLeft { padding-left:0; }



/* frame */
#mainArea div.frame {
	padding:20px;
	border:1px solid #efefef;
	background:#fff;
}
#mainArea div.frame > .padding { padding:0!important; }



/* F O O T E R - - - -
--------------------------------------------------------------*/
/* fNav */
#footer ul#fNav{
display: none;
}

/* Footer Info */
#footer ul.footerInfo{
margin: 0 0 10px;
padding: 0;
line-height: 1.4;
}
#footer ul.footerInfo li{
text-indent: 0;
height: auto;
background: none;
}


/* Related Link  - relatedLink01 */
#footer ul.relatedLink01{
float: none;
margin: 0;
padding: 0;
}
#footer ul.relatedLink01 li{
float: left;
}
#footer ul.relatedLink01 li.rl01-01{
width: 99px;
margin: 0 4px 0 0;
}
#footer ul.relatedLink01 li.rl01-02{
width: 46px;
margin: 0 3px 0 0;
}
#footer ul.relatedLink01 li.rl01-03{
width: 65px;
margin: 0 5px 0 0;
}

/* Related Link  - relatedLink02 */
#footer ul.relatedLink02{
position: static;
margin: 0 0 10px;
}
#footer ul.relatedLink02 li{
float: none;
height: auto;
background: url(/ex/xy/common/images/icn_sml.png) no-repeat 100% -85px;
background-size: 20px auto;
}
#footer ul.relatedLink02 li a{
display: block;
/* height: 16px; */
padding: 11px 0 14px 10px;
color: #FFF;
border: 1px solid #222;
border-bottom: none;
font-size: 12px;
text-indent: 0;
text-decoration: none;
}
#footer ul.relatedLink02 li a span{
padding-right: 25px;
background: url(/ex/xy/common/images/icn_sml.png) no-repeat 100% -147px;
background-size: 20px auto;
}
#footer ul.relatedLink02 li.rl02-01{
width: auto;
margin: 0;
}
#footer ul.relatedLink02 li.rl02-01 a{
background-image:none;
border-top-left-radius: 8px;
-webkit-border-top-left-radius: 8px;
-ms-border-top-left-radius: 8px;
border-top-right-radius: 8px;
-webkit-border-top-right-radius: 8px;
-ms-border-top-right-radius: 8px;
}
#footer ul.relatedLink02 li.rl02-02{
width: auto;
margin: 0;
}
#footer ul.relatedLink02 li.rl02-02 a{
background-image:none;
/* background: url(/ex/xy/common/images/related_06.png) no-repeat 0 0; */
}
#footer ul.relatedLink02 li.rl02-03{
width: auto;
}
#footer ul.relatedLink02 li.rl02-03 a{
border: 1px solid #222;
background-image:none;

border-bottom-left-radius: 8px;
-webkit-border-bottom-left-radius: 8px;
-ms-border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
-webkit-border-bottom-right-radius: 8px;
-ms-border-bottom-right-radius: 8px;
/* background: url(/ex/xy/common/images/related_07.png) no-repeat 0 0; */
}

/* nColumnCenter */
#content div.nColumnCenter ul.marginS li { margin:5px 10px 5px 0px; }
#content div.nColumnCenter ul li div.nColumnCenter,
#content div.nColumnCenter ul li div.nColumnCenter ul { display:block; }

#content div.nColumnCenter ul li.stepArrow {
display:block; margin:0 0 10px 0; padding:0 0 40px 0; float:none;
background:url(/ex/xy/common/images/stepArrowV.png) center bottom no-repeat;
}
#content div.nColumnCenter ul li.stepArrow+li { display:block; width:100%; text-align:center; margin:0; }