@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Lato:wght@400;700&family=Noto+Sans+JP:wght@400;700&display=swap"); /*フォントの読み込み*/
@import url("https://fonts.google.com/specimen/Fira+Sans;700&display=swap"); /*フォントの読み込み*/
/*===========================================================
# common - 全体に共通するスタイル
============================================================*/
*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  padding: 0;
  margin: 0;
}

body {
  font-size: 16px;
  color: #1a1a1a;
  font-family: "Noto Sans JP";
  line-height: 1.6875;
  background: #fff;
  color: #1a1a1a;
}

img {
  max-width: 100%; /*画面全体に表示*/
  height: auto;
}

.inner {
  width: 1280px;
  margin: 0 auto; /*横が空いて中央による*/
  max-width: 100%; /*これがないと横に隙間が空いてしまう*/
  padding: 0 20px; /*画面が小さくなっても横のスキマを維持*/
}
@media (min-width: 768px) and (max-width: 1279px) {
  .inner {
    padding-left: 24px;
    padding-right: 24px;
  }
}
@media (max-width: 767px) {
  .inner {
    margin-left: 16px;
    margin-right: 16px;
  }
}

ul,
ol {
  list-style: none; /*点などを消しておく*/
  padding: 0;
  margin: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  padding: 0;
}

a {
  color: inherit; /*親要素を継承する*/
  text-decoration: none;
}

.section-title {
  color: #163F74;
  font-family: "Fira Sans";
}
.section-title h2 {
  font-size: 100px;
  font-weight: bold;
  font-family: "Fira Sans", "Lato", sans-serif;
}
@media (max-width: 1090px) {
  .section-title h2 {
    font-size: 52px;
    padding-bottom: 18px;
  }
}
.section-title p {
  font-size: 24px;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .section-title {
    font-size: 26px;
  }
}

.section {
  padding: 100px 0 120px;
  background: #fff;
}
@media (max-width: 767px) {
  .section {
    padding-top: 50px;
    padding-bottom: 60px;
  }
}

.white-header {
  display: flex;
  font-weight: bold;
}
@media (max-width: 767px) {
  .white-header {
    margin-left: 10px;
  }
  .white-header p {
    margin-bottom: 0;
  }
}
.white-header .white-link {
  margin-left: auto;
  font-size: 32px;
  margin-top: 70px;
  padding-right: 80px;
  color: #fff;
  font-family: "Fira Sans", "Lato", sans-serif;
  position: relative;
}
@media (max-width: 767px) {
  .white-header .white-link {
    display: none;
  }
}
.white-header .white-link :hover {
  cursor: pointer;
}
.white-header .white-link :hover .white-link-arrow::before {
  content: "";
  display: block;
  position: absolute;
  top: 30px;
  left: 180px;
  width: 120px;
  height: 2px;
  background: #fff;
  /*アニメーションの指定*/
  transition: all 0.3s;
}
.white-header .white-link :hover .white-link-arrow::after {
  content: "";
  display: block;
  position: absolute;
  top: 20px;
  right: 0;
  width: 20px;
  height: 20px;
  border: 2px solid;
  border-color: transparent transparent #fff;
  transform: rotate(-135deg);
  transition: all 0.3s;
}
.white-header .white-link a {
  display: flex;
}
.white-header .white-link-circle::after {
  content: "";
  position: absolute;
  right: 10px;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 3px solid #FFF400;
}
.white-header .white-link-arrow {
  width: 60px;
  height: 100px;
}
.white-header .white-link-arrow::before {
  content: "";
  display: block;
  position: absolute;
  top: 30px;
  left: 180px;
  width: 80px;
  height: 2px;
  background: #fff;
}
.white-header .white-link-arrow::after {
  content: "";
  display: block;
  position: absolute;
  top: 20px;
  right: 40px;
  width: 20px;
  height: 20px;
  border: 2px solid;
  border-color: transparent transparent #fff;
  transform: rotate(-135deg);
}

.white-link-sp {
  position: absolute;
  right: 30px;
}
@media (max-width: 767px) {
  .white-link-sp  {
    margin-top: 30px;
  }
}

