html{margin: 0px; padding: 0px; width: 100%; overflow-x: hidden;}
body{margin: 0px; padding: 0px; background-color: #fff;}

.relative{position: relative;}
.absolute{position: absolute;}

.box{display: -webkit-flex; display: flex;}
.flex-direction-row{flex-direction: row;}
.flex-direction-row-r{flex-direction: row-reverse;}
.flex-direction-column{flex-direction: column;}
.flex-direction-column-r{flex-direction: column-reverse;}
.flex-wrap-now{flex-wrap: nowrap}
.flex-wrap-wrap{flex-wrap: wrap}
.flex-wrap-wrap-r{flex-wrap: wrap-reverse}
.justify-content-start{justify-content: flex-start}
.justify-content-end{justify-content: flex-end}
.justify-content-center{justify-content: center}
.justify-content-between{justify-content: space-between}
.justify-content-around{justify-content: space-around}
.align-items-start{align-items: flex-start}
.align-items-end{align-items: flex-end}
.align-items-center{align-items: center}
.align-items-baseline{align-items: baseline}
.align-items-stretch{align-items: stretch}
.align-content-start{align-content: flex-start}
.align-content-end{align-content: flex-end}
.align-content-center{align-content: center}
.align-content-between{align-content: space-between}
.align-content-around{align-content: space-around}
.align-content-stretch{align-content: stretch}

.w1920{max-width: 1600px; width: 100%; margin: 0px auto;}
.w1218{max-width: 990px; width: 100%; margin: 0px auto;}

.block01{height: 1146px; background: url(../images/img01.jpg) center no-repeat; background-size: cover;}
.block02{height: 821px; background: url(../images/img02.jpg) center no-repeat; background-size: cover;}
.block03{height: 674px; background: url(../images/img03.jpg) center no-repeat; background-size: cover;}
.block04{height: 848px; background: url(../images/img04.jpg) center no-repeat; background-size: cover;}
.block05{height: 698px; background: url(../images/img05.jpg) center no-repeat; background-size: cover;}
.block06{height: 669px; background: url(../images/img06.jpg) center no-repeat; background-size: cover;}
.block07{height: 671px; background: url(../images/img07.jpg) center no-repeat; background-size: cover;}
.block08{height: 714px; background: url(../images/img08.jpg) center no-repeat; background-size: cover;}
.block09{height: 694px; background: url(../images/img09.jpg) center no-repeat; background-size: cover;}
.block10{height: 696px; background: url(../images/img10.jpg) center no-repeat; background-size: cover;}
.block11{height: 567px; background: url(../images/img11.jpg) center no-repeat; background-size: cover;}
.block12{height: 1306px; background: url(../images/img12.jpg) center no-repeat; background-size: cover;}
.block13{height: 1413px; background: url(../images/img13.jpg) center no-repeat; background-size: cover;}

/* .w1218{height: 100%;} */


#main{width: 100%; overflow-x: hidden;}

.w1280{max-width: 1280px; width: 100%; margin: 0px auto;}
.pctop{display: block; width: 100%;}
.mobiletop{display: none;}

#top{max-width: 1280px; width: 100%; margin: 0px auto;}

@media (max-width:750px){
    .w1280{max-width: auto; width: 140%; margin: 0px -20%;}
    .pctop{display: none;}
    .mobiletop{display: block; width: 100%;}
}


.title{position: absolute; width: 58%; left: 50%; margin-left: -29%; top: 8%;}

.tabList{position: absolute; width: 100%; top: 25%;}
.tabMain{width: 60%; margin: 0px auto; display: flex;}
.tabMain .tab{padding: 0px 10px;}

.tabMain .tab a .def{display: block;}
.tabMain .tab a .action{display: none;}
.tabMain .tab a img{width: 100%;}
.tabMain .tab a:hover{opacity: 1;}
.tabMain .tab a:hover .def{display: none;}
.tabMain .tab a:hover .action{display: block;}

.buttonList{width: 24.5%; position: absolute; z-index: 10;}
.buttonMain{display: flex;}
.buttonMain .button:first-child{margin-right: 5px;}
.buttonMain .button:last-child{margin-left: 5px;}

#block01 .buttonList{left: 48.2%; top: 68.5%;}

.buttonList.buttonLeft{left: 20.5%; width: 26%;}
.buttonList.buttonRight{right: 21%; width: 26%;}

.buttonList.buttonFull{left: 50%;}

.buyButton{position: relative;}

.subMenu{position: absolute; width: 100%; display: none;}
.subMenu a{padding: 2px 0px; display: block; }
.subMenu a img{background-color: #fff;}

#block02 .buttonList{top: 66%; left: 50.5%;}
#block03 .buttonList{top: 45%; left: 25.5%;}
#block04 .buttonList{top: 45%; left: 50.5%;}
#block05 .buttonList{top: 38.5%; left: 25.5%;}
#block06 .buttonList{top: 58%; left: 49%;}
#block07 .buttonList{top: 47%; left: 25.5%;}
#block08 .buttonList{top: 51.5%; left: 49%;}
#block09 .buttonList{top: 37%; left: 25.5%;}
#block10 .buttonList{top: 56%; left: 49.5%;}
#block11 .buttonList{top: 48%; left: 26.5%;}
#block12 .buttonList{top: 47.5%; left: 49.5%;}
#block13 .buttonList{top: 38%; left: 26.5%;}
#block14 .buttonList{top: 67%; left: 49%;}
#block15 .buttonList{top: 46%; left: 25.5%;}
#block16 .buttonList{top: 47%; left: 49%;}
#block17 .buttonList{top: 45.5%; left: 25.5%;}
#block18 .buttonList{top: 51%; left: 49%;}
#block19 .buttonList{top: 32.5%; left: 25.5%;}
#block20 .buttonList{top: 64%; left: 49%;}
#block21 .buttonList{top: 45.5%; left: 25.5%;}
#block22 .buttonList{top: 46%; left: 49%;}
#block23 .buttonList{top: 32.5%; left: 25.5%;}