body {
background: #fff;
color: #222222;
font-family: source-han-sans-japanese, sans-serif;
font-weight: 500;
font-style: normal;
width: 100%;
height:100%;
font-size:12px;
line-height:1.5em;
margin: 0px;
}


#wrap{
width: 100%; height: 100%;
min-width:1100px;
}

#contentAll{
width: 100%;
position: relative;
padding: 100px 0 0 0;
}

#mainAll{
background: url("../images/bg_pc.jpg") no-repeat center;
background-size: 100% 100%;
width: 100%;
position: relative;
overflow: hidden;
}

#main,#main2{
background: url("../images/top/main_pc.jpg") no-repeat center;
background-size: cover;
width: 100%;
margin: 0;
position: relative;
}

#main:before,#main2:before {
content:"";
display: block;
padding-top: 50%;
}


@keyframes  fadeanm {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

@keyframes  fadeScaleanm {
  0% {opacity: 0; transform: scale(1.15,1.15);}
  100% {opacity: 1; transform: scale(1,1);}
}


#logo{
background: url("../images/top/logo_pc.png") no-repeat center;
background-size: contain;
width: 42%; height: 20%;
position: absolute;
top: 39%; left: 29%;
z-index: 5;
text-indent: -99999px;
animation: fadeScaleanm 3s ease .5s forwards;
opacity: 0;
}

#roadshow{
background: url("../images/top/roadshow_pc.png") no-repeat right;
background-size: contain;
width: 16%; height: 9%;
position: absolute;
bottom: 30px; right: 30px;
z-index: 5;
animation: 2s fadeanm 1.8s forwards;
opacity: 0;
text-indent: -99999px;
}

#roadshow2{
background: url("../images/top/roadshow2_pc.png") no-repeat right bottom;
background-size: contain;
width: 18%; height: 8%;
position: absolute;
bottom: 30px; right: 30px;
z-index: 5;
animation: 2s fadeanm 1.8s forwards;
opacity: 0;
text-indent: -99999px;
}

#roadshow3{
background: url("../images/bddvd/bnr_bddvd_pc.png") no-repeat right bottom;
background-size: contain;
width: 32%; height: 40%;
position: absolute;
bottom: 15px; right: 15px;
z-index: 10;
text-indent: -99999px;
}

#roadshow3 a{
width: 100%; height: 100%;
display: block;
}

#roadshow3:hover{opacity: 0.7;cursor: pointer;}

#catch{ display: none;}

#bnrOfficialall{
width: 250px;
text-align: center;
letter-spacing: 0;
position: absolute;
bottom: 20px; left: 20px;
z-index: 10;
overflow: hidden;
}

.bnrAnv50{
background: #ecece6 url("../images/top/anniversary50.png") no-repeat center;
background-size: auto 96px;
width: 250px; height: 100px;
margin: 5px auto;
text-indent: -99999px;
transition: all 0.3s ease;
}

.bnrOfficialTwitter{
background: url("../images/bnr/bnr_twitter.png") no-repeat center;
background-size: cover;
width: 250px; height: 60px;
margin: 5px auto;
text-indent: -99999px;
transition: all 0.3s ease;
}

.bnrOfficialImg{
font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
font-weight: 600;
background: url("../images/bnr/bnr_official.png") no-repeat center;
background-size: cover;
width: 250px; height: 60px;
line-height: 60px;
font-size: 18px;
color: #fff;
margin: 5px auto;
transition: all 0.3s ease;
}

.bnrOfficialTwitter a,.bnrOfficialImg a,.bnrAnv50 a{
width: 100%; height: 100%;
display: block;
color: #fff;
text-decoration: none;
}

.bnrOfficialTwitter:hover,.bnrOfficialImg:hover,.bnrAnv50:hover{ opacity: 0.7;}


.sp{ display: none;}
.pc { display:block; }


.pagelink{
padding-top: 120px;
margin-top: -120px;
}

#trailer{
padding-top: 100px;
margin-top: -100px;
}


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

header

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

#head {
background: #fff;
width: 100%; height: 50px;
min-width:1100px;
position: fixed;
top: 0; left: 0;
z-index: 40;
}

#wbLogo{
background: url("../images/wb.png") no-repeat center;
background-size: 46px auto;
width: 50px; height: 50px;
position: absolute;
top: 0; left: 0;
z-index: 10;
}

#wbLogo a{
width: 100%; height: 100%;
display: block;
}

#menuBtn,#menuBtn2{ display: none;}


#logoS{
background: url("../images/logo2.png") no-repeat center;
background-size: contain;
width: 320px; height: 80px;
margin: 0 auto;
padding: 0;
text-indent: -99999px;
}

#logoS a{
width: 100%; height: 100%;
display: block;
}


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

menu

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

