
#original{
width:100%;
padding:30px 0;
text-align:center;
}

#bnrArea{
width:100%;
padding:0 0 5px 0;
}

#bnrArea img{
margin:3px 0;
}

.btnoff{ display: none;}


/*-------------------------------------------

main

-------------------------------------------*/

#mainTopAll{
width: 375px; height: 525px;
margin: 0 auto;
position: relative;
overflow: hidden;
}

@-webkit-keyframes fadeanm {
from { opacity: 0; }
to   { opacity: 1; }
}
@keyframes fadeanm {
from { opacity: 0; }
to   { opacity: 1; }
}

@-webkit-keyframes scalelogo {
0% { transform: scale(1.8, 1.8) translateY(-15%) rotateZ(10deg);}
100%{ transform: scale(1.0, 1.0) translateY(0) rotateZ(0);}
}

@keyframes scalelogo {
0% { transform: scale(1.8, 1.8) translateY(-15%) rotateZ(10deg);}
100%{ transform: scale(1.0, 1.0) translateY(0) rotateZ(0);}
}

@-webkit-keyframes scalebg {
0% { transform: scale(1.1, 1.1); opacity: 1;}
100%{ transform: scale(1.0, 1.0); opacity: 1;}
}

@keyframes scalebg {
0% { transform: scale(1.1, 1.1); opacity: 1;}
100%{ transform: scale(1.0, 1.0); opacity: 1;}
}

@-webkit-keyframes scalecast {
0% { transform: scale(1.4, 1.4); opacity: 1;}
100%{ transform: scale(1.0, 1.0); opacity: 1;}
}

@keyframes scalecast {
0% { transform: scale(1.4, 1.4); opacity: 1;}
100%{ transform: scale(1.0, 1.0); opacity: 1;}
}

@-webkit-keyframes scaleanm {
0% { transform: scale(1.8, 1.8); opacity: 0;}
100%{ transform: scale(1.0, 1.0); opacity: 1;}
}

@keyframes scaleanm {
0% { transform: scale(1.8, 1.8); opacity: 0;}
100%{ transform: scale(1.0, 1.0); opacity: 1;}
}

@-webkit-keyframes scaleobi {
from { transform: scale(2, 2) rotate(50deg) translateY(-150px);opacity: 0;}
to   { transform: scale(1.0, 1.0) rotate(0deg)  translateY(0); opacity: 1;}
}

@keyframes scaleobi {
from { transform: scale(2, 2) rotate(50deg) translateY(-150px);opacity: 0;}
to   { transform: scale(1.0, 1.0) rotate(0deg)  translateY(0); opacity: 1;}
}

@-webkit-keyframes scaletokei {
0% { transform: scale(.7, .7) translateY(0) rotateZ(-120deg);}
100%{ transform: scale(1.0, 1.0) translateY(0) rotateZ(0);}
}

@keyframes scaletokei {
0% { transform: scale(.7, .7) translateY(0) rotateZ(-120deg);}
100%{ transform: scale(1.0, 1.0) translateY(0) rotateZ(0);}
}


#mainBG{
background: #fdfcfa url("../images/top3/main_bg.jpg") no-repeat center;
background-size: 100% 100%;
width:100%; height:100%;
position:absolute;
top:0; left:0;
z-index:1;
-webkit-animation: 2s scalebg .5s  forwards;
animation: 2s scalebg .5s forwards;
}

#mainCast{
background: url("../images/top3/main_cast.png") no-repeat center;
background-size: 100% 100%;
width:100%; height:100%;
position:absolute;
top:0; left:0;
z-index:3;
-webkit-animation: 2s scalecast .5s  forwards;
animation: 2s scalecast .5s forwards;
opacity: 0;
}

#ribbon{
background: url("../images/top3/ribbon.png") no-repeat bottom;
background-size: contain;
width: 375px; height: 130px;
position:absolute;
top: 310px; left: 0;
z-index:5;
-webkit-animation: 2s scalelogo .3s  forwards;
animation: 2s scalelogo .3s forwards;
}

#tokei{
background: url("../images/top3/main_tokei.png") no-repeat bottom;
background-size: contain;
width: 300px; height: 300px;
position:absolute;
top: 53px; left: 39px;
z-index:2;
-webkit-animation: 3s scaletokei .3s forwards;
animation: 3s scaletokei .3s forwards;
}

#logo{
background: url("../images/top3/logo.png") no-repeat bottom;
background-size: contain;
width: 375px; height: 130px;
position:absolute;
top: 310px; left: 0;
z-index:10;
-webkit-animation: 2.2s scalelogo .5s forwards;
animation: 2.2s scalelogo .5s forwards;
}

