/*
Theme Name: Original
Description: Original
Version: 1.0.0
*/

*,
*:before,
*:after {
  outline: none;
  box-sizing: border-box;
}
html {
  font-size: 62.5%;
  background: #f4f4f4;
  scroll-behavior: smooth;
  scroll-padding-top: 100px;
}
body {
  color: var(--text-color);
  font-size: 1.4rem;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 300;
  line-height: 1.4;
}
h1,
h2,
h3 {
  font-weight: 300;
}
.barlow {
  font-family: "Barlow", sans-serif;
  letter-spacing: 0.05em;
}
a,
button {
  color: inherit;
  text-decoration: none;
}
ul,
ol {
  list-style: none;
}

.text-white {
　color: #fff;
}

.fadein {
  opacity: 0;
  transform: translate(0, 50px);
  transition: 0.6s cubic-bezier(0.4, 0.4, 0, 1);
}
.scrollin {
  opacity: 1;
  transform: translate(0, 0);
}

.content {
  overflow: hidden;
}

.header {
  display: flex;
  align-items: center;
  position: fixed;
  top: -100%;
  left: 0;
  padding: 0 50px;
  width: 100%;
  height: 98px;
  background: linear-gradient(90deg, rgb(0, 49, 93), rgba(0, 49, 93, 0.73));
  transition: 0.6s cubic-bezier(0.4, 0.4, 0, 1);
  z-index: 1;
}
.header.loaded {
  top: 0;
}
.header-logo {
  width: 200px;
}
.header ul {
  display: flex;
  margin: 0 0 0 auto;
}
.header ul li {
  position: relative;
  padding: 0 50px 0 0;
}
.header ul li:last-child {
  padding: 0;
}
.header ul li:after {
  content: "";
  position: absolute;
  top: 50%;
  left: calc(50% + 2px);
  width: 70px;
  height: 1px;
  background: #fff;
  transform: rotate(-45deg) translateY(-50%);
}
.header ul li:last-child:after {
  display: none;
}
.header ul li a {
  display: block;
  width: 75px;
  color: #fff;
  text-align: center;
}
.drawer-open {
  display: none;
  cursor: pointer;
  position: relative;
  margin: 0 0 0 auto;
  width: 34px;
  height: 34px;
}
.drawer-open:before,
.drawer-open:after {
  content: "";
  position: absolute;
  top: 13px;
  left: 0;
  width: 34px;
  height: 1px;
  background: #fff;
}
.drawer-open:after {
  top: 22px;
}
@media (max-width: 840px) {
  .header ul {
    display: none;
  }
  .drawer-open {
    display: block;
  }
}
@media (max-width: 540px) {
  .header {
    padding: 0 20px;
  }
}

.footer {
  position: relative;
  padding: 80px 50px 60px 50px;
  background: linear-gradient(116deg, #013977, #012541);
}
.footer .pagetop {
  position: absolute;
  top: 60px;
  right: 50px;
  width: 88px;
  z-index: 1;
}
.footer-inner {
  margin: 0 auto;
  max-width: 1280px;
}
.footer-nav {
  display: flex;
  margin: 0 0 50px -15px;
}
.footer-nav li {
  position: relative;
  padding: 0 50px 0 0;
}
.footer-nav li:last-child {
  padding: 0;
}
.footer-nav li:after {
  content: "";
  position: absolute;
  top: 50%;
  left: calc(50% + 2px);
  width: 70px;
  height: 1px;
  background: #fff;
  transform: rotate(-45deg) translateY(-50%);
}
.footer-nav li:last-child:after {
  display: none;
}
.footer-nav li a {
  display: block;
  width: 75px;
  color: #fff;
  text-align: center;
}
.footer-subnav {
  display: flex;
  gap: 50px;
  margin: 0 0 100px 0;
}
.footer-subnav li a {
  color: #fff;
  font-size: 1rem;
}
.footer-logo-area {
  display: flex;
  align-items: center;
  gap: 70px;
}
.footer-logo {
  width: 200px;
}
.copyright {
  color: #fff;
  letter-spacing: 0.05em;
  line-height: 1.4;
}
@media (max-width: 540px) {
  .footer {
    position: relative;
    padding: 50px 20px 60px 20px;
  }
  .footer .pagetop {
    position: absolute;
    right: 40px;
  }
  .footer-nav {
    display: block;
    margin: 0 0 40px 0;
  }
  .footer-nav li {
    padding: 0;
  }
  .footer-nav li:after {
    display: none;
  }
  .footer-nav li a {
    padding: 10px 0;
    width: 60%;
    text-align: left;
  }
  .footer-subnav {
    display: block;
    margin: 0 0 80px 0;
  }
  .footer-subnav li a {
    display: block;
    padding: 10px 0;
    width: 60%;
  }
  .footer-logo-area {
    display: block;
  }
  .footer-logo {
    margin: 0 0 15px 0;
    width: 156px;
  }
  .copyright {
    font-size: 1rem;
  }
}

.drawer-bg {
  opacity: 0;
  visibility: hidden;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.16);
  transition: 0.3s cubic-bezier(0.4, 0.4, 0, 1);
  z-index: 10;
}
.drawer-bg.open {
  opacity: 1;
  visibility: visible;
}
.drawer-content {
  opacity: 0;
  visibility: hidden;
  position: fixed;
  top: 0;
  right: 0;
  padding: 23px;
  width: 70%;
  height: 100vh;
  background: #eee;
  box-shadow: 0px 6px 15px 0px rgb(0 0 0 / 20%);
  transition: 0.3s cubic-bezier(0.4, 0.4, 0, 1);
  z-index: 11;
}
.drawer-content.open {
  opacity: 1;
  visibility: visible;
}
.drawer-logo {
  margin: 0 0 60px 0;
  width: 200px;
}
.drawer-nav {
  margin: 0 0 60px 0;
}
.drawer-nav li a {
  display: block;
  margin: 20px 0;
  color: #023562;
  font-size: 1.8rem;
}
.drawer-subnav li a {
  display: block;
  margin: 20px 0;
  color: #023562;
  font-size: 1rem;
}
.drawer-close {
  cursor: pointer;
  position: absolute;
  bottom: 20px;
  right: 20px;
  width: 34px;
  height: 34px;
}
.drawer-close:before,
.drawer-close:after {
  content: "";
  position: absolute;
  top: -3px;
  left: 50%;
  width: 1px;
  height: 40px;
  background: #023562;
  transform: rotate(45deg);
}
.drawer-close:after {
  transform: rotate(-45deg);
}

