@charset "utf-8";
/* CSS Document */



@media (min-width: 320px) {

		
.accordion li  {
	width: 96px;
	float: right;
}

.accordion li a {
	height: 50px;
	margin: 1px;
	color: #fff;
	background: #315bc4;
	text-align: center;
	line-height: 50px;
	display: block;
		}
		
.accordion li a:hover {
	background: #777;
}
		
.accordion li ul {
	width: 100%;
	display: none;
	position: absolute;
	z-index: 3;
}

.accordion li ul li {
	float: none;
	width: 96px;
}
		
.accordion li ul li a {
	background: #315bc4;
}

}

@media screen and (min-width: 321px) and (max-width: 767px) { 

.accordion li  {
	width: 50%;
	float: right;
}

.accordion li a {
	height: 50px;
	margin: 1px;
	color: #fff;
	background: #315bc4;
	text-align: center;
	line-height: 50px;
	display: block;
		}
		
.accordion li a:hover {
	background: #777;
}
		
.accordion li ul {
	width: 100%;
	display: none;
	position: absolute;
	z-index: 3;
}

.accordion li ul li {
	float: none;
	width: 115px;
}
		
.accordion li ul li a {
	background: #315bc4;
}
}

@media screen and (min-width: 768px) and (max-width: 991px) { 


.accordion li  {
	float: right;
	width: 240px;
}

.accordion li ul li {
	width: 240px;
}

}


@media (min-width: 992px) {


#navi{
	  display: flex;
	  justify-content: flex-end;
	  margin: 50px 0; 
	}


.accordion li ul {
   display: none;
   position: absolute;
}

.accordion {
	width: 100%;
	overflow: hidden;
}

.accordion li  {
	width: 150px;
	float: right;
}

.accordion li a {
	height: 40px;
	margin: 1px;
	color: #fff;
	background: #315bc4;
	text-align: center;
	line-height: 40px;
	display: block;
}
.accordion li a:hover {
	background: #777;
}
.accordion li ul {
	width: 100%;
	display: none;
	position: absolute;
}
.accordion li ul li {
	float: left;
	width: 150px;
}

.accordion li ul li a {
	background: #315bc4;
}

}