@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');

/*==================================================
初期設定
iPhone SE の Portrait 横幅 320px
==================================================*/
/************** 共通部分 ***************/
/* ルート設定 */
html {
  font-size: 1.32vw;
}
body {
  font-size: 1.6rem;
  font-family: "Jost", "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  color: #FFFFFF;
}
html, body {
  overflow-x: hidden;
}
/* 既存スタイルなし設定 */
a,
a:link,
a:visited {
  text-decoration: none;
  color: #FFFFFF;
}
/* 文章・段落 */
p {
  font-size: 2.8rem;
  line-height: 1.76; /* line-height: 1.6; */
  font-family: "Noto Sans JP", sans-serif;
}
/* テーブル */
th, td {
  text-align: left;
  vertical-align: top;
  font-size: 2.8rem;
  line-height: 1.6;
  font-family: "Noto Sans JP", sans-serif;
  padding-top: 0;
  padding-bottom: 2.0rem;
}
th {
  font-weight: 700;
  padding-right: 1.6rem;
  white-space: nowrap;
}
/* 見出し */
h1 {
  font-size: 9.6rem;
  font-weight: 600;
  line-height: 1.2;
}
div.part .title_area h1 {
  margin-bottom: 8.0rem;
}
h2 {
  font-size: 3.6rem;
  font-weight: 700;
  line-height: 1.2;
}
h2.sub {
  font-size: 3.2rem;
}
div.part .title_area h2 {
  margin-bottom: 4.0rem;
}
h3 {
  font-size: 2.56rem;
  font-weight: 700;
  line-height: 1.5;
}
h4, h5, h6 {
  font-size: 2.56rem;
  font-weight: 700;
  line-height: 1.5;
}

/* 引用 */
blockquote {
  background-color: rgba(0, 0, 0, 0.3);
  padding: 1.0rem 2.0rem;
  font-size: 2.4rem;
}

/* 箇条書き */
ol {
  list-style-type: decimal;
  padding-left: 3.6rem;
}
ol li {
  font-size: 2.8rem;
  padding-left: 0.4em;
  padding-bottom: 1.0em;
}
ol li:last-child {
  padding-bottom: 0;
}
ul.bulletpoint {
  list-style-type: disc;
  padding-left: 3.0rem;
}
ul.bulletpoint.indent {
  padding-left: 6.0rem;
}
ul.bulletpoint li {
  font-size: 2.8rem;
}
ul.bulletpoint li.reference_mark {
  padding-left: 0.8rem;
}
ul.bulletpoint li.reference_mark::marker {
  content: '※';
}

/* フォーム */
input[type="text"],
input[type="email"],
input[type="password"],
textarea {
  /* background-color: #BCC9CA; */
  border: none;
  font-size: 3.2rem;
  padding: 3.0rem;
  width: 100%;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0;
}
textarea {
  resize: none;
  height: 44.0rem;
}
input[type="checkbox"] {
  margin: 0;
  position: relative;
  width: 4.8rem;
  height: 4.8rem;
  border: none;
  background-color: #FFFFFF; /* background-color: #BCC9CA; */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0;
  transition: .2s ease;
}
input[type="checkbox"]:checked {
  background-color: #FF2E4C;
}
input[type="checkbox"]:checked:before,
input[type="checkbox"]:checked:after {
  content: '';
  background-color: #F6F6F6;
  height: 0.48rem;
  border-radius: 0.4rem;
  position: absolute;
}
input[type="checkbox"]:checked:before {
  width: 2.4rem;
  transform: rotate(48deg);
  top: 57.8%;
  left: 6.0%;
}
input[type="checkbox"]:checked:after {
  width: 3.6rem;
  transform: rotate(-56deg);
  top: 46%;
  right: -2.0%;
}

label {
  font-size: 2.8rem;
}
form label {
  margin-bottom: 2.0rem;
  display: block;
}
form label.bold {
  font-weight: 700;
}
form input[type="text"],
form input[type="email"],
form input[type="password"],
form textarea {
  margin-bottom: 6.0rem;
}

/* WP入力フォーム */
/*
.mw_wp_form.mw_wp_form_input {
}
*/
.mw_wp_form .error { /* WordPressのスタイルより優先させるため */
  color: #FF2E4C !important; 
  font-size: 2.4rem !important;
}
/* WP確認フォーム内の個人情報保護方針説明・チェックボックス */
.mw_wp_form .pp_description .pp_description_tit {
  margin-bottom: 2.0rem;
}
.mw_wp_form .mwform-checkbox-field label span {
  white-space: nowrap;
}
.mw_wp_form .mwform-checkbox-field label {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  margin-bottom: 4.0rem;
}
/* WP確認フォーム */
/*
.mw_wp_form.mw_wp_form_confirm
/*, form.mw_wp_form.mw_wp_form_preview *//* {
}*/
.mw_wp_form.mw_wp_form_confirm .form_inner>div {
  border-bottom: 2px #C8C8C8 solid;
  padding-bottom: 4.0rem;
  margin-bottom: 4.0rem;
}
.mw_wp_form.mw_wp_form_confirm .form_inner>div:last-child {
  border-bottom: none;
}
.mw_wp_form.mw_wp_form_confirm .form_tit {
  /* margin-bottom: 1.6rem; */
  font-weight: 700;
}
.mw_wp_form.mw_wp_form_confirm dd {
  font-size: 2.8rem;
/*
  border-bottom: 2px #C8C8C8 solid;
  padding-bottom: 4.0rem;
  margin-bottom: 4.0rem;
*/
}
/* WP確認フォーム内の個人情報保護方針説明 */
.mw_wp_form.mw_wp_form_confirm .pp_description {
  display: none;
}

/* 検索フォーム */
form.search {
  display: flex;
  border-bottom: 1px solid #FFFFFF;
  padding-bottom: 2.4rem;
}
form.search button {
  display: none;
}
form.search input[type="text"] {
  border: none;
  background-color: rgba(255, 255, 255, 0);
  color: #FFFFFF;
  font-size: 4.0rem;
  line-height: 1.0;
  padding-block: 0.4rem;
  margin-bottom: 0;
  outline: none;
  width: 100%;
}
form.search input[type="text"]:is(:-webkit-autofill, :autofill) {
  border: 4px #2a8095 solid;
  box-sizing: border-box;
/*  background-color: rgba(255, 255, 255, 0);
    color: #FFFFFF; */
}
form.search input[type="text"]:is(::placeholder, ::-ms-input-placeholder) {
  color: #C8C8C8;
  font-size: 700;
}
.icon_search {
  display: block;
  width: auto;
  height: 4.8rem;
  margin-top: auto;
  margin-bottom: auto;
  margin-right: 2.4rem;
}
/* ページ内容 partの共通設定 */
body>.content div.part {
  padding-top: 24.0rem;
  padding-bottom: 24.0rem;
}
body>.content div.part>.inner_content {
  margin-left: auto;
  margin-right: auto;
  width: 78.6vw; /* コンテンツ幅 */
  min-width: 37.5rem; /* あとで */
}

/* SP・PC表示/非表示設定 */
.sp_none {
  display: none;
}
.pc_none {
  display: block;
}

/* video */
video {
  pointer-events: none;
}
#backgroundPart::before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  background-color: rgba(5, 99, 114, 0.0); /*rgba(5, 99, 114, 0.2)*/;
}

/* ページネーション */
.pagination {
  padding-top: 8.0rem;
}
.pagination ul.page-numbers {
  display: flex;
  gap: 0 3.28rem;
}
.pagination ul.page-numbers li>* {
  display: block;
  width: 7.6rem;
  height: 7.6rem;
  line-height: 7.6rem;
  text-align: center;
  font-family: "Jost", sans-serif;
  font-size: 2.4rem;
  font-weight: 700;
  border-radius: 50%;
  border: 0.16rem solid rgba(255, 255, 255, 0);
  box-sizing: border-box;
  transition: border .2s ease;
}
.pagination ul.page-numbers li>*:hover,
.pagination ul.page-numbers li>*:active {
  border-radius: 50%;
  border-color:rgba(255, 255, 255, 1.0);
}
.pagination ul.page-numbers li>*.current {
  background-color: #FFFFFF;
  color: #000000;
  border-color:rgba(255, 255, 255, 1.0);
}

