html {
  scroll-behavior: smooth; }

#global-header {
  width: 100%; }
  #global-header .inner {
    width: 1366px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center; }
    #global-header .inner .logo {
      width: 7%;
      margin: 0 3% 0 3%; }
      #global-header .inner .logo a img {
        width: 100%;
        margin: 0 auto;
        display: block;
        height: auto;
        vertical-align: bottom; }
    #global-header .inner #global-navi {
      width: 100%;
      margin: 0 auto 0 0; }
      #global-header .inner #global-navi ul {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex: 1;
        width: 100%; }
        #global-header .inner #global-navi ul li {
          position: relative;
          width: 100%;
          z-index: 1; }
          #global-header .inner #global-navi ul li:hover ul {
            display: block;
            overflow: visible;
            top: 70px;
            background-color: #ea6515;
            color: #ffffff;
            width: 100%; }
          #global-header .inner #global-navi ul li a {
            color: #00649b;
            font-size: 1.55em;
            font-weight: bold;
            padding: 24px 0;
            width: 100%;
            display: inline-block;
            text-align: center;
            transition: all .5s ease;
            line-height: 1; }
            #global-header .inner #global-navi ul li a span {
              transition: all .5s ease;
              font-size: .8em; }
            #global-header .inner #global-navi ul li a:hover span {
              color: #ffffff;
              display: block; }
            #global-header .inner #global-navi ul li a:hover {
              background: #00649b;
              color: #ffffff;
              padding: 24px 0px; }
          #global-header .inner #global-navi ul li ul {
            display: none;
            position: absolute;
            width: 100%; }
            #global-header .inner #global-navi ul li ul a {
              color: #ffffff;
              width: 100%; }
              #global-header .inner #global-navi ul li ul a:hover {
                width: 100%;
                text-align: center;
                background-color: #ea6515; }
    @media screen and (max-width: 1366px) {
      #global-header .inner {
        width: 100%; }
        #global-header .inner .logo {
          padding-left: 24px; } }
    @media screen and (max-width: 1024px) {
      #global-header .inner {
        height: 70px; }
        #global-header .inner .logo {
          width: 100%;
          text-align: center; }
          #global-header .inner .logo a {
            display: inline-block; }
            #global-header .inner .logo a img {
              width: auto;
              height: 70%; }
        #global-header .inner #global-navi {
          display: none; } }
    @media screen and (max-width: 480px) {
      #global-header .inner .logo a {
        width: 30%; }
        #global-header .inner .logo a img {
          width: 70%;
          height: auto; } }

main#container .page-header {
  text-align: center;
  margin: 10% 0 3% 0; }
  @media screen and (max-width: 480px) {
    main#container .page-header {
      margin: 15% 0 10% 0; } }
  main#container .page-header h2 {
    display: inline-block;
    padding-right: 18px;
    font-size: 1.85em;
    letter-spacing: .25em;
    font-weight: bold; }
  main#container .page-header img {
    width: 30px; }
  main#container .page-header .maru1 {
    margin: 0 13px -8px 0; }
  main#container .page-header .maru2 {
    width: 45px;
    margin: 0 0 2px -2px; }
main#container .page-header.contact-content {
  margin-bottom: 40px; }

