@charset "utf-8";
/* ==================================================================
CSS information
style info :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, summary,
time, mark, audio, video {
	margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;
}
body { line-height:1; }
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display:block; }
nav ul { list-style:none; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after,q:before, q:after { content:''; content:none; }
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
ins { background-color:#ff9; color:#000; text-decoration:none; }
mark { background-color:#ff9; color:#000;  font-style:italic; font-weight:bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; }
table { border-collapse:collapse; border-spacing:0; }
hr { display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0; }
input, select { vertical-align:middle; }

h1 , h2 , h3 , h4 { line-height:1; }
ul { list-style:none; }
p { line-height:1; }
img { vertical-align:bottom; border:none; }
table { font-size:inherit; font:100%;}




/* ==================================================================
CSS information
style info :共通
================================================================== */
html,body { -webkit-text-size-adjust: none; }
html { font-size: 62.5%; }
body { font-size: 14px; font-size: 1.4rem; }
div, h1, h2, h3, h4, h5, p { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
#contents ul, #contents li, #contents dl, #contents dt, #contents dd, #contents a { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
#contents img { max-width: 100%; height: auto;}
@media screen and (max-width: 640px) {
#sqexHeader-white_rsp { z-index: 991; position: relative;}
}
#contents { font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;}




/* --------------------------------------------------------
#contents
-------------------------------------------------------- */
#contents:after { content: ""; display: block; clear: both; }
#contents { zoom:1; }
#contents { overflow: hidden; background: #fff; }
@media screen and (min-width: 641px) {
}


/* --------------------------------------------------------
nowloading
-------------------------------------------------------- */
#nowloading { position: fixed; width: 100%; height: 100%; height: 100%; top: 0px; left: 0px; background: #fff; z-index: 9900; }
#loadingicon { position: absolute; top: 50%; left: 50%; width: 100px; height: 100px; margin-top: -50px; margin-left: -50px; text-align: center;  z-index: 9901; }

@media screen and (min-width: 641px) {
}



/* --------------------------------------------------------
#section-Header
-------------------------------------------------------- */
#section-Header { background: url(../img/header_bg_sp.png) top center repeat-y; background-size: 100%; position: relative;}
#section-Header-inner { position: relative; padding-top: 2.1875%; padding-bottom: 3.125%;}/* pt14 pb20 */

#section-Header #hard { position: absolute; top: 0; left: 0; width: 37.5%;}
#section-Header #logo { width: 34.21875%; margin-left: 32.890625%;}/* w219 */
#section-Header #release { width: 31.25%; position: absolute; right: 0; bottom: 0;}/* w200 */

#spmenu { position: absolute; top: 0; right: 2.8125%; margin-top: 3.75%; width: 14.0625%; z-index: 999;}
#spmenu { margin-top: 1%; }
#spmenu.fixed { position: fixed;}

#gnavi { display: none;}
#gnavi.open { display: block;}
#gnavi #spmenulogo { display: none;}
#gnavi ul li a { display: block;}
#gnavi ul li { position: relative; margin-bottom: 1.6%;}/* w580 h100 */
#gnavi ul li.iupd::after { content: ""; display: block; width: 15.517241%; height: 22%; background: url(../img/icon_upd.png) top center no-repeat; background-size: contain; position: absolute; bottom: 0; left: 50%; margin-left: -7.758620%; margin-bottom: -1%;}/* w90 h22 */

@media screen and (max-width: 640px) {
#gnavi { background: url(../img/header_bg_sp.png) top center repeat-y; background-size: 100%; position: fixed; top: 0; left: 0; z-index: 990; width: 100%; }
#gnavi { padding: 3.125% 4.6875% 4.6875%; border-bottom: 1px solid #08b3fb; box-shadow:0px 0px 50px 0px #000; -moz-box-shadow:0px 0px 50px 0px #000; -webkit-box-shadow:0px 0px 50px 0px #000;}
#gnavi #spmenulogo { display: block; width: 18.448275%; margin-bottom: 1.724137%;}
#gnavi ul li a.active { background: url(../img/gnavi_on_sp.png) top center no-repeat; background-size: contain;}
}
@media screen and (min-width: 641px) {
#section-Header { background: none; padding: 0 2.857142%; }
#section-Header-inner { padding: 0; max-width: 1320px; margin: 0 auto; z-index: 10;}

#section-Header #hard { left: 56.969696%; margin-top: -0.378787%; max-width: 240px; width: 18.181818%;}/* l752 mt5 */
#section-Header #logo { max-width: 188px; width: 14.242424%; margin-left: 0; padding-top: 1.060606%;}/* pt14 */
#section-Header #release { max-width: 320px; width: 24.242424%; top: 0; right: 0; bottom: inherit;}

#spmenu { display: none;}
#gnavi { display: block!important; position: absolute; top: 0!important; left: 15.909090%; margin-top: 3.134328%; width: 100%;}/* l210 mt42 */
#gnavi ul { letter-spacing: -.45em;}
#gnavi ul li { letter-spacing: normal; display: inline-block; vertical-align: top; max-width: 222px; width: 16.818181%; }/* h155 */
#gnavi ul li a.active ,
#gnavi ul li a:hover { background: url(../img/gnavi_on_pc.png) top center no-repeat; background-size: contain;}
#gnavi ul li.iupd::after { width: 40.540540%; height: 14.193548%; background-size: contain; margin-left: -20.270270%; margin-bottom: -4.054054%;}

}



/* --------------------------------------------------------
#section-Area
-------------------------------------------------------- */
#section-Area { padding-bottom: 9.375%; position: relative; }
@media screen and (min-width: 641px) {
	#section-Area { margin: 0 auto; padding: 0 1.879699%; max-width: 1064px; }
}
@media screen and (min-width: 1064px) {
	#section-Area { padding: 0 20px 20px; width: 1064px; }
}


.frame { border: 1px solid #fff; background: #cf0075; padding: 1px; display: block; position: relative; border-radius: 6px;}
.frame .pic { border-radius: 4px;}
.frame img { vertical-align: top; }
@media screen and (min-width: 641px) {
.frame { border: 2px solid #fff; padding: 2px; }
.frame { -webkit-transform: scale(1.0); transform: scale(1.0); -webkit-transition: .1s ease-in-out; transition: .1s ease-in-out; -webkit-backface-visibility: hidden;}
.frame:not(.off):hover { -webkit-transform: scale(1.03); transform: scale(1.03);}
}





/* ----------------------------------------------------------------------------------------------------------------
#colorbox
---------------------------------------------------------------------------------------------------------------- */
#colorbox.forMV , .forMV #cboxWrapper ,
#colorbox.forIMG , .forIMG #cboxWrapper ,
#colorbox.forITEM , .forITEM #cboxWrapper { overflow: visible!important; }
.forMV #cboxContent ,
.forIMG #cboxContent { background: none; }
.forITEM #cboxContent { background: none; margin-top: 30px;}
#cboxOverlay { background: #fff!important; }
#cboxLoadingOverlay{ background: #000!important; display: none!important;}
#cboxLoadingGraphic{ /*background:url(images/loading.gif) no-repeat center center;*/ display: none!important;}
.forMV #cboxLoadedContent ,
.forIMG #cboxLoadedContent { background: none; padding: 0; border: 5px solid #1f5dfa; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; background-color: #1f5dfa;}
.forITEM #cboxLoadedContent { background: none; padding: 0; }
.forMV #cboxLoadedContent ,
.forIMG #cboxLoadedContent ,
.forITEM #cboxLoadedContent { -webkit-box-sizing: border-box!important; -moz-box-sizing: border-box!important; -ms-box-sizing: border-box!important; box-sizing: border-box!important;}
.forMV #cboxClose ,
.forIMG #cboxClose { width: 30px; height: 30px; background: url(../img/btn_close.png) center center no-repeat; background-size: cover; top: -30px; right: 0px;}
.forMV #cboxClose:hover ,
.forIMG #cboxClose:hover ,
.forITEM #cboxClose:hover { background-position: center center;}
@media screen and (max-width: 640px) {
#cboxOverlay { opacity: 1!important;}
}
@media screen and (min-width: 641px) {
	.forMV #cboxLoadedContent ,
	.forIMG #cboxLoadedContent { border: 10px solid #1f5dfa; }
	.forMV #cboxClose ,
	.forIMG #cboxClose ,
	.forITEM #cboxClose { width: 50px; height: 50px; top: -55px; right: 0px;}
}

/* #colorbox.forMV
---------------------------------------------------------------------------------------------------------------- */
.forMV .cboxIframe { background: none; }
.forMV .cboxIframe { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
@media screen and (min-width: 641px) {
}

/* #colorbox.forIMG
---------------------------------------------------------------------------------------------------------------- */
.forIMG #cboxLoadedContent { height: auto!important;}
.forIMG #cboxLoadedContent .cboxPhoto { width: 100%!important; height: auto!important;}
@media screen and (min-width: 641px) {
}

/* #colorbox.forITEM
---------------------------------------------------------------------------------------------------------------- */
.forITEM .cboxIframe { background: none; }
.forITEM .cboxIframe { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
.forITEM #cboxClose { width: 30px; height: auto; padding-top: 8.3125%; background: url(../../_img/close.svg) center center no-repeat; background-size: contain;  top: -30px; right: 5px;}
@media screen and (min-width: 641px) {
	.forITEM #cboxClose { width: 40px; height: 40px; top: -70px; right: 40px;}

}

/* #colorbox.for4coma
---------------------------------------------------------------------------------------------------------------- */
.for4coma #cboxLoadedContent { height: auto!important;}
.for4coma #cboxLoadedContent .cboxPhoto { width: 100%!important; height: auto!important;}
@media screen and (min-width: 641px) {
}



/* --------------------------------------------------------
汎用クラス
-------------------------------------------------------- */
@media screen and (max-width: 640px) {
.sp { display: block; }
.pc { display: none; }
}
.sp { display: none; }

/*clearfix
----------------------------------------------------*/
.clearfix:after { content: ""; display: block; clear: both; }
.clearfix { zoom:1; }
.cr { clear:both; }

/*pagetop
----------------------------------------------------*/
#pageTop { width:100%; text-align:right; }
#pageTop a { display: inline-block; text-align: right; }
#pageTop img { }
@media screen and (max-width: 640px) {
}