@charset "UTF-8";
html, body {
  height: 100%;
  -webkit-font-feature-settings: "palt" 1;
          font-feature-settings: "palt" 1;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

body {
  min-height: 100vh;
  -webkit-text-size-adjust: 100%;
     -moz-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
          text-size-adjust: 100%;
  font-size: 1rem;
}
@media (max-width: 767.98px) {
  body {
    font-size: 0.875rem;
  }
}

@supports (-webkit-touch-callout: none) {
  html {
    height: -webkit-fill-available;
  }
  body {
    min-height: 100vh;
    min-height: -webkit-fill-available;
  }
}
.wrapper {
  position: relative;
  overflow-x: hidden;
  min-height: 100%;
}
.wrapper > section {
  z-index: 10;
}

header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1030;
  background: transparent;
}
header.scroll {
  background-color: rgba(0, 104, 182, 0.25);
}
header.scroll .navbar-header .navbar-brand {
  display: block;
}
header .navbar-header .navbar-brand {
  background-position: center;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg preserveAspectRatio='xMidYMid' viewBox='0 0 100 55' xmlns='http://www.w3.org/2000/svg' stroke='none' fill='%23fff' fill-opacity='0.6'%3E%3Cpath d='M14.3,5l10-2.1-10.4,49.2H4.3L14.3,5Z'/%3E%3Cpath d='M55.3,15.2c-2.7-1.4-6.1-2.4-9.5-2.4s-7.7,1.3-7.7,5.2c0,7.3,15.6,6.9,15.6,19.6s-8.8,15.2-18.8,15.2-9.9-1.5-12.4-2.3l1.7-8c3.5,1.6,7.3,3.1,11.2,3.1s8.7-2.2,8.7-7.1c0-8.2-15.6-6.9-15.6-19.1s8.2-13.8,17-13.8,7.7.5,11.3,1.8l-1.6,7.7Z'/%3E%3Cpath d='M61.2,6.5h35.2l-1.5,7.2h-12.9l-8.3,38.4h-9.5l8.3-38.4h-12.9l1.6-7.2Z'/%3E%3C/svg%3E");
}
@media (min-width: 992px) {
  header .navbar-header {
    padding: 30px 0;
  }
  header .navbar-header .navbar-brand {
    width: 80px;
    padding-top: 44px;
  }
}
@media (max-width: 991.98px) {
  header .navbar-header {
    padding: 15px 0;
  }
  header .navbar-header .navbar-brand {
    width: 60px;
    padding-top: 33px;
  }
}

