/* - basic setting
---------------------------------------------------------------------- */

body {
-webkit-text-size-adjust: 100%;
font-family: "メイリオ", "Meirio",sans-serif;
background:#555;
background:url('../images/common/00_bg.png') top left repeat;
line-height: 1.5;
}

html,body {
min-height: 100%;
height: 100%;
height: 100vh;
}

img {
max-width: 100%;
height: auto;
border: 0;
}


/* clearfix */
.clearfix:after {
  content: ".";  /* 新しい要素を作る */
  display: block;  /* ブロックレベル要素に */
  clear: both;
  height: 0;
  visibility: hidden;
}
* html .clearfix             { zoom: 1; } /* IE6 */  
*:first-child+html .clearfix { zoom: 1; } /* IE7 */




/* link設定 */
a {
color: #fff;
text-decoration: none;
}
a:visited {
}
a:hover {
opacity:0.8;
}
a:active {
text-decoration: none;
}

.link {
cursor:pointer;
}
.link:hover {
opacity:0.6;
}

.link {
position:relative;
}
 
.link a{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}



/* line設定 */
hr.dotted { 
border-style: dotted none none none; 
border-top-width: 1px; 
border-top-color:#666;
height: 1px; 
margin:1.0em 0px;
}
hr.solid {
border-style: solid none none none;
border-top-width: 1px;
border-top-color:#666;
height: 1px;
margin:1.0em 0px;
}


/* - basic col
---------------------------------------------------------------------- */
.col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11, .col12 {
min-height: 50px;
text-align:center;
}

.alignL {
text-align:left;
}




/* - basic layout
---------------------------------------------------------------------- */

#wrapper {
position: relative;
overflow: hidden;
width: 100%;
background-color: #000;
color:#fff;
}

#wrapper * {
box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.android #wrapper * { max-height: 999999px; }

#contents {
-webkit-transition: ease 0.4s;
transition: ease 0.4s;
position: relative;
padding:0 2.0%;
}

#contents > div.inner { display: block; }

.content {
position:relative;
width:100%;
}
.content img{
width:100%;
}









/* - header
---------------------------------------------------------------------- */
#header {
min-height: 50px;
box-sizing: border-box;
width: 100%;
position: relative;
background: #000;
z-index: 9999;
min-height: 62px;
min-height: 58px;
}

#header > div.inner {  }

#header > div.inner > div.header_block {
display: table;
width: 100%;
margin: 0;
padding: 0;
background-color: #000;
}


#header.fixed {  }

#header.fixed > div.inner {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 1000;
box-shadow: 0 1px 4px rgba(0,0,0,0.4);
}

#header.fixed > div.inner > div.header_block {  }


#header > div.inner > div.header_block > div {
display: table-cell;
vertical-align: middle;
}

#header > div.inner > div.header_block > div.title {
padding: 5px;

}

#header > div.inner > div.header_block > div.title img {
vertical-align: top;
max-height: 60px;
transition: all 0.2s ease-out;
}

#header.fixed > div.inner > div.header_block > div.title img {
max-height: 40px;
}

#header > div.inner > div.header_block > div.right_col {
text-align: right;
font-size: 0;
margin: 0;
padding: 6px 8px;
width:50%;
}


/* --- global menu button --- */
p.header_menu_btn {
display: inline-block;
vertical-align: middle;
}

p.header_menu_btn > a {
display: block;
text-decoration: none;
color: #fff;
padding: 0 12px;
border-radius: 4px;
border: 1px solid #fff;
padding: 7px 6px 4px 6px;
box-sizing: border-box;
}

p.header_menu_btn > a span.wrap {  }

p.header_menu_btn > a > span.icon {
transition: rotate 0.4s;
box-sizing: border-box;
position: relative;
width: 30px;
display: block;
margin: 0 auto;
height: 17px;
}

p.header_menu_btn > a > span.icon > span {
position: absolute;
left : 0;
width: 100%;
height: 3px;
background-color: #fff;
border-radius: 4px;
}

