/*キャラクター相性診断*/
.page_183,.page_200{position:relative;}

.spItem {display:none;}
#CharaQa {
width:852px;
height:648px;
margin:0px auto;
position: relative;
font-family:"メイリオ","Meiryo" !important;
background:url(../../images/main/cont/special/qa/qabg.png) no-repeat top left;
position:relative;
}
#qaTi {
position: absolute;
top: 0;
left: 0;
}
.StartBt {
position: absolute;
bottom: 170px;
left: 160px;
}
.topBt {
position: absolute;
bottom: 55px;
left: 170px;
}
#question {
display: none;
}
.qImg {
padding: 115px 0px 10px 48px;
}
.ati {
position: absolute;
top: 308px;
left: 40px;
display:none;
}
#charaImg{
margin:77px 0px 0px 0px;
}
#cms_block #ans {
margin: 0px auto;
}
#ans li {
margin: 0px auto;
width:757px;
height:46px;
background:url(../../images/main/cont/special/qa/abg.png) no-repeat;
}
#ans li:hover {opacity:0.8;}
#cms_block #ans a {
display:inline-block;
width: 757px;
height: 46px;
padding: 6px 0px 0px 0px;
color: #000;
text-decoration: none;
text-align:center;
font-weight:bold;
font-size:22px;
}
#ans a.ans1 {
background: url("../../images/main/cont/qa/a_bg01.gif") left top no-repeat;
}
#ans a.ans2 {
background: url("../../images/main/cont/qa/a_bg02.gif") left top no-repeat;
}
#ans a.ans3 {
background: url("../../images/main/cont/qa/a_bg03.gif") left top no-repeat;
}
#ans a.ans4 {
background: url("../../images/main/cont/qa/a_bg04.gif") left top no-repeat;
}
#ans a.ans1:hover {
background: url("../../images/main/cont/qa/a_bg01o.gif") left top no-repeat;
}
#ans a.ans2:hover {
background: url("../../images/main/cont/qa/a_bg02o.gif") left top no-repeat;
}
#ans a.ans3:hover {
background: url("../../images/main/cont/qa/a_bg03o.gif") left top no-repeat;
}
#ans a.ans4:hover {
background: url("../../images/main/cont/qa/a_bg04o.gif") left top no-repeat;
}

.detBt {
position: absolute;
top: 450px;
left: 555px;
}
.tweetBt {
position: absolute;
top: 450px;
left: 165px;
}
.backBt {
position: absolute;
top: 550px;
left: 385px;
}
.StartBt span,.backBt span,.tweetBt span,.detBt span {
display:none;
}
.StartBt a {
display:block;
width: 344px;
height: 50px;
margin:0 auto;
background: url("../../images/main/cont/special/qa/qa_start_bt.png") left top no-repeat;
}
.tweetBt a {
display:block;
width: 236px;
height: 51px;
margin:0 auto;
background: url("../../images/main/cont/special/qa/tweet_bt.png") left top no-repeat;
}
.detBt a {
display:block;
width: 227px;
height: 59px;
margin:0 auto;
background: url("../../images/main/cont/special/qa/detail_bt.png") left top no-repeat;
}
.detBt a:hover,
.tweetBt a:hover,
.StartBt a:hover {
opacity: 0.8;
}





/* ユーザー定義CSS
---------------------------------------------*/
.cate_bottom_tag{clear:both; float:none;}

/*場面写スライダー*/
#gallerryBg{
background:#000;
filter:alpha(opacity=70) !important;
-moz-opacity: 0.7 !important;
opacity: 0.7 !important;
z-index:100 !important;
}
#gallerry{height:auto; width:auto; padding:0px 40px 20px 40px}
#gallerry a span{}
#gallerryImageArea{overflow:visible;}
#gallerryImageArea img{width:800px; height:auto;}
#gallerryCloseBtArea a,#gallerryNextBtArea a,#gallerryBackBtArea a{display:block; font-weight:bold; color:#e0007b; font-size:20px;font-family: 'M+ 1p black'; font-style:italic;}
#gallerryCloseBtArea a{width:59px; height:59px; background:url(../../images/sys/close_bt.png) no-repeat;}
#gallerryNextBtArea{position:absolute; bottom:0px; right:25px;}
#gallerryBackBtArea{position:absolute; bottom:0px; left:25px;}
#gallerryCloseBtArea{position:absolute; top:0px; right:0px; z-index:100; width:35px; height:35px;}
#gallerryCloseBtArea span{display:none;}
/*
#gallerryNextBtArea a{width:76px; height:25px; background:url(../../images/sys/st_next_bt.png) no-repeat;}
#gallerryBackBtArea a{width:76px; height:25px;  background:url(../../images/sys/st_prev_bt.png) no-repeat;}
*/

