/*============================================
ヘッダー（トップ）
===========================================*/
header {
max-width: 1280px;
margin: auto;
position: relative;
font-size: 0.16rem;
}

@media screen and (max-width: 960px) {
header {
font-size: 0.14rem;
}
}

@media screen and (max-width: 767px) {
header {
position: fixed;
width: 100%;
top:0 !important;
left: 0;
z-index: 10;
background: #FFF;
height: 60px;
border-top:5px solid #000;
margin-bottom: -0.9rem;
}
}

header h1 {
position:absolute;
top:0.2rem;
left: 0.3rem;
width: 2rem;
z-index: 1;
}

@media screen and (max-width: 960px) {
header h1 {
top:0.1rem;
left: 0.1rem;
width: 1.8rem;
}
}

@media screen and (max-width: 767px) {
header h1 {
top:0.1rem;
left: 0.1rem;
width: 1rem;
transition: all 0.3s ease;
/*margin-left: -0.1rem;*/
}
header h1.sp_scr {
width: 0.62rem;
}
}


header nav {
position: absolute;
top:2rem;
left: 0.3rem;
line-height: 0.5rem;
z-index: 1;
}

@media screen and (max-width: 960px) {
header nav {
top:1.8rem;
left: 0.2rem;
line-height: 0.4rem;
}
}

header nav li img {
height: 0.36rem;
vertical-align: middle;
display: inline-block;
padding-right: 0.04rem;
}

@media screen and (max-width: 960px) {
header nav li img {
height: 0.3rem;
padding-right: 0.05rem;
}
}

header nav span img {
height: 0.26rem;
vertical-align: middle;
display: inline-block;
padding-right: 0.04rem;
}

header nav li a {
color: #222;
text-decoration: none;
display: block;
}

@media screen and (max-width: 767px) {
header .PC_navi nav {
display: none;
}
#SP_navi_wrapper {
display: block;
}
#SP_navi_Btn {
position: absolute;
top:6px;
right: 5px;
width: 46px;
height: 46px;
z-index: 1;
}
#SP_navi_Btn .navi_on {
display: none;
}
#SP_navi_Btn.open .navi_on {
display: block;
}
#SP_navi_Btn.open .navi_off {
display: none;
}
.SP_navi {
width: 100%;
}
.SP_navi nav {
background:#42210B;
position: fixed;
top:0.72rem !important;
right: 0;
bottom:0;
width: 100%;
transform: translateX(150%);
transition: all 0.2s ease;
z-index: 2;
left: 0;
overflow: scroll;
overflow-x: hidden;
-webkit-overflow-scrolling: touch;
}

.SP_navi.open nav {
transform: translateX(0%);
}
.SP_navi nav ul {
display: block;
padding-top: 10px;
width: 100%;
}
.SP_navi nav li {
display: block;
border-bottom: 1px solid rgba(255,255,255,0.2);
}

.SP_navi nav ul li ul {
padding: 0;
}

.SP_navi nav li.acc {
border: 0;
}

.SP_navi nav li.acc ul {
display: none;
}

.SP_navi nav li.acc a {
border-bottom: 1px solid rgba(255,255,255,0.2);
cursor: pointer;
}

.SP_navi nav li a {
border: 0;
color: #FFF;
padding: 10px;
font-family: 'Roboto', AppleSystem, 'ヒラギノ角ゴシック','Hiragino Sans','メイリオ', Meiryo,sans-serif;
font-size: 0.18rem;
padding-left: 16px;
font-weight: 700;
}

.SP_navi nav ul li.acc li a {
padding-left: 0.4rem;
border-bottom: 0;
background: rgba(255,255,255,0.1);
}


.SP_navi nav li a i {
padding-right: 9px;
padding-left: 5px;
opacity: 0.5;
}

.SP_navi nav li a i.fa-plus-square,
.SP_navi nav li a i.fa-minus-square {
font-size: 0.14rem;
padding-left: 0;
padding-right: 8px;
position: relative;
top:-0.4px;
}

.SP_navi nav li a i.fa-minus-square {
display: none;
}

.SP_navi nav ul li.acc.open i.fa-minus-square {
display: inline-block;
}

.SP_navi nav ul li.acc.open i.fa-plus-square {
display:none;
}

.SP_navi nav li.acc a i {
padding-right: 9px;
padding-left: 0;
opacity: 0.5;
}

.SP_navi nav li a:hover {
border-bottom: 0;
}

.SP_navi nav li.acc:hover a {
border-bottom: 1px solid rgba(255,255,255,0.2);
}

.SP_navi nav li.acc:hover li a {
border-bottom: 0;
}
}




#lang_select {
font-size: 90%;
margin-top: 0.2rem;
position: relative;
}

#lang_select span {
display: block;
line-height: 0.2rem;
position: relative;
cursor: pointer;
background: #F2F2F2;
border: 1px solid #CCC;
border-radius: 3px;
padding: 0.1rem;
transition: all 0.3s ease;
}

#lang_select span:hover,
#lang_select span.open {
background: #FFF;
border: 1px solid #999;
}

#lang_select span i {
position: absolute;
opacity: 0.5;
right: 0.1rem;
top:50%;
transform: translateY(-50%);
transition: all 0.3s ease;
}

#lang_select span i.fa-caret-up {
display: none;
transform: translateY(-60%);
}

#lang_select span.open i.fa-caret-up {
display: block;
}
#lang_select span.open i.fa-caret-down {
display: none;
}

#lang_select span:hover i,
#lang_select span.open i {
opacity: 1;
}

#lang_select ul {
position: absolute;
top:0.44rem;
left: 0;
background: #F2F2F2;
border: 1px solid #999;
width: 100%;
line-height: 0.34rem;
border-radius: 3px;
border-top-left-radius: 0;
border-top-right-radius: 0;
box-sizing: border-box;
padding: 0.1rem;
padding-left: 0.14rem;
padding-top: 0.05rem;
font-family: 'Roboto', AppleSystem, 'ヒラギノ角ゴシック','Hiragino Sans','メイリオ', Meiryo,sans-serif;
display: none;
}

#lang_select ul i {
padding-right: 0.06rem;
opacity: 0.5;
}


@media screen and (max-width: 767px) {
#lang_select_top {
width: 46px;
height: 46px;
background: url("../img/sp_lang_btn.png")no-repeat 0 0;
background-size: cover;
position: absolute;
top:7px;
right: 60px;
}
#lang_select_top form {
display: block;
width: 46px;
opacity: 0;
}
}

#lang_select li a.disable {
color: #BBB;
font-size: 0.13rem;
text-decoration: none;
}