.contact-box {
  width: 70%;
  padding: 5%;
  margin: 2% auto 10% auto;
  display: flex;
  background: #fff;
  border: 4px solid #f2f8f9;
  align-items: center; }
  @media screen and (max-width: 768px) {
    .contact-box {
      width: 100%; } }
  .contact-box .contact_left {
    width: 65%; }
    @media screen and (max-width: 480px) {
      .contact-box .contact_left {
        width: 100%; } }
    .contact-box .contact_left h2 {
      color: #00649b;
      font-size: 2em;
      font-weight: bold; }
    .contact-box .contact_left .contact_bottom {
      display: flex; }
      @media screen and (max-width: 480px) {
        .contact-box .contact_left .contact_bottom {
          width: 100%; } }
      .contact-box .contact_left .contact_bottom .small_box {
        width: 40%;
        background: #f4f9f9;
        margin: 1%;
        padding: 3%; }
        @media screen and (max-width: 480px) {
          .contact-box .contact_left .contact_bottom .small_box {
            padding: 2%; } }
        .contact-box .contact_left .contact_bottom .small_box img {
          text-align: center;
          margin: 5% auto 10% auto;
          width: 40px;
          display: block; }
        .contact-box .contact_left .contact_bottom .small_box p {
          text-align: left;
          font-size: 1.55em;
          padding: 5%; }
    @media screen and (max-width: 768px) {
      .contact-box .contact_left {
        width: 90%;
        margin: 0 auto; } }
  .contact-box .contact_right {
    width: 35%;
    margin: 4% 0 0 5%; }
    @media screen and (max-width: 480px) {
      .contact-box .contact_right {
        width: 90%;
        margin: 5% auto 0 auto; } }
    .contact-box .contact_right .right_top {
      display: flex;
      align-items: center;
      margin-bottom: 10%; }
      .contact-box .contact_right .right_top img {
        width: 40%; }
    .contact-box .contact_right p {
      font-size: 1.55em;
      margin-left: 3%; }
      .contact-box .contact_right p span {
        font-size: 1.2em;
        color: #00649b; }
  .contact-box .right_bottom img {
    margin-top: 3%;
    width: 100%; }
    .contact-box .right_bottom img:nth-child(1):hover {
      opacity: 0.5;
      transition: 0.5s; }
  @media screen and (max-width: 768px) {
    .contact-box {
      flex-direction: column; } }

#global-header .inner #global-navi ul li:nth-child(7) a {
  background-color: #00649b;
  color: #fff; }
  #global-header .inner #global-navi ul li:nth-child(7) a span {
    color: #fff; }

#key-visual {
  background: url("../contact/images/top.jpg") no-repeat center center;
  background-size: cover;
  height: 563px;
  width: 100%;
  position: relative; }
  #key-visual h2 {
    position: absolute;
    bottom: 0;
    right: 0;
    font-size: 3em;
    color: #00afd8; }
    @media screen and (max-width: 480px) {
      #key-visual h2 {
        font-size: 2em; } }
    #key-visual h2 span {
      font-size: 5em;
      color: #fff;
      font-weight: bold; }
      @media screen and (max-width: 480px) {
        #key-visual h2 span {
          font-size: 2em; } }
  @media screen and (max-width: 480px) {
    #key-visual {
      height: 200px; } }

.page-contents {
  width: 1366px;
  margin: 0 auto 80px; }
  @media screen and (max-width: 1366px) {
    .page-contents {
      width: 100%; } }

.content-inner {
  width: 100%;
  margin: 0 auto;
  background: #f9f9f9;
  padding: 0; }

div.page-desc {
  width: 770px;
  margin: 0 auto 80px; }
  div.page-desc p {
    font-size: 1.55em;
    letter-spacing: .2em;
    line-height: 2; }
  @media screen and (max-width: 1024px) {
    div.page-desc {
      width: 90%; } }

#main-form {
  background: #f9f9f9;
  padding: 40px;
  width: 800px;
  margin: 0 auto; }
  #main-form dl div {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 24px 0; }
    @media screen and (max-width: 480px) {
      #main-form dl div {
        padding: 4px 0; } }
    #main-form dl div dt {
      width: 30%;
      font-size: 1.4em;
      font-weight: bold; }
      #main-form dl div dt span.hissu {
        color: #e0222b; }
    #main-form dl div dd {
      width: 70%; }
      #main-form dl div dd input, #main-form dl div dd textarea {
        font-size: 1.6em;
        padding: 8px;
        background: #f4f9f9;
        border: #6f9aad solid 1px;
        box-sizing: border-box;
        width: 100%; }
  #main-form .btn-group {
    text-align: center;
    padding: 40px 0; }
    #main-form .btn-group input[type="reset"],
    #main-form .btn-group input[type="submit"] {
      border: none;
      font-size: 1.6em; }
    #main-form .btn-group input[type="reset"] {
      padding: 24px 48px;
      margin-right: 24px;
      background: #cccccc; }
    #main-form .btn-group input[type="submit"] {
      padding: 24px 48px;
      background: #00649b;
      color: #ffffff;
      font-weight: bold; }
    @media screen and (max-width: 480px) {
      #main-form .btn-group input[type="reset"],
      #main-form .btn-group input[type="submit"] {
        padding: 12px 18px; } }
  @media screen and (max-width: 1024px) {
    #main-form {
      width: 90%; } }
  @media screen and (max-width: 480px) {
    #main-form {
      padding: 24px; }
      #main-form dl div {
        display: block; }
        #main-form dl div dt {
          width: 100%;
          margin-bottom: 12px; }
          #main-form dl div dt br {
            display: none; }
          #main-form dl div dt span.hissu {
            padding-left: 8px; }
        #main-form dl div dd {
          width: 100%; } }