.mainvisual-wrap {
  padding: 0 0 220px 0;
  background: linear-gradient(
    156deg,
    #00315d,
    #00315d 33%,
    #064884 52%,
    #1e94c3 77%,
    #f3ffdb
  );
}
.mainvisual {
  position: relative;
  height: 100vh;
}
.mainvisual p {
  position: absolute;
  top: 30%;
  left: 50px;
  width: 200px;
  color: #fff;
  line-height: 1.7;
}
.mainvisual .catch {
  position: absolute;
  top: 50%;
  left: 50%;
  color: #fff;
  font-size: 9rem;
  font-weight: 100;
  line-height: 1.3;
  transform: translate(-50%, -50%);
}
.mainvisual .catch:lang(en) {
  font-size: 7rem;
}
.mainvisual .scroll {
  position: absolute;
  bottom: 50px;
  right: 0;
  width: 100px;
}
.mainvisual .box {
  position: absolute;
  top: 150px;
  right: 216px;
  width: 40px;
  height: 40px;
  background: linear-gradient(rgba(0, 72, 134, 0.66), rgba(1, 37, 65, 0.68));
}
.mainvisual .box:before {
  content: "";
  position: absolute;
  top: 0;
  left: -20px;
  width: 20px;
  height: 20px;
  background: linear-gradient(rgba(3, 81, 151, 0.82), rgba(2, 53, 98, 0.85));
}
.mainvisual .box:after {
  content: "";
  position: absolute;
  top: 40px;
  right: -10px;
  width: 10px;
  height: 10px;
  background: linear-gradient(
    156deg,
    rgba(154, 130, 0, 0.32),
    rgba(2, 53, 98, 0.16)
  );
}
.mainvisual .bar {
  position: absolute;
  left: 109px;
  top: 191px;
  width: 276px;
  height: 40px;
  background: linear-gradient(
    90deg,
    rgba(154, 130, 0, 0.99),
    rgba(2, 53, 98, 0.83)
  );
  transition: 0.3s cubic-bezier(0.4, 0.4, 0, 1);
  transform-origin: center left;
  transition-delay: 100ms;
}
.mainvisual .bar.loaded {
  transform: scaleX(0);
}
.mainvisual .bar.bar2 {
  position: absolute;
  top: 264px;
  left: auto;
  right: 181px;
  transition-delay: 200ms;
}
.mainvisual .bar.bar3 {
  position: absolute;
  top: auto;
  bottom: 20%;
  left: 122px;
  transition-delay: 300ms;
}
@media (max-width: 840px) {
  .mainvisual p {
    top: 152px;
  }
  .mainvisual .catch {
    width: 80%;
    font-size: 7rem;
  }
  .mainvisual .catch:lang(en) {
    font-size: 5.2rem;
  }
  .mainvisual .bar {
    display: none;
  }
}
@media (max-width: 540px) {
  .mainvisual p {
    top: 108px;
    left: 25px;
  }
  .mainvisual .catch {
    width: 90%;
    font-size: 3.5rem;
  }
  .mainvisual .catch:lang(en) {
    font-size: 3.5rem;
  }
  .mainvisual .box {
    right: 46px;
    top: 205px;
  }
}

.home h2 {
  position: relative;
  margin: 0 0 50px 0;
  padding: 65px 0 0 20px;
  width: 135px;
  color: #fff;
}
.home h2:after {
  content: "";
  position: absolute;
  top: 25px;
  left: 0;
  width: 70px;
  height: 1px;
  background: #fff;
  transform: rotate(-45deg) translateY(-50%);
}

.news {
  margin: 0 auto;
  padding: 0 20px;
  max-width: 1280px;
}
.news-inner {
  display: flex;
  align-items: center;
  padding: 0 100px;
}
.news-list {
  width: calc(100% - 185px);
}
.news-item a {
  display: flex;
  padding: 14px 0;
  border-bottom: 1px solid #4282c3;
}
.news-item a .image {
  width: 200px;
}
.news-item a .image img {
  width: 100%;
}
.news-item a .text {
  margin: 0 0 0 auto;
  color: #fff;
  width: calc(100% - 220px);
}
.news-item a .text .date {
  margin: 0 0 10px 0;
  font-size: 1.2rem;
}
.news-item a .text h3 {
  margin: 0 0 9px 0;
  font-size: 2.4rem;
}
.news-item a .text p {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  font-size: 1.2rem;
  letter-spacing: 0.08em;
  line-height: 1.5;
}
.news-item a .text .category {
  display: flex;
  margin: 12px 0 0 0;
}
.news-item a .text .category div {
  margin: 0px 14px 0px 0px;
  padding: 5px 11px;
  color: #023562;
  font-size: 1rem;
  font-weight: 500;
  background: rgba(255, 255, 255, 0.58);
  border-radius: 14px;
}
.news .more {
  margin: 0 0 0 auto;
}
.news .more a {
  display: block;
  position: relative;
  margin: 0 auto;
  padding: 50px 0 0 0;
  width: 135px;
  height: 135px;
  color: #023562;
  text-align: center;
  background: #fff;
  border-radius: 50%;
  transition: 0.3s cubic-bezier(0.4, 0.4, 0, 1);
}
.news .more a:after {
  content: "";
  position: absolute;
  top: 75px;
  left: 50%;
  width: 30px;
  height: 5px;
  transform: translateX(-50%);
  background: url(/wp-content/themes/original/assets/images/arrow.svg) no-repeat
    center center / contain;
  transition: 0.3s cubic-bezier(0.4, 0.4, 0, 1);
}
@media (hover: hover) {
  .news .more a:hover {
    background: #e1e1e1;
  }
  .news .more a:hover:after {
    left: calc(50% + 22px);
  }
}
@media (max-width: 840px) {
  .news-inner {
    display: block;
  }
  .news-list {
    width: 100%;
  }
  .news .more {
    margin: 20px 0 0 0;
  }
}
@media (max-width: 540px) {
  .news-inner {
    padding: 0;
  }
  .news-item a .text .date {
    margin: 0 0 4px 0;
    font-size: 1.1rem;
  }
  .news-item a .image {
    width: 111px;
  }
  .news-item a .text {
    width: calc(100% - 125px);
  }
  .news-item a .text h3 {
    margin: 0 0 6px 0;
    font-size: 1.6rem;
  }
  .news-item a .text p {
    display: none;
  }
  .news .more {
    margin: 40px 0 0 0;
  }
}