nav {
background: linear-gradient(to bottom, #4e4b48, #5c5955);
width: 100%; height: 50px;
min-width:1100px;
position: fixed;
top: 50px;
left: 0;
z-index: 50;
}

.menuAll{display: none; opacity: 0;}
.menuAll2{width: 100%;}

.menu {
height: 50px;
padding: 0px;
overflow: hidden;
position: relative;
}

.menu ul {
list-style: none outside none;
float: left;
margin: 0;
padding: 0;
position: relative;
left: 50%;
}

.menu ul li {
float: left;
margin: 0;
padding: 0 15px;
position: relative;
line-height:50px;
left: -50%;
font-size: 20px;
letter-spacing: 1px;
font-family: heisei-mincho-std, serif;
font-weight: 700;
font-style: normal;
}

.menu ul li.btnhome{font-family: itc-benguiat, serif; font-weight: 400; font-style: normal;}
.menu ul li a{color: #fff; text-decoration: none; transition: all 0.3s ease;}
.menu ul li a:hover{ opacity: 0.7;}


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

trailer

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

#trailerAll{
width: 100%;
padding: 60px 0;
}

#trailerTitle,#newsTitle{
width: 100%;
font-size: 24px;
line-height: 1em;
text-align: center;
color: #f20700;
font-family: classica-pro, serif;
font-weight: 400;
font-style: normal;
}

/*
#topmovarea{
width: 80%; max-width: 1040px;
margin:0 auto;
padding:0;
line-height: 0;
}

#topmovarea .movie {
width: 100%;
margin: 0 auto;
}

#topmovarea .movie .inner {
position: relative;
width: 100%;
overflow: hidden;
margin: 0 auto;
}

*/


#topmovarea{
width:960px;
margin:0 auto;
padding:0;
line-height: 0;
}

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

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

#topmovarea .movie .inner iframe {
width: 960px;
height: 540px;
}


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

#topmovarea .movie .tab_area li {
width: 238px; height: 40px;
line-height: 40px;
text-align: center;
font-size: 14px;
margin: 0;
border: 1px solid #fff;
border-top: 2px solid #fff;
}

#topmovarea .movie .tab_area li.wide2 {
width: 478px; height: 40px;
line-height: 40px;
text-align: center;
font-size: 14px;
margin: 0;
border: 1px solid #fff;
border-top: 2px solid #fff;
}

#topmovarea .movie .tab_area li.wide3 {
width: 318px; height: 40px;
line-height: 40px;
text-align: center;
font-size: 14px;
margin: 0;
border: 1px solid #fff;
border-top: 2px solid #fff;
}

#topmovarea .movie .tab_area li a {
width: 100%; height: 100%;
display: block;
text-decoration: none;
background: #750000;
color: #fff;
padding: 0;
float: left;
}

#topmovarea .movie .tab_area li a.active{
background: #c41b22;
color: #fff;
}


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

news

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

#news{
background: linear-gradient(to right,#4e4b48, #5b5855, #4e4b48); 
width: 100%;
padding: 40px 0;
}

#newsM{
font-family: itc-benguiat, serif;
font-weight: 400;
font-style: normal;
text-align: center;
font-size: 20px;
letter-spacing: 1px;
width: 100%;
line-height: 1em;
color: #fff;
}

.newsBlock{
width: 850px;
margin: 15px auto 0;
padding: 0;
font-size: 13px; line-height: 1.2em;
color: #fff;
letter-spacing: 1px;
padding-left: 95px;
text-indent: -95px;
text-align: center;
}

.newsBlock a{
color: #fff;
text-decoration: underline;
}

.newsDate{
font-family: itc-benguiat, serif;
font-weight: 400;
font-style: normal;
}


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

share

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

#sharaTxt{
width: 400px; height: 20px;
text-align: center;
letter-spacing: 1px;
font-size: 16px;
margin: 0 auto 40px;
color: #5e5b57;
}

#sharaTxt a{
font-family: itc-benguiat, serif;
font-weight: 400;
font-style: normal;
color: #5e5b57;
text-decoration: none;
}

#sharaTxt a:hover{
opacity: 0.7;
}


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

credit

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

#billingAll{
background: url("../images/bg_pc.jpg") no-repeat center;
background-size: cover;
width: 100%; line-height: 0;
padding: 50px 0;
}

#billing{
background: url("../images/top/billing.png") no-repeat center;
background-size: contain;
width: 100%; height: 250px;
margin: 0 auto;
text-indent: -99999px;
}


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

footer

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

footer{
background-color: #fff;
width: 100%;
position: relative;
padding: 40px 0 60px;
/*border-top: 1px solid #bec9db;*/
}

#bnrMvck{
width: 100%;height: 70px;
text-align: center;
letter-spacing: 1px;
line-height: 0;
font-size: 16px;
margin: 0 auto 40px;
color: #5e5b57;
}

#bnrMvck img{margin: 0 5px;}

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

#bnrSall img{margin: 4px;}

#snsofficial{
width: 300px; height: 40px;
text-align: center;
margin: 0 auto 10px;
}

#snsofficial img{
transition: all 0.3s ease;
margin: 0 2px;
}

#wb{
background: url("../images/wb.png") no-repeat center;
background-size: contain;
width: 60px; height: 60px;
transition: all 0.3s ease;
margin: 0 auto 10px;
}

#wb a{
width: 100%; height: 100%;
display: block;
}

#privacy{
width: 200px; height: 10px;
line-height: 1em;
font-size: 12px;
text-align: center;
margin: 0 auto;
padding: 20px 0;
color: #788698;
letter-spacing: 1px;
}

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

#privacy a:hover,#wb:hover{opacity: 0.7;}


#copyright{
width: 100%;
text-align: center;
font-size: 11px;
margin: 0;
letter-spacing: 1px;
color: #788698;
}



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

ef

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


.ef-fade {
opacity: 0;
transition: 1.5s ease 0.1s;
}


.fade {
opacity: 1.0;
transform: translateX(0) scale(1,1) rotateZ(0);
}