@charset "UTF-8";
@import url("../css/base.css");
/*共通設定-------------------------------------------------------------------------------------------------------------------------------------*/
/*基本設定*/
/*メイン*/
#m_top {
  margin: 3em auto 0; }
  #m_top h1 {
    font-size: 225%;
    color: #1f57aa;
    text-align: center;
    width: 100%;
    border-top: 3px solid #1f57aa;
    border-bottom: 3px solid #1f57aa; }
    #m_top h1 i {
      display: block;
      font-size: 55%;
      font-style: normal; }
  #m_top p {
    width: 100%;
    text-align: center;
    color: #1c91cc;
    margin: 2em 0 0;
    font-size: 150%;
    font-weight: bold; }
    #m_top p i {
      display: block;
      font-size: 75%; }
  #m_top ul {
    width: 100%;
    margin: 2em 0 0;
    display: flex;
    justify-content: space-between; }
    #m_top ul li {
      width: 32.333%;
      border-radius: 15px;
      padding: 1.5em 0;
      box-sizing: border-box;
      font-weight: bold;
      text-align: center;
      color: #000;
      position: relative;
      min-height: 23em; }
      #m_top ul li i {
        position: absolute;
        top: 20em;
        display: block;
        font-size: 80%;
        font-style: normal;
        font-weight: normal;
        margin: 3em 0 0;
        text-align: left; }
      #m_top ul li img {
        width: 200px;
        display: block;
        margin: 0 auto 0.5em; }
  #m_top dl {
    width: 80%;
    margin: 1.5em auto 0;
    background-color: #eeeeee;
    padding: 1em 2%;
    border-radius: 8px; }
    #m_top dl dt {
      font-weight: bold; }
    #m_top dl dd {
      font-size: 87%; }

#for_foreigner {
  margin: 4em auto 0; }
  #for_foreigner h2 {
    font-size: 225%;
    color: #1f57aa;
    text-align: center;
    width: 100%;
    border-top: 3px solid #1f57aa;
    border-bottom: 3px solid #1f57aa; }
    #for_foreigner h2 i {
      display: block;
      font-size: 55%;
      font-style: normal; }
  #for_foreigner ul {
    width: 100%;
    margin: 3em 0 0; }
    #for_foreigner ul li {
      width: 70%;
      border: 1px solid #f0f0f0;
      box-shadow: 0px 0px 5px 3px #f0f0f0;
      border-radius: 15px;
      padding: 1.5em 2%;
      margin: 5.5em auto 0;
      box-sizing: border-box;
      font-size: 112%;
      font-weight: bold;
      position: relative; }
      #for_foreigner ul li:after {
        content: "";
        position: absolute;
        right: 0;
        bottom: -4em;
        left: 0;
        width: 0px;
        height: 0px;
        margin: auto;
        border-style: solid;
        border-color: #1c91cc transparent transparent transparent;
        border-width: 40px 30px 0 30px; }
      #for_foreigner ul li:first-child {
        margin: 0 auto; }
      #for_foreigner ul li:last-child:after {
        display: none; }
      #for_foreigner ul li dl {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: top; }
        #for_foreigner ul li dl dt {
          width: 28%; }
        #for_foreigner ul li dl dd {
          width: 68%; }
          #for_foreigner ul li dl dd span {
            background-color: #418fde;
            color: #fff;
            font-size: 80%;
            display: block;
            width: 70px;
            padding: 0.1em 0;
            margin: 0 0 0.25em;
            text-align: center; }
          #for_foreigner ul li dl dd i {
            display: block;
            font-size: 75%;
            font-weight: normal;
            font-style: normal; }
          #for_foreigner ul li dl dd img {
            width: 350px;
            margin: 1em 0 0; }
  #for_foreigner #entry_end {
    width: 60%;
    margin: 3em auto 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 112%;
    font-weight: bold; }
    #for_foreigner #entry_end p:nth-child(1) {
      width: 58%; }
      #for_foreigner #entry_end p:nth-child(1) i {
        display: block;
        font-size: 55%;
        font-style: normal; }
      #for_foreigner #entry_end p:nth-child(1) a {
        display: block;
        font-size: 125%;
        margin: 1.5em auto 0;
        padding: 0.25em 0;
        border-radius: 8px;
        background-color: #ea962e;
        color: #fff;
        text-align: center;
        text-decoration: none;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all  0.3s ease; }
        #for_foreigner #entry_end p:nth-child(1) a:hover, #for_foreigner #entry_end p:nth-child(1) a:active {
          background-color: #EDA852;
          text-decoration: none;
          color: #fff; }
    #for_foreigner #entry_end p:nth-child(2) {
      width: 38%; }

