@charset 'UTF-8';
/*
============================================================

キャンペーンページ PC用

============================================================*/

body#ffm000010 .wrapper {
   width: 100%;
   margin: 0 auto;
}

body#ffm000010 header,
nav#globalNavi,
#headerUtility {
   width: 100%;
   margin: 0 auto;
}


body#ffm000010 .wrapper .container {
   width: 100%;
   margin: 0 auto;
   background: #000 url("/static/cpn/ffm000010/img/bg_header.jpg") repeat-x 0 0;
   background-color: #101010;
   color: #fff;
}
body#ffm000010 article.contents {
   width: 970px;
   margin: 0 auto;
   background: transparent;
   color: #fff;
}

/*----------------------------------------------------------------------------------------------
section.detail
----------------------------------------------------------------*/


section.detail .movieDetail {
   -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
           box-sizing: border-box;
   padding-top: 27px;
}

section.detail .equalizerImage {
   display: inline-block;
   width: 480px;
}

section.detail .equalizerDetail {
   display: inline-block;
   width: 485px;
   text-align: center;
   vertical-align: top;
}
section.detail h1.logoTtl {
   margin-bottom: 12px;
   text-align: right;
}
section.detail h2.logoTxt {
   margin-bottom: 25px;
}

section.detail p.detailBtnTxt {
   margin: 5px 0 25px 0;
   font-size: 120%;
}

section.detail h3.detailTtl {
   margin-bottom: 15px;
   padding-left: 22px;
   font-weight: normal;
   text-align: left;
}

section.detail h3.detailTtl span {
   display: block;
   margin: 5px;
   font-size: 90%;
}

section.detail ul.product {
   padding-left: 22px;
   text-align: left;
}

section.detail .product li {
   margin-bottom: 5px;
}
section.detail .product li.cast {
   margin: 20px 0;
   line-height: 1.5;
   letter-spacing: 1px;
}

section.detail p.copy {
   padding-left: 22px;
   font-size: 78%;
   text-align: left;
}
section.detail ul.glovalnav {
   margin: 20px 0 40px;
   letter-spacing: -.4em;
}

section.detail ul.glovalnav li {
   display: inline-block;
   letter-spacing: 0;
}
/*----------------------------------------------------------------------------------------------
section#trailer
----------------------------------------------------------------*/
div#trailer {
   background: url("/static/cpn/ffm000010/img/bg_tril.jpg") no-repeat 0 0;
}
div#trailer h1.trailerTtl {
   margin-top: -30px;
   padding-bottom: 8px;
}

div#trailer .trailermovie.video {
   margin: 0 auto;
   padding-bottom: 45px;
   text-align: center;
}
section.trailer .video #silverlightControlHost {
   height: 500px;
}
div#trailer .trailermovie.video  #silverlightControlHost {
   height: 500px;
}

/*----------------------------------------------------------------------------------------------
section#story
----------------------------------------------------------------*/

section#story {
   padding-bottom: 40px;
   background: url("/static/cpn/ffm000010/img/bg_story.jpg") no-repeat 0 0;
}

section#story p.storyTxt {
   width: 860px;
   height: 160px;
   margin: 0 auto;
   padding: 30px;
   border-radius: 3px;
   background: rgba(199, 197, 197, .1);
   font-size: 16px;
   line-height: 1.9;
   letter-spacing: 1px;
}
.promotion_innner {
   margin-bottom: 20px;
}
h1.storyTtl {
   margin-top: -45px;
   padding-bottom: 12px;
}
section#story h2 {
   text-align: center;
}
section#story p.todetail {
   text-align: center;
}
section#story p.smTxt {
   text-align: center;
}
section#story p {
   text-align: left;
}
/*----------------------------------------------------------------------------------------------
section
----------------------------------------------------------------*/
section.slider {
   width: 970px;
   padding: 110px 0 2px 0;
   background-image: url("/static/cpn/ffm000010/img/ttl_image.png") ,url("/static/cpn/ffm000010/img/bg_gall.jpg");
   background-repeat: no-repeat,no-repeat;
   background-position: 15px 0,0 0;
}
.pastProduct {
   padding: 40px 20px;
}

