@charset "utf-8";

/*====================================
ヘッダー
====================================*/
header{
	width: 100%;
	height: auto;
	pointer-events: none;
	position: fixed;
	top: 0;
	z-index: 900;
	margin: 0 auto;}

.header-box{
	margin:30px 30px;}
	
.header-l{
	float:left;
	pointer-events: auto;}

.header_logo{}

.header_logo svg{
	width: 91px;
	height: auto;}

.header_logo svg .cls-1{
	fill: #000;}
	
.no-scroll{
  overflow: hidden;}
	
.header-r{
	position: relative;
	display:block;
	pointer-events: auto;}

.header-language-btn-area{
	position: absolute;
	top: 0;
	right: 60px;}

.header-language{
	font-size: 14px;
	font-size: 1.4rem;
	font-weight: 400;
	text-align: center;
	text-decoration: none;
	line-height: 1.2;
	color: #000;
	display: block;
	cursor: pointer;
	width: 80px;
	position: relative;
	transition: 0.3s;
	padding: 10px 20px 10px 40px;
	border: 1px #000 solid;
	border-radius: 50px;}

.header-language:hover{
	color: #FFF;
	background-color: #000;}

.header-language:before{
	content: "";
	background-image: url(../aizu-p/common-p/header_langicon.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	transition: 0.3s;
	width: 15px;
	height: 15px;
	position: absolute;
	top: 50%;
	left: 20px;
	transform: translate(0,-50%);
	z-index: 1;}

.header-language:hover:before{
	background-image: url(../aizu-p/common-p/header_langicon-h.png);}

.header-language-btn-area-open .header-language{
	color: #FFF;
	background-color: #000;
	border: 1px #000 solid;
	border-radius: 0;}

.header-language-btn-area-open .header-language:before{
	background-image: url(../aizu-p/common-p/header_langicon-h.png);}

.header-language-btn{
	font-size: 14px;
	font-size: 1.4rem;
	text-align: center;
	text-decoration: none;
	color: #000;
	background-color: #FFF;
	display: none;
	transition: 0.3s;
	padding: 10px 10px;
	border-left: 1px #000 solid;
	border-right: 1px #000 solid;
	border-bottom: 1px #000 solid;}

.header-language-btn:hover{
	color: #FFF;
	background-color: #000;}
	
.header-icon{
	cursor: pointer;
	width:32px;
	height:29px;
	position: absolute;
	top: 5px;
	right: 0;
	z-index:995;}

.header-language-btn-area-open .header-language-btn{
	display: block;}
	
.menu-icon{}
	
.menu-icon span{
	display:block;
	transition:0.3s;
	width:32px;
	height:3px;
	background-color:#000;
	margin-bottom:10px;}
	
.menu-icon span:last-child{
	margin-bottom:0;}
	
.clause-icon{
	width:34px;
	height:3px;
	cursor: pointer;
	display:block;
	z-index:995;
	margin-top: 10px}
	
.clause-icon span{
	display:block;
	transition:0.3s;
	width:32px;
	height:3px;
	background-color:#FFF;}
	
.clause-icon span:first-child{
    transform: rotate(45deg);
	transform-origin:50% 50%;
	margin-bottom: -3px;}
	
.clause-icon span:last-child{
    transform: rotate(-45deg);
	transform-origin:50% 50%;}
	
.clause-icon span:nth-child(2){
	display:none;}

.menu-clausearea{
	display: none;
	position:fixed;
	background: rgba(0,0,0,0.5);
	width: 100%;
	height:100dvh;
	top: 0;
	left: 0;
	z-index:980;}

.menu-clausearea-open{
	display: block;}
	
.menu{
	display:block;
	position:fixed;
	top:0;
	left: 100%;
	background-color:#E23318;
	width:400px;
	height:100dvh;
	z-index:990;
	transition:0.5s;}
	
.menu-open{
	left:calc(100% - 400px);
	opacity:1;}
	
.header-nav{
	font-size: 0;
	width: auto;
	height: calc(100% - 186px);
	overflow-y: scroll;
	-ms-overflow-style: none;
	margin:96px 30px 30px 30px;}
	
.header-nav::-webkit-scrollbar{
  display: none;}
	
.header-nav li{
	display: block;}
	
.header-nav li a{
	font-size:20px;
	font-size:2.0rem;
	font-weight:500;
	color:#FFF;
	background-color: #E23318;
	text-decoration:none;
	display:block;
	transition: 0.3s;
	padding:15px 20px;
	border-top:1px #FFF solid;
	border-bottom: none;}

.header-nav .header-nav-contact{
	display: block;}
	
.header-nav li:last-child a{
	border-bottom:1px #FFF solid;}
	
.header-nav li a:hover{
	color:#FFF;
	background-color: #E65231;}

.header-snslist{
	font-size: 0;
	text-align: left;
	padding: 0 0;
	margin: 0 30px 30px 30px;}

.header-snslist li{
	font-size: 16px;
	font-size: 1.6rem;
	display: inline-block;
	padding: 0 0;
	margin: 0 18px 0 0;}

.header-snslist li a{
	text-decoration: none;
	transition: 0.3s;}

.header-snslist li a:hover{
	opacity: 0.8;}

.header-snslist li a img{
	aspect-ratio: 1 / 1;
	width: 30px;
	height: auto;}


@media only screen and (max-width: 960px) {
}


@media only screen and (max-width: 650px) {
.header-box{
	margin:30px 15px;}

.header_logo svg{
	width: 90px;
	height: auto;}

.header-language-btn-area{
	position: absolute;
	top: 0;
	right: 80px;}

.header-language{
	font-size: 14px;
	font-size: 1.4rem;
	width: 80px;
	padding: 10px 20px 10px 40px;
	border: 1px #000 solid;
	border-radius: 50px;}

.header-language:before{
	width: 15px;
	height: 15px;
	top: 50%;
	left: 20px;
	transform: translate(0,-50%);}

.header-language-btn-area-open .header-language{
	border: 1px #000 solid;}

.header-language-btn{
	font-size: 14px;
	font-size: 1.4rem;
	padding: 10px 10px;}
	
.header-icon{
	width:50px;
	height:41px;
	top: 0;}
	
.menu-icon span{
	width:50px;
	height:5px;
	background-color:#000;
	margin-bottom:13px;}
	
.clause-icon{
	width:50px;
	height:41px;
	cursor: pointer;
	display:block;
	z-index:995;
	margin-top: 10px}
	
.clause-icon span{
	width:50px;
	height:5px;}
	
.clause-icon span:first-child{
	margin-bottom: -5px;}
	
.menu{
	left:100%;
	width:100%;}
	
.menu-open{
	left:0;}
	
.header-nav{
	height: calc(100% - 181px);
	margin:96px 15px 15px 15px;}
	
.header-nav li a{
	padding:15px 20px;
	border-top:1px #FFF solid;
	border-bottom: none;}
	
.header-nav li:last-child a{
	border-bottom:1px #FFF solid;}
}

@media only screen and (max-width: 520px) {
.header-box{
	margin:5.77vw 2.88vw;}

.header_logo svg{
	width: 16vw;
	height: auto;}

.header-language-btn-area{
	right: 15.38vw;}

.header-language{
	font-size: 2.69vw;
	width: 15.38vw;
	padding: 1.92vw 3.84vw 1.92vw 7.69vw;
	border: 0.19vw #000 solid;
	border-radius: 9.61vw;}

.header-language:before{
	width: 2.88vw;
	height: 2.88vw;
	left: 3.84vw;}

.header-language-btn-area-open .header-language{
	border: 0.19vw #000 solid;}

.header-language-btn{
	font-size: 2.69vw;
	padding: 1.92vw 1.92vw;
	border-left: 0.19vw #000 solid;
	border-right: 0.19vw #000 solid;
	border-bottom: 0.19vw #000 solid;}
	
.header-icon{
	width:9.61vw;
	height:7.88vw;
	top: 0;}
	
.menu-icon span{
	width:9.61vw;
	height:0.96vw;
	margin-bottom:2.5vw;}
	
.clause-icon{
	width:9.61vw;
	height:7.88vw;
	margin-top: 1.92vw;}
	
.clause-icon span{
	width:9.61vw;
	height:0.96vw;}
	
.clause-icon span:first-child{
	margin-bottom: -0.96vw;}
	
.header-nav{
	height: calc(100% - 37.83vw);
	margin:17.3vw 2.88vw 2.88vw 2.88vw;}
	
.header-nav li a{
	font-size:3.84vw;
	padding:3.84vw 3.84vw;
	border-top:0.19vw #FFF solid;}
	
.header-nav li:last-child a{
	border-bottom:0.19vw #FFF solid;}

.header-snslist{
	text-align: center;
	margin: 0 5.77vw 5.77vw 5.77vw;}

.header-snslist li{
	margin: 0 3.2vw 0 3.2vw;}

.header-snslist li a img{
	width: 8.8vw;}
}




