@charset "utf-8";
body{text-align: center;min-width:1190px; margin:0; padding:0; }
.pc { display:block !important;}
.sumaho { display:none !important;}
@media screen and (max-width: 767px){
   body { -webkit-text-size-adjust: none; min-width: 1px;}
	.pc { display:none !important;}
	.sumaho { display:block !important;}
}

.hdn{width:1px;height:1px;position:absolute;top:0;left:0}
.cl:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0}
* html .cl{zoom:1}
*:first-child+html .cl{zoom:1}
.frame1{ width: 100%; margin: auto; color: #FFF; background: url(../img/bgMain.jpg) no-repeat 0 0 #000; overflow: hidden; position: relative; z-index: 1; background-size: 100% auto; -moz-background-size: 100% auto; -webkit-background-size: 100% auto; -o-background-size: 100% auto; -ms-background-size: 100% auto;}
.frame2{ margin-top: -5px; background: url(../img/bgWatch.png) no-repeat 50% 0 #096294; background-size: 100% auto; -moz-background-size: 100% auto; -webkit-background-size: 100% auto;-o-background-size:100% auto;-ms-background-size:100% auto; font: 15px/200% 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif; }
.frame3{ width: 100%; }
@media screen and (max-width: 767px){
    .frame1{ width: 100%; margin: auto; color: #FFF;background: url(../img/bgMain_sp.jpg) no-repeat 10% 0 #000; overflow: hidden; position: relative; z-index: 1;background-size: 300% auto;-moz-background-size: 300% auto;-webkit-background-size: 300% auto;-o-background-size: 300% auto;-ms-background-size: 300% auto;}
	.frame2 { font-size: 14px; line-height: 160%; margin-top: 74%; }
}

#bddvd{ font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif; font-size: 16px; width: 100%; margin: auto; color: #000; text-align: left;}
#bddvd h1 {}
#bddvd h2 {text-align: center;margin-bottom: 35px;}
#bddvd h3 {text-align: center;font-weight: normal;font-size: 20px;line-height: 200%;}
#bddvd h3 span { display: block; font-size: 0.7em; line-height: 120%; }
#bddvd h4 {font-size: 18px;margin-bottom: 15px;}
#bddvd p {}
#bddvd a img { border-style: none; }
#bddvd a:focus { outline:none;}
#bddvd a:hover, #bddvd a:hover img{ opacity: .8; filter: alpha(opacity=80); -ms-filter: "alpha(opacity=60)"; -khtml-opacity: .8; -moz-opacity: .8; }
#bddvd a:hover, #bddvd a:hover img{ -moz-transition: opacity 0.3s ease-out 0s; -webkit-transition: opacity 0.3s ease-out 0s; -o-transition: opacity 0.3s ease-out 0s; -ms-transition: opacity 0.3s ease-out 0s; transition: opacity 0.3s ease-out 0s; }
#bddvd a, #bddvd a img{-moz-transition: opacity 0.3s ease-out 0s; -webkit-transition: opacity 0.3s ease-out 0s; -o-transition: opacity 0.3s ease-out 0s; -ms-transition: opacity 0.3s ease-out 0s; transition: opacity 0.3s ease-out 0s; }
#bddvd a:hover img {filter: alpha(opacity=80); -moz-opacity: 0.8; opacity: 0.8;}
#bddvd li { list-style: none; }
@media screen and (max-width: 767px){
    #bddvd { font-size:15px;line-height: 170%;}
    #bddvd a { display:block;}
    #bddvd img { width:100%; height:auto;}
    #bddvd h1 {}
    #bddvd h2 { margin-bottom: 0; }
    #bddvd h3 { font-size: 16px;line-height: 180%;margin-bottom: 3%;}
    #bddvd h3 span { font-size: 14px;}
	#bddvd h4 {font-size: 16px;text-align: center;margin-bottom: 2%;}
	#bddvd a:hover, #bddvd a:hover img{ opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha(opacity=100)"; -khtml-opacity: 1; -moz-opacity: 1; }
	#bddvd a:hover, #bddvd a:hover img{ -moz-transition: opacity 0s ease-out 0s; -webkit-transition: opacity 0s ease-out 0s; -o-transition: opacity 0s ease-out 0s; -ms-transition: opacity 0s ease-out 0s; transition: opacity 0s ease-out 0s; }
}

.fSmall {font-size: 0.8em;line-height: 200%;}
.fBig { font-size: 1.3em; }
.tCenter { text-align:center;}
.tGray { color:#ccc;}
@media screen and (max-width: 767px){
    .fSmall { font-size:11px; line-height:180%}
    .tRed { display:block;text-align:center;}
    .fBig { font-size: 15px;}
}

.fl{float:left;}
.fr{float:right;}
@media screen and (max-width: 767px){
    .fl{float:none;}
    .fr{float:none;}
}

.mb0 {margin-bottom: 0px !important;}
.mb5 {margin-bottom: 5px !important;}
.mb15 {margin-bottom: 15px !important;}
.mb20 {	margin-bottom: 20px !important;}
.mb25 {	margin-bottom: 25px !important;}
.mb30 {	margin-bottom: 30px !important;}
.mb35 {	margin-bottom: 35px !important;}
.mb40 {	margin-bottom: 40px !important;}
.mb60 {	margin-bottom: 60px !important;}
.mb80 {	margin-bottom: 80px !important;}
.mb160 {margin-bottom: 160px !important;}
.mt30 {	margin-top: 30px !important;}
.mt50 {	margin-top: 50px !important;}
.mt60 {	margin-top: 60px !important;}
.mrl25 { margin-right:25px;margin-left:25px;}
.pdT0 {	padding-top: 0px !important;}
@media screen and (max-width: 767px){
	.mb20 {	margin-bottom: 3% !important;}
    .mb30 {	margin-bottom: 4% !important;}
    .mb60 {	margin-bottom: 6% !important;}
    .mb80 {	margin-bottom: 8% !important;}
    .mt30 {	margin-top: 3% !important;}
    .mb40 {	margin-bottom: 3% !important;}
	.mt60 {	margin-top: 6%!important;}
	.mb160 {margin-bottom: 0 !important;}
    .mrl25 { margin-right:3%;margin-left:3%;}


}

.pad30 { padding: 30px; }
@media screen and (max-width: 767px){
	.pad30 { padding: 3%; }
}

.w770 { margin: 0 auto; width: 770px; position: relative;  }
.w820 { margin: 0 auto; width: 820px; position: relative; z-index: 10;}
.w900 { margin: 0 auto; width: 900px; position: relative; z-index: 10;}
.w920 { margin: 0 auto; width: 920px; position: relative; z-index: 10;}
.w960 { margin: 0 auto; width: 960px;}
.w980 { margin: 0 auto; width: 980px;}
@media screen and (max-width: 767px){
	.w770 { width: 88%;}
	.w820 { width: 88%;}
    .w900 { width: 88%;}
    .w920 { width: 88%;}
    .w960 { width: 88%;}
    .w980 { width: 92%;}
}


/*slide*/
#owl-demo .item img{display: block;width: 100%; height: auto;}
#bddvd .owl-theme .owl-controls .owl-page span { background: #FBFF71; box-shadow: 2px 2px 5px #000; -webkit-box-shadow: 2px 2px 5px #000; -moz-box-shadow: 2px 2px 5px #000; }
#bddvd .owl-theme .owl-controls .owl-buttons .owl-prev { background: url(../img/arrowL.png) no-repeat; width: 49px; height: 55px; display: block; position: relative; left: 2%; margin: -27% 0 0; padding: 0; font-size: 1px; line-height: 1em; text-indent: -9999px; opacity: 1; }
#bddvd .owl-theme .owl-controls .owl-buttons .owl-next{ background: url(../img/arrowR.png) no-repeat; width: 49px; height: 55px; display: block; position: relative; left: 95%; margin: -3% 0 0; padding: 0; font-size: 1px; line-height: 1em; text-indent: -9999px; opacity: 1; }
#bddvd .owl-theme .owl-controls .owl-buttons div { display: none; }
@media screen and (max-width: 767px){
	#bddvd .owl-theme .owl-controls .owl-page span { width: 0.8em; height: 0.8em; margin:1px 4px;}
	#bddvd .owl-theme .owl-controls .owl-buttons .owl-prev { width: 100%; height: auto; left: 2%; margin: -35% 0 0; padding: 5% 3%; background-size: 7% auto; }
	#bddvd .owl-theme .owl-controls .owl-buttons .owl-next{ width: 100%; height: auto; left: 91%; margin: -15% 0 0; padding: 5% 3%; background-size: 7% auto; }
}

/*main*/
#main {background: url(../img/mainImg.png) no-repeat 50% -8px; display: block; clear: both; float: none; width: 1020px; height: 580px; margin: 0 auto; position: relative;}
#main h1 { background: url(../img/logo.png) no-repeat; clear: both; float: none; height: 100px; width: 456px; overflow: hidden; position: absolute; z-index: 2; right: 10px; top: 20px; text-indent: -9999px; display: block; font-size: 1px; line-height: 1em;  }
#main h2 {background: url(../img/mainCopy.png) no-repeat 0 0; clear: both; float: none;height: 138px;width: 295px;  overflow: hidden; position: absolute; z-index: 2;left: -85px;top: 5px;text-indent: -9999px; display: block; font-size: 1px; line-height: 1em;}
#main h3 {background: url(../img/mainCopy3.png) no-repeat 0 0; clear: both; float: none;height: 67px;width: 135px;  overflow: hidden; position: absolute; z-index: 2;left: 50%;top: 102px;text-indent: -9999px; display: block; font-size: 1px; line-height: 1em;margin-left: -110px;}
#main .mainMovBt { position: absolute; z-index: 5; width: 284px; height: 130px;top: 200px;right: 20px;}
#main .mainMovBt a { width:100%; height:100%; display:block;}
#main .mainMovBt:hover{ opacity: .8; filter: alpha(opacity=80); -ms-filter: "alpha(opacity=80)"; -khtml-opacity: .8; -moz-opacity: .8;}
#main .mainMovBt:hover{ -moz-transition: opacity 0.3s ease-out 0s; -webkit-transition: opacity 0.3s ease-out 0s; -o-transition: opacity 0.3s ease-out 0s; -ms-transition: opacity 0.3s ease-out 0s; transition: opacity 0.3s ease-out 0s; }
#main .mainMovBt{-moz-transition: opacity 0.3s ease-out 0s; -webkit-transition: opacity 0.3s ease-out 0s; -o-transition: opacity 0.3s ease-out 0s; -ms-transition: opacity 0.3s ease-out 0s; transition: opacity 0.3s ease-out 0s; }
#main .mainMovBt:hover{filter: alpha(opacity=80); -moz-opacity: 0.8; opacity: 0.8;}

#main .mainMovBt2 { position: absolute; z-index: 5; width: 284px; height: 120px;top: 320px;right: 20px;}
#main .mainMovBt2 a { width:100%; height:100%; display:block;}
#main .mainMovBt2:hover{ opacity: .8; filter: alpha(opacity=80); -ms-filter: "alpha(opacity=80)"; -khtml-opacity: .8; -moz-opacity: .8;}
#main .mainMovBt2:hover{ -moz-transition: opacity 0.3s ease-out 0s; -webkit-transition: opacity 0.3s ease-out 0s; -o-transition: opacity 0.3s ease-out 0s; -ms-transition: opacity 0.3s ease-out 0s; transition: opacity 0.3s ease-out 0s; }
#main .mainMovBt2{-moz-transition: opacity 0.3s ease-out 0s; -webkit-transition: opacity 0.3s ease-out 0s; -o-transition: opacity 0.3s ease-out 0s; -ms-transition: opacity 0.3s ease-out 0s; transition: opacity 0.3s ease-out 0s; }
#main .mainMovBt2:hover{filter: alpha(opacity=80); -moz-opacity: 0.8; opacity: 0.8;}


#main .dicsBnr_theater {position:absolute;width: 456px;height: 70px;background: url(../img/mainBnr1.png) no-repeat 0 0;text-indent: -9999px;font-size: 1px;line-height: 1em;right: 10px;top: 127px;}
#main .dicsBnr_bdvd { position: absolute; width: 456px; height: 34px; top: 156px; right: 10px; background: url(../img/mainBnr2.png) no-repeat 0 0; text-indent: -9999px; font-size: 1px; line-height: 1em; }
#main .dicsBnr_rental { position: absolute;width: 323px;height: 50px;top: 202px; right: 10px;background: url(../img/mainBnr3.png) no-repeat 0 0; text-indent: -9999px; font-size: 1px; line-height: 1em;}
#main .socialBt {width: 980px; position: absolute; z-index: 5;top: 150px; left: 50%;margin-left: -490px;z-index: 5000;}
#main .socialBt li { display: block;/* float: left; */}
#main .socialBt li.fbBt {/* margin-left: 30px; */}
#main .socialBt li.twitterIE { display:none; margin-right: 30px;}
#main .socialBt li.twitterBt {/* margin-right: 30px; */}
.fb-like iframe,.item-facebook-like iframe {max-width: none !important; z-index:2000;}
#main .bnrSns { position: absolute; z-index: 10;top: 463px;left: 50%;  width: 960px; height: 50px; margin-left: -480px;display: block;}
#main .btTw { background: url(../img/bt-tw.gif) no-repeat 0px 0px; display: block; height: 50px; font-size: 1px; line-height: 1em; text-indent: -9999px; width: 50px; float: right; margin-right: 20px;}
#main .btFb { background: url(../img/bt-fb.png) no-repeat 0px 0px; display: block; height: 50px; font-size: 1px; line-height: 1em; text-indent: -9999px; width: 50px; float: right; margin-right: 20px;}
#main .btInsta { background: url(../img/btInsta.png) no-repeat 0px 0px; display: block; height: 50px; font-size: 1px; line-height: 1em; text-indent: -9999px; width: 50px; float: right;}
.fb_iframe_widget > span {vertical-align: baseline !important;}
.blackBox { background-color: rgba( 0, 0, 0, 0.7 ); color: #fff; }
p.blackBox { padding: 10px; margin-bottom: 0!important;}
@media screen and (max-width: 767px){
    #main {width: 100%;height: auto;background-size: 140% auto;padding-top: 110.15%;background-position: -3% -10%;}
    #main h1 {height: auto;width: 84.35%;top: 61%;right: 0;left: 50%;margin-left: -42.17%;background-size: 100% auto;padding-top: 18.59%;}
	#main h2 { height: auto;width: 40%;top: 0;left: -10%;padding-top: 80%;background-size: 100% auto;}
    #main h3 { height: auto;width: 25%;top: 10%;left: 57%;padding-top: 10%;background-size: 100% auto;margin-left: 0;}
    /*#main .mainMovBt { width: 30%; height: auto;top: 68%; left: 63%; margin-left: 0; position: absolute; border:1px solid red;}	*/
    #main .mainMovBt { width: 100%; height: auto;top: 100%; left: 0; margin-left: 0; position: absolute;}	
    #main .mainMovBt2 { width: 100%; height: auto;top: 133%; left: 0; margin-left: 0; position: absolute;}	
    #main .socialBt {width: 62%;  top: 91.45%;margin-left: -42.17%;left: auto;right: 5%;}
	#main .socialBt li.fbBt { margin-left:3%;}
	#main .dicsBnr_theater {width: 84.35%;height: auto;left: 50%;right: 0;top: 78.15%;margin-left: -42.17%;background-size: 100% auto;padding-top: 15%;}
	#main .dicsBnr_bdvd { width: 84.35%; height: auto; left: 50%;top: 74%;  margin-left: -42.17%;padding-top: 6.25%;background-size: 100% auto;}
	#main .dicsBnr_rental { width: 70%;background-size: 100% auto; height: auto;padding-top: 12%;top: 80%; right: 0;left: 50%;margin-left: -35%;}
	#main .bnrSns {width: 30%; height: auto;margin-left: 0;left: 5%;top: 90.5%;}
	#main .btTw, #main .btFb, #main .btInsta { height: auto;width: 25%;margin-right: 8%;padding: 25% 0; background-size: 100% auto; float: left;}
	#main .socialBt li { float:right;}
	#main .socialBt li.fbBt {margin-right: .5em;margin-left: 0;}
}

/*Navi*/
#glNavi {width: 1000px;width: 948px;margin:-5px auto 0;padding: 47px 20px;background:url(../img/bgFrame.png) repeat-x 0 0;position:relative;z-index: 1000;top: -45px;}
#glNavi:before { content: " "; width:25px; height: 90px; background:url(../img/frameBefore.png) no-repeat 0 0; position:absolute; top: 0; left: -2%; display: block; text-align: left; }
#glNavi:after { content: " "; width:25px; height: 90px; background: url(../img/frameAfter.png) no-repeat 0 0; position:absolute; top: 0; right: -2%; display: block; text-align: right; visibility: visible; }
#glNavi li { height: 40px; display: block; float: left; margin-top: -20px; text-align: center; text-indent: -99999px; font-size: 1px; line-height: 1em; border-right: 2px solid; border-color:rgba(255,255,255,0.3);}
#glNavi li a { width:100%; height:100%; display:block;}
#glNavi li:hover a{ opacity: .6; filter: alpha(opacity=60); -ms-filter: "alpha(opacity=80)"; -khtml-opacity: .6; -moz-opacity: .6;}
#glNavi li:hover a{ -moz-transition: opacity 0.3s ease-out 0s; -webkit-transition: opacity 0.3s ease-out 0s; -o-transition: opacity 0.3s ease-out 0s; -ms-transition: opacity 0.3s ease-out 0s; transition: opacity 0.3s ease-out 0s; }
#glNavi li:hover a {-moz-transition: opacity 0.3s ease-out 0s; -webkit-transition: opacity 0.3s ease-out 0s; -o-transition: opacity 0.3s ease-out 0s; -ms-transition: opacity 0.3s ease-out 0s; transition: opacity 0.3s ease-out 0s; }
#glNavi li:hover a{filter: alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.6;}
#glNavi #navi1 a {width: 115px;background: url(../img/nav1.png) no-repeat 50% 0;width: 136px;}
#glNavi #navi2 a {width: 215px;background: url(../img/nav2.png) no-repeat 50% 0;width: 232px;}
#glNavi #navi3 a {width: 150px;background: url(../img/nav3.png) no-repeat 50% 0;width: 166px;}
#glNavi #navi4 a {width: 168px;background: url(../img/nav4.png) no-repeat 50% 0;width: 183px;}
#glNavi #navi5 a { width: 140px; background: url(../img/nav5.png) no-repeat 50% 0;}
#glNavi #navi6 a {width: 190px;background: url(../img/nav6.png) no-repeat 50% 0;width: 222px;}
#glNavi #navi6 {border-right: none;}
@media screen and (max-width: 767px){
    .js-clingify-placeholder { display:none;}
    #sNavi { position: fixed; width: 100%; font-size: 90%; z-index: 1000; top: 10px; right: 10px;z-index: 10000;}
    #sNavi li {border-top: 1px solid #841195; background: url(../img/iconArrow2-2.png) no-repeat 94% 50% #670073; background-size: auto 30%;font-size: 14px;}
    #sNavi li a { padding:1em 2em; color: #fff !important;text-decoration: none;position: relative;}
	#sNavi li a:before { display: block;content: "";position: absolute;-webkit-transform: rotate(45deg);transform: rotate(45deg);top: 50%;right: 20px;width: 8px;height: 8px;margin-top: -4px;background: #FFFFFF;}
	#sNavi li a:after {display: block;content: "";position: absolute;-webkit-transform: rotate(45deg);transform: rotate(45deg);top: 50%;right: 24px;width: 8px;height: 8px;margin-top: -4px;background: #670073;}
	#sNavi dt.sNaviBt { content: ''; display: block; float: right; height: 100%; margin: 0; width: 14%;  position: relative; top: 0; right: 0; padding-top: 14%; cursor: pointer; background: #670073; z-index: 1001;}
	#sNavi dt.sNaviBt.selected {}
	#sNavi dd { float:right; width: 94%; display: none;background: #62B8DB url(../img/logo.png) no-repeat 50% 2%; position: absolute; top: 0; right: 0; padding-top: 16%; background-size: 57% auto;}
	.menu-trigger,.menu-trigger span {display: inline-block;transition: all .4s;box-sizing: border-box;}
	.menu-trigger {position: absolute;width: 24px;height: 24px;top:50%;left:50%; margin:-12px;}
	.menu-trigger span {position: absolute;left: 0;width: 100%;height: 3px;background-color: #fff;border-radius: 4px;}
	.menu-trigger span:nth-of-type(1) {top: 0;}
	.menu-trigger span:nth-of-type(2) {top: 10px;}
	.menu-trigger span:nth-of-type(3) {bottom: 0;}
	.sNaviBt.selected .menu-trigger span:nth-of-type(1) {-webkit-transform: translateY(10px) rotate(-45deg);transform: translateY(10px) rotate(-45deg);}
	.sNaviBt.selected .menu-trigger span:nth-of-type(2) {opacity: 0;}
	.sNaviBt.selected .menu-trigger span:nth-of-type(3) {-webkit-transform: translateY(-10px) rotate(45deg);transform: translateY(-10px) rotate(45deg);}
	
}

/*letter*/
#letter h1 { width: 900px; margin: 0 auto; z-index: 100; }
#letter p { margin-bottom:2em;}
#letter .letBox {padding: 20px 0 60px; position: relative; display: block;}
#letter .letBox:after {content: " "; position: absolute; display: block; height: 132px; width: 30px;bottom: -66px;left: 50%; margin-left: -15px;z-index: 1;}
@media screen and (max-width: 767px){
    #letter, #letter h1 { width: 100%;}
    #letter .letBox {padding: 1em 0;  margin-top: 0;}
    #letter .letBox:after { }
}

/*lead */
#lead { height: 740px;}
#lead h1{ width: 560px; margin: 30px 0 10px -25px; float: left; }
#lead .leadPhoto { width: 355px; padding-top: 15px; text-align: center; float: right; }
#lead p { width: 495px; float: left; background: #F39800;color: #fff;padding: 20px;}
#lead .frameBlack { width: 330px; height: 162px; position: absolute; right: 3%; top: 95%;}
#lead .frameBlack img { width:100%;height:auto;}
@media screen and (max-width: 767px){
	#lead { margin-top: -3%; height: auto;}
    #lead h1{ width: 96%; margin: 0 auto; float: none; }
    #lead .w900 { width:100%}
    #lead .leadPhoto { width: 100%; float: none; margin: -10% 0 3%; }
    #lead .leadPhoto img { width: 35%; height: auto; float: none; }
    #lead p { width: 90%; float: none; text-align:left; margin: 0 auto;}
    #lead .frameBlack {position: static; width: 90%;height: auto; right: 0;top: 0; padding: 0;line-height: 100%;}
}

/*tub*/
#letter .tab {  margin-top: 35px; overflow: visible; position: relative;margin-right: -20px;}
#letter .tab li:hover {opacity: .6; filter: alpha(opacity=60); -ms-filter: "alpha(opacity=60)"; -khtml-opacity: .6; -moz-opacity: .6;}
#letter .tab li:hover{ -moz-transition: opacity 0.3s ease-out 0s; -webkit-transition: opacity 0.3s ease-out 0s; -o-transition: opacity 0.3s ease-out 0s; -ms-transition: opacity 0.3s ease-out 0s; transition: opacity 0.3s ease-out 0s; }
#letter .tab li{ -moz-transition: opacity 0.3s ease-out 0s; -webkit-transition: opacity 0.3s ease-out 0s; -o-transition: opacity 0.3s ease-out 0s; -ms-transition: opacity 0.3s ease-out 0s; transition: opacity 0.3s ease-out 0s;  }
#letter .tab li:hover{filter: alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.6; }
#letter .tab li{text-align: center;width: 177px;float:left; cursor: pointer;z-index: 51;  margin-right: 20px;}
#letter .tab li.select {position: relative;}
#letter .tab li.select:before {content:"."; position:absolute; top: -35px; left:0; right:0; margin: auto; background:url(../img/iconArrow.png) no-repeat 50% 100%;}
#letter .tab li a span { color: #FBFF71; line-height: 150%; padding: .5em 0 1em; display: inline-block;}
#letter .tab li img { width:100%; height:auto;}
#letter .tubContent { z-index: 1000;display: block;position: relative;}
#letter .tubContent li {}
#letter .hide {display:none;}
#letter .tabDisc { margin-bottom: 35px;color: #E40019;}
#letter .tabDisc li{background: #FFF; color: #E40019; padding: 15px 0; float:left;cursor: pointer;width: 25%;display: block;text-align: center;font-size: 1.6em;  font-weight: 700;letter-spacing: .1em; position:relative; }
#letter .tabDisc li.selectDisc:after { content:""; position:absolute; top:100%; left:0; right:0; margin: auto; background: url(../img/iconArrow3.png) no-repeat 50% 100%;z-index: 200;width: 41px;height: 21px;}
#letter .tubContentDisc { }
#letter .tubContentDisc h3 { font-size: 1.4em; line-height: 100%;}
#letter .tubContentDisc .fr h3 { font-size: 18px; font-weight: bold; margin-bottom: 3%; padding-top: 0;}
@media screen and (max-width: 767px){
    #letter .tab { background-position-y: 36%; font-size: 13px;margin-top: 7%;margin-right: -2%;}
	#letter .tab li { width: 23%;margin-right: 2%;}
	#letter .tabDisc li{ font-size: 1em; padding: .5em 0; }
	#letter .tab li:hover {opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha(opacity=100)"; -khtml-opacity: 1; -moz-opacity: 1;}
	#letter .tab li:hover{ -moz-transition: opacity 0s ease-out 0s; -webkit-transition: opacity 0s ease-out 0s; -o-transition: opacity 0s ease-out 0s; -ms-transition: opacity 0s ease-out 0s; transition: opacity 0s ease-out 0s; }
    #letter .tab li a span { font-size: 80%; padding-bottom: 0;}
    #letter .tab li.select:before {background-size: 20% auto;top: -35%;}
	#letter .tab li:hover{filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1; }
    #letter .tabDisc li.selectDisc {background-size: auto 10%;}
    #letter .tabDisc li.selectDisc:after { background-size:50% auto; top:80%;}
    #letter .tubContentDisc h3 {font-size: 22px; padding-top: 3%;}
}
@media screen and (max-width: 480px){
	#letter .tab li.select:before {top: -30%;}
}


/*watch*/
#watch h1 {position: relative; z-index: 9; }
#watch .blackBox { margin-top: -40px;padding-bottom: 30px; padding-top: 65px; z-index: auto;}
#watch .movImg1 { width: 940px; height: auto; text-align: left; background: url(../img/characterImg1.png) no-repeat 0 0; position: absolute; z-index: 10; top:10px; left: 49.5%; margin-left: -465px; padding-bottom: 200px; }
.movieBox { position: relative; width: 770px;padding-top: 433px; margin: 0 auto;}
.movieBox iframe { position: absolute; top: 0; right: 0; width: 100% !important;height: 100% !important;}
@media screen and (max-width: 767px){
	#watch { margin-top: 3%; }
	#watch h1 { width: 88%; }
	#watch .movImg1 { width: 100%; height: auto; top: 2%; left: 5.5%; margin-left: 0; padding: 20% 0 ; background-size: 22.5% auto; }
	#watch .blackBox { margin-top: -6%; padding-bottom: 3%; padding-top: 10%; margin-bottom: 1em;}
	.movieBox { width: 100%; padding-top: 54.5%; margin: 0 auto;}
}

/*intro*/
#intro {margin-top: 60px !important; background: url(../img/bgIntro.jpg) no-repeat 0 0; background-size: auto 100%; -moz-background-size: auto 100%; -webkit-background-size: auto 100%; -o-background-size: auto 100%; -ms-background-size: auto 100%;}
#intro h1 { position:relative;z-index:200; display:block;}
#intro h2 { font-size: 20px; text-align: left; position: relative; z-index: 10; }
#intro h2 span { text-indent: 100%; white-space: nowrap; overflow: hidden;}
#intro .intro1 h2 span {width: 462px;height: 120px; background: url(../img/introTxt1.png) no-repeat 0 0; background-size: 100% auto; display: block; margin-top: 10px;}
#intro p { width: 435px;  margin-top: 25px; }
#intro .intro1 { position:relative; }
#intro .intro1 .introPh, #intro .intro2 .introPh { z-index:1;}
#intro .intro1 .introPh img { width: auto; height: auto; max-width: 100%; max-height:600px; position:absolute; top:0; right:0;margin: -240px auto 0; z-index:1;}
#intro .intro1 .introTxt { width: 900px; margin: 0 auto; position:relative; z-index: 10;}
#intro .intro1 p { font-size: 18px; font-weight: bold; }
#intro .intro2 { width: 900px;margin: 100px auto 0; position: relative;padding-bottom: 40px;}
#intro .intro2 .introTxt { width: 55.6%; }
#intro .intro2 p, #intro .intro3 p, #intro .intro4 p { position:relative; z-index: 10; margin-top: 0; margin-left: 60px; }
#intro .intro2 h2, #intro .intro3 h2, #intro .intro4 h2{ background: url(../img/bgSpider.png) no-repeat 0 0; margin-bottom: 0; padding: 40px 0 27px 60px;background-size: auto 100%;}
#intro .intro2 .inPh1 {position: absolute;}
#intro .intro2 #Jonathan { position: absolute; z-index: 100;top: 40%; left: 0;}
#intro .intro3 { width: 950px; margin: 0 auto;position: relative;height: 300px;}
#intro .intro3 h2 { margin: 0 auto; width: 630px; }
#intro .intro3 .fl { width:400px; display:block;position:absolute; top:0; left:0;}
#intro .intro3 .fr { position: absolute; width: 100%; top: 0; left: 0; height: 100%;}
#intro .intro3 #Dennis { position: absolute;right: -50px;top: 0;}
#intro .intro3 #Mavis {position: absolute; right: 0;top: -40px;}
#intro .intro4 { width: 900px; margin: 0 auto; position: relative; }
#intro .intro4 p { width: 87.5%; }
#intro .intro4 .introTxt { width: 49.4%; }
#intro .intro4 .introPhBox { position:absolute;top: -30px;}
#intro .intro4 #Dennis { position: absolute; z-index: 100; top:40%; left: 0;}
@media screen and (max-width: 767px){
	#intro {margin-top: 0 !important;  width: 100%;}
	#intro h1 { width: 85%; margin-left: 20%; }
	#intro h2 { font-size: 110%; }
	#intro .intro1 h2 span { width: 88%; height: auto; background-size: auto 100%; display: block;padding-bottom: 11%; margin: 0 auto;}
	#intro p { width: auto;  margin: 3% auto 0; }
	#intro .intro1 p { font-size: 98%; width: 88%;}
	#intro .intro1 .introPh img {   margin: 0;position: static;max-height: 100%;padding: 1em 0;}
	#intro .intro1 .introTxt { width: 100%; }
	#intro .intro2 { width: 88%; margin: 0 auto; position: static;padding-bottom: 0;}
	#intro .intro2 .introTxt { width: 100%;margin: 0 auto 2em;}
	#intro .intro2 .inPh1 { position:static;}
	#intro .intro2 p,#intro .intro4 p {margin: 0 auto 1em;}
	#intro .intro2 h2, #intro .intro3 h2, #intro .intro4 h2 {background-size: 15% auto;background-position: -3% 50%;padding: 3% 0 3% 15%;}	
	#intro .intro3 .fl { position:static;width: auto;}
	#intro .intro3 .fr { position:static;width: 90%;margin: 0 auto;}
	#intro .intro4 { width: 88%; }
	#intro .intro4 p { width: auto; }
	#intro .intro4 .introTxt { width: 100%; }
	.introPhBox { /* width: 88%; */margin: 0 auto;}
	.introPhBox .inPh1 { width: 56.25% !important;float: right;margin-top: 0 !important;margin-right: 0;}
	.intro4 .introPhBox img { margin-top:1em !important;}
	#intro .intro2 #Jonathan {position: static; top: 0;width: 41.7%;float: left;/* margin-left: 3%; */}
    #intro .tCenter { width:88%; margin:1em auto;}
    #intro .intro3 { width:88%; margin: 0 auto;height: auto;}
    #intro .intro3 p { width:auto;margin: 0;}
    #intro .intro3 h2 { width: auto; }
    #intro .intro4 h2 { width:auto;}
    #intro .intro4 .introPhBox { position:static; top:0;}
}

/*story*/
#story { background: url(../img/bgStory.png) no-repeat 50% 0; padding-bottom: 50px; }
#story h1 { text-align: center; margin: 0 auto 20px; padding-top: 50px; }
#story .fr { margin-top: -55px; padding-left: 15px; }
@media screen and (max-width: 767px){
	#story { background-size: auto 100%;padding: 0; margin-bottom: 2em;}
	#story h1 {width: 53.28%;margin: 0 auto 1em;}
	#story .fl { float: left;width: 42.5%;}
	#story .fr {width: 34.8%;margin-top: 0;padding: 0; float: right;}
}

/*cast*/
#cast { width: 100%; height: auto; background: url(../img/bgCharacter.jpg) no-repeat 50% 0; overflow: hidden; background-size: auto 100%; -moz-background-size: auto 100%; -webkit-background-size: auto 100%; -o-background-size: auto 100%; -ms-background-size: auto 100%;}
#cast h1 { text-align: center; margin-top: 30px;}
#cast .ulCast { width: 1029px;  margin: 0 auto;padding: 40px 0 20px 9px;}
/*#cast .ulCast li {width: 196px; display: block; float: left;   margin-right: 9px;}*/
#cast .ulCast li {width: 162px; display: block; float: left;   margin-right: 9px;}
#cast .ulCast img { width: 100%; height: auto;}
#cast .ulCast li h3{ font-weight: bold; margin-bottom: 0; line-height: 120%;}
#cast .ulCast li p { margin-bottom: 10px; }
#cast .ulCast li a { display: block; padding: 10px 80px 10px 90px; color: #E40019; font-size: 1.6em; letter-spacing: .1em; position:relative; vertical-align: middle; background:url(../img/iconArrow2.png) no-repeat 40px center; width: 70%;margin: 0 auto;}
@media screen and (max-width: 767px){
	#cast { background-size: auto 100%;}
	#cast h1 {width: 53.28%;margin: 0 auto;}
	#cast .ulCast {width: 66.8%;padding: 1em 0;}
	#cast .ulCast li {width: 45%;padding: 0 2%;margin-right: 0;}
	#cast .ulCast img {}
	#cast .ulCast li h3 {}
	#cast .ulCast li p {}
	#cast .ulCast li a {}
	.zoom { width: 80%; margin:0 auto; text-align:center; background: url(../img/bgPattern.jpg) no-repeat 50% 80%; margin-top: 1em; padding: 0.5em 0; border: #B1834A solid 4px;}
	.zoom a { color:#fff; text-decoration:none;}
	.zoom span { display:block;background: url(../img/arrowR.png) no-repeat 10% 50%;background-size: auto 70%;}
}


/*staff*/
#staff h2 {background: #1F75A5;width: 850px;margin: 1em auto 0;padding: .5em 25px;font-size: 17px;text-align: left;}
#staff table { width: 900px; margin:10px auto 0; }
#staff tr { border-bottom: #B1834A solid 1px; padding-top: 20px; }
#staff tr.borderNone { border-bottom: none;  }
#staff th {width: 36%; background: url(../img/star.png) no-repeat 0 1.2em; vertical-align: top; padding: 0 18px; font-weight: bold;}
#staff td {/* width: 23%; */ vertical-align: top;}
#staff td.staffWork { width: 35%; }
#staff th, #staff td { padding-top: 10px; padding-bottom: 10px; }
#staff .staffTub2 th {width: 36%;}
#staff .staffTub2 td {width: auto;}
@media screen and (max-width: 767px){
	#staff { width: 88%;margin: 0 auto; padding: 0;}
	#staff h1 { margin-bottom:3%;}
	#staff h1 img {width: 40%;}
	#staff h2 { width:auto; padding:.5em 1em;font-size: 15px;}
	#staff table {width: 100%;margin: 0;}
	#staff tr { padding: 0.5em 0;}
	#staff tr.borderNone {}
	#staff th {width: 100% !important;display: block;padding: 0.5em 0 0 1em;background-position: 0 0.8em;}
	#staff td {width: 100% !important;display: block;padding: 0.2em 0;}
	#staff td.staffWork { width: 100%;padding: 0.2em 0;}
}

.cloudBg {background: url(../img/bgIntro.jpg) no-repeat 0 0; background-size: auto 100%; -moz-background-size: auto 100%; -webkit-background-size: auto 100%; -o-background-size: auto 100%; -ms-background-size: auto 100%;}

/*theater*/
#theater h1 { text-align: center; margin: 20px auto; }
#theater .tCenter { margin-top: -35px;}
@media screen and (max-width: 767px){
	#theater { width: 88%;margin: 0 auto 2em;}
	#theater h1 { width: 53.28%;margin: 0 auto;}
	#theater .tCenter { margin-top: 0px;}
}

/*music*/
#music {width: 800px; margin:0 auto 2em; padding:20px;/* background:url(../img/musicBg.png) repeat 0 0; */border-top: solid 2px #8B3B6B;border-bottom: solid 2px #8B3B6B;}
#music h1 {font-size: 15px;margin-bottom: .5em; font-weight:normal;}
#music img { width:100%; height:auto;}
#music p { margin:0;font-size: 13px;}
#music .fl {width: 130px;line-height: 100%;}
#music .fr {width: 640px;}
@media screen and (max-width: 767px){
	#music {width: 60%;padding: 3% 0;}
	#music .fl { width:35%; margin:0 auto 1em}
	#music .fr { width:100%;}
}

/*product*/
#product h1 {position: relative; z-index: 50; }
#product .productBox { margin-top: -40px; margin-left: 1px; margin-bottom: 20px; padding-bottom: 30px; padding-top: 65px;}
#product .blackBox { padding-bottom: 30px; }
#product h2 { width: 820px; margin: 0 auto; padding: 15px 0; background: url(../img/bgTitle.png) no-repeat 50% 50%; font-size: 22px;}
#product h3 { background: url(../img/bgSpider.png) no-repeat 0 0; margin-left: -40px; padding: 30px 0 52px 60px; font-size: 22px;line-height: 180%;}
#product h3.bBoxTitle { background: url(../img/bgSpider.png) no-repeat 33% 0; padding-bottom: 52px;}
#product h4 { text-align: center; background: #670073; font-size: 13px; margin-bottom: 10px; padding: 2px 0; }
#product p { margin:-40px auto 15px; text-align: center; font-size: 22px; font-style: normal; }
#product .fl { width: 380px; padding-top: 30px;}
#product .fr { width: 410px;}
#product table { margin: -40px auto 20px;font-size: 13px; line-height: 150%;}
#product table th { vertical-align: top; }
#product .buyBox {width: 350px; background: url(../img/bgPattern.jpg) no-repeat 50% 80%; margin-top: 10px; padding:5px; border: #B1834A solid 4px;}
#product .ulList { display:block; margin-bottom: 15px;font-size: 12px; line-height: 180%;}
#letter .buylink { margin: 0 auto; line-height: 100%;}
#letter .buylink .list { margin: 0px auto; padding: 10px 10px 0; }
#letter .buylink .list img { width: 100%; height: auto;filter: alpha(opacity=40); -moz-opacity: 0.4; opacity: 0.4; }
#letter .buylink .list a img {filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1;}
#letter .buylink .ev { margin: 0 2.2% 5px; display: block; width: 45.5%; text-align: center; float: left;}
#letter .digital .buylink { background: url(../img/bgPattern.jpg) no-repeat 50% 70%; padding: 15px 5px 10px; border: #B1834A solid 4px; }
#letter .digital .buylink h4 { color:#000; font-weight:normal; padding-left: 10px;}
#letter .digital .buylink .list {padding: 0; text-align: center; }
#letter .digital .buylink .list img { height: 41px; width: 113px; margin: 0 5px 5px;width: 100px;height: 36px;}
#letter .digital .buylink .ev { margin: 0 auto; display: block; text-align: center; float: none;}
#letter .digital .buylink .ev img { width: 44.5% }
#letter .digital h4 { margin-bottom: 0; background: #B1834A; font-size: 13px; font-weight: bold; color: #000;}
.uline {border-bottom: solid 1px #7F4718;padding-bottom: 30px;margin-bottom: 30px;padding-top: 10px;}
@media screen and (max-width: 767px){
    #product { padding-bottom: 5% !important;}
    #product h1 { width: 88%; margin: 0 auto 0em;}
    #product h2 { width:92%; margin: 0 auto 4%;background: url(../img/bgTitle-s.png) no-repeat 0 0;background-size: 100% auto;padding: 1.2em 0;}
    #product h3 { padding: 1em 0em 2.5em 0em;text-align: center; margin-left: 0;background-size: auto 100%; margin-bottom: 0;line-height: 160%;font-size: 20px;}
    #product .w920 { width:92%}
    #product p {text-align: center;font-size: 14px;line-height: 160%;}
    #product .fl { width: 90%;  padding-top: 0;}
    #product .fr { width: 100%;}
    #product .fr h4 {font-size: 15px;}
    #product .buyBox { width: auto;margin-bottom: 2.5em;}
    #product .proTit2 { width:90%; margin:0 auto; padding-bottom:1em}
    .ulList {}
    .ulList li {}
    .uline {padding: .5em 0;}
	#letter .digital .buylink .list img { height: 10%; width: 20%; margin: 0 3% 3%;}
	#letter .digital .buylink { padding: 4%;}
    #letter .digital .buylink h4 { font-size: 15px;text-align: left; margin-bottom: 3%; padding-left: 0;}
    #letter .digital .buylink .list {}
    #letter .digital .buylink .list a { display: inline;}
    #letter .digital .buylink .list img {width: 30%; height: auto; margin: 1%;}
    #letter .digital .buylink .fl { width: 100%; border-right: none; border-bottom: 1px solid #948e8c; margin: 0 0 5% 0;padding-bottom: 3%;}
    #letter .digital .buylink .fr { width: 100%;}
    #letter .digital .buylink .ev { width:100%;}
}
@media screen and (max-width: 580px){
	#product h1 {margin: 0 auto 0.4em;}
	#product h2 { padding:0.8em 0;}
}
@media screen and (max-width: 480px){
	#product h1 {margin: 0 auto 0.8em;}
	#product h2 { padding:0.5em 0;}
}
@media screen and (max-width: 340px){
	#product h1 {margin: 0 auto 1em;}
	#product h2 { padding:0.4em 0;font-size: 20px;}
}

#cinemaBnr {position: absolute;top: 434px;left: 50%;margin-left: 80px;padding-right: 0;width: 187px;height: 79px;z-index: 50;}
#cinemaBnr:hover { filter:alpha(opacity=70);-moz-opacity: 0.7;opacity:.7;}
#cinemaBnr img { width:100%; height:auto;}
@media screen and (max-width: 767px){
		#cinemaBnr {width: 90%;top: auto;left: auto;height: auto;position: static;margin: 0;padding: 1% 5% 3%;background: #B1DAEC;}
		#cinemaBnr:hover { filter:alpha(opacity=100);-moz-opacity: 1;opacity:1;}
}


#bddvdcontent .footBg { height: 505px; background: url(../img/bgFoot.png) no-repeat 50% 0; overflow: hidden; background-size: 100% auto; -moz-background-size: 100% auto; -webkit-background-size: 100% auto; -o-background-size: 100% auto; -ms-background-size: 100% auto;}
#bddvdcontent .footBt { background: url(../img/officialBt.png) no-repeat 0px 0px; height: 310px; font-size: 1px; line-height: 1em; text-indent: -9999px; width: 706px; display: block; margin:0 auto;}
#bddvdcontent .pagetop { width: 100px; display: block; }
#bddvdcontent .footIn { margin-top: 330px; background: none; }
#bddvdcontent .copy {  width: 1000px; margin: 0 auto; padding-bottom:25px; }
#bddvdcontent .copy .fl { width: 860px;/* padding-top: 60px; */}
#bddvdcontent .copy p { margin-bottom: 10px; font-size: 12px; color: #fff; line-height:150%; }
@media screen and (max-width: 767px){
    #bddvdcontent .footBg { height: auto; background-position: 0 0;padding-top: 41.56%;}
    #bddvdcontent .footBt { width: 95%; height: auto; padding-top: 22.2%; padding-bottom:20%; background-size: 100% auto; -moz-background-size: 100% auto; -webkit-background-size: 100% auto;-o-background-size:100% auto;-ms-background-size:100% auto;}
    #bddvdcontent .pagetop { }
	#bddvdcontent .footIn { margin-top: 0; background: #132538; }
    #bddvdcontent .copy {width: 90%; margin: 0 auto;padding: 3% 0;line-height: 110%;}
    #bddvdcontent .copy .fl { width: auto;padding-top: 0;}
    #bddvdcontent .copy .eirin { width:15%; height:auto;}
    #bddvdcontent .copy p {}
}


#spejFoot{ background:#000000; width:100%; padding:0 0 10px 0; position:relative;}
#spejFoot #spejLogo{display: block; margin:0 auto; padding:20px 0 0 0;text-align:center; line-height:2em; color:#889096;font-size: 90%;}
#spejFoot #spejLogo img{width:30px; height:auto; margin-right:20px; display:inline-block; vertical-align:middle;}
#spejFoot #spejLogo span{line-height:1.5em; display:inline-block; text-align:left; padding:8px 0 0 0; text-decoration:underline;}
#spejFoot #spejLogo:hover span{ color:#303030;}
#spejFoot #spejLogo:hover img{ opacity:1;}
#spejFoot #footer{}

#bddvd #footer {width: 960px;padding-bottom: 3em;}
#bddvd #footer #footerinfo {text-align:left}
#bddvd #footer #footerinfo a:link,#bddvdcontent #footer #footerinfo a:active{color: #999;}
#bddvd #footer #footerinfo a:visited{color: #666;}
#bddvd #footer #footerinfo a:hover{color: #999}
#bddvd #footer #footerlegal ul{text-align:left;color:#666}
#bddvd #footer #footerlegal ul a:link,#bddvdcontent #footer #footerlegal ul a:active{color: #999;}
#bddvd #footer #footerlegal ul a:visited{color: #666;}
#bddvd #footer #footerlegal ul a:hover{color: #999}
#bddvd #footercopyright {color: #FFF;}
@media screen and (max-width: 767px){
    #bddvd #footer { width:100%; padding-bottom: 9em;}
    #bddvd #footer a { display: inline;}
    #bddvd #footer #footerintl { width: 100%; margin:0 auto; padding: 0; text-align: center;}
    #bddvd #footer #footerintl img { width: 13%;}
    #bddvd #footer_intl_icon { text-align: left; padding-left: 30px;}
    #bddvd #footer #footerinfo { width:90%; margin:0 auto; padding-top: 3em; display: block; text-align: center;}
    #bddvd #footer #footerlegal ul { width:90%; margin:0 auto; padding-top: 2em; text-align: center;}
    #bddvd #footer #footerlegal li,#bddvdcontent #footer #footerinfo li{font-size: 13px;}
    #bddvd #footercopyright { width:100%; display: block;}
}

.page-top{height: 31px;width: 150px;display: block;　background-image: url(../img/top-bt.png);	background-repeat: no-repeat;background-position: 0px 0px;margin-top: -71px;margin-left: 785px;	margin-bottom: 40px;}
.page-top a {display: block;height: 31px;width: 150px;text-indent: -9999px;}
#pagetop { display: none;}
@media screen and (max-width: 767px){
	#pagetop {display: block; position: fixed; bottom: 10px;right: 15px; width: 15%; z-index: 10000; width: 46px;opacity: 1;}
}


/*clearfix*/
.clearfix { zoom:1;/*for IE 5.5-7*/ }
.clearfix:after {/*for modern browser*/ content:""; display: block; height:0; clear: both; visibility: hidden; }
