@charset "UTF-8";
/* http://meyerweb.com/eric/tools/css/reset/ 
v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video{
margin:0;
padding:0;
border:0;
font-size:100%;
font:inherit;
vertical-align:baseline;
}

/*  HTML5 display-role reset for older browsers 
*/
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section{
display:block;
}

body{
line-height:1;
}

ol, ul{
list-style:none;
}

blockquote, q{
quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after{
content:'';
content:none;
}

table{
border-collapse:collapse;
border-spacing:0;
}

body{
font-family:"Hiragino Kaku Gothic ProN", Meiryo, -apple-system, BlinkMacSystemFont, "MS PGothic", sans-serif;
}

#gheader{
position:absolute;
z-index:3;
top:0;
left:0;
width:100%;
background:#fff;
}
#gheader .headInner{
padding:12px 20px;
border-bottom:3px solid #e60012;
position:relative;
height:54px;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
#gheader .headInner:after{
content:'';
clear:both;
display:block;
}
#gheader .headInner .logo{
width:228px;
float:left;
}
#gheader .headInner .logo img{
width:100%;
}
#gheader .headInner .spNavBtn{
position:absolute;
top:8px;
right:10px;
background:none;
-webkit-box-shadow:none;
-moz-box-shadow:none;
box-shadow:none;
border:none;
text-indent:-9999px;
padding:0;
margin:0;
}
#gheader .spNavWrap{
border-bottom:2px solid #e60012;
position:absolute;
width:100%;
background:#fff;
left:0;
top:54px;
display:none;
display:none;
}
#gheader .spNavWrap .pageLink li{
border-bottom:1px solid #e60012;
}
#gheader .spNavWrap .pageLink li a{
padding:20px;
font-size:15px;
color:#e60012;
font-weight:bold;
text-decoration:none;
display:block;
position:relative;
}
#gheader .spNavWrap .pageLink li a:after{
content:'';
display:block;
width:10px;
height:10px;
border-right:2px solid #e60012;
border-bottom:2px solid #e60012;
position:absolute;
top:0;
bottom:0;
right:20px;
margin:auto;
transform:rotate(-45deg);
}
#gheader .spNavWrap .snsLink{
letter-spacing:-0.4em;
}
#gheader .spNavWrap .snsLink li{
display:inline-block;
vertical-align:top;
letter-spacing:normal;
width:50%;
text-align:center;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
#gheader .spNavWrap .snsLink li:first-child{
border-right:1px solid #e60012;
}
#gheader .spNavWrap .snsLink li a{
display:block;
padding:12px 0;
}
#gheader .spNavWrap .snsLink li a img{
width:34px;
}

/*ボタンの幅*/
/*ボタンの高さ*/
/*ボタンのパディング*/
/*ボーダーの太さ*/
/*ボーダーの色*/
/*アニメーションの時間*/
.spNavBtn{
text-indent:-9999px;
}
.spNavBtn .txt{
display:block;
width:17px;
height:15px;
position:relative;
padding:10px;
overflow:hidden;
}
.spNavBtn .txt:before{
content:'';
display:block;
width:calc(100% - 20px);
height:3px;
position:absolute;
top:0;
bottom:0;
left:0;
right:0;
margin:auto;
background:#e60012;
transition:0.3s;
}
.spNavBtn .txt span{
width:calc(100% - 20px);
height:100%;
display:block;
position:absolute;
left:0;
right:0;
top:0;
margin:auto;
}
.spNavBtn .txt span:before, .spNavBtn .txt span:after{
content:'';
display:block;
width:100%;
position:absolute;
left:0;
right:0;
margin:auto;
transition:0.3s;
}
.spNavBtn .txt span:before{
top:10px;
}
.spNavBtn .txt span:after{
bottom:10px;
}

.s_gnavBtn01 .txt span:before, .s_gnavBtn01 .txt span:after{
height:3px;
background:#e60012;
}
.s_gnavBtn01 .txt.is_active:before{
opacity:0;
right:-10px;
}
.s_gnavBtn01 .txt.is_active span:before{
-webkit-transform:rotate(45deg);
transform:rotate(45deg);
top:50%;
margin-top:-3px;
}
.s_gnavBtn01 .txt.is_active span:after{
-webkit-transform:rotate(-45deg);
transform:rotate(-45deg);
bottom:50%;
}

