/* CSS Document */
h3 {
  font-size: 50px;
  font-size: 5rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  margin: 0 0 2rem 4rem; }
  @media screen and (max-width: 991px) {
    h3 {
      font-size: 40px;
      font-size: 4rem;
      margin-left: 3rem; } }
  @media screen and (max-width: 575px) {
    h3 {
      font-size: 32px;
      font-size: 3.2rem;
      margin: 0 0 1rem 1rem; } }
  h3 span {
    font-size: 20px;
    font-size: 2rem;
    letter-spacing: 0.1em;
    margin-left: 2rem; }
    @media screen and (max-width: 575px) {
      h3 span {
        font-size: 16px;
        font-size: 1.6rem;
        margin-left: 1rem; } }

#message {
  background-color: #000; }
  #message h3 {
    color: #fff; }
  #message .message-img {
    overflow: hidden;
    margin-right: calc(50% - 50vw);
    height: 540px;
    margin-bottom: 9rem; }
    @media screen and (max-width: 1199px) {
      #message .message-img {
        height: 450px; } }
    @media screen and (max-width: 991px) {
      #message .message-img {
        height: 350px;
        margin-bottom: 6rem; } }
    @media screen and (max-width: 767px) {
      #message .message-img {
        height: 300px; } }
    @media screen and (max-width: 575px) {
      #message .message-img {
        height: 250px;
        margin-bottom: 3rem; } }
    #message .message-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: top; }
      @media screen and (max-width: 991px) {
        #message .message-img img {
          object-position: center; } }
    #message .message-img + h3 {
      line-height: 1.5;
      margin-bottom: 5rem; }
      @media screen and (max-width: 575px) {
        #message .message-img + h3 {
          font-size: 25px;
          font-size: 2.5rem;
          margin-bottom: 2rem; } }
  #message p {
    color: #fff;
    margin-left: 4rem; }
    @media screen and (max-width: 991px) {
      #message p {
        margin-left: 3rem; } }
    @media screen and (max-width: 575px) {
      #message p {
        margin-left: 1rem; } }
    #message p span {
      display: block;
      text-align: right; }

#profile {
  padding-bottom: 4rem; }
  @media screen and (max-width: 575px) {
    #profile {
      padding-bottom: 2rem; } }
  #profile .profile-img {
    overflow: hidden;
    height: 540px;
    margin-left: calc(50% - 50vw);
    text-align: right; }
    @media screen and (max-width: 1199px) {
      #profile .profile-img {
        height: 450px; } }
    @media screen and (max-width: 991px) {
      #profile .profile-img {
        height: 350px; } }
    @media screen and (max-width: 767px) {
      #profile .profile-img {
        height: 300px; } }
    @media screen and (max-width: 575px) {
      #profile .profile-img {
        height: 250px; } }
    #profile .profile-img img {
      width: 100%;
      height: 100%;
      object-fit: cover; }
      @media screen and (max-width: 991px) {
        #profile .profile-img img {
          object-position: center left; } }
  #profile table {
    width: 70%;
    margin: 8rem auto 0; }
    @media screen and (max-width: 1199px) {
      #profile table {
        width: 80%; } }
    @media screen and (max-width: 991px) {
      #profile table {
        width: 90%;
        margin: 6rem auto 0; } }
    @media screen and (max-width: 575px) {
      #profile table {
        width: 100%;
        margin: 4rem auto 0; } }
    #profile table tr {
      width: 100%; }
    #profile table th, #profile table td {
      font-size: 18px;
      font-size: 1.8rem;
      border-bottom: solid 1px rgba(61, 61, 51, 0.5);
      padding: 1rem 0; }
      @media screen and (max-width: 767px) {
        #profile table th, #profile table td {
          line-height: 1.5; } }
      @media screen and (max-width: 575px) {
        #profile table th, #profile table td {
          display: block;
          font-size: 16px;
          font-size: 1.6rem; } }
    #profile table th {
      width: 25%;
      font-weight: 600;
      vertical-align: text-top; }
      @media screen and (max-width: 575px) {
        #profile table th {
          width: 100%;
          padding-bottom: 0;
          border-bottom: none; } }
    #profile table td {
      width: 75%; }
      @media screen and (max-width: 575px) {
        #profile table td {
          width: 100%;
          padding-top: 0; } }
      @media screen and (max-width: 575px) {
        #profile table td dl {
          margin-bottom: 0; } }
      #profile table td dt {
        margin-bottom: 0; }
        @media screen and (max-width: 575px) {
          #profile table td dt {
            margin-top: 1rem; } }
      #profile table td dd {
        text-align: justify;
        line-height: 1.5;
        margin: 0;
        padding: 0; }

#history table {
  width: 70%;
  margin: 8rem auto 0; }
  @media screen and (max-width: 1199px) {
    #history table {
      width: 80%; } }
  @media screen and (max-width: 991px) {
    #history table {
      width: 90%;
      margin: 6rem auto 0; } }
  @media screen and (max-width: 575px) {
    #history table {
      width: 100%;
      margin: 4rem auto 0; } }
  #history table tr {
    width: 100%; }
  #history table th, #history table td {
    font-size: 18px;
    font-size: 1.8rem;
    border-bottom: solid 1px rgba(61, 61, 51, 0.5);
    padding: 1rem 0; }
    @media screen and (max-width: 767px) {
      #history table th, #history table td {
        line-height: 1.5; } }
    @media screen and (max-width: 575px) {
      #history table th, #history table td {
        display: block;
        font-size: 16px;
        font-size: 1.6rem; } }
  #history table th {
    width: 30%;
    font-weight: 600; }
    @media screen and (max-width: 575px) {
      #history table th {
        width: 100%;
        padding-bottom: 0;
        border-bottom: none; } }
  #history table td {
    width: 70%; }
    @media screen and (max-width: 575px) {
      #history table td {
        width: 100%;
        padding-top: 0; } }