/* スクロール時ふわっとちょっとだけ上に移動しながら現れる */
.scrollIn {
  opacity: 0.1;
  transform: translateY(20px);
  transition: 1s;
}
.fadeIn {
  animation-name: fadeInAnime;
  animation-duration: 3.0s;
  animation-fill-mode: forwards;
  opacity: 0;
}
@keyframes fadeInAnime {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* ボタン */
/*   ボタン共通設定   */
.button {
  display: block;
  width: 37.6rem;
  height: 10.4rem;
  overflow: hidden;
  transition: .2s ease;
  outline: none;
  position: relative;
  background: none;
}
.button_content {
  display: flex;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
}
.button_inner_content { /* これを基準にボタン名、ボタン内矢印の位置を調整する　*/
  position: relative;
  display: block;
  content: '';
  height: 3.2rem;
}
/* ボタン名 */
.button .name {
  font-family: "Jost", sans-serif;
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 1.0;
  white-space: nowrap;
  position: absolute;
}
.button .name_leftSide {
  right: 2.0rem;
}
.button .name_rightSide {
  left: 2.0rem;
}
/* ボタン内矢印 */
.button .arrow_unit {
  position: absolute;
} 
.button .arrow {
  height: 0.4rem;
  width: 9.6rem;
  background-color: #FFFFFF;
  display: block;
  content: '';
  position: relative;
  transition: .2s ease;
}
.button .arrow::before {
  width: 0.54rem;
  height: 1.8rem;
  background-color: #FFFFFF;
  position: absolute;
  content: '';
  bottom: 0;
}
.button .left::before {
  left: 0.48rem;
  transform: skew(-45deg);
}
.button .right::before {
  right: 0.48rem;
  transform: skew(45deg);
}
/* ボタン矢印の位置と移動 */
.button .left {
  right: calc(9.6rem + 2.2rem);
  bottom: -2.4rem;
}
.button:hover .left,
.button:active .left {
  right: calc(9.6rem + 2.2rem + 2.0rem);
}
.button .right {
  left: 2.2rem;
  bottom: -2.4rem;
}
.button:hover .right,
.button:active .right {
  left: calc(2.2rem + 2.0rem);
}
.button_leftToRight:hover:before{
  transform-origin: right top;
  transform: scale(1, 1);
}
.button_rightToLeft:hover:before{
  transform-origin: left top;
  transform: scale(1, 1);
}
/*   Primary Button   */
.button_primary {
  border: 2px solid #FF2E4C;
}
.button_primary:hover {
  border-color: #FF2E4C;
  transition: .3s ease-out;
}
.button_primary:active {
  border-color: #FF687D;
  transition: .1s linear;
}
.button_primary .name {
  color: #FFFFFF;
}
.button_primary:before {
  width: 100%;
  height: 100%;
  background-color: #FF2E4C;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  transition: transform .6s cubic-bezier(0.8, 0, 0.2, 1) 0s;
  transform: scale(0, 1);
  transform-origin: left top;
}
.button_primary:active:before {
  width: 100%;
  height: 100%;
  background-color: #FF687D;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  transition: .1s linear;
}
/*   Secondary Button   */
.button_secondary {
  border: 2px solid #FFFFFF;
}
.button_secondary:hover {
  border-color: #FF2E4C;
  transition: .3s ease-out;
}
.button_secondary:active {
  border-color: #FF687D;
  transition: .1s linear;
}
.button_secondary .name {
  color: #FFFFFF;
}
.button_secondary:before {
  width: 100%;
  height: 100%;
  background-color: #FF2E4C;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  transition: transform .6s cubic-bezier(0.8, 0, 0.2, 1) 0s;
  transform: scale(0, 1);
  transform-origin: left top;
}
.button_secondary:active:before {
  width: 100%;
  height: 100%;
  background-color: #FF687D;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  transition: .1s linear;
}
/*   Tertiary Button   */
.button_tertiary {
  background-color: #056372;
  border: 2px solid #056372;
}
.button_tertiary:hover {
  border-color: #FF2E4C;
  transition: .3s ease-out;
}
.button_tertiary:active {
  border-color: #FF687D;
  transition: .1s linear;
}
.button_tertiary .name {
  color: #FFFFFF;
}
.button_tertiary:before {
  width: 100%;
  height: 100%;
  background-color: #FF2E4C;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  transition: transform .6s cubic-bezier(0.8, 0, 0.2, 1) 0s;
  transform: scale(0, 1);
  transform-origin: left top;
}
.button_tertiary:active:before {
  width: 100%;
  height: 100%;
  background-color: #FF687D;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  transition: .1s linear;
}
/* ボタン非活性時 */
.button:disabled:before,
.button.disabled:before {
  width: 100%;
  height: 100%;
  background: none;
  content: '';
  transition: none;
  transform: none;
}
.button:disabled .name,
.button.disabled .name {
  color: #A5A5A5;
}
.button:disabled .arrow,
.button:disabled .arrow:before,
.button.disabled .arrow,
.button.disabled .arrow:before {
  background-color: #A5A5A5;
}
.button_primary:disabled,
.button_primary.disabled {
  border-color: #A5283A;
}
.button_secondary:disabled,
.button_secondary.disabled,
.button_tertiary:disabled,
.button_tertiary.disabled {
  border-color: #A5A5A5;
}
.button:disabled .left,
.button.disabled .left {
  right: calc(9.6rem + 2.2rem);
}
.button:disabled .right,
.button.disabled .right {
  left: 2.2rem;
}
/* 丸ボタン */
button.circle {
  position: relative;
  width: 4.8rem;
  height: 4.8rem;
  border: 1px solid #FFFFFF;
  border-radius: 50%;
  background: none;
  transition: .4s ease;
}
/* ボタン内矢印 */
button.circle .arrow_unit {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
} 
button.circle .arrow {
  display: block;
  content: '';
  width: 2.2rem;
  height: 0.2rem;
  margin-left: auto;
  margin-right: auto;
  background-color: #FFFFFF;
  position: relative;
}
button.circle .arrow::before {
  width: 0.28rem;
  height: 1.0rem;
  background-color: #FFFFFF;
  position: absolute;
  content: '';
  bottom: 0;
}
button.circle .left::before {
  left: 0.30rem;
  transform: skew(-45deg);
}
button.circle .right::before {
  right: 0.30rem;
  transform: skew(45deg);
}
button.circle:hover {
  background: rgba(255, 255, 255, 0.2);
}
button.circle:active {
  background: rgba(255, 255, 255, 0.5);
}

/* ハンバーガーメニュー */
.button_menu {
  box-sizing: border-box;
  border-radius: 50%;
  width: 6.4rem;
  height: 6.4rem;
  border: 0.32rem solid #FFFFFF;
  outline: none;
  cursor: pointer;
  position: relative;
  content: '';
}
.button_menu .line,
.button_menu .line::before,
.button_menu .line::after {
  position: absolute;
  height: 0.16rem;
  width: 2.88rem;
  background-color: #FFFFFF;
  display: block;
  content: '';
  cursor: pointer;
  transition: 0.4s; /* あとで(動作確認して問題なければ消し) */
}
.button_menu .line {
  top: 1.9rem;
  left: 1.5rem;
}
.button_menu .line::before {
  top: 0.92rem;
}
.button_menu .line::after {
  top: 1.92rem;
}
.button_menu.open .line {
  transform: translateY(0.92rem) rotate(45deg);
}
.button_menu.open .line::before {
  transform: translateY(-1.92rem) rotate(-45deg);
  opacity: 0;
}
.button_menu.open .line::after {
  transform: translateY(-1.92rem) rotate(-90deg);
}
/* アコーディオン開閉ボタン */
.button_openOrClose {
  box-sizing: border-box;
  width: 2.4rem;
  height: 2.4rem;
  outline: none;
  cursor: pointer;
  position: relative;
  content: '';
}
.button_openOrClose .line,
.button_openOrClose .line::before {
  position: absolute;
  height: 0.4rem;
  width: 2.4rem;
  background-color: #FFFFFF;
  display: block;
  content: '';
  cursor: pointer;
  transition: 0.4s; /* あとで(動作確認して問題なければ消し) */
}
.button_openOrClose .line {
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
.button_openOrClose .line::before {
  top: 50%;
  left: 0;
  transform: translateY(-50%) rotate(-90deg);
  opacity: 0.0;
}
.button_openOrClose.open .line {
  transform: translateY(-50%) rotate(-90deg);
}
.button_openOrClose.open .line::before {
  opacity: 1.0;
}

/* メインメニュー */
#mainmenu {
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.8);
  backdrop-filter: blur(4.8px);
  -webkit-backdrop-filter: blur(4.8px);
  z-index: 100;
  position: fixed;
  left: 100vw;
  transition: .2s ease;
  overflow-y: scroll;
}
#mainmenu.open {
  left: 0;
}
#mainmenu ul {
  width: 78.0%;
  margin-left: auto;
  margin-right: auto;
  padding-top: calc(3.8rem + 5.77rem + 3.8rem); /* ヘッダーの高さ分ずらす */
}
#mainmenu ul li {
  margin-top: 6.0rem;
  margin-bottom: 6.0rem;
}
#mainmenu .menu_item {
  font-size: 3.2rem;
}

/* 各種メニュー内項目(アイテム) */
.menu .menu_item {
  position: relative;
}
.menu .menu_item::after {
  display: block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  content: '';
  background-color: #FF2E4C;
  visibility: hidden;
  opacity: 0;
  transition: .7s ease;
}
.menu .menu_item .name {
  transition: .1s ease;
}
.menu .menu_item:hover .name {
  font-weight: 700;
}
.menu .menu_item:hover::after {
  visibility: visible;
  opacity: 1;
}
/* ホバー時のマーク大きさ指定(メニューごと) */
#mainmenu.menu .menu_item:hover::after {
  width: 3.2rem;
  height: 3.2rem;
  right: calc(-3.2rem - 3.6rem);
}
nav.menu .menu_item:hover::after {
  width: 1.2rem;
  height: 1.2rem;
  right: calc(-1.2rem - 1.8rem);
}
footer .menu .menu_item:hover::after {
  width: 2.4rem;
  height: 2.4rem;
  right: calc(-2.4rem - 1.8rem);
}

/* リンク */
.link {
  display: block;
  width: 22.4rem;
  height: 3.2rem;
  /* overflow: hidden; */
  transition: .2s ease;
  outline: none;
  position: relative;
  background: none;
}
.link .content {
  display: flex;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
  height: 100%;
}
.link .inner_content { /* これを基準にリンク名、リンク内矢印の位置を調整する　*/
  position: relative;
  display: block;
  content: '';
  height: 100%;
}
/* リンク名 */
.link .name {
  font-family: "Jost", sans-serif;
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 1.0;
  white-space: nowrap;
  position: absolute;
  color: #FFFFFF;
  right: 3.4rem;
}
/* リンク内矢印 */
.link .arrow_unit {
  position: absolute;
} 
.link .arrow {
  height: 0.4rem;
  width: 9.6rem;
  background-color: #FFFFFF;
  display: block;
  content: '';
  position: relative;
  transition: .2s ease;
}
.link .arrow:before {
  width: 0.54rem;
  height: 2.2rem;
  background-color: #FFFFFF;
  position: absolute;
  content: '';
  bottom: 0;
}
.link .right:before {
  right: 0.7rem;
  transform: skew(45deg);
}
/* リンク矢印の移動 */
.link .right {
  left: -0.8rem;
  bottom: -2.4rem;
}
.link:hover .right,
.link:active .right {
  left: calc(-0.8rem + 2.0rem);
}

/* リンクtype02 */
.link02 {
  display: block;
  width: 4.0rem;
  height: 4.0rem;
  overflow: hidden;
  outline: none;
  position: relative;
  background: none;
  transition: .2s ease;
}
.link02.open {
  width: 30.2rem;
}
.link02 .content {
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
  transform: none;
  z-index: 3;
  height: 100%;
}
.link02 .inner_content { /* これを基準にリンク名、リンク内矢印の位置を調整する　*/
  position: relative;
  display: block;
  content: '';
  height: 100%;
}
/* リンク装飾 */
.link02 .mark {
  width: 4.0rem;
  height: 4.0rem;
  content: '';
  background-color: #FF2E4C;
  position: absolute;
  right: auto;
  z-index: 10;
  transition: .2s ease;
}
.link02.open .mark { 
}
.link02.open:hover .mark {
  background-color: #FF687D;
}
.link02 .slide_unit {
  height: 100%;
  position: absolute;
  left: -18.0rem;
  transition: .2s ease;
}
.link02.open .slide_unit { /* 広がった時の設定 */
  left: calc(4.0rem + 2.0rem);
}
.link02 .slide_content {
  height: 100%;
  position: relative;
}
/* リンク名 */
.link02 .name {
  font-family: "Jost", sans-serif;
  font-size: 3.0rem;
  font-weight: 700;
  line-height: 1.0;
  white-space: nowrap;
  position: absolute;
  top: 0.6rem; /* top: 0.2rem; */
  color: #FFFFFF;
  text-shadow: 0 0 1.0rem rgba(131, 166, 193, 0.3);
}
/* リンク内矢印 */
.link02 .arrow_unit {
  position: absolute;
  top: 2.3rem;
  left: 11.3rem;
  transition: .2s ease;
}
.link02 .arrow {
  width: 4.2rem; /* width: 9.6rem; */
  height: 0.4rem;
  background-color: #FFFFFF;
  display: block;
  content: '';
  position: relative;
  transition: .2s ease;
}
.link02 .arrow:before {
  width: 0.54rem;
  height: 2.2rem;
  background-color: #FFFFFF;
  position: absolute;
  content: '';
  bottom: 0;
}
.link02 .right:before {
  right: 0.7rem;
  transform: skew(45deg);
}
/* リンク矢印の移動 */
.link02 .right {
  left: 0;
  transition: .2s ease;
}
.link02:hover .right,
.link02:active .right {
  left: 2.0rem;
}

