@charset "UTF-8";
/* CSS Document */

/* -----------RESET----------- */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main,summary,time,mark,audio,video,a,input,textarea,section
{margin:0;padding:0; border:0; font-size:100%; background:transparent; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main{ display:block;}
nav ul{ list-style:none;}
ul{ list-style:none; }
blockquote,q{ quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{ content:''; content:none;}
pre,code,kbd,samp{ font-family:monospace,monospace; font-size:inherit;}
table{ border-collapse:collapse; border-spacing:0;}
img{ border:0;}
address,caption,cite,code,dfn,em,th,var{ font-style:normal; font-weight:normal;}
caption,th{ text-align:left;}
h1,h2,h3,h4,h5,h6{ font-size:100%; font-weight:normal}
sup{ vertical-align:text-top; font-size:75%;}
sub{ vertical-align:text-bottom; font-size:75%;}
input,textarea,select{ z-index:auto; font-family:inherit; font-size:inherit; font-weight:inherit; vertical-align:middle;}
a{ outline:none;}
audio:not([controls]){ display:none;}
time{ display:inline;}
[hidden]{ display:none;}
input::-ms-clear,input::-ms-reveal,input:focus::-ms-clear,input:focus::-ms-reveal{visibility:hidden; display:none;}
button::-moz-focus-inner,input[type="reset"]::-moz-focus-inner,input[type="button"]::-moz-focus-inner,input[type="submit"]::-moz-focus-inner,input[type="file"]>input[type="button"]::-moz-focus-inner{ padding:0; border:0; outline:none;}
/* clear Fix */
.clr{clear:both;}
.hide{position:absolute !important; left:-9999px !important; top:-9999px !important;}
.clr{clear:both;}
section {clear:both; zoom:1;}
header:after,footer:after,nav:after,article:after,section:after,dl:after,ul:after,.inner:after,.clrFx:after{content:''; clear:both; display:block;}
img{-ms-interpolation-mode: bicubic;}
/* chrome bug fix*/
*{max-height:999999px;}
*,*::before,*::after {will-change:all;}
textarea,input[type="email"],input[type="password"],input[type="text"],input[type="button"],input[type="submit"]{-webkit-appearance:none;}
textarea{resize:vertical;}

/* -----------BASE SET----------- */
html{overflow:visible;}
body {position:static; overflow:auto; width:auto; *overflow-y:hidden; color:#fff; background:#000;}
/* font family 
body{-webkit-text-size-adjust:100%; -webkit-font-smoothing:antialiased; font-family:'Roboto','Droid Sans',"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif; line-height:1.8;}
button{font-family:'Roboto','Droid Sans',"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif; cursor:pointer;}*/
body{-webkit-text-size-adjust:100%; -webkit-font-smoothing:antialiased; font-family:游ゴシック,YuGothic,ヒラギノ角ゴ ProN W3,HiraKakuProN-W3,sans-serif; line-height:1.8;}
button{font-family:游ゴシック,YuGothic,ヒラギノ角ゴ ProN W3,HiraKakuProN-W3,sans-serif; cursor:pointer;}

/*html.iOS,html.OSX{font-family:游ゴシック,YuGothic,ヒラギノ角ゴ ProN W3,HiraKakuProN-W3,sans-serif}
html.Android{font-family:Noto Sans Japanese,Roboto,sans-serif}
html.Windows{font-family:游ゴシック,YuGothic,メイリオ,Meiryo,ＭＳゴシック,sans-serif}*/
/* link color */
a:link{ color:#fff; text-decoration: none;}
a:visited{ color:#fff; text-decoration:none;}
a:hover{ color:#fff; text-decoration:none;}
a:active{ color:#fff; text-decoration:none;}
a{-webkit-tap-highlight-color:rgba(15,152,217,0.5);}
/* leyoutblock */
header,footer,section,main,nav,#fixed,.pagetop {font-size:0; line-height: 1;}
header img,footer img,section img,main img {width:100%; height:auto;}


/* 
	for SP
	
*****************************************************/
@media screen and (max-width:767px){
	
	main {padding-bottom: 11.40625vw; position: relative;}
	main:before {content: ""; display: block; width: 100vw; height: 100vh; background: url("../images/bg.jpg") no-repeat top center; background-size: 250vw auto; position: fixed; top: 0; left: 0;}
	
	.pcbr {display: none;}
	
	.menu-btn {position: fixed; top:2.34375vw; right:2.34375vw; width: 14.375vw;  height: 16.5625vw; font-size: 0; cursor: pointer; z-index: 11;}
	.menu-btn span:after { content: attr(data-txt-menu); background:url(../images/icon_menu.png) no-repeat; background-size:14.375vw 16.5625vw; width: 14.375vw;  height: 16.5625vw; display:block;}
	.open .menu-btn span:after {content: attr(data-txt-close); background:url(../images/icon_close.png) no-repeat; background-size:14.375vw 16.5625vw; width: 14.375vw;  height: 16.5625vw;}
	.menu {position: fixed; overflow-y: scroll; top: 0; left: 0; width: 100%; height: 100%; background:rgba(19,26,86,0.95); -webkit-transition: all .5s; transition: all .5s; visibility: hidden; opacity: 0; z-index: 10;}
	.open {overflow: hidden;}
	.open .menu {-webkit-transition: all .5s; transition: all .5s; visibility: visible; opacity: 1;}
	.menu ul {margin: 18.75vw 0 0 23.4375vw;}
	.menu ul li {margin-bottom: 9.375vw;}
	.menu ul li .new {position: relative;}
	.menu ul li .new:after {content: ""; background: url("../images/nav_icon_new_sp.png") no-repeat; background-size: 10.78125vw auto; display: block; width: 10.78125vw; height: 4.375vw; position: absolute; right: -11.71875vw; top: 0.9375vw;}
	.menu li:nth-child(1) a {background: url("../images/nav01_sp.png") no-repeat; background-size: 24.53125vw auto; width: 24.53125vw; height: 6.25vw; display: block;}
	.menu li:nth-child(2) a {background: url("../images/nav02_sp.png") no-repeat; background-size: 41.25vw auto; width: 41.25vw; height: 6.25vw; display: block;}
	.menu li:nth-child(3) a {background: url("../images/nav03_sp.png") no-repeat; background-size: 29.53125vw auto; width: 29.53125vw; height: 5.9375vw; display: block;}
	.menu li:nth-child(4) a {background: url("../images/nav04_sp.png") no-repeat; background-size: 29.84375vw auto; width: 29.84375vw; height: 6.09375vw; display: block;}
	.menu li:nth-child(5) a {background: url("../images/nav05_sp.png") no-repeat; background-size: 25.46875vw auto; width: 25.46875vw; height: 6.25vw; display: block;}
	.menu li:nth-child(6) a {background: url("../images/nav06_sp.png") no-repeat; background-size: 32.34375vw auto; width: 32.34375vw; height: 6.40625vw; display: block;}
	
	.container {background: url("../images/container_bg.png")repeat; background-size: 5.3125vw auto; width: 90.625vw; margin: 9.375vw auto 0; border: 1px solid #fff; position: relative;}
	.container:after {content: ""; display: block; background: url("../images/section_parts_bottom.png") no-repeat; background-size: 18.4375vw auto; width: 18.4375vw; height: 3.59375vw; position: absolute; bottom: -3.59375vw; left: 50%; margin-left: -9.21875vw;}
	.container .inner {width: 100%; border: 1px solid #b8b8b8; position: relative; padding-bottom: 9.375vw;}
	.container .inner:after {content: ""; display: block; background: url("../images/section_parts_top_left.png") no-repeat; background-size: 23.28125vw auto; width: 23.28125vw; height: 28.125vw; position: absolute; top: -2px; left: -2px;}
	.container .inner:before {content: ""; display: block; background: url("../images/section_parts_top_right.png") no-repeat; background-size: 22.96875vw auto; width: 22.96875vw; height: 28.125vw; position: absolute; top: -2px; right: -2px;}
	
	footer {background: #000; position: relative;}
	footer .inner {background:url("../images/footer_border.png") top center no-repeat, url("../images/footer_bg.png") top center no-repeat; background-size: 100vw auto,100vw auto; position: relative; padding-top: 11.71875vw;}
	footer .inner:after {content: ""; display: block; background: url("../images/footer_border_ornament.png") top center no-repeat; background-size: 40.625vw auto; width:40.625vw; height: 6.25vw; position: absolute; top: -2.65625vw; left: 50%; margin-left: -20.3125vw;}
	footer h1 {width: 36.09375vw; margin: 0 auto;}
	footer .btn a {width: 81.25vw; height: 14.53125vw; display: block; background: url("../images/footer_btn_official.png") no-repeat; background-size:81.25vw auto; margin: 6.25vw auto;}
	footer .credit {font-size: 3.125vw; letter-spacing: 0.2em; text-align: center; padding: 4.6875vw 0; border-top: 1px solid #555;}
}

/* 
	for PC
	
*****************************************************/
@media screen and (min-width:768px){
	
	body {background:#000 url("../images/bg.jpg") top center; background-attachment: fixed; background-size: cover;}
	a:hover, nav a:hover {opacity: 0.5; -webkit-transition: all 0.3s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all  0.5s ease;}
	.spbr {display: none;}
	
	header {background-image:url("../images/nav_ornament_border.png"), url("../images/nav_ornament_bg.png"); background-repeat: repeat-x,repeat-x; background-position: bottom, top; height: 72px; width: 100%; min-width: 1000px; position: fixed; z-index: 10;}
	header:after {content: ""; background: url("../images/nav_ornament_center.png") no-repeat; width: 259px; height: 40px; position: absolute; left: 50%; top: 51px; margin-left: -129.5px;}
	header nav {position: relative;}
	header nav:before {content: ""; background: url("../images/nav_ornament_left.png") no-repeat top left; width: 48px; height: 65px; position: absolute; top: 0; left: 0;}
	header nav:after {content: ""; background: url("../images/nav_ornament_right.png") no-repeat top right; width: 48px; height: 65px; position: absolute; top: 0; right: 0;}
	header nav ul {text-align: center; padding-top: 20px;}
	header nav ul li {display: inline-block; margin: 0 30px; position: relative;}
	header nav ul li:after {content: url("../images/nav_border.png"); position: absolute; top: 0; right: 0; margin-right: -30px;}
	header nav ul li:last-child:after {content: none;}
	header nav li .new {position: relative;}
	header nav li .new:after {content: url("../images/nav_icon_new_pc.png"); position: absolute; top: 24px; left: 50%; margin-left: -18.5px;}
	header nav li:nth-child(1) a {background: url("../images/nav01_pc.png") no-repeat; background-size: 56px auto; width: 56px; height: 22px; display: block;}
	header nav li:nth-child(2) a {background: url("../images/nav02_pc.png") no-repeat; background-size: 120px auto; width: 120px; height: 22px; display: block;}
	header nav li:nth-child(3) a {background: url("../images/nav03_pc.png") no-repeat; background-size: 75px auto; width: 75px; height: 21px; display: block;}
	header nav li:nth-child(4) a {background: url("../images/nav04_pc.png") no-repeat; background-size: 77px auto; width: 77px; height: 21px; display: block;}
	header nav li:nth-child(5) a {background: url("../images/nav05_pc.png") no-repeat; background-size: 60px auto; width: 60px; height: 22px; display: block;}
	header nav li:nth-child(6) a {background: url("../images/nav06_pc.png") no-repeat; background-size: 86px auto; width: 86px; height: 22px; display: block;}
	
	.container {background: url("../images/container_bg.png")repeat; background-size: 34px auto; width: 920px; margin: 60px auto 0; border: 1px solid #fff; position: relative;}
	.container:after {content: ""; display: block; background: url("../images/section_parts_bottom.png") no-repeat; background-size: 118px auto; width: 118px; height: 23px; position: absolute; bottom: -23px; left: 50%; margin-left: -59px;}
	.container .inner {width: 100%; border: 1px solid #b8b8b8; position: relative; padding-bottom: 65px;}
	.container .inner:after {content: ""; display: block; background: url("../images/section_parts_top_left.png") no-repeat; background-size: 149px auto; width: 149px; height: 180px; position: absolute; top: -2px; left: -2px;}
	.container .inner:before {content: ""; display: block; background: url("../images/section_parts_top_right.png") no-repeat; background-size: 147px auto; width: 147px; height: 180px; position: absolute; top: -2px; right: -2px;}
	
	footer {background: #000; margin-top: 80px;}
	footer .inner {background: url("../images/footer_border.png") top center repeat-x,url("../images/footer_bg.png") top center repeat-x; position: relative; padding-top: 50px;}
	footer .inner:after {content: ""; display: block; background: url("../images/footer_border_ornament.png") top center no-repeat; background-size: 260px auto; width:260px; height: 40px; position: absolute; top: -17px; left: 50%; margin-left: -130px;}
	footer h1 {width: 140px; margin: 0 auto;}
	footer .btn a {width: 312px; height: 56px; display: block; background: url("../images/footer_btn_official.png") no-repeat; background-size:312px auto; margin: 30px auto;}
	footer .credit {font-size: 14px; letter-spacing: 0.2em; text-align: center; padding: 25px 0; border-top: 1px solid #555;}

}