@charset "utf-8";
/*********************************************************************
 *
 *  <for top>
 *
*********************************************************************/
/* html body */
/* --------------------------------------------------------------------------- */


header {
    position: fixed;
    width: 100%;
    overflow: hidden;
    background-color: #000;
    z-index: 1002;
    left: 0;
    top: 0;
    height: 86px;
    overflow: hidden;
    border-bottom: 1px solid #fff;
    box-sizing: border-box;
}
}
header img#hd_abc_logo {
    float: left;
}
header img#hd_abc_aniv {
    float: right;
}
ul#hd_right {
    position: fixed;
    right: 0;
    top: 87px;
    overflow: hidden;
    z-index: 1003;
}
ul#hd_right li {
    float: left;
    margin-left: 30px;
}
ul#hd_right li:first-child {
    margin-left: 0;
}
ul#hd_right li:nth-child(-n+2) {
    margin-top: 17px;
}

#hd_menubtn img { display: none; }
#hd_menubtn img.active { display: block; }

.inner {
    width: 608px;
    margin: 0 auto;
}

.detail {
    padding-top: 87px;
    background: #7f94a5 url(../images/common/n_bg_top.jpg) left top no-repeat;
}
.detail .w_inner {
    background: url(../images/common/n_bg_bottom.jpg) left bottom no-repeat;
    overflow: hidden;
}
.detail .frame {
    width: 100%;
    padding: 0 17px;
    background: url(../images/common/n_frame_bg.png) left top repeat-y;
    color: #000;
    box-sizing: border-box;
    overflow: hidden;
}
.detail .frame p {
    padding: 0 23px;
    box-sizing: border-box;
    font-size: 22px;
    letter-spacing: 0.5px;
    line-height: 1.7em;
    text-indent: 1em;
}
.detail .frame div.img {
    padding: 0 23px;
    box-sizing: border-box;
}

.detail div#n_hd_logo {
    margin-left: 5px;
    margin-bottom: 34px;
}


footer {
    padding-bottom: 20px;
    background: #cccccc url(../images/common/footer_bg.png) left top repeat-x;
}
footer .backtop {
    float: right;
}
footer .bnr {
    width: 546px;
    margin: 0 auto;
    margin-bottom: 7px;
}
footer .ft_nav {
    width: 411px;
    height: 56px;
    line-height: 56px;
    text-align: center;
    margin: 0 auto;
    margin-bottom: 47px;
    background-color: #FFF;
    color: #000;
    -webkit-border-radius: 0 0 10px 10px / 0 0 10px 10px;
    -moz-border-radius: 0 0 10px 10px / 0 0 10px 10px;
    border-radius: 0 0 10px 10px / 0 0 10px 10px;
    
}
footer .ft_nav span.current {
    color: #f87400;
}
footer .copyrignt {
    clear: both;
    padding-top: 10px;
    color: #000;
}

nav ul {
    overflow: hidden;
}
nav ul li {
    position: relative;
    margin-top: 10px;
}
nav ul li:first-child {
    margin-top: 0;
}
nav ul li:nth-child(10) {
    margin-top: 30px;
}
nav ul li:nth-child(11) {
    margin-top: 20px;
}


nav ul li.active {
    pointer-events: none;
}
/*
nav ul li.active .overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-color: rgba(0,0,0,0.7);
}
*/

.menu nav ul li:nth-child(10) {
    margin-top: 10px;
}
.menu {
    position: fixed;
    width: 100%;
    height: 870px;
    top: 166px;
    left: 0;
    overflow: hidden;
    display: none;
    z-index: 1001;
}
.menu .inner {
    position: absolute;
    width: 100%;
    height: 870px;
    top: -870px;
    left: 0;
    background-color: #000;
    padding: 19px 16px 0 16px;
    overflow: scroll;
    box-sizing: border-box;
}
.dmy {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
    display: none;
    z-index: 1000;
    left: 0;
    top: 0;
}

#vr_bnr {
    margin-left: -7px;
    margin-bottom: 23px;
}
ul#sns {
    overflow: hidden;
    display: table;
}
ul#sns li {
    float: left;
    width: 100%;
    border: 1px solid #FFFFFF;
    box-sizing: border-box;
    margin-top: 30px;
    text-align: center;
}
ul#sns li:first-child {
    margin-top: 0;
}
ul#sns li a {
    display: block;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    padding: 42px;
}
ul#sns li img {
    display: inline;
}
.detail .title {
    margin-left: 17px;
    margin-bottom: 34px;
}