#gfooter .newsArea{
background:#fff;
border-top:3px solid #000;
letter-spacing:-0.4em;
overflow:hidden;
}
#gfooter .newsArea .ttl{
display:inline-block;
vertical-align:top;
letter-spacing:normal;
width:135px;
text-align:center;
font-size:14px;
font-weight:bold;
padding:10px 0;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
border-right:1px solid #000;
}
#gfooter .newsArea .newsList{
display:inline-block;
vertical-align:top;
letter-spacing:normal;
padding:10px 16px;
width:calc(100% - 135px);
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
font-size:14px;
white-space:nowrap;
}
#gfooter .newsArea .newsList a{
color:#000;
}
#gfooter .footInner{
background:#312a28;
padding:18px 20px;
color:#fff;
}
#gfooter .footNav{
text-align:center;
letter-spacing:-0.4em;
margin-bottom:15px;
}
#gfooter .footNav li{
display:inline-block;
letter-spacing:normal;
}
#gfooter .footNav li a{
color:#fff;
font-size:12px;
font-weight:bold;
text-decoration:none;
}
#gfooter .footNav li:not(:first-child){
margin-left:18px;
}
#gfooter .iconList{
text-align:center;
letter-spacing:-0.4em;
margin-bottom:18px;
}
#gfooter .iconList li{
display:inline-block;
vertical-align:top;
letter-spacing:normal;
}
#gfooter .iconList li:not(:first-child){
margin-left:10px;
}
#gfooter .copy small{
font-size:10px;
line-height:1.5;
}

.mainArea{
overflow:hidden;
}

.bgArea .bgPanel{
position:absolute;
}

.mainGearWrap{
position:relative;
margin-top:-150.3125vw;
margin-left:-55.78125vw;
margin-bottom:28.125vw;
width:212.8125vw;
height:212.8125vw;
}
.mainGearWrap img{
width:100%;
}
.mainGearWrap .maingear01, .mainGearWrap .maingear02{
position:absolute;
top:0;
bottom:0;
left:0;
right:0;
margin:auto;
}
.mainGearWrap .maingear01{
width:144.6875vw;
height:143.59375vw;
}

.pager{
position:absolute;
top:45.3125vw;
left:6.25vw;
right:6.25vw;
}
.pager .prev{
float:left;
}
.pager .next{
float:right;
}

.mainTags .tag{
position:absolute;
}
.mainTags .tag img{
width:13.4375vw;
}

.mainItems .item{
position:absolute;
}
.mainItems .item img{
width:25.3125vw;
}

.modalWindow{
border:1px solid #000;
background:#fff;
margin:0 20px;
position:relative;
padding-bottom:30px;
}
.modalWindow img{
width:100%;
}
.modalWindow .close{
content:'';
display:block;
width:36px;
height:36px;
position:absolute;
top:0;
right:0;
background:url(../images/series35/closeBtn.png) no-repeat center center, #000;
z-index:1;
box-shadow:none;
border:none;
text-indent:-9999px;
}
.modalWindow .txt{
margin:0 16px 12px;
line-height:1.8;
font-weight:bold;
font-size:12px;
}
.modalWindow .copy{
margin:0 16px 25px;
font-size:10px;
font-weight:bold;
}
.modalWindow .moreBtn a{
display:block;
width:155px;
text-align:left;
text-decoration:none;
line-height:40px;
padding-left:18px;
background:#e60012;
color:#fff;
font-size:14px;
font-weight:bold;
position:relative;
margin:0 auto;
}
.modalWindow .moreBtn a:after{
content:'';
width:13px;
height:13px;
display:block;
position:absolute;
top:0;
bottom:0;
right:20px;
margin:auto;
background:url(../images/series35/sp/morebtn.png) no-repeat 0 0/100%;
}
.modalWindow .tabmenu{
text-align:center;
margin-bottom:15px;
}
.modalWindow .tabmenu li{
display:inline-block;
vertical-align:top;
}
.modalWindow .tabmenu li:not(:first-child){
margin-left:12px;
}
.modalWindow .tabmenu li a{
font-size:16px;
font-weight:bold;
font-family:'Roboto', sans-serif;
color:#000;
text-decoration:none;
}
.modalWindow .tabmenu li a:after{
content:'';
display:block;
width:100%;
height:2px;
background:#e60012;
-webkit-transition:0.3s;
-moz-transition:0.3s;
-ms-transition:0.3s;
-o-transition:0.3s;
transition:0.3s;
transform:scaleX(0);
}
.modalWindow .tabmenu li a.is_active{
color:#e60012;
}
.modalWindow .tabmenu li a.is_active:after{
transform:scaleX(1);
}

.footIconList{
margin:10px auto 40px;
letter-spacing:-0.4em;
text-align:center;
}
.footIconList li{
letter-spacing:normal;
display:inline-block;
vertical-align:top;
width:14.375vw;
margin:0 1px 3px;
text-align:center;
}
.footIconList li .balloon img{
width:100%;
}
.footIconList li .icon{
margin-top:8px;
display:block;
position:relative;
}
.footIconList li .icon:after{
content:'';
width:28px;
height:4px;
position:absolute;
background:rgba(34, 24, 21, 0.5);
display:block;
left:0;
right:0;
bottom:0;
margin:auto;
-webkit-border-radius:50%;
-moz-border-radius:50%;
border-radius:50%;
-webkit-transition:0.3s;
-moz-transition:0.3s;
-ms-transition:0.3s;
-o-transition:0.3s;
transition:0.3s;
opacity:0;
}
.footIconList li .icon img{
width:45%;
position:relative;
-webkit-transition:0.3s;
-moz-transition:0.3s;
-ms-transition:0.3s;
-o-transition:0.3s;
transition:0.3s;
top:0;
}
.footIconList li .is_active .icon:after{
opacity:1;
}
.footIconList li .is_active .icon img{
top:-8px;
}