.white-link-sp a {
  display: flex;
}
.white-link-sp a span {
  padding: 15px;
  font-size: 20px;
  color: #fff;
}
@media (min-width: 1280px) {
  .white-link-sp a {
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 1279px) {
  .white-link-sp a {
    display: none;
  }
}

.white-link-arrow-sp {
  width: 100px;
  height: 50px;
  position: relative;
}

.white-link-arrow-sp::before {
  content: "";
  display: block;
  position: absolute;
  top: 33px;
  left: 5px;
  width: 90px;
  height: 2px;
  background: #fff;
}

.white-link-arrow-sp::after {
  content: "";
  display: block;
  position: absolute;
  top: 25px;
  left: 75px;
  width: 15px;
  height: 20px;
  border: 2px solid;
  border-color: transparent transparent #fff;
  transform: rotate(-135deg);
}

.white-link-circle-sp::after {
  content: "";
  position: absolute;
  top: 10px;
  right: -10px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 3px solid #FFF400;
}

.black-header {
  display: flex;
  font-weight: bold;
}
@media (max-width: 767px) {
  .black-header {
    margin-left: 10px;
  }
  .black-header p {
    margin-bottom: 0;
  }
}
.black-header .black-link {
  margin-left: auto;
  font-size: 32px;
  margin-top: 70px;
  padding-right: 80px;
  color: #1A1A1A;
  font-family: "Fira Sans", "Lato", sans-serif;
  position: relative;
}
@media (max-width: 767px) {
  .black-header .black-link {
    display: none;
  }
}
.black-header .black-link :hover {
  cursor: pointer;
}
.black-header .black-link :hover .black-link-arrow::before {
  content: "";
  display: block;
  position: absolute;
  top: 30px;
  left: 180px;
  width: 120px;
  height: 2px;
  background: #1A1A1A;
  /*アニメーションの指定*/
  transition: all 0.3s;
  z-index: 1;
}
.black-header .black-link :hover .black-link-arrow::after {
  content: "";
  display: block;
  position: absolute;
  top: 20px;
  right: 0;
  width: 20px;
  height: 20px;
  border: 2px solid;
  border-color: transparent transparent #1A1A1A;
  transform: rotate(-135deg);
  transition: all 0.3s;
}
.black-header .black-link a {
  display: flex;
}
.black-header .black-link-circle::after {
  content: "";
  position: absolute;
  right: 10px;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 3px solid #FFF400;
  background-color: #FFF400;
}
.black-header .black-link-arrow {
  width: 60px;
  height: 100px;
}
.black-header .black-link-arrow::before {
  content: "";
  display: block;
  position: absolute;
  top: 30px;
  left: 180px;
  width: 80px;
  height: 2px;
  background: #1A1A1A;
  z-index: 1;
}
.black-header .black-link-arrow::after {
  content: "";
  display: block;
  position: absolute;
  top: 20px;
  right: 40px;
  width: 20px;
  height: 20px;
  border: 2px solid;
  border-color: transparent transparent #1A1A1A;
  transform: rotate(-135deg);
  z-index: 1;
}

.black-link-sp {
  position: absolute;
  right: 30px;
}
.black-link-sp a {
  display: flex;
}
.black-link-sp a span {
  padding: 15px;
  font-size: 20px;
  font-weight: bold;
  font-style: italic;
  color: #023E78;
}
@media (min-width: 1280px) {
  .black-link-sp a {
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 1279px) {
  .black-link-sp a {
    display: none;
  }
}

.black-link-arrow-sp {
  width: 100px;
  height: 50px;
  position: relative;
}

.black-link-arrow-sp::before {
  content: "";
  display: block;
  position: absolute;
  top: 33px;
  left: 5px;
  width: 90px;
  height: 2px;
  background: #023E78;
}

.black-link-arrow-sp::after {
  content: "";
  display: block;
  position: absolute;
  top: 25px;
  left: 75px;
  width: 15px;
  height: 20px;
  border: 2px solid;
  border-color: transparent transparent #023E78;
  transform: rotate(-135deg);
}

.black-link-circle-sp::after {
  content: "";
  position: absolute;
  top: 10px;
  right: -10px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 3px solid #FFF400;
  background-color: #FFF400;
  z-index: -1;
}

/*=====================================================
# header
======================================================*/
.header {
  display: flex;
}

.header-logo {
  width: 282px;
  height: 53px;
  margin: 23px 10px;
}
@media (max-width: 767px) {
  .header-logo {
    width: 198px;
    height: 37px;
    margin: 11px;
  }
}
@media (min-width: 768px) and (max-width: 1279px) {
  .header-logo {
    width: 198px;
    height: 37px;
    margin: 11px;
  }
}

.header-inner {
  margin: 0 auto;
  font-size: 14px;
  display: flex;
  margin-right: 10px;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .header-inner {
    display: none;
  }
}
@media (max-width: 767px) {
  .header-inner {
    display: none;
  }
}

.header-nav {
  display: flex;
  margin: 10px 0;
}
.header-nav a {
  display: block;
  margin: 16px 20px;
}
.header-nav li {
  position: relative;
}
.header-nav li:not(:first-child) a::before {
  position: absolute;
  content: "／";
  left: -10px;
}

.header-btn {
  display: flex;
}

.header-btn-download a {
  display: inline-block;
  width: 176px;
  height: 68px;
  padding: 20px 30px;
  margin: 16px 0 16px 16px;
  border: 1px solid #023E78;
}
.header-btn-download a:hover {
  transition: color 0.4s;
  background: #023E78;
  color: #fff;
}

.header-btn-contact a {
  display: inline-block;
  width: 176px;
  height: 68px;
  padding: 20px 40px;
  margin: 16px 0px 16px 10px;
  border: 1px solid #023E78;
  color: #fff;
  background: #023E78;
}
.header-btn-contact a:hover {
  background: #002A52;
}

.drawer-icon {
  margin: 20px 15px 0 auto;
  cursor: pointer;
  display: none;
  transition: transform 0.5s ease 0s;
}
@media (max-width: 767px) {
  .drawer-icon {
    display: block;
  }
}
@media (min-width: 768px) and (max-width: 1279px) {
  .drawer-icon {
    display: block;
  }
}
.drawer-icon.is-active .drawer-icon-bar1 {
  transform: rotate(-45deg);
  top: 11px;
}
.drawer-icon.is-active .drawer-icon-bar2 {
  display: none;
}
.drawer-icon.is-active .drawer-icon-bar3 {
  transform: rotate(45deg);
  top: 11px;
}

.drawer-icon-bars {
  width: 22px;
  height: 20px;
  display: block;
  position: relative;
}

.drawer-icon-bar1,
.drawer-icon-bar2,
.drawer-icon-bar3 {
  position: absolute;
  width: 27px;
  height: 2.25px;
  background: #023E78;
  top: 0;
  left: 0;
}

.drawer-icon-bar1 {
  top: 0;
}

.drawer-icon-bar2 {
  top: 8px;
}

.drawer-icon-bar3 {
  top: 16px;
}

.drawer-content {
  width: 100%;
  height: 100%;
  text-align: center;
  position: fixed;
  right: 0;
  top: 0;
  background: #fff;
  z-index: 1005;
  transform: translateY(-105%);
  transition: transform 0.5s ease 0s;
}
.drawer-content.is-active {
  transform: translateY(0);
  background: #023E78;
}

.drawer-header {
  display: flex;
  background: #fff;
}

.drawer-content-items {
  margin-top: 40px;
}

.drawer-content-item {
  font-size: 16px;
  color: #fff;
}
.drawer-content-item a {
  display: inline-block;
  margin-bottom: 20px;
  padding: 10px 20px;
}

.drawer-btn {
  display: block;
}

.drawer-btn-download a {
  width: 295px;
  height: 68px;
  color: #fff;
  font-size: 16px;
  border: 1px solid #fff;
  display: inline-block;
  text-align: center;
  padding: 17px 0;
}

.drawer-btn-contact a {
  margin-top: 32px;
  width: 295px;
  height: 68px;
  color: #023E78;
  font-size: 16px;
  background: #fff;
  display: inline-block;
  text-align: center;
  padding: 17px 0;
}

/*=====================================================
# main
======================================================*/
.slide-items {
  margin-left: 90px;
}

.slick-slider{
  overflow: hidden;

}

@media (max-width: 767px) {
  .slide-items{
    margin-left: 40px;
}
}

@media (max-width: 767px) {
  .slick-list{
    width: 1000px;
}
}

@media (max-width: 767px) {
  .slick-track{
    left: -500px;
}
}

.main {
  position: relative;
}

.slider-main {
  position: absolute;
  content: "";
  bottom: 40px;
  left: 40px;
}

@media (max-width: 767px) {
  .slider-main {
    bottom: -20px;
    left: 20px;
  }
}

.slider-title-above{
  display: block;
  margin-bottom: 20px;
  background: #fff;
}

.slider-title{
  display: inline-block;
  padding: 6px 0;
  margin: 0 0 0 0;
  background: #fff;
  font-style: italic;
}

.slider-title-spacing{
  padding-left: 10px;
}

.slider-title-wrapper {
  font-size: 4.2vw;
  color: #023E78;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

@media (max-width: 767px) {
  .slider-title-wrapper {
    font-size: 35px;
  }
}

@media (max-width: 767px) {
  .slider-title-above{
    max-width: 200px;
    background: inherit;
    margin: 0;
  }
}

@media (max-width: 767px) {
  .slider-title{
    margin-bottom: 5px;
    padding: 0;
  }
}

.slider-text{
  font-size: 1.2vw;
  font-weight: bold;
  color: #fff;
  background: #023E78;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

@media (max-width: 767px) {
  .slider-text {
    font-size: 4vw;
    margin-top: 5px;
  }
}

/*=====================================================
# about
======================================================*/
.about {
  padding: 60px 90px;
  margin: 150px 0;
  position: relative;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .about {
    padding-left: 40px;
    padding-right: 40px;
  }
}
@media (max-width: 767px) {
  .about {
    margin: 70px 0;
    padding: 0 10px;
  }
}

.about-inner {
padding-top: 10px;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .about-inner {
    margin-top: 50px;
  }
}

.about-title h2{
  font-family: Medium Italic;
  font-size: 80px;
  font-style: italic;
}

@media (max-width: 767px) {
  .about-title h2 {
   font-size: 40px;
   padding: 0;
  }
}

@media (max-width: 767px) {
  .about-title p{
   font-size: 16px;
   margin: 0;
  }
}


.about-bg {
  background: #EEF3F8;
  position: absolute;
  transform: skewY(15deg);
  z-index: -1;
  top: 300px;
  width: 100%;
  height: 750px;
  left: 0;
}
@media (max-width: 767px) {
  .about-bg {
    top: 230px;
    height: 800px;
  }
}

.about-sub-color {
  background: url(../img/bg-company.png) no-repeat center center/cover;
  position: absolute;
  top: 0;
  right: 0;
  width: 40%;
  height: 800px;
  z-index: -1;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .about-sub-color {
    width: 50%;
  }
}
@media (max-width: 767px) {
  .about-sub-color {
    width: 50%;
    display: none;
  }
}

.about-box2 {
  display: flex;
}
@media (max-width: 767px) {
  .about-box2 {
    display: block;
  }
}

.about-img {
  margin-right: 10px;
  margin-left: 40px;
  width: calc(63.73% - 20px);
  position: relative;
}
@media (max-width: 767px) {
  .about-img {
    width: 100%;
    padding-top: 60px;
    padding-bottom: 120px;
    padding-right: 20px;
    margin-left: 10px;
  }
}

.about-items {
  width: calc(36.27% - 20px);
  padding: 20px;
  font-size: 14px;
}
@media (max-width: 767px) {
  .about-items {
    width: 100%;
    padding-top: 0;
  }
}

.about-sub-color-sp {
  background: url(../img/bg-company.png) no-repeat center center/cover;
  position: absolute;
  top: 0;
  right: 0;
  width: 80%;
  height: 100%;
  z-index: -1;
}
@media (min-width: 1280px) {
  .about-sub-color-sp {
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 1279px) {
  .about-sub-color-sp {
    display: none;
  }
}

/*=====================================================
# service
======================================================*/
.service {
  margin-top: 267px;
  padding: 0 90px;
  position: relative;
}
@media (max-width: 767px) {
  .service {
    padding: 0 10px;
    margin-top: 187px;
  }
}

.service-title h2{
  font-size: 90px;
  font-style: italic;
}

@media (max-width: 767px) {
  .service-title h2 {
   font-size: 48px;
   padding: 0;
  }
}

@media (max-width: 767px) {
.service-title p{
  margin-top: 0;
  font-size: 16px;
}
}

.service-body {
  display: flex;
  justify-content: space-between;
}
@media (max-width: 767px) {
  .service-body {
    display: block;
  }
}

.service-items {
  margin: 0;
  width: 29.093%;
  padding-top: 55px;
}
@media (max-width: 767px) {
  .service-items {
    width: 100%;
  }
}

.service-items:nth-child(2) {
  margin-top: 60px;
}

@media (max-width: 767px) {
  .service-items:nth-child(2) {
    margin-top: 30px;
  }
}

.service-items:nth-child(3) {
  margin-top: 120px;
}

@media (max-width: 767px) {
  .service-items:nth-child(3) {
    margin-top: 30px;
    padding-top: 25px;
  }
}

.service-item-img {
  position: relative;
}

.service-item-number {
  width: 102px;
  height: 125px;
  position: absolute;
  top: -60px;
  right: 7px;
}

.service-item-title {
  position: absolute;
  bottom: 20px;
  left: -40px;
}

.service-item-title-inner {
  font-size: 28px;
  white-space: nowrap;
  color: #023E78;
  background: #fff;
  margin: 8px;
  display: inline-block;
}
@media (min-width: 768px) and (max-width: 1279px) {
  .service-item-title-inner {
    font-size: 18px;
  }
}

.service-item-text {
  font-size: 14px;
}

.service-bg {
  background: #EEF3F8;
  position: absolute;
  transform: skewY(15deg);
  z-index: -1;
  top: 500px;
  width: 100%;
  height: 700px;
  left: 0;
  right: 0;
}
@media (max-width: 767px) {
  .service-bg {
    top: 1200px;
    height: 1300px;
  }
}

/*=====================================================
# case
======================================================*/
.case {
  background: url(../img/bg-case.png) no-repeat center center/cover;
  margin-top: 100px;
  padding: 0 90px;
}
@media (max-width: 767px) {
  .case {
    padding: 0 10px;
    margin-top: 260px;
    padding-bottom: 120px;
  }
}

.case-inner {
  padding: 50px 0;
}

@media (max-width: 767px) {
  .case-inner  {
   padding: 0;
  }
}

.case-title {
  color: #fff;
  font-style: italic;
}

.case-title h2{
  font-size: 90px;
}

@media (max-width: 767px) {
  .case-title h2 {
   font-size: 48px;
   padding: 0;
  }
}

.case-title p{
  margin-top: 0;
}

@media (max-width: 767px) {
  .case-title p{
    font-size: 16px;
  }
  }



.case-items {
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap; /*折り返す為の指定*/
}
@media (max-width: 767px) {
  .case-items {
    display: block;
    flex-wrap: nowrap;
    justify-content: start;
  }
}

.case-item {
  display: block;
  width: calc(33.3% - 16px);
  padding: 16px;
  color: #fff;
  margin-top: 15px;
  position: relative;
}

@media (max-width: 767px) {
  .case-item {
    margin-top: 20px;
  }
}

.case-item::after {
  content: "";
  position: absolute;
  bottom: 20px;
  right: 10px;
  width: 30px;
  height: 30px;
  margin-left: 5px;
  display: inline-block;
  background: url(../img/arrow-icon.png) no-repeat center center/cover;
}
@media (max-width: 767px) {
  .case-item {
    width: 100%;
  }
  .case-item:hover::after {
    background: url(../img/arrow-icon-active.png) no-repeat center center/cover;
  }
}
@media (min-width: 768px) {
  .case-item:hover::after {
    content: "";
    position: absolute;
    bottom: 20px;
    right: 5px;
    width: 30px;
    height: 30px;
    background: url(../img/arrow-icon-active.png) no-repeat center center/cover;
    transition: all 0.3s;
  }
}

.case-item-company {
  margin-top: 14px;
  font-size: 16px;
}

.case-item-cat {
  font-size: 14px;
  display: inline-block;
  padding: 6px 16px;
  border: 1px solid #FFF;
  margin-top: 10px;
}

/*=====================================================
# news
======================================================*/
.news {
  margin: 78px 0;
  padding: 90px 90px;
  position: relative;
}
@media (max-width: 767px) {
  .news {
    padding: 0 10px 90px 10px;
    margin-top: 70px;
    margin-bottom: 200px;
  }
}

.news-title h2{
  font-size: 90px;
  font-style: italic;
}

.news-title p{
  margin-top: 0;
}

@media (max-width: 767px) {
  .news-title  h2 {
   font-size: 45px;
   padding: 0;
  }
}

@media (max-width: 767px) {
  .news-title p{
   font-size: 16px;
   margin: 0;
  }
}


.news-list {
  max-width: 848px;
  margin: 0 auto;
  padding: 0 40px;
}
@media (max-width: 767px) {
  .news-list {
    padding: 0;
  }
}

.news-items {
  margin-top: 44px;
  padding: 60px 40px 40px;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.1607843137);
  background-color: #fff;
  display: block;
}
@media (max-width: 767px) {
  .news-items {
    margin-bottom: 30px;
    padding: 40px 15px 40px;
  }
}

.news-item {
  padding-bottom: 30px;
  border-bottom: 1px solid #DDDDDD;
}
.news-item:nth-child(1), .news-item:nth-child(2) {
  margin-bottom: 20px;
}
@media (max-width: 767px) {
  .news-item:nth-child(1), .news-item:nth-child(2) {
    margin-bottom: 0px;
  }
}


.news-item-info {
  display: flex;
  justify-content: space-between;
}

.news-item-cat {
  display: inline-block;
  font-size: 14px;
  color: #E61264;
  width: 104px;
  height: 36px;
  border: 1px solid #E61264;
  padding: 6px 10px;
  text-align: center;
}

.news-item-date {
  font-size: 14px;
  color: #888888;
}

.news-item-title {
  margin-top: 14px;
}

.news-bg {
  background: #EEF3F8;
  position: absolute;
  transform: skewY(15deg);
  top: 650px;
  width: 100%;
  height: 450px;
  left: 0;
  right: 0;
  margin: 10 0px;
  z-index: -1;
}
@media (max-width: 767px) {
  .news-bg {
    top: 250px;
    height: 850px;
  }
}

/*=====================================================
# footer-link
======================================================*/
.footer-links {
  display: flex;
  position: relative;
}
@media (max-width: 767px) {
  .footer-links {
    display: block;
  }
}

.footer-links-item-contact,
.footer-links-item-download {
  width: 50%;
  height: auto;
  text-align: center;
  padding: 20px 0;
}
@media (max-width: 767px) {
  .footer-links-item-contact,
.footer-links-item-download {
    width: 100%;
  }
}

.footer-links-item-contact {
  background: url(../img/img-contact.png) no-repeat center center/cover;
}

.footer-links-item-download {
  background: url(../img/img-download.png) no-repeat center center/cover;
}

.footer-links-main h2 {
  font-size: 55px;
}

.footer-links-main p {
  margin-top: 0;
}

.footer-links-main a {
  display: inline-block;
  width: 315px;
  height: 98px;
  color: #FFF400;
  font-size: 24px;
  font-weight: bold;
  border: 3px solid #FFF400;
  margin-top: 20px;
  padding: 25px 0;
  transition: all 0.5s ease 0s;
  position: relative;
}
.footer-links-main a::before {
  content: "";
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 13px;
  background: url(../img/icon-arrow-right01.png) no-repeat center center/cover;
}
.footer-links-main a:hover {
  background: #FFF400;
  color: #1A1A1A;
}
@media (min-width: 768px) {
  .footer-links-main a:hover::after {
    content: "";
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 13px;
    background: url(../img/icon-arrow-blue.png) no-repeat center center/cover;
  }
}
@media (max-width: 767px) {
  .footer-links-main a {
    font-size: 16px;
  }
}

.footer-links-en {
  font-size: 60px;
  color: #FFF;
  font-style: italic;
}

.footer-links-jp {
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  font-family: "Noto Sans JP";
}

@media (max-width: 767px) {
  .footer-links-main h2 {
    font-size: 35px;
  }
}


/*=====================================================
# footer
======================================================*/
.footer {
  color: #fff;
  background-color: #1A1A1A;
  width: 100%;
  height: auto;
  padding: 126px 0 15px 0;
}
@media (max-width: 767px) {
  .footer {
    padding-top: 60px;
  }
}

.footer-logo {
  font-size: 45px;
  font-weight: bold;
  font-style: italic;
}
@media (max-width: 767px) {
  .footer-logo {
    font-size: 35px;
  }
}

.footer-inner a{
  display: block;
  text-align: center;
}

.footer-info-text {
  margin-top: 30px;
  font-size: 14px;
  display: inline-block;
  text-align: left;
  margin-bottom: 0;
}

.footer-info{
  display: block;
  text-align: center;
}



.footer-copyright {
  margin-top: 80px;
  font-size: 14px;
  text-align: center;
}
@media (max-width: 767px) {
  .footer-copyright {
    font-size: 12px;
    margin-top: 30px;
  }
}

.footer-page-top {
  position: fixed; /*常に張り付いた状態*/
  right: 24px;
  bottom: 80px;
  opacity: 0;
  visibility: hidden; /*見えてはいないけど実際には存在する*/
  transition: all 0.3s ease 0s; /*アニメーションんをつける*/
}
.footer-page-top.is-show {
  opacity: 1;
  visibility: visible;
}
.footer-page-top a {
  transition: all 0.3s ease 0s;
}
.footer-page-top a img {
  width: 40px;
}
@media (max-width: 767px) {
  .footer-page-top a img {
    right: 12px;
    bottom: 12px;
  }
}
.footer-page-top a:hover {
  opacity: 0.7;
}

/* page-about
======================================================*/
.mv-lower {
  width: 100%;
  height: 250px;
  background: url(../img/mv-company_pc.png) no-repeat center center/cover;
  position: relative;
}
@media (max-width: 767px) {
  .mv-lower {
    background: url(../img/mv-company_sp.png) no-repeat center center/cover;
  }
}

.mv-lower-img--company {
  background: url(../img/lower-mv-decoration_pc.png) no-repeat center center/cover;
  width: 365px;
  height: 250px;
}
@media (max-width: 767px) {
  .mv-lower-img--company {
    background: url(../img/lower-mv-decoration_sp.png) no-repeat center center/cover;
    width: 165px;
  }
}

.mv-lower-main {
  line-height: 1;
  position: absolute;
  content: "";
  z-index: 1;
  top: 50%;
  transform: translateY(-50%);
  left: 15%;
}
@media (max-width: 767px) {
  .mv-lower-main{
    left: 5%;
  }
}

.mv-lower-en-wrapper {
  font-size: 40px;
  font-weight: 500;
  color: #023E78;
  background: #fff;
  font-style: italic;
  padding: 5px 0;
}
@media (max-width: 767px) {
  .mv-lower-en-wrapper {
    font-size: 25px;
  }
}
@media (max-width: 767px) {
  .mv-lower-en {
    font-size: 30px;
  }
}

.mv-lower-jp-wrapper {
  color: #023E78;
  display: inline-block;
  background: #fff;
  margin-top: 8px;
  font-size: 16px;
  font-weight: 500;
}
.mv-lower-jp-wrapper p {
  padding: 5px 0;
  margin: 0;
}

/*=====================================================
# breadcrumb
======================================================*/
.breadcrumb {
  margin-top: 13px;
  margin-left: 90px;
}
@media (max-width: 767px) {
  .breadcrumb {
    margin-left: 22px;
  }
}

.breadcrumb i {
  font-size: 12px;
}

.home {
  color: #888888;
  font-size: 12px;
}

.current-item {
  font-size: 12px;
}

/*=====================================================
# company-message
======================================================*/
.company-message {
  margin-top: 72px;
  margin-bottom: 122px;
  padding: 0 90px;
}
@media (max-width: 767px) {
  .company-message {
    padding: 0;
    margin-top: 52px;
    margin-bottom: 47px;
  }
}

.inner-wide {
  width: 100%;
}

.company-message-bg-bg01,
.company-message-bg-bg02 {
  padding: 20px;
}
.company-message-bg-bg01 h2,
.company-message-bg-bg02 h2 {
  line-height: 1;
  font-size: 100px;
  color: #fff;
  font-style: italic;
}
@media (max-width: 767px) {
  .company-message-bg-bg01 h2,
.company-message-bg-bg02 h2 {
    font-size: 45px;
  }
}
.company-message-bg-bg01 p,
.company-message-bg-bg02 p {
  font-size: 24px;
  color: #FFF;
}
@media (max-width: 767px) {
  .company-message-bg-bg01 p,
.company-message-bg-bg02 p {
    font-size: 16px;
  }
}

.company-message-bg-bg01 {
  height: 350px;
  background: url(../img/img-company01_pc.png) no-repeat center center/cover;
}
@media (max-width: 767px) {
  .company-message-bg-bg01 {
    background: url(../img/img-company01_sp.png) no-repeat center center/cover;
    height: 275px;
  }
}

.company-message-bg-bg02 {
  height: 350px;
  background: url(../img/img-company02_pc.png) no-repeat center center/cover;
}
@media (max-width: 767px) {
  .company-message-bg-bg02 {
    background: url(../img/img-company02_sp.png) no-repeat center center/cover;
    height: 275px;
  }
}

.company-message-box {
  background: #fff;
  margin: -60px auto 0;
  max-width: 688px;
  padding: 30px 40px;
  text-align: center;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.1607843137);
}
@media (max-width: 767px) {
  .company-message-box {
    margin: -60px 10px 0 10px;
  }
}

.company-message-box h3 {
  font-size: 24px;
  color: #023E78;
}
@media (max-width: 767px) {
  .company-message-box h3 {
    font-size: 19px;
  }
}
@media (max-width: 767px) {
  .company-message-box br {
    display: none;
  }
}

.company-message-box p {
  font-size: 14px;
  color: #1A1A1A;
  text-align: left;
}

.company-message-item:last-child {
  margin-top: 120px;
}
@media (max-width: 767px) {
  .company-message-item:last-child  {
    margin-top: 45px;
  }
}


/*=====================================================
# company-profile
======================================================*/
.company-profile {
  padding: 80px 10px;
  width: 100%;
  height: 980px;
  background: url(../img/bg-case.png) no-repeat center center/cover;
}
@media (max-width: 767px) {
  .company-profile {
    padding-top: 60px;
    height: 740px;
  }
}


.company-profile-box {
  margin: 0 auto;
  padding: 60px 40px 80px 40px;
  background: #fff;
  width: 62%;
  max-height: 1000px;
}
@media (max-width: 767px) {
  .company-profile-box {
    padding: 38px 20px 50px 20px;
  }
}

.company-profile-box h2 {
  text-align: center;
  margin-bottom: 60px;
}
@media (max-width: 767px) {
  .company-profile-box h2 {
    margin-bottom: 36px;
  }
}
.company-profile-box ul li {
  padding-left: 16px;
  position: relative;
}
.company-profile-box ul li::before {
  position: absolute;
  content: "・";
  left: 0px;
}
@media (max-width: 767px) {
  .company-profile-box {
    width: 100%;
  }
}
.company-profile-box dl {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
}
@media (max-width: 767px) {
  .company-profile-box dl {
    font-size: 14px;
  }
}

.company-profile-box dl dt {
  display: flex;
  align-items: center;
  padding: 20px 0 20px 32px;
  width: 29.07%;
  border-top: 1px solid #023E78;
}
@media (max-width: 767px) {
  .company-profile-box dl dt {
    padding: 0 0 15px 5px;
  }
}
.company-profile-box dl dt:last-of-type {
  border-bottom: 1px solid #023E78;
}
.company-profile-box dl dd {
  border-top: 1px solid #E8EAEC;
  padding: 20px 0 20px 36px;
  width: 70.93%;
  margin: 0;
  overflow-wrap: break-word;
}
@media (max-width: 767px) {
  .company-profile-box dl dd {
    padding: 15px 0 15px 20px;
  }
}
.company-profile-box dl dd:last-of-type {
  border-bottom: 1px solid #E8EAEC;
}

/*=====================================================
# company-directors
======================================================*/
.company-directors {
  text-align: center;
  position: relative;
}

.company-directors-title {
  font-size: 24px;
  font-weight: bold;
}

.company-directors-inner {
  padding: 0 40px;
  position: relative;
}
@media (max-width: 767px) {
  .company-directors-inner {
    padding: 0 20px 80px 20px;
  }
}

.company-directors-items {
  margin: 60px auto 0;
  max-width: 688px;
}

.company-directors-item {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
}
@media (max-width: 767px) {
  .company-directors-item {
    display: block;
  }
}
@media (max-width: 767px) {
  .company-directors-item:not(:first-child) {
    margin-top: 60px;
  }
}

.company-directors-profile {
  display: flex;
  align-items: center;
}

.company-directors-job-title {
  font-size: 14px;
  font-weight: bold;
}

.company-directors-name {
  font-size: 20px;
  font-weight: bold;
  margin-left: 20px;
}

.company-directors-biography {
  margin-top: 28px;
  font-size: 14px;
}
@media (max-width: 767px) {
  .company-directors-biography {
    text-align: left;
    margin-top: 0;
  }
}


.company-directors-sns-icons {
  display: flex;
  margin-top: 32px;
}

.company-directors-sns-icon {
  width: 32px;
  height: 32px;
  margin-right: 24px;
}

.company-directors-bg {
  background: #EEF3F8;
  position: absolute;
  transform: skewY(15deg);
  top: 870px;
  width: 100%;
  height: 500px;
  left: 0;
  right: 0;
  margin: 10 0px;
}
@media (max-width: 767px) {
  .company-directors-bg {
    top: 1200px;
    height: 1300px;
  }
}

@media (max-width: 767px) {
  .p-company-directors-img {
    margin: 0;
  }
}
@media (max-width: 767px) {
  .p-company-directors-img img {
    width: 70%;
  }
}
@media (max-width: 767px) {
  .company-directors-img {
    margin: 0;
  }
}
@media (max-width: 767px) {
  .company-directors-img img {
    width: 70%;
  }
}


/* page-service
======================================================*/
/*=====================================================
# mv
======================================================*/
.mv-service-lower {
  width: 100%;
  height: 250px;
  background: url(../img/mv-service_pc.png) no-repeat center center/cover;
  position: relative;
}
@media (max-width: 767px) {
  .mv-service-lower {
    background: url(../img/mv-service_sp.png) no-repeat center center/cover;
  }
}



.mv-lower-img-service {
  background: url(../img/lower-mv-decoration_pc.png) no-repeat center center/cover;
  width: 365px;
  height: 250px;
}
@media (max-width: 767px) {
  .mv-lower-img-service {
    background: url(../img/lower-mv-decoration_sp.png) no-repeat center center/cover;
    width: 165px;
  }
}

.mv-lower-en-wrapper {
  font-size: 40px;
  font-weight: 500;
  color: #023E78;
  background: #fff;
  font-family: "Fira Sans", "Lato", sans-serif;
  padding: 5px 0;
}
@media (max-width: 767px) {
  .mv-lower-en-wrapper {
    font-size: 25px;
  }
}

.mv-lower-jp-wrapper {
  color: #023E78;
  display: inline-block;
  background: #fff;
  margin-top: 8px;
  font-size: 16px;
  font-weight: 500;
}
.mv-lower-jp-wrapper p {
  padding: 5px 0;
  margin: 0;
}

/*=====================================================
# service-detail
======================================================*/
.service-detail {
  position: relative;
}
@media (max-width: 767px) {
  .service-detail{
    padding-top: 30px;
  }
}

.service-detail-intro {
  font-size: 28px;
  font-weight: bold;
  text-align: center;
}
@media (max-width: 767px) {
  .service-detail-intro {
    font-size: 20px;
  }
}

@media (min-width: 1280px) {
  .hidden-pc {
    display: none;
  }
}

.service-detail-inner {
  max-width: 1260px;
  padding: 0 40px;
}
@media (max-width: 767px) {
  .service-detail-inner {
    padding: 0;
  }
}

.service-detail-inner p{
  margin-top: 0;
}

.service-detail-items {
  margin: 132px auto 120px;
  width: 100%;
}
@media (max-width: 767px) {
  .service-detail-items {
    margin-top: 45px;
  }
}

.service-detail-item {
  display: flex;
}
@media (max-width: 767px) {
  .service-detail-item {
    display: block;
  }
}

.service-detail-items:nth-of-type(odd) .service-detail-item {
  flex-direction: row-reverse;
}
@media (max-width: 767px) {
  .service-detail-items:nth-of-type(odd) .service-detail-item .service-detail-img {
    margin-left: auto;
  }
}

.service-detail-main {
  background: rgba(255, 255, 255, 0.9);
  max-width: 590px;
  padding: 80px 40px 60px;
  width: 70%;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.1607843137);
  position: relative;
  z-index: 1;
  transform: translateX(60px);
  height: auto;
}
@media (max-width: 767px) {
  .service-detail-main {
    width: 90%;
    transform: translateX(0);
    max-width: 100%;
    margin: 0 20px;
    margin-top: -160px;
    padding: 38px 20px 60px;
  }
}

.service-detail-number {
  font-size: 100px;
  color: #023E78;
  position: absolute;
  top: -100px;
  left: 58px;
}
@media (max-width: 767px) {
  .service-detail-number {
  left: 20px;
  top: -70px;
  font-size: 70px;
  font-style: italic;
  font-weight: bold;
  }
}


.service-detail-items:nth-of-type(2) .service-detail-number{
  position: absolute;
  left: 450px;
  top: -100px;
}
@media (max-width: 767px) {
  .service-detail-items:nth-of-type(2) .service-detail-number {
    left: 238px;
    top: -65px;
  }
}

.service-detail-img {
  margin: 60px 0 0;
  max-width: 560px;
  width: 47.46%;
}
@media (max-width: 767px) {
  .service-detail-img {
    width: 51%;
    margin-top: 0;
  }
}

.service-detail-items:nth-of-type(2) .service-detail-main {
  transform: translateX(-60px);
}
@media (max-width: 767px) {
  .service-detail-items:nth-of-type(2) .service-detail-main {
    transform: none;
    margin-right: auto;
  }
}

.service-detail-jp {
  font-size: 40px;
  line-height: 1.5;
  font-weight: bold;
}
@media (max-width: 767px) {
  .service-detail-jp {
    font-size: 28px;
  }
}

.service-detail-en {
  font-size: 16px;
  color: #023E78;
}

.service-detail-text {
  margin: 95px 0;
  font-size: 14px;
}
@media (max-width: 767px) {
  .service-detail-text {
    margin-bottom: 40px;
  }
}

.service-detail-dl {
  font-size: 14px;
  align-items: center;
  border-top: 1px solid #ccc;
  display: flex;
  height: 90px;
  margin: 0;
}
.service-detail-dl:last-of-type {
  border-bottom: 1px solid #ccc;
}

.service-detail-dd {
  margin-left: 52px;
}

.service-detail-dt {
  white-space: nowrap;
}

.service-detail-button {
  display: block;
  font-size: 14px;
  margin: 30px auto 0;
  max-width: 295px;
  padding: 28px 10px;
  width: 100%;
  text-align: center;
  color: #023E78;
  border: 1px solid #023E78;
  transition: all 0.5s ease 0s;
  position: relative;
}
@media (max-width: 767px) {
  .service-detail-button {
  margin-top: 50px;
  }
}

.service-detail-button::before {
  position: absolute;
  content: "";
  right: 20px;
  width: 20px;
  height: 13px;
  top: 50%;
  transform: translateY(-50%);
  background: url(../img/icon-arrow-right04.png) no-repeat center center/cover;
}
.service-detail-button:hover {
  background: #023E78;
  color: #fff;
}
.service-detail-button:hover::after {
  position: absolute;
  content: "";
  right: 15px;
  width: 20px;
  height: 13px;
  top: 50%;
  transform: translateY(-50%);
  background: url(../img/icon-arrow-white.png) no-repeat center center/cover;
}

.service-detail-bg {
  background: #EEF3F8;
  position: absolute;
  transform: skewY(10deg);
  top: 1650px;
  width: 100%;
  height: 1050px;
  left: 0;
  right: 0;
  margin: 10 0px;
  z-index: -1;
}
@media (max-width: 767px) {
  .service-detail-bg {
    top: 1600px;
    height: 1200px;
  }
}

/*=====================================================
# service-flow 
======================================================*/
.service-flow {
  background: url(../img/bg-service-flow.png) no-repeat center center/cover;
}
@media (max-width: 767px) {
  .service-flow{
    padding-bottom: 8px;
  }
}

.service-flow-inner {
  padding: 0 40px;
  max-width: 1180px;
  margin: 0 auto;
  margin-bottom: 20px;
}
@media (max-width: 767px) {
  .service-flow-inner {
    padding: 35px 20px;
  }
}

.service-flow-title {
  font-size: 24px;
  color: #fff;
  font-weight: bold;
  text-align: center;
}

.service-flow-items {
  display: flex;
  margin-top: 80px;
  line-height: 1.7;
}
@media (max-width: 767px) {
  .service-flow-items {
    display: block;
    margin-top: 40px;
  }
}

.service-flow-item {
  flex: 1;
  align-items: center;
  justify-content: center;
  position: relative;
}
@media (max-width: 767px) {
  .service-flow-item {
    display: flex;
  }
}

.service-flow-steps {
  display: flex;
  align-items: center;
  font-style: italic;
}
@media (max-width: 767px) {
  .service-flow-steps {
    display: block;
    line-height: 1;
    white-space: nowrap;
  }
}

.service-flow-step {
  font-size: 20px;
  color: #FFF400;
}
@media (max-width: 767px) {
  .service-flow-step {
    margin: 0;
  }
}

.service-flow-step-number {
  font-size: 40px;
  color: #FFF400;
  margin-left: 8px;
  margin-top: 0;
  margin-bottom: 0;
}
@media (max-width: 767px) {
  .service-flow-step-number {
    margin: 0;
  }
}

.service-flow-item-title {
  font-size: 1.5vw;
  color: #023E78;
}
@media (max-width: 767px) {
  .service-flow-item-title {
    font-size: 18px;
    text-align: center;
  }
}

.service-flow-item-text {
  font-size: 1.0vw;
  margin-bottom: 0;
}
@media (max-width: 767px) {
  .service-flow-item-text {
    font-size: 14px;
  }
}

.service-flow-main {
  padding: 46px 43px 46px 32px;
  width: 100%;
  display: inline-block;
  height: 215px;
}
@media (max-width: 767px) {
  .service-flow-main {
    margin-left: 18px;
    padding: 20px 30px 20px 30px;
    height: 150px;
  }
}

.service-flow-main-main01 {
  background: #EDF3F8;
}
.service-flow-main-main01::after {
  position: absolute;
  content: "";
  right: -20px;
  z-index: 1;
  top: 75px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 108px 0 108px 20px;
  border-color: transparent transparent transparent #EDF3F8;
}
@media (max-width: 767px) {
  .service-flow-main-main01::after {
    position: absolute;
    content: "";
    z-index: 1;
    top: 147px;
    left: 65px;
    height: 0;
    border-style: solid;
    border-width: 5vw 38vw 0 38vw;
    border-color: #EDF3F8 transparent transparent transparent;
  }
}
@media (max-width: 767px) and (max-width: 610px) {
  .service-flow-main-main01::after {
    left: auto;
    border-width: 5vw 38vw 0 38vw;
  }
}

.p-service-flow-main-main02 {
  background: #DDE8F0;
}
.p-service-flow-main-main02::after {
  position: absolute;
  content: "";
  right: -20px;
  z-index: 1;
  top: 75px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 108px 0 108px 20px;
  border-color: transparent transparent transparent #DDE8F0;
}
@media (max-width: 767px) {
  .p-service-flow-main-main02::after {
    position: absolute;
    content: "";
    z-index: 1;
    top: 150px;
    left: 70px;
    height: 0;
    border-style: solid;
    border-width: 5vw 38vw 0 38vw;
    border-color: #DDE8F0 transparent transparent transparent;
  }
}
@media (max-width: 767px) and (max-width: 610px) {
  .p-service-flow-main-main02::after {
    left: auto;
    border-width: 5vw 38vw 0 38vw;
  }
}

.service-flow-main-main03 {
  background: #C7DBE9;
}
.service-flow-main-main03::after {
  position: absolute;
  content: "";
  right: -20px;
  z-index: 1;
  top: 75px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 108px 0 108px 20px;
  border-color: transparent transparent transparent #C7DBE9;
}
@media (max-width: 767px) {
  .service-flow-main-main03::after {
    position: absolute;
    content: "";
    z-index: 1;
    top: 150px;
    left: 70px;
    height: 0;
    border-style: solid;
    border-width: 5vw 38vw 0 38vw;
    border-color: #C7DBE9 transparent transparent transparent;
  }
}
@media (max-width: 767px) and (max-width: 610px) {
  .service-flow-main-main03::after {
    left: auto;
    border-width: 5vw 38vw 0 38vw;
  }
}

.service-flow-main--main04 {
  background: #B0D0E5;
  padding-bottom: 11px;
  min-height: 200px;
}

.service-flow-item-apdx {
  font-size: 1.0vw;
  color: #E61264;
  margin-top: 0;
}
@media (max-width: 767px) {
  .service-flow-item-apdx {
    font-size: 14px;
    margin-top: 10px;
  }
}

/*=====================================================
# service-faq
======================================================*/
.service-faq {
  padding-top: 120px;
}
@media (max-width: 767px) {
  .service-faq {
    padding-top: 45px;
  }
}

.service-faq-inner {
  padding: 0 40px 120px 40px;
}
@media (max-width: 767px) {
  .service-faq-inner {
    padding: 0 20px 205px 20px;
}
}


.service-faq-title {
  font-size: 24px;
  text-align: center;
  font-weight: bold;
}

.service-faq-items {
  margin: 60px auto 0;
  max-width: 688px;
}

.accordion-item {
  padding: 31px 0;
  border-bottom: 1px solid #DDDDDD;
}
@media (max-width: 767px) {
  .accordion-item{
    padding-top: 0;
  }
}
.accordion-item.is-open {
  padding: 0;
}

.accordion-title {
  font-size: 20px;
  font-weight: bold;
  cursor: pointer;
  position: relative;
}
@media (max-width: 767px) {
  .accordion-title {
    font-size: 16px;
    padding-right: 67px;
  }
}

.accordion-title.is-open {
  color: #E61264;
}

.accordion-title.is-open::after {
  position: absolute;
  content: "";
  right: 0;
  width: 21px;
  height: 2px;
  background: #E61264;
  top: 50%;
  transform: translateY(-50%);
  transform: rotate(-45deg);
  transition: all 0.5s ease 0s;
}
.accordion-title.is-open::before {
  position: absolute;
  content: "";
  right: 0;
  width: 21px;
  height: 2px;
  background: #E61264;
  top: 50%;
  transform: translateY(-50%);
  transform: rotate(45deg);
  transition: all 0.5s ease 0s;
}
.accordion-title::after {
  position: absolute;
  content: "";
  right: 0;
  width: 21px;
  height: 2px;
  background: #000;
  top: 50%;
  transform: translateY(-50%);
  transition: all 0.5s ease 0s;
}
.accordion-title::before {
  position: absolute;
  content: "";
  right: 0;
  width: 21px;
  height: 2px;
  background: #000;
  top: 50%;
  transform: translateY(-50%);
  transform: rotate(90deg);
  transition: all 0.5s ease 0s;
}

.accordion-content {
  font-size: 14px;
  padding: 30px 60px 0 40px;
  display: none;
}
@media (max-width: 767px) {
  .accordion-content {
    padding: 0;
  }
}

/* page-case
======================================================*/
/*=====================================================
# mv
======================================================*/
.mv-case-lower {
  width: 100%;
  height: 250px;
  background: url(../img/mv-company_pc.png) no-repeat center center/cover;
  position: relative;
}
@media (max-width: 767px) {
  .mv-case-lower {
    background: url(../img/mv-company_sp.png) no-repeat center center/cover;
  }
}

/*=====================================================
# case-study
======================================================*/
.case-study {
  padding: 80px 0 160px 0;
}
@media (max-width: 990px) {
  .case-study {
    padding: 53px 0 120px 0;
  }
}

.case-study-inner {
  padding: 0 78px;
}
@media (max-width: 990px) {
  .case-study-inner {
    padding: 0 18px;
  }
}

.case-study-nav-lists {
  display: flex;
}
@media (max-width: 767px) {
  .case-study-nav-lists {
    display: block;
    padding: 0 30px;
  }
}

.cases {
  padding-top: 80px;
}
@media (max-width: 767px) {
  .cases {
    padding-top: 53px;
  }
}

.case-study-nav-link {
  width: 208px;
  font-size: 14px;
  background: #eee;
  border-radius: 4px;
  display: block;
  font-weight: bold;
  padding: 10px;
  text-align: center;
  transition: background-color 1.3s;
}
@media (max-width: 767px) {
  .case-study-nav-link {
    width: 100%;
  }
}

.case-study-nav-list:not(:first-child) {
  margin-left: 16px;
}
@media (max-width: 767px) {
  .case-study-nav-list:not(:first-child) {
    margin: 0;
  }
}
@media (max-width: 767px) {
  .case-study-nav-list:not(:first-child) {
    margin-top: 20px;
  }
}

.cases-item-head {
  border-radius: 12px 12px 0 0;
}

.cases-title {
  font-weight: bold;
  border-left: 8px solid #023e78;
  font-size: 24px;
  padding-left: 10px;
}
@media (max-width: 767px) {
  .cases-title {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
  }
}

.cases-title-en {
  font-size: 16px;
  color: #023E78;
  font-style: italic;
  margin-left: 20px;
}
@media (max-width: 990px) {
  .cases-title-en {
    margin-left: 0;
  }
}

.cases-items {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 0;
}
@media (max-width: 990px) {
  .cases-items {
    display: block;
  }
}

.cases-item {
  margin-top: 60px;
  width: calc(50% - 40px);
  background: #fff;
  border-radius: 13px;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.16);
}
@media (max-width: 990px) {
  .cases-item {
    width: 100%;
  }
}
@media (max-width: 767px) {
  .cases-item:nth-child(n+2) {
    margin-top: 20px;
  }
}

.cases-item-head {
  font-weight: bold;
  display: flex;
  background: #023E78;
  padding: 0 20px;
  position: relative;
}

.cases-item-logo {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
}
.cases-item-logo img {
  max-width: 160px;
  width: 15vw;
  border-radius: 12px;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.16);
  overflow: hidden;
}
@media (max-width: 767px) {
  .cases-item-logo img {
    width: 23vw;
  }
}