/* バナーリンク */
.link_banner {
  display: block;
  position: relative;
  width: 44.3rem;
  height: 24.0rem;
  color: #FFFFFF;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}
.link_banner_content {
  display: flex;
  position: absolute;
  top: 50%;
  left: 4.0rem;
  transform: translateY(-50%);
  z-index: 3;
}
.link_banner_inner_content {
  position: relative;
}
.link_banner .mark {
  display: block;
  width: 0.8rem;
  height: 9.7rem;
  background-color: #FF2E4C;
  content: '';
  transition: .2s ease;
}
.link_banner .name {
  display: block;
  font-family: "Jost", sans-serif;
  font-weight: 700;
  font-size: 3.8rem;
  padding-left: 2.0rem;
  position: absolute;
  white-space: nowrap;
  top: 50%;
  transform: translateY(-50%);
}
.link_banner:before {
  width: 100%;
  height: 100%;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  transition: .2s ease;
  mix-blend-mode: overlay;
  background-color: rgba(5, 99, 114, 0.0);
}
.link_banner:hover:before {
  background-color: rgba(5, 99, 114, 1.0);
}
.link_banner:active:before {
  background-color: rgba(65, 181, 200, 1.0);
}
.link_banner:hover .mark {
  background-color: #FF2E4C;
}
.link_banner_to_whoWeAre {
  background-image: url('../images/banner_s_whoWeAre.png');
}
.link_banner_to_companyProfile {
  background-image: url('../images/banner_s_companyProfile.png');
}

/* 枠線囲み */
.borderbox {
  border: 1px #FFFFFF solid;
  padding: 1.4rem 2.4rem;
}
.box {
  padding: 1.4rem 2.4rem;
}
.borderbox span,
.box span {
  font-size: 2.8rem;
  line-height: 1.76; /* line-height: 1.6; */
  font-family: "Noto Sans JP", sans-serif;
}

/* ヘッダー */
header {
  display: none;
  position: fixed;
  top: 0;
  width: 100vw;
  z-index: 1000;
}
header .content {
  width: 100%;
  height: 100%;
  position: relative;
  padding-top: 3.8rem;
  padding-bottom: 3.8rem;
}
header .inner_content {
  display: flex;
  content: '';
  width: 78.6vw; /* ヘッダーのコンテンツ幅 */
  margin-left: auto;
  margin-right: auto;
  min-width: 100.0rem;
  max-width: 150.0rem;
}
header .logo_area .logo,
#fixedPart-logo .logo_area .logo {
  width: 5.77rem;
  max-width: 5.77rem;
}
#fixedPart-logo {
  position: fixed;
  top: 3.8rem;
  left: calc((100vw - 78.6vw) / 2); /* コンテンツベースで計算 */
  z-index: 1002;
}
header .button_menu_area {
  margin: auto 0 auto auto;
/*  margin-left: auto; margin-right: 0; */
}
#fixedPart-menu {
  position: fixed;
  top: 3.8rem;
  right: calc((100vw - 78.6vw) / 2); /* コンテンツベースで計算 */
  z-index: 1002;
}
/* ヘッダーブラー */
header .effect_area {
  width: 100%;
  height: 100%;
  position: absolute;
  overflow: hidden;
}
header .blur {
  width: 120%;
  height: 120%;
  top: -10%;
  left: -10%;
  position: absolute;
  -webkit-backdrop-filter: blur(4.8px);
  backdrop-filter: blur(4.8px);
  background: rgba(255, 255, 255, 0.2);
  transition: .8s ease;
  opacity: 0.0;
}

/* フッター */
footer {
  background-color: #000000;
}
footer .content {
  width: 100%;
  height: 100%;
}
footer .inner_content {
  padding-top: 8.0rem;
  padding-bottom: 12.0rem;
  margin-left: calc((100vw - 78.6vw) / 2); /* コンテンツベースで計算 */
}
footer .logo_area {
  width: 32.56rem;
  margin-bottom: 4.0rem;
}
footer .logo_area .logo {
  width: 100%;
  height: auto;
}
footer .menu {
  margin-top: 4.0rem;
  margin-bottom: 4.0rem;
}
footer .menu ul li {
  margin-top: 2.0rem;
  margin-bottom: 2.0  rem;
}
footer .menu .menu_item {
}
footer .menu .menu_item .name {
  font-size: 2.4rem;
}
footer .copyright_area {
}
footer .copyright_area .copyright {
  font-size: 1.92rem;
}

/* ナビゲーションメニュー */
header .menu_area {
  position: relative;
}
nav {
  position: absolute;
  top: 50%;
  left: 4.0rem;
  transform: translateY(-50%);
  width: 60vw;
  transition: .4s ease;
  opacity: 0.0;
}
nav.menu {
  display: none; /* SPでは表示しない */
}
nav.open {
  opacity: 1.0;
}
nav ul {
  display: flex;
  align-items: center;
  /* justify-content: space-between; */
  /* flex-wrap: wrap; */
}
nav ul li {
  width: calc(100% / 6);
  min-width: 12.0rem;
  max-width: 20.0rem;
}
nav ul li.large {
  width: calc(100% / 6 + 4%);
  min-width: 14.0rem;
  max-width: 22.0rem;
}
nav ul li.a_litte_small {
  width: calc(100% / 6 - 2%);
  min-width: 10.0rem;
  max-width: 18.0rem;
}
nav ul li.small {
  width: calc(100% / 6 - 4%);
  min-width: 9.0rem;
  max-width: 16.0rem;
}
nav ul li a {
  font-size: 2.0rem;/* font-size: 1.6rem; */
  line-height: 2.0;
  pointer-events: none;
  text-shadow: 0 0 1.0rem rgba(131, 166, 193, 0.3);
}
nav.open ul li a {
  pointer-events: auto;
}
/* ヘッダー内リンク02 */
header .menu_area .link02 {
  margin-left: auto;
}
header .menu_area .link02 .content {
  padding-top: 0;
  padding-bottom: 0;
}

/* 個人情報保護方針説明 */
.pp_description {
}
.pp_description .pp_agreement {
  display: flex;
  align-items: center;
  margin-bottom: 4.0rem;
  justify-content: left;
  gap: 0 1.6rem;
}
.pp_description .pp_agreement label {
  margin-bottom: 0;
}
.pp_description .pp_scroll {
  width: 100%;
  height: 80rem; /* height: 97.4rem; */
  overflow-y: scroll;
  background-color: #BCC9CA;
  box-sizing: border-box;
  padding: 3.0rem;
  -ms-overflow-style: none; /*スクロールバー非表示（IE・Edge）*/
  scrollbar-width: none;   /*スクロールバー非表示（Firefox）*/
}
.pp_description .pp_scroll::-webkit-scrollbar { /*スクロールバー非表示（Chrome・Safari）*/
  display: none;
}
.pp_description .pp_scroll p {
  color: #000000;
  font-size: 2.4rem;
}
.pp_description .pp_scroll a {
  color: #0F505D;
}

/************** リクルートボタン固定表示 **************/
#fixedPart-recruitButton {
  position: fixed;
  top: 5.0rem; /* top: 82.0vh; */
  right: calc((100vw - 78.6vw + 2.0rem) / 2);
  /* left: calc((100vw - 78.6vw) / 2); /* コンテンツベースで計算 */
  z-index: 1001; /* z-index: 10; */
  opacity: 1.0;
  transition: .4s ease;
}

/************** 背景動画 ***************/
#backgroundPart {
  position: fixed;
  z-index: -10;
  top: 0;
  right:0;
  left:0;
  bottom:0;
  overflow: hidden;
}
video#backgroundVideo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -10;
  width: auto;
  height: 120%;
  min-height: 120%;
  min-width: 120%;
}
video#backgroundVideo::before {
  width: 100%;
  height: 100%;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  transition: .2s ease;
  mix-blend-mode: overlay;
  background-color: rgba(5, 99, 114, 0.0);
}

/************************************************
                TOPページ
*************************************************/
/************** ファーストビュー(FV) ***************/
#fv-part {
  padding-top: 0;
  padding-bottom: 0;
  background-image: url('../images/fv_s.png');
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  height: 100vh;
  min-height: 66.7rem;
}
#fv-part>.inner_content {
  height: 100%;
  position: relative;
}
#fv-part .title_area {
  /* padding-top: 57.0vh; /* padding-top: 16.2vh; */
  position: absolute;
  top: 66%;
  left: 0;
  transform: translateY(-50%);
}
#fv-part .title_area h1 {
  font-size: 9.84rem; /* font-size: 10.2rem; */
  margin-bottom: 4.0rem;
}
#fv-part .title_area h2 {
  font-size: 3.8rem;
}
/************** Who we are ***************/
#whoWeAre-part {
  position: relative;
}
#whoWeAre-part>.content {
  width: 100%;
}
#whoWeAre-part>.content>.inner_content {
  width: 100%;
}
#whoWeAre-part::before {
  content: '';
  display: block;
  width: 70%;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  mix-blend-mode: overlay;
  backdrop-filter: blur(2.4px);
  -webkit-backdrop-filter: blur(2.4px);
  background: rgba(0, 0, 0, 0.8);
}
#whoWeAre-part .banner_area {
  padding-top: 8.0rem;
}
#whoWeAre-part .banner_area .link_banner_to_whoWeAre {
  margin-left: 0;
  margin-right: auto;
}
#whoWeAre-part .banner_area .link_banner_to_companyProfile {
  margin-left: auto;
  margin-right: 0;
}

/************** Service ***************/
#service-part {
  background-image: url('../images/bg_s_building_view.png');
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}
#service-part .button_area {
  padding-top: 8.0rem;
}

/************** Recruit ***************/
#recruit-part {
  position: relative;
}
#backgroundMessage {
  display: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 9.6%;
  white-space: nowrap;
  font-size: 20.0rem;
  font-weight: 200;
  color: rgba(255, 255, 255, 0.05);
}
#recruit-part::before {
  content: '';
  display: block;
  width: 70.0%;
  height: 72.0%;
  position: absolute;
  top: 0;
  left: 0;
  mix-blend-mode: overlay;
  backdrop-filter: blur(2.4px);
  -webkit-backdrop-filter: blur(2.4px);
  background: rgba(0, 0, 0, 0.8);
}
#recruit-part .button_area {
  padding-top: 8.0rem;
  padding-bottom: 8.0rem;
}
#recruit-part .image_area {
  display: flex;
}
#recruit-part .image_area .image_unit {
  width: 50%;
}
#recruit-part .image_area .image_unit img {
  width: 100%;
}
#recruit-part .image_area div:nth-of-type(2) img {
  margin-top: 5.7rem;
}

/************** News ***************/
#news-part {
  position: relative;
  padding-top: 0;
}
#news-part::before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  mix-blend-mode: overlay;
  backdrop-filter: blur(2.4px);
  -webkit-backdrop-filter: blur(2.4px);
  background: rgba(0, 0, 0, 0.8);
}
#news-part .title_area {
  position: absolute;
  top: -4.8rem;
}
#news-part .title_area h1 {
  line-height: 1.0;
}
#news-part .thumbnail_area {
  width: 100%;
  overflow: hidden;
}
#news-part .thumbnail_area img {
  display: block;
  width: 100%;
  height: auto; /* 31.0rem; */
  object-fit: cover;
}
#news-part .unit_area {
  padding-top: 15.0rem;
}
#news-part .unit_area .unit {
  display: block;
  padding-bottom: 6.0rem;
}
#news-part .unit_area>*:nth-child(n+4) { /* ニュース4つ目以降は非表示 */
  display: none;
}
#news-part .unit_area .supplementary_info {
  color: #999999;
  font-size: 2.4rem;
  font-family: "Noto Sans JP", sans-serif;
  padding-top: 2.0rem;
  padding-bottom: 2.0rem;
  white-space: nowrap;
}
#news-part .unit_area .supplementary_info span:nth-of-type(1) {
  padding-right: 1.6rem;
}
#news-part .link_area {
  position: relative;
  padding-top: 2.0rem;
}
#news-part .link_area .link {
  position: absolute;
  right: -2.0rem;
}

