@charset "UTF-8";

/*基本設定*/
html{font-size: 62.5%;}
body{font-size: 1.2rem;color:#00342d;font-family: "Hiragino Kaku Gothic ProN","メイリオ", sans-serif;}
div,h3{box-sizing:border-box;}
p{word-break: normal;word-wrap: break-word;text-align:justify;}
h2{line-height:1.3em;}
ul,dl,#character,#keyword{letter-spacing: -.40em;}
li,dd,#character div,#keyword div{letter-spacing: normal;}
a:hover>img{opacity:0.7;text-decoration:underline;}
.CGB_menu li:hover{opacity:0.7;}
.pad_in a:hover{opacity:0.7;text-decoration:underline;}
#sortBox a:hover{opacity:0.7;text-decoration:underline;}
img{pointer-events: none;
  user-select: none;
  vertical-align: bottom;
  -webkit-user-select: none;
  width: auto;
  height: auto;
  -ms-interpolation-mode: bicubic;}
  
/*レイアウトClass*/
.inner{width: 980px;margin:0 auto;}
.round{border-radius:5px;}
.shadow{box-shadow:0px 0px 1px 1px #000;-moz-box-shadow:0px 0px 1px 1px #000;-webkit-box-shadow:0px 0px 1px 1px #000;}


/*コンテンツ部分*/
#foot_menu{margin:0!important;}
a:hover img{	opacity:0.8;}

#movieid_1{position: absolute;width: 251px;display: block;right:25px;top:290px;text-align:center;font-size: 130%;font-weight: bold;color: #fff; line-height: 2.2em;}
#movieid_1>img{width: 100%;border-radius:5px;}
.mv_ar{background:url(../img/mv_ar.png) no-repeat center 30px;width: 100%;height: 100%;position:absolute;background-size:30% auto;z-index:100;}
#product_contents{font-size: 1.4rem;/*font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", serif;*/}

/*BOX内--------------------------------------------*/
#narou_headder{background: url(../img/common/narou_top_bg.png) center -50px;height: 70px;}
#narou_headder > div{width:980px;margin:0 auto;}
#narou_headder > div >h2{width: 281px;height:35px;background: url(../img/common/narou_top_logo.png);float:left;margin-top: 20px;}
#narou_headder > div >h2>a{display:block;}
#narou_headder > div > ul{float: right;margin-top: 25px;}
#narou_headder > div > ul > li{float:left;height: 22px;}
#narou_headder > div > ul > li.m1{background: url(../img/common/ic1.png) no-repeat;padding-left: 30px;margin-right: 20px;}
#narou_headder > div > ul > li.m2{background: url(../img/common/ic2.png) no-repeat;padding-left: 30px}

#main_contents{background: url(../img/common/bg.jpg);padding-bottom: 10px;   }
#main_contents > #narou_pnkz{background: rgba(253,216,35,0.3) ;padding: 10px 0;margin-bottom: 20px;}
#main_contents > #narou_pnkz > ul{width:980px;margin:0 auto;}
#main_contents > #narou_pnkz > ul > li{line-height:24px;margin: 0;padding: 0;background: url(../img/common/pk_arrow.png) no-repeat 0 4px ;float:left;padding-left: 16px;margin-right: 10px;}
#main_contents > #narou_pnkz > ul > li:first-child{background: url(../img/common/pk_home.png) no-repeat ;padding-left: 30px;;}

#main_contents > #product_contents{width:980px;margin:0 auto;}
#main_contents > #product_contents > #product{overflow: hidden;background: #000;width:770px;float:left;margin-bottom: 20px;background:;padding-bottom: 20px;/*font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", serif;*/}
#main_contents > #product_contents > #product > #mainvisual{position:relative;}

#mainvisual{margin-bottom: -20em;    z-index: 1;position:relative;}
#mainvisual>h2.logo{position: absolute;top:10px;right:0px;}
#mainvisual>h3.catch{position:absolute;top: 10px;left:0px;}
#mainvisual>h4.sale{position:absolute;left:0;top:600px;right:0;width: 100%;text-align:center;}
#mainvisual>h5.auth{position:absolute;right:50px;top:570px;}

#story,#character,#keyword{margin: 0 auto;padding: 2em 2em 2em 2em;color:#000;}
#story h3,#character h3,#keyword h3{text-align:center;margin-bottom: 0.5em;}

#story{position:relative;text-align:center;background: #524141;;}
#story>div{background: rgba(255,255,255,0.8);position:relative;    z-index: 2;padding: 2em 0 ;}
#mainvisual:after{  content: '';
  position: absolute;
  bottom:240px;
  left: 0;
  width: 200%;
  height: 100%;
  margin: 0 -50%;
  background: #fff;
  -webkit-transform-origin: right center;
  -ms-transform-origin: right center;
  transform-origin: right center;
  -webkit-transform: rotate(-10deg);
  -ms-transform: rotate(-10deg);
  transform: rotate(-10deg);
  z-index: -1;}
#story p{text-align:center;}
#story h3{left:0;text-align:center;width: 100%;}
.dc1{position:absolute;left:10px;top:10px;}
.dc2{position:absolute;right:10px;top:10px;transform: rotate( 90deg ); }
.dc3{position:absolute;left:10px;bottom:10px;transform: rotate( -90deg );}
.dc4{position:absolute;right:10px;bottom:10px;transform: rotate( -180deg );}


#character{position:relative;text-align:center;background: #000;z-index:1;}
#character ul{padding: 0 1em;-webkit-box-pack:justify;
    -moz-box-pack:justify;
    -webkit-flex-pack:justify;
    -moz-flex-pack:justify;
    -ms-flex-pack:justify;
    -webkit-justify-content:space-between;
    -moz-justify-content:space-between;
    justify-content:space-between;}