p.header_menu_btn > a > span.icon > span:nth-of-type(1) { top: 0; }
p.header_menu_btn > a > span.icon > span:nth-of-type(2) { top: 7px; }
p.header_menu_btn > a > span.icon > span:nth-of-type(3) { bottom: 0; }

p.header_menu_btn .txt {
font-size: 0.9rem;
display: block;
margin-top: 6px;
min-width: 36px;
text-align: center;
}

p.header_menu_btn > a.active > span.icon > span:nth-of-type(1) {
-webkit-transform: translateY(7px) rotate(-45deg);
transform: translateY(7px) rotate(-45deg);
}

p.header_menu_btn > a.active > span.icon > span:nth-of-type(2) {
opacity: 0;
}

p.header_menu_btn > a.active > span.icon > span:nth-of-type(3) {
-webkit-transform: translateY(-7px) rotate(45deg);
transform: translateY(-7px) rotate(45deg);
}


/* --- global menu button fixed --- */
#header.fixed p.header_menu_btn > a {
padding: 9px 6px 8px 6px;
height: 32px;
}

#header.fixed p.header_menu_btn > a > span.icon {
width: 16px;
display: inline-block;
vertical-align: middle;
height: 13px;
margin-right: 5px;
}

#header.fixed p.header_menu_btn .txt {
display: inline-block;
margin: 0;
vertical-align: middle;
line-height: 1;
}

#header.fixed p.header_menu_btn > a > span.icon > span:nth-of-type(1) { top: 0; }
#header.fixed p.header_menu_btn > a > span.icon > span:nth-of-type(2) { top: 5px; }
#header.fixed p.header_menu_btn > a > span.icon > span:nth-of-type(3) { bottom: 0; }


#header.fixed p.header_menu_btn > a.active > span.icon > span:nth-of-type(1) {
-webkit-transform: translateY(5px) rotate(-45deg);
transform: translateY(5px) rotate(-45deg);
}

#header.fixed p.header_menu_btn > a.active > span.icon > span:nth-of-type(2) {
opacity: 0;
}

#header.fixed p.header_menu_btn > a.active > span.icon > span:nth-of-type(3) {
-webkit-transform: translateY(-5px) rotate(45deg);
transform: translateY(-5px) rotate(45deg);
}





/* - quick menu
---------------------------------------------------------------------- */
div.quick_menu {
color: #fff;
padding: 0 4px;
background-color: #000;
}

div.quick_menu.hide { display: none; }

div.quick_menu > ul {
display: table;
table-layout: fixed;
width: 100%;
}

div.quick_menu > ul > li {
display: table-cell;
box-sizing: border-box;
vertical-align: middle;
text-align: center;
padding: 5px 3px;
}


div.quick_menu > ul > li > a {
display: block;
text-decoration: none;
font-size: 1.3rem;
padding: 0;
height: 68px;
color: #fff;
height: 64px;
transition: linear height 0.1s;
    
border-radius: 4px;
box-shadow: 0 1px 4px rgba(0,0,0,0.2);
    
-webkit-border-radius: 4px;
-webkit-box-shadow: 0 1px 4px rgba(0,0,0,0.2);
    
height: 52px;
background-color: #333;
border: 1px solid #555;
}

div.quick_menu > ul > li > a span.wrap {
position: relative;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
display: block;
text-align: center;
}

div.quick_menu > ul > li > a span.wrap span.icon {
text-align: center;
display: block;
font-size:1.5em;
}

div.quick_menu > ul > li > a span.wrap span.icon img {
vertical-align: top;
height: 24px;
}

div.quick_menu > ul > li > a span.wrap span.txt {
display: block;
margin-top: 6px;
color: #fff;
font-size: 1rem;
}


/* --- quick menu fixed --- */
#header.fixed div.quick_menu > ul > li > a { height: 30px; }
#header.fixed div.quick_menu > ul > li > a span.wrap span.icon { display: none; }
#header.fixed div.quick_menu > ul > li > a span.wrap span.txt {
margin-top: 0;
font-size: 1.0rem;
}