.about-wrap {
  padding: 40px 0 100px 0;
  background: url(/wp-content/themes/original/assets/images/about-bg.svg)
    no-repeat center center / cover;
}
.about {
  margin: 0 auto;
  padding: 0 20px;
  max-width: 1280px;
}
.about-inner {
  display: flex;
  padding: 0 100px;
}
.about .image {
  margin: -250px 0 0 0;
  padding: 0 60px 0 0;
  width: 55%;
}
.about .image img {
  width: 100%;
}
.about .text {
  width: 45%;
  color: #fff;
}
.about .title {
  font-size: 3.3rem;
  font-weight: 300;
  letter-spacing: 0.1em;
  line-height: 1.3;
}
.about .default {
  margin: 15px 0 72px 0;
  font-weight: 300;
  letter-spacing: 0.1em;
  line-height: 2.2;
}
.about .sub,
.about .sub2 {
  font-size: 1.1rem;
  font-weight: 100;
  letter-spacing: 0.1em;
  line-height: 2.01;
}
.about .sub2 {
  margin: 15px 0 0 0;
}
@media (max-width: 840px) {
  .about-inner {
    padding: 0 50px 0 100px;
  }
  .about .title {
    font-size: 2.1rem;
  }
  .about .default {
    font-size: 1.2rem;
    line-height: 1.8;
  }
}
@media (max-width: 540px) {
  .about-inner {
    display: block;
    padding: 0;
  }
  .about .image {
    margin: 0 0 40px 0;
    padding: 0;
    width: 100%;
  }
  .about .text {
    width: 100%;
  }
  .about .default {
    margin: 15px 0 35px 0;
  }
}

.projects-wrap {
  padding: 100px 0 180px 0;
  background: url(/wp-content/themes/original/assets/images/projects-bg.svg)
    no-repeat center center / cover;
}
.projects {
  margin: 0 auto;
  padding: 0 20px;
  max-width: 1280px;
}
.home .projects h2 {
  color: #023562;
}
.home .projects h2:after {
  background: #023562;
}
.projects-item {
  display: flex;
  align-items: center;
  margin: 0 0 14px 0;
  padding: 80px 40px;
  color: #fff;
  background: #013b77;
}
.projects-item .image {
  padding: 0 40px 0 0;
  width: 60%;
  text-align: center;
}
.projects-item .image img {
  max-width: 100%;
}
.projects-item .text {
  margin: 0 auto;
  width: 40%;
  max-width: 420px;
}
.projects-item .text .num {
  padding: 0 0 0 15px;
  width: 142px;
  height: 49px;
  font-size: 1.9rem;
  line-height: 49px;
  background: linear-gradient(
    90deg,
    rgba(154, 130, 0, 0.87),
    rgba(2, 53, 98, 0.6)
  );
}
.projects-item .text .title {
  margin: 37px 0px 0px 0px;
  font-size: 3rem;
  letter-spacing: 0.1em;
  line-height: 1.3;
}
.projects-item .text .subtitle {
  margin: 12px 0px 0px 0px;
  font-size: 1.2rem;
  letter-spacing: 0.1em;
  line-height: 1.3;
}
.projects-item .text p {
  margin: 30px 0px 0px 0px;
  letter-spacing: 0.1em;
  line-height: 2;
}
.projects-item .text .btn a {
  display: block;
  margin: 37px 0 0 0;
  height: 62px;
  color: #023562;
  line-height: 62px;
  text-align: center;
  background: #fff;
  transition: 0.3s cubic-bezier(0.4, 0.4, 0, 1);
}
.projects-item .text .btn a:hover {
  background: #d9d9d9;
}
@media (max-width: 840px) {
  .projects-item .text .num {
    height: 37px;
    font-size: 1.4rem;
    line-height: 37px;
  }
  .projects-item .text .title {
    font-size: 2.1rem;
  }
  .projects-item .text p {
    font-size: 1.2rem;
  }
}
@media (max-width: 540px) {
  .projects-wrap {
    padding: 50px 0 150px 0;
  }
  .projects-item {
    display: block;
    padding: 30px;
  }
  .projects-item .image {
    padding: 0 0 30px 0;
    width: 100%;
  }
  .projects-item .text {
    width: 100%;
    max-width: 100%;
  }
}