#character li{width: 48%;padding: 2em;background:url(../img/frame.png) rgba(255,255,255,0.8) no-repeat center center;}
#character li >figure{width: ;display:block;text-align:left;}
#character li >figure>img{}
#character li >div{display:block;vertical-align:top;}
#character li img{width: auto;    width: 100%;}
#character li h4{text-align:left;padding: 0.5em 0;}
#character li h4 img{width: auto;}
#character li p{font-size:15px;color:#000;}
#character:after{      content: '';
    position: absolute;
    bottom: 200px;
    left: 0;
    width: 200%;
    height: 100%;
    margin: 0 -50%;
    background: #524141;
    -webkit-transform-origin: right center;
    -ms-transform-origin: right center;
    transform-origin: right center;
    -webkit-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    transform: rotate(-10deg);
    z-index: -1;}

#keyword{position:relative;background: #000;}
#keyword ul{text-align:center;padding:0 1em;;}
#keyword li{display:inline-block;width: 100%;vertical-align: top;    padding:0 1.5em; ;padding: 1em 1em 0 1em;}

#keyword h4{display:table;width: 100%;vertical-align: middle;padding-right: 1em;    text-align: center;}
#keyword h4 img{width: auto;;}
#keyword p{vertical-align: middle;padding-top: 1em;font-weight:;;color:#fff;text-align:center;}

.set{}

/*固定--------------------------------------------*/
#main_contents > #product_contents > div#read2 a{display:block; background:url(../img/common/tc_btn2.png) no-repeat center center #2c2e4a;height: 95px;width:200px;margin: 0 auto 10px;float:right;}
#main_contents > #product_contents > #product > div#read{margin-top: 20px;}
#main_contents > #product_contents > #product > div#read a{display:block; background:url(../img/common/tc_btn.png) no-repeat center center #2c2e4a;border-radius:5px;height: 60px;width:700px;margin: 0 auto 0;}
#main_contents > #product_contents > div#read2 a:hover{opacity:0.8;}
#main_contents > #product_contents > #product > div#read a:hover{opacity:0.8;}

#main_contents > #product_contents > #recommend{width:200px;float:right;margin-bottom: 20px;background: #fcffec;}
#main_contents > #product_contents > #recommend >div{margin-bottom: 10px;;}
#main_contents > #product_contents > #recommend >div#series h3{height: 30px;background: url(../img/common/series_titile.png) no-repeat center center;;}
#main_contents > #product_contents > #recommend >div#series ul{padding: 20px;}
#main_contents > #product_contents > #recommend >div#series ul>li{margin-bottom: 20px;}
#main_contents > #product_contents > #recommend >div#series ul>li:last-child{margin-bottom: 0;}
#main_contents > #product_contents > #recommend >div#series ul>li>a>img{width:160px;}
#main_contents > #product_contents > #recommend >div#series ul>li>img{width:160px;}
#main_contents > #product_contents > #recommend >div#series ul>li>a>img.amz{width:150px;display: block;margin:10px auto 0;}

#main_contents > #product_contents > #recommend >div#lineup h3{height: 50px;background: url(../img/common/lineup_titile.png) no-repeat #f4e876 center center;;}
#main_contents > #product_contents > #recommend >div#lineup ul{padding: 20px;}
#main_contents > #product_contents > #recommend >div#lineup ul>li{margin-bottom: 20px;}
#main_contents > #product_contents > #recommend >div#lineup ul>li:last-child{margin-bottom: 0;background: #ddd;text-align:center;padding: 5px;;}
#main_contents > #product_contents > #recommend >div#lineup ul>li:last-child a{display:block;}
#main_contents > #product_contents > #recommend >div#lineup ul>li>a>img{width:200px;}
#main_contents > #product_contents > #recommend >div#lineup ul>li>img{width:200px;}


/*-------------------------------------------------*/
.grd{
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#8e006f', endColorstr = '#ad2181');
/*INNER ELEMENTS MUST NOT BREAK THIS ELEMENTS BOUNDARIES*/
/*Element must have a height (not auto)*/
/*All filters must be placed together*/
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr = '#8e006f', endColorstr = '#ad2181')";
/*Element must have a height (not auto)*/
/*All filters must be placed together*/
background-image: -moz-linear-gradient(top, #8e006f, #ad2181);
background-image: -ms-linear-gradient(top, #8e006f, #ad2181);
background-image: -o-linear-gradient(top, #8e006f, #ad2181);
background-image: -webkit-gradient(linear, center top, center bottom, from(#8e006f), to(#ad2181));
background-image: -webkit-linear-gradient(top, #8e006f, #ad2181);
background-image: linear-gradient(top, #8e006f, #ad2181);
/*--IE9 DOES NOT SUPPORT CSS3 GRADIENT BACKGROUNDS--*/
}



/*バナースペース*/
#bns{}
#bns ul{width:980px;margin:0 auto;}
#bns ul li{float:left;margin-right:10px;}
#bns ul li:last-child{margin:0;}
#bns ul li a{display: block;}
/*social*/
#twitter1{float:right;width:110px;}
#facebook1{float:right;}

/*foot 差し替え*/
#foot_menu{color:#000;min-width:980px;}
#foot_menu a{color:#000;}
#foot{background:#000!important;min-width:980px;}

/*
#cboxTopLeft, #cboxTopCenter, #cboxTopRight, #cboxMiddleLeft, #cboxMiddleRight, #cboxBottomLeft, #cboxBottomCenter, #cboxBottomRight {
    display: none;
}
#cboxContent {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0 !important;
}
#cboxClose {
    color: #fff !important;
}
.cboxIframe {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0 !important;
}*/