.cases-item-body {
  padding: 40px 40px 0 40px;
}
@media (max-width: 767px) {
  .cases-item-body {
    padding: 20px 20px 10px 20px;
  }
}

.cases-item-title {
  padding-bottom: 10px;
  border-bottom: 1px solid #ddd;
}
@media (max-width: 767px) {
  .cases-item-title {
    font-size: 16px;
  }
}

.cases-business {
  font-size: 14px;
  color: #fff;
}

.cases-name {
  font-size: 24px;
  color: #fff;
  margin: 0;
}
@media (max-width: 990px) {
  .cases-name {
    font-size: 16px;
  }
}

.cases-compellation {
  font-size: 16px;
}

.cases-item-title-course-name {
  margin-left: 10px;
}

.cases-list {
  margin-top: 30px;
}
@media (max-width: 990px) {
  .cases-list {
    margin-top: 20px;
  }
}
.cases-list-title {
  font-size: 18px;
  padding-left: 30px;
  position: relative;
}
@media (max-width: 990px) {
  .cases-list-title {
    font-size: 16px;
  }
}
.cases-list-title::before {
  position: absolute;
  content: "";
  left: 0;
  height: 20px;
  width: 20px;
  background: url(../img/icon-check.png) no-repeat center center/cover;
  top: 50%;
  transform: translateY(-50%);
}