.loadingArea{
position:fixed;
width:100%;
height:100%;
z-index:5;
display:flex;
}
.loadingArea .leftDoor, .loadingArea .rightDoor{
width:50%;
display:flex;
align-items:center;
justify-content:flex-end;
}
.loadingArea .leftDoor img, .loadingArea .rightDoor img{
width:100%;
}
.loadingArea .leftDoor{
background:#a36d59;
}
.loadingArea .rightDoor{
background:#bb856f;
}
.loadingArea .loadingLeftGear, .loadingArea .loadingRightGear{
position:absolute;
width:50%;
height:100%;
top:0;
}
.loadingArea .loadingLeftGear .gearImg, .loadingArea .loadingRightGear .gearImg{
position:absolute;
}
.loadingArea .loadingLeftGear .gearImg img, .loadingArea .loadingRightGear .gearImg img{
width:100%;
}
.loadingArea .loadingLeftGear{
left:0;
}
.loadingArea .loadingLeftGear .gear01{
width:44.21875vw;
left:4.375vw;
top:0;
}
.loadingArea .loadingLeftGear .gear02{
width:7.1875vw;
top:0;
left:0;
transform:rotateY(180deg);
}
.loadingArea .loadingLeftGear .gear03{
width:13.90625vw;
top:6.71875vw;
left:0;
transform:rotateY(180deg);
}
.loadingArea .loadingLeftGear .gear04{
width:15.15625vw;
top:17.8125vw;
left:12.1875vw;
}
.loadingArea .loadingLeftGear .gear05{
width:15.3125vw;
top:28.75vw;
left:2.5vw;
}
.loadingArea .loadingLeftGear .gear06{
width:3.28125vw;
top:30.78125vw;
left:0;
transform:rotateY(180deg);
}
.loadingArea .loadingLeftGear .gear07{
width:5.3125vw;
top:37.5vw;
left:0;
transform:rotateY(180deg);
}
.loadingArea .loadingLeftGear .gear08{
width:8.90625vw;
top:43.75vw;
left:4.375vw;
}
.loadingArea .loadingLeftGear .gear09{
width:26.40625vw;
left:0;
bottom:0;
z-index:1;
}
.loadingArea .loadingLeftGear .gear10{
width:36.71875vw;
left:1.40625vw;
bottom:14.6875vw;
}
.loadingArea .loadingRightGear{
right:0;
}
.loadingArea .loadingRightGear .gear01{
width:44.21875vw;
right:4.375vw;
top:0;
}
.loadingArea .loadingRightGear .gear02{
width:7.1875vw;
top:0;
right:0;
}
.loadingArea .loadingRightGear .gear03{
width:13.90625vw;
top:6.71875vw;
right:0;
}
.loadingArea .loadingRightGear .gear04{
width:15.15625vw;
top:17.8125vw;
right:12.1875vw;
}
.loadingArea .loadingRightGear .gear05{
width:15.3125vw;
top:28.75vw;
right:2.5vw;
}
.loadingArea .loadingRightGear .gear06{
width:3.28125vw;
top:30.78125vw;
right:0;
}
.loadingArea .loadingRightGear .gear07{
width:5.3125vw;
top:37.5vw;
right:0;
}
.loadingArea .loadingRightGear .gear08{
width:8.90625vw;
top:43.75vw;
right:4.375vw;
}
.loadingArea .loadingRightGear .gear09{
width:26.40625vw;
right:0;
bottom:0;
z-index:1;
transform:rotateY(180deg);
}
.loadingArea .loadingRightGear .gear10{
width:28.75vw;
right:1.40625vw;
bottom:14.6875vw;
}

/*追記*/
.loadingArea{
z-index:2000;
}

.loadingArea .gearImg.gear01{
top:-25vw;
}

.loadingArea .gearImg.gear02{
width:24vw;
}

.loadingArea .loadingLeftGear .gearImg.gear02{
left:-18vw;
top:-15vw;
}

.loadingArea .loadingRightGear .gearImg.gear02{
right:-18vw;
top:-15vw;
}

.loadingArea .gearImg.gear03{
width:24vw;
}

.loadingArea .loadingLeftGear .gearImg.gear03{
left:-10vw;
}

.loadingArea .loadingRightGear .gearImg.gear03{
right:-10vw;
}

