@charset "utf-8";

/*=========================================*/
/* 共通設定 */
/*=========================================*/


/*-- HEADER CONTACT NAV --*/

.header_contact_nav_flame{
	position:absolute;
	top:130px;
	right:0px;
	width:300px;
	height:70px;
	display:none;
}

.header_contact_nav{
	position:relative;
	background-color:rgba(220,130,0,1.0);
	display:flex;
	display:-webkit-flex;
	justify-content:space-between;
	text-decoration:none;
	cursor:pointer;
	transition:0.25s ease-out;
	/* radius */
	-webkit-border-top-left-radius:100px;
	   -moz-border-top-left-radius:100px;
	        border-top-left-radius:100px;
	-webkit-border-bottom-left-radius:100px;
	   -moz-border-bottom-left-radius:100px;
	        border-bottom-left-radius:100px;
}

.header_contact_nav:hover{
	background-color:rgba(210,120,0,1.0);
}

.header_contact_nav .name{
	position:relative;
	padding:0px 0px 0px 35px;
	font-size:112.5%;
	line-height:70px;
	color:rgba(255,255,255,1.0);
	font-weight:700;
	transition:0.25s ease-out;
	z-index:1;
}

.header_contact_nav:hover .name{
	color:rgba(255,255,255,1.0);
}

.header_contact_nav .icon{
	position:relative;
	padding:25px 25px 25px 0px;
	font-size:0px;
	z-index:1;
}

.header_contact_nav .icon svg{
	width:20px;
	height:20px;
}

.header_contact_nav .icon path{
	fill:rgba(255,255,255,1.0);
	transition:0.25s ease-out;
}

.header_contact_nav:hover .icon path{
	fill:rgba(255,255,255,1.0);
}

@media screen and (max-width:1440px){

.header_contact_nav_flame{
	top:125px;
	width:280px;
	height:60px;
	display:none;
}

.header_contact_nav .name{
	font-size:106.25%;
	line-height:60px;
}

.header_contact_nav .icon{
	padding:21px 25px 21px 0px;
}

.header_contact_nav .icon svg{
	width:18px;
	height:18px;
}

}

@media screen and (max-width:1280px){

.header_contact_nav_flame{
	top:30px;
	right:110px;
	width:260px;
	height:50px;
	display:none;
}

.header_contact_nav{
	/* radius */
	-webkit-border-top-left-radius:100px;
	   -moz-border-top-left-radius:100px;
	        border-top-left-radius:100px;
	-webkit-border-bottom-left-radius:100px;
	   -moz-border-bottom-left-radius:100px;
	        border-bottom-left-radius:100px;
	-webkit-border-top-right-radius:100px;
	   -moz-border-top-right-radius:100px;
	        border-top-right-radius:100px;
	-webkit-border-bottom-right-radius:100px;
	   -moz-border-bottom-right-radius:100px;
	        border-bottom-right-radius:100px;
}

.header_contact_nav:hover{
	background-color:rgba(220,130,0,1.0);
}

.header_contact_nav .name{
	padding:0px 0px 0px 30px;
	font-size:106.25%;
	line-height:50px;
}

.header_contact_nav .icon{
	padding:17px 25px 17px 0px;
}

.header_contact_nav .icon svg{
	width:16px;
	height:16px;
}

}

@media all and (max-width:960px), print{

.header_contact_nav_flame{
	top:30px;
	right:110px;
	width:180px;
	height:50px;
	display:none;
}

.header_contact_nav{
	/* radius */
	-webkit-border-top-left-radius:100px;
	   -moz-border-top-left-radius:100px;
	        border-top-left-radius:100px;
	-webkit-border-bottom-left-radius:100px;
	   -moz-border-bottom-left-radius:100px;
	        border-bottom-left-radius:100px;
	-webkit-border-top-right-radius:100px;
	   -moz-border-top-right-radius:100px;
	        border-top-right-radius:100px;
	-webkit-border-bottom-right-radius:100px;
	   -moz-border-bottom-right-radius:100px;
	        border-bottom-right-radius:100px;
}

.header_contact_nav .name{
	padding:0px 0px 0px 30px;
	font-size:93.75%;
	line-height:50px;
}

.header_contact_nav:hover .name{
	color:rgba(255,255,255,1.0);
}

.header_contact_nav .name span{
	display:none;
}

.header_contact_nav .icon{
	padding:17px 25px 17px 0px;
}

.header_contact_nav .icon svg{
	width:16px;
	height:16px;
}

.header_contact_nav:hover .icon path{
	fill:rgba(255,255,255,1.0);
}

}

@media screen and (max-width:640px){

.header_contact_nav_flame{
	top:25px;
	right:90px;
	width:140px;
	display:none;
}

.header_contact_nav .name{
	padding:0px 0px 0px 25px;
	font-size:87.5%;
}

.header_contact_nav .icon{
	padding:18px 20px 18px 0px;
}

.header_contact_nav .icon svg{
	width:14px;
	height:14px;
}

}


/*-- HEADER CONTACT NAV --*/

.header_contact_nav_flame{
	display:none;
}

@media screen and (max-width:1440px){

.header_contact_nav_flame{
	display:none;
}

}

@media screen and (max-width:1280px){

.header_contact_nav_flame{
	display:block;
}

}

@media all and (max-width:960px), print{

.header_contact_nav_flame{
	display:block;
}

}

@media screen and (max-width:640px){

.header_contact_nav_flame{
	display:block;
}

}