/* --- contents inner fixed --- */
#contents > div.inner.fixed { padding-top: 58px; }

.android41 #contents > div.inner.hide > div { display: none; }


/* - global menu
---------------------------------------------------------------------- */
nav { display: block; }

#nav_block {
display: block;
position: fixed;
width: 100%;
height: 100%;
z-index: 9999;
top: 62px;
left: 150%;
display: none;
}

.android41 #nav_block {
position: static;
opacity: 1;
top: auto;
left: auto;
width: 100%;
height: 100%;
    
-webkit-transform: scale(1);
transform: scale(1);
transition: all ease;
display: none;
}

@keyframes nav_show {
from{ opacity: 0; }
to{ opacity: 1; }
}

@keyframes nav_scale {
from{ transform: scale(0.1); }
to{ transform: scale(1); }
}


/* --- ヘッダーの高さがデフォルト --- */
#nav_block.opened {
left: 0;
width: 100%;
top: 57px;
display: block;
animation: nav_show 0.5s ease-out, nav_scale 0.1s ease-out;
}

.android41 #nav_block.opened { display: block; }


/* --- ヘッダーの高さが狭い場合 --- */
#nav_block.opened.narrow {
opacity: 1;
left: 0;
top: 46px;
}

.android41 #nav_block.opened.narrow { display: block; }


#global_nav {  }

#global_nav.opened { display: block; }


div.gnav_inner {
position: absolute;
top: 0;
right: 0;
z-index: 100;
	
height: 100%;
width: 100%;

padding: 20px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
	
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
	
color: #fff;
background-color: #000;
border-top: 1px solid #555;

padding: 15px;
padding-top: 20px;
padding-bottom: 80px;
}


.android41 div.gnav_inner {
position: static;
height: auto;
overflow: visible;
    
box-sizing: border-box;
-webkit-box-sizing: border-box;
width: 100%;
}


#global_nav div.gnav_inner > ul {  }

#global_nav div.gnav_inner > ul > li { margin-bottom: 1.5em; }

#global_nav div.gnav_inner > ul > li:last-child { margin-bottom: 0; }

#global_nav > div.gnav_inner > ul > li > a,
#global_nav > div.gnav_inner > ul > li > span {
padding: 5px 10px;
text-decoration: none;
line-height: 1.5;
display: block;
background-color: #000;
color: #fff;
border-radius: 3px;
font-size: 1.3rem;
padding: 8px 10px;
}

#global_nav div.gnav_inner > ul > li > a i { margin-right: 0.3em; }

#global_nav div.gnav_inner > ul > li span.pc_icon {
margin-left: 8px;
background-color: #333;
color: #fff;
border-radius: 2px;
font-weight: bold;
vertical-align: middle;
padding: 3px 4px;
line-height: 1.2;
font-size: 1.1rem;
vertical-align: 10%;
}


/* --- submenu --- */
ul.sub-menu { margin-top: 5px; }
ul.sub-menu:after { content: ''; display: block; clear: both; }

ul.sub-menu > li { clear: both; }

ul.sub-menu > li.col2 {
width: 50%;
float: left;
clear: none;
}

ul.sub-menu > li > a {
text-decoration: none;
display: block;
padding: 10px;
line-height: 1.5;
border-bottom: 1px dotted #ccc;
font-size: 1.3rem;
color: #fff;
}


/* --- 偶数個ある場合の最後から２番目 --- */
ul.sub-menu > li.col2.odd_last > a { border-bottom: none; }