.loadingArea .gearImg.gear06{
width:7vw;
}

.loadingArea .loadingLeftGear .gearImg.gear06{
left:-4vw;
}

.loadingArea .loadingRightGear .gearImg.gear06{
right:-4vw;
}

.loadingArea .gearImg.gear07{
width:13vw;
}

.loadingArea .loadingLeftGear .gearImg.gear07{
left:-8vw;
}

.loadingArea .loadingRightGear .gearImg.gear07{
right:-8vw;
}

.loadingArea .spin{
opacity:0;
animation:spin 15s linear infinite;
}

.loadingArea .spinR{
opacity:0;
animation:spinR 15s linear infinite;
}

@keyframes spin {
  0% {
transform:rotate(0deg);
  }
  100% {
transform:rotate(360deg);
  }
}
@-webkit-keyframes spin {
  0% {
transform:rotate(0deg);
  }
  100% {
transform:rotate(360deg);
  }
}
@keyframes spinR {
  0% {
transform:rotate(0deg);
  }
  100% {
transform:rotate(-360deg);
  }
}
@-webkit-keyframes spinR {
  0% {
transform:rotate(0deg);
  }
  100% {
transform:rotate(-360deg);
  }
}
.loadingArea .leftDoor{
position:relative;
left:0px;
}

.loadingArea .rightDoor{
position:relative;
right:0px;
}

.loadingArea .leftDoor .logo, .loadingArea .rightDoor .logo{
opacity:0;
}

#gheader{
z-index:1000;
}

.mainArea{
overflow:visible;
top:0px;
left:0px;
width:100%;
}

.mainAreaInner{
height:85vw;
}

#mainContents{
position:relative;
overflow:hidden;
min-height:150vw;
}

.bgArea{
position:absolute;
width:200%;
height:100%;
background-repeat:repeat;
background-position:0 0;
background-size:25.1%;
}

.bgArea.bg0{
background-image:url(../images/series35/sp/bg01_0102.gif);
}

.bgArea.bg1{
background-image:url(../images/series35/sp/bg02_0102.gif);
}

.bgArea.bg2{
background-image:url(../images/series35/sp/bg03_0102.gif);
}

.bgArea.bg3{
background-image:url(../images/series35/sp/bg04_0102.gif);
}

.bgArea.bg4{
background-image:url(../images/series35/sp/bg05_0102.gif);
}

.bgArea.bg5{
background-image:url(../images/series35/sp/bg06_0102.gif);
}

.bgArea.bg6{
background-image:url(../images/series35/sp/bg07_0102.gif);
}

.bgArea.bg7{
background-image:url(../images/series35/sp/bg08_0102.gif);
}

.bgArea.bg8{
background-image:url(../images/series35/sp/bg09_0102.gif);
}

.bgArea.bg9{
background-image:url(../images/series35/sp/bg10_0102.gif);
}

.bgArea.bg10{
background-image:url(../images/series35/sp/bg11_0102.gif);
}

.bgArea.bg11{
background-image:url(../images/series35/sp/bg12_0102.gif);
}

.bgArea .bgLine{
position:relative;
}

.bgArea .bgLine .bgPanel{
position:absolute;
top:0px;
left:0px;
}

.bgArea .bgLine .bgPanel .bgImage{
position:absolute;
top:0px;
left:0px;
width:105px;
height:74px;
}

.mainItems{
position:absolute;
top:0px;
left:0px;
z-index:100;
width:100%;
}

.mainItems .mainItemsInner{
position:absolute;
left:0px;
top:-143.1125vw;
transform-origin:50% 50%;
}

.mainItems .itemWrap,
.mainItems .itemWrap .itemInner{
position:absolute;
}

.mainItems .itemWrap{
cursor:pointer;
width:13%;
}

.mainItems .itemWrap .itemInner{
z-index:100;
width:100%;
}

.mainItems .itemWrap .itemInner .item{
transform-origin:50% 50%;
width:100%;
}

.mainItems .itemWrap .tag{
position:absolute;
top:100px;
  /* set by js */
left:95px;
  /* set by js */
transform-origin:29.31% 10.67%;
width:53%;
height:45.63%;
z-index:50;
}

.pager{
z-index:900;
height:0;
}

.mainGearWrap{
position:absolute;
}

.mainGearWrap .maingear01{
z-index:2;
}

.modalWindow{
display:none;
z-index:200;
}

.modalWindowInner{
display:none;
position:relative;
overflow:hidden;
}

.modalWindow img{
width:100%;
}

.modalWindow .tabWrap .tab{
display:none;
}

.modalWindow .tabWrap .tab.is_active{
display:block;
}

.footIconList{
position:relative;
}

.footIconList .balloon{
opacity:0;
}

.footIconList li .is_active .balloon{
opacity:1;
}
