@charset "UTF-8";
/* media-queries.css */
@media screen and (min-width: 1680px) {
  /* 1680px以上 */
  #top-page .section {
    padding-top: 10em;
    padding-bottom: 10em; }
  #top-page .inner .titlebox,
  #top-page .inner .content {
    padding-left: 5vw;
    padding-right: 5vw; } }
@media screen and (max-width: 1440px) {
  /* 1440px以下 */
  .inner {
    padding-left: 10vw;
    padding-right: 10vw; } }
@media screen and (max-width: 1280px) {
  /* 1280px以下 */
  #header .nav-right ul li {
    margin-left: 2em; } }
@media screen and (max-width: 1080px) {
  /* 1080px以下 */
  #header #globalNav ul li,
  #header .nav-right ul li {
    font-size: 88%; }
  #header #globalNav ul li a {
    margin: 0 0.75em; }
  #header .nav-right ul li:first-child {
    margin-left: 0; }

  #top-page .contents .content-list .box .imgBox {
    width: 35%; }
  #top-page .contents .content-list .box .txtBox {
    width: 65%; } }
@media screen and (max-width: 1023px) {
  /* 1024px以下 */
  #header {
    padding: 1em 2.5vw; }
    #header h1.header-logo {
      width: 36vw; }
    #header #menu {
      display: block; }
    #header #globalNav {
      background: rgba(0, 0, 0, 0.8);
      display: flex;
      align-items: center;
      position: absolute;
      top: -100vh;
      left: 0;
      width: 100vw;
      height: 100vh;
      transition: all .35s;
      z-index: -1; }
      #header #globalNav::after {
        background-image: linear-gradient(0deg, #000000 0%, #13207E 100%);
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0.5; }
      #header #globalNav ul {
        display: block;
        margin-top: 10em;
        margin-bottom: 10em;
        overflow: scroll;
        flex-wrap: wrap;
        position: relative;
        text-align: left;
        width: 100%;
        z-index: 10; }
        #header #globalNav ul li {
          font-size: 132%;
          margin: 0 auto;
          width: 90%; }
          #header #globalNav ul li a {
            border-bottom: 1px solid #FFF;
            display: block;
            margin: 0;
            padding: 1em 2em;
            position: relative; }
            #header #globalNav ul li a::after {
              display: none; }
            #header #globalNav ul li a:first-child {
              border-top: 1px solid #FFF; }
            #header #globalNav ul li a span {
              background: #FFF;
              content: '';
              width: 1em;
              height: 1px;
              position: absolute;
              top: 50%;
              right: 4em;
              transform: translateY(-50%); }
              #header #globalNav ul li a span::before, #header #globalNav ul li a span::after {
                content: "";
                position: absolute;
                top: 50%;
                width: 0.65em;
                height: 1px;
                background-color: #FFF;
                transform: translateY(-50%); }
              #header #globalNav ul li a span::before, #header #globalNav ul li a span::after {
                right: 0;
                transform-origin: 100% 50%; }
              #header #globalNav ul li a span::before {
                transform: rotate(45deg); }
              #header #globalNav ul li a span::after {
                transform: rotate(-45deg); }
          #header #globalNav ul li.contact {
            display: block; }
          #header #globalNav ul li.menuTxt {
            display: block; }
          #header #globalNav ul li.lang {
            display: block; }
            #header #globalNav ul li.lang a {
              border: none;
              margin-top: 3em; }
      #header #globalNav .nav-inner {
        overflow: scroll;
        width: 100%;
        height: 100vh; }
      #header #globalNav.show {
        top: 0; }
    #header .nav-right {
      display: none; }
      #header .nav-right ul li:first-child {
        margin-left: 0; }

  #footer h1.footer-logo {
    width: 24vw; }

  .inner {
    padding-left: 7.5vw;
    padding-right: 7.5vw; } }