footer {
  background-color: rgb(0, 104, 182);
  color: #fff;
}
footer .company-logo {
  background-image: url("../images/logo-pj.svg");
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg preserveAspectRatio='xMidYMid' viewBox='0 0 500 110' xmlns='http://www.w3.org/2000/svg' stroke='none' fill='%23fff'%3E%3Cpath d='M30.3,22.8l13.3-2.8-13.9,65.7h-12.7l13.3-62.8Z'/%3E%3Cpath d='M46.9,47.2c.5-2.7,1-5.1,1.1-6.5l11,2.3s7.5-3.4,12.5-3.4c8.8,0,14.7,5.5,14.7,14.4s-.9,7-1.5,9.8l-4.7,21.8h-11.7l4.4-21.2c.6-3.1,1.3-6.1,1.3-9.4s-2.6-6.3-6.4-6.3c-8.1,0-11.1,7.6-12.6,14.3l-4.8,22.6h-11.7l8.3-38.5Z'/%3E%3Cpath d='M95.3,47.2c.5-2.7,1-5.1,1.1-6.5l11,2.3s7.5-3.4,12.5-3.4c8.8,0,14.7,5.5,14.7,14.4s-.9,7-1.5,9.8l-4.7,21.8h-11.7l4.4-21.2c.6-3.1,1.3-6.1,1.3-9.4s-2.6-6.3-6.4-6.3c-8.1,0-11.1,7.6-12.6,14.3l-4.8,22.6h-11.7l8.3-38.5Z'/%3E%3Cpath d='M185.5,59.4c0,15.8-10.9,27.3-26.8,27.3s-20.4-7.9-20.4-20.5,11.5-26.5,26.6-26.5,20.6,7.3,20.6,19.7ZM173.3,59.5c0-5.8-2-10.7-8.9-10.7s-13.9,10.2-13.9,18.3,2.4,10.6,9.2,10.6,13.6-10.5,13.6-18.1Z'/%3E%3Cpath d='M230.2,36.5c-3.6-1.8-8.2-3.1-12.7-3.1s-10.2,1.7-10.2,7c0,9.8,20.8,9.2,20.8,26.1s-11.7,20.3-25,20.3-13.3-2-16.5-3.1l2.3-10.7c4.7,2.2,9.7,4.2,14.9,4.2s11.6-3,11.6-9.5c0-11-20.8-9.2-20.8-25.5s11-18.4,22.7-18.4,10.3.6,15.1,2.4l-2.2,10.3Z'/%3E%3Cpath d='M245.4,40.7l4.2,33.4h.2l17.9-33.4h12.8l-30.4,51.7c-3.6,6.1-8,12.6-17.9,12.6s-5.4-.4-8-1l1.9-9.1c1.4.5,2.8,1,5.1,1,3.5,0,6.1-1.7,10.2-8.1l-7.9-47.1h12Z'/%3E%3Cpath d='M310.3,50.3c-3.1-1.1-6.3-2.1-9.6-2.1s-7.9,1-7.9,4.5c0,5.7,15.2,7.8,15.2,18.8s-10.2,15.2-20.2,15.2-9.1-.7-13.2-2.5l2-9.6c3.3,1.8,6.6,3.5,11.2,3.5s8-1.3,8-5c0-7.2-15.2-7.9-15.2-19.2s10.2-14.3,19.5-14.3,8.2.7,12.1,1.7l-1.9,9Z'/%3E%3Cpath d='M317,24.8h47l-2,9.6h-17.2l-11.1,51.3h-12.7l11.1-51.3h-17.2l2.1-9.6Z'/%3E%3Cpath d='M361.7,66.8c0,8.3,4.5,11.3,12.5,11.3s9.4-1.2,13.8-3.2l-2,9.4c-4.4,1.3-9.2,2.4-13.8,2.4-12.9,0-21.6-6.3-21.6-19.6s10.8-27.4,25.6-27.4,18.4,5.7,18.4,17.1-.4,6.7-1.1,10h-31.7ZM383.1,58.8c.2-1,.3-2,.3-3.1,0-4.8-2.5-7.5-7.4-7.5-7.2,0-10.4,4.4-12.7,10.6h19.8Z'/%3E%3Cpath d='M434.7,51.6c-2.2-1.9-6-2.8-9.3-2.8-9.3,0-14.6,8.7-14.6,17.2s1.9,11.7,9.9,11.7,6-.7,8.7-1.9l-2,9.5c-3,1.1-6.2,1.5-9.8,1.5-11.6,0-19.1-7.8-19.1-19.4s10.4-27.7,26.5-27.7,8.3.7,11.7,1.7l-2.2,10.2Z'/%3E%3Cpath d='M448.3,22.8l12.2-2.6-5.1,22.8s6.9-3.3,11.9-3.3c8.8,0,14.7,5.5,14.7,14.4s-.9,7-1.5,9.8l-4.7,21.8h-11.7l4.4-21.2c.6-3.1,1.3-6.1,1.3-9.4s-2.6-6.3-6.4-6.3c-8.1,0-10.6,7.6-12,14.3l-4.8,22.6h-11.7l13.4-62.8Z'/%3E%3C/svg%3E");
}
footer .sitemap {
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  padding-left: 0;
  list-style: none;
  letter-spacing: 0.1em;
}
footer .sitemap a {
  color: rgba(255, 255, 255, 0.75);
}
footer .sitemap a:hover {
  color: #fff;
}
@media (min-width: 992px) {
  footer {
    padding: 8vw 4vw;
  }
  footer .company-logo {
    width: 375px;
    padding-top: 82.5px;
    margin-bottom: 90px;
  }
  footer .sitemap.main-contents {
    font-size: 1.25rem;
  }
  footer .sitemap li {
    display: inline-block;
  }
  footer .sitemap li + li::before {
    content: "/";
    margin-right: 1rem;
    color: rgba(255, 255, 255, 0.75);
  }
}
@media (max-width: 991.98px) {
  footer {
    padding: 18vw 8vw;
  }
  footer .company-logo {
    width: 250px;
    padding-top: 55px;
    margin-bottom: 45px;
  }
  footer .sitemap.main-contents {
    display: none;
  }
  footer .sitemap li + li {
    margin-top: 0.5rem;
  }
  footer .copy {
    margin-top: 1rem;
  }
}