.cases-list-text {
  font-size: 14px;
}

.cases-button-wrapper a {
  display: block;
  font-size: 14px;
  margin: 48px auto 0;
  max-width: 368px;
  padding: 27px 10px;
  width: 100%;
  text-align: center;
  color: #023E78;
  border: 1px solid #023E78;
  transition: all 0.5s ease 0s;
  position: relative;
}
@media (max-width: 767px) {
  .cases-button-wrapper a  {
    width: 90%;
  }
}

.cases-button-wrapper a::before {
  position: absolute;
  content: "";
  right: 20px;
  width: 20px;
  height: 13px;
  top: 50%;
  transform: translateY(-50%);
  background: url(../img/icon-arrow-right04.png) no-repeat center center/cover;
}
.cases-button-wrapper a:hover {
  background: #023E78;
  color: #fff;
}
.cases-button-wrapper a:hover::after {
  position: absolute;
  content: "";
  right: 15px;
  width: 20px;
  height: 13px;
  top: 50%;
  transform: translateY(-50%);
  background: url(../img/icon-arrow-white.png) no-repeat center center/cover;
}

/* home.html
======================================================*/
.mv-case-lower {
  width: 100%;
  height: 250px;
  background: url(../img/mv-news_pc.png) no-repeat center center/cover;
  position: relative;
}
@media (max-width: 767px) {
  .mv-case-lower {
    background: url(../img/mv-news_sp.png) no-repeat center center/cover;
  }
}