.detail ul#sns li {
    background-color: #FFF;
}
p.large { font-size: 25px !important; }
.russet { color: #7e2f3d; }


/* TOP */
/* --------------------------------------------------------------------------- */
.top {
    background: url(../images/top/bg.jpg) left bottom no-repeat;
}
#top .pv_area {
    margin-top: 86px;
}
#top .youtube {
    margin-bottom: 43px;
    border: 1px solid #FFFFFF;
    box-sizing: border-box;
}

#top #news {
    width: 100%;
    height: 241px;
    border: 1px solid #FFFFFF;
    box-sizing: border-box;
    padding: 32px 23px;
    overflow: hidden;
}
#top #news p.news_head {
    height: 48px;
    border-bottom: 1px dashed #FFFFFF;
}
#top #news ul {
    position: relative;
    width: 563px;
    height: 95px;
    display: inline-block;
    overflow: hidden;
    box-sizing: border-box;
    margin-top: 32px;
}
#top #news ul li {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    display: block;
    font-size: 18px;
    line-height: 1.8em;
}
#top #news ul li span {
    display: block;
    width: 132px;
    height: 28px;
    background-color: #647883;
    line-height: 28px;
    text-align: center;
}
#top #news ul li a {
    color: #FFFFFF;
}

#top ul#banner {
    overflow: hidden;
    margin-bottom: 161px;
}
#top ul#banner li {
    float: left;
    margin-top: 10px;
}
#top ul#banner li:nth-child(-n+2) {
    margin-top: 0;
}
#top ul#banner li:nth-child(odd) {
    width: 298px;
}
#top ul#banner li:nth-child(even) {
    width: 298px;
    margin-left: 12px;
}


/* INTRO */
/* --------------------------------------------------------------------------- */

#intro .photo {
    padding: 0 23px;
    box-sizing: border-box;
}
/* 下（もしくは中）に配置したい画像 */
#intro .frame p.comment {
    overflow: hidden;
}
#intro .frame p.comment span {
    float: left;
    width: 1px;
    height: 842px;
    margin-right: 1px;
}
#intro .frame p.comment span.float {
    float: left;
    clear: both;
    width: 324px;
    height: auto;
    margin-right: 15px;
}
#intro .frame div.photo4_5 {
    position: relative;
    width: 560px;
    height: 566px;
    margin: 0 auto;
}
#intro .frame div.photo4_5 #photo4 {
    position: absolute;
    left: 0;
    top: 273px;
}
#intro .frame div.photo4_5 #photo5 {
    position: absolute;
    left: 136px;
    top: 0;
}
#intro .frame div.txt4_wrapper {
    background: url(../images/introduction/txt4_bg.png) left top no-repeat;
}




/* STORY */
/* --------------------------------------------------------------------------- */

#story .frame {
    padding-top: 87px;
    background: url(../images/story/bg_large.jpg) left top no-repeat;
}


/* STAFF */
/* --------------------------------------------------------------------------- */

#staff .frame {
    padding: 67px 40px 0 40px;
    background: url(../images/staff/bg_large.jpg) left top no-repeat;
}
#staff .frame dl {
    overflow: hidden;
    width: 100%;
    font-size: 20px;
    line-height: 1.5em;
    letter-spacing: -1.3;
    box-sizing: border-box;
}
#staff .frame dl dt {
    float: left;
    width: 238px;
    background-image: url(../images/staff/line.png);
    background-repeat: no-repeat;
}
#staff .frame dl dd {
    float: left;
    width: 312px;
    margin-left: 10px;
}
.bg_left_20p { background-position: 20px 50%; }
.bg_left_50p { background-position: 50px 50%; }
.bg_left_70p { background-position: 70px 50%; }
.bg_left_90p { background-position: 90px 50%; }
.bg_left_100p { background-position: 100px 50%; }
.bg_left_120p { background-position: 120px 50%; }
.bg_left_140p { background-position: 140px 50%; }
.bg_left_160p { background-position: 160px 50%; }
.bg_left_180p { background-position: 180px 50%; }
.bg_left_200p { background-position: 200px 50%; }
.bg_left_220p { background-position: 220px 50%; }

#staff .frame dl dt.rdm {
    background-position: 230px -5px;
    letter-spacing: -3px;
}

/* CAST */
/* --------------------------------------------------------------------------- */

#cast .frame {
    padding-top: 98px;
    background: url(../images/cast/bg_large.jpg) left top no-repeat;
}