@media screen and (max-width: 820px) {
  /* 820px以下 */
  #top-page .main .logo-tohoku-univ img {
    width: 12vw; }
  #top-page .contents .content-list .box .btn .txt::before {
    display: none; }
  #top-page .contents .talenthub .box .btn .comingsoon {
    width: 75%; }
  #top-page .news .news-list ul li a {
    display: block; }
    #top-page .news .news-list ul li a .date {
      margin-right: 1em; }
    #top-page .news .news-list ul li a .category {
      margin-right: 0;
      padding: 0.1em 1.5em; }
    #top-page .news .news-list ul li a .title {
      display: block;
      margin-top: 0.5em;
      width: 100%; }
  #top-page .news .news-list .btn a {
    width: 75%; }
  #top-page .overview .composition .box {
    flex-wrap: wrap; }
    #top-page .overview .composition .box .txtBox,
    #top-page .overview .composition .box .imgBox {
      width: 100%; }
    #top-page .overview .composition .box .txtBox {
      margin-bottom: 2em; }

  .tab-none {
    display: none !important; }

  .tab {
    display: block !important; } }
@media screen and (max-width: 480px) {
  /* 480px以下 */
  #header {
    padding: 1em 5vw; }
    #header h1.header-logo {
      width: 55vw; }
    #header #globalNav .nav-inner {
      overflow: scroll;
      width: 100%;
      height: 100vh; }
    #header #globalNav ul {
      display: block;
      margin-top: 8em;
      margin-bottom: 8em; }
      #header #globalNav ul li {
        font-size: 108%; }
        #header #globalNav ul li a {
          padding: 1em 2em; }

  #footer h1.footer-logo {
    width: 65vw; }
  #footer .footer-inner ul.sns li {
    margin-right: 1em; }

  .inner {
    padding-left: 5vw;
    padding-right: 5vw; }

  #top-page .main h2.title {
    font-size: 275%;
    text-align: left; }
  #top-page .main .logo-tohoku-univ img {
    width: 20vw; }
  #top-page .main .scroll {
    left: 7.5vw; }
  #top-page .inner .titlebox,
  #top-page .inner .content {
    padding-left: 0;
    padding-right: 0; }
  #top-page .contents .content-list .box a {
    flex-wrap: wrap; }
    #top-page .contents .content-list .box a .imgBox,
    #top-page .contents .content-list .box a .txtBox {
      width: 100%; }
    #top-page .contents .content-list .box a .txtBox {
      padding: 1.5em 1em; }
  #top-page .contents .content-list .box .btn {
    margin-top: 1em;
    position: relative;
    right: auto;
    bottom: auto;
    text-align: right; }
  #top-page .contents .talenthub .box {
    padding: 3em 2em; }
    #top-page .contents .talenthub .box .btn .comingsoon {
      width: 100%; }
  #top-page .news .news-list ul li a {
    flex-wrap: wrap;
    padding: 1.25em 0; }
    #top-page .news .news-list ul li a .date {
      margin-right: 1em; }
    #top-page .news .news-list ul li a .title {
      margin-top: 0.5em;
      width: 100%; }
  #top-page .news .news-list .btn a {
    width: 100%; }
  #top-page .about.inner {
    flex-wrap: wrap; }
    #top-page .about.inner .txtBox,
    #top-page .about.inner .imgBox {
      width: 100%; }
  #top-page .overview .composition h3 {
    display: block;
    font-size: 128%;
    padding: 1.2em 3em 1.4em;
    text-align: center; }
  #top-page .overview .composition .box {
    flex-wrap: wrap; }
    #top-page .overview .composition .box .txtBox,
    #top-page .overview .composition .box .imgBox {
      width: 100%; }
    #top-page .overview .composition .box .imgBox {
      margin-top: 2em; }
  #top-page .message .message_title {
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 2.5em; }
    #top-page .message .message_title .imgBox {
      margin: 0 5%;
      width: 100%; }
    #top-page .message .message_title .titleBox {
      margin-top: 1.5em;
      width: 80%; }
  #top-page .chart .titlebox {
    text-align: left; }
  #top-page .access .titlebox {
    text-align: left; }
  #top-page .access.inner .content {
    padding-left: 3.5vw;
    padding-right: 3.5vw; }
  #top-page .links .content ul li {
    border-bottom: 1px solid #FFF;
    padding-bottom: 1em; }
    #top-page .links .content ul li a::before {
      display: none; }
  #top-page .contact.inner {
    flex-wrap: wrap; }
    #top-page .contact.inner .txtBox,
    #top-page .contact.inner .btnBox {
      width: 100%; }
    #top-page .contact.inner .btnBox {
      text-align: center; }

  .pc {
    display: none !important; }

  .smp-none {
    display: none !important; }

  .smp {
    display: block !important; } }