.img-txt {
  margin: auto;
  display: block;
  overflow: hidden;
  height: 0;
  padding: 0;
  background-color: transparent;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}

a:hover, a:focus, button:hover, button:focus {
  outline: none;
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
  a:hover, a:focus, button:hover, button:focus {
    -webkit-transition: none;
    transition: none;
  }
}

.list-unstyled.bar li {
  position: relative;
  padding-left: 1em;
}
.list-unstyled.bar li::before {
  position: absolute;
  left: 0;
}
.list-unstyled.bar li::before {
  content: "-";
}
.list-unstyled li.unstyled {
  padding-left: 0 !important;
}
.list-unstyled li.unstyled::before {
  display: none;
}

@media (min-width: 992px) {
  span.br {
    padding-left: 1rem;
  }
}
@media (max-width: 991.98px) {
  span.br::after {
    content: "\a";
    white-space: pre;
  }
}

.wrapper {
  display: none;
}

#loader-bg, #loader {
  display: block;
  position: fixed;
}

#loader-bg {
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background-color: #fff;
  z-index: 1040;
}
#loader-bg #loader {
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  text-align: center;
  color: #fff;
  z-index: 1045;
}
@media (min-width: 992px) {
  #loader-bg #loader {
    width: 200px;
    height: 133.334px;
  }
}
@media (max-width: 991.98px) {
  #loader-bg #loader {
    width: 100px;
    height: 19.05px;
  }
}

.sa {
  opacity: 0;
  -webkit-transition: all 0.6s ease;
  transition: all 0.6s ease;
}
@media (prefers-reduced-motion: reduce) {
  .sa {
    -webkit-transition: none;
    transition: none;
  }
}
.sa.sa--up {
  -webkit-transform: translate(0, 100px);
      -ms-transform: translate(0, 100px);
          transform: translate(0, 100px);
}
.sa.show {
  opacity: 1;
  -webkit-transform: none;
      -ms-transform: none;
          transform: none;
}

#index #hero {
  position: relative;
  padding-top: 120px;
  min-height: 100vh;
  height: 100vh;
  background-color: rgb(0, 104, 182);
}
#index #hero > .container, #index #hero > .container-fluid {
  height: 100%;
}
#index #hero > .container > .row, #index #hero > .container-fluid > .row {
  height: 100%;
}
#index #hero .marquee {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  white-space: nowrap;
  overflow: hidden;
  gap: 1rem;
  z-index: 1000;
}
#index #hero .marquee .marquee-inner {
  font-family: "Helvetica Neue", Helvetica, sans-serif;
  color: #fff;
  font-weight: 500;
  line-height: 1;
}
#index #hero .marquee .marquee-inner .italic-s, #index #hero .marquee .marquee-inner .times {
  display: inline-block;
}
#index #hero .marquee .marquee-inner .italic-s {
  font-style: italic;
  font-weight: 300;
  line-height: 1.05;
}
#index #hero .marquee .marquee-inner .times {
  font-family: "Times New Roman", Times, serif;
  font-style: italic;
  font-weight: 300;
}
#index #hero .marquee .marquee-inner.row-20 {
  -webkit-animation: marquee 20s linear infinite;
          animation: marquee 20s linear infinite;
}
#index #hero .marquee .marquee-inner.row-25 {
  -webkit-animation: marquee 25s linear infinite;
          animation: marquee 25s linear infinite;
}
#index #hero .marquee .marquee-inner.row-30 {
  -webkit-animation: marquee 30s linear infinite;
          animation: marquee 30s linear infinite;
}
#index #hero .marquee .marquee-inner.row-35 {
  -webkit-animation: marquee 35s linear infinite;
          animation: marquee 35s linear infinite;
}
@-webkit-keyframes marquee {
  0% {
    translate: 0;
  }
  100% {
    translate: calc(-100% - 1rem);
  }
}
@keyframes marquee {
  0% {
    translate: 0;
  }
  100% {
    translate: calc(-100% - 1rem);
  }
}
@media screen and (orientation: portrait) {
  #index #hero {
    padding-top: 90px;
  }
  #index #hero .marquee .marquee-inner {
    font-size: 18vw;
  }
  #index #hero .marquee .marquee-inner .italic-s {
    font-size: calc(4vw + 0.75rem);
  }
  #index #hero .marquee .marquee-inner .italic-s, #index #hero .marquee .marquee-inner .times {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}