/*=====================================================
# contents 
======================================================*/
.contents-main-inner {
  max-width: 1180px;
  display: flex;
  margin: 0 auto;
}


.contents-sub-inner {
  display: flex;
  justify-content: space-between;
}
@media (max-width: 767px) {
  .contents-sub-inner {
    display: block;
  }
}

.archive-news {
  width: calc(70.91% - 20px);
}
@media (max-width: 767px) {
  .archive-news {
    width: 100%;
  }
}

.archive-news-cat-name {
  font-size: 32px;
  font-weight: bold;
}
@media (max-width: 767px) {
  .archive-news-cat-name {
    font-size: 20px;
  }
}

.archive-news-item {
  display: flex;
  justify-content: space-between;
}
.archive-news-item:not(:first-child) {
  margin-top: 35px;
}
@media (max-width: 767px) {
  .archive-news-item:not(:first-child)  {
    margin-top: 15px;
  }
}

.archive-news-body {
  margin-top: 12px;
  width: calc(65.79% - 10px);
}
@media (max-width: 767px) {
  .archive-news-body {
    margin-top: 0;
  }
}

.archive-news-thumbnail {
  width: calc(34.21% - 10px);
}
@media (max-width: 767px) {
  .archive-news-thumbnail {
    width: calc(38.21% - 10px);
  }
}