/************** Contact ***************/
#contact-part {
  padding-top: 0;
  padding-bottom: 0;
  position: relative;
  overflow: hidden;
}
#contact-part::before {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  content: '';
  background-image: url('../images/bg_s_office_view.png');
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  transition: transform 1.2s ease;
}
#contact-part.hover::before {
  transform: scale(1.1);
}
#contact-part .inner_content {
  padding-top: 26.0rem;
  padding-bottom: 22.0rem;
}
#contact-part .title_area h1 {
  text-align: center;
}
#contact-part .text_area p {
  text-align: center;
}
#contact-part .button_area {
  padding-top: 8.0rem;
}
#contact-part .button_area button {
  margin-left: auto;
  margin-right: auto;
}
/************** H.R.I Inc.ロゴ初期表示 ***************/
/* 開いた時 */
.start {
  background: #000;
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 9000;
}
.start .mv_block {
  display: flex;
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: none;
  z-index: 9999;
  width: 280px;
  text-align: center;
}
/* 2秒表示 */
.start .mv_block .logos{
  opacity: 0;
  -webkit-transform: translate(112px,0);
  transform: translate(112px, 0)
}
.start .mv_block img{
  width: 100%;
}
.start .mv_block .simple_logo{
  opacity: 0;
  -webkit-transform: translate(112px,0);
  transform: translate(112px,0);
}
.start .mv_block .main_logo{
  -webkit-transform: translate(112px,0);
  transform: translate(112px,0);
  margin-left: 14px;
}
.start .mv_block .simple_logo.st{
  opacity: 1;
  -webkit-transition: opacity .2s ease 0s;
  transition: opacity .2s ease 0s;
}
.start .mv_block .simple_logo.nd{
  opacity: 1;
  -webkit-transform: translate(0,0);
  transform: translate(0,0);
  -webkit-transition: -webkit-transform 1s cubic-bezier(.77,0,.175,1) 0s;
  transition: -webkit-transform 1s cubic-bezier(.77,0,.175,1) 0s;
  transition: transform 1s cubic-bezier(.77,0,.175,1) 0s;
  transition: transform 1s cubic-bezier(.77,0,.175,1) 0s,-webkit-transform 1s cubic-bezier(.77,0,.175,1) 0s;
}
.start .mv_block .main_logo.nd{
  -webkit-transform: translate(0,0);
  transform: translate(0,0);
  opacity: 1;
  -webkit-transition: opacity 1s cubic-bezier(.77,0,.175,1) 0s,-webkit-transform 1s cubic-bezier(.77,0,.175,1) 0s;
  transition: opacity 1s cubic-bezier(.77,0,.175,1) 0s,-webkit-transform 1s cubic-bezier(.77,0,.175,1) 0s;
  transition: transform 1s cubic-bezier(.77,0,.175,1) 0s,opacity 1s cubic-bezier(.77,0,.175,1) 0s;
  transition: transform 1s cubic-bezier(.77,0,.175,1) 0s,opacity 1s cubic-bezier(.77,0,.175,1) 0s,-webkit-transform 1s cubic-bezier(.77,0,.175,1) 0s;
}
/************************************************
                下層ページ共通
*************************************************/
/************** ヘッダー画像 ***************/
#headerImage {
  width: 100%;
  height: 34.0rem;
  background-image: url('../images/hd_s_pp.png'); /* 初期設定画像 */
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  position: relative;
}
#headerImage .inner_content {
  width: 78.6vw; /* コンテンツベースで計算 */
  margin-left: auto;
  margin-right: auto;
  min-width: 37.5rem;
  /* padding-left: calc((100vw - 78.6vw) / 2); /* コンテンツベースで計算 */
  /* padding-right: calc((100vw - 78.6vw) / 2); /* コンテンツベースで計算 */
}
#headerImage #mainTitle{
  position: absolute;
  bottom: -4.8rem;
}
/************** パート ***************/
.content.contentPage .part {
  padding-top: 14.8rem;
  padding-bottom: 24.0rem;
}
.content.contentPage .part .unit_area .unit {
  padding-bottom: 14.8rem;
}
.content.contentPage .part .unit_area>div:last-of-type {
  padding-bottom: 0;
}
.content.contentPage .part .unit_area .unit h1 {
  font-size: 2.8rem;
  padding-bottom: 2.8rem;
}
.content.contentPage .part .unit_area .unit h2 {
  font-size: 2.8rem;
  font-weight: 400;
  padding-bottom: 1.0rem;
}
.content.contentPage>.container .scrollContent {
  width: 100%;
}

/************** 地図 ***************/
#map-part {
  padding-top: 0;
  padding-bottom: 0;
}
iframe {
  vertical-align: bottom;
}
#map-part.map_gray iframe {
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  filter: grayscale(100%);
}

/************** ボタンエリア ***************/
.content.contentPage .button_area {
  padding-top: 8.0rem;
  display: flex;
  flex-direction: column;
}
.content.contentPage .button_area button:nth-of-type(2) {
  margin-top: 6.0rem;
}

/************** Contactエリア ***************/
.contentPage #contact-part {
  overflow: hidden;
}
.contentPage #contact-part::before {
  background-image: url('../images/bg_s_desk_view.png');
}

/************************************************
                Companyページ
*************************************************/
.contentPage.page_company #headerImage {
  background-image: url('../images/hd_s_company.png');
}
#part-companyProfile {
  padding-bottom: 12.8rem;
}
.contentPage.page_company .certifications {
  display: flex;
  gap: 2.0rem;
  flex-wrap: wrap;
}
.contentPage.page_company .certification {
  display: flex;
  flex-flow: column;
  width: fit-content
}
.contentPage.page_company .certification img {
  width: 10.0rem;
  margin-left: auto;
  margin-right: auto;
}
.contentPage.page_company .certification span {
  padding-top: 2.0rem;
  font-size: 2.4rem;
  white-space: nowrap;
}

/************************************************
                Newsページ
*************************************************/
.contentPage.page_news #headerImage {
  background-image: url('../images/hd_s_news.png');
}
.contentPage.page_news #news-part {
  padding-top: 14.8rem;
}
.contentPage.page_news #news-part::before {
  display: none;
}
.contentPage.page_news #news-part .unit_area {
  overflow-x: visible;
  padding-top: 0;
}
.contentPage.page_news #news-part .unit_area.pickup {
  padding-top: 8.0rem;
  padding-bottom: 8.0rem;
}
.contentPage.page_news #news-part .unit_area .unit {
  padding-top: 1.2rem;
  padding-bottom: 4.0rem;
  border-top: 1px solid #FFFFFF;
}
.contentPage.page_news #news-part .unit_area.pickup .unit {
  border: none;
  padding-top: 4.0rem;
  padding-bottom: 4.0rem;
}
.contentPage.page_news #news-part .unit_area>a:first-of-type {
  border-top: none;
}
.contentPage.page_news #news-part .unit_area>a:last-of-type {
  border-bottom: 1px solid #FFFFFF;
}
.contentPage.page_news #news-part .unit_area.pickup>a:last-of-type {
  border: none;
}
.contentPage.page_news #news-part .unit_area>*:nth-child(n+4) {
  display: block;
}
.contentPage.page_news #news-part .unit_area h2,
.contentPage.page_news #news-part .unit_area h3 {
  font-family: "Noto Sans JP", sans-serif;
}
.contentPage.page_news #news-part .unit_area h3 {
  font-size: 2.8rem;
}
.contentPage.page_news #news-part .unit_area.pickup h3 {
  font-size: 3.2rem;
}
.contentPage.page_news #news-part .unit_area .supplementary_info {
  font-weight: 700;
}
.contentPage.page_news #news-part .unit_area .supplementary_info .date {
  color: #FFFFFF;
}

/************************************************
                News詳細ページ
*************************************************/
.contentPage.page_news.detail #news-part article .title {
  padding-bottom: 2.0rem;
}
.contentPage.page_news.detail #news-part article .title h1 {
  font-size: 4.0rem;
}
.contentPage.page_news.detail #news-part article .supplementary_info {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 2.8rem;
  padding-bottom: 6.0rem;
}
.contentPage.page_news.detail #news-part article .supplementary_info>span:nth-child(1) {
  padding-right: 3.0rem;
}
.contentPage.page_news.detail #news-part article .supplementary_info .category {
  color: #999999;
}
.contentPage.page_news.detail #news-part article .thumbnail_area {
  padding-bottom: 8.0rem;
}

/************************************************
                Privacy Policyページ
*************************************************/
.contentPage.page_privacypolicy #headerImage {
  background-image: url('../images/hd_s_pp.png');
}

/************************************************
                Compliance Guidelineページ
*************************************************/
.contentPage.page_compliance #headerImage {
  background-image: url('../images/hd_s_compliance.png');
}

/************************************************
                Contactページ
*************************************************/
.contentPage.page_contact #headerImage {
  background-image: url('../images/hd_s_contact.png');
}
.contentPage.page_contact h2.sub {
  margin-bottom: 8.0rem;
}