/*未来　絶望　種別*/
.ttl_tag{position:absolute; top: 2px; left:2px; width:75px; height:75px; background-size:cover !important;}
.ttl_tag span{display:none;}
.ttl_tag#tag_mri{background:url(../../images/main/cont/tag_mirai.png) no-repeat;}
.ttl_tag#tag_ztb{background:url(../../images/main/cont/tag_zetsubou.png) no-repeat;}
.ttl_tag#tag_mri-ztb{background:url(../../images/main/cont/tag_zetsubou.png) no-repeat;}
.ttl_tag#tag_mri-ztb{background:url(../../images/main/cont/tag_miraizetsubou.png) no-repeat;}

/*コンテツページ共通*/
[class^="page_"]:not([class^="page_l"]):not(.page_navi) {
width:850px;
margin:0px auto;
line-height:1.7;
}


@font-face {
    font-family: 'M+ 1p black';
    src: url('../../images/others/font/mplus-1p-black-sub.eot');
    src: url('../../images/others/font/mplus-1p-black-sub.eot?#iefix') format('embedded-opentype'),
    url('../../images/others/font/mplus-1p-black-sub.ttf') format('woff'),
    url('../../images/others/font/mplus-1p-black-sub.woff') format('truetype');
}

h2.chara_cat {
    font-family: 'M+ 1p black';
    font-style:italic;
    font-size:2.8rem;
    text-align:left;
    margin:20px 0px 0px 0px;
}
h2.chara_cat:first-letter {
    font-size:4.0rem;
    color:#da007e;
}

a:hover img{
-webkit-filter: brightness(1.4);
-moz-filter: brightness(1.4);
filter: brightness(1.4);
}

/* タイトル指定 */
#js_newsdate{
margin:30px 0px 0px;
color:#B5B5B5;
}

/* ニュースタイトル */
h3.ti_n_h3 {
margin: 10px 0px 20px;
padding: 0px 0px 0px 0px;
color: #e4007f;
font-size:2rem;
}
/* 小見出し黒(h4) */
h4.ti_n_h4 {
margin: 20px 0px 10px;
padding: 0px 0px 0px 0px;
color: #e4007f;
}

/* コンテンツタイトル */
h3.ti_c_h3 {
margin: 10px 0px 20px;
padding: 0px 0px 10px 0px;
color: #e4007f;
font-size:3.2rem;
font-style:italic;
font-family: 'M+ 1p black';
border-bottom:2px solid #e4007f;
}
h3.ti_c_h3.mgt40 {
margin: 40px 0px 20px;
}
h3.ti_c2_h3 {
margin: 10px 10px 20px;
padding: 0px 0px 10px 0px;
color: #e4007f;
font-size:3.2rem;
font-style:none;
border-bottom:2px solid #e4007f;
-webkit-transform: skewX(-15deg);
  -moz-transform: skewX(-15deg);
  -o-transform: skewX(-15deg);
  transform: skewX(-15deg);
  -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1, M12=-0.26794919243112214, M21=0, M22=1, SizingMethod='auto expand')";
}
/* 小見出し黒(h4) */
h4.ti_c_h4 {
margin: 20px 0px 10px;
padding: 0px 0px 0px 0px;
color: #e4007f;
}

p.h_no {
margin: 0px;
padding: 0px;
}

/* IE6/7対応 打ち消し*/
#contents,
#contents_main,
#ext_area_01,
#ext_area_02,
.header_sa01,
.header_sa02,
.header_sa03,
.header_sa04,
.main_sa01,
.main_sa02,
.main_sa03,
.main_sa04,
.main_sa05,
.main_sa06,
.main_sa07,
.main_sa08,
.footer_sa01,
.footer_sa02,
.footer_sa03,
.ti_b,
#news_ct_h {
	min-height: 0em;
	_height: 0px;
	_overflow: visible;
	}


/* OP */
#op_area{
position:fixed;
width:100%;
height:100%;
z-index:1000;
top:0px;
left:0px;
}
#op_area_bg{
position:fixed;
width:100%;
height:100%;
z-index:0;
top:0px;
left:0px;
background:#000;
filter:alpha(opacity=80);
opacity:0.8;
}
#op_area_bg a{
position:fixed;
display:block;
width:100%;
height:100%;
z-index:99;
}
#op_area_inner{
padding:0px;
margin:auto;
width:80%;
height:auto;
position:absolute;
z-index:98;
top: 0px;
bottom: 0px;
left: 0;
right: 0;
}
#op_area_inner .inner{
    position: absolute;
    padding-bottom: 56.3%;
    padding-top: 0px;
    height: 0;
    top: 0px;
    bottom: 0px;
    left: 0;
    right: 0;
    margin: auto;
}
#op_area_inner iframe{
padding:0% 0px 0px 0px;
width:100%; height:100%;
position:absolute;
top:0;
left:0;
overflow:hidden;
}
#op_movie_area{
}
#layer {
width:100%;
height:auto;
min-height:20px;
margin:0px;
position:absolute;
top:0px;
left:65px;
z-index:100;
}
#skip_bt{
text-align:right;
}
@media screen and (max-width:450px){
#layer{
left:10%;
}
#skip_button{
display:inline-block;
width:10%;
}
#skip_bt img{
width:100%;
height:auto;
}

}