@charset "utf-8";

header #logo{
  width: 40%;
  padding: 0 10px;
}
header #nav-content{
  height: 55px;
}

#side_links{
  z-index: 300;
  right: -100px;
  top: auto;
  transform: translateY(0);
  bottom: 0;
  transition: all ease .3s .3s;
}
.nav-open #side_links{
  right: 0;
}

nav.nav{
  display: flex;
  flex-direction: column;
}
#sub_nv{
  padding-top: 10px;
  margin: 10px auto;
  order: 2;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  border-bottom: 0;
  border-top: 1px solid rgba(255,255,255,0.5);
}

#gl_nv{
  flex-direction: column;
  justify-content: flex-start;
}
#gl_nv li{
  font-size: 110%;
  margin-bottom: 1em;
}
#gl_nv a{
  display: block;
  margin-bottom: 1em;
}
#gl_nv a::after{
  bottom: -0.25em;
}

#gl_nv span.sm_none{
	display: none
}
#gl_nv span.pc_none{
	display: inline-block;
  padding-right: 0.5em;
}

.nav {
    position: fixed;
    right: -200px; /* ÓÒ¤«¤é³ö¤Æ¤¯¤ë */
    top: 0;
    width: 180px; /* ¥¹¥Þ¥Û¤Ë…§¤Þ¤ë¥µ¥¤¥º */
    height: 100vh;
    padding-top: 80px;
    background-color: #8e1728;
    transition: all .6s;
    z-index: 200;
    overflow-y: auto; /* ¥á¥Ë¥å©`¤¬¶à¤¯¤Ê¤Ã¤¿¤é¥¹¥¯¥í©`¥ë¤Ç¤­¤ë¤è¤¦¤Ë */
  }
  .hamburger {
    position: fixed;
    right: 0;
    top: 0;
    width: 55px; /* ¥¯¥ê¥Ã¥¯¤·¤ä¤¹¤¤·ù */
    height: 55px; /* ¥¯¥ê¥Ã¥¯¤·¤ä¤¹¤¤¸ß¤µ */
    cursor: pointer;
    z-index: 300;
    background: #333;
  }
  .hamburger::after{
      position: absolute;
      content: "MENU";
      color: #fff;
      font-weight: bold;
    font-size: 0.6em;
      left: 50%;
      bottom: 10%;
      transform: translateX(-50%);
      transition: all .5s;
  }
  .nav_list {
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .nav_item {
    text-align: center;
    padding: 0 14px;
  }
  .nav_item a {
    display: block;
    padding: 8px 0;
    border-bottom: 1px solid #eee;
    text-decoration: none;
    color: #333;
  }
  .nav_item a:hover {
    background-color: #eee;
  }
  .hamburger_border {
    position: absolute;
    left: 25%;
    width: 50%;
    height: 1px;
    background-color: #fff;
    transition: all .5s;
  }
  .hamburger_border_top {
    top: 30%;
  }
  .hamburger_border_center {
    top: 43%;
    transition: all .3s;
  }
  .hamburger_border_bottom {
    top: auto;
    bottom: 40%;
  }
  .black_bg {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    z-index: 100;
    background-color: #212121;
    opacity: 0;
    visibility: hidden;
    transition: all .5s;
    cursor: pointer;
  }

  /* ±íʾ¤µ¤ì¤¿•rÓäÎCSS */
  .nav-open .nav {
    right: 0;
  }
  .nav-open .black_bg {
    opacity: .8;
    visibility: visible;
  }
  .nav-open .hamburger::after{
      content: "CLOSE";
      transition: all .5s;
  }
  .nav-open .hamburger_border_top {
    transform: rotate(45deg);
    top: 40%;
    transition: all .5s;
  }
  .nav-open .hamburger_border_center {
    width: 0;
    left: 100%;
    opacity: 0;
    transition: all .3s;
  }
  .nav-open .hamburger_border_bottom {
    transform: rotate(-45deg);
    top: 40%;
    transition: all .5s;
  }
  

  #entry_page #left_box {
      flex: auto;
  }
  #entry_page #right_box {
      min-width:180px;
      margin-left: 40px;
  }

  #gpu-news-list > article a figure{
    width: 100px;
    height: 100px;
  }
  #gpu-news-list > article a > div{
    width: calc(100% - 140px);
  }

  #campus_list {
    flex-direction: column;
  }
  #campus_list section{
    width: 100%;
  }

#folder_top_menu ul::after,#folder_top_menu ul > li{
	width: 48%;
}


  footer aside ul{
    padding: 25px 0;
    font-size: 80%;
  }
  footer #pagetop a{
    width: 70px;
  }
  footer #pagetop a::after{
    width: 25px;
    height: 25px;
  }