.archive-news-thumbnail img {
  height: 12.1875vw;
  max-height: 156px;
}
@media (max-width: 767px) {
  .archive-news-thumbnail img {
    height: 24vw;
    max-height: 100%;
  }
}


.meta {
  display: flex;
}

.meta-cats {
  display: flex;
  align-items: center;
}

.meta-cat {
  font-size: 14px;
  color: #E61264;
  width: 104px;
  height: 36px;
  display: inline-block;
  border: 1px solid #E61264;
  padding: 5px 10px;
  text-align: center;
  cursor: pointer;
}
@media (max-width: 767px) {
  .meta-cat {
    font-size: 10px;
    width: 75px;
    height: 28px;
  }
}

.meta-new {
  color: #E61264;
  margin-left: 12px;
}

.meta-time {
  font-size: 14px;
  color: #888888;
  margin-left: auto;
}

.archive-news-title {
  font-size: 16px;
  font-weight: bold;
  margin-top: 16px;
}

.sidebar {
  width: calc(29.09% - 20px);
}
@media (max-width: 767px) {
  .sidebar {
    width: 100%;
    padding-top: 120px;
  }
}

.sidebar-new{
  margin-top: 20px;
}

.sidebar-title {
  font-size: 20px;
  font-weight: bold;
}

.sidebar-new-item {
  display: flex;
  justify-content: space-between;
}
.sidebar-new-item:not(:first-child) {
  margin-top: 16px;
}