ul.sub-menu > li > a i { margin-right: 0.5em; color: #fff; }



div.gnav_inner div.btn_close { margin-top: 40px; }

div.gnav_inner div.btn_close > a {
display: block;
border: 1px solid #555;
border-radius: 4px;
padding: 12px 0;
text-align: center;
color: #fff;
text-decoration: none;
font-size: 1.3rem;
background:#333;
}

div.gnav_inner div.btn_nav > a {
display: inline-block;
width:100%;
border: 1px solid #555;
border-radius: 4px;
padding: 12px 0;
text-align: center;
color: #fff;
text-decoration: none;
font-size: 1.3rem;
background:#333;
margin-bottom:1em;
}





div.gnav_inner div.btn_close > a i { margin-right: 0.4em; }



/* ------------------------------------------------------------

	480px - 639px

------------------------------------------------------------ */
@media only screen and (min-width:480px) and (max-width:639px) {

}

/* ------------------------------------------------------------

	640px - 767px

------------------------------------------------------------ */
@media only screen and (min-width:640px) and (max-width:767px) {
	
}


/* ------------------------------------------------------------

	768px - 

------------------------------------------------------------ */
@media only screen and (min-width:768px)and (max-width:939px) {
#wrapper {
max-width: 768px;
margin: 0 auto;
}
}

/* ------------------------------------------------------------

	940px - 

------------------------------------------------------------ */
@media only screen and (min-width:940px) {
#wrapper {
max-width: 940px;
margin: 0 auto;
}
body {
}
}


/* - sponserbnrBlock
---------------------------------------------------------------------- */
.spbnrBlock {
text-align:center;
}
.spbnrBlock ul{
}
.spbnrBlock li{
}
.spbnrBlock img{
width:145px;
height:60px;
margin-top:0.5em;
}


/* - linkbnrBlock
---------------------------------------------------------------------- */
.linkbnrBlock {
text-align:center;
}
.linkbnrBlock ul{
}
.linkbnrBlock li{
}
.linkbnrBlock img{
width:145px;
height:60px;
margin-top:0.5em;
}



/* - linkbnrChriBlock
---------------------------------------------------------------------- */
.linkbnrChriBlock {
text-align:left;
}
.linkbnrChriBlock ul{
margin-top:0.5em;
}
.linkbnrChriBlock li{
display:inline-block;
margin-bottom:0.5em;
margin-right:0.5em;
}
.linkbnrChriBlock img{
}



/* - footer
---------------------------------------------------------------------- */
#footer {
padding:0.5em;
}

.socialBox {
margin:1em 0;
}
.socialBox img{
width:40px;
}








/* - pagetop
---------------------------------------------------------------------- */
#btn_pagetop {
position: fixed;
right: 1.0em;
bottom: -60px;
-webkit-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
z-index:9998;
}

#btn_pagetop.fixed { bottom: 56px; }

#btn_pagetop > a {
display: block;
max-width: 44px;
}

.android2 #btn_pagetop {
position: absolute;
bottom: 80px;
}


/* - btn
---------------------------------------------------------------------- */
.btnGoDownload {
text-align:center;
margin-top:2em;
}
.btnGoDownload img {
}
.btnGoDownload a {
width:420px;
display: inline-block;
font-size:18px;
font-weight:bold;
margin: 0px;
margin-bottom:10px;
padding: 13px 10px 11px 10px;
color:#333;
text-decoration: none;
text-align:center;
vertical-align: middle;
background-color:#ddd;
border-radius: 6px;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
}
.btnGoDownload a:hover {
background:#aaa;
}


.btnGoPagelink {
width:940px;
margin:0 auto;
text-align:right;
}
.btnGoPagelink img {
}
.btnGoPagelink a {
display: inline-block;
margin: 0px;
padding: 13px 10px 11px 10px;
color:#fff;
text-decoration: none;
text-align:center;
vertical-align: middle;
background-color:#000;
border-top-left-radius: 6px;
border-top-right-radius: 6px;
}
.btnGoPagelink a:hover {
background:#666;
}


.btn_form > a {
display: inline-block;
width:100%;
border: 1px solid #555;
border-radius: 4px;
padding: 12px 0;
text-align: center;
color: #333;
text-decoration: none;
font-size: 1.5rem;
font-weight:bold;
background:#ddd;
}


input.btn_form {
display: inline-block;
width:48%;
border: 1px solid #555;
border-radius: 4px;
padding: 12px 0;
text-align: center;
color: #333;
text-decoration: none;
font-size: 1.5rem;
font-weight:bold;
background:#ddd;
}
input.btn_form:hover {
opacity:0.8;
}