.company-wrap {
  padding: 1px 0 160px 0;
  background: #fff;
}
.company {
  margin: 0 auto;
  padding: 0 20px;
  max-width: 1280px;
}
.company .image {
  margin: -100px 0 20px auto;
  max-width: 900px;
}
.company .image img {
  width: 100%;
}
.company-inner {
  display: flex;
  align-items: center;
  padding: 0 100px;
}
.home .company h2 {
  color: #023562;
}
.home .company h2:after {
  background: #023562;
}
.company .table {
  width: calc(100% - 185px);
}
.company .table table {
  width: 100%;
  border-top: #dedede 1px solid;
}
.company .table table th {
  padding: 10px;
  width: 104px;
  letter-spacing: 0.1em;
  line-height: 2.2;
  border-bottom: #dedede 1px solid;
  font-weight: normal;
}
.company .table table th:lang(en) {
  width: 174px;
}
.company .table table td {
  padding: 10px;
  width: calc(100% - 104px);
  font-weight: 400;
  letter-spacing: 0.1em;
  line-height: 2.2;
  border-bottom: #dedede 1px solid;
}
.company .table table td:lang(en) {
  width: calc(100% - 174px);
}
.company .more {
  margin: 0 0 0 auto;
}
.company .more a {
  display: block;
  position: relative;
  margin: 0 auto;
  padding: 50px 0 0 0;
  width: 135px;
  height: 135px;
  color: #fff;
  text-align: center;
  background: #023562;
  border-radius: 50%;
  transition: 0.3s cubic-bezier(0.4, 0.4, 0, 1);
}
.company .more a:after {
  content: "";
  position: absolute;
  top: 75px;
  left: 50%;
  width: 30px;
  height: 5px;
  transform: translateX(-50%);
  background: url(/wp-content/themes/original/assets/images/arrow02.svg)
    no-repeat center center / contain;
  transition: 0.3s cubic-bezier(0.4, 0.4, 0, 1);
}
@media (hover: hover) {
  .company .more a:hover {
    background: #055093;
  }
  .company .more a:hover:after {
    left: calc(50% + 22px);
  }
}
@media (max-width: 840px) {
  .company-wrap {
    padding: 1px 0 100px 0;
  }
  .company .image {
    margin: -100px 0 100px auto;
    max-width: 80%;
  }
  .company-inner {
    display: block;
  }
  .company .table {
    width: 100%;
  }
  .company .more {
    margin: 20px 0 0 0;
  }
}
@media (max-width: 540px) {
  .company .image {
    margin: -100px 0 40px 0;
    max-width: 100%;
  }
  .company-inner {
    display: block;
    padding: 0;
  }
  .company .table {
    width: 100%;
  }
  .company .table {
    margin: 0 -20px;
    width: calc(100% + 40px);
  }
  .company .table table th {
    display: block;
    padding: 12px 20px 0 20px;
    width: 100%;
    font-size: 1.2rem;
    text-align: left;
    border: none;
  }
  .company .table table th:lang(en) {
    width: 100%;
  }
  .company .table table td {
    display: block;
    padding: 0 20px 12px 20px;
    width: 100%;
    font-size: 1.2rem;
    line-height: 1.55;
  }
  .company .table table td:lang(en) {
    width: 100%;
  }
}