.sidebar-new-thumbnail {
  width: calc(35% - 5px);
}
.sidebar-new-thumbnail img {
  height: 7.8125vw;
  max-height: 100px;
}
@media (max-width: 767px) {
  .sidebar-new-thumbnail img {
    height: 24vw;
    max-height: 100%;
  }
}

.sidebar-new-body {
  width: calc(65% - 5px);
}

.sidebar-new-meta {
  display: flex;
  align-items: center;
}

.sidebar-new-cat {
  color: #E61264;
  font-size: 12px;
  width: 72px;
  height: auto;
  display: inline-block;
  border: 1px solid #E61264;
  padding: 2px 8px;
  text-align: center;
  white-space: nowrap;
}

.sidebar-new-time {
  font-size: 14px;
  color: #888888;
  margin-left: auto;
}

.sidebar-new-title {
  font-size: 14px;
  margin-top: 8px;
}


.widget_categories{
  margin-top: 16px;
}

@media (max-width: 767px) {
  .wpost-items{
    margin-top: 20px;
  }
}

.cat-item{
  font-size: 16px;
  font-weight: bold;
  border-top: 1px solid #ddd;
  padding: 15px 40px;
  position: relative;
}

.wp-block-categories:last-child{
  border-bottom: 1px solid #ddd;
}

.cat-item::before {
  position: absolute;
  content: "";
  left: 20px;
  width: 9px;
  height: 16px;
  background: url(../img/icon-chevron-right02.png) no-repeat center center/cover;
  top: 50%;
  transform: translateY(-50%);
}

.sidebar-cats {
  padding-top: 55px;
}

.sidebar-cats-lists {
  margin-top: 16px;
}

.sidebar-cats-list {
  border-top: 1px solid #ddd;
  padding: 15px 40px;
  position: relative;
}
.sidebar-cats-list:last-child {
  border-bottom: 1px solid #ddd;
}
.sidebar-cats-list::before {
  position: absolute;
  content: "";
  left: 20px;
  width: 9px;
  height: 16px;
  background: url(../img/icon-chevron-right02.png) no-repeat center center/cover;
  top: 50%;
  transform: translateY(-50%);
}

.sidebar-cats-link {
  font-weight: bold;
}

.archive-news-pagination {
  margin-top: 60px;
  text-align: center;
  display: flex;
  justify-content: center;
  cursor: pointer;
}
.archive-news-pagination a.current {
  background: #023E78;
  color: #fff;
}
@media (max-width: 767px) {
  .archive-news-pagination {
    margin-top: 30px;
  }
}

.page-numbers {
  width: 50px;
  height: 50px;
  display: inline-block;
  background: #F8F8F8;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  transition: 0.3s ease 0s;
}
.page-numbers:not(:first-child) {
  margin-left: 8px;
}
.page-numbers:hover {
  background: #023E78;
  color: #fff;
}
@media (max-width: 767px) {
  .page-numbers {
    width: 40px;
    height: 40px;
  }
}

.pagination-next {
  position: relative;
}
.pagination-next::after {
  position: absolute;
  content: "";
  width: 10px;
  height: 16px;
  background: url(../img/icon-chevron-right.png) no-repeat center center/cover;
  top: 50%;
  transform: translateY(-50%);
}

/* single
======================================================*/
/*=====================================================
# contents
======================================================*/

.contents-main-inner {
  padding: 42px 40px 160px 40px;
  max-width: 1180px;
  display: flex;
  margin: 0 auto;
}
@media (max-width: 767px) {
  .contents-main-inner {
    padding: 50px 15px 160px 15px;
  }
}

.contents-main {
  width: calc(70.91% - 20px);
}
@media (max-width: 767px) {
  .contents-main {
    width: 100%;
  }
}

.single-meta {
  font-size: 24px;
}

.single-thumbnail {
  margin-top: 40px;
  width: 100%;
}

.single-thumbnail img{
  width: 100%;
}

.single-title {
  font-size: 24px;
  line-height: 1.38;
  margin-top: 20px;
}

.single-content h2 {
  background: #f8f8f8;
  border-left: 6px solid #023e78;
  font-size: 20px;
  padding: 6px 10px 6px 20px;
  color: #023e78;
  font-weight: bold;
  margin-top: 40px;
}
.single-content h3 {
  border-bottom: 1px solid #023e78;
  font-size: 18px;
  padding-bottom: 5px;
  color: #023e78;
  font-weight: bold;
  margin-top: 40px;
}
.single-content h4 {
  font-size: 16px;
  color: #023e78;
  font-weight: bold;
  margin-top: 40px;
}
.single-content p {
  margin-bottom: 0;
  font-size: 14px;
}
.single-content ul {
  margin-top: 40px;
  margin-left: 40px;
}
.single-content ul li {
  position: relative;
}
.single-content ul li::before {
  position: absolute;
  content: "・";
  left: -15px;
}
.single-content ul li:not(:first-child) {
  margin-top: 13px;
}

.wp-block-quote {
  margin: 40px 40px 0;
  padding: 35px 40px 35px 39px;
  background: #f8f8f8;
  border-left: 4px solid #023e78;
  margin-top: 40px;
  padding: 32px 28px;
  position: relative;
}
.wp-block-quote p {
  margin-top: 0;
  position: relative;
  z-index: 1;
}
.wp-block-quote::before {
  position: absolute;
  content: "";
  height: 130px;
  left: 25px;
  top: 25px;
  width: 60px;
  background: url(../img/quote.png) no-repeat center center/cover;
}
@media (max-width: 767px) {
  .wp-block-quote {
    margin: 0;
  }
}

.single-post-links {
  display: flex;
  justify-content: space-between;
  margin-top: 40px;
}

.single-post-link {
  border: 1px solid #023e78;
  border-radius: 4px;
  color: #023e78;
  display: block;
  padding: 5px 15px;
  transition: background-color 0.3s, color 0.3s;
}
.single-post-link:hover {
  background: #023e78;
  color: #fff;
}

.entry-links{
  display: flex;
  text-align: center;
  justify-content: center;
  margin-top: 30px;
}

.current{
  background: #023e78;
  color: #fff;
}

.post-page-numbers{
  width: 50px;
  height: 50px;
  display: inline-block;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  border: 1px solid #023e78;
  transition: 0.3s ease 0s;
}

.post-page-numbers:not(:first-child) {
  margin-left: 8px;
}

