@charset "utf-8";
html { overflow:-moz-scrollbars-vertical; overflow-y:scroll; overflow-x:auto;}
img{ border:none;}
ul{ margin:0px; padding:0px; list-style:none;}
h1,h2,h3,h4,h5,h6{ margin:0px; padding:0px; font-weight:normal;}
a{ text-decoration:none; -moz-transition:all .2s ease-in; -webkit-transition:all .2s ease-in; transition:all .2s ease-in; cursor:pointer;}
body{ margin:0px; padding:0px; font-family:'Roboto', sans-serif, Arial; background:#000; padding-top:50px;}
p{ margin:0px; padding:0px;}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block;}

table{ border-collapse:collapse; border-spacing:0px;}
table tr td, table tr th{ border-spacing:0px; padding: 0px;}

.clear{ clear:both;}

.inner{ width:1150px; margin:0px auto;}

header{ width:100%; height:50px; background:#000; position:fixed; top:0px; left:0px; z-index:99;}
header .inner{ height:50px; position:relative;}
header .logo{ width:165px; height:30px; background:url(../images/logo.png) no-repeat; text-indent:-9999px; position:absolute; left:0px; top:10px;}
header .button{ font-size:14px; font-weight:700; position:absolute; right:0px; top:10px;}
header .button a{ display:block; height:30px; line-height:30px; padding:0px 20px; background:#000; border:solid 1px #fff; color:#fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
header .button a:hover{ background:#fff; color:#000;}
header .info{ font-size:16px; font-weight:700; color:#ffe016; text-align:center;}
header .info table{ width:100%;}
header .info table tr td{ height:50px;}

.intro{ height:900px; background:url(../images/intro-bg.jpg) no-repeat top center #000; background-size:cover; position:relative; border-bottom:solid 6px #008080;}
.intro .logo{ width:700px; height:163px; background:url(../images/intro-logo.png) no-repeat; text-indent:-9999px; position:absolute; left:50%; bottom:350px; margin-left:-350px;}
.intro .konami{ position:absolute; left:20px; top:20px;}
.intro .official{ position:absolute; right:20px; top:20px;}
.intro .play{ position:absolute; left:50%; bottom:160px; margin-left:-80px;}
.intro .play a{ display:block; width:160px; height:160px; padding:20px; background:rgba(0, 0, 0, 0.5); border:solid 2px #fff; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; outline:none;}
.intro .play a:hover{ background:rgba(215, 14, 22, 0.5);}
.intro .slogan{ width:100%; text-align:center; position:absolute; left:0px; bottom:80px;}

.shadow{ width:15%; height:100%; position:absolute; top:0px;}
.left-shadow{ background:url(../images/left-shadow-bg.png) center top repeat-y; background-size:100% auto; left:0px;}
.right-shadow{ background:url(../images/right-shadow-bg.png) center top repeat-y; background-size:100% auto; right:0px;}

.section{ border-bottom:solid 6px #008080;}
.section .left{ height:675px; width:50%; float:left; position:relative;}
.section .right{ height:675px; width:50%; float:right; position:relative;}
.section table tr td{ height:675px;}
.section .text{ min-height:95px; font-size:16px; color:#fff; line-height:140%;}
.section .text h1{ font-size:21px; font-weight:700; color:#00ffff; margin-bottom:10px;}
.section .text p{ margin-bottom:10px;}
.section .text p:last-child{ margin-bottom:0px;}

.section .number-1{ background:url(../images/number-1.png) no-repeat left top; padding-left:50px;}
.section .number-2{ background:url(../images/number-2.png) no-repeat left top; padding-left:85px;}
.section .number-3{ background:url(../images/number-3.png) no-repeat left top; padding-left:82px;}
.section .number-4{ background:url(../images/number-4.png) no-repeat left top; padding-left:90px; margin-bottom:20px;}
.section .number-5{ background:url(../images/number-5.png) no-repeat left top; padding-left:90px;}
.section .number-6{ background:url(../images/number-6.png) no-repeat left top; padding-left:90px; margin-bottom:20px;}
.section .number-7{ background:url(../images/number-7.png) no-repeat left top; padding-left:90px;}

.section-1 .left{ background:url(../images/section-1-bg.jpg) no-repeat center center; background-size:cover;}
.section-1 .content{ padding-right:10%;}
.section-2 .right{ background:url(../images/section-2-bg.jpg) no-repeat center center; background-size:cover;}
.section-2 .content{ padding-left:10%;}
.section-3 .left{ background:url(../images/section-3-bg.jpg) no-repeat center center; background-size:cover;}
.section-3 .content{ padding-right:10%;}
.section-4 .right{ background:url(../images/section-4-bg.jpg) no-repeat center center; background-size:cover;}
.section-4 .content{ padding-left:10%;}
.section-5 .left{ background:url(../images/section-5-bg.jpg) no-repeat center center; background-size:cover;}
.section-5 .content{ padding-right:10%;}

.packshots{ text-align:center; padding:40px 0px; background:url(../images/packshot-bg.jpg) no-repeat center center #122646; background-size:cover;}
.packshots .main-title{ padding:0px 10px; margin-bottom:20px; color:#fff;}
.packshots .main-title h1{ font-family:Arial; font-size:45px; font-weight:700;}
.packshots .sub-title{ background:#00baf2; padding:20px 10px; color:#fff; margin-bottom:40px;}
.packshots .sub-title h2{ font-size:36px; font-weight:700;}
.packshots .premium-list{ margin-bottom:40px;}
.packshots .list ul li{ display:inline-block; width:18%; margin:0px 1%;}
.packshots .list ul li a{ display:block;}
.packshots .list ul li a:hover{ opacity:0.60; filter:alpha(opacity=60);}
.packshots .list ul li img{ display:block; width:100%;}

footer{ height:40px; line-height:40px; padding:5px 0px; background:#000;}
footer .copyright{ float:left; font-size:13px; color:#fff;}
footer .legals{ float:right;}
footer .legals ul li{ float:left; margin-right:20px;}
footer .legals ul li:last-child{ margin-right:0px;}
footer .legals ul li img{ display:block;}

.fixed-menu{ position:fixed; bottom:10px; right:10px; z-index:99;}
.fixed-menu ul li{ margin-top:5px;}
.fixed-menu ul li.topofpage{ display:none;}
.fixed-menu ul li a{ display:block; width:40px; height:40px; line-height:40px; text-align:center; background:#d70e16; border:solid 1px #d70e16; color:#fff; font-size:24px;}
.fixed-menu ul li a:hover{ background:#fff; color:#d70e16;}

@media (max-width: 1199px) {
	.inner{ width:auto; padding:0px 20px;}
	
	header .logo{ left:20px;}
	header .button{ right:20px;}
	header .info{ font-size:15px;}
	
	.intro{ height:780px;}
	.intro .konami img{ width:160px;}
	.intro .official img{ width:150px;}
	
	.section .text{ font-size:15px;}
	.section .text h1{ font-size:20px;}
	
	.packshots .main-title h1{ font-size:36px;}
	.packshots .sub-title h2{ font-size:32px;}
}
@media (max-width: 991px) {
	body{ padding-top:40px;}
	header{ height:40px;}
	header .inner{ height:40px;}
	header .logo{ width:110px; height:20px; background:url(../images/logo-s.png) no-repeat; background-size:110px 20px;}
	header .button a{ height:20px; line-height:20px; padding:0px 15px;}
	header .info{ font-size:14px;}
	header .info table tr td{ height:40px;}
	
	.intro{ height:720px;}
	.intro .logo{ width:560px; height:130px; background:url(../images/intro-logo-l.png) no-repeat; background-size:560px 130px; margin-left:-280px; bottom:280px;}
	.intro .play{ margin-left:-60px; bottom:120px;}
	.intro .play a{ width:120px; height:120px; padding:10px;}
	.intro .play img{ width:100px;}
	.intro .slogan{ bottom:40px;}
	.intro .konami img{ width:140px;}
	.intro .official img{ width:120px;}
	
	.section .text{ min-height:75px; font-size:14px;}
	.section .text h1{ font-size:18px;}
	.section .number-1, .section .number-2, .section .number-3, .section .number-4, .section .number-5, .section .number-6, .section .number-7{ background-size:auto 75px;}
	.section .number-1{ padding-left:40px;}
	.section .number-2{ padding-left:70px;}
	.section .number-3{ padding-left:72px;}
	.section .number-4{ padding-left:72px;}
	.section .number-5{ padding-left:72px;}
	.section .number-6{ padding-left:72px;}
	.section .number-7{ padding-left:72px;}
	
	.packshots .main-title h1{ font-size:32px;}
	.packshots .sub-title h2{ font-size:24px;}
}
@media (max-width: 767px) {
	body{ padding-top:80px;}
	header{ height:80px;}
	header .inner{ padding:40px 0px 0px 0px;}
	header .info{ background:#333; padding:0px 10px; font-size:13px; font-weight:400;}
	
	.intro{ height:640px;}
	.intro .logo{ width:450px; height:105px; background:url(../images/intro-logo-m.png) no-repeat; background-size:450px 105px; margin-left:-225px; bottom:210px;}
	.intro .play{ margin-left:-50px; bottom:90px;}
	.intro .play a{ width:100px; height:100px;}
	.intro .play img{ width:80px;}
	.intro .slogan img{ width:75%;}
	.intro .konami img{ width:120px;}
	.intro .official img{ width:100px;}
	
	.shadow{ display:none;}
	.section .left{ height:auto; width:auto; float:none; position:relative;}
	.section .right{ height:auto; width:auto; float:none; position:relative;}
	.section .content{ padding:30px; background:rgba(0, 0, 0, 0.7);}
	.section table tr td{ height:auto;}
	.section .text{ min-height:50px; font-size:13px;}
	.section .text h1{ font-size:17px;}	
	.section .number-1, .section .number-2, .section .number-3, .section .number-4, .section .number-5, .section .number-6, .section .number-7{ background-size:auto 50px;}
	.section .number-1{ padding-left:32px;}
	.section .number-2{ padding-left:50px;}
	.section .number-3{ padding-left:48px;}
	.section .number-4{ padding-left:52px;}
	.section .number-5{ padding-left:52px;}
	.section .number-6{ padding-left:52px;}
	.section .number-7{ padding-left:52px;}	
	.section-1 .left{ background:none;}
	.section-1 .right{ background:url(../images/section-1-bg.jpg) no-repeat center center; background-size:cover; padding:60px 30px;}
	.section-2 .right{ background:none;}
	.section-2 .left{ background:url(../images/section-2-bg.jpg) no-repeat center center; background-size:cover; padding:60px 30px;}
	.section-3 .left{ background:none;}
	.section-3 .right{ background:url(../images/section-3-bg.jpg) no-repeat center center; background-size:cover; padding:60px 30px;}
	.section-4 .right{ background:none;}
	.section-4 .left{ background:url(../images/section-4-bg.jpg) no-repeat center center; background-size:cover; padding:60px 30px;}
	.section-5 .left{ background:none;}
	.section-5 .right{ background:url(../images/section-5-bg.jpg) no-repeat center center; background-size:cover; padding:60px 30px;}
	
	.packshots{ padding:30px 0px;}
	.packshots .main-title h1{ font-size:24px;}
	.packshots .sub-title{ padding:10px; margin-bottom:30px;}
	.packshots .sub-title h2{ font-size:18px;}
	.packshots .premium-list{ margin-bottom:30px;}
	
	footer{ height:auto; line-height:normal; text-align:center; padding:20px 0px;}
	footer .copyright{ float:none; margin-bottom:20px;}
	footer .legals{ float:none;}
	footer .legals ul li{ display:inline-block; float:none; margin:0px 5px;}
	footer .legals ul li:last-child{ margin:0px 5px;}
}
@media (max-width: 481px) {
	header .info{ font-size:12px;}
	
	.intro{ height:480px;}
	.intro .logo{ width:300px; height:70px; background:url(../images/intro-logo-s.png) no-repeat; background-size:300px 70px; margin-left:-150px; bottom:180px;}
	.intro .play{ margin-left:-40px; bottom:80px;}
	.intro .play a{ width:80px; height:80px;}
	.intro .play img{ width:60px;}
	.intro .konami{ left:10px; top:10px;}
	.intro .konami img{ width:90px;}
	.intro .official{ right:10px; top:10px;}
	.intro .official img{ width:75px;}
	
	.section .content{ padding:20px;}
	.section .text{ min-height:30px;}
	.section .text h1{ font-size:16px;}	
	.section .number-1, .section .number-2, .section .number-3, .section .number-4, .section .number-5, .section .number-6, .section .number-7{ background-size:auto 30px;}
	.section .number-1{ padding-left:24px;}
	.section .number-2{ padding-left:32px;}
	.section .number-3{ padding-left:32px;}
	.section .number-4{ padding-left:32px;}
	.section .number-5{ padding-left:32px;}
	.section .number-6{ padding-left:32px;}
	.section .number-7{ padding-left:32px;}
	
	.packshots .main-title h1{ font-size:21px;}
	.packshots .sub-title h2{ font-size:16px;}
	.packshots .list ul li{ width:22%;}
	
	footer .copyright{ font-size:12px;}
}