#global-footer {
  background: url("../images/footer.jpg") no-repeat center;
  background-size: cover;
  height: 320px;
  width: 100%;
  display: flex;
  align-items: center; }
  @media screen and (max-width: 480px) {
    #global-footer {
      height: auto; } }
  #global-footer .footer-inner {
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center; }
    @media screen and (max-width: 480px) {
      #global-footer .footer-inner {
        height: auto;
        padding: 16px 0; } }
    #global-footer .footer-inner h1 {
      width: 15%; }
      #global-footer .footer-inner h1 a {
        padding: 12px 0;
        display: inline-block; }
        #global-footer .footer-inner h1 a img {
          vertical-align: bottom;
          width: 80%;
          height: auto;
          background: #fff;
          padding: 4%; }
          @media screen and (max-width: 480px) {
            #global-footer .footer-inner h1 a img {
              width: 20%; } }
      @media screen and (max-width: 1024px) {
        #global-footer .footer-inner h1 {
          width: 30%; } }
      @media screen and (max-width: 480px) {
        #global-footer .footer-inner h1 {
          width: 10%; } }
    #global-footer .footer-inner h2 {
      font-size: 1.1em;
      color: #fff;
      width: 180px; }
      #global-footer .footer-inner h2 span {
        font-size: 1.55em;
        color: #fff;
        letter-spacing: 0.01em; }
        @media screen and (max-width: 480px) {
          #global-footer .footer-inner h2 span {
            font-size: 1.1em; } }
    #global-footer .footer-inner .footer-navi {
      width: 100%; }
      #global-footer .footer-inner .footer-navi ul {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex: 1;
        width: 100%; }
        #global-footer .footer-inner .footer-navi ul li {
          position: relative;
          z-index: 1;
          width: 100%; }
          #global-footer .footer-inner .footer-navi ul li a {
            color: #fff;
            font-size: 1.4em;
            font-weight: bold;
            padding: 12px 0px;
            width: 100%;
            display: block;
            text-align: center;
            transition: all .5s ease; }
            #global-footer .footer-inner .footer-navi ul li a span {
              color: #fff;
              font-size: .7em;
              transition: all .5s ease;
              display: block; }
            #global-footer .footer-inner .footer-navi ul li a:hover span {
              color: #00649b;
              display: block; }
            #global-footer .footer-inner .footer-navi ul li a:hover {
              background: #fff;
              color: #00649b;
              padding: 12px 0px;
              display: block; }
    @media screen and (max-width: 1366px) {
      #global-footer .footer-inner {
        width: 100%; }
        #global-footer .footer-inner h1 {
          padding-left: 24px; } }
    @media screen and (max-width: 480px) {
      #global-footer .footer-inner {
        height: 100px;
        align-items: center;
        justify-content: center; } }
  #global-footer .copy small {
    display: block;
    width: 1366px;
    margin: 0 auto 0 auto;
    color: #ffffff;
    font-size: 1.2em; }
  @media screen and (max-width: 1366px) {
    #global-footer .copy small {
      width: 100%; } }
  @media screen and (max-width: 1024px) {
    #global-footer .copy small {
      text-align: center; } }
  @media screen and (max-width: 1024px) {
    #global-footer .footer-inner {
      width: 100%; }
      #global-footer .footer-inner h1 {
        width: 30%;
        text-align: center; }
      #global-footer .footer-inner .footer-navi {
        display: none; } }
  @media screen and (max-width: 480px) {
    #global-footer .footer-inner {
      width: 100%; }
      #global-footer .footer-inner h1 {
        width: 30%;
        padding-right: 10px; }
        #global-footer .footer-inner h1 a {
          padding: 6px 0 10px; }
          #global-footer .footer-inner h1 a img {
            width: 90%; } }

.copy_small {
  width: 100%;
  text-align: center;
  color: #fff; }

.footer_top {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1300px;
  margin: 0 auto;
  justify-content: center;
  align-items: center; }
  @media screen and (max-width: 480px) {
    .footer_top {
      margin-bottom: 6px; } }