.post-page-numbers:hover {
  background: #023E78;
  color: #fff;
}
@media (max-width: 767px) {
  .page-numbers {
    width: 40px;
    height: 40px;
  }
}


/* page-download
======================================================*/
/*=====================================================
# download
======================================================*/

.mv-download-lower {
  background: url(../img/mv-download_pc.png) no-repeat center center/cover;
  position: relative;
}

.mv-lower-en {
  font-style: italic;
  padding: 0 5px;
}

.section-lower-fv {
  padding: 32px 0 px;
}

.download-inner {
  max-width: 1180px;
  padding: 30px 40px 80px 40px;
  margin: 0 auto;
  margin-top: 40px;
}
@media (max-width: 767px) {
  .download-inner {
    margin-top: 22px;
    padding: 30px 20px 80px 20px;
  }
}


.download-items {
  display: flex;
  justify-content: space-between;
}
@media (max-width: 767px) {
  .download-items {
    display: block;
  }
}

.download-document {
  width: calc(50% - 40px);
}
@media (max-width: 767px) {
  .download-document {
    width: 100%;
  }
}

.download-document p{
  margin: 0;
}
@media (max-width: 767px) {
  .download-document p{
    font-size: 14px;
  }
}

.download-document-title {
  font-size: 28px;
  font-weight: bold;
}
@media (max-width: 767px) {
  .download-document-title {
    font-size: 20px;
  }
}

.download-document-img {
  max-width: 315px;
  margin-left: 90px;
}
@media (max-width: 767px) {
  .download-document-img {
    max-width: 1180px;
    margin-left: 0;
  }
}

.download-document-text {
  font-size: 14px;
  line-height: 1;
}


.download-form {
  margin-top: 0;
  padding: 40px;
  width: 50%;
  background: #edf3f8;
  border-radius: 12px;
}
@media (max-width: 767px) {
  .download-form {
    width: 100%;
    margin-top: 52px;
    padding-left: 20px;
    padding-right: 20px;
  }
}


.download-form-items {
  margin-top: 35px;
}

.download-form-title {
  font-size: 32px;
}
@media (max-width: 767px) {
  .download-form-title{
  font-size: 20px;
  }
}

.form-label {
  font-weight: bold;
  font-size: 18px;
}
@media (max-width: 767px) {
  .form-label{
  font-size: 14px;
  }
}


.form-label input,
.form-label select,
.form-label textarea {
  margin: 12px 0 32px;
  padding: 9px 16px;
  border: 1px solid #ddd;
  border-radius: 5px;
  display: inline-block;
  font-size: 16px;
  margin: 6px 0 18px;
  padding: 12px 14px;
  width: 100%;
}
@media (max-width: 767px) {
  .form-label input,
  .form-label select,
  .form-label textarea{
  margin-bottom: 0;
  }
}

.form-input {
  color: #CCCCCC;
  opacity: 0.5;
}

.form-required {
  font-size: 12px;
  padding: 4px 8px;
  background: #e61264;
  color: #fff;
  display: inline-block;
  font-weight: bold;
  line-height: 1;
  margin-left: 8px;
  vertical-align: middle;
}

.download-submit input{
  font-size: 16px;
  padding: 27px 15px;
  display: block;
  margin: 40px auto 0;
  max-width: 332px;
  text-align: center;
  width: 100%;
  cursor: pointer;
  transition: all 0.5s ease 0s;
  background: #fff;
  border:1px solid #023E78;
  color: #023E78;

}

.download-submit input:hover {
  color: #fff;
  background: #023E78;
}

.button-primary {
  background: #fff;
  border: 1px solid #023e78;
  color: #023e78;
}

.form-link-to-privacy {
  font-weight: bold;
  text-decoration: underline;
  margin: 0 10px;
}

.download-acceptance {
  text-align: center;
}
.download-acceptance span {
  cursor: pointer;
}
.download-acceptance .wpcf7-list-item-label {
  position: relative;
}



/* .download-acceptance .wpcf7-list-item-label::before {
  cursor: pointer;
  background: #fff;
  border: 1px solid #3e3e3e;
  border-radius: 2px;
  content: "";
  display: block;
  height: 28px;
  left: -30px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
}
.download-acceptance .wpcf7-list-item-label::after {
  border-bottom: solid 2px #4973ff;
  border-left: solid 2px #4973ff;
  content: "";
  display: block;
  height: 6px;
  left: 2px;
  opacity: 0;
  position: absolute;
  top: 8px;
  transform: rotate(-45deg);
  transition: 0.2s;
  width: 15px;
  left: -23px;
}
.download-acceptance input[type=checkbox]:checked + .wpcf7-list-item-label:after {
  opacity: 1;
}
.download-acceptance input {
  opacity: 0;
} */

/* page-download-thanks
======================================================*/
.form-link {
  color: #023E78;
  text-decoration: underline;
}

.download-thanks-inner{
  padding-bottom: 100px;
}

.download-document-thanks p{
  font-size: 16px;
  line-height: 1.2;
}

.download-form-title-tanks{
  font-size: 23px;
}

/* page-contact
======================================================*/
.mv-contact-lower {
  background: url(../img/mv-contact_pc.png) no-repeat center center/cover;
  position: relative;
}
@media (max-width: 767px) {
  .mv-contact-lower {
    background: url(../img/mv-contact_sp.png) no-repeat center center/cover;
  }
}

.contact-item p{
  font-size: 14px;
}

.contact-item {
  margin: 0 auto;
  max-width: 688px;
  margin-top: 47px;
  margin-bottom: 130px;
}
@media (max-width: 767px) {
  .contact-item {
    margin-top: 26px;
    margin-bottom: 60px;
  }
}
.contact-inner{
  padding: 0 10px;
}

/* .contact-intro {
  font-size: 14px;
} */

.contact-form {
  margin-top: 63px;
}
@media (max-width: 767px) {
  .contact-form  {
    margin-top: 46px;
  }
}

.contact-form-title {
  font-size: 24px;
  font-weight: bold;
  text-align: center;
}

.contact-form-items {
  margin-top: 60px;
}
@media (max-width: 767px) {
  .contact-form-items  {
    margin-top: 35px;
  }
}

.contact-acceptance {
  text-align: center;
  display: block;
}
.contact-acceptance span {
  cursor: pointer;
}
.contact-acceptance .wpcf7-list-item-label {
  position: relative;
}

.contact-submit input{
  font-size: 16px;
  padding: 27px 15px;
  display: block;
  margin: 40px auto 0;
  max-width: 200px;
  text-align: center;
  width: 100%;
  cursor: pointer;
  transition: all 0.5s ease 0s;
  background: #fff;
  border:1px solid #023E78;
  color: #023E78;
}
@media (max-width: 767px) {
  .contact-submit input {
    max-width: 300px;
  }
}

.contact-submit input:hover{
  color: #fff;
  background: #023E78;
}


/* .contact-acceptance .wpcf7-list-item-label::before {
  cursor: pointer;
  background: #fff;
  border: 1px solid #3e3e3e;
  border-radius: 2px;
  content: "";
  display: block;
  height: 28px;
  left: -30px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
}
.contact-acceptance .wpcf7-list-item-label::after {
  border-bottom: solid 2px #4973ff;
  border-left: solid 2px #4973ff;
  content: "";
  display: block;
  height: 6px;
  left: 2px;
  opacity: 0;
  position: absolute;
  top: 8px;
  transform: rotate(-45deg);
  transition: 0.2s;
  width: 15px;
  left: -23px;
}
.contact-acceptance input[type=checkbox]:checked + .wpcf7-list-item-label:after {
  opacity: 0;
}  */

/* .contact-acceptance input {
  opacity: 1;
} */

.wpcf7-list-item input{
  position: absolute;
  width: 30px;
  height: 30px;
  top: 35%;
  transform: translateY(-50%);
  left: -5px;
}

/* .contact-submit {
  font-size: 16px;
  padding: 27px 15px;
  display: block;
  margin: 47px auto 0;
  max-width: 340px;
  text-align: center;
  width: 100%;
  cursor: pointer;
  transition: all 0.5s ease 0s;
}
@media (max-width: 767px) {
  .contact-submit {
    max-width: 298px;
  }
} */
/* .contact-submit:hover {
  color: #fff;
  background: #023E78;
} */

/* .wpcf7-submit{
  font-size: 16px;
  padding: 27px 15px;
  display: block;
  margin: 47px auto 0;
  max-width: 340px;
  text-align: center;
  width: 100%;
  cursor: pointer;
  transition: all 0.5s ease 0s;
  background: #fff;
  border:1px solid #023E78;
  color: #023E78;
} */
/* 
.wpcf7-submit:hover{
  color: #fff;
  background: #023E78;
} */



/* contact-thunks
======================================================*/
.contact-intro {
  font-size: 14px;
}
.contact-intro a {
  color: #023e78;
  text-decoration: underline;
  margin-top: 16px;
}

.contact-thanks-item{
  margin-top: 73px;
  margin-bottom: 162px;
}
@media (max-width: 767px) {
  .contact-thanks-item {
    margin-top: 55px;
    margin-bottom: 125px;
  }
}