@media screen and (orientation: landscape) {
  #index #hero {
    padding-top: 120px;
  }
  #index #hero .marquee .marquee-inner {
    font-size: calc(5vw + 2rem);
  }
  #index #hero .marquee .marquee-inner .italic-s {
    font-size: calc(1vw + 1.75rem);
  }
  #index #hero .marquee .marquee-inner .italic-s, #index #hero .marquee .marquee-inner .times {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
#index #message {
  position: relative;
  min-height: 100vh;
  height: 100vh;
  padding: 4vw;
  background-color: rgb(0, 104, 182);
  color: #fff;
  z-index: 1;
}
#index #message > .container-fluid h2 {
  margin-bottom: 1.5rem;
  font-family: "Times New Roman", Times, serif;
  font-style: italic;
  letter-spacing: 0.125em;
}
#index #message > .container-fluid .catchcopy span {
  display: block;
  line-height: 1.5;
  font-weight: bold;
  white-space: nowrap;
}
#index #message > .container-fluid .leadcopy {
  font-size: 1rem;
  line-height: 2;
}
#index #message #video-area {
  position: absolute;
  z-index: -1;
  top: 4vw;
  right: 4vw;
  left: 4vw;
  bottom: 4vw;
  overflow: hidden;
}
#index #message #video-area::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: block;
  background-color: #000;
  content: "";
  opacity: 0.25;
  mix-blend-mode: multiply;
}
#index #message #video {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 177.77777778vh;
  height: 56.25vw;
  min-height: 100%;
  min-width: 100%;
}
@media (min-width: 992px) {
  #index #message > .container-fluid {
    padding: 60px;
  }
  #index #message > .container-fluid h2 {
    font-size: 1.25rem;
  }
  #index #message > .container-fluid .catchcopy span {
    font-size: 2.25rem;
  }
}
@media (max-width: 991.98px) {
  #index #message > .container-fluid {
    padding: 90px 30px;
  }
  #index #message > .container-fluid h2 {
    font-size: 0.875rem;
  }
  #index #message > .container-fluid .catchcopy span {
    font-size: 1.25rem;
  }
}
#index #services, #index #company {
  position: relative;
  background-color: rgb(0, 104, 182);
  color: #fff;
}
#index #services h2, #index #company h2 {
  font-size: calc(1.475rem + 2.7vw);
  font-weight: bold;
  line-height: 1;
}
@media (min-width: 992px) {
  #index #services h2, #index #company h2 {
    font-size: 3.5rem;
  }
}
#index #services a, #index #company a {
  color: rgba(255, 255, 255, 0.75);
}
#index #services a:hover, #index #company a:hover {
  color: #fff;
}
@media (min-width: 992px) {
  #index #services, #index #company {
    padding: 8vw 4vw;
  }
}
@media (max-width: 991.98px) {
  #index #services, #index #company {
    padding: 18vw 8vw;
  }
}
#index #services + #company {
  padding-top: 0 !important;
}
#index #services .service {
  border-top: 8px solid #fff;
  border-bottom: 2px solid #fff;
}
#index #services .service .service-title {
  margin-top: 1.5rem;
  margin-bottom: 1rem;
  font-weight: bold;
  line-height: 1.25;
}
#index #services .service .service-item-title {
  display: inline-block;
  color: rgb(0, 104, 182);
  background-color: #fff;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  border-radius: 10rem;
}
#index #services .service .service-text, #index #services .service .service-item-text {
  text-align: justify;
  font-size: 1.125rem;
  margin-bottom: 2rem;
}
#index #services .service ul.service-item-text li > span::after {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
  content: "：";
}
#index #services .row .row .service {
  height: 100%;
}
#index #services .row .row .service .service-title {
  margin-top: 1rem;
  font-weight: bold;
  line-height: 2;
}
#index #services .row .row .service .case-title {
  display: inline-block;
  color: rgb(0, 104, 182);
  background-color: #fff;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  border-radius: 10rem;
}
#index #services .row .row .service .service-text, #index #services .row .row .service .case-text {
  text-align: justify;
  margin-bottom: 2rem;
}
#index #company .profile {
  border-top: 8px solid #fff;
  border-bottom: 2px solid #fff;
}
#index #company .profile > ul.list-unstyled {
  margin: 0;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