/************************************************
                Who We Areページ
*************************************************/
.content.page_whoWeAre #headerImage {
  background-image: url('../images/hd_s_whoWeAre.png');
}
.content.page_whoWeAre>.part {
  padding-top: 18.6rem;
  padding-bottom: 0;
}
.content.page_whoWeAre .scrollContent .part {
  padding-top: 0;
}
.content.page_whoWeAre .scrollContent .title_area {
  padding-bottom: 8.0rem;
}
.content.page_whoWeAre .scrollContent .unit_area>div:nth-of-type(1),
.content.page_whoWeAre .scrollContent .unit_area>div:nth-of-type(2) {
  padding-bottom: 6.0rem;
}
.content.page_whoWeAre .scrollContent .unit_area>div:nth-of-type(n+2) {
  padding-top: 6.0rem;
}
.content.page_whoWeAre .scrollContent .unit {
  padding-bottom: 3.0rem;
  border-bottom: 1px solid #FFFFFF;
}
.content.page_whoWeAre .scrollContent .unit_area>div:last-child {
  border-bottom: none;
}
.content.page_whoWeAre .scrollContent h2 {
  font-size: 7.2rem;
  margin-bottom: 0;
}
.content.page_whoWeAre .scrollContent h3 {
  font-size: 3.6rem;
}
.content.page_whoWeAre .scrollContent h3.sub {
  font-size: 3.4rem;
}
.content.page_whoWeAre .scrollContent h4 {
  color: rgba(255, 255, 255, 0.5); /* color: #8A9598; */
  font-size: 4.0rem;
  padding-bottom: 2.0rem;
}
.content.page_whoWeAre .scrollContent .unit_area>div:last-child .title_area h3 {
  padding-bottom: 4.0rem;
}
.content.page_whoWeAre .scrollContent .unit_area>div:last-child .title_area h3:last-child {
  padding-bottom: 0;
}
.content.page_whoWeAre .scrollContent .unit .title_area {
  padding-bottom: 4.0rem;
}
.content.page_whoWeAre #part-philosophy .unit_area>div:last-child .title_area {
  padding-bottom: 0;
}
.content.page_whoWeAre #part-message {
  padding-top: 24.0rem;
  position: relative;
}
.content.page_whoWeAre #part-message::after {
  content: '';
  display: block;
  width: 100vw;
  height: 100%;
  position: absolute;
  top: 0;
  left: calc((-100vw + 78.6vw)/2); /* コンテンツ幅 */;
  overflow: hidden;
  mix-blend-mode: overlay;
  backdrop-filter: blur(2.4px);
  -webkit-backdrop-filter: blur(2.4px);
  background: rgba(0, 0, 0, 0.6);
  z-index: -1;
}
.content.page_whoWeAre #part-message .title_area {
  padding-bottom: 8.0rem;
}
.content.page_whoWeAre .image_area,
.content.page_whoWeAre .image_area img {
  width: 100%;
}
.content.page_whoWeAre .image_area {
  padding-bottom: 8.0rem;
}
/************************************************
                Serviceページ
*************************************************/
body>.content.page_service div.part>.inner_content {
  margin-left: 0;
  margin-right: 0;
  width: 100vw; /* コンテンツ幅 */
  min-width: none;
}
.content.page_service #business-01,
.content.page_service #business-03,
.content.page_service #contact-part .inner_content {
  width: 78.6vw; /* コンテンツ幅 */
  margin-left: auto;
  margin-right: auto;
}
.content.page_service #headerImage {
  background-image: url('../images/hd_s_service.png');
}
.content.page_service #headerImage .inner_content {

}
.content.page_service>.part {
  padding-top: 18.6rem;
}
.content.page_service .title_area {
  margin-bottom: 6.0rem;
}
.content.page_service .title_area h2 {
  font-size: 3.6rem;
  font-family: "Noto Sans JP", sans-serif;
  line-height: 1.2;
  margin-bottom: 2.4rem;
}
.content.page_service .title_area h2.sub {
  font-size: 4.0rem;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.5); /* color: #8A9598; */
  margin-bottom: 0;
  font-family: "Jost", sans-serif;
}
.content.page_service .text_area {
  margin-bottom: 6.0rem;
}
.content.page_service .diagram_area {
  width: 100%;
  position: relative;
  box-sizing: border-box;
  padding: 4.0rem;
}
.content.page_service .diagram_area figure {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 2.4rem;
}
.content.page_service .diagram_area figure img {
  width: 100%;
}
.content.page_service .diagram_area::before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  mix-blend-mode: overlay;
  backdrop-filter: blur(2.0px);
  -webkit-backdrop-filter: blur(2.0px);
  background: rgba(0, 0, 0, 0.4);
  z-index: -1;
}
.content.page_service .accordion_area>div:last-child {
  border-bottom: none;
}
.content.page_service .accordion {
  border-bottom: 1px solid #C8C8C8;
  padding-top: 6.0rem;
  padding-bottom: 6.0rem;
}
.content.page_service .accordion .openOrClose {
  display: flex;
  justify-content: space-between;
}
.content.page_service .accordion h3 {
  font-size: 3.6rem;
}
.content.page_service .accordion .button_openOrClose {
  margin-top: auto;
  margin-bottom: auto;
}
.content.page_service .accordion .explanation {
  font-size: 2.8rem;
  margin-top: 3.0rem;
  display: none;
}
.content.page_service .accordion .explanation.open {
  display: block;
}
.content.page_service #business-01 {
  padding-bottom: 24.0rem;
}
.content.page_service #business-02 {
  position: relative;
  padding-top: 16.0rem;
  padding-bottom: 16.0rem;
}
.content.page_service #business-02 .inner_content {
  display: flex;
  margin-left: calc((100vw - 78.6vw)/2); /* コンテンツ幅 */
}
.content.page_service #business-02 .button_area {
  display: none;
}
.content.page_service #business-02::after {
  content: '';
  display: block;
  width: 100vw;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  mix-blend-mode: overlay;
  backdrop-filter: blur(2.4px);
  -webkit-backdrop-filter: blur(2.4px);
  background: rgba(0, 0, 0, 0.6);
  z-index: -2;
}
.content.page_service #business-02 .unit_area {
  display: flex;
  width: 100%;
  overflow-x: scroll;
  -ms-overflow-style: none; /*スクロールバー非表示（IE・Edge）*/
  scrollbar-width: none;   /*スクロールバー非表示（Firefox）*/
  gap: 0 4.0rem;
}
.content.page_service #business-02 .unit_area::-webkit-scrollbar { /*スクロールバー非表示（Chrome・Safari）*/
  display: none;
}
.content.page_service #business-02 .unit_area .unit {
  flex-shrink: 0;
  width: 58.4%;
  position: relative;
  box-sizing: border-box;
  padding: 4.0rem;
}
.content.page_service #business-02 .unit_area>div:first-child {
  margin-left: calc((100vw - 78.6vw)/2); /* コンテンツ幅 */
}
.content.page_service #business-02 .unit_area>div:last-child {
  margin-right: calc((100vw - 78.6vw)/2); /* コンテンツ幅 */ /* あとで */
}
.content.page_service #business-02 .unit_area .unit::before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  mix-blend-mode: overlay;
  backdrop-filter: blur(4.0px);
  -webkit-backdrop-filter: blur(4.0px);
  background: rgba(255, 255, 255, 1.0);
  border-radius: 2.0rem;
  z-index: -1;
}
.content.page_service #business-02 .unit_area .unit h3 {
  font-size: 3.2rem;
  margin-bottom: 2.1rem;
}
.content.page_service #business-02 .unit_area .unit h4 {
  font-size: 2.4rem;
  color: rgba(255, 255, 255, 0.8);
  margin-bottom: 1.2rem;
}
.content.page_service #business-02 .unit_area .unit p {
  font-size: 2.4rem;
}
.content.page_service #business-03 {
  padding-top: 24.0rem;
}
.content.page_service #business-03 .unit_area .unit {
  padding-top: 8.0rem;
  padding-bottom: 8.0rem;
}
.content.page_service #business-03 .unit_area>div:first-child {
  border-bottom: 2px solid #C8C8C8;
}
.content.page_service #business-03 .unit_area .unit .image_area {
  width: 100%;
  margin-bottom: 4.0rem;
}
.content.page_service #business-03 .unit_area .unit .image_area img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.content.page_service #business-03 .unit_area .unit .image_area img.dawn {
  width: 100%;
}
.content.page_service #business-03 .unit_area .unit .image_area img.join {
  width: 70.0%/* width: 75.0%; */
}
.content.page_service #business-03 .unit_area .unit .title_area {
  margin-bottom: 2.6rem;
}
.content.page_service #business-03 .unit_area .unit .text_area {
  margin-bottom: 4.0rem;
}
.content.page_service #business-03 .unit_area .unit h3 {
  font-size: 3.6rem;
  font-family: "Noto Sans JP", sans-serif;
}
.content.page_service #business-03 .unit_area .unit h3.sub {
  font-size: 2.8rem;
  margin-bottom: 0.8rem
}
.content.page_service #business-03 .unit_area .unit p {
}
.content.page_service #business-03 .unit_area .unit .link {
  height: 2.8rem;
  width: 33.2rem;
  margin-left: auto;
}
.content.page_service #business-03 .unit_area .unit .link .content {
  left: 72.6%;
  transform: translateY(-50%);
}
.content.page_service #business-03 .unit_area .unit .link .name {
  font-size: 2.6rem;
}
.content.page_service #business-03 .unit_area .unit .link .right {
  bottom: -1.8rem;
}

/*==================================================
一般的な Android の Portrait 横幅 360px
==================================================*/
@media screen and (min-width:360px) {

}


/*==================================================
iPhone 8,7,6 の Portrait 横幅 375px
==================================================*/
@media screen and (min-width:375px) {

}


/*==================================================
iPhone X の Portrait 横幅 375px 高さ 812px
==================================================*/
@media screen and (width:375px) and (height:812px) {

}


/*==================================================
iPhone 8plus,7plus,6plus の Portrait 横幅 414px
==================================================*/
@media screen and (min-width:414px) {

}


/*==================================================
iPhone SE の Landscape 横幅 568px
==================================================*/
@media screen and (min-width:568px) {

}


/* 特殊ブレイクポイント：595px以上 */
@media screen and (min-width:595px) {

}


/*==================================================
一般的な Android の Landscape 横幅 640px
==================================================*/
@media screen and (min-width:640px) {

}


/*==================================================
iPhone 8,7,6 の Landscape 横幅 667px
==================================================*/
@media screen and (min-width:667px) {


}
/*==================================================
iPhone 8plus,7plus,6plus の Landscape 横幅 736px
==================================================*/
@media screen and (min-width:736px) {

}


/*==================================================
iPad の Portrait 横幅 768px
==================================================*/
@media screen and (min-width:768px) {

}

/*==================================================
iPhone X の Landscape 横幅 812px 高さ 375px
==================================================*/
@media screen and (width:812px) and (height:375px) {

}


/*==================================================
iPad Pro 10.5インチ の Portrait 横幅 834px
==================================================*/
@media screen and (min-width:834px) {
/* ルート設定 */
html {
  font-size: 0.76vw;
}
.link_banner {
  width: 62.02rem;
  height: 33.6rem;
}
/************** ファーストビュー(FV) ***************/
#fv-part {
  background-image: url('../images/fv_l.png');
  height: 72.0rem;
}
#fv-part>.inner_content {
  position: relative;
}
#fv-part .title_area {
  padding-top: 0;
  position: absolute;
  top: 60%;
  transform: translateY(-50%);
}
/* 個人情報保護方針説明 */
.pp_description .pp_scroll {
  height: 58.6rem; /* height: 76.0rem; */
}

}