#cast .frame #diagram {
    width: 561px;
    margin: 0 auto;
    margin-bottom: 50px;
    background-color: #dcdcdc;
    border: 1px solid #000;
    box-sizing: border-box;
}
#cast .frame #diagram p {
    padding: 0;
    line-height: 0 !important;
}
#cast .frame #diagram p img {
    width: 100%;
}
#cast .frame #diagram iframe {
    border: 0;
}
#cast .frame p {
    letter-spacing: 0px;
    line-height: 1.5em;
    text-indent: 0;
}


/*-----------------------------------------------------------
KEYWORD
-------------------------------------------------------------*/

#keyword .frame {
    padding-top: 92px;
    background: url('../images/keyword/bg_large.jpg') left top no-repeat;
}
#keyword ul.page-nav {
    display: table;
    margin: 0 auto;
    overflow: hidden;
}
#keyword ul.page-nav li {
    float: left;
    margin-left: 45px;
}
#keyword ul.page-nav li:first-child {
    margin-left: 0;
}
#keyword .frame p {
    font-size: 22px;
    text-indent: 0;
}
#keyword .frame p.sp25 { line-height: 2em; }
#keyword .frame p span {
    /*font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;*/
    font-size: 28px; font-weight: bold; color: #7f2638;
    font-weight: bold;
}

#keyword #hd01 { width: 266px; margin: 0 auto; margin-top: -19px; }
#keyword #kw_img1 { width: 560px; margin: 0 auto; margin-bottom: 30px; }

#keyword #hd02 { width: 542px; margin: 0 auto; margin-bottom: 30px; }
#keyword #kw_img2 { width: 320px; margin: 0 auto; margin-bottom: 30px; }

#keyword #hd03 { width: 230px; margin: 0 auto; }
#keyword #kw_img3 { width: 560px; margin: 0 auto; margin-bottom: 30px; }


/*-----------------------------------------------------------
ORIGINAL
-------------------------------------------------------------*/

#original .frame {
    padding-top: 124px;
    height: 1750px;
    background: url('../images/original/bg_large.jpg') left top no-repeat;
}
#original .frame p {
    /*line-height: 1.8em;*/
}
#original .frame p img {
    display: inline;
}
#original .frame #kw_book {
    width: 321px;
    margin: 0 auto;
    margin-bottom: 40px;
}
#original .frame #kw_txt {
    
}

#original .frame a {
    background: url('../images/original/arw.png') left center no-repeat;
    padding-left: 15px;
}
#original .frame p.com {
    font-size: 24px;
    text-indent: 0;
}
#original .frame p.txt {
    /*font-size: 20px;
    line-height: 1.8em;*/
    text-indent: 0;
}
#original .frame p.txt span {
    float: right;
    width: 1px;
    height: 370px;
    margin-right: 1px;
}
#original .frame p.txt span.float {
    float: right;
    clear: both;
    width: 197px;
    height: auto;
    margin-left: 27px;
}
#original .frame #lnk a {
    background: #7f2638 url('../images/original/arw.png');
    background-repeat: no-repeat;
    background-position: 16px 50%;
    padding: 8px 20px 8px 35px;
    color: #fff;
    font-weight: bold;
    text-decoration: none;
}
#original .frame #lnk a:hover {
    opacity: 0.7;
}



/*-----------------------------------------------------------
MOVIE
-------------------------------------------------------------*/

#movie .frame {
    padding: 44px 40px 57px 40px;
    background: url('../images/movie/bg_large.jpg') left top no-repeat;
}
#movie .frame h2 {
    text-align: center;
    margin-bottom: 44px;
}
#movie .frame h2 img {
    display: inline;
}

#movie .frame #making_movie {
    margin-bottom: 74px;
}
#movie .detail .frame p {
    padding: 0;
    text-indent: 0;
    line-height: 27px;
}


/*-----------------------------------------------------------
TRAILER
-------------------------------------------------------------*/

#trailer .frame {
    padding: 50px 40px 50px 40px;
    background: url('../images/trailer/bg_large.jpg') left top no-repeat;
}



/*-----------------------------------------------------------
PRESS
-------------------------------------------------------------*/
#press .detail .title {
    margin-bottom: 20px;
    width: 90%;
}
#press img{
    max-width: 100%;
}
#press .frame{
    padding: 50px 40px 50px 40px;
    background: url('../images/press/bg_large.jpg') center top repeat-y;
}

#press h2{
    margin-top: 50px;
    margin-bottom: 20px;
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    font-size: 27px;
    font-weight: bold; color: #7f2638;
    line-height: 1.5em;
}
#press .frame .txt+img{
    margin-top: 20px;
}
#press .frame img+p{
    margin-top: 20px;
}
#press .frame p+p{
    margin-top: 15px;
}
#press p{
    padding: 0;
}