.inquiry {
  margin: 0 auto;
  padding: 100px 20px 160px 20px;
  max-width: 1280px;
}
.inquiry-inner {
  padding: 0 100px;
}
.home .inquiry h2 {
  color: #023562;
}
.home .inquiry h2:after {
  background: #023562;
}
.inquiry .title {
  margin: 0 0 50px 0;
  color: #023562;
  font-size: 1.8rem;
  font-weight: 400;
  text-align: center;
}
.inquiry .form {
  margin: 0 auto;
  max-width: 524px;
}
.inquiry .form table {
  width: 100%;
}
.inquiry .form table th {
  width: 160px;
  font-weight: 300;
  text-align: left;
  vertical-align: top;
}
.inquiry .form table th span {
  margin: 0 0 0 5px;
  color: #f23a3c;
}
.inquiry .form table td {
  padding: 0 0 12px 0;
  width: calc(100% - 160px);
}
.inquiry .form table td input,
.inquiry .form table td textarea,
.inquiry .form table td select {
  padding: 12px;
  width: 100%;
  border: #eee 1px solid;
  background: #fff;
  border-radius: 3px;
}
.inquiry .form table td select {
  appearance: none;
  padding: 12px 20px 12px 12px;
  background: linear-gradient(45deg, #fff 50%, #ddd 50%) no-repeat center right
      14px / 4px 4px,
    linear-gradient(-45deg, #fff 50%, #ddd 50%) no-repeat center right 10px /
      4px 4px;
  background-color: #fff;
}
.inquiry .accept {
  margin: 50px 0 20px 0;
  text-align: center;
}
.inquiry .submit input {
  appearance: none;
  display: block;
  margin: 0 auto;
  width: 135px;
  height: 135px;
  color: #023562;
  text-align: center;
  background: #fff;
  border: none;
  border-radius: 50%;
  transition: 0.3s cubic-bezier(0.4, 0.4, 0, 1);
}
@media (hover: hover) {
  .inquiry .submit input:hover {
    background: #e1e1e1;
  }
}
@media (max-width: 540px) {
  .inquiry {
    padding: 50px 20px 100px 20px;
  }
  .inquiry-inner {
    padding: 0;
  }
  .inquiry .title {
    text-align: left;
  }
  .inquiry .form table th {
    display: block;
    width: 100%;
    font-size: 1.3rem;
  }
  .inquiry .form table td {
    display: block;
    padding: 3px 0 12px 0;
    width: 100%;
  }
}

.page-title {
  padding: 240px 0 120px 0;
  font-size: 3.3rem;
  letter-spacing: 0.05em;
  line-height: 1.4;
  text-align: center;
}
.page-content {
  margin: 0 auto 160px auto;
  max-width: 779px;
  letter-spacing: 0.09em;
  line-height: 1.9;
}
.page-content a {
  color: #023562;
  text-decoration: underline;
}
.page-content table {
  width: 100%;
  border-top: #dedede 1px solid;
}
.page-content table th {
  padding: 15px;
  width: 180px;
  font-weight: 100;
  text-align: left;
  letter-spacing: 0.1em;
  line-height: 2.2;
  border-bottom: #dedede 1px solid;
}
.page-content table td {
  padding: 15px;
  width: calc(100% - 180px);
  font-weight: 400;
  letter-spacing: 0.1em;
  line-height: 2.2;
  border-bottom: #dedede 1px solid;
}
@media (max-width: 540px) {
  .page-title {
    padding: 180px 0 60px 0;
    font-size: 2.2rem;
    letter-spacing: 0.05em;
    line-height: 1.4;
    text-align: center;
  }
  .page-content {
    padding: 0 20px;
    font-size: 1.2rem;
  }
  .page-content table th {
    display: block;
    padding: 12px 20px 0 20px;
    width: 100%;
    font-size: 1.2rem;
    text-align: left;
    border: none;
  }
  .page-content table td {
    display: block;
    padding: 0 20px 12px 20px;
    width: 100%;
    font-size: 1.2rem;
    line-height: 1.55;
  }
}

.company-title {
  margin: 160px auto 0 auto;
  padding: 0 120px;
  max-width: 1280px;
}
.company-content {
  margin: 0 auto 160px auto;
  padding: 0 120px;
  max-width: 1280px;
}
.company-content h2 {
  margin: 100px 0 70px 0;
  color: #023562;
  font-size: 3.2rem;
  font-weight: 300;
  letter-spacing: 0.05em;
  line-height: 1.4;
}
.message {
  display: flex;
  padding: 0 0 100px 0;
  border-bottom: #dedede 1px solid;
}
.message .image {
  width: 50%;
}
.message .image img {
  width: 100%;
}
.message .text {
  padding: 0 0 0 47px;
  width: 50%;
}
.message .text h3 {
  margin: 0 0 35px 0;
  color: #023562;
  font-size: 3.2rem;
  line-height: 1.4;
}
.message .text p {
  font-size: 1.6rem;
  letter-spacing: 0.1em;
  line-height: 2.2;
}
.member {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 80px 40px;
  margin: 0 0 160px 0;
}
.member-once .head {
  margin: 0 0 12px 0;
  font-size: 1.2rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.4;
}
.member-once .image {
  margin: 0 0 16px 0;
}
.member-once .image img {
  width: 100%;
}
.member-once .title {
  margin: 0 0 6px 0;
  font-size: 1.2rem;
  letter-spacing: 0.1em;
}
.member-once .name {
  margin: 0 0 16px 0;
  font-size: 2rem;
  font-weight: 400;
  letter-spacing: 0.1em;
}
.member-once p {
  font-size: 1.3rem;
  letter-spacing: 0.1em;
  line-height: 1.69;
}
.member-once .meta {
  margin: 12px 0 0 0;
  padding: 12px 0 0 0;
  font-size: 1.1rem;
  font-weight: 400;
  letter-spacing: 0.1em;
  line-height: 1.69;
  border-top: #dedede 1px solid;
}
.company-profile-image {
  margin: 0 0 0 auto;
  max-width: 920px;
}
.company-profile-image img {
  width: 100%;
}
.company-profile-table {
  max-width: 920px;
}
.company-profile-table table {
  width: 100%;
  border-top: #dedede 1px solid;
}
.company-profile-table table th {
  padding: 10px;
  width: 104px;
  font-weight: 100;
  letter-spacing: 0.1em;
  line-height: 2.2;
  border-bottom: #dedede 1px solid;
}
.company-profile-table table th:lang(en) {
  width: 174px;
}
.company-profile-table table td {
  padding: 10px;
  width: calc(100% - 104px);
  font-weight: 400;
  letter-spacing: 0.1em;
  line-height: 2.2;
  border-bottom: #dedede 1px solid;
}
.company-profile-table table td:lang(en) {
    width: calc(100% - 174px);
}
@media (max-width: 840px) {
  .company-title {
    padding: 0 58px;
  }
  .company-content {
    padding: 0 58px;
  }
  .member {
    grid-template-columns: repeat(2, 1fr);
    gap: 80px 58px;
  }
  .member-once:nth-child(3) {
    display: none;
  }
}
@media (max-width: 540px) {
  .company-title {
    padding: 0 20px;
  }
  .company-content {
    padding: 0 20px;
  }
  .company-content h2 {
    margin: 60px 0 40px 0;
  }
  .message {
    flex-wrap: wrap;
    padding: 0 0 60px 0;
  }
  .message .image {
    margin: 0 0 30px 0;
    width: 100%;
  }
  .message .text {
    padding: 0;
    width: 100%;
  }
  .message .text h3 {
    font-size: 2.4rem;
  }
  .message .text p {
    font-size: 1.4rem;
  }
  .member {
    grid-template-columns: repeat(2, 1fr);
    gap: 60px 20px;
    margin: 0 0 100px 0;
  }
}

.projects-title {
  position: relative;
  padding: 160px 120px 0 120px;
  height: 780px;
  color: #fff;
  background: url(/wp-content/themes/original/assets/images/projects-title01.webp)
    no-repeat center center / cover;
}
.projects-title02 {
  display: flex;
  background: linear-gradient(156deg, #00315d 37%, #f0f0f0);
}
.projects-title02 .text {
  width: 35%;
}
.projects-title02 .image {
  width: 65%;
}
.projects-title02 .image img {
  width: 100%;
}
.projects-title .num {
  margin: 80px 0 0 0;
  padding: 0 0 0 15px;
  width: 142px;
  height: 49px;
  font-size: 1.9rem;
  line-height: 49px;
  background: linear-gradient(
    90deg,
    rgba(154, 130, 0, 0.87),
    rgba(2, 53, 98, 0.6)
  );
}
.projects-title h1 {
  margin: 18px 0 0 0;
  font-size: 4.8rem;
  font-weight: 100;
  letter-spacing: 0.05em;
  line-height: 1.4;
}
.projects-title .description {
  margin: 14px 0 0 0;
  font-size: 1.5rem;
  font-weight: 100;
  line-height: 1.7;
}
.projects-content {
  margin: 0 auto;
  padding: 0 20px;
  max-width: 1280px;
}
.box01 {
  display: flex;
  align-items: center;
  position: relative;
  margin: -120px 0 0 0;
  padding: 120px;
  background: #fff;
  border-bottom: #dedede 1px solid;
}
.box01 .text {
  width: 50%;
}
.box01 .text h2 {
  color: #023562;
  font-size: 3.2rem;
  font-weight: 300;
  line-height: 1.4;
  max-width: calc(100% - 110px);
  justify-content: flex-start;
}
.box01 .text p {
  margin: 40px 0 0 0;
  font-size: 1.4rem;
  letter-spacing: 0.1em;
  line-height: 2.5;
}
.box01 .image {
  padding: 0 0 0 60px;
  width: 50%;
}
.box01 .image img {
  width: 100%;
}
.service {
  padding: 120px;
  background: #fff;
}
.service h2 {
  margin: 0 0 60px 0;
  color: #023562;
  font-size: 3.2rem;
  font-weight: 300;
  letter-spacing: 0.05em;
  line-height: 1.4;
}
.service h3 {
  padding: 0 0 0 150px;
  height: 100px;
  color: #023562;
  font-size: 2.4rem;
  font-weight: 300;
  letter-spacing: 0.1em;
  line-height: 100px;
}
.service-title01 {
  background: url(/wp-content/themes/original/assets/images/projects-icon01.svg)
    no-repeat left center / 120px 100px;
}
.service-title02 {
  background: url(/wp-content/themes/original/assets/images/projects-icon02.svg)
    no-repeat left center / 120px 100px;
}
.service-title03 {
  background: url(/wp-content/themes/original/assets/images/projects-icon03.svg)
    no-repeat left center / 120px 100px;
}
.service-box {
  display: flex;
  margin: 60px 0 100px 0;
  padding: 0 0 100px 0;
  border-bottom: #dedede 1px solid;
}
.service-box .text {
  width: 50%;
}
.service-box .text p {
  font-size: 1.4rem;
  font-weight: 300;
  letter-spacing: 0.1em;
  line-height: 2.5;
}
.service-box .text ul {
  display: flex;
  gap: 40px;
  margin: 40px 0 0 0;
  padding: 20px 0 0 0;
  border-top: #dedede 1px solid;
}
.service-box .text ul li {
  width: 50%;
}
.service-box .text ul li div {
  margin: 0 0 10px 0;
  font-size: 1.8rem;
  font-weight: 300;
  letter-spacing: 0.05em;
  line-height: 1.4;
}
.service-box .text ul li p {
  font-size: 1.2rem;
  font-weight: 300;
  letter-spacing: 0.1em;
  line-height: 1.8;
}
.service-box .image {
  padding: 0 0 0 60px;
  width: 50%;
}
.service-box .image img {
  width: 100%;
}
.service-contact {
  text-align: center;
}
.service-contact p {
  margin: 0 0 32px 0;
  color: #023562;
  font-size: 1.9rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.4;
}
.service-contact .btn a {
  display: block;
  margin: 0 auto;
  width: 300px;
  height: 50px;
  color: #fff;
  font-size: 1.4rem;
  letter-spacing: 0.05em;
  line-height: 50px;
  background: linear-gradient(146deg, #004886, #012541);
}
@media (hover: hover) {
  .service-contact .btn a:hover {
    background: linear-gradient(146deg, #004886 68%, #012541);
  }
}

.projects-list-lower {
  margin: 80px 0 120px 0;
}

.box02 {
  display: flex;
  align-items: center;
  position: relative;
  margin: -120px 0 0 0;
  padding: 120px;
  background: #fff;
  border-bottom: #dedede 1px solid;
}
.box02 h2 {
  width: 50%;
  color: #023562;
  font-size: 3.2rem;
  font-weight: 300;
  line-height: 1.4;
}
.box02 p {
  width: 50%;
  font-size: 1.4rem;
  font-weight: 300;
  letter-spacing: 0.1em;
  line-height: 2.5;
}
.feature {
  padding: 120px;
  background: #fff;
}
.feature h2,
.ui h2,
.merit h2,
.usecase h2 {
  margin: 0 0 60px 0;
  color: #023562;
  font-size: 3.2rem;
  font-weight: 300;
  letter-spacing: 0.05em;
  line-height: 1.4;
}
.feature ul {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}
.feature ul li {
  padding: 10px;
  background: #f4f4f4;
  border: #fff 10px solid;
  box-shadow: 0px 0px 20px 4px rgb(0 0 0 / 13%);
}
.feature ul li .image {
  margin: 0 auto;
  padding: 10px 0;
  max-width: 123px;
}
.feature ul li p {
  color: #023562;
  font-size: 1.6rem;
  font-weight: 300;
  letter-spacing: 0.1em;
  line-height: 1.4;
}

.ui {
  padding: 120px;
  background: #e1e1e1;
}
.ui h2 {
  font-size: 2.5rem;
  font-weight: 300;
}
.ui .box {
  display: flex;
  align-items: center;
}
.ui .box:nth-child(2) {
  margin: 0 0 80px 0;
  padding: 0 0 80px 0;
  border-bottom: #b9b9b9 1px solid;
}
.ui .box .image {
  width: 65%;
}
.ui .box .image img {
  width: 100%;
}
.ui .box dl {
  padding: 0 0 0 60px;
  width: 35%;
}
.ui .box dl dt {
  position: relative;
  margin: 0 0 11px 0;
  padding: 0 0 0 30px;
  color: #023562;
  font-size: 2rem;
  font-weight: 400;
  line-height: 1.4;
}
.ui .box dl dt span {
  position: absolute;
  top: -23px;
  left: 0;
  color: #023562;
  font-size: 4.4rem;
  font-weight: 600;
  height: 41px;
  line-height: 1.4;
}
.ui .box dl dd {
  margin: 0 0 50px 0;
  padding: 0 0 0 30px;
  color: #023562;
  font-size: 1.4rem;
  font-weight: 300;
  line-height: 1.5;
}
.ui .box dl dd:last-child {
  margin: 0;
}

.merit-wrap {
  padding: 120px;
  background: #fff;
}
.merit {
  padding: 0 0 120px 0;
  border-bottom: 1px solid #dedede;
}
.merit ul {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}
.merit ul li {
  box-shadow: 0px 0px 20px 4px rgb(0 0 0 / 13%);
  background: #f4f4f4;
}
.merit ul li .title {
  padding: 15px;
  color: #023562;
  font-size: 1.6rem;
  font-weight: 400;
  letter-spacing: 0.1em;
  line-height: 1.4;
  background: #fff;
}
.merit ul li .title span {
  display: block;
  margin: 0 auto 10px auto;
  color: #023562;
  font-size: 4.4rem;
  font-weight: 400;
  line-height: 0.8;
  text-align: center;
}
.merit ul li p {
  padding: 15px;
  color: #023562;
  font-size: 1.5rem;
  font-weight: 300;
  letter-spacing: 0.1em;
  line-height: 1.7;
  background: #f4f4f4;
}

.usecase {
  padding: 120px 0;
  border-bottom: 1px solid #dedede;
}
.usecase .image img {
  width: 100%;
}
.projects-contact {
  padding: 120px 0 0 0;
  text-align: center;
}
.projects-contact p {
  margin: 0 0 32px 0;
  color: #023562;
  font-size: 1.9rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.4;
}
.projects-contact .btn a {
  display: block;
  margin: 0 auto;
  width: 300px;
  height: 50px;
  color: #fff;
  font-size: 1.4rem;
  letter-spacing: 0.05em;
  line-height: 50px;
  background: linear-gradient(146deg, #004886, #012541);
}
@media (hover: hover) {
  .projects-contact .btn a:hover {
    background: linear-gradient(146deg, #004886 68%, #012541);
  }
}

@media (max-width: 840px) {
  .projects-title {
    padding: 160px 58px 0 58px;
  }
  .projects-title02 .text {
    width: 60%;
  }
  .projects-title02 .image {
    padding: 150px 0 0 0;
    width: 40%;
  }
  .box01 {
    padding: 32px;
  }
  .box01 .text {
    width: 50%;
  }
  .box01 .image {
    padding: 0 0 0 32px;
  }

  .service {
    padding: 32px;
  }
  .service h2 {
    margin: 0 0 40px 0;
  }
  .service-box {
    display: flex;
    margin: 40px 0 60px 0;
    padding: 0 0 60px 0;
  }
  .service-box .image {
    padding: 0 0 0 32px;
  }

  .projects-list-lower {
    margin: 60px 0 100px 0;
  }

  .box02 {
    padding: 80px 32px;
  }
  .feature {
    padding: 80px 32px;
  }
  .feature h2,
  .ui h2,
  .merit h2,
  .usecase h2 {
    margin: 0 0 60px 0;
    color: #023562;
    font-size: 3.2rem;
    font-weight: 300;
    letter-spacing: 0.05em;
    line-height: 1.4;
  }
  .feature ul {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }

  .ui {
    padding: 80px 32px;
  }
  .ui h2 {
    font-size: 2.5rem;
    font-weight: 300;
  }
  .ui .box {
    display: block;
  }
  .ui .box:nth-child(2) {
    margin: 0 0 60px 0;
    padding: 0 0 60px 0;
  }
  .ui .box .image {
    margin: 0 0 40px 0;
    width: 100%;
  }
  .ui .box dl {
    padding: 0;
    width: 100%;
  }

  .merit-wrap {
    padding: 80px 32px;
  }
  .merit {
    padding: 0 0 100px 0;
  }
  .merit ul {
    grid-template-columns: repeat(2, 1fr);
  }

  .usecase {
    padding: 80px 0;
  }
  .projects-contact {
    padding: 80px 0 0 0;
  }
}
@media (max-width: 540px) {
  .projects-title {
    padding: 160px 30px 0 30px;
  }
  .projects-title02 {
    display: block;
  }
  .projects-title02 .text {
    margin: 0 0 60px 0;
    width: 100%;
  }
  .projects-title02 .image {
    padding: 0;
    width: 100%;
    text-align: center;
  }
  .projects-title .num {
    margin: 45px 0 0 0;
    height: 37px;
    font-size: 1.4rem;
    line-height: 37px;
  }
  .projects-title h1 {
    font-size: 3rem;
  }
  .projects-title02 .image img {
    margin: 0 auto;
    max-width: 330px;
  }
  .box01 {
    flex-wrap: wrap;
    padding: 30px 20px;
  }
  .box01 .text {
    order: 2;
    width: 100%;
  }
  .box01 .text h2 {
    font-size: 2.4rem;
  }
  .box01 .text p {
    margin: 22px 0 0 0;
  }
  .box01 .image {
    order: 1;
    padding: 0;
    width: 100%;
    text-align: center;
  }
  .box01 .image img {
    margin: 0 auto;
    max-width: 340px;
  }

  .service {
    padding: 30px 20px;
  }
  .service h2 {
    margin: 0 0 40px 0;
  }
  .service h3 {
    padding: 70px 0 0 0;
    height: 162px;
    font-size: 2.4rem;
    text-align: center;
  }
  .service-title01 {
    background: url(/wp-content/themes/original/assets/images/projects-icon01.svg)
      no-repeat center top / 100px;
  }
  .service-title02 {
    background: url(/wp-content/themes/original/assets/images/projects-icon02.svg)
      no-repeat center top / 100px;
  }
  .service-title03 {
    background: url(/wp-content/themes/original/assets/images/projects-icon03.svg)
      no-repeat center top / 100px;
  }
  .service-box {
    flex-wrap: wrap;
    margin: 0 0 60px 0;
    padding: 0 0 60px 0;
  }
  .service-box .text {
    order: 2;
    width: 100%;
  }
  .service-box .text p {
    line-height: 2;
  }
  .service-box .image {
    order: 1;
    margin: 0 0 25px 0;
    padding: 0;
    width: 100%;
    text-align: center;
  }
  .service-box .image img {
    margin: 0 auto;
    max-width: 310px;
  }

  .projects-list-lower {
    margin: 60px 0 100px 0;
  }

  .box02 {
    display: block;
    padding: 50px 20px;
  }
  .box02 h2 {
    margin: 0 0 25px 0;
    width: 100%;
    font-size: 2.4rem;
  }
  .box02 p {
    width: 100%;
    line-height: 2;
  }
  .feature {
    padding: 50px 20px;
  }
  .feature h2,
  .ui h2,
  .merit h2,
  .usecase h2 {
    margin: 0 0 30px 0;
  }

  .ui {
    padding: 50px 20px;
  }
  .ui .box {
    display: block;
  }
  .ui .box:nth-child(2) {
    margin: 0 0 50px 0;
    padding: 0 0 50px 0;
  }

  .merit-wrap {
    padding: 50px 20px;
  }
  .merit {
    padding: 0 0 60px 0;
  }
  .merit ul {
    gap: 15px;
  }
  .merit ul li .title {
    font-size: 1.6rem;
  }
  .merit ul li .title span {
    font-size: 3.2rem;
  }
  .merit ul li p {
    font-size: 1.2rem;
  }

  .usecase {
    padding: 50px 0;
  }
  .projects-contact {
    padding: 50px 0 0 0;
  }
}

.news-archive-title {
  margin: 160px auto 0 auto;
  padding: 0 120px;
  font-size: 2.8rem;
  max-width: 1280px;
}
.news-archive {
  margin: 0 auto 160px auto;
  padding: 0 120px;
  max-width: 1280px;
}
.news-category-list {
  display: flex;
  gap: 15px;
  margin: 80px 0 50px 0;
}
.news-category-list li a {
  display: block;
  padding: 10px 20px;
  font-size: 13px;
  line-height: 1;
  background: #eee;
  border-radius: 20px;
}
.category-name {
  margin: 0 0 60px 0;
  font-size: 3.2rem;
  text-align: center;
}

.news-archive .news-list {
  width: 100%;
}
.news-archive .news-item a {
  border: none;
}
.news-archive .news-item a .text {
  color: #023562;
}
.nav-links {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
  margin: 60px 0 0 0;
}
.nav-links > a,
.nav-links > span {
  display: block;
  padding: 10px;
}

@media (max-width: 840px) {
  .news-archive-title {
    padding: 0 58px;
  }
  .news-archive {
    padding: 0 58px;
  }
}
@media (max-width: 540px) {
  .news-archive-title {
    padding: 0 20px;
  }
  .news-archive {
    padding: 0 20px;
  }
  .category-name {
    font-size: 2.4rem;
  }
}

.news-single {
  margin: 140px auto;
  padding: 0 120px;
  max-width: 980px;
}
.news-single .image {
  text-align: center;
}
.news-single .image img {
  width: 100%;
}
.news-single-content-wrap {
  padding: 60px 40px 0 40px;
}
.news-single .date {
  margin: 0 0 20px 0;
  color: rgba(2, 53, 98, 0.56);
  font-size: 1.4rem;
}
.news-single h1 {
  font-size: 2.8rem;
  font-weight: 500;
  line-height: 1.5;
}
.news-single-category {
  display: flex;
  gap: 15px;
  margin: 25px 0 50px 0;
  padding: 0 0 50px 0;
  border-bottom: #aeaeae 1px solid;
}
.news-single-category li a {
  display: block;
  padding: 10px 20px;
  font-size: 13px;
  line-height: 1;
  background: #eee;
  border-radius: 20px;
}

.news-single-content p {
  margin: 10px 0;
  line-height: 1.6;
}
.news-single-content p a {
  color: #007cff;
  text-decoration: underline;
}

.news-single-more {
  margin: 90px 0 0 0;
}
.news-single-more a {
  display: block;
  position: relative;
  margin: 0 auto;
  padding: 50px 0 0 0;
  width: 135px;
  height: 135px;
  color: #023562;
  text-align: center;
  background: #fff;
  border-radius: 50%;
  transition: 0.3s cubic-bezier(0.4, 0.4, 0, 1);
}
.news-single-more a:after {
  content: "";
  position: absolute;
  top: 75px;
  left: 50%;
  width: 30px;
  height: 5px;
  transform: translateX(-50%);
  background: url(/wp-content/themes/original/assets/images/arrow.svg)
    no-repeat center center / contain;
  transition: 0.3s cubic-bezier(0.4, 0.4, 0, 1);
}
@media (hover: hover) {
  .news-single-more a:hover {
    background: #e1e1e1;
  }
  .news-single-more a:hover:after {
    left: calc(50% + 22px);
  }
}

@media (max-width: 840px) {
  .news-single {
    padding: 0 100px;
  }
  .news-single-content-wrap {
    padding: 50px 0 0 0;
  }
  .news-single .image img {
    margin: 0 auto;
    max-width: 530px;
  }
}
@media (max-width: 540px) {
  .news-single {
    padding: 0 20px;
  }
  .news-single-content-wrap {
    padding: 30px 0 0 0;
  }
  .news-single .image img {
    max-width: 300px;
  }
}