/*==================================================
iPad の Landscape 横幅 1024px
==================================================*/
/* ※※※※※ PC版兼用の想定 ※※※※※ */
@media screen and (min-width:1024px) {
/* ルート設定 */
html {
  font-size: 10px;
}
html, body {
  overflow-x: visible;
}

/* 文章・段落 */
p {
  font-size: 1.6rem;
  line-height: 2.0;
}
/* テーブル */
th, td {
  font-size: 1.8rem;
  line-height: 1.6;
}
th {
  padding-right: 7.2rem;
}
/* 見出し */
h1 {
  font-size: 7.0rem;
  line-height: 1.2;
}
div.part .title_area h1 {
  font-size: 6.0rem;
  margin-bottom: 8.0rem;
}
h2 {
  font-size: 3.2rem;
}
h2.sub {
  font-size: 2.0rem;
}
div.part .title_area h2 {
  font-size: 2.2rem;
  margin-bottom: 4.0rem;
}
h3 {
  font-size: 2.56rem;
}
h4, h5, h6 {
  font-size: 2.56rem;
}

/* 引用 */
blockquote {
  font-size: 1.6rem;
}

/* 箇条書き */
ol {
  padding-left: 1.8rem;
}
ol li {
  font-size: 1.6rem;
  padding-left: 0.4em;
  padding-bottom: 1.0em;
}
ol li:last-child {
  padding-bottom: 0;
}
ul.bulletpoint {
  padding-left: 1.8rem;
}
ul.bulletpoint.indent {
  padding-left: 6.0rem; /* あとで */
}
ul.bulletpoint li {
  font-size: 1.6rem;
}
ul.bulletpoint li.reference_mark {
  padding-left: 0.4rem; /* あとで */
}

/* フォーム */
input[type="text"],
input[type="email"],
input[type="password"],
textarea {
  font-size: 1.6rem;
  padding: 2.0rem 1.6rem;
}
textarea {
  height: 44.0rem;
}
input[type="checkbox"] {
  width: 2.4rem;
  height: 2.4rem;
}
input[type="checkbox"]:checked:before,
input[type="checkbox"]:checked:after {
  height: 0.24rem;
  border-radius: 0.4rem;
}
input[type="checkbox"]:checked:before {
  width: 1.2rem;
}
input[type="checkbox"]:checked:after {
  width: 1.8rem;
}

label {
  font-size: 1.6rem;
}
form label {
  margin-bottom: 0.8rem;
}
form label.bold {
  font-weight: 700;
}
form input[type="text"],
form input[type="email"],
form input[type="password"],
form textarea {
  margin-bottom: 3.0rem;
}

/* WP入力フォーム */
/*
.mw_wp_form.mw_wp_form_input {
}
*/
.mw_wp_form .error {
  font-size: 1.4rem !important;
}
/* WP確認フォーム内の個人情報保護方針説明・チェックボックス */
.mw_wp_form .pp_description .pp_description_tit {
  margin-bottom: 0.8rem;
}
.mw_wp_form .mwform-checkbox-field label {
  margin-bottom: 2.0rem;
}
/* WP確認フォーム */
/*
.mw_wp_form.mw_wp_form_confirm
/*, form.mw_wp_form.mw_wp_form_preview *//* {
}*/
.mw_wp_form.mw_wp_form_confirm .form_inner>div {
  display: flex;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  padding-top: 3.0rem;
  padding-bottom: 3.0rem;
}
.mw_wp_form.mw_wp_form_confirm .form_inner>div:last-child {
  border-bottom: none;
}
.mw_wp_form.mw_wp_form_confirm .form_tit {
  display: block;
  width: 30%;
  margin-bottom: 0;
}
.mw_wp_form.mw_wp_form_confirm label {
  margin-bottom: 0;
}
.mw_wp_form.mw_wp_form_confirm dd {
  display: block;
  width: 70%;
  border-bottom: none;
  font-size: 1.6rem;
  padding-bottom: 0;
  margin-bottom: 0;
}

/* 検索フォーム */
form.search {
  padding-bottom: 1.2rem;
}
form.search button {
  display: none;
}
form.search input[type="text"] {
  font-size: 2.0rem;
  padding-block: 0.2rem;
}
.icon_search {
  height: 2.4rem;
  margin-right: 1.22rem;
}

/* ページ内容 partの共通設定 */
body>.content div.part {
  padding-top: 24.0rem;
  padding-bottom: 24.0rem;
}
body>.content div.part>.inner_content {
  margin-left: auto;
  margin-right: auto;
  width: 78.6vw; /* コンテンツ幅 */
  min-width: 37.5rem; /* あとで */
  max-width: 150.0rem; /* あとで */
}

/* SP・PC表示/非表示設定 */
.sp_none {
  display: block;
}
.pc_none {
  display: none;
}

/* ページネーション */
.pagination {
  padding-top: 5.1rem;
}
.pagination ul.page-numbers {
  gap: 0 2.0rem;
}
.pagination ul.page-numbers li>* {
  width: 4.8rem;
  height: 4.8rem;
  line-height: 4.8rem;
  font-size: 1.6rem;
}

/* ボタン */
/*   ボタン共通設定   */
.button {
  width: 18.8rem;
  height: 5.4rem;
}
.button_inner_content {
  height: 1.6rem;
}
/* ボタン名 */
.button .name {
  font-size: 1.6rem;
}
.button .name_leftSide {
  right: 0.6rem;
}
.button .name_rightSide {
  left: 0.3rem;
}
/* ボタン内矢印 */
.button .arrow {
  height: 0.2rem;
  width: 4.8rem;
}
.button .arrow:before {
  width: 0.24rem;
  height: 0.8rem;
}
.button .left:before {
  left: 0.24rem;
}
.button .right:before {
  right: 0.24rem;
}
/* ボタン矢印の位置と移動 */
.button .left {
  right: calc(4.8rem + 1.2rem);
  bottom: -1.2rem;
}
.button:hover .left,
.button:active .left {
  right: calc(4.8rem + 1.2rem + 1.0rem);
}
.button .right {
  left: 0.5rem;
  bottom: -1.2rem;
}
.button:hover .right,
.button:active .right {
  left: calc(0.5rem  + 1.0rem);
}
/* ボタン非活性時 */
.button:disabled .left,
.button.disabled .left {
  right: calc(4.8rem + 1.1rem);
}
.button:disabled .right,
.button.disabled .right {
  left: 1.1rem;
}

/* ハンバーガーメニュー */
.button_menu {
  width: 4.0rem;
  height: 4.0rem;
}
.button_menu .line,
.button_menu .line::before,
.button_menu .line::after {
  height: 0.16rem;
  width: 1.8rem;
}
.button_menu .line {
  top: 1.1rem;
  left: 0.8rem;
}
.button_menu .line::before {
  top: 0.6rem;
}
.button_menu .line::after {
  top: 1.2rem;
}
.button_menu.open .line {
  transform: translateY(0.6rem) rotate(45deg);
}
.button_menu.open .line::before {
  transform: translateY(-1.2rem) rotate(-45deg);
  opacity: 0;
}
.button_menu.open .line::after {
  transform: translateY(-1.2rem) rotate(-90deg);
}

/* 各種メニュー内項目(アイテム) */
/* ホバー時のマーク大きさ指定(メニューごと) */
#mainmenu.menu .menu_item:hover::after { /* あとで */
  width: 2.0rem;
  height: 2.0rem;
  right: calc(-2.0rem - 2.4rem);
}
nav.menu .menu_item:hover::after {
  width: 1.2rem;
  height: 1.2rem;
  right: calc(-1.2rem - 1.0rem); /* right: calc(-1.2rem - 1.8rem); */
}
footer .menu .menu_item:hover::after{
  width: 1.2rem;
  height: 1.2rem;
  right: calc(-1.2rem - 1.8rem);
}

/* リンク */
.link {
  width: 13.0rem;
  height: 1.8rem;
}
/* リンク名 */
.link .name {
  font-size: 1.8rem;
  right: 0.5rem;
}
/* リンク内矢印 */
.link .arrow_unit {
  position: absolute;
} 
.link .arrow {
  height: 0.2rem;
  width: 4.8rem;
}
.link .arrow:before {
  width: 0.27rem;
  height: 1.1rem;
}
.link .right:before {
  right: 0.32rem;
}
/* リンク矢印の移動 */
.link .right {
  left: 0.5rem;
  bottom: -1.3rem;
}
.link:hover .right,
.link:active .right {
  left: calc(0.5rem + 1.0rem);
}
/* リンクtype02 */
.link02 {
  width: 2.4rem;
  height: 2.4rem;
}
.link02.open {
  width: 12.2rem; /* width: 13.4rem; */
}
/* リンク装飾 */
.link02 .mark {
  width: 2.4rem;
  height: 2.4rem;
}
.link02 .slide_unit {
  left: -8.0rem;
}
.link02.open .slide_unit { /* 広がった時の設定 */
  left: calc(2.4rem + 1.0rem);
}
/* リンク名 */
.link02 .name {
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.0;
  top: 0.5rem; /* top: 0.4rem; */
}
/* リンク内矢印 */
.link02 .arrow_unit {
  top: 1.44rem;
  left: 4.8rem;
}
.link02 .arrow {
  width: 2.2rem; /* width: 3.2rem; */
  height: 0.2rem; /* height: 0.1rem; */
}
.link02 .arrow:before {
  width: 0.28rem; /* width: 0.14rem; */
  height: 1.16rem; /* height: 0.9rem; */
}
.link02 .right:before {
  right: 0.34rem;
}
/* リンク矢印の移動 */
.link02 .right {
  left: 0.5rem; /* left: 0; */
}
.link02:hover .right,
.link02:active .right {
  left: calc(0.5rem + 1.0rem); /* left: 1.0rem; */
}

/* バナーリンク */
.link_banner {
  width: 44.3rem;
  height: 24.0rem;
  color: #FFFFFF;
}
.link_banner_content {
  top: 2.2rem;
  left: 2.2rem;
  transform: none;
}
.link_banner .mark {
  width: 0.6rem;
  height: 6.2rem;
}
.link_banner .name {
  font-weight: 700;
  font-size: 2.4rem;
  padding-left: 1.8rem;
}
.link_banner_to_whoWeAre {
  margin-top: 8.5rem;
  background-image: url('../images/banner_l_whoWeAre.png');
}
.link_banner_to_companyProfile {
  background-image: url('../images/banner_l_companyProfile.png');
}

/* インジケーター */
.indicator ul {
  display: flex;
  flex-direction: column;
  gap: 4.0rem 0;
}
.indicator .scale {
  display: flex;
}
.indicator .scale::before {
  display: block;
  content: '';
  width: 2.4rem;
  height: 2.4rem;
  box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 1.0);
  background: none;
  margin-right: 1.2rem;
}
.indicator .scale.done::before {
  box-shadow: none;
  background-color: rgba(255, 46, 76, 0.4);
}
.indicator .scale.doing::before {
  box-shadow: none;
  background-color: rgba(255, 46, 76, 1.0);
}
.indicator .scale .title,
.indicator .scale.doing .title {
  display: block;
  width: fit-content;
  color:rgba(255, 255, 255, 1.0);
}
.indicator .scale.done .title {
  color:rgba(255, 255, 255, 0.4);
}
/* スクロールインジケーター */
.scrollIndicator ul {
  display: flex;
  flex-direction: column;
  gap: 4.0rem 0;
}
.scrollIndicator .scale {
  display: flex;
}
.scrollIndicator .scale::before {
  display: block;
  content: '';
  width: 2.4rem;
  height: 2.4rem;
  /*
  box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 1.0);
  background: none;
  */
  background-color: rgba(255, 46, 76, 0.4);
  margin-right: 1.2rem;
  flex-shrink: 0; /* つぶれないように */
  transition: .3s ease;
}
.scrollIndicator .scale.reached::before {
  box-shadow: none;
  background-color: rgba(255, 46, 76, 1.0);
}
.scrollIndicator .scale .title {
  display: block;
  width: fit-content;
  position: relative;
  color:rgba(255, 255, 255, 0.4);
  transition: .3s ease;
}
.scrollIndicator .scale.reached .title {
  color:rgba(255, 255, 255, 1.0);
}

/* 枠線囲み */
.borderbox {
  padding: 0.7rem 1.2rem;
}
.box {
  padding: 0.7rem 1.2rem;
}
.borderbox span,
.box span {
  font-size: 1.6rem;
  line-height: 1.6;
}

/* ヘッダー */
header {
  display: block;
}
header .content {
  padding-top: 4.0rem;
  padding-right: 0;
  padding-bottom: 4.0rem;
  padding-left: 0;
}
header .logo_area .logo,
#fixedPart-logo .logo_area .logo {
  width: 20.36rem;
  max-width: 20.36rem;
}
#fixedPart-logo,
#fixedPart-menu {
  display: none;
}

/* ナビゲーションメニュー */
header .menu_area {
  position: relative;
}
nav {
  width: 55.0vw; /* width: 55.0vw; */
  left: 4.0rem; /* left: 2.8rem; /* left: 4.75rem; */
}
nav.menu {
  display: block;
}

/* フッター */
footer {
  line-height: 1.0;
}
footer .content {
  width: 100%;
  height: 100%;
}
footer .inner_content {
  display: flex;
  padding-top: 8.0rem;
  padding-bottom: 12.0rem;
  margin-left: calc((100vw - 78.6vw) / 2); /* コンテンツベースで計算 */
}
footer .logo_area {
  width: 20.35rem;
  padding-top: 0.4rem;
  margin-bottom: 3.6rem;
}
footer .logo_area a {
  display: block;
}
footer .menu {
  width: 55.0vw;
  margin-top: 0;
  margin-left: 5.0rem;
  margin-bottom: 0;
}
footer .menu ul {
  display: flex;
  flex-wrap: wrap;
}
footer .menu ul li {
  width: calc(100% / 3);
  margin-top: 1.0rem;
  margin-bottom: 1.0rem;
}
footer .menu .menu_item .name {
  font-size: 1.6rem;
}
footer .menu .menu_item .name.small {
  font-size: 1.2rem;
}
footer .copyright_area .copyright {
  font-size: 1.2rem;
}

/* 個人情報保護方針説明 */
.pp_description {
}
.pp_description .pp_agreement {
}
.pp_description .pp_scroll {
  height: 44.5rem; /* height: 57.0rem; */
  padding: 2.0rem 1.6rem;
}
.pp_description .pp_scroll p {
  font-size: 1.6rem;
}

/************** リクルートボタン固定表示 **************/
#fixedPart-recruitButton {
  top: 5.2rem; /* top: 82.0vh; */
  right: calc((100vw - 78.6vw + 10.0rem) / 2); /* left: calc((100vw - 78.6vw) / 2); /* コンテンツベースで計算 */
}
/************** 背景動画 ***************/
video#backgroundVideo {
  width: 177.77777778vh; /* 16:9の幅 → 16 ÷ 9 ＝ 177.77% */
  height: 56.25vw; /* 16:9の幅 → 9 ÷ 16 = 56.25% */
  min-height: 100%;
  min-width: 100%;
}