/*共通設定ここまで-------------------------------------------------------------------------------------------------------------------------------------*/
/* pc */
@media screen and (min-width: 1300px) {
  /*メイン*/
  #m_top, #for_foreigner {
    width: 1280px; } }
/* tablet以下共通 ------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 1299px) {
  /*メイン*/
  #m_top, #for_foreigner {
    width: 96%; } }
/* tablet以下共通ここまで ------------------------------------------------------------------------------------------*/
/* tablet1 */
@media only screen and (min-width: 1024px) and (max-width: 1299px) {
  /*メイン*/
  #m_top ul li {
    min-height: 24em; }
    #m_top ul li i {
      position: absolute;
      top: 22em; } }
/* tablet2  */
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  /*メイン*/
  #m_top ul li {
    min-height: 26em; }
    #m_top ul li i {
      position: absolute;
      top: 24em; } }
/* tablet3  */
@media only screen and (max-width: 767px) {
  /*メイン*/
  #m_top {
    margin: 2em auto 0; }
    #m_top ul {
      flex-direction: column; }
      #m_top ul li {
        width: 80%;
        margin: 0 auto;
        position: static; }
        #m_top ul li i {
          margin: 1em 0 0;
          position: static;
          top: inherit; }
        #m_top ul li:nth-child(n+2) {
          margin: 1em auto 0; }

  #for_foreigner {
    margin: 3em auto 0; }
    #for_foreigner ul {
      width: 100%;
      margin: 2em 0 0; }
      #for_foreigner ul li {
        width: 80%;
        margin: 3.5em auto 0; }
        #for_foreigner ul li:after {
          content: "";
          position: absolute;
          right: 0;
          bottom: -3em;
          left: 0;
          width: 0px;
          height: 0px;
          margin: auto;
          border-style: solid;
          border-color: #1c91cc transparent transparent transparent;
          border-width: 25px 20px 0 20px; }
        #for_foreigner ul li dl dd span {
          width: 60px;
          margin: 1em 0 0.25em; }
    #for_foreigner #entry_end {
      width: 80%;
      margin: 2em auto 0; } }
/* smartPhone1 */
@media only screen and (max-width: 499px) {
  /*メイン*/
  #m_top h1 {
    width: 100%;
    font-size: 180%;
    padding: 0; }
    #m_top h1 rt, #m_top h1 rp {
      font-size: 50%; }
  #m_top ul {
    flex-direction: column; }
    #m_top ul li {
      width: 100%;
      margin: 0; }

  #for_foreigner {
    margin: 3em auto 0; }
    #for_foreigner h2 {
      width: 100%;
      font-size: 180%;
      padding: 0; }
      #for_foreigner h2 rt, #for_foreigner h2 rp {
        font-size: 50%; }
    #for_foreigner ul {
      width: 100%;
      margin: 2em 0 0; }
      #for_foreigner ul li {
        width: 100%; }
        #for_foreigner ul li dl {
          flex-direction: column; }
          #for_foreigner ul li dl dt {
            width: 100%; }
          #for_foreigner ul li dl dd {
            width: 100%; }
    #for_foreigner #entry_end {
      width: 100%;
      margin: 2em 0 0;
      flex-direction: column-reverse; }
      #for_foreigner #entry_end p:nth-child(1) {
        width: 80%;
        margin: 0 auto; }
        #for_foreigner #entry_end p:nth-child(1) img {
          width: 100%;
          margin: 1em 0 0; }
      #for_foreigner #entry_end p:nth-child(2) {
        width: 100%;
        margin: 0 0 1em; } }