.pastProduct .listSection.simple.jacket .unit a {
   color: #fff;
}

.pastProduct .listSection.simple .unit .unitBody h3 a {
   color: #fff;
}
/* ベースレイアウト SP
------------------------------------------------------------ */

.sp img {
   width: 100%;
}

body#ffm000010.sp div.container article.contents {
   width: 100%;
   height: auto;
   background-color: #000;
   background-image: none;
   background-position: bottom;
}


body#ffm000010.sp {
   width: 100%;
   margin: 0;
   background-color: #000;
}

body#ffm000010.sp .wrapper {
   width: 100%;
   margin: 0;
   background: red;
}



body#ffm000010.sp header,
.sp nav#globalNavi,
.sp #headerUtility {
   width: 100%;
   margin: 0;
}


body#ffm000010.sp .wrapper .container {
   width: 100%;
   margin: 0;
   background-color: #101010;
   color: #fff;
}
p.detailBtn a:hover,
section#story p.todetail a:hover {
   opacity: .6;
   zoom: 1;

       filter: alpha(opacity=60);
   -ms-filter: "alpha( opacity=60 )";
}

/*----------------------------------------------------------------------------------------------
 .sp section.detail
----------------------------------------------------------------*/

.sp section.detail {
   margin-bottom: 5%;
}
.sp section.detail .movieDetail {
   -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
           box-sizing: border-box;
   padding-top: 3%;
}

.sp section.detail .equalizerImage {
   display: inline-block;
   width: 100%;
   text-align: center;
}

.sp section.detail .equalizerDetail {
   display: inline-block;
   width: 100%;
   font-size: 85%;
   text-align: center;
   vertical-align: top;
}
.sp section.detail .equalizerImage img {
   width: 75%;
}

.sp p.detailBtn {
   width: 90%;
   margin: 0 auto;
}
.sp section.detail h1.logoTtl {
   margin-bottom: 1%;
   text-align: right;
}
.sp section.detail h2.logoTxt {
   margin-bottom: 2%;
}

.sp section.detail p.detailBtnTxt {
   margin: 1% 0 2% 0;
   font-size: 120%;
}

.sp section.detail h3.detailTtl {
   margin-bottom: 1%;
   padding-left: 2%;
   font-weight: normal;
   text-align: left;
}

.sp section.detail h3.detailTtl span {
   display: inline;
   margin: 0 2%;
   font-size: 90%;
}

.sp section.detail ul.product {
   padding-left: 5%;
   text-align: left;
}

.sp section.detail .product li {
   margin-bottom: 1%;
}
.sp section.detail .product li.cast {
   margin: 2% 0;
   line-height: 1.5;
   letter-spacing: 1px;
}

.sp section.detail p.copy {
   padding-left: 2%;
   font-size: 78%;
   text-align: left;
}
.sp section.detail ul.glovalnav {
   margin: 2% 0 4%;
   letter-spacing: -.4em;
}

.sp section.detail ul.glovalnav li {
   display: inline-block;
   letter-spacing: 0;
}

/*----------------------------------------------------------------------------------------------
 .sp section#trailer
----------------------------------------------------------------*/

.sp div#trailer {
   padding-bottom: 2%;
}
.sp div#trailer p.ttl {
   width: 30%;
}
.sp div#trailer h1.trailerTtl {
   margin-top: -3%;
   padding-bottom: 8px;
}

.sp div#trailer .trailermovie.video {
   width: 76%;
   margin: 0 auto;
   padding-bottom: 4%;
}

/*----------------------------------------------------------------------------------------------
 .sp section#story
----------------------------------------------------------------*/

 .sp section#story {
	padding: 0 0 5% 0;
	background: url('/static/cpn/ffm000010/img/bg_main_sp.png') repeat 0 0;
}