#mask{
background: url("../images/top3/mask.png") no-repeat bottom;
background-size: contain;
width: 375px; height: 130px;
position:absolute;
top: 310px; left: 0;
z-index:8;
-webkit-animation: 2.2s scaleanm .2s forwards;
animation: 2.2s scaleanm .2s forwards;
}

#roadshow{
background: url("../images/top3/roadshow.png") no-repeat right bottom;
background-size: contain;
width: 100%; height: 100%;
position: absolute;
top: 0; left: 0;
z-index:7;
-webkit-animation: 1s fadeanm 1.5s  forwards;
animation: 1s fadeanm 1.5s forwards;
opacity: 0;
}

#roadshowB{
background: url("../images/top3/roadshow2.png") no-repeat right bottom;
background-size: contain;
width: 100%; height: 100%;
position: absolute;
top: 0; left: 0;
z-index:7;
-webkit-animation: 1s fadeanm 1.5s  forwards;
animation: 1s fadeanm 1.5s forwards;
opacity: 0;
}

#catch01{
background: url("../images/top3/catch01.png") no-repeat center;
background-size: contain;
width: 100%; height: 100%;
position: absolute;
top: 0; left: 0;
z-index: 7;
-webkit-animation: 1s fadeanm 2s forwards;
animation: 1s fadeanm 2s forwards;
opacity: 0;
}

#catch02{
background: url("../images/top3/catch02.png") no-repeat center;
background-size: contain;
width: 100%; height: 100%;
position: absolute;
top: 0; left: 0;
z-index: 7;
-webkit-animation: 1s fadeanm 2.2s  forwards;
animation: 1s fadeanm 2.2s forwards;
opacity: 0;
}


#billing{
background: url("../images/top3/billing.png") no-repeat center;
background-size: 100% auto;
width: 375px;
height: 150px;
}

#mvckArea{
width: 90%; margin: 0 auto;
}

/*-------------------------------------------

bnr

-------------------------------------------*/


#bnrLall{
width: 100%;
padding: 10px 0;
line-height: 0;
border-bottom: 1px solid #b6b1a3;
}

.bnrLimg{
width: 90%;
margin: 6px auto;
line-height: 0;
}

#bnrSAll{
width: 100%;
padding: 15px 0;
text-align: center;
line-height: 0;
}

#bnrSAll img{margin: 3px;}


/*-------------------------------------------

sns

-------------------------------------------*/

#snsIcon{
width: 100%;
padding: 10px 0;
text-align: center;
}

#snsIcon img{ margin: 0 10px;}

#shareAll{
width: 375px;
font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
font-weight: 500;
font-size: 15px;
letter-spacing: 1px;
line-height: 1em;
color: #a40000;
padding: 10px 0 30px;
text-align: center;
}

#shareAll a{
color: #a40000;
text-decoration: none;
transition: all 0.3s ease;
}


/*-------------------------------------------

movie

-------------------------------------------*/

#topmovarea{
width:375px;
margin:0 auto;
padding:20px 0 5px;
line-height: 0;
}

#topmovarea .movie {
width: 336px;
margin: 0 auto;
}

#topmovarea .movie .inner {
position: relative;
width: 336px;
height: 189px;
overflow: hidden;
margin: 0 auto;
}

#topmovarea .movie .inner iframe {
width: 336px;
height: 189px;
}

#topmovarea .movie .tab_area {
width: 336px;
display: flex;
flex-wrap: wrap;
margin-: 0 auto;
}


#topmovarea .movie .tab_area li {
font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
text-align: center;
font-size: 13px;
font-weight: 700;
margin: 0;
border: 1px solid #d0c5b1;
border-top: 2px solid #d0c5b1;
}

#topmovarea .movie .tab_area li a {
display: block;
width: 82px;
line-height: 40px;
text-decoration: none;
background: url("../images/nav2/navbg2.png");
background-size: cover;
color: #ffeb9b;
padding: 0;
float: left;
}

#topmovarea .movie .tab_area li.wide2 a {
display: block;
width: 166px;
font-size: 12px;
line-height: 15px;
padding: 5px 0;
text-decoration: none;
background: url("../images/nav2/navbg2.png");
background-size: cover;
color: #ffeb9b;
float: left;
letter-spacing: .5px;
}

#topmovarea .movie .tab_area li.wide3 a {
display: block;
width: 110px;
font-size: 12px;
line-height: 15px;
padding: 5px 0;
text-decoration: none;
background: url("../images/nav2/navbg2.png");
background-size: cover;
color: #ffeb9b;
float: left;
letter-spacing: .5px;
}

#topmovarea .movie .tab_area li a.active{
background: url("../images/nav2/navbg1.png");
background-size: cover;
color: #ffeb9b;
}