#index #company .profile > ul.list-unstyled li.row {
  padding-top: 2rem;
  padding-bottom: 2rem;
}
#index #company .profile > ul.list-unstyled li.row > * {
  padding: 0;
}
#index #company .profile > ul.list-unstyled li:not(:first-child) {
  border-top: 1px solid rgba(255, 255, 255, 0.5);
}
#index #contactus .contactus {
  width: 100%;
  font-weight: bold;
  letter-spacing: 0.125em;
  --bs-btn-padding-y: 1.5rem;
  --bs-btn-padding-x: 1rem;
  --bs-btn-font-size: 1.25rem;
  --bs-btn-line-height: 1;
  --bs-btn-border-radius: var(--bs-border-radius-pill);
  --bs-btn-border-width: 2px;
}
#index #contactus .lead > span {
  white-space: nowrap;
}
@media (min-width: 992px) {
  #index #contactus {
    padding-top: 6vw;
    padding-bottom: 6vw;
  }
  #index #contactus .lead {
    margin-bottom: 0;
  }
}
@media (max-width: 991.98px) {
  #index #contactus {
    padding: 18vw 8vw;
  }
  #index #contactus .lead {
    margin-bottom: 1.5rem;
    text-align: center;
    font-size: 1rem;
  }
}
#index .contact {
  background-color: rgb(0, 104, 182);
  padding-top: 30px;
  padding-bottom: 30px;
}
#index .contact [class*=col-] {
  padding: 30px;
}
#index .contact .phone {
  display: block;
  font-size: 45px;
  line-height: 1.2;
  font-weight: 100;
}
#index .contact span.small {
  font-size: 1rem;
  letter-spacing: 0.1rem;
  font-weight: 300;
}
#index .contact .phone, #index .contact .small {
  font-family: "proxima-nova", sans-serif;
  color: #fff;
}
#index .contact .btn-light {
  display: block;
  text-align: center;
  margin: auto;
  background-color: #fff;
  font-size: 1.125rem;
  font-weight: bold;
  padding: 1.5rem;
  width: 60%;
  color: rgb(0, 104, 182);
  border-radius: 0;
}
@media (min-width: 992px) {
  #index .contact [class*=col-] + [class*=col-] {
    border-left: 1px solid #fff;
  }
}
@media (max-width: 767.98px) {
  #index .contact [class*=col-] + [class*=col-] {
    padding-top: 0;
  }
  #index .contact .phone {
    font-size: 36px;
  }
  #index .contact .btn-light {
    padding: 1rem;
    width: 80%;
  }
}

.modal .modal-header, .modal .modal-footer {
  padding: 1.5rem 2rem;
  border: none;
}
.modal .modal-header {
  background-color: rgb(0, 104, 182);
}
.modal .modal-header .modal-title {
  color: #fff;
  font-weight: 600;
}
.modal .modal-header .btn-close {
  --bs-btn-close-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");
}
.modal .modal-body {
  padding: 1rem 2rem 0;
}
.modal .modal-body .list-border {
  margin-top: 3rem;
  margin-bottom: 3rem;
  border-bottom: solid 1px #dee2e6;
}
.modal .modal-body .list-border > li {
  padding-top: 2rem;
  padding-bottom: 2rem;
}
.modal .modal-body .list-border > li > ul.list-unstyled {
  margin-bottom: 0;
}
.modal .modal-body .list-border > [class*=col] {
  border-top: solid 1px #dee2e6;
}
@media (max-width: 767.98px) {
  .modal .modal-body .list-border > [class*=col] span {
    display: block;
  }
}
.modal .modal-body h4, .modal .modal-body h5 {
  font-weight: 700;
  margin-bottom: 1rem;
}
.modal .modal-footer {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.modal .modal-footer .btn {
  padding: 0.5rem 3rem;
  border-radius: 0.5em;
}

#contactModal .modal-body .form-group label {
  font-size: 0.875em;
  color: rgb(0, 104, 182);
}
#contactModal .modal-body .form-group + .form-group {
  margin-top: 1rem;
}
#contactModal .contact-result {
  padding: 2rem 2rem 1rem;
  margin: 0;
}