/* メインメニュー */
#mainmenu {
}
#mainmenu ul {
  width: 78.0%;
  margin-left: auto;
  margin-right: auto;
  padding-top: calc(4.0rem + 4.0rem + 4.0rem); /* ヘッダーの高さ分ずらす */
  min-width: 37.5rem;
  max-width: 150.0rem;
}
#mainmenu ul li {
  margin-top: 0.0rem;
  margin-bottom: 2.0rem;
}
#mainmenu hr {
  width: 60%;
  margin-top: 3.6rem;
  margin-left: 0;
  margin-bottom: 3.0rem;
}
#mainmenu .menu_item {
  font-size: 2.0rem;
}

/************************************************
                Topページ
*************************************************/
/************** ファーストビュー(FV) ***************/
#fv-part {
  background-image: url('../images/fv_l.png');
  height: 72.0rem;
}
/*
#fv-part>.inner_content {
  position: relative;
} */
#fv-part .title_area {
  padding-top: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#fv-part .title_area h1 {
  font-size: 8.0rem;
  line-height: 1.2;
  margin-bottom: 2.4rem;
  text-shadow: 0 0 1.0rem rgba(131, 166, 193, 0.3);
}
#fv-part .title_area h2 {
  font-size: 2.4rem;
  text-shadow: 0 0 1.0rem rgba(131, 166, 193, 0.3);
}

/************** Who we are ***************/
#whoWeAre-part::before {
  width: 64%;
}
#whoWeAre-part .inner_content {
  display: flex;
  justify-content: space-between;
  flex-wrap: nowrap; /* flex-wrap: wrap; */
  gap: 0 4.0rem;
}
#whoWeAre-part .inner_content>div:nth-of-type(1) {
  /* width: 46%; */
}
#whoWeAre-part .inner_content>div:nth-of-type(2) {
  /* width: 50%; */
}
#whoWeAre-part .banner_area {
  padding-top: 8.0rem;
  display: flex;
  justify-content: flex-end;
}
#whoWeAre-part .banner_area .link_banner {
  width: 25.1rem;
  height: 44.0rem;
}
#whoWeAre-part .banner_area .link_banner_to_whoWeAre {
  margin-left: 0;
  margin-right: 0;
}
#whoWeAre-part .banner_area .link_banner_to_companyProfile {
  margin-left: 0;
  margin-right: 0;
}
/************** Service ***************/
#service-part {
  background-image: url('../images/bg_l_building_view.png');
}
#service-part .inner_content {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
/* あとで */
#service-part .inner_content .unit {
  width: 50%;
}
/* あとで
#service-part .inner_content>div:nth-of-type(1) {
  width: calc(46.4rem + 4.0rem);
  padding-right: 4.0rem;
}*/
/* あとで */
#service-part .inner_content>div:nth-of-type(2) {
  padding-top: 2.4rem;
}
#service-part .button_area button {
  margin-left: auto;
  margin-right: 0;
}
/************** Recruit ***************/
#recruit-part {
  overflow-x: hidden;
}
#recruit-part::before {
  width: 70.0%;
  height: 71.0%;
}
#recruit-part .button_area {
  padding-top: 0;
  padding-bottom: 0;
}
#backgroundMessage {
  display: block;
  font-size: 20.0rem;
}
#recruit-part .inner_unit {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  padding-bottom: 9.6rem;
}
#recruit-part .text_area p {
  width: 100%; /* width: 80%; あとで*/
}
#recruit-part .image_area .image_unit {
  width: auto;
  height: 32.7rem;
}
#recruit-part .image_area .image_unit img {
  width: auto;
  height: 100%;
}
#recruit-part .image_area>div:nth-of-type(2) img {
  margin-top: 0;
}
#recruit-part .image_area>div:nth-child(n+2) {
  margin-left: 3.0rem;
}
/************** News ***************/
#news-part {
  position: relative;
  padding-top: 0;
  padding-bottom: 8.0rem;
}
#news-part::before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  mix-blend-mode: overlay;
  backdrop-filter: blur(2.4px);
  -webkit-backdrop-filter: blur(2.4px);
  background: rgba(0, 0, 0, 0.8);
}
#news-part>div.inner_content {
  margin-left: 0;
  margin-right: 0;
  width: 100%; /* コンテンツ幅 */
  min-width: none;
  max-width: none;
}
#news-part .title_area {
  top: -3.1rem;
  left: calc((100vw - 78.6vw) / 2); /* コンテンツベースで計算 */
}
#news-part .title_area h1 {
  font-size: 4.8rem;
}
#news-part .unit_area {
  padding-top: 9.4rem;
  display: flex;
  overflow-x: scroll;
  -ms-overflow-style: none; /*スクロールバー非表示（IE・Edge）*/
  scrollbar-width: none;   /*スクロールバー非表示（Firefox）*/
}
#news-part .unit_area::-webkit-scrollbar { /*スクロールバー非表示（Chrome・Safari）*/
  display: none;
}
#news-part .unit_area .unit {
  width: 34.4rem;
  flex-shrink: 0;
  padding-bottom: 0;
}
#news-part .unit_area .unit .thumbnail_area img {
  height: 18.0rem;
}
#news-part .unit_area>*:nth-child(1) {
  margin-left: calc((100vw - 78.6vw) / 2); /* コンテンツベースで計算 */
}
#news-part .unit_area>*:nth-child(n+1) {
  margin-right: 3.0rem;
}
#news-part .unit_area>*:nth-child(n+4) {
  display: block;
}
#news-part .unit_area>*:nth-child(n+7) { /* ニュースは6つ目まで表示、7つ目以降は非表示 */
  display: none;
}
#news-part .unit_area .supplementary_info {
  font-size: 1.4rem;
  padding-top: 1.2rem;
  padding-bottom: 1.2rem;
}
#news-part .unit_area h3 {
  font-size: 1.6rem;
}
#news-part .unit_area .supplementary_info span:nth-of-type(1) {
  padding-right: 1.6rem;
}
#news-part .link_area {
  padding-top: 4.0rem;
}
#news-part .link_area .link {
  right: calc((100vw - 78.6vw) / 2); /* コンテンツベースで計算 */
}

/************** Contact ***************/
#contact-part .inner_content {
  padding-top: 11.6rem;
  padding-bottom: 13.4rem;
}

/************** H.R.I Inc.ロゴ初期表示 ***************/
/* 開いた時 */
.start {
  background: #000;
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 9000;
}
.start .mv_block {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: none;
  z-index: 9999;
}
/* 2秒表示 */

.start .mv_block .logos{
  opacity: 0;
  -webkit-transform: translate(50.75px, 0);
  transform: translate(50.75px, 0)
}
.start .mv_block .simple_logo{
  opacity: 0;
  -webkit-transform: translate(164px,0);
  transform: translate(164px,0);
}
.start .mv_block .main_logo{
  opacity: 0;
  -webkit-transform: translate(164px,0);
  transform: translate(164px,0);
  margin-left: 24px;
}
.start .mv_block .simple_logo.st{
  opacity: 1;
  -webkit-transition: opacity .2s ease 0s;
  transition: opacity .2s ease 0s;
}
.start .mv_block .simple_logo.nd{
  opacity: 1;
  -webkit-transform: translate(0,0);
  transform: translate(0,0);
  -webkit-transition: -webkit-transform 1s cubic-bezier(.77,0,.175,1) 0s;
  transition: -webkit-transform 1s cubic-bezier(.77,0,.175,1) 0s;
  transition: transform 1s cubic-bezier(.77,0,.175,1) 0s;
  transition: transform 1s cubic-bezier(.77,0,.175,1) 0s,-webkit-transform 1s cubic-bezier(.77,0,.175,1) 0s;
}
.start .mv_block .main_logo.nd{
  -webkit-transform: translate(0,0);
  transform: translate(0,0);
  opacity: 1;
  -webkit-transition: opacity 1s cubic-bezier(.77,0,.175,1) 0s,-webkit-transform 1s cubic-bezier(.77,0,.175,1) 0s;
  transition: opacity 1s cubic-bezier(.77,0,.175,1) 0s,-webkit-transform 1s cubic-bezier(.77,0,.175,1) 0s;
  transition: transform 1s cubic-bezier(.77,0,.175,1) 0s,opacity 1s cubic-bezier(.77,0,.175,1) 0s;
  transition: transform 1s cubic-bezier(.77,0,.175,1) 0s,opacity 1s cubic-bezier(.77,0,.175,1) 0s,-webkit-transform 1s cubic-bezier(.77,0,.175,1) 0s;
}

/************************************************
                下層ページ共通
*************************************************/
/************** ヘッダー画像 ***************/
#headerImage {
  height: 32.0rem;
  background-image: url('../images/hd_l_pp.png'); /* 初期設定画像 */
}
#headerImage .inner_content {
  width: 78.6vw; /* コンテンツベースで計算 */
  margin-left: auto;
  margin-right: auto;
  min-width: 37.5rem;
  max-width: 150.0rem;
  /* padding-left: calc((100vw - 78.6vw) / 2); /* コンテンツベースで計算 */
  /* padding-right: calc((100vw - 78.6vw) / 2); /* コンテンツベースで計算 */
}
#headerImage #mainTitle{
  bottom: -3.2rem;
}
/************** パート ***************/
.content.contentPage .part {
  padding-top: 12.4rem;
  padding-bottom: 13.4rem;
}
.content.contentPage .part .unit_area .unit {
  padding-bottom: 7.2rem;
}
.content.contentPage .part .unit_area .unit h1 {
  font-size: 2.0rem;
  padding-bottom: 2.0rem;
}
.content.contentPage .part .unit_area .unit h2 {
  font-size: 1.4rem;
  padding-bottom: 0.7rem;
}
.content.contentPage .container>.inner_content {
  display: flex;
  justify-content: space-between;
}
.content.contentPage>.container .scrollContent {
  width: 69.3%;
}
/* サイドメニュー:スティッキーコンテナ */
.content.contentPage>.container #container-sidemenu {
  display: block;
  width: 24.4%;
}
/* スティッキーアイテム */
.content.contentPage>.container #container-sidemenu #sidemenu {
  top: 14.0rem;
  position: sticky;
  position: -webkit-sticky;
  padding-top: 0.4rem;
}

/************** ボタンエリア ***************/
.content.contentPage .button_area {
  padding-top: 6.0rem;
  flex-direction: row-reverse;
  justify-content: flex-end;
}
.content.contentPage .button_area button:nth-of-type(2) {
  margin-top: 0;
  margin-right: 6.5rem;
}

/************** Contactエリア ***************/
body.contentPage #contact-part::before {
  background-image: url('../images/bg_l_desk_view.png');
}

/************************************************
                Companyページ
*************************************************/
body.page_company #headerImage {
  background-image: url('../images/hd_l_company.png');
}
.contentPage.page_company .certifications {
  gap: 1.4rem;
}
.contentPage.page_company .certification img {
  width: 7.2rem;
}
.contentPage.page_company .certification span {
  padding-top: 1.0rem;
  font-size: 1.4rem;
}