.sp section#story p.storyTxt {
   width: 86%;
   height: auto;
   margin: 0 auto;
   padding: 3%;
   font-size: 98%;
   line-height: 1.5;
   letter-spacing: 0;
}
.sp .promotion_innner {
   margin-bottom: 2%;
}
.sp  h1.storyTtl {
   margin-top: -4%;
   padding-bottom: 1%;
}
.sp section#story h2 {
   text-align: center;
}
.sp section#story p.todetail {
   text-align: center;
}
.sp section#story p.todetail {
   width: 90%;
   margin: 0 auto;
}
.sp section#story p.smTxt {
   width: 100%;
   text-align: center;
}
.sp section#story p {
   width: 30%;
   text-align: left;
}

/*----------------------------------------------------------------------------------------------
 .sp section
----------------------------------------------------------------*/
 .sp section.slider {
   width: 100%;
   padding: 11% 0 0 0;
   background-image: none;
   background-image: url("/static/cpn/ffm000010/img/ttl_image.png") ,url("/static/cpn/ffm000010/img/bg_gall.jpg");
   background-repeat: no-repeat,repeat;
   background-position: 0 0,0 0;
   background-size: 30%, contain;
}

.sp .pastProduct {
   padding: 4% 2%;
}
.sp section#idListSection {
   letter-spacing: -.4em;
}
.sp ol.flex-control-nav.flex-control-thumbs {
   display: none;
}

.sp section#relatedWork {
   padding-bottom: 20%;
}

/*------------------------------------------
	関連作品用
-------------------------------------------*/
dl.targetWork {
   display: inline-block;
   width: 181px;
   height: 240px;
   text-align: center;
   vertical-align: top;
}
dl.targetWork  dt a {
   display: block;
   cursor: pointer;
}
dl.targetWork  dt a img {
   width: 120px;
   border: 1px solid #fff;
}
dl.targetWork  dt a img:hover {
   border: solid 1px #fff;
   -webkit-box-shadow: 0 0 10px 3px #6a98ff;
   transition: background-color .3s,box-shadow .3s;

   -webkit-highlight-color: rgba(0, 0, 0, 0);
}

dl.targetWork  dd a {
   display: block;
   /* width: 120px; */
   padding: 5px 0 0 5px;
   color: #fff;
}
dl.targetWork  dd a:hover {
   color: #feb86c;
   text-decoration: none;
}
.sp dl.targetWork {
   display: inline-block;
   width: 32%;
   height: 24%;
   text-align: center;
   vertical-align: top;
   letter-spacing: 0;
}
.sp dl.targetWork:nth-of-type(2),
.sp dl.targetWork:nth-of-type(5),
.sp dl.targetWork:nth-of-type(8) {
   margin: 0 2%;
}
.sp dl.targetWork dt a {
   display: block;
}
.sp dl.targetWork dt a img {
   width: 100%;
   border: 2px solid #03213b;
}
.sp dl.targetWork dt a img:hover {
   border: 2px solid rgba(62,133,171,.75);
   box-shadow: 0 0 3% rgba(62,133,171,.75);
}

.sp dl.targetWork dd a {
   display: block;
   width: 94%;
   padding: 1% 0 3% 2%;
   color: #fff;
}
.sp dl.targetWork dd a:hover {
   color: #feb86c;
   text-decoration: none;
}

/*============================================================

player fit

============================================================*/
.fitWindows header {
	display: none;
}
.fitWindows #globalNavi {
	display: none;
}
.fitWindows #headerUtility {
	display: none;
}
.fitWindows footer {
	display: none;
}
.fitWindows article.contents section {
	display: none;
	margin: 0;
}
.fitWindows article.contents section.trailer {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: auto;
}
.fitWindows article.contents section.trailer h2,
.fitWindows div.container section.trailer div.txt,
.fitWindows div.container section.trailer div.notice {
	display: none !important;
}
.fitWindows article.contents section.trailer {
	margin: 0;
	padding: 0;
	background: none;
}
.fitWindows article.contents section.trailer div.trailermovie,
.fitWindows article.contents section.trailer li.player {
	display: block;
}
.fitWindows article.contents section.trailer div.trailermovie,
.fitWindows article.contents section.trailer li.player,
.fitWindows article.contents section.trailer div#silverlightControlHost {
	display: block;
	overflow: hidden;
	width: 100%;
	height: auto;
}

/*--equalizer--*/
