@charset "UTF-8";

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

Mega Menu

------------------------------------------------- */
/* メニューの外枠
================================================== */
.mega-menu {
 position:absolute;
	left: 50%;
 top:20px;
 transform: translateX(-50%)
            translateY(0%);
 width: auto;
 height:auto;
	margin: auto;
 opacity: 0;
 pointer-events: none;
 z-index: 11;
	cursor:default;
}
.mega-menu.is-open {
 opacity: 1;
 pointer-events: auto;
}
@media screen and (max-width: 898px)  {
.mega-menu {
 display: none !important;
}
}

/* メニューの内枠
================================================== */
/*  吹き出し  */
.mega-menu__inner {
 background-color:#9ddcdc;				/*  色  */
	border-radius: 10px;
	margin-top: 20px;
	position: relative;
}

/*  横幅  */
.mega-menu__inner.guide {			/*  学校案内  */
	width: 165px;
}
.mega-menu__inner.school {			/*  入校のご案内  */
	width: 180px;
}
.mega-menu__inner.license {			/*  免許の種類  */
	width: 160px;
}
.mega-menu__inner.plan {			/*  プラン情報  */
	width: 290px;
}
.mega-menu__inner.charge {			/*  料金プラン  */
	width: 180px;
}
.mega-menu__inner.access {			/*  アクセス  */
	width: 140px;
}


/*  吹き出し上（三角）表示  */
.mega-menu__inner::after {
 content:"";
	position: absolute;
 top: -8px;
 left: 50%;
 transform: translateX(-50%);
 width: 18px;
 height: 9px;
 background-color:#9ddcdc;
 clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
	z-index: 11;
}
.mega-menu__contents.is-open {
 overflow: auto;
 height: 100%;
 padding: 0;
}
.mega-menu__list ul {
	width: 100%;
	display: flex;
	flex-flow: column wrap;
	justify-content:flex-start;
	margin: 0;
	padding: 15px 10px;
	list-style-type: none;
	position: relative;
}
.mega-menu__list li	{
	font-weight: 400 !important;
 text-align: left !important;
	background-color: #9ddcdc !important;			/*  .mega-menuの背景色に変更  */
}
.mega-menu__list li {
	height:auto !important;
	line-height:normal !important;
	font-size:1.3rem !important;
	margin: 2px 0 !important;
}
.mega-menu__list li:hover {
	display:inline !important;
	cursor:default !important;
}
.mega-menu__list li::before {
 display:inline-block;
 height: auto !important;
 position: static !important;
	border-right: none;
}

.mega-menu__list li a	{
	display: block;
	background:#E3F6F5;
	border-radius: 15px;
	color: #272343 !important;
	font-size:1.3rem !important;
	padding: 5px 0 5px 25px;
	position: relative;
}
.mega-menu__list li a:hover	{
	background: #ffffff;
	border-radius: 15px;
	text-decoration: none;
}
.mega-menu__list li a::after {
 content: "";
 position: absolute;
 top: 16px;
 bottom: 0;
 left: 10px;
 display: flex;
 justify-content: center;
 align-items: center;
 transition: left 0.3s;
 width: 6px;
 height: 6px;
 border-top: solid 1px #272343;
 border-right: solid 1px #272343;
 transform: translateY(-50%) rotate(45deg);
}