/************************************************
                Newsページ
*************************************************/
.contentPage.page_news #headerImage {
  background-image: url('../images/hd_l_news.png');
}
.contentPage.page_news #news-part {
  padding-top: 12.0rem;
  padding-bottom: 16.0rem;
}
.contentPage.page_news #news-part>.inner_content {
  margin-left: auto;
  margin-right: auto;
  width: 78.6vw; /* コンテンツ幅 */
  min-width: 37.5rem; /* あとで */
  max-width: 150.0rem;
  display: flex;
  justify-content: space-between;
}
.contentPage.page_news #news-part .unit_area h3 {
  font-size: 1.4rem;
  padding-top: 4.0rem;
  padding-bottom: 4.0rem;
}
.contentPage.page_news #news-part .unit_area.pickup h3 {
  font-size: 2.0rem;
  padding-top: 0rem;
  padding-bottom: 0rem;
}
.contentPage.page_news #news-part .unit_area {
  display: block;
  padding-top: 4.2rem; /* padding-top: 0; PICKUP開放時にこちらに変更 */
}
.contentPage.page_news #news-part .unit_area>a:first-of-type {
  border-top: 1px solid #FFFFFF;
}
.contentPage.page_news #news-part .unit_area>*:nth-child(n+1) {
  margin-right: 0;
}
.contentPage.page_news #news-part .unit_area>*:nth-child(1) {
  margin-left: 0;
}
/* あとで
.contentPage.page_news #news-part .unit_area.pickup a:nth-child(n+2) {
  margin-left: 2.8rem;
}*/
.contentPage.page_news #news-part .unit_area.pickup>div {
  display: flex;
  justify-content: space-between;
}
.contentPage.page_news #news-part .unit_area .unit {
  width: 100%;
  display: flex;
  padding: 0;
}
.contentPage.page_news #news-part .unit_area.pickup .unit {
  width: 34.4rem;
  display: block;
  padding-top: 3.4rem;
  padding-bottom: 0;
}
.contentPage.page_news #news-part .unit_area .unit .supplementary_info {
  display: flex;
  padding-top: 4.0rem;
  padding-bottom: 4.0rem;
}
.contentPage.page_news #news-part .unit_area.pickup .unit .supplementary_info {
  padding-top: 2.0rem;
  padding-bottom: 2.0rem;
}
.contentPage.page_news #news-part .unit_area .unit .supplementary_info span:nth-of-type(1) {
  padding-right: 4.0rem;
}
.contentPage.page_news #news-part .unit_area .unit .supplementary_info span:nth-of-type(2) {
  padding-right: 2.0rem;
}
.contentPage.page_news #news-part .unit_area.pickup .unit .supplementary_info span:nth-of-type(1) {
  padding-right: 2.0rem;
}
.contentPage.page_news #news-part .unit_area.pickup .unit .supplementary_info span:nth-of-type(2) {
  padding-right: 0;
}

/************************************************
                NEWS詳細ページ
*************************************************/
.contentPage.page_news.detail #news-part article .title {
  padding-bottom: 1.2rem;
}
.contentPage.page_news.detail #news-part article .title h1 {
  font-size: 3.2rem;
}
.contentPage.page_news.detail #news-part article .supplementary_info {
  font-size: 1.4rem;
  padding-bottom: 3.0rem;
}
.contentPage.page_news.detail #news-part article .supplementary_info>span:nth-child(1) {
  padding-right: 3.0rem;
}
.contentPage.page_news.detail #news-part article .supplementary_info .category {
  color: #999999;
}
.contentPage.page_news.detail #news-part article .thumbnail_area {
  padding-bottom: 3.6rem;
}
.contentPage.page_news.detail #news-part article .text_area>* {
  font-size: 1.6rem;
  line-height: 2.5;
}

/************************************************
                Privacy Policyページ
*************************************************/
 .contentPage.page_privacypolicy #headerImage {
  background-image: url('../images/hd_l_pp.png');
}

/************************************************
                Compliance Guidelineページ
*************************************************/
.contentPage.page_compliance #headerImage {
  background-image: url('../images/hd_l_compliance.png');
}

/************************************************
                Contactページ
*************************************************/
.contentPage.page_contact #headerImage {
  background-image: url('../images/hd_l_contact.png');
}
.contentPage.page_contact h2.sub {
  margin-bottom: 3.0rem;
}

/************************************************
                Who We Areページ
*************************************************/
.content.page_whoWeAre #headerImage {
  background-image: url('../images/hd_l_whoWeAre.png');
}
.content.page_whoWeAre>.part {
  padding-top: 12.0rem;
  padding-bottom: 0;
}
.content.page_whoWeAre .scrollContent .title_area {
  padding-bottom: 6.0rem;
}
.content.page_whoWeAre .scrollContent .unit {
  padding-bottom: 6.0rem;
  border-bottom: 1px solid #FFFFFF;
}
.content.page_whoWeAre .scrollContent h2 {
  font-size: 4.8rem;
}
.content.page_whoWeAre .scrollContent h3,
.content.page_whoWeAre .scrollContent h3.sub {
  font-size: 2.8rem;
}
.content.page_whoWeAre .scrollContent h3.small {
  font-size: 2.4rem;
}
.content.page_whoWeAre .scrollContent h4 {
  font-size: 2.0rem;
}
.content.page_whoWeAre .scrollContent .unit_area>div:last-child .title_area h3 {
  padding-bottom: 3.0rem;
}
.content.page_whoWeAre .scrollContent .unit .title_area {
  padding-bottom: 2.0rem;
}
.content.page_whoWeAre #part-message {
  padding-top: 16.0rem;
}
.content.page_whoWeAre #part-message::after {
  width: 100vw;
  max-width: 190.0rem; /* TODO:FUTURE */
  left: calc((-100vw + 78.6vw)/2); /* コンテンツ幅 */;
}
.content.page_whoWeAre #part-message .title_area {
  padding-bottom: 6.0rem;
}
.content.page_whoWeAre .image_area {
  padding-bottom: 6.0rem;
}
.content.page_whoWeAre>.container #container-sidemenu {
  padding-bottom: 13.4rem;
}
/************************************************
                Serviceページ
*************************************************/
body>.content.page_service div.part>.inner_content {
  margin-left: auto;
  margin-right: auto;
  width: 78.6vw; /* コンテンツ幅 */
  min-width: 37.5rem; /* あとで */
}
.content.page_service #business-01,
.content.page_service #business-03 {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}
.content.page_service #headerImage {
  background-image: url('../images/hd_l_service.png');
}
.content.page_service .title_area {
  margin-bottom: 4.0rem;
}
.content.page_service .title_area h2 {
  font-size: 2.8rem;
  margin-bottom: 1.0rem;
}
.content.page_service .title_area h2.sub {
  font-size: 2.0rem;
}
.content.page_service .text_area {
  margin-bottom: 4.0rem;
}
.content.page_service .diagram_area {
  display: flex;
  justify-content: space-between;
  padding: 2.0rem;
}
.content.page_service .diagram_area figure {
  flex-shrink: 0;
  width: 50%;
  margin: auto 0;
}
.content.page_service .accordion_area {
  width: 46%;
  display: flex;
  flex-direction: column;
  gap: 1.6rem 0;
}
.content.page_service .accordion {
  flex-shrink: 0;
  position: relative;
  border-bottom: none;
  padding: 1.0rem;
}
.content.page_service .accordion::before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  mix-blend-mode: overlay;
  backdrop-filter: blur(4.0px);
  -webkit-backdrop-filter: blur(4.0px);
  background: rgba(180, 180, 180, 1.0); /* rgba(255, 255, 255, 1.0); */
  border-radius: 1.0rem;
  z-index: -1;
}
.content.page_service .accordion .openOrClose {
  display: none;
}
.content.page_service .accordion h3 {
  font-size: 1.2rem;
}
.content.page_service .accordion .explanation {
  display: block;
  font-size: 0.9rem;
  margin-top: 0.4rem;
}
.content.page_service #business-01 {
  padding-bottom: 12.0rem;
}
.content.page_service #business-02::after {
  width: 100vw;
  max-width: 190.0rem; /* TODO:FUTURE */
  left: calc((-100vw + 78.6vw)/2); /* コンテンツ幅 */;
}
.content.page_service #business-02 .title_area {
  margin-bottom: 0;
}
.content.page_service #business-02 .button_area {
  padding-top: 0;
  margin-top: auto;
  margin-left: auto;
  display: flex;
  flex-direction: row;
  gap: 0 2.0rem;
}
.content.page_service #business-02 .button_area button {
  margin: 0;
}
.content.page_service #business-02 .inner_content {
  width: calc(33.2rem * 2 + 3.2rem);
  margin-left: 0;
  margin-bottom: 4.0rem;
}
.content.page_service #business-02 .unit_area {
  width: calc(33.2rem * 2 + 3.2rem);
  overflow-x: hidden;
  gap: 0 3.2rem;
}
.content.page_service #business-02 .unit_area .unit h4 {
  font-size: 1.2rem;
}
.content.page_service #business-02 .unit_area .unit h3 {
  font-size: 1.6rem;
}
.content.page_service #business-02 .unit_area .unit p {
  font-size: 1.2rem;
}
.content.page_service #business-02 .unit_area .unit {
  width: 33.2rem;
  padding: 2.0rem;
  /* margin-right: */
}
.content.page_service #business-02 .unit_area>div:first-child {
  margin-left: 0;
}
.content.page_service #business-02 .unit_area>div:last-child {
  margin-right: 0;
}
.content.page_service #business-03 {
  padding-top: 12.0rem;
}
.content.page_service #business-03 .title_area {
  margin-bottom: 2.0rem;
}
.content.page_service #business-03 .unit_area .unit {
  display: flex;
  justify-content: space-between;
  padding-top: 4.0rem;
  padding-bottom: 4.0rem;
}
.content.page_service #business-03 .unit_area .unit .inner_content {
  width: 77.0%; /* width: 67.0%; */
}
.content.page_service #business-03 .unit_area .unit .image_area {
  width: 18.8%; /* width: 28.8%; */
  margin-top: auto;
  margin-bottom: auto;
}
.content.page_service #business-03 .unit_area .unit .image_area img.join {
  margin-left: 0;
  margin-right: auto;
}
.content.page_service #business-03 .unit_area .unit .title_area {
  margin-bottom: 1.2rem;
}
.content.page_service #business-03 .unit_area .unit .text_area {
  margin-bottom: 2.4rem;
}
.content.page_service #business-03 .unit_area .unit h3 {
  font-size: 2.0rem;
  display: inline;
}
.content.page_service #business-03 .unit_area .unit h3.sub {
  font-size: 2.0rem;
  display: inline;
  padding-right: 1.8rem;
}
.content.page_service #business-03 .unit_area .unit p {
  font-size: 1.4rem;
}
.content.page_service #business-03 .unit_area .unit .link {
  height: 1.4rem;
  width: 15.2rem;
  margin-left: 0;
}
.content.page_service #business-03 .unit_area .unit .link .content {
  left: 72.6%;
}
.content.page_service #business-03 .unit_area .unit .link .name {
  font-size: 1.3rem;
}
.content.page_service #business-03 .unit_area .unit .link .right {
  bottom: -1.0rem;
}
.content.page_service>.container #container-sidemenu {
  padding-bottom: 4.0rem;
}

}

/*==================================================
iPad Pro 12.9インチ の Portrait 横幅 1024px 高さ 1366px
==================================================*/
@media screen and (width:1024px) and (height:1366px) {
}


/*==================================================
iPad Pro 10.5インチ の Landscape 横幅 1112px
==================================================*/
@media screen and (min-width:1112px) {
}

/*==================================================
iPad Pro 12.9インチ の Landscape 横幅 1366px 高さ 1024px
==================================================*/
@media screen and (width:1366px) and (height:1024px) {
}


/*==================================================
PC 1366px 以上
==================================================*/
@media screen and (min-width:1366px) {

}
/*==================================================
プリントアウト
==================================================*/
@media print {

}