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

  #menu {
    display: none;
  }    
 
.slicknav_menu {
    display: block;
	position:fixed;
	top:0;
	right:0;
	width:10%;
	  z-index: 999;
  }  
  
  .slicknav_nav {
	  position:fixed;
	  top:70px;
	  left:0;
background:#fff;
width:100%;
	  z-index: 999;
  border-top: #0077c9 solid 1px;

}
  
	
.slicknav_nav li {
text-align: left;
	border-bottom:#0077c9 solid 1px;
  margin: 0;
}
	


.slicknav_nav li a span {
	font-size: 70%;
  margin-right: 0.5em;
display:inline-block;
    padding: 4px;
    background-color: #e4eefd;
    font-family: 'Noto Serif JP', serif;
  color: #000;
}

.slicknav_nav li a i{

	font-size: 90%;
	color:#0077c9;
}
	
.slicknav_nav li a .ics{
	vertical-align: middle;
	margin-right: 0.4em;
	width: 20px;
}
	
.sub-menu li a {
 /*   color: #CED5DC;*/
}
	
.sub-menu li a img {
	display: none;
	
}

.slicknav_nav li li:last-child {
border-bottom:none;
}

.slicknav_nav li.tlNm{
  display: none;
}


@media screen and (min-width : 767px) {
  
#menu {
  display:flex;
  align-items: center;
  margin:0 auto;
}

.slicknav_menu {
  display: none;
}
  
#menu > li {
display: inline-block;
text-align: center;
z-index: 30; 
vertical-align: middle;
align-content: center;
  margin-top: -30px;
}
  
#menu li:last-child{
	background-image: none;
}

#menu li a {
padding:15px 12px;
border-top: none;
border-right: none;
background: none;
display: inline-block;	
margin: auto;
font-size:90%;
letter-spacing: 0.05em;
text-decoration:none;
width: 100%;
font-weight: normal;
white-space: nowrap;
position: relative; 
transition: .3s;
font-family: 'Noto Serif JP', serif;
font-weight: 600;   

}
  
  #menu li a:hover{
    color: #0077c9;
    opacity: 1;
  }
  
#menu > li > a::after {
  position: absolute;
  left: 0px;
  top:calc( 50% - 20px);
  content: '';
  width:1px;
  height: 40px;
  background: #d3d3d3;
}
  
#menu > li:first-child > a::after,  
#menu > li:last-child > a::after {  
   content:none;
  }

  
#menu li a:active {
  color: #5687F8;
}

#menu li a span {
    display: block;
  width: 90px;
    font-weight: normal;
    font-size: 80%;
    letter-spacing: 0;
  padding: 4px;
  background-color: #e4eefd;
  margin: 0 auto 3px;
font-family: 'Noto Serif JP', serif;  
}

#menu li ul{
	opacity: 0;
	transition: 0.5s;
}

#menu li ul.sub-menu {
/*	display: none;*/
  visibility: hidden;

  position:absolute;
  top: 60px;
  left: -80px;
	right: 0;
    width: 100%;
/*    opacity: 1;
    transition: background-color 0.5s ease-out;
    -o-transition: background-color 0.5s ease-out;
    -moz-transition: background-color 0.5s ease-out;
    -webkit-transition: background-color 0.5s ease-out;	*/
  text-align: center;
  margin: 0 auto;  
  opacity: 0;
  transition: .5s;

}

#menu li:hover ul.sub-menu {
 /* display: block;*/  
  visibility: visible;
  opacity: 1;
}

#menu li ul.sub-menu li {
	background-image: none;
	display: inline-block;
  width: 160px;border-bottom: #fff solid 1px;

} 
  
  #menu li ul.sub-menu li.mbOn{
    display: none;
  }  
  
#menu li ul.sub-menu li a {
    display: block;
    padding: 15px 5px 20px;
    color: #000;
    font-weight: 400;
	background-color: #C0E5FD;
    transition: background-color 0.5s ease-out;
    -o-transition: background-color 0.5s ease-out;
    -moz-transition: background-color 0.5s ease-out;
    -webkit-transition: background-color 0.5s ease-out;
	text-align: center;
	cursor: pointer;
  font-size: 85%;
}
  
  #menu li.bz3 ul.sub-menu li a {
    font-size: 75%;
    letter-spacing: 0.02em;
    padding-top: 18px;
  }  
  
  #menu li.bz3 ul.sub-menu li a img{
   
  }

#menu li ul.sub-menu li a img{
	margin-top: 10px;
  display: block;
  width: 120px;
  margin: 5px auto 0;
}

#menu li ul.sub-menu li:last-child a {
	border-bottom: none;
}

#menu li ul.sub-menu li a:hover {
	background-color:#7CC6F7;
  color: #fff;
}
  
  #menu li ul.sub-menu li a:after{
    background:transparent !important;

  }  

#menu li ul.sub-menu li a .ics{
	vertical-align: middle;
	margin-right: 0.4em;
	width: 20px;
}

.fixed #menu li ul.sub-menu { 
 top:60px; 
  
  }

.fixed #menu li{
	width: auto;
}

}

/*--------------current------------------*/

#business #menu > li:nth-child(2) a:after {
position: absolute;
    bottom: 0;
    left:calc(50% - 40px);
    width:80px;
    height: 2px;
    background: #0077c9;
    content: "";
  transform: none;
}

#works #menu > li:nth-child(3) a:after {
position: absolute;
    bottom: 0;
    left:calc(50% - 40px);
    width:80px;
    height: 2px;
    background: #0077c9;
    content: "";
  transform: none;
}

#about #menu > li:nth-child(4) a:after {
position: absolute;
    bottom: 0;
    left:calc(50% - 40px);
    width:80px;
    height: 2px;
    background: #0077c9;
    content: "";
  transform: none;
}

#recruit #menu > li:nth-child(5) a:after,
#graduate #menu > li:nth-child(5) a:after,
#career #menu > li:nth-child(5) a:after {
position: absolute;
    bottom: 0;
    left:calc(50% - 40px);
    width:80px;
    height: 2px;
    background: #0077c9;
    content: "";
  transform: none;
}

#action #menu > li:nth-child(7) a:after {
position: absolute;
    bottom: 0;
    left:calc(50% - 40px);
    width:80px;
    height: 2px;
    background: #0077c9;
    content: "";
  transform: none;
}

#contact #menu > li:nth-child(8) a:after {
position: absolute;
    bottom: 0;
    left:calc(50% - 40px);
    width:80px;
    height: 2px;
    background: #0077c9;
    content: "";
  transform: none;
}










