@charset "UTF-8";
/**
	リンク下線のエフェクト
 */
/**
	リンク下線のエフェクト インラインリンク用
 */
/**
	webp背景画像を指定する
 */
/**
  セクション円弧シェイプ
 */
/* ==========================================================================
   Base
   リセットcssとhtml要素の定義
   ========================================================================== */
/**
  color
 */
:root {
  --col_orange: #FF4E00;
  --col_blue: #3595BD;
  --col_lblue: #DAE9EF;
  --col_dblue: #005C96;
  --col_sblue: #33A9BF;
  --col_ygreen: #cfda00;
  --col_red: #F52F37;
  --col_black: #202124;
  --col_brown: #B48200;
  --col_dbrown: #643B13;
  --col_yellow: #D0B855;
  --col_beige: #FEF3E7;
  --col_cat-all: #53a0c3;
  --col_cat-all_dark: #53a0c3;
  --col_cat-job: var(--col_dblue);
  --col_cat-job--dark: #002A7E;
  --col_cat-project: var(--col_sblue);
  --col_cat-project--dark: #009D94;
  --col_cat-system: var(--col_yellow);
  --col_cat-system--dark: #D19D28;
  --col_cat-about: #97C7D6;
  --col_cat-about--dark: #60aec6;
}

/**
  font family
 */
:root {
  --font-normal: "こぶりなゴシック W3 JIS2004", "Koburina Gothic W3 JIS2004", sans-serif;
  --font-bold: "こぶりなゴシック W6 JIS2004", "Koburina Gothic W6 JIS2004", sans-serif;
}

*, *::before, *::after {
  box-sizing: border-box;
}

body, h1, h2, h3, h4, p, figure, blockquote, dl, dd {
  margin: 0;
}

ul[role=list], ol[role=list] {
  list-style: none;
}

body {
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  line-height: 1.5;
}

a:not([class]) {
  text-decoration-skip-ink: auto;
}

/*img, picture {
  max-width: 100%;
  display: block
}*/
table {
  border-collapse: collapse;
  border-spacing: 0;
}

input, button, textarea, select {
  font: inherit;
}

/* ==========================================================================

   preset.scss
   プリミティブ要素の設定

 */
*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

html {
  overflow-y: scroll;
}
@media only screen and (max-width: 350px) {
  html {
    font-size: 3.125vw;
  }
}
@media screen and (min-width: 0px) and (max-width: 812px) {
  html {
    font-size: 2.6666666667vw;
  }
}
@media screen and (min-width: 813px) and (max-width: 1280px) {
  html {
    font-size: 0.78125vw;
  }
}
@media screen and (min-width: 1280px) {
  html {
    font-size: 62.5%;
  }
}

body {
  font-size: 1.4rem;
  color: var(--col_black);
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /*overscroll-behavior: none;*/
  -webkit-tap-highlight-color: rgba(255, 78, 0, 0.6);
  letter-spacing: 0.05em;
  font-family: "こぶりなゴシック W3 JIS2004", "Koburina Gothic W3 JIS2004", "こぶりなゴシック W3", sans-serif;
  font-style: normal;
}
@media print, screen and (min-width:813px) {
  body {
    font-size: 1.6rem;
  }
}

body.is-fixed {
  position: fixed;
  height: 100%;
  overflow: hidden;
}

main {
  display: block;
}

a {
  color: var(--col_black);
  text-decoration: none;
  outline: none;
}

a:active, a:hover, a.touchstart {
  text-decoration: none;
}

@media print, screen and (min-width:813px) {
  a[href^="tel:"] {
    pointer-events: none;
  }
}

p, h1, h2, h3, h4, h5, h6, small, em, li, dt, dd, th, td {
  line-height: 1.875;
  font-feature-settings: "palt";
  letter-spacing: 0.05em;
  font-weight: 400;
}
ul {
  margin: 0;
  padding: 0;
}

li {
  list-style-type: none;
}

img {
  vertical-align: bottom;
}

img,
picture {
  width: 100%;
  height: auto;
}

/* 画像のぼやけをなくす（chrome opera） */
/*@media screen and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm) {
  img {
    image-rendering: -webkit-optimize-contrast;
  }
}*/
sup {
  font-size: 0.4em;
  vertical-align: top;
}

hr {
  height: 0;
  margin: 0;
  border: none;
  border-top: 1px solid #ddd;
}

/* reset form elements */
input, button, textarea, select {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  color: var(--col_black);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

select::-ms-expand {
  display: none;
}

.svg-assets {
  display: none;
}

/* ==========================================================================
    libs
   ========================================================================== */
/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}
.slick-list:focus {
  outline: none;
}
.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.slick-track:before, .slick-track:after {
  content: "";
  display: table;
}
.slick-track:after {
  clear: both;
}
.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}
[dir=rtl] .slick-slide {
  float: right;
}
.slick-slide img {
  display: block;
}
.slick-slide.slick-loading img {
  display: none;
}
.slick-slide.dragging img {
  pointer-events: none;
}
.slick-initialized .slick-slide {
  display: block;
}
.slick-loading .slick-slide {
  visibility: hidden;
}
.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

/**
	リンク下線のエフェクト
 */
/**
	リンク下線のエフェクト インラインリンク用
 */
/**
	webp背景画像を指定する
 */
.slick-slide {
  outline: none;
}

/* Slider */
/* Icons */
@font-face {
  font-family: "slick";
  src: url("./fonts/slick.eot");
  src: url("./fonts/slick.eot?#iefix") format("embedded-opentype"), url("./fonts/slick.woff") format("woff"), url("./fonts/slick.ttf") format("truetype"), url("./fonts/slick.svg#slick") format("svg");
  font-weight: normal;
  font-style: normal;
}
.slick-controll {
  position: relative;
}
@media print, screen and (min-width:813px) {
  .slick-controll {
    width: 40%;
    margin: 0 0 0 auto;
  }
}

/* Arrows */
.slick-prev,
.slick-next {
  font-size: 0;
  z-index: 10;
  position: absolute;
  cursor: pointer;
  aspect-ratio: 1/2;
  top: 10.5rem;
}
.slick-prev::before,
.slick-next::before {
  content: "";
  display: block;
  position: absolute;
  width: 2.4rem;
  height: 4.8rem;
  mask: url(../img/ic_arrow_a2.svg) no-repeat center center/80% auto;
  background-color: #fff;
}
@media print, screen and (min-width:813px) {
  .slick-prev,
  .slick-next {
    transition: 0.3s opacity;
    top: calc(50% - 7rem);
  }
  .slick-prev:hover,
  .slick-next:hover {
    opacity: 0.75;
  }
  .slick-prev::before,
  .slick-next::before {
    width: 3rem;
    height: 6rem;
    mask: url(../img/ic_arrow_a2.svg) no-repeat center center/80% auto;
  }
}

.slick-prev {
  left: 19%;
  transform: scaleX(-1);
}
@media print, screen and (min-width:813px) {
  .slick-prev {
    left: calc(20% + 1.4rem);
  }
}

.slick-next {
  right: 19%;
}
@media print, screen and (min-width:813px) {
  .slick-next {
    right: calc(20% + 1.4rem);
  }
}

/* Dots */
.slick-dots {
  position: absolute;
  z-index: 1;
  display: flex;
  justify-content: center;
  width: 100%;
  bottom: -35px;
}
.slick-dots li {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 25px;
  width: 25px;
  cursor: pointer;
}
.slick-dots li button {
  font-size: 0;
  width: 9px;
  height: 9px;
  display: block;
  border-radius: 50%;
  background-color: #111;
}
.slick-dots li.slick-active button {
  background-color: var(--col_gold);
}
@media print, screen and (min-width:813px) {
  .slick-dots {
    bottom: -50px;
  }
  .slick-dots li {
    height: 40px;
    width: 40px;
  }
  .slick-dots li button {
    width: 10px;
    height: 10px;
  }
}

/* ==========================================================================
   Layout
   ========================================================================== */
/* --------------------------------------------------------------------
  #ページ全体のwrapper
 */
.l-page-wrapper {
  position: relative;
  overflow: hidden;
}
/* --------------------------------------------------------------------
  #基本幅レイアウト用wrapper
 */
.l-width-std {
  margin-left: 1.5rem;
  margin-right: 1.5rem;
}
@media print, screen and (min-width:813px) {
  .l-width-std {
    margin-left: 8rem;
    margin-right: 8rem;
    max-width: clamp(0px, 100vw, 1100px);
  }
}
@media screen and (min-width: 1200px) {
  .l-width-std {
    margin-left: auto;
    margin-right: auto;
  }
}

.l-width-contents {
  margin-left: 1.5rem;
  margin-right: 1.5rem;
}
@media print, screen and (min-width:813px) {
  .l-width-contents {
    margin-left: auto;
    margin-right: auto;
    max-width: 114.8rem;
  }
}

.l-width-wide {
  margin-left: 1.5rem;
  margin-right: 1.5rem;
}
@media print, screen and (min-width:813px) {
  .l-width-wide {
    margin-left: 8rem;
    margin-right: 8rem;
  }
}

.l-width-compact {
  margin-left: 1.5rem;
  margin-right: 1.5rem;
}
@media print, screen and (min-width:813px) {
  .l-width-compact {
    margin-left: auto;
    margin-right: auto;
    width: 90rem;
  }
}

/* --------------------------------------------------------------------
  #メインエリアwrapper
 */
.l-main {
  position: relative;
  overflow: hidden;
}
/* --------------------------------------------------------------------
  #セカンドユーティリティページレイアウト
 */
.l-subpage {
  padding: 8rem 0 8rem;
}
@media print, screen and (min-width:813px) {
  .l-subpage {
    padding: 12rem 0 12rem;
  }
}

.l-subpage.--complete-page {
  height: calc(100vh - 17.5rem);
}
@media print, screen and (min-width:813px) {
  .l-subpage.--complete-page {
    min-height: 50rem;
    height: calc(100vh - 24.3rem);
  }
}

/* --------------------------------------------------------------------
  #汎用セクションフォーマット
 */
.l-section {
  position: relative;
  z-index: 3;
  margin-bottom: 6rem;
}
@media print, screen and (min-width:813px) {
  .l-section {
    margin-bottom: 10rem;
  }
}

/* ==========================================================================
   Module
   ========================================================================== */
/**
  汎用ページ
 */
/**
  うぶやについて
 */
.page-about {
  background-color: var(--col_beige);
}

/**
  うぶやの制度
 */
.page-system {
  background-color: var(--col_brown);
}

/**
  採用情報・エントリー
 */
.page-entry {
  background-color: var(--col_lblue);
}

/**
  うぶやの人びと
 */
.page-voice {
  background-color: var(--col_blue);
  background: url(../img/voice_head_particle_sp.svg) no-repeat center top 2.5rem/115% auto var(--col_blue);
  padding: 10rem 0;
}
@media print, screen and (min-width:813px) {
  .page-voice {
    padding: 16rem 0;
    background: url(../img/voice_head_particle.svg) no-repeat center top/clamp(120rem, 100%, 160rem) auto var(--col_blue);
  }
}

/**
  お問い合わせ
 */
.page-contact {
  background-color: var(--col_lblue);
  padding: 10rem 0 8rem;
}
@media print, screen and (min-width:813px) {
  .page-contact {
    padding: 22rem 0 16rem;
  }
}

/* ====================================================================

#コンテンツヘッダ

*/
/* --------------------------------------------------------------------
  #ヘッダ
 */
.header {
  position: absolute;
  z-index: 108;
  top: 0;
  left: 0;
  width: 100%;
}
@media print, screen and (min-width:813px) {
  .header {
    padding: 2.8rem 3rem;
    position: fixed;
  }
}

.header__ci {
  all: unset;
  position: fixed;
  z-index: 111;
  left: 2.8rem;
  top: 1.7rem;
}
.header__ci > a {
  color: #fff;
  display: inline-flex;
  align-items: center;
  gap: 1.1rem;
}
.header__ci > a > img {
  width: 8rem;
}
.header__ci > a > small {
  font-size: 1.1rem;
  font-family: var(--font-bold);
  font-weight: 600;
}
@media print, screen and (min-width:813px) {
  .header__ci {
    position: absolute;
    left: 3rem;
    top: 2.8rem;
  }
  .header__ci > a {
    gap: 2.5rem;
  }
  .header__ci > a > img {
    width: 16.2rem;
  }
  .header__ci > a > small {
    font-size: 1.6rem;
  }
}

.header__gnav > li {
  position: relative;
  font-family: var(--font-bold);
  font-weight: 600;
  font-size: 1.6rem;
}
.header__gnav > li > a {
  display: block;
  line-height: 1.3;
}
@media only screen and (max-width: 812px) {
  .header__gnav > li > a {
    padding: 1rem 0;
  }
  .header__gnav > li > a::after {
    content: "";
    display: block;
    position: absolute;
    width: 0.9rem;
    height: 1.8rem;
    right: 1rem;
    top: 1rem;
    mask: url(../img/ic_arrow_a.svg) no-repeat center center/contain;
    background-color: #000;
  }
  .header__gnav .border-top {
    border-top: 1px solid var(--col_red);
    margin-top: 0.5rem;
    padding-top: 0.5rem;
  }
  .header__gnav .border-top > a::after {
    top: 1.5rem;
  }
  .header__gnav .gnav-category {
    display: block;
    font-size: 1.4rem;
    color: #989898;
    text-align: center;
    padding-top: 1rem;
    margin-bottom: -0.4rem;
  }
  .header__gnav .gnav-category::after {
    display: none;
  }
}
@media print, screen and (min-width:813px) {
  .header__gnav {
    position: absolute;
    display: inline-flex;
    gap: 2rem;
    background-color: #fff;
    align-items: center;
    justify-content: center;
    height: 4.2rem;
    padding: 0 3.6rem;
    border-radius: 9999px;
    font-family: var(--font-bold);
    font-weight: 600;
  }
  .header__gnav > li {
    font-size: 1.4rem;
  }
  .header__gnav > li > a {
    transition: 0.3s color;
  }
  .header__gnav > li.is-current > a {
    color: var(--col_orange);
  }
  .header__gnav > li:hover > a {
    color: var(--col_orange);
  }
  .header__gnav > li.dd-trigger:hover .header__gnav-dd {
    display: block;
  }
  .header__gnav .gnav-category:not(.--pc-visible) {
    display: none;
  }
}
@media screen and (min-width: 769px) and (max-width: 1360px) {
  .header__gnav {
    padding: 0 2rem;
  }
}

/**
  ドロップダウンのコンテナ
 */
@media print, screen and (min-width:813px) {
  .header__gnav-dd {
    position: absolute;
    display: none;
    min-width: 12rem;
    padding-top: 1.8rem;
    left: -2rem;
  }
}

/**
  ドロップダウンのナビ実体
 */
.header__gnav-dd-nav > li {
  font-family: var(--font-bold);
  font-weight: 600;
}
.header__gnav-dd-nav > li > a {
  position: relative;
  display: block;
  line-height: 1.3;
}
.header__gnav-dd-nav > li > a::after {
  content: "";
  display: block;
  position: absolute;
  width: 0.6rem;
  height: 1.2rem;
  right: 0;
  top: 0.1rem;
  mask: url(../img/ic_arrow_a.svg) no-repeat center center/contain;
  background-color: #000;
}
@media only screen and (max-width: 812px) {
  .header__gnav-dd-nav {
    margin: 0 0 1rem 0;
  }
  .header__gnav-dd-nav > li > a {
    padding: 1rem 0;
  }
  .header__gnav-dd-nav > li > a::after {
    width: 0.9rem;
    height: 1.8rem;
    right: 1rem;
    top: 1rem;
  }
}
@media print, screen and (min-width:813px) {
  .header__gnav-dd-nav {
    background-color: #fff;
    border-radius: 1.6rem;
    padding: 1.6rem 2rem;
  }
  .header__gnav-dd-nav > li {
    white-space: nowrap;
  }
  .header__gnav-dd-nav > li:not(:last-child) {
    margin-bottom: 0.5rem;
  }
  .header__gnav-dd-nav > li > a {
    transition: color 0.3s;
  }
  .header__gnav-dd-nav > li > a::after {
    width: 0.6rem;
    height: 1.2rem;
    top: calc(50% - 0.6rem);
  }
  .header__gnav-dd-nav > li:hover > a {
    color: var(--col_orange);
  }
}

.header__entry {
  position: fixed;
  width: 11rem;
  right: 6rem;
  top: 1rem;
  z-index: 111;
  font-family: var(--font-bold);
  font-weight: 600;
}
.header__entry .pc-text {
  display: none;
}
@media print, screen and (min-width:813px) {
  .header__entry {
    position: absolute;
    width: 18.8rem;
    right: 3rem;
    top: 2.8rem;
  }
  .header__entry.button-a .button-inner {
    font-size: 1.4rem;
  }
  .header__entry.button-a .button-inner:hover {
    background-color: #fff;
    color: var(--col_orange);
  }
  .header__entry .pc-text {
    display: inline;
  }
}

/**
  SPのみのエントリー系メニューボタン
 */
.header__sub {
  margin-top: 3rem;
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  justify-content: space-between;
}
.header__sub > li {
  width: calc(50% - 0.5rem);
}
.header__sub > li .button-inner {
  height: 5.8rem;
  background-color: #fff;
  color: var(--col_orange);
  font-size: 1.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 2rem;
  border: 1px solid var(--col_orange);
}
.header__sub > li .button-inner::after {
  content: "";
  display: block;
  position: absolute;
  width: 0.8rem;
  height: 1.6rem;
  right: 1rem;
  top: calc(50% - 0.8rem);
  mask: url(../img/ic_arrow_a.svg) no-repeat center center/contain;
  background-color: var(--col_orange);
}
.header__sub > li.--strong {
  width: 100%;
}
.header__sub > li.--strong .button-inner {
  height: 8.5rem;
  color: #fff;
  font-size: 1.8rem;
  background-color: var(--col_orange);
}
.header__sub > li.--strong .button-inner::after {
  background-color: #fff;
}
@media print, screen and (min-width:813px) {
  .header__sub {
    display: none;
  }
}

@media print, screen and (min-width:813px) {
  .header-menu-content {
    padding-right: 21.3rem;
    display: flex;
    justify-content: flex-end;
  }
}

/**
  SP時の固定ヘッダ要素
 */
/**
  メニュートリガーボタン
 */
.header__trigger {
  position: fixed;
  z-index: 111;
  cursor: pointer;
  right: 0;
  top: 0;
  width: 6rem;
  height: 5.6rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.header__trigger .line1,
.header__trigger .line2,
.header__trigger .line3 {
  display: block;
  width: 3rem;
  height: 0.2rem;
  background-color: #fff;
  transform-origin: 50% 50%;
  transition-duration: 0.2s;
}
.header__trigger .line1 {
  transform: translate3d(0, -0.6rem, 0);
}
.header__trigger .line3 {
  transform: translate3d(0, 0.6rem, 0);
}
.header__trigger.is-active .line1,
.header__trigger.is-active .line2,
.header__trigger.is-active .line3 {
  transition-duration: 0.4s;
  background-color: var(--col_orange);
}
.header__trigger.is-active .line1 {
  transform: translate3d(0, 2px, 0) rotate(45deg);
}
.header__trigger.is-active .line2 {
  opacity: 0;
}
.header__trigger.is-active .line3 {
  transform: translate3d(0, -2px, 0) rotate(-45deg);
}
@media print, screen and (min-width:813px) {
  .header__trigger {
    display: none;
  }
}

/**
  メニュー本体（SP時メニューのボディ）
 */
@media only screen and (max-width: 812px) {
  .header-menu {
    display: none;
    position: fixed;
    z-index: 109;
    height: 100%;
    top: 0;
    left: 0;
    width: 100%;
  }
  .header-menu.is-active {
    display: block;
  }
  .header-menu.is-active .header-menu-inner {
    opacity: 1;
  }
  .header-menu.is-beforeEnter {
    display: block;
    opacity: 0;
  }
  .header-menu.is-enter {
    display: block;
    transition: opacity 0.6s, visibility 0s;
    opacity: 1;
  }
  .header-menu.is-fadeOut {
    display: block;
    transition: opacity 0.6s, visibility 0.6s;
    opacity: 0;
  }
}

@media only screen and (max-width: 812px) {
  .header-menu-inner {
    height: 100%;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    position: absolute;
    z-index: 109;
    right: 0;
    top: 0;
    width: 100%;
    background-color: #FEF3E7;
    overscroll-behavior: contain;
    padding: 8rem 1.5rem;
  }
}

/* ====================================================================

  #フッタ

 */
.footer {
  background-color: #fff;
  padding: 2.2rem 0;
}
@media print, screen and (min-width:813px) {
  .footer {
    padding: 2.5rem 0 3rem;
  }
}

.footer__unav {
  display: flex;
  justify-content: center;
  gap: 1.2rem;
  margin-bottom: 0.8rem;
}
.footer__unav > li {
  font-size: 1.1rem;
}
.footer__unav > li > a {
  color: var(--col_dblue);
}
@media print, screen and (min-width:813px) {
  .footer__unav {
    gap: 2rem;
    margin-bottom: 1.4rem;
  }
  .footer__unav > li {
    font-size: 1.5rem;
    transition: 0.3s opacity;
  }
  .footer__unav > li:hover {
    opacity: 0.75;
  }
}

.footer__copyright {
  text-align: center;
  color: var(--col_dblue);
  font-size: 0.9rem;
}
@media print, screen and (min-width:813px) {
  .footer__copyright {
    font-size: 1.2rem;
  }
}

.footer__pagetop {
  position: fixed;
  z-index: 100;
  right: 1.5rem;
  bottom: 1.5rem;
  font-size: 1.1rem;
  white-space: nowrap;
  transform: translate3d(200%, 0, 0);
  transition: transform 0.5s;
  display: none;
}
.footer__pagetop::before {
  position: relative;
  content: "";
  display: block;
  background: url(../img/ic_pagetop.svg) no-repeat left top/contain;
  width: 3rem;
  height: 3rem;
  margin-bottom: 0.5em;
  margin-left: auto;
  margin-right: auto;
}
.footer__pagetop.is-active {
  transform: translate3d(0, 0, 0);
}
@media print, screen and (min-width:813px) {
  .footer__pagetop {
    display: block;
    width: 7.6rem;
    text-align: center;
    font-size: 1.3rem;
    right: 3rem;
    bottom: 3rem;
    transition: 0.3s opacity;
  }
  .footer__pagetop:hover {
    opacity: 0.75;
  }
  .footer__pagetop:hover {
    opacity: 0.5;
  }
  .footer__pagetop::before {
    width: 5.6rem;
    height: 5.6rem;
  }
}

/* ==========================================================================

	#アコーディオンモジュール

 */
.prg-accr-trigger {
  cursor: pointer;
}

.prg-accr-content {
  display: none;
}

.prg-sp-accr-trigger {
  cursor: pointer;
}
.prg-sp-accr-trigger .icon-arrow {
  transition-duration: 0.3s;
}

@media only screen and (max-width: 812px) {
  .prg-sp-accr-content {
    display: none;
  }
}

.pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.pagination a {
  color: #fff;
}
@media only screen and (max-width: 812px) {
  .pagination {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
    margin-top: 4rem;
  }
}
@media print, screen and (min-width:813px) {
  .pagination {
    margin-top: 6rem;
  }
}

.pagination .prev,
.pagination .next {
  position: relative;
  align-items: center;
  padding: 0;
  margin: 0 0.5em;
  font-size: 0;
}
.pagination .prev::after,
.pagination .next::after {
  content: "";
  display: block;
  position: absolute;
  top: calc(50% - 1.5rem);
  width: 0.8rem;
  height: 1.6rem;
  mask: url(../img/ic_prev.svg) no-repeat center center/contain;
  background-color: #fff;
}
@media print, screen and (min-width:813px) {
  .pagination .prev,
  .pagination .next {
    margin: 0 2rem;
  }
}

.pagination .next::after {
  mask-image: url(../img/ic_next.svg);
}

.pagination > .page-numbers > li.disabled {
  pointer-events: none;
  visibility: hidden;
}

.page-numbers:not(.prev):not(.next) {
  position: relative;
  letter-spacing: 0.05em;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 1.5rem;
  width: 2.6rem;
  height: 2.6rem;
}
.page-numbers:not(.prev):not(.next) > li {
  margin: 0 0.5rem;
}
@media print, screen and (min-width:813px) {
  .page-numbers:not(.prev):not(.next) {
    width: 4rem;
    height: 4rem;
    font-size: 1.8rem;
    transition: 0.3s;
  }
  .page-numbers:not(.prev):not(.next) > li {
    margin: 0 1rem;
  }
  .page-numbers:not(.prev):not(.next) .page-numbers:not(.current):not(.prev):not(.next):hover {
    opacity: 0.75;
  }
}

.page-numbers.current::after {
  content: "";
  display: block;
  position: absolute;
  width: 70%;
  height: 2px;
  background-color: #fff;
  bottom: 0;
}

.pager {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 5rem;
}
@media print, screen and (min-width:813px) {
  .pager {
    margin-top: 7rem;
  }
}

.pager__prev,
.pager__next {
  position: relative;
  color: #fff;
  font-size: var(--f14);
  min-height: 4.2rem;
  display: flex;
  width: 8rem;
  align-items: center;
}
.pager__prev::before,
.pager__next::before {
  content: "";
  display: block;
  position: absolute;
  width: 1.2rem;
  height: 2.4rem;
  mask: url(../img/ic_arrow_a.svg) no-repeat center center/contain;
  background-color: #fff;
}
@media print, screen and (min-width:813px) {
  .pager__prev,
  .pager__next {
    font-size: var(--f18);
    width: 10.8rem;
    transition: 0.3s opacity;
  }
  .pager__prev:hover,
  .pager__next:hover {
    opacity: 0.75;
  }
}

.pager__prev {
  justify-content: flex-end;
}
.pager__prev::before {
  left: 0;
  transform: scaleX(-1);
}

.pager__next::before {
  right: 0;
}

.pager__index {
  width: 14.4rem;
}
.pager__index.button-a.--white .button-inner {
  color: var(--col_blue);
}
@media print, screen and (min-width:813px) {
  .pager__index.button-a.--white .button-inner:hover {
    color: #fff;
    background-color: var(--col_blue);
  }
}
@media print, screen and (min-width:813px) {
  .pager__index {
    width: 30rem;
  }
}

/* ====================================================================

  #見出しモジュール

 */
/* --------------------------------------------------------------------
  # セクション見出し
 */
.heading-sec {
  text-align: center;
}
.heading-sec > small {
  font-family: "Outfit", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 1.4rem;
  display: block;
}
.heading-sec > em {
  line-height: 1.5;
  display: block;
  font-style: normal;
  letter-spacing: 0.1em;
  font-size: 2.8rem;
  font-family: var(--font-bold);
  font-weight: 600;
}
@media print, screen and (min-width:813px) {
  .heading-sec > small {
    font-size: 1.4rem;
    line-height: 1;
  }
  .heading-sec > em {
    font-size: 3rem;
    margin-top: 0.7rem;
  }
}

.heading-sec.--white {
  color: #fff;
}

.heading-sec.--red {
  color: var(--col_red);
}

.heading-sec.--dblue {
  color: var(--col_dblue);
}

.heading-sec.--brown {
  color: var(--col_brown);
}

.heading-sec.--blue {
  color: var(--col_blue);
}

/**
  second-introブロックの見出しサイズ
 */
@media only screen and (max-width: 812px) {
  .heading-sec.--intro > em {
    font-size: 1.8rem;
  }
}

/* --------------------------------------------------------------------
  # ブロック見出し1 背景六角ピクト
 */
.heading-block {
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url(../img/heading_pic_red.png);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-bold);
  font-weight: 600;
  color: #fff;
  text-align: center;
  letter-spacing: 0.07em;
  line-height: 1.45;
  width: 11.6rem;
  height: 10rem;
  font-size: 1.6rem;
}
@media print, screen and (min-width:813px) {
  .heading-block {
    width: 17.5rem;
    height: 15.2rem;
    font-size: 2.4rem;
  }
}

.heading-block.--red {
  background-image: url(../img/heading_pic_red.png);
}

.heading-block.--dblue {
  background-image: url(../img/heading_pic_dblue.png);
}

.heading-block.--brown {
  background-image: url(../img/heading_pic_brown.png);
}

.heading-block.--orange {
  background-image: url(../img/heading_pic_orange.png);
}

/* --------------------------------------------------------------------
  # ブロック見出し大型
 */
@media print, screen and (min-width:813px) {
  .heading-block.--large {
    width: 24rem;
    height: 20.8rem;
    font-size: 3rem;
  }
}

/* --------------------------------------------------------------------
  # ページ見出し（ブロック見出し派生） 背景六角ピクト
 */
.heading-block.--page {
  position: absolute;
  left: 2.3rem;
  bottom: 3rem;
  width: 13.9rem;
  height: 12rem;
  font-size: 2.2rem;
}
@media print, screen and (min-width:813px) {
  .heading-block.--page {
    width: 22.5rem;
    height: 19.5rem;
    font-size: 3rem;
    left: 10%;
    bottom: auto;
    top: calc(50% - 9.7rem);
  }
}

/* --------------------------------------------------------------------
  # ブロック見出し 先頭六角ピクト
 */
.heading-block2 {
  font-family: var(--font-bold);
  font-weight: 600;
  position: relative;
  font-size: 2.2rem;
  padding-left: 1.2em;
}
.heading-block2::before {
  content: "";
  display: block;
  position: absolute;
  background-color: #aaa;
  width: 1.6rem;
  height: 1.4rem;
  left: 0;
  top: 1.3rem;
  mask: url(../img/ic_dot.svg) no-repeat center center/contain;
}
@media print, screen and (min-width:813px) {
  .heading-block2 {
    font-size: 2.4rem;
  }
  .heading-block2::before {
    left: 0;
    top: 1.4rem;
  }
}

.heading-block2.--dbrown {
  color: var(--col_dbrown);
}
.heading-block2.--dbrown::before {
  background-color: var(--col_dbrown);
}

:root {
  /*--------------------------------
  フォーム基本サイズ
   --------------------------------*/
  --form-font-size-sp: var(--f16);
  --form-font-size-pc: var(--f16);
  --form-height-sp: 4.5rem;
  --form-height-pc: 4.5rem;
  /*--------------------------------
  フォーム基本色
   --------------------------------*/
  /* 必須 */
  --form-required-color: #ff7474;
  /* 入力部分 */
  --form-input-border-color: #FEF3E7;
  --form-input-bg-color: #FEF3E7;
  --form-checked-bg-color: #666;
  --form-placeholder-color: #959595;
  /* ボタン */
  --form-btn-text-color:#fff;
  --form-btn-bg-color:#333;
  --form-btn-bgcolor-hover-color:#999;
  /* エラー */
  --form-error-bg-color:#ffe7e7;
  --form-error-text-color:#f00;
  /* プライバシーポリシー */
  --form-privacy-text-color: #000;
  --form-privacy-border-color:#959595;
}

.form-w1 {
  width: 30%;
  max-width: 60px;
}
@media print, screen and (min-width:813px) {
  .form-w1 {
    width: 20%;
    max-width: 100px;
  }
}

.form-w2 {
  width: 48%;
}
@media print, screen and (min-width:813px) {
  .form-w2 {
    width: 40%;
  }
}

.form-w3 {
  width: 75%;
}
@media print, screen and (min-width:813px) {
  .form-w3 {
    width: 60%;
  }
}

.form-w4 {
  width: 100%;
}
@media print, screen and (min-width:813px) {
  .form-w4 {
    width: 80%;
  }
}

.form-w-full {
  width: 100%;
}

.form-w5 {
  width: 100%;
}
@media print, screen and (min-width:813px) {
  .form-w5 {
    width: 100%;
  }
}

.form-textarea {
  height: 10rem;
}
@media print, screen and (min-width:813px) {
  .form-textarea {
    height: 20rem;
  }
}

.input-list > li {
  display: inline-block;
  margin-right: 1rem;
  line-height: 2;
}
@media print, screen and (min-width:813px) {
  .input-list > li {
    margin-right: 1.5rem;
  }
}

.required {
  color: var(--form-required-color);
  margin-left: 0.5rem;
  font-style: normal;
}

/* --------------------------------------------------------------------
  #input内webフォント表示バグ用の修正
 */
input,
textarea {
  font-family: sans-serif !important;
}

/* --------------------------------------------------------------------
  #input
 */
input {
  vertical-align: text-top;
}

input:not([type=radio]):not([type=checkbox]):not([type=submit], [type=button]):not([type=file]),
textarea {
  height: var(--form-height-pc);
  font-size: var(--form-font-size-pc);
  align-items: center;
  background-color: var(--form-input-bg-color);
  padding: 0.6rem 1.2rem;
  border: 1px solid var(--form-input-border-color);
  border-radius: 1rem;
}
input:not([type=radio]):not([type=checkbox]):not([type=submit], [type=button]):not([type=file])::placeholder,
textarea::placeholder {
  color: var(--form-placeholder-color);
  font-size: 1.6rem;
}
@media only screen and (max-width: 812px) {
  input:not([type=radio]):not([type=checkbox]):not([type=submit], [type=button]):not([type=file]),
  textarea {
    height: var(--form-height-sp);
    font-size: var(--form-font-size-sp);
  }
  input:not([type=radio]):not([type=checkbox]):not([type=submit], [type=button]):not([type=file])::placeholder,
  textarea::placeholder {
    font-size: var(--form-font-size-sp);
  }
}

textarea {
  height: initial;
  transform: translateY(0);
}

/* --------------------------------------------------------------------
  #チェックボックス
 */
label.checkbox {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  gap: 0.4rem;
  color: var(--col_dblue);
  font-family: var(--font-bold);
  font-weight: 600;
  position: relative;
}

input[type=checkbox] {
  position: relative;
  cursor: pointer;
  width: 2.5rem;
  height: 2.5rem !important;
  border-radius: 0 !important;
  margin: -0.4rem 0.8rem 0 0;
  background: #fff;
  padding: 0 !important;
  border: 2px solid var(--col_dblue);
}
label.checkbox input[type=checkbox]::after {
  content: "";
  position: absolute;
  top: 0rem;
  left: 0.6rem;
  width: 0.9rem;
  height: 1.6rem;
  border: solid var(--col_dblue);
  border-width: 0 0.2rem 0.2rem 0;
  transform: rotate(45deg);
  opacity: 0;
  transition: opacity 0.2s ease;
}

/* チェック状態になったときだけ表示 */
label.checkbox input[type=checkbox]:checked::after {
  opacity: 1;
}

/* --------------------------------------------------------------------
  #ラジオボタン
 */
label {
  cursor: pointer;
}

input[type=radio] {
  cursor: pointer;
  display: inline-block;
  vertical-align: middle;
  margin: 0;
  border: 2px solid var(--col_dblue);
  border-radius: 50%;
  background: #fff;
  width: 2.2rem;
  height: 2.2rem;
  margin-right: 0.7em;
  transform: translateY(-0.1em);
}
@media print, screen and (min-width:813px) {
  input[type=radio] {
    width: 2.5rem;
    height: 2.5rem;
    margin-right: 0.7em;
    transform: translateY(-0.1em);
  }
}

input[type=radio]:checked {
  position: relative;
}
input[type=radio]:checked::before, input[type=radio]:checked::after {
  position: absolute;
  font-size: 14px;
  left: 17%;
  top: 17%;
  width: 66%;
  height: 66%;
  background: var(--col_dblue);
  content: "";
  border-radius: 50%;
}

/* --------------------------------------------------------------------
  #select
 */
.select-wrap {
  position: relative;
}
.select-wrap::after {
  content: "";
  display: block;
  position: absolute;
  width: 2rem;
  height: 2rem;
  pointer-events: none;
  right: 1.5rem;
  top: calc(50% - 1rem);
  transform: rotate(90deg);
  opacity: 0.2;
}
@media print, screen and (min-width:813px) {
  .select-wrap::after {
    right: 1.6rem;
  }
}

.select-wrap .error {
  position: absolute;
  left: 0;
}

select {
  height: var(--form-height-sp);
  width: 100%;
  border-radius: 0.6rem;
  letter-spacing: 0.05em;
  background-color: #fff;
  border: 1px solid var(--form-input-border-color);
  padding: 0 10px;
  font-size: 1.6rem;
}
@media print, screen and (min-width:813px) {
  select {
    height: var(--form-height-pc);
  }
}

/**
  フォームボタン
 */
.form-buttons {
  margin-top: 4rem;
  justify-content: center;
  display: flex;
  gap: 5%;
}
.form-buttons > li {
  flex: 1;
  text-align: center;
}
.form-buttons > li button {
  max-width: 24rem;
  width: 100%;
}
.form-buttons button {
  transition: opacity 0.5s;
}
.form-buttons button.is-disabled {
  opacity: 0.4;
  pointer-events: none;
}
@media print, screen and (min-width:813px) {
  .form-buttons {
    margin-top: 8rem;
    gap: 1em;
  }
  .form-buttons > li {
    flex: 0;
  }
  .form-buttons > li button {
    width: 30rem;
  }
}

.form-table {
  width: 100%;
  text-align: left;
}
@media print, screen and (min-width:813px) {
  .form-table {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
  }
}

.form-table dt {
  font-family: var(--font-bold);
  font-weight: 600;
  color: var(--col_dblue);
  font-size: 1.6rem;
}
@media print, screen and (min-width:813px) {
  .form-table dt {
    width: 26rem;
    padding-top: 0.5em;
    margin-bottom: 3rem;
    display: flex;
    align-items: center;
  }
}

/* form dl dt:last-of-type {
	margin-bottom:0;
} */
.form-table dt i {
  display: inline-block;
  color: var(--form-required-color);
  font-style: normal;
  margin-left: 1em;
  font-family: var(--font-normal);
  font-weight: 400;
}

.form-table dd {
  font-size: 1.6rem;
  margin-bottom: 2rem;
}
@media print, screen and (min-width:813px) {
  .form-table dd {
    width: calc(100% - 26rem);
    margin-bottom: 3rem;
  }
}

@media print, screen and (min-width:813px) {
  .form-table dt:last-of-type {
    margin-bottom: 0;
  }
}

.form-table dd:last-of-type {
  margin-bottom: 0;
}

.form-table b.error {
  color: var(--form-required-color);
}

.form-table dd.error input, .form-table dd.error textarea {
  background-color: #fdf0f0 !important;
}

.form-table + #privacypolicy {
  margin-top: 2rem;
}
@media print, screen and (min-width:813px) {
  .form-table + #privacypolicy {
    margin-top: 3rem;
  }
}

/*--------------------------------
    プライバシーポリシー
--------------------------------*/
/* 本文 */
form #privacypolicy {
  padding: 1.5rem;
  border: solid 1px var(--form-privacy-border-color);
  border-radius: 2rem;
  margin-bottom: 2em;
}
@media print, screen and (min-width:813px) {
  form #privacypolicy {
    padding: 3rem;
  }
}

form #privacypolicy .privacypolicy_cnt {
  height: 20rem;
  line-height: 1.8;
  color: var(--form-privacy-text);
  text-align: justify;
  overflow-y: scroll;
  font-size: 1.2rem;
}
@media print, screen and (min-width:813px) {
  form #privacypolicy .privacypolicy_cnt {
    font-size: 1.6rem;
    padding: 3rem;
  }
}

form #privacypolicy .privacypolicy_cnt h3 {
  margin-top: 2em;
}

form #privacypolicy .privacypolicy_cnt p:not(:first-child) {
  margin-top: 1em;
}

form #privacypolicy .privacypolicy_cnt > ol,
form #privacypolicy .privacypolicy_cnt > ul {
  margin-top: 1em;
}

form #privacypolicy .privacypolicy_cnt > ol > li {
  margin-bottom: 1em;
  counter-increment: privacyNumber;
}

form #privacypolicy .privacypolicy_cnt > ol > li:last-child {
  margin-bottom: 0;
}

form #privacypolicy .privacypolicy_cnt > ol > li span {
  display: block;
  font-weight: bold;
  margin-bottom: 1em;
}

form #privacypolicy .privacypolicy_cnt > ol > li span:before {
  content: counter(privacyNumber) ".";
}

form #privacypolicy .privacypolicy_cnt > ol > li ul {
  list-style-type: disc;
  padding-left: 1.5em;
  margin-top: 1em;
}

form #privacypolicy .privacypolicy_cnt > ol > li ul li {
  margin-bottom: 0.5em;
}

form #privacypolicy .privacypolicy_cnt > ol > li ul li:last-child {
  margin-bottom: 0;
}

form #privacypolicy .privacypolicy_cnt > address:before {
  display: block;
  content: "";
  width: 20%;
  margin-bottom: 1em;
  border-bottom: solid 1px #000;
}

@media only screen and (max-width: 812px) {
  form #privacypolicy .privacypolicy_cnt {
    height: 12em;
    font-size: 1.3rem;
  }
  form #privacypolicy .privacypolicy_cnt h3 {
    font-size: 1.5rem;
  }
}
/* チェックボックス */
.privacypolicy_checkbox {
  text-align: center;
}

.privacypolicy_checkbox a {
  text-decoration: underline;
}

/* ====================================================================

  #ボタンモジュール
  style設定クラスは > .btn-inner を内包する
  ex)
  <div class="some-btn">
  <p class="btn-style-a">
    <a class="btn-inner" href="hoge">ボタン</a>
  </p>
  </div>

 */
.button-inner {
  position: relative;
  width: 100%;
  display: block;
  cursor: pointer;
}

/* --------------------------------------------------------------------
  #ボタン A - 角丸ボタン
 */
.button-a .button-inner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3.4rem;
  color: #fff;
  background-color: var(--col_orange);
  border-radius: 9999px;
  line-height: 1;
}
@media print, screen and (min-width:813px) {
  .button-a .button-inner {
    transition: 0.3s color, 0.3s background-color;
    min-height: 4.2rem;
    font-size: 1.6rem;
  }
}

.button-a.--white .button-inner {
  background-color: #fff;
  border: 1px solid #fff;
  color: var(--col_black);
}

.button-a.--red .button-inner {
  background-color: var(--col_red);
  border: 1px solid var(--col_red);
}
@media print, screen and (min-width:813px) {
  .button-a.--red .button-inner:hover {
    color: var(--col_red);
    background-color: #fff;
  }
}

.button-a.--dblue .button-inner {
  background-color: var(--col_dblue);
  border: 1px solid var(--col_dblue);
}
@media print, screen and (min-width:813px) {
  .button-a.--dblue .button-inner:hover {
    color: var(--col_dblue);
    background-color: #fff;
  }
}

.button-a.--blue .button-inner {
  border: 1px solid var(--col_blue);
  background-color: var(--col_blue);
}
@media print, screen and (min-width:813px) {
  .button-a.--blue .button-inner:hover {
    color: var(--col_blue);
    background-color: #fff;
  }
}

.button-a.--brown .button-inner {
  background-color: var(--col_brown);
  border: 1px solid var(--col_brown);
}
@media print, screen and (min-width:813px) {
  .button-a.--brown .button-inner:hover {
    color: var(--col_brown);
    background-color: #fff;
  }
}

/**
  フォーム用ボタン
 */
/* ==========================================================================
   project
   ========================================================================== */
/* ====================================================================

  うぶやの人びと
  カード

 */
.card {
  position: relative;
  padding: 0 1.2rem;
}
@media print, screen and (min-width:813px) {
  .card {
    padding: 0 1.75rem;
  }
  .card:hover .card__pict img {
    transform: scale3d(1.05, 1.05, 1);
  }
  .card:hover .card__heading {
    opacity: 0.75;
  }
}

.card__link {
  display: block;
}
.card__link::before {
  content: "";
  position: absolute;
  left: 2rem;
  top: 0;
  width: calc(100% - 2.8rem);
  height: 100%;
}

.card__pict {
  aspect-ratio: 0.9090909091;
  display: block;
  border-radius: 2rem;
  overflow: hidden;
}
@supports not (aspect-ratio: auto) {
  .card__pict {
    position: relative;
  }
  .card__pict::before {
    float: left;
    content: "";
    padding-top: 110%;
  }
  .card__pict::after {
    display: block;
    content: "";
    clear: both;
  }
  .card__pict > img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}
.card__pict img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.3s transform;
}

.card-content {
  position: relative;
  z-index: 2;
  background-color: #fff;
  border-radius: 0 2rem 2rem 2rem;
  padding: 2rem;
  width: calc(100% - 1rem);
  margin: -2.4rem 0 0 1.6rem;
}
.card-content::before {
  display: block;
  content: "";
  position: absolute;
  width: 1.6rem;
  height: 2.6rem;
  background-color: #ffffff;
  clip-path: polygon(0% 0%, 100% 50%, 0% 100%);
  left: 0;
  top: -1.3rem;
}
@media print, screen and (min-width:813px) {
  .card-content {
    width: calc(100% - 1.2rem);
    margin: -4rem 0 0 2rem;
    padding: 2rem 3rem;
  }
  .card-content::before {
    width: 2.4rem;
    height: 3.6rem;
    top: -1.8rem;
  }
}

.card__heading {
  font-size: 1.5rem;
  line-height: 1.4;
  font-family: var(--font-bold);
  font-weight: 600;
}
.card__heading > a {
  display: block;
}
.card__heading > a::before {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.card__heading::after {
  content: "";
  display: block;
  position: absolute;
  background-color: rgba(0, 0, 0, 0.2);
  width: 100%;
}
@media print, screen and (min-width:813px) {
  .card__heading {
    font-size: 2rem;
  }
}

.card__subtit {
  font-size: 1.3rem;
  margin-top: 0.8rem;
  line-height: 1.5;
}
@media print, screen and (min-width:813px) {
  .card__subtit {
    margin-top: 1rem;
    font-size: 1.6rem;
  }
}

.card__category {
  position: relative;
  z-index: 5;
  display: inline-block;
  color: #fff;
  background-color: #999;
  line-height: 1;
  font-size: 1.3rem;
  padding: 0.3rem 1rem;
  margin-top: 0.8rem;
}
@media print, screen and (min-width:813px) {
  .card__category {
    margin-top: 1rem;
    font-size: 1.3rem;
    padding: 0.5rem 1.2rem;
    transition: 0.3s opacity;
  }
  .card__category:hover {
    opacity: 0.75;
  }
}

.card__tag {
  margin-top: 0.9rem;
  position: relative;
  z-index: 5;
}
@media print, screen and (min-width:813px) {
  .card__tag {
    margin-top: 1.2rem;
  }
}

/**
  カラーバリエーション
 */
.card.job .card__category {
  background-color: var(--col_cat-job--dark);
}

.card.project .card__category {
  background-color: var(--col_cat-project--dark);
}

.card.system .card__category {
  background-color: var(--col_cat-system--dark);
}

.card.about .card__category {
  background-color: var(--col_cat-about--dark);
}

/**
  voice 一覧リストサイズ
 */
@media only screen and (max-width: 812px) {
  .card.--small {
    padding: 0;
  }
  .card.--small .card-content {
    padding: 1rem 0.7rem 1.5rem;
  }
  .card.--small .card__heading {
    font-size: 1.3rem;
  }
  .card.--small .card__subtit {
    font-size: 1.1rem;
    margin-top: 0.5rem;
  }
  .card.--small .card__category {
    margin-top: 0.5rem;
    font-size: 1.1rem;
    padding: 0.3rem 0.7rem;
  }
  .card.--small .card__tag {
    margin-top: 0.3rem;
  }
  .card.--small .card-content {
    margin: -2rem 0 0 0;
    width: auto;
  }
}
@media print, screen and (min-width:813px) {
  .card.--small .card__heading {
    font-size: 1.6rem;
  }
  .card.--small .card__subtit {
    font-size: 1.4rem;
  }
}

/**
  voice ヒーロースライダーのサイズ
 */
@media print, screen and (min-width:813px) {
  .card.--voice-hero {
    padding: 0 4rem;
  }
  .card.--voice-hero .card__pict {
    aspect-ratio: 1.3333333333;
  }
  @supports not (aspect-ratio: auto) {
    .card.--voice-hero .card__pict {
      position: relative;
    }
    .card.--voice-hero .card__pict::before {
      float: left;
      content: "";
      padding-top: 75%;
    }
    .card.--voice-hero .card__pict::after {
      display: block;
      content: "";
      clear: both;
    }
    .card.--voice-hero .card__pict > img {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }
  .card.--voice-hero .card-content {
    width: calc(100% - 6em);
    margin: -12rem 0 0 12rem;
  }
}

/**
  ショルダーの new タグ
 */
.card.new-tag {
  position: relative;
}
.card.new-tag::before {
  position: absolute;
  z-index: 2;
  content: "NEW";
  font-family: "Outfit", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  rotate: -45deg;
  transform-origin: 50% 0;
  color: #fff;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: 0;
  font-size: 1.4rem;
  left: -2.8rem;
  width: 8rem;
  height: 4rem;
  background-color: #F46D72;
  clip-path: polygon(50% 0%, 100% 100%, 0% 100%);
}
@media print, screen and (min-width:813px) {
  .card.new-tag::before {
    left: -2.3rem;
    /*      font-size: 1.4rem;
          width: 8rem;
          height: 4rem;*/
    padding-bottom: 0;
  }
}

@media only screen and (max-width: 812px) {
  .card.--small.new-tag::before {
    left: -4rem;
  }
}

.card.--voice-hero.new-tag::before {
  padding-bottom: 0;
  left: -2.8rem;
  font-size: 1.4rem;
  width: 8rem;
  height: 4rem;
}
@media print, screen and (min-width:813px) {
  .card.--voice-hero.new-tag::before {
    left: -2rem;
    width: 12rem;
    height: 6rem;
    padding-bottom: 0;
    font-size: 1.8rem;
  }
}

/* ====================================================================

  汎用タグリスト

 */
.tag-list {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
}
@media print, screen and (min-width:813px) {
  .tag-list {
    gap: 0.6rem;
  }
}

.tag-list > li {
  line-height: 1.2;
  font-size: 1.1rem;
}
.tag-list > li > a {
  display: block;
}
.tag-list > li > a::before {
  content: "#";
}
@media print, screen and (min-width:813px) {
  .tag-list > li {
    font-size: 1.3rem;
  }
  .tag-list > li > a {
    transition: 0.3s opacity;
  }
  .tag-list > li > a:hover {
    opacity: 0.75;
  }
}

.tag-list.--small {
  gap: 0.3em;
}
.tag-list.--small > li {
  font-size: 1.1rem;
}
@media print, screen and (min-width:813px) {
  .tag-list.--small {
    gap: 0.6em;
  }
  .tag-list.--small > li {
    font-size: 1.3rem;
  }
}

.tag-list.--large > li {
  font-size: 1.4rem;
}
.tag-list.--large > li > a {
  background-color: var(--col_lblue);
  padding: 0.4rem 0.8rem;
}

/**
  カラーバリエーション
 */
.card.job .tag-list > li > a {
  color: var(--col_cat-job--dark);
}

.card.project .tag-list > li > a {
  color: var(--col_cat-project--dark);
}

.card.system .tag-list > li > a {
  color: var(--col_cat-system--dark);
}

.card.about .tag-list > li > a {
  color: var(--col_cat-about--dark);
}

.section {
  padding: 6rem 0;
}
@media print, screen and (min-width:813px) {
  .section {
    padding: 12rem 0;
  }
}

.section-curve {
  width: calc(100% + 10px);
  margin-left: -5px;
  height: 3.2rem;
  overflow: hidden;
  position: relative;
  z-index: 1;
  margin-top: -3.2rem;
  margin-bottom: -2px;
  transform-origin: 50% 100%;
  transition: transform 0.4s;
}
.section-curve svg {
  width: 100%;
  height: 100%;
  display: block;
  fill: #ddd;
}
@media print, screen and (min-width:813px) {
  .section-curve {
    height: 12.8rem;
    margin-top: -12.5rem;
  }
}

.section-curve.--invert {
  margin-top: -2px;
}
.section-curve.--invert svg {
  transform: scale3d(1, -1, 1);
}

.section-curve.--beige svg {
  fill: #FEF3E7;
}

.section-curve.--blue svg {
  fill: var(--col_blue);
}

.cta {
  background-color: #DAEAEF;
  padding: 2.4rem 0;
}
@media print, screen and (min-width:813px) {
  .cta {
    padding: 4.5rem 0 7rem;
  }
}

.cta__nav > li > a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.1rem;
  border-radius: 2rem;
  background-color: #fff;
  min-height: 7.2rem;
}
.cta__nav > li > a::after {
  content: "";
  display: block;
  position: absolute;
  width: 0.9rem;
  height: 1.7rem;
  right: 4rem;
  mask: url(../img/ic_arrow_a.svg) no-repeat center center/contain;
  background-color: #ddd;
}
.cta__nav > li.--orange > a {
  color: var(--col_orange);
  border: 2px solid var(--col_orange);
}
.cta__nav > li.--orange > a::after {
  background-color: var(--col_orange);
}
@media print, screen and (min-width:813px) {
  .cta__nav > li.--orange > a:hover {
    color: #fff;
    background-color: var(--col_orange);
  }
  .cta__nav > li.--orange > a:hover::after {
    background-color: #fff;
  }
}
.cta__nav > li.--blue > a {
  color: var(--col_blue);
  border: 2px solid var(--col_blue);
}
.cta__nav > li.--blue > a::after {
  background-color: var(--col_blue);
}
@media print, screen and (min-width:813px) {
  .cta__nav > li.--blue > a:hover {
    color: #fff;
    background-color: var(--col_blue);
  }
  .cta__nav > li.--blue > a:hover::after {
    background-color: #fff;
  }
}
@media only screen and (max-width: 812px) {
  .cta__nav > li:not(:last-child) {
    margin-bottom: 1rem;
  }
}
@media print, screen and (min-width:813px) {
  .cta__nav {
    display: flex;
    gap: 2.5rem;
  }
  .cta__nav > li {
    flex: 1;
  }
  .cta__nav > li > a {
    border: 2px solid #ddd;
    font-size: 2.4rem;
    min-height: 10rem;
    transition: 0.3s;
  }
  .cta__nav > li > a::after {
    transition: 0.3s;
    right: 3rem;
    width: 1.1rem;
    height: 2.2rem;
  }
}

.cta__entry {
  position: relative;
  border-radius: 2rem;
  display: flex;
  overflow: hidden;
  align-items: center;
  justify-content: center;
  margin-top: 2rem;
}
.cta__entry > p {
  position: absolute;
  z-index: 2;
  font-family: var(--font-bold);
  font-weight: 600;
  font-weight: 700;
  font-size: 2.1rem;
  color: #fff;
  letter-spacing: 0.1em;
}
.cta__entry::before {
  content: "";
  display: block;
  position: absolute;
  z-index: 3;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3);
  transition: opacity 0.3s;
}
.cta__entry::after {
  content: "";
  display: block;
  position: absolute;
  width: 0.9rem;
  height: 1.7rem;
  right: 2rem;
  background-color: #fff;
  mask: url(../img/ic_arrow_b.svg) no-repeat center center/contain;
}
.cta__entry > picture {
  position: relative;
  z-index: 1;
  display: block;
  transition: transform 0.3s;
}
@media print, screen and (min-width:813px) {
  .cta__entry {
    margin-top: 2.8rem;
  }
  .cta__entry > p {
    font-size: 3rem;
  }
  .cta__entry::after {
    width: 1.4rem;
    height: 2.8rem;
    right: 5rem;
  }
  .cta__entry:hover::before {
    opacity: 0;
  }
  .cta__entry:hover picture {
    transform: scale3d(1.05, 1.05, 1);
  }
}

.faq-list > li {
  border: 1px solid var(--col_blue);
  background-color: #fff;
  border-radius: 2rem;
  padding: 1.8rem 4rem 1.3rem;
}
.faq-list > li:not(:last-child) {
  margin-bottom: 1rem;
}
@media print, screen and (min-width:813px) {
  .faq-list > li {
    padding: 2rem 15rem 1.2rem;
  }
  .faq-list > li:not(:last-child) {
    margin-bottom: 2rem;
  }
}

.faq__heading {
  color: var(--col_blue);
  position: relative;
  padding-bottom: 0.5rem;
}
.faq__heading > span {
  position: relative;
}
.faq__heading > span::before {
  content: "";
  display: block;
  position: absolute;
  content: "Q.";
  top: -0.6rem;
  left: -1.5em;
}
.faq__heading::after {
  content: "";
  display: block;
  position: absolute;
  width: calc(100% + 4rem);
  height: 1px;
  bottom: 0;
  left: -2rem;
  background-color: var(--col_blue);
  transform: scale3d(0, 1, 1);
  transition: transform 0.6s;
  transition-timing-function: cubic-bezier(0.6, 0, 0.28, 1);
  transform-origin: 0 0;
}
.faq__heading::before {
  content: "";
  display: block;
  position: absolute;
  width: 0.8rem;
  height: 1.6rem;
  right: -1.5rem;
  top: calc(50% - 1.2rem);
  background-color: var(--col_blue);
  mask: url(../img/ic_arrow_a.svg) no-repeat center center/contain;
  transform: rotate(90deg);
  transition: transform 0.6s;
}
.faq__heading.is-active::after {
  transform: scale3d(1, 1, 1);
}
.faq__heading.is-active::before {
  transform: rotate(270deg);
}
@media print, screen and (min-width:813px) {
  .faq__heading {
    font-size: 2.1rem;
    padding-bottom: 1rem;
    transition: 0.3s opacity;
  }
  .faq__heading:hover {
    opacity: 0.75;
  }
  .faq__heading > span::before {
    top: -0.8rem;
  }
  .faq__heading:hover {
    opacity: 0.5;
  }
  .faq__heading::after {
    width: calc(100% + 18rem);
    left: -9rem;
  }
  .faq__heading::before {
    width: 1.2rem;
    height: 2.4rem;
    right: -7rem;
    top: calc(50% - 1.5rem);
  }
}

.faq-content {
  position: relative;
  width: calc(100% + 2em);
  margin-left: -2em;
  padding: 1rem 0 1rem 2em;
  text-align: justify;
  text-justify: inter-ideograph;
}
.faq-content::before {
  content: "";
  display: block;
  position: absolute;
  content: "A.";
  left: 0.5em;
  right: -7rem;
  width: 1rem;
  height: 2rem;
}
@media print, screen and (min-width:813px) {
  .faq-content::before {
    top: 1.6rem;
    font-size: 2.1rem;
  }
}
@media print, screen and (min-width:813px) {
  .faq-content {
    padding: 2rem 0 2rem 2em;
  }
  .faq-content::before {
    left: 0;
    font-size: 2.1rem;
  }
}

.faq__text {
  position: relative;
}

/* ====================================================================

  トップ MV

 */
.top-mv {
  position: relative;
}
.top-mv video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media only screen and (max-width: 812px) {
  .top-mv .top-mv__video {
    width: 100%;
    height: 100vh;
    height: 100dvh;
  }
}
@media print, screen and (min-width:813px) {
  .top-mv .top-mv__video {
    aspect-ratio: 1.77;
  }
  @supports not (aspect-ratio: auto) {
    .top-mv .top-mv__video {
      position: relative;
    }
    .top-mv .top-mv__video::before {
      float: left;
      content: "";
      padding-top: 56.5%;
    }
    .top-mv .top-mv__video::after {
      display: block;
      content: "";
      clear: both;
    }
    .top-mv .top-mv__video > img {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }
}

.top-mv__script {
  position: absolute;
  width: 30rem;
  right: 1.5rem;
  bottom: 5rem;
}
@media print, screen and (min-width:813px) {
  .top-mv__script {
    width: 46.2rem;
    right: 9.6rem;
    bottom: 4.4rem;
  }
}

.top-image-slide {
  position: relative;
  z-index: 10;
}
.top-image-slide li {
  display: block !important;
}

/**
  エントリーボタン
 */
.top-mv__button {
  position: absolute;
  display: none;
}
@media print, screen and (min-width:813px) {
  .top-mv__button {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-family: var(--font-bold);
    font-weight: 600;
    color: #fff;
    background-color: var(--col_orange);
    left: 2rem;
    bottom: 2rem;
    width: 16.6rem;
    height: 16.6rem;
    font-size: 2.1rem;
    border-radius: 50%;
    transition: 0.3s color, 0.3s background-color;
  }
  .top-mv__button:hover {
    background-color: #fff;
    color: var(--col_orange);
  }
}

.top-layer-particle {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  pointer-events: none;
  overflow: hidden;
  z-index: 10; /* 必要に応じて調整 */
}

.particle {
  position: absolute;
  width: 20px;
  height: 40px;
  transition: 1s opacity;
  /*  &.ef-additional svg {
      transition: 0s;
    }*/
}
.particle span {
  display: block;
  transition: 0.8s;
}
.particle svg {
  width: 100%;
  height: 100%;
  transition: transform 1s;
  will-change: transform;
  backface-visibility: hidden;
}
.particle.ef-anim-in {
  /* svg {
     transition: none;
   }*/
}
.particle.ef-io {
  opacity: 0;
}
.particle.ef-io span {
  transform: translate3d(0, -15rem, 0);
}
@media only screen and (max-width: 812px) {
  .particle.ef-io span {
    transform: translate3d(0, -14rem, 0);
  }
}
@media print, screen and (min-width:813px) {
  .particle {
    width: 20px;
    height: 40px;
  }
}

/* ====================================================================

  トップ コンテンツのレイヤー
  コンテンツ / パーティクル / 背景
  を実装する

 */
.top-layer-container {
  position: relative;
}

.top-layer-particle {
  position: absolute;
  z-index: 3;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.top-layer-front {
  position: relative;
  z-index: 10;
}

.top-layer-bg {
  z-index: 1;
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
}

/* ====================================================================

  トップ イントロエリア

 */
.top-intro {
  padding: 8rem 0 12rem;
}
.top-intro p {
  text-align: center;
  color: #fff;
  font-family: var(--font-bold);
  font-weight: 600;
  letter-spacing: 0.1em;
}
.top-intro p:not(:last-child) {
  margin-bottom: 2em;
}
@media print, screen and (min-width:813px) {
  .top-intro {
    padding: 10rem 0 24rem;
  }
}

.top-intro-bg {
  background: linear-gradient(0deg, #FF3838, #FF7233);
}

/* ====================================================================

  トップ うぶやを知る

 */
.top-about {
  padding: 8rem 0 12rem;
}
.top-about p {
  letter-spacing: 0.1em;
}
.top-about picture {
  display: block;
}
@media print, screen and (min-width:813px) {
  .top-about {
    padding-top: 0;
    padding-bottom: 24rem;
  }
}

.top-about-bg {
  background-color: #FEF3E7;
}

.top-about-block {
  position: relative;
}
@media only screen and (max-width: 812px) {
  .top-about-block + .top-about-block {
    margin-top: 11rem;
  }
}
@media print, screen and (min-width:813px) {
  .top-about-block {
    display: flex;
    margin-top: 14rem;
  }
}

.top-about-block__heading {
  position: absolute;
  z-index: 3;
  top: -4rem;
  left: 1.5rem;
}
@media print, screen and (min-width:813px) {
  .top-about-block__heading {
    left: auto;
    right: -7rem;
    top: -4rem;
  }
}

.top-about__pict {
  position: relative;
}
@media print, screen and (min-width:813px) {
  .top-about__pict {
    width: 59%;
  }
  .top-about__pict img {
    transition: 0.3s transform;
  }
  .top-about__pict:hover img {
    transform: scale3d(1.05, 1.05, 1);
  }
}

@media only screen and (max-width: 812px) {
  .top-about-content {
    padding-top: 2rem;
  }
  .top-about-content > p {
    text-align: center;
  }
}
@media print, screen and (min-width:813px) {
  .top-about-content {
    flex: 1;
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding-left: 6%;
    padding-top: 4rem;
  }
}

@media only screen and (max-width: 812px) {
  .top-about__button {
    max-width: 24rem;
    margin-left: auto;
    margin-right: auto;
    margin-top: 1.5rem;
  }
}
@media print, screen and (min-width:813px) {
  .top-about__button {
    margin-top: 4rem;
    max-width: 30rem;
  }
}

/**
  反転
 */
.top-about-block.--invert {
  position: relative;
}
@media print, screen and (min-width:813px) {
  .top-about-block.--invert {
    flex-direction: row-reverse;
  }
  .top-about-block.--invert .top-about-block__heading {
    right: auto;
    left: -7rem;
  }
  .top-about-block.--invert .top-about-content {
    flex: inherit;
    width: calc(30rem + 6%);
    padding-left: 0;
  }
}

/* ====================================================================

  トップ うぶやの人びと

 */
.top-people {
  position: relative;
  letter-spacing: 0.1em;
  padding: 7rem 0 16rem;
  background-color: var(--col_blue);
}
.top-people > p {
  color: #fff;
}
@media print, screen and (min-width:813px) {
  .top-people {
    padding: 0 0 0 0;
  }
}

.top-people-bg {
  background-color: var(--col_blue);
  position: relative;
  z-index: 3;
}

.top-people__heading {
  color: #fff;
}
.top-people__heading > em {
  margin-left: auto;
  margin-right: auto;
  width: 30.4rem;
}
@media print, screen and (min-width:813px) {
  .top-people__heading > em {
    width: 47.5rem;
  }
}

@media only screen and (max-width: 812px) {
  .top-people-list {
    margin-left: -1.5rem;
    margin-right: -1.5rem;
  }
  .top-people-list .slick-prev::before,
  .top-people-list .slick-next::before {
    top: calc(50% + 7rem);
  }
  .top-people-list .slick-prev {
    left: 5.5rem;
  }
  .top-people-list .slick-next {
    right: 5.5rem;
  }
}
@media print, screen and (min-width:813px) {
  .top-people-list {
    display: flex;
    width: 110rem;
    margin-left: auto;
    margin-right: auto;
  }
  .top-people-list .card {
    width: 33.3%;
  }
  .top-people-list .slick-prev::before,
  .top-people-list .slick-next::before {
    width: 2.2rem;
    height: 4.4rem;
    top: calc(50% + 2rem);
  }
  .top-people-list .slick-prev {
    left: -2rem;
  }
  .top-people-list .slick-next {
    right: -2rem;
  }
}

.top-people__button {
  position: relative;
  z-index: 10;
  margin-left: auto;
  margin-right: auto;
  max-width: 24rem;
  margin-top: 3rem;
}
@media print, screen and (min-width:813px) {
  .top-people__button {
    max-width: 30rem;
    margin-top: 5rem;
  }
}

.top-people__button.button-a .button-inner {
  color: var(--col_blue);
  border: 1px solid #fff;
}
@media print, screen and (min-width:813px) {
  .top-people__button.button-a .button-inner:hover {
    color: #fff;
    background-color: var(--col_blue);
  }
}

/**
  イラスト
 */
.top-people__fig {
  position: absolute;
  pointer-events: none;
  z-index: 5;
}

.top-people__fig.--fig01 {
  width: 12.8rem;
  top: -4rem;
  right: 2rem;
}
@media print, screen and (min-width:813px) {
  .top-people__fig.--fig01 {
    width: 18.4rem;
    top: -15rem;
    right: calc(50% + 20rem);
  }
}

.top-people__fig.--fig02 {
  width: 6.8rem;
  left: 3.4rem;
  top: -3rem;
}
@media print, screen and (min-width:813px) {
  .top-people__fig.--fig02 {
    width: 11.1rem;
    top: -2rem;
    left: auto;
    right: calc(50% + 40rem);
  }
}

.top-people__fig.--fig03 {
  display: none;
}
@media print, screen and (min-width:813px) {
  .top-people__fig.--fig03 {
    display: block;
    width: 11.1rem;
    top: -2rem;
    left: calc(50% + 32rem);
  }
}

.top-people__fig.--fig04 {
  width: 10.5rem;
  right: 3rem;
  bottom: 4rem;
}
@media print, screen and (min-width:813px) {
  .top-people__fig.--fig04 {
    width: 16.2rem;
    bottom: -5rem;
    right: calc(50% + 32rem);
  }
}

.top-people__fig.--fig05 {
  width: 14.8rem;
  left: 3rem;
  bottom: 1rem;
}
@media print, screen and (min-width:813px) {
  .top-people__fig.--fig05 {
    width: 22.2rem;
    bottom: -8.5rem;
    left: calc(50% + 28rem);
  }
}

/* ====================================================================

  トップ うぶやのお仕事

 */
.top-career {
  padding: 12rem 0 12rem;
}
@media print, screen and (min-width:813px) {
  .top-career {
    margin-top: -13rem;
    padding: 36rem 0 18rem;
  }
}

.top-career-bg {
  margin-top: -3.5rem;
  background: url(../img/bg_ptn.png) repeat center center/5.6rem auto;
}
@media print, screen and (min-width:813px) {
  .top-career-bg {
    margin-top: -13rem;
  }
}

.top-carrer-block {
  position: relative;
  display: flex;
  background-color: var(--col_blue);
  border-radius: 2rem;
  overflow: hidden;
  color: #fff;
}
@media only screen and (max-width: 812px) {
  .top-carrer-block + .top-carrer-block {
    margin-top: 1.5rem;
  }
}
@media print, screen and (min-width:813px) {
  .top-carrer-block + .top-carrer-block {
    margin-top: 2.5rem;
  }
  .top-carrer-block:hover .button-inner {
    color: #fff !important;
    background-color: var(--col_blue);
  }
  .top-carrer-block:hover img {
    transform: scale3d(1.05, 1.05, 1);
  }
}

.job-career-block + .job-career-block {
  margin-top: 2rem;
}
@media print, screen and (min-width:813px) {
  .job-career-block + .job-career-block {
    margin-top: 3rem;
  }
}

.top-career-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 50%;
}
.top-career-content p {
  letter-spacing: 0.1em;
}
@media only screen and (max-width: 812px) {
  .top-career-content {
    text-align: center;
  }
}
@media print, screen and (min-width:813px) {
  .top-career-content {
    align-items: flex-start;
    width: 43.8rem;
    padding-left: 7rem;
  }
}

.top-career__pict {
  flex: 1;
  overflow: hidden;
}
.top-career__pict img {
  transition: 0.3s transform;
}

.top-career__heading {
  font-family: var(--font-bold);
  font-weight: 600;
  font-size: 1.6rem;
  letter-spacing: 0.1em;
  line-height: 1;
  margin-bottom: 1.2rem;
}
@media print, screen and (min-width:813px) {
  .top-career__heading {
    font-size: 2.4rem;
    margin-bottom: 2.5rem;
  }
}

.top-career__button {
  width: 12.4rem;
  margin-top: 1.2rem;
}
.top-career__button.button-a .button-inner {
  border: 1px solid #fff;
  color: var(--col_blue);
}
@media print, screen and (min-width:813px) {
  .top-career__button {
    margin-top: 3rem;
    width: 30rem;
  }
  .top-career__button .button-inner:hover {
    color: #fff;
    background-color: var(--col_blue);
  }
}

/* ====================================================================

  トップ FAQ

 */
.top-faq {
  background-color: var(--col_beige);
  padding: 6rem 0 7rem;
}
@media print, screen and (min-width:813px) {
  .top-faq {
    padding: 12rem 0 17rem;
  }
}

.top-faq__button {
  margin-top: 2rem;
  max-width: 24rem;
  margin-left: auto;
  margin-right: auto;
}
@media print, screen and (min-width:813px) {
  .top-faq__button {
    margin-top: 6rem;
    max-width: 30rem;
  }
}

.second-mv {
  position: relative;
}

.second-intro {
  text-align: center;
  padding: 5rem 0 8rem;
}
@media print, screen and (min-width:813px) {
  .second-intro {
    padding: 8rem 0 12rem;
  }
}

.second-intro > p {
  font-family: var(--font-bold);
  font-weight: 600;
  letter-spacing: 0.1em;
  line-height: 2;
}
.second-intro > p:not(:last-child) {
  margin-bottom: 2rem;
}
@media print, screen and (min-width:813px) {
  .second-intro > p:not(:last-child) {
    margin-bottom: 3rem;
  }
}

.second-intro__pict {
  margin-left: auto;
  margin-right: auto;
  display: block;
}
@media print, screen and (min-width:813px) {
  .second-intro__pict {
    max-width: 90rem;
    margin-top: 6rem;
  }
}

/********************************************************
  バリエーション
 */
/**
  うぶやについて
 */
.second-intro.--about {
  color: #fff;
  background-color: #E84D4F;
  position: relative;
  z-index: 3;
}
.second-intro.--about::after {
  content: "";
  display: block;
  position: absolute;
  pointer-events: none;
  width: 100%;
  height: 8vw;
  background-color: #E84D4F;
  bottom: -8vw;
  mask: url(../img/sec_shape_mask_sp.svg) no-repeat center top/100% auto;
}
@media print, screen and (min-width:813px) {
  .second-intro.--about::after {
    height: 10vw;
    bottom: calc(-10vw + 1px);
    mask-image: url(../img/sec_shape_mask.svg);
  }
}
@media only screen and (max-width: 812px) {
  .second-intro.--about {
    padding: 7rem 0 6rem;
  }
}
@media print, screen and (min-width:813px) {
  .second-intro.--about {
    padding-bottom: 10rem;
  }
}

/**
  うぶやの働き方
 */
.second-intro.--job {
  color: #fff;
  background-color: var(--col_dblue);
  position: relative;
  z-index: 3;
}
.second-intro.--job::after {
  content: "";
  display: block;
  position: absolute;
  pointer-events: none;
  width: 100%;
  height: 8vw;
  background-color: var(--col_dblue);
  bottom: -8vw;
  mask: url(../img/sec_shape_mask_sp.svg) no-repeat center top/100% auto;
}
@media print, screen and (min-width:813px) {
  .second-intro.--job::after {
    height: 10vw;
    bottom: calc(-10vw + 1px);
    mask-image: url(../img/sec_shape_mask.svg);
  }
}
@media only screen and (max-width: 812px) {
  .second-intro.--job {
    padding: 5rem 0 6rem;
  }
}
@media print, screen and (min-width:813px) {
  .second-intro.--job {
    padding-bottom: 9rem;
  }
}

/**
  うぶやの制度
 */
.second-intro.--system {
  color: #fff;
  position: relative;
  z-index: 3;
}
.second-intro.--system::after {
  content: "";
  display: block;
  position: absolute;
  pointer-events: none;
  width: 100%;
  height: 8vw;
  background-color: var(--col_brown);
  bottom: -8vw;
  mask: url(../img/sec_shape_mask_sp.svg) no-repeat center top/100% auto;
}
@media print, screen and (min-width:813px) {
  .second-intro.--system::after {
    height: 10vw;
    bottom: calc(-10vw + 1px);
    mask-image: url(../img/sec_shape_mask.svg);
  }
}
@media only screen and (max-width: 812px) {
  .second-intro.--system {
    padding: 4rem 0;
    z-index: 8;
  }
}
@media print, screen and (min-width:813px) {
  .second-intro.--system {
    padding: 6rem 0;
  }
}

/**
  採用情報エントリー
 */
.second-intro.--entry {
  color: var(--col_dblue);
}
@media only screen and (max-width: 812px) {
  .second-intro.--entry {
    padding: 5rem 3rem 8rem;
    text-align: justify;
    text-justify: inter-ideograph;
  }
}
@media print, screen and (min-width:813px) {
  .second-intro.--entry {
    padding-bottom: 2rem;
  }
}

/* ====================================================================

  うぶやの人びと
  ヘッドエリア

 */
.voice-head {
  text-align: center;
  position: relative;
}

.voice-head__text {
  color: #fff;
}

.voice-head__heading {
  margin-left: auto;
  margin-right: auto;
  width: 30.4rem;
}
@media print, screen and (min-width:813px) {
  .voice-head__heading {
    margin-top: 4rem;
    width: 47.5rem;
  }
}

.voice-head__illust1,
.voice-head__illust2 {
  position: absolute;
}
@media only screen and (max-width: 812px) {
  .voice-head__illust1,
  .voice-head__illust2 {
    display: none;
  }
}

@media print, screen and (min-width:813px) {
  .voice-head__illust1 {
    width: 8.9rem;
    right: calc(50% + 33rem);
    top: -6rem;
  }
}

@media print, screen and (min-width:813px) {
  .voice-head__illust2 {
    width: 14.8rem;
    left: calc(50% + 34rem);
    top: 3rem;
  }
}

/* ====================================================================

  うぶやの人びと
  上部ローカルナビエリア

 */
.voice-nav {
  position: relative;
  background-color: #fff;
  border-radius: 1.6rem;
  margin-top: 3.5rem;
  padding: 0 2rem;
}
@media print, screen and (min-width:813px) {
  .voice-nav {
    margin-top: 7rem;
    padding: 0 4.5rem;
    max-width: 100rem;
    margin-left: auto;
    margin-right: auto;
  }
}

.voice-nav__nav {
  display: flex;
}
.voice-nav__nav > li > a {
  display: flex;
  align-items: center;
  justify-content: center;
}
.voice-nav__nav > li.is-active > a {
  color: #fff;
  background-color: #eee;
}
@media only screen and (max-width: 812px) {
  .voice-nav__nav {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
  }
  .voice-nav__nav > li:first-child {
    display: none;
  }
  .voice-nav__nav > li {
    width: calc(50% - 0.5em);
  }
  .voice-nav__nav > li > a {
    min-height: 5rem;
    background-color: #eee;
    border-radius: 1rem;
    color: #fff;
  }
}
@media print, screen and (min-width:813px) {
  .voice-nav__nav {
    margin-right: 2rem;
  }
  .voice-nav__nav > li {
    flex: 1;
  }
  .voice-nav__nav > li > a {
    min-height: 5rem;
    transition: 0.3s;
  }
  .voice-nav__nav > li:hover > a {
    color: #fff;
  }
}

/**
  ナビゲーションカラーバリエーション
 */
@media only screen and (max-width: 812px) {
  .voice-nav__nav > li.all > a {
    background-color: var(--col_cat-all);
  }
}
@media print, screen and (min-width:813px) {
  .voice-nav__nav > li.all.is-active > a {
    background-color: var(--col_cat-all);
  }
  .voice-nav__nav > li.all:hover > a {
    background-color: var(--col_cat-all);
  }
}

@media only screen and (max-width: 812px) {
  .voice-nav__nav > li.job > a {
    background-color: var(--col_cat-job);
  }
}
@media print, screen and (min-width:813px) {
  .voice-nav__nav > li.job.is-active > a {
    background-color: var(--col_cat-job);
  }
  .voice-nav__nav > li.job:hover > a {
    background-color: var(--col_cat-job);
  }
}

@media only screen and (max-width: 812px) {
  .voice-nav__nav > li.project > a {
    background-color: var(--col_cat-project);
  }
}
@media print, screen and (min-width:813px) {
  .voice-nav__nav > li.project.is-active > a {
    background-color: var(--col_cat-project);
  }
  .voice-nav__nav > li.project:hover > a {
    background-color: var(--col_cat-project);
  }
}

@media only screen and (max-width: 812px) {
  .voice-nav__nav > li.system > a {
    background-color: var(--col_cat-system);
  }
}
@media print, screen and (min-width:813px) {
  .voice-nav__nav > li.system.is-active > a {
    background-color: var(--col_cat-system);
  }
  .voice-nav__nav > li.system:hover > a {
    background-color: var(--col_cat-system);
  }
}

@media only screen and (max-width: 812px) {
  .voice-nav__nav > li.about > a {
    background-color: var(--col_cat-about);
  }
}
@media print, screen and (min-width:813px) {
  .voice-nav__nav > li.about.is-active > a {
    background-color: var(--col_cat-about);
  }
  .voice-nav__nav > li.about:hover > a {
    background-color: var(--col_cat-about);
  }
}

.voice-nav__trigger {
  cursor: pointer;
}
.voice-nav__trigger::before, .voice-nav__trigger::after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  background: url(../img/ic_search.svg) no-repeat center center/contain;
  transition: opacity 0.5s;
}
.voice-nav__trigger::after {
  background-image: url(../img/ic_close.svg);
  opacity: 0;
}
.voice-nav__trigger.is-active::before {
  opacity: 0;
}
.voice-nav__trigger.is-active::after {
  opacity: 1;
}
@media only screen and (max-width: 812px) {
  .voice-nav__trigger {
    min-height: 5rem;
  }
  .voice-nav__trigger::before, .voice-nav__trigger::after {
    width: 2.4rem;
    height: 2.4rem;
    right: 1.6rem;
    top: 1.3rem;
  }
  .voice-nav__trigger span {
    display: flex;
    align-items: center;
    min-height: 5rem;
    padding-left: 1rem;
    font-size: 1.8rem;
    color: var(--col_dblue);
  }
}
@media print, screen and (min-width:813px) {
  .voice-nav__trigger {
    position: absolute;
    width: 2.6rem;
    height: 2.6rem;
    right: 2rem;
    top: 1.2rem;
  }
  .voice-nav__trigger span {
    display: none;
  }
}

.voice-nav-content {
  padding-bottom: 2rem;
}
@media print, screen and (min-width:813px) {
  .voice-nav-content {
    padding-bottom: 3rem;
  }
}

.voice-nav__search {
  margin-left: auto;
  margin-right: auto;
  display: flex;
  border-radius: 1.5rem;
  border: 1px solid var(--col_dblue);
  min-height: 5rem;
  padding: 0.8rem 1.6rem;
  margin-top: 2rem;
}
.voice-nav__search > input {
  flex: 1;
  margin-right: 1em;
  background: none !important;
  border: none !important;
}
.voice-nav__search > button {
  cursor: pointer;
}
@media print, screen and (min-width:813px) {
  .voice-nav__search {
    margin-top: 3rem;
    width: 43rem;
  }
}

.voice-nav__tag-list {
  margin-top: 2rem;
}
@media print, screen and (min-width:813px) {
  .voice-nav__tag-list {
    margin-top: 3rem;
    justify-content: center;
  }
}

/* ====================================================================

  うぶやの人びと
  アーカイブのセクション

 */
.voice-sec {
  position: relative;
  background-color: var(--col_blue);
  border: 1px solid #fff;
  padding: 5rem 1rem;
}
@media print, screen and (min-width:813px) {
  .voice-sec {
    padding: 5rem 6rem 6rem;
    border: 2px solid #fff;
  }
}

.voice-sec:not(:last-of-type) {
  margin-bottom: 8rem;
}
@media print, screen and (min-width:813px) {
  .voice-sec:not(:last-of-type) {
    margin-bottom: 10rem;
  }
}

.voice-sec__text {
  color: #fff;
  text-align: center;
  letter-spacing: 0.1em;
}

.voice-sec__heading {
  text-align: center;
  font-family: var(--font-bold);
  font-weight: 600;
  font-size: 2rem;
  color: #fff;
}
@media print, screen and (min-width:813px) {
  .voice-sec__heading {
    font-size: 3rem;
  }
}

.voice-sec-list {
  display: flex;
  flex-wrap: wrap;
  margin-top: 3rem;
}
@media only screen and (max-width: 812px) {
  .voice-sec-list {
    gap: 1rem;
    row-gap: 2rem;
  }
}
@media print, screen and (min-width:813px) {
  .voice-sec-list {
    margin-top: 3rem;
    row-gap: 5rem;
    justify-content: center;
  }
}

.voice-sec-list .card {
  width: calc(50% - 0.5rem);
}
@media print, screen and (min-width:813px) {
  .voice-sec-list .card {
    width: 33.33%;
  }
}

.voice-sec__button {
  margin-left: auto;
  margin-right: auto;
  margin-top: 3rem;
  max-width: 24rem;
}
.voice-sec__button.button-a .button-inner {
  background-color: #fff;
}
@media print, screen and (min-width:813px) {
  .voice-sec__button {
    margin-top: 5rem;
    width: 30rem;
  }
}

.voice-sec__empty {
  text-align: center;
  color: #fff;
  margin: 4em 0 2em;
  font-family: var(--font-bold);
  font-weight: 600;
}

/**
  バリエーション
 */
.voice-sec.--job {
  background-color: #2879AD;
}
.voice-sec.--job .voice-sec__button.button-a .button-inner {
  color: var(--col_cat-job--dark);
}
.voice-sec.--job .voice-sec__button:hover .button-inner {
  color: #fff;
  background-color: var(--col_cat-job--dark);
}

.voice-sec.--project {
  background-color: var(--col_cat-project);
}
.voice-sec.--project .voice-sec__button.button-a .button-inner {
  color: var(--col_cat-project--dark);
}
.voice-sec.--project .voice-sec__button:hover .button-inner {
  color: #fff;
  background-color: var(--col_cat-project--dark);
}

.voice-sec.--system {
  background-color: var(--col_cat-system);
}
.voice-sec.--system .voice-sec__button.button-a .button-inner {
  color: var(--col_cat-system--dark);
}
.voice-sec.--system .voice-sec__button:hover .button-inner {
  color: #fff;
  background-color: var(--col_cat-system--dark);
}

.voice-sec.--about {
  background-color: var(--col_cat-about);
}
.voice-sec.--about .voice-sec__button.button-a .button-inner {
  color: var(--col_cat-about--dark);
}
.voice-sec.--about .voice-sec__button:hover .button-inner {
  color: #fff;
  background-color: var(--col_cat-about--dark);
}

.voice-sec.--others {
  background-color: var(--col_blue);
}
@media only screen and (max-width: 812px) {
  .voice-sec.--others .voice-sec-list .card:nth-child(n+3) {
    display: none;
  }
}
@media print, screen and (min-width:813px) {
  .voice-sec.--others {
    padding: 8rem 6rem 10rem;
  }
}

/**
  セクションごとのイラスト
 */
.voice-sec__fig {
  position: absolute;
}

.voice-sec__fig.--job01 {
  width: 7.8rem;
  top: -6rem;
  left: 6rem;
}
@media print, screen and (min-width:813px) {
  .voice-sec__fig.--job01 {
    width: 9.2rem;
    left: 9.8rem;
    top: -7rem;
  }
}

.voice-sec__fig.--job02 {
  width: 7.5rem;
  left: 1rem;
  top: -4.8rem;
}
@media print, screen and (min-width:813px) {
  .voice-sec__fig.--job02 {
    width: 8.8rem;
    left: 3.4rem;
    top: -5.7rem;
  }
}

.voice-sec__fig.--job03 {
  display: none;
}
@media print, screen and (min-width:813px) {
  .voice-sec__fig.--job03 {
    display: block;
    width: 16rem;
    right: 6.4rem;
    bottom: -3.8rem;
  }
}

.voice-sec__fig.--project01 {
  width: 10rem;
  right: 1.3rem;
  top: -6rem;
}
@media print, screen and (min-width:813px) {
  .voice-sec__fig.--project01 {
    width: 13rem;
    right: auto;
    left: 9.8rem;
    top: -4.4rem;
  }
}

.voice-sec__fig.--project02 {
  display: none;
}
@media print, screen and (min-width:813px) {
  .voice-sec__fig.--project02 {
    display: block;
    width: 11.6rem;
    right: 7.5rem;
    bottom: -4.1rem;
  }
}

.voice-sec__fig.--system01 {
  width: 14.5rem;
  left: 1.5rem;
  top: -5rem;
}
@media print, screen and (min-width:813px) {
  .voice-sec__fig.--system01 {
    width: 19.2rem;
    left: 7.6rem;
    top: -2.3rem;
  }
}

.voice-sec__fig.--system02 {
  display: none;
}
@media print, screen and (min-width:813px) {
  .voice-sec__fig.--system02 {
    display: block;
    width: 14.8rem;
    right: 8.4rem;
    bottom: -4.7rem;
  }
}

.voice-sec__fig.--about01 {
  width: 6.7rem;
  right: 3rem;
  top: -5rem;
}
@media print, screen and (min-width:813px) {
  .voice-sec__fig.--about01 {
    width: 8.7rem;
    right: auto;
    left: 8.4rem;
    top: -4rem;
  }
}

.voice-sec__fig.--about02 {
  display: none;
}
@media print, screen and (min-width:813px) {
  .voice-sec__fig.--about02 {
    display: block;
    width: 14.1rem;
    right: 9rem;
    bottom: -4rem;
  }
}

.voice-sec__fig.--others01 {
  width: 8rem;
  right: 3rem;
  top: -5rem;
}
@media print, screen and (min-width:813px) {
  .voice-sec__fig.--others01 {
    width: 11rem;
    right: 8.4rem;
    top: -4rem;
  }
}

.voice-sec__fig.--others02 {
  width: 11rem;
  bottom: -4rem;
  left: 2rem;
}
@media print, screen and (min-width:813px) {
  .voice-sec__fig.--others02 {
    display: block;
    width: 18.8rem;
    left: 3.5rem;
    bottom: -5.4rem;
  }
}

/* ====================================================================

  プロジェクト内記事要素

 */
/**
  記事全体
 */
.article {
  background-color: #fff;
}
@media only screen and (max-width: 812px) {
  .article {
    margin-left: -1.5rem;
    margin-right: -1.5rem;
    padding: 4rem 1.5rem;
  }
}
@media print, screen and (min-width:813px) {
  .article {
    padding: 8rem 10rem;
  }
}

/*
  記事内基本要素のスタイルをインポート
 */
.article-style {
  /*
    コンテンツ内の見出し上マージン設定
   */
  /**
    ブロック共通マージン
   */
  /**
    イメージ
   */
  /**
    グリッド
   */
  /*
  .aligncenter {
    margin: 0 auto 1em;
  }

  .alignleft {
    float: left;
    margin: 0 1em 1em 0;
  }

  .alignright {
    margin: 0 0 1em auto;
  }

  */
  /* ====================================================================

    am (article-module)
    記事内で使用するモジュールブロック

    ※.article-style（プリミティブタグ（img p）へ直接スタイルを記述している）内に配置するため、
    .article-style {} 内で@import する必要がある

   */
  /**
    カテゴリーカラーバリエーションは /project/_article_color.scssで設定する
   */
  /**
    MV
   */
  /**
    プロフィール
   */
  /**
    1日のスケジュール
   */
}
.article-style *:last-child {
  margin-bottom: 0;
}
.article-style h1, .article-style h2, .article-style h3, .article-style h4, .article-style h5, .article-style h6 {
  line-height: 1.5;
  font-family: var(--font-bold);
  font-weight: 600;
  margin: 2rem 0 1.5rem;
}
@media print, screen and (min-width:813px) {
  .article-style h1, .article-style h2, .article-style h3, .article-style h4, .article-style h5, .article-style h6 {
    margin: 4rem 0 3rem;
  }
}
.article-style h1, .article-style h2 {
  font-weight: 700;
  line-height: 1.75;
  font-size: 1.9rem;
}
.article-style h1 > span, .article-style h2 > span {
  display: inline;
  background: linear-gradient(transparent 90%, #ddd 0%);
  word-break: break-word;
  padding-bottom: 0.3em;
}
@media print, screen and (min-width:813px) {
  .article-style h1, .article-style h2 {
    font-size: 2.6rem;
  }
}
.article-style h3, .article-style h4, .article-style h5, .article-style h6 {
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--mycol);
}
@media print, screen and (min-width:813px) {
  .article-style h3, .article-style h4, .article-style h5, .article-style h6 {
    font-size: 2.1rem;
  }
}
.article-style p + h1,
.article-style figure + h1,
.article-style p + h2,
.article-style figure + h2,
.article-style p + h3,
.article-style figure + h3,
.article-style p + h4,
.article-style figure + h4,
.article-style p + h5,
.article-style figure + h5,
.article-style p + h6,
.article-style figure + h6,
.article-style p + img,
.article-style img + h1,
.article-style img + h2,
.article-style img + h3,
.article-style img + h4,
.article-style img + h5,
.article-style img + h6 {
  margin-top: 3rem;
}
@media print, screen and (min-width:813px) {
  .article-style p + h1,
  .article-style figure + h1,
  .article-style p + h2,
  .article-style figure + h2,
  .article-style p + h3,
  .article-style figure + h3,
  .article-style p + h4,
  .article-style figure + h4,
  .article-style p + h5,
  .article-style figure + h5,
  .article-style p + h6,
  .article-style figure + h6,
  .article-style p + img,
  .article-style img + h1,
  .article-style img + h2,
  .article-style img + h3,
  .article-style img + h4,
  .article-style img + h5,
  .article-style img + h6 {
    margin-top: 5rem;
  }
}
.article-style p {
  line-height: 2;
  font-size: 1.4rem;
  margin-bottom: 2rem;
  text-align: justify;
  text-justify: inter-ideograph;
  word-break: break-all;
}
@media print, screen and (min-width:813px) {
  .article-style p {
    font-size: 1.5rem;
    line-height: 2.2;
    margin-bottom: 4rem;
  }
}
.article-style a {
  text-decoration: underline;
}
@media print, screen and (min-width:813px) {
  .article-style a:hover {
    text-decoration: none;
  }
}
.article-style .wp-block-image,
.article-style .wp-block-group {
  margin-top: 4rem;
  margin-bottom: 4rem;
}
@media print, screen and (min-width:813px) {
  .article-style .wp-block-image,
  .article-style .wp-block-group {
    margin-top: 8rem;
    margin-bottom: 8rem;
  }
}
.article-style img {
  display: block;
}
.article-style img + *:not(img) {
  margin-top: 4rem;
}
@media print, screen and (min-width:813px) {
  .article-style img + *:not(img) {
    margin-top: 8rem;
  }
}
.article-style img + img {
  margin-top: 1rem;
}
@media print, screen and (min-width:813px) {
  .article-style img + img {
    margin-top: 2rem;
  }
}
.article-style .wp-block-image:first-of-type {
  margin-top: 0;
}
.article-style .wp-block-group .wp-block-image,
.article-style .wp-block-column .wp-block-image {
  margin: 0;
}
.article-style figcaption,
.article-style .wp-element-caption {
  text-align: left;
  font-size: 1.2rem;
}
@media print, screen and (min-width:813px) {
  .article-style figcaption,
  .article-style .wp-element-caption {
    font-size: 1.4rem;
  }
}
@media only screen and (max-width: 812px) {
  .article-style .wp-block-group .is-layout-grid {
    display: block;
  }
  .article-style .wp-block-group .wp-block-image:not(last-of-type) {
    margin-bottom: 1em;
  }
}
.article-style .wp-element-caption {
  text-align: left;
  font-size: 0.875em;
  line-height: 1.75;
  margin-top: 2em;
  margin-bottom: 2em;
}
.article-style .wp-caption {
  max-width: 100%;
}
.article-style .wp-caption-text {
  font-size: 0.83em;
  margin-top: -1em;
}
.article-style .wp-block-separator {
  margin-top: 8em !important;
  margin-bottom: 8em !important;
}
.article-style strong {
  font-weight: bold;
  /*color: var(--mycol);*/
}
.article-style em {
  font-style: italic;
}
.article-style blockquote {
  font-style: italic;
  margin: 2rem 0;
  background-color: #f5f5f5;
  padding: 1.2em;
}
@media print, screen and (min-width:813px) {
  .article-style blockquote {
    margin: 4rem 0;
  }
}
.article-style cite {
  line-height: 1.75;
  font-size: 0.92em;
}
.article-style pre {
  white-space: normal;
}
.article-style ul,
.article-style ol {
  margin: 2rem 0;
}
@media print, screen and (min-width:813px) {
  .article-style ul,
  .article-style ol {
    margin: 4rem 0;
  }
}
.article-style ul li {
  list-style-type: disc;
  line-height: 1.5;
  margin-bottom: 1em;
  list-style-position: inside;
  margin-left: 1.5em;
}
.article-style ol li {
  list-style-type: decimal;
  line-height: 1.5;
  margin-bottom: 1em;
}
.article-style hr {
  border: none;
  margin: 4rem 0;
  height: 4px;
  background-image: radial-gradient(circle, #A3CFDD 2px, transparent 2px);
  background-size: 10px 4px; /* ← ドット間の距離を調整 */
  background-repeat: repeat-x;
}
@media print, screen and (min-width:813px) {
  .article-style hr {
    margin: 8rem 0;
  }
}
.article-style iframe[src*=youtube] {
  display: block;
  margin: 0 auto 3em;
  max-width: 500px;
  aspect-ratio: 9/16;
  width: 100%;
  height: auto;
}
@media only screen and (max-width: 812px) {
  .article-style iframe[src*=youtube] {
    max-width: 300px;
  }
}
@media only screen and (max-width: 812px) {
  .article-style .am-mv {
    margin-left: -1.5rem;
    margin-right: -1.5rem;
  }
  .article-style .am-mv + .am-profile {
    margin-top: 0;
  }
}
@media print, screen and (min-width:813px) {
  .article-style .am-mv {
    margin-bottom: 1.5rem;
  }
}
.article-style .am-profile {
  position: relative;
  background-color: #E2F0F3;
}
@media only screen and (max-width: 812px) {
  .article-style .am-profile {
    margin-left: -1.5rem;
    margin-right: -1.5rem;
    padding: 4.5rem 3rem;
  }
}
@media print, screen and (min-width:813px) {
  .article-style .am-profile {
    padding: 4rem 5rem 5rem 20.8rem;
  }
}
.article-style .am-profile + .am-profile {
  margin-top: 1rem;
}
@media print, screen and (min-width:813px) {
  .article-style .am-profile + .am-profile {
    margin-top: 1.5rem;
  }
}
.article-style .am-profile__pict {
  position: absolute;
  width: 9rem;
  border-radius: 50%;
  overflow: hidden;
  left: 0;
}
@media print, screen and (min-width:813px) {
  .article-style .am-profile__pict {
    width: 13.4rem;
    left: 4rem;
    top: 6rem;
  }
}
@media only screen and (max-width: 812px) {
  .article-style .am-profile-container {
    position: relative;
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding-left: 11rem;
    margin-bottom: 3.5rem;
  }
}
.article-style small.am-profile__shoulder {
  color: #959595;
  font-size: 1.3rem;
  display: block;
  margin-bottom: 0.6em;
  line-height: 1.3;
  margin-top: -0.3rem;
}
@media print, screen and (min-width:813px) {
  .article-style small.am-profile__shoulder {
    line-height: 1.85;
  }
}
.article-style p.am-profile__name {
  font-family: var(--font-bold);
  font-weight: 600;
  font-size: 1.8rem;
  line-height: 1;
}
@media print, screen and (min-width:813px) {
  .article-style p.am-profile__name {
    margin-bottom: 1rem;
  }
}
.article-style p.am-profile__text {
  line-height: 1.8;
}
.article-style p.am-profile__text:not(:last-of-type) {
  margin: 0 0 1em 0;
}
.article-style .am-timeline {
  background-color: #E2F0F3;
  padding: 1rem;
}
.article-style .am-timeline + *:not(.am-timeline) {
  margin-top: 4rem;
}
@media print, screen and (min-width:813px) {
  .article-style .am-timeline {
    padding: 4rem;
  }
  .article-style .am-timeline + *:not(.am-timeline) {
    margin-top: 8rem;
  }
}
.article-style .am-timeline + .am-timeline {
  margin-top: 1.5rem;
}
@media print, screen and (min-width:813px) {
  .article-style .am-timeline + .am-timeline {
    margin-top: 3rem;
  }
}
.article-style .am-timeline__pict {
  margin-bottom: 0;
}
.article-style .am-timeline-content {
  background-color: #fff;
  padding: 1.5rem 1rem 2rem;
}
@media print, screen and (min-width:813px) {
  .article-style .am-timeline-content {
    padding: 3rem 4rem;
  }
}
.article-style .am-timeline h2 {
  margin: 0 0 1.6rem;
  font-size: 1.6rem;
  font-family: var(--font-bold);
  font-weight: 600;
}
@media print, screen and (min-width:813px) {
  .article-style .am-timeline h2 {
    margin: 0 0 2rem;
    font-size: 2.1rem;
  }
}
.article-style .am-timeline dl {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 2rem;
}
.article-style .am-timeline dl > dt, .article-style .am-timeline dl > dd {
  padding: 0;
  margin: 0;
  line-height: 1.75;
  font-size: 1.4rem;
}
.article-style .am-timeline dl > dt:not(:last-of-type), .article-style .am-timeline dl > dd:not(:last-of-type) {
  margin-bottom: 1.5rem;
}
.article-style .am-timeline dl > dt {
  position: relative;
  font-family: var(--font-bold);
  font-weight: 600;
  color: #333;
  width: 8rem;
  padding-left: 2.4rem;
  font-size: 1.4rem;
}
.article-style .am-timeline dl > dt::before {
  content: "";
  display: block;
  position: absolute;
  z-index: 3;
  width: 1rem;
  height: 0.85rem;
  mask: url(../img/ic_dot.svg) no-repeat center center/contain;
  background-color: #333;
  left: 0.4rem;
  top: 0.6rem;
}
.article-style .am-timeline dl > dd {
  width: calc(100% - 8rem);
}
.article-style .am-timeline dl > dd h3 {
  margin: 0 0 0.5em;
  font-size: 1.4rem;
  line-height: 1.75;
  font-family: var(--font-bold);
  font-weight: 600;
}
.article-style .am-timeline dl > dd p {
  margin: 0;
  line-height: 1.75;
}
.article-style .am-timeline dl > dt:last-of-type::after {
  content: "";
  display: block;
  position: absolute;
  width: 2rem;
  top: 1.2rem;
  height: calc(100% - 1rem);
  background-color: #fff;
  left: 0;
}
.article-style .am-timeline dl::before {
  content: "";
  display: block;
  position: absolute;
  width: 0.2rem;
  height: calc(100% - 1.6rem);
  background-color: #333;
  left: 0.8rem;
  top: 1rem;
}
@media print, screen and (min-width:813px) {
  .article-style .am-timeline dl {
    margin-bottom: 3rem;
  }
  .article-style .am-timeline dl::before {
    top: 1.6rem;
    left: 1rem;
  }
  .article-style .am-timeline dl > dt,
  .article-style .am-timeline dl > dd {
    font-size: 2.1rem;
  }
  .article-style .am-timeline dl > dt:not(:last-of-type),
  .article-style .am-timeline dl > dd:not(:last-of-type) {
    margin-bottom: 3rem;
  }
  .article-style .am-timeline dl > dt {
    width: 11rem;
    font-size: 2.1rem;
  }
  .article-style .am-timeline dl > dt:before {
    top: 1rem;
    width: 1.3rem;
    height: 1.2rem;
  }
  .article-style .am-timeline dl > dd {
    width: calc(100% - 11rem);
  }
  .article-style .am-timeline dl > dd h3 {
    margin: 0 0 0.5em;
    font-size: 2.1rem;
  }
}

/**
  記事ヘッダ
 */
.article-head {
  margin-bottom: 3rem;
}
@media print, screen and (min-width:813px) {
  .article-head {
    margin-bottom: 4rem;
  }
}

.article__heading {
  font-family: var(--font-bold);
  font-weight: 600;
  font-size: 2rem;
  line-height: 1.5;
  color: var(--col_black) !important;
}
@media print, screen and (min-width:813px) {
  .article__heading {
    font-size: 3rem;
  }
}

.article__category {
  display: inline-block;
  margin-bottom: 1.2rem;
  background-color: #aaa;
  color: #fff;
  padding: 0.2rem 0.8rem;
}
@media print, screen and (min-width:813px) {
  .article__category {
    padding: 0.3rem 1.2rem;
    margin-bottom: 1.8rem;
    transition: 0.3s opacity;
  }
  .article__category:hover {
    opacity: 0.75;
  }
}

.article__date {
  margin-top: 0.6rem;
}
@media print, screen and (min-width:813px) {
  .article__date {
    margin-top: 1rem;
  }
}

.article__tag.tag-list.--large {
  margin-top: 0.6rem;
}
.article__tag.tag-list.--large > li > a {
  background: none;
  padding: 0;
}
@media print, screen and (min-width:813px) {
  .article__tag.tag-list.--large {
    margin-top: 1.2rem;
  }
}

/* ====================================================================

  カテゴリーによる記事テーマカラーの設定

 */
.article.--job .article__category {
  background-color: var(--col_cat-job--dark);
}
.article.--job .article__tag.tag-list.--large > li > a {
  color: var(--col_cat-job--dark);
}
.article.--job h1, .article.--job h2 {
  color: var(--col_cat-job--dark);
}
.article.--job h1 > span, .article.--job h2 > span {
  background: linear-gradient(transparent 90%, var(--col_blue) 0%);
}
.article.--job h3, .article.--job h4, .article.--job h5, .article.--job h6 {
  color: var(--col_cat-job--dark);
}
.article.--job .am-timeline dl::before {
  background-color: var(--col_cat-job--dark);
}
.article.--job .am-timeline dl > dt {
  color: var(--col_cat-job--dark);
}
.article.--job .am-timeline dl > dt::before {
  background-color: var(--col_cat-job--dark);
}

.article h1, .article h2 {
  color: var(--col_cat-job--dark);
}
.article h1 > span, .article h2 > span {
  background: linear-gradient(transparent 90%, var(--col_blue) 0%);
}
.article h3, .article h4, .article h5, .article h6 {
  color: var(--col_cat-job--dark);
}
.article .am-timeline dl::before {
  background-color: var(--col_cat-job--dark);
}
.article .am-timeline dl > dt {
  color: var(--col_cat-job--dark);
}
.article .am-timeline dl > dt::before {
  background-color: var(--col_cat-job--dark);
}

/**
  カテゴリーごとのテーマカラーは
  上部のカテゴリー、タグのみ
 */
.article.--project {
  /*
    h1,h2 {
      color: var(--col_cat-project--dark);
      >span {
        background: linear-gradient(transparent 90%, var(--col_cat-project) 0%);
      }
    }
    h3,h4,h5,h6 {
      color: var(--col_cat-project--dark);
    }

    .am-timeline dl {
      &::before {
        background-color: var(--col_cat-project--dark);
      }
      >dt {
        color: var(--col_cat-project--dark);
        &::before {
          background-color: var(--col_cat-project--dark);
        }
      }

    }*/
}
.article.--project .article__category {
  background-color: var(--col_cat-project--dark);
}
.article.--project .article__tag.tag-list.--large > li > a {
  color: var(--col_cat-project--dark);
}

.article.--system {
  /*
    h1,h2 {
      color: var(--col_cat-system--dark);
      >span {
        background: linear-gradient(transparent 90%, var(--col_cat-system) 0%);
      }
    }
    h3,h4,h5,h6 {
      color: var(--col_cat-system--dark);
    }
    .am-timeline dl {
      &::before {
        background-color: var(--col_cat-system--dark);
      }
      >dt {
        color: var(--col_cat-system--dark);
        &::before {
          background-color: var(--col_cat-system--dark);
        }
      }

    }*/
}
.article.--system .article__category {
  background-color: var(--col_cat-system--dark);
}
.article.--system .article__tag.tag-list.--large > li > a {
  color: var(--col_cat-system--dark);
}

.article.--about {
  /*
    h1,h2 {
      color: var(--col_cat-about--dark);
      >span {
        background: linear-gradient(transparent 90%, var(--col_blue) 0%);
      }
    }
    h3,h4,h5,h6 {
      color: var(--col_cat-about--dark);
    }

    .am-timeline dl {
      &::before {
        background-color: var(--col_cat-about--dark);
      }
      >dt {
        color: var(--col_cat-about--dark);
        &::before {
          background-color: var(--col_cat-about--dark);
        }
      }

    }*/
}
.article.--about .article__category {
  background-color: var(--col_cat-about--dark);
}
.article.--about .article__tag.tag-list.--large > li > a {
  color: var(--col_cat-about--dark);
}

.about-culture {
  position: relative;
  z-index: 3;
  padding: 6rem 0;
  position: relative;
  z-index: 10;
}
.about-culture::after {
  content: "";
  display: block;
  position: absolute;
  pointer-events: none;
  width: 100%;
  height: 8vw;
  background-color: var(--col_beige);
  bottom: -8vw;
  mask: url(../img/sec_shape_mask_sp.svg) no-repeat center top/100% auto;
}
@media print, screen and (min-width:813px) {
  .about-culture::after {
    height: 10vw;
    bottom: calc(-10vw + 1px);
    mask-image: url(../img/sec_shape_mask.svg);
  }
}
.about-culture .heading-sec {
  color: #F52F37;
}
@media only screen and (max-width: 812px) {
  .about-culture {
    z-index: 11;
  }
}
@media print, screen and (min-width:813px) {
  .about-culture {
    padding: 10rem 0;
  }
}

.about-culture-block {
  position: relative;
}
.about-culture-block picture {
  display: block;
}
.about-culture-block .block-container {
  position: relative;
}
@media only screen and (max-width: 812px) {
  .about-culture-block > p {
    text-align: center;
    margin-top: 1.5rem;
  }
}
@media print, screen and (min-width:813px) {
  .about-culture-block {
    margin-left: 18vw;
  }
  .about-culture-block > p {
    margin-top: 1.6rem;
    padding-left: 13rem;
  }
  .about-culture-block > picture {
    margin: 0 0 0 auto;
    height: 10rem;
  }
}

.about-culture-block + .about-culture-block {
  margin-top: 10rem;
}
@media print, screen and (min-width:813px) {
  .about-culture-block + .about-culture-block {
    margin-top: 11rem;
  }
}

.about-culture-block__heading {
  position: absolute;
  z-index: 3;
}
@media only screen and (max-width: 812px) {
  .about-culture-block__heading {
    left: 1.5rem;
    top: -6.5rem;
  }
}
@media print, screen and (min-width:813px) {
  .about-culture-block__heading {
    bottom: -7rem;
    left: -13rem;
  }
}

/**
  ブロック 反転レイアウト
 */
@media only screen and (max-width: 812px) {
  .about-culture-block.--invert .about-culture-block__heading {
    left: auto;
    right: 1.5rem;
  }
}
@media print, screen and (min-width:813px) {
  .about-culture-block.--invert {
    margin-left: auto;
    margin-right: 18vw;
  }
  .about-culture-block.--invert > p {
    text-align: right;
    padding-right: 13rem;
    padding-left: 0;
  }
  .about-culture-block.--invert .about-culture-block__heading {
    left: auto;
    right: -13rem;
  }
}

/**
  代表メッセージ
 */
.about-message {
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 812px) {
  .about-message {
    background-color: var(--col_blue);
    position: relative;
    z-index: 3;
    padding: 5rem 0;
    z-index: 10;
  }
  .about-message::after {
    content: "";
    display: block;
    position: absolute;
    pointer-events: none;
    width: 100%;
    height: 8vw;
    background-color: var(--col_blue);
    bottom: calc(-8vw + 1px);
    mask: url(../img/sec_shape_mask_invert_sp.svg) no-repeat center top/100% auto;
  }
}
@media only screen and (max-width: 812px) and (min-width:813px) {
  .about-message::after {
    height: 10vw;
    bottom: calc(-10vw + 1px);
    mask-image: url(../img/sec_shape_mask_invert.svg);
  }
}
@media only screen and (max-width: 812px) {
  .about-message .heading-sec {
    color: #fff;
  }
}
@media print, screen and (min-width:813px) {
  .about-message {
    position: relative;
    z-index: 3;
    background: url(../../about/img/message_p01.jpg) no-repeat center center/cover;
    padding: calc(10vw - 4rem) 0 calc(10vw + 8rem);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .about-message::after {
    content: "";
    display: block;
    position: absolute;
    pointer-events: none;
    width: 100%;
    height: 8vw;
    background-color: #A3CFDD;
    bottom: -1px;
    mask: url(../img/sec_shape_mask_bottom_sp.svg) no-repeat center bottom/100% auto;
  }
}
@media print, screen and (min-width:813px) and (min-width:813px) {
  .about-message::after {
    height: 10vw;
    bottom: -1px;
    mask-image: url(../img/sec_shape_mask_bottom.svg);
  }
}
@media print, screen and (min-width:813px) {
  .about-message .heading-sec {
    color: #fff;
  }
  .about-message::after {
    z-index: 8;
  }
}

.about-message-cover {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: var(--col_beige);
  left: 0;
  top: 0;
  z-index: 1;
  transition: opacity 1s;
  opacity: 0;
  pointer-events: none;
}
.about-message-cover.ef-io {
  opacity: 1;
}

.about-message__heading {
  position: relative;
  z-index: 3;
  margin-bottom: 2rem;
}
@media print, screen and (min-width:813px) {
  .about-message__heading {
    margin-bottom: 3vw;
  }
}

.about-message__pict {
  margin-bottom: 3rem;
  display: block;
}
@media print, screen and (min-width:813px) {
  .about-message__pict {
    display: none;
  }
}

.about-message__content {
  position: relative;
  z-index: 3;
}
.about-message__content > h3 {
  font-family: var(--font-bold);
  font-weight: 600;
  line-height: 1.3;
}
.about-message__content > p {
  text-align: justify;
  text-justify: inter-ideograph;
}
@media only screen and (max-width: 812px) {
  .about-message__content {
    color: #fff;
    margin-left: 3rem;
    margin-right: 3rem;
  }
  .about-message__content > h3 {
    font-size: 1.8rem;
    line-height: 1.5;
    margin-bottom: 2rem;
  }
  .about-message__content > p:not(:last-child) {
    margin-bottom: 2rem;
  }
}
@media print, screen and (min-width:813px) {
  .about-message__content {
    background-color: rgba(255, 255, 255, 0.9);
    width: 68rem;
    margin-right: 28vw;
    padding: 4.5rem 4rem;
  }
  .about-message__content > h3 {
    font-size: 3rem;
    margin-bottom: 2.5rem;
  }
  .about-message__content > p:not(:last-child) {
    margin-bottom: 3rem;
  }
}

.about-message__sign {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.about-message__sign > small {
  font-size: 1.4rem;
}
.about-message__sign img {
  width: 14rem;
  margin-left: 1em;
}
@media print, screen and (min-width:813px) {
  .about-message__sign > small {
    font-size: 1.6rem;
  }
  .about-message__sign img {
    width: 16.5rem;
  }
}

/**
  数字で見るうぶや
 */
.about-data {
  background-color: #A3CFDD;
  padding: 6rem 0;
}
@media print, screen and (min-width:813px) {
  .about-data {
    padding: calc(10vw + 8rem) 0 10rem;
  }
}

.about-data-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* 列3つ（等幅） */
  grid-template-rows: repeat(7, auto); /* 行4つ（高さは中身に応じて） */
  gap: 0.8rem;
}
@media print, screen and (min-width:813px) {
  .about-data-grid {
    grid-template-columns: repeat(3, 1fr); /* 列3つ（等幅） */
    gap: 1rem;
  }
}

.about-data-grid__item {
  position: relative;
  background-color: #fff;
  padding: 1.5rem;
}
.about-data-grid__item > h3 {
  color: var(--col_dblue);
  text-align: center;
  font-family: var(--font-bold);
  font-weight: 600;
  font-size: 1.4rem;
  margin-bottom: 0.5em;
}
.about-data-grid__item > picture {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.about-data-grid__item > p {
  color: #53A4C5;
  line-height: 1.75;
  margin-top: 2rem;
  font-size: 1.3rem;
}
@media print, screen and (min-width:813px) {
  .about-data-grid__item {
    padding: 2rem;
  }
  .about-data-grid__item > h3 {
    font-size: 2.4rem;
    margin-bottom: 0.7em;
  }
  .about-data-grid__item > p {
    margin-top: 3rem;
    text-align: center;
    font-size: 1.4rem;
  }
}

.about-data-grid__item.--item01 {
  grid-column: 1/3;
  grid-row: 1/2;
}
@media print, screen and (min-width:813px) {
  .about-data-grid__item.--item01 {
    grid-column: 1/4;
    grid-row: 1/2;
  }
  .about-data-grid__item.--item01 > picture {
    width: 74.8rem;
  }
}

.about-data-grid__item.--item02 {
  grid-column: 1/2;
  grid-row: 2/3;
}
@media print, screen and (min-width:813px) {
  .about-data-grid__item.--item02 {
    grid-column: 1/2;
    grid-row: 2/3;
  }
  .about-data-grid__item.--item02 > picture {
    width: 27.6rem;
  }
}

.about-data-grid__item.--item03 {
  grid-column: 2/3;
  grid-row: 2/3;
}
@media print, screen and (min-width:813px) {
  .about-data-grid__item.--item03 {
    grid-column: 2/3;
    grid-row: 2/3;
  }
  .about-data-grid__item.--item03 > picture {
    width: 25.7rem;
  }
}

.about-data-grid__item.--item04 {
  grid-column: 1/3;
  grid-row: 3/4;
}
@media only screen and (max-width: 812px) {
  .about-data-grid__item.--item04 > h3 {
    text-align: left;
    margin-bottom: -1.2rem;
  }
  .about-data-grid__item.--item04 > p {
    text-align: center;
    margin-top: 1rem;
  }
  .about-data-grid__item.--item04 > small {
    display: block;
    color: #61AAC9;
    font-size: 0.9rem;
    text-align: right;
  }
}
@media print, screen and (min-width:813px) {
  .about-data-grid__item.--item04 {
    grid-column: 3/4;
    grid-row: 2/3;
  }
  .about-data-grid__item.--item04 > picture {
    width: 24.7rem;
  }
  .about-data-grid__item.--item04 > small {
    display: none;
  }
}

.about-data-grid__item.--item05 {
  grid-column: 1/3;
  grid-row: 4/5;
}
@media only screen and (max-width: 812px) {
  .about-data-grid__item.--item05 > picture {
    right: 1.5rem;
    width: 22.4rem;
    position: absolute;
    top: 6rem;
  }
  .about-data-grid__item.--item05 > p {
    padding-right: 16.5rem;
    padding-bottom: 3rem;
  }
}
@media print, screen and (min-width:813px) {
  .about-data-grid__item.--item05 {
    grid-column: 1/3;
    grid-row: 3/4;
    display: flex;
    justify-content: center;
    flex-direction: column;
  }
  .about-data-grid__item.--item05 > h3 {
    width: 26rem;
    text-align: left;
    padding: 0 2rem;
    margin-bottom: 1rem;
  }
  .about-data-grid__item.--item05 > p {
    width: 26rem;
    padding: 0 2rem;
    text-align: left;
    margin: 0;
  }
  .about-data-grid__item.--item05 > picture {
    position: absolute;
    right: 3rem;
    top: 2rem;
    width: 38.7rem;
  }
}

.about-data-grid__item.--item06 {
  grid-column: 1/2;
  grid-row: 5/6;
}
@media only screen and (max-width: 812px) {
  .about-data-grid__item.--item06 > picture {
    width: 11.6rem;
    padding-left: 2rem;
  }
}
@media print, screen and (min-width:813px) {
  .about-data-grid__item.--item06 {
    grid-column: 3/4;
    grid-row: 3/4;
  }
  .about-data-grid__item.--item06 > picture {
    width: 17.8rem;
  }
}

.about-data-grid__item.--item07 {
  grid-column: 2/3;
  grid-row: 5/6;
}
@media only screen and (max-width: 812px) {
  .about-data-grid__item.--item07 > picture {
    margin-right: -0.5rem;
  }
}
@media print, screen and (min-width:813px) {
  .about-data-grid__item.--item07 {
    grid-column: 1/2;
    grid-row: 4/5;
  }
  .about-data-grid__item.--item07 > picture {
    margin-top: 2rem;
    width: 25.7rem;
  }
}

.about-data-grid__item.--item08 {
  grid-column: 1/3;
  grid-row: 6/7;
}
@media only screen and (max-width: 812px) {
  .about-data-grid__item.--item08 {
    padding-right: 1rem;
  }
  .about-data-grid__item.--item08 > h3 {
    text-align: left;
    padding-left: 3.5rem;
    margin-bottom: -2rem;
  }
  .about-data-grid__item.--item08 > picture {
    width: 92%;
    margin: 0 0 0 auto;
  }
}
@media print, screen and (min-width:813px) {
  .about-data-grid__item.--item08 {
    grid-column: 2/3;
    grid-row: 4/5;
  }
  .about-data-grid__item.--item08 > picture {
    width: 22.6rem;
  }
}

.about-data-grid__item.--item09 {
  grid-column: 1/3;
  grid-row: 7/8;
}
@media only screen and (max-width: 812px) {
  .about-data-grid__item.--item09 > picture {
    position: absolute;
    width: calc(50% + 1.2rem);
    right: 1.5rem;
    bottom: 1.5rem;
  }
  .about-data-grid__item.--item09 > p {
    padding-top: 2.8rem;
    padding-right: 45%;
    margin-bottom: -0.4rem;
    line-height: 1.6;
  }
}
@media print, screen and (min-width:813px) {
  .about-data-grid__item.--item09 {
    grid-column: 3/4;
    grid-row: 4/5;
  }
  .about-data-grid__item.--item09 > picture {
    width: 27rem;
    margin-top: -1.5rem;
  }
  .about-data-grid__item.--item09 > p {
    text-align: left;
  }
}

/**
  お祝いが仕事
 */
.second-intro.--job {
  position: relative;
  z-index: 4;
}

.job-oiwai {
  padding: 6rem 0 9rem;
  position: relative;
  z-index: 3;
}
.job-oiwai::after {
  content: "";
  display: block;
  position: absolute;
  pointer-events: none;
  width: 100%;
  height: 8vw;
  background-color: var(--col_beige);
  bottom: -8vw;
  mask: url(../img/sec_shape_mask_sp.svg) no-repeat center top/100% auto;
}
@media print, screen and (min-width:813px) {
  .job-oiwai::after {
    height: 10vw;
    bottom: calc(-10vw + 1px);
    mask-image: url(../img/sec_shape_mask.svg);
  }
}
@media print, screen and (min-width:813px) {
  .job-oiwai {
    padding: 10rem 0 12rem;
  }
}

.job-oiwai__bottom {
  font-family: var(--font-bold);
  font-weight: 600;
  text-align: center;
  line-height: 1.5;
  color: var(--col_dblue);
  margin-top: 3rem;
  font-size: 1.8rem;
}
@media print, screen and (min-width:813px) {
  .job-oiwai__bottom {
    margin-top: 8rem;
    font-size: 2.4rem;
  }
}

.job-oiwai__button {
  margin-top: 4rem;
  margin-left: auto;
  margin-right: auto;
  width: 24rem;
}
@media print, screen and (min-width:813px) {
  .job-oiwai__button {
    width: 30rem;
    margin-top: 4rem;
  }
}

.job-oiwai__bg {
  position: absolute;
  width: 115%;
  height: 100%;
  left: -11%;
  top: -2rem;
  pointer-events: none;
}
.job-oiwai__bg > picture {
  display: block;
}
.job-oiwai__bg > picture:last-child {
  position: absolute;
  left: 0;
  bottom: -8vw;
}
@media print, screen and (min-width:813px) {
  .job-oiwai__bg {
    width: 100%;
    left: 0;
    top: -8rem;
    min-width: 120rem;
  }
  .job-oiwai__bg > picture:last-child {
    bottom: -11vw;
    z-index: 1;
  }
}

.job-oiwai-block {
  position: relative;
  z-index: 5;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 812px) {
  .job-oiwai-block:not(:last-of-type) {
    margin-bottom: 5rem;
  }
}
@media print, screen and (min-width:813px) {
  .job-oiwai-block {
    width: 102rem;
    display: flex;
  }
}

@media print, screen and (min-width:813px) {
  .job-oiwai-block.--invert {
    flex-direction: row-reverse;
  }
}

@media only screen and (max-width: 812px) {
  .job-oiwai__pict {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
    margin-bottom: 1.5rem;
  }
}
@media print, screen and (min-width:813px) {
  .job-oiwai__pict {
    width: 39.8rem;
  }
}

.job-oiwai__content > h3 {
  font-family: var(--font-bold);
  font-weight: 600;
  line-height: 1.5;
  color: var(--col_dblue);
}
@media only screen and (max-width: 812px) {
  .job-oiwai__content {
    text-align: center;
  }
  .job-oiwai__content > h3 {
    font-size: 1.8rem;
  }
  .job-oiwai__content > p {
    margin-top: 1rem;
  }
}
@media print, screen and (min-width:813px) {
  .job-oiwai__content {
    flex: 1;
  }
  .job-oiwai__content > h3 {
    font-size: 2.4rem;
  }
  .job-oiwai__content > p {
    margin-top: 1.5rem;
  }
}

/**
  お祝いブロック固有
 */
@media print, screen and (min-width:813px) {
  .job-oiwai-block.--block01 .job-oiwai__content {
    padding: 5rem 0 0 4rem;
  }
}

@media print, screen and (min-width:813px) {
  .job-oiwai-block.--block02 {
    margin-top: -5rem;
  }
  .job-oiwai-block.--block02 .job-oiwai__content {
    padding: 17rem 0 0 25rem;
  }
}

@media print, screen and (min-width:813px) {
  .job-oiwai-block.--block03 {
    margin-top: 3rem;
  }
  .job-oiwai-block.--block03 .job-oiwai__content {
    padding: 16rem 0 0 3rem;
  }
}

/**
  埋め込み動画
 */
.job-oiwai__video {
  position: relative;
  z-index: 3;
  margin-top: 7rem;
}
.job-oiwai__video video {
  width: 100%;
}
@media only screen and (max-width: 812px) {
  .job-oiwai__video {
    width: 100%;
    aspect-ratio: 2;
  }
  @supports not (aspect-ratio: auto) {
    .job-oiwai__video {
      position: relative;
    }
    .job-oiwai__video::before {
      float: left;
      content: "";
      padding-top: 50%;
    }
    .job-oiwai__video::after {
      display: block;
      content: "";
      clear: both;
    }
    .job-oiwai__video > img {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }
  .job-oiwai__video img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}
@media print, screen and (min-width:813px) {
  .job-oiwai__video {
    margin-top: 8rem;
  }
}

/**
  仕事紹介
 */
.job-career {
  position: relative;
  z-index: 1;
  padding: 8rem 0;
  background: url(../img/bg_ptn.png) repeat center center/3.2rem auto;
}
@media print, screen and (min-width:813px) {
  .job-career {
    background: url(../img/bg_ptn.png) repeat center center/5.6rem auto;
    padding: 12rem 0;
  }
}

.job-career-block {
  display: block;
  background-color: var(--col_blue);
  border-radius: 2rem;
  overflow: hidden;
  color: #fff;
}
@media print, screen and (min-width:813px) {
  .job-career-block {
    display: flex;
  }
  .job-career-block:hover .job-career__pict img {
    transform: scale3d(1.05, 1.05, 1);
  }
  .job-career-block:hover .job-career-conetnt__button.button-a .button-inner {
    background-color: var(--col_blue);
    color: #fff;
  }
}

.job-career__pict {
  display: block;
  overflow: hidden;
}
.job-career__pict img {
  transition: 0.3s transform;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media print, screen and (min-width:813px) {
  .job-career__pict {
    width: 50%;
  }
}

.job-career-content {
  color: #fff;
  padding: 3rem;
}
.job-career-content p {
  text-align: justify;
  text-justify: inter-ideograph;
}
@media print, screen and (min-width:813px) {
  .job-career-content {
    width: 50%;
    padding: 4rem 4.5rem;
  }
}

.job-career-content__heading {
  text-align: center;
  line-height: 1.5;
  font-family: var(--font-bold);
  font-weight: 600;
  font-size: 2.2rem;
  margin-bottom: 1.5rem;
}
@media print, screen and (min-width:813px) {
  .job-career-content__heading {
    font-size: 3rem;
    margin-bottom: 2.5rem;
  }
}

.job-career-content__catch {
  line-height: 1.5;
  font-size: 1.8rem;
  font-family: var(--font-bold);
  font-weight: 600;
  margin-bottom: 1.2rem;
}
@media print, screen and (min-width:813px) {
  .job-career-content__catch {
    font-size: 2.4rem;
    margin-bottom: 1.2rem;
  }
}

.job-career-conetnt__button {
  margin-left: auto;
  margin-right: auto;
  width: 24rem;
  margin-top: 2rem;
}
.job-career-conetnt__button.button-a .button-inner {
  color: var(--col_blue);
}
@media print, screen and (min-width:813px) {
  .job-career-conetnt__button {
    width: 30rem;
    margin-top: 3rem;
  }
  .job-career-conetnt__button .button-inner:hover {
    color: #fff;
    background-color: var(--col_blue);
  }
}

/**
  イントロの図 1
 */
.system-figure-wrap,
.system-figure-wrap2 {
  background-color: #F3E2BC;
  padding: 4rem 3rem;
  margin-top: 4rem;
}
@media print, screen and (min-width:813px) {
  .system-figure-wrap,
  .system-figure-wrap2 {
    margin-top: 6rem;
    padding: 8rem 9rem;
  }
}

.system-figure-wrap2 {
  background-color: #D7EDF4;
}
@media print, screen and (min-width:813px) {
  .system-figure-wrap2 {
    padding: 7rem 9rem 8rem;
  }
}

.system__figure > li {
  font-family: var(--font-bold);
  font-weight: 600;
  position: relative;
  color: #fff;
  font-size: 1.8rem;
  border-radius: 1.2rem;
  margin-bottom: 3rem;
  text-align: center;
  background-color: var(--col_sblue);
  line-height: 1.5;
  padding: 1rem;
}
.system__figure > li small {
  font-size: 0.56em;
  display: block;
  font-family: var(--font-bold);
  font-weight: 600;
}
.system__figure > li::after {
  content: "";
  display: block;
  position: absolute;
  width: 1.2rem;
  height: 1.6rem;
  left: calc(50% - 0.6rem);
  bottom: -2.3rem;
  background: url(../../system/img/fig_arrow.svg) no-repeat center center/contain;
}
.system__figure > li:last-child {
  margin-bottom: 0;
}
.system__figure > li:last-child::after {
  display: none;
}
@media print, screen and (min-width:813px) {
  .system__figure > li {
    padding: 1.5rem;
    font-size: 2.2rem;
    margin-bottom: 4rem;
  }
  .system__figure > li::after {
    width: 1.7rem;
    height: 2.2rem;
    left: calc(50% - 0.8rem);
    bottom: -3.2rem;
  }
}

.system__figure.--intro > li:nth-child(2),
.system__figure.--intro > li:nth-child(3) {
  color: var(--col_sblue);
  background-color: #fff;
}
.system__figure.--intro > li:nth-child(5) {
  background-color: var(--col_dblue);
}
@media only screen and (max-width: 812px) {
  .system__figure.--intro > li:nth-child(2) {
    font-size: 1.6rem;
  }
  .system__figure.--intro > li:nth-child(3) {
    padding: 1.5rem;
  }
  .system__figure.--intro > li:nth-child(5) {
    font-size: 1.6rem;
  }
}
@media print, screen and (min-width:813px) {
  .system__figure.--intro > li:nth-child(3) {
    padding: 3rem;
  }
}

.system__figure.--system > li {
  position: relative;
  background-color: var(--col_dblue);
  font-size: 1.4rem;
}
.system__figure.--system > li:nth-child(1) {
  padding: 0;
  background: none;
}
.system__figure.--system > li:nth-child(3)::before,
.system__figure.--system > li:nth-child(4)::before {
  content: "";
  display: block;
  position: absolute;
  width: 2rem;
  height: 8.7rem;
  background: url(../../system/img/fig_pict_sp.png) no-repeat center center/contain;
}
@media only screen and (max-width: 812px) {
  .system__figure.--system > li:nth-child(3)::before {
    left: -2.2rem;
    top: 1.6rem;
  }
  .system__figure.--system > li:nth-child(4)::before {
    right: -2.2rem;
    top: -6.2rem;
    transform: rotate(180deg);
  }
}
@media print, screen and (min-width:813px) {
  .system__figure.--system > li {
    font-size: 1.9rem;
  }
  .system__figure.--system > li:nth-child(3)::before,
  .system__figure.--system > li:nth-child(4)::before {
    width: 3.2rem;
    height: 12rem;
    background-image: url(../../system/img/fig_pict.png);
  }
  .system__figure.--system > li:nth-child(3)::before {
    left: -3.5rem;
    top: 2.2rem;
  }
  .system__figure.--system > li:nth-child(4)::before {
    right: -3.5rem;
    top: -8.4rem;
    transform: rotate(180deg);
  }
}

/**
働く環境と制度
 */
.system-env {
  background-color: var(--col_beige);
  position: relative;
  z-index: 3;
  z-index: 5;
  padding: 4rem 0 calc(3rem + 8vw);
}
.system-env::after {
  content: "";
  display: block;
  position: absolute;
  pointer-events: none;
  width: 100%;
  height: 8vw;
  background-color: var(--col_beige);
  bottom: -8vw;
  mask: url(../img/sec_shape_mask_sp.svg) no-repeat center top/100% auto;
}
@media print, screen and (min-width:813px) {
  .system-env::after {
    height: 10vw;
    bottom: calc(-10vw + 1px);
    mask-image: url(../img/sec_shape_mask.svg);
  }
}
.system-env .heading-sec {
  color: var(--col_dbrown);
}
@media print, screen and (min-width:813px) {
  .system-env {
    padding: 10rem 0 calc(3rem + 10vw);
  }
}

.system-env-block {
  position: relative;
}
.system-env-block picture {
  display: block;
}
.system-env-block .block-container {
  position: relative;
}
@media only screen and (max-width: 812px) {
  .system-env-block > p {
    text-align: center;
    margin-top: 1.5rem;
  }
}
@media print, screen and (min-width:813px) {
  .system-env-block {
    margin-left: 18vw;
  }
  .system-env-block > p {
    margin-top: 1.6rem;
    padding-left: 13rem;
  }
  .system-env-block > picture {
    margin: 0 0 0 auto;
  }
}

.system-env-block + .system-env-block {
  margin-top: 10rem;
}
@media print, screen and (min-width:813px) {
  .system-env-block + .system-env-block {
    margin-top: 11rem;
  }
}

.system-env-block__heading {
  position: absolute;
  z-index: 3;
}
@media only screen and (max-width: 812px) {
  .system-env-block__heading {
    left: 1.5rem;
    top: -6.5rem;
  }
}
@media print, screen and (min-width:813px) {
  .system-env-block__heading {
    bottom: -7rem;
    left: -13rem;
  }
}

/**
  ブロック 反転レイアウト
 */
@media only screen and (max-width: 812px) {
  .system-env-block.--invert .system-env-block__heading {
    left: auto;
    right: 1.5rem;
  }
}
@media print, screen and (min-width:813px) {
  .system-env-block.--invert {
    margin-left: auto;
    margin-right: 18vw;
  }
  .system-env-block.--invert > p {
    text-align: right;
    padding-right: 13rem;
    padding-left: 0;
  }
  .system-env-block.--invert .system-env-block__heading {
    left: auto;
    right: -13rem;
  }
}

/**
  プロジェクト
 */
.system-project {
  background-color: var(--col_sblue);
  padding: 6rem 0 12rem;
  position: relative;
  z-index: 3;
}
.system-project::after {
  content: "";
  display: block;
  position: absolute;
  pointer-events: none;
  width: 100%;
  height: 8vw;
  background-color: var(--col_sblue);
  bottom: calc(-8vw + 1px);
  mask: url(../img/sec_shape_mask_invert_sp.svg) no-repeat center top/100% auto;
}
@media print, screen and (min-width:813px) {
  .system-project::after {
    height: 10vw;
    bottom: calc(-10vw + 1px);
    mask-image: url(../img/sec_shape_mask_invert.svg);
  }
}
.system-project > p {
  color: #fff;
  text-align: center;
}
@media print, screen and (min-width:813px) {
  .system-project {
    padding: 10rem 0;
  }
}

.system-project-container {
  margin-top: 2rem;
}
@media print, screen and (min-width:813px) {
  .system-project-container {
    display: flex;
    justify-content: space-between;
    margin-top: 11rem;
  }
}

.system-project__link {
  position: relative;
  display: block;
  background-color: #fff;
  border-radius: 2rem;
  padding: 2rem 2rem 5rem;
  margin-bottom: 2rem;
}
.system-project__link::after {
  content: "";
  display: block;
  position: absolute;
  width: 1rem;
  height: 1.7rem;
  right: 2rem;
  bottom: 2rem;
  background-color: var(--col_dblue);
  mask: url(../img/ic_arrow_a.svg) no-repeat center center/contain;
}
.system-project__link > picture {
  display: block;
  margin-bottom: 1.5rem;
}
.system-project__link > h4 {
  font-family: var(--font-bold);
  font-weight: 600;
  line-height: 1.3;
  margin-bottom: 0.6rem;
  font-size: 1.6rem;
}
.system-project__link p {
  text-align: justify;
  text-justify: inter-ideograph;
}
@media print, screen and (min-width:813px) {
  .system-project__link {
    margin-bottom: 0;
    position: relative;
    width: calc(50% - 2rem);
    padding: 3rem 26rem 6rem 2.5rem;
  }
  .system-project__link::after {
    width: 1.2rem;
    height: 2.4rem;
    right: 2.5rem;
    bottom: 2.5rem;
    mask-image: url(../img/ic_arrow_a2.svg);
  }
  .system-project__link > picture {
    position: absolute;
    display: block;
    width: 21rem;
    right: 2.5rem;
    top: 2.5rem;
    overflow: hidden;
    border-radius: 2rem;
  }
  .system-project__link > picture img {
    transition: 0.3s transform;
  }
  .system-project__link > h4 {
    font-size: 2.1rem;
    margin-bottom: 1rem;
  }
  .system-project__link:hover > picture img {
    transform: scale3d(1.05, 1.05, 1);
  }
}

/**
  project ボタン
 */
.system-project__button {
  margin-left: auto;
  margin-right: auto;
  margin-top: 3rem;
  width: 24rem;
}
.system-project__button.button-a .button-inner {
  color: var(--col_sblue);
}
@media print, screen and (min-width:813px) {
  .system-project__button {
    margin-top: 8rem;
    width: 30rem;
    margin-bottom: -5vw;
    position: relative;
    z-index: 10;
  }
  .system-project__button .button-inner:hover {
    color: #fff;
    background-color: var(--col_sblue);
  }
}

/**
  人事制度・福利厚生
 */
.system-welfare {
  background-color: #F2E3BC;
  padding: calc(6rem + 8vw) 0 8rem;
}
.system-welfare > p {
  text-align: center;
  color: var(--col_dbrown);
}
.system-welfare .heading-sec {
  color: var(--col_dbrown);
}
@media print, screen and (min-width:813px) {
  .system-welfare {
    padding: calc(10rem + 10vw) 0 16rem;
  }
}

.system-welfare__list > li {
  background-color: rgba(255, 255, 255, 0.8);
  border-radius: 2rem;
  padding: 2.5rem 3rem;
}
.system-welfare__list > li p {
  text-align: justify;
  text-justify: inter-ideograph;
}
.system-welfare__list > li > h4 {
  font-family: var(--font-bold);
  font-weight: 600;
  line-height: 1.3;
  font-size: 2rem;
  text-align: center;
  color: var(--col_brown);
  margin-bottom: 1.5rem;
}
.system-welfare__list > li:not(:first-child) {
  margin-top: 2rem;
}
@media print, screen and (min-width:813px) {
  .system-welfare__list > li {
    padding: 2rem 7rem;
    display: flex;
  }
  .system-welfare__list > li > h4 {
    width: 26%;
    display: flex;
    align-items: center;
    font-size: 2.1rem;
    text-align: left;
    margin-bottom: 0;
  }
  .system-welfare__list > li > p {
    flex: 1;
  }
  .system-welfare__list > li:not(:first-child) {
    margin-top: 1rem;
  }
}

.entry-desc {
  padding: 0 0 7rem 0;
}
@media print, screen and (min-width:813px) {
  .entry-desc {
    padding: 12rem 0;
  }
}

.entry-desc-block {
  background-color: #fff;
  padding: 2.2rem 2.5rem;
  border-radius: 2rem;
}
@media print, screen and (min-width:813px) {
  .entry-desc-block {
    padding: 4rem 6rem;
  }
}

.entry-desc-block + .entry-desc-block {
  margin-top: 2rem;
}
@media print, screen and (min-width:813px) {
  .entry-desc-block + .entry-desc-block {
    margin-top: 3rem;
  }
}

/**
  アコーディオントリガー
 */
.entry-desc-block__heading {
  position: relative;
  color: var(--col_dblue);
  font-size: 2rem;
  font-family: var(--font-bold);
  font-weight: 600;
}
.entry-desc-block__heading span {
  display: flex;
  position: absolute;
  width: 3.2rem;
  height: 3.2rem;
  background: var(--col_blue);
  border-radius: 50%;
  right: 0;
  top: calc(50% - 1.6rem);
  border: 1px solid var(--col_blue);
  transition: 0.3s;
}
.entry-desc-block__heading span::before, .entry-desc-block__heading span::after {
  content: "";
  display: block;
  position: absolute;
  width: 1rem;
  height: 0.2rem;
  background-color: #fff;
  transition: 0.3s;
  top: calc(50% + 0.4rem);
}
.entry-desc-block__heading span::before {
  transform-origin: 100% 100%;
  transform: rotate(45deg);
  right: 50%;
}
.entry-desc-block__heading span::after {
  transform-origin: 0 100%;
  left: 50%;
  transform: rotate(-45deg);
}
.entry-desc-block__heading.is-active span {
  background-color: #fff;
}
.entry-desc-block__heading.is-active span::before, .entry-desc-block__heading.is-active span::after {
  top: calc(50% - 0.1rem);
  background-color: var(--col_blue);
  transform: rotate(0deg);
  width: 0.8rem;
}
.entry-desc-block__heading.is-active span::before {
  right: calc(50% - 0.6rem);
}
.entry-desc-block__heading.is-active span::after {
  left: calc(50% - 0.6rem);
}
@media print, screen and (min-width:813px) {
  .entry-desc-block__heading {
    font-size: 2.4rem;
    transition: 0.3s color;
  }
  .entry-desc-block__heading span {
    width: 5rem;
    height: 5rem;
    top: calc(50% - 2.5rem);
  }
  .entry-desc-block__heading span::before, .entry-desc-block__heading span::after {
    width: 1.6rem;
    height: 0.2rem;
    top: calc(50% + 0.6rem);
  }
  .entry-desc-block__heading.is-active span::before, .entry-desc-block__heading.is-active span::after {
    width: 1.2rem;
  }
  .entry-desc-block__heading.is-active span::before {
    right: calc(50% - 0.8rem);
  }
  .entry-desc-block__heading.is-active span::after {
    left: calc(50% - 0.8rem);
  }
  .entry-desc-block__heading:hover {
    color: var(--col_blue);
  }
  .entry-desc-block__heading:hover span {
    background-color: #fff;
  }
  .entry-desc-block__heading:hover span::before, .entry-desc-block__heading:hover span::after {
    background-color: var(--col_blue);
  }
}

.entry-desc-block-content {
  padding-top: 2rem;
}
.entry-desc-block-content > p {
  margin-bottom: 2rem;
  text-align: justify;
  text-justify: inter-ideograph;
}
@media print, screen and (min-width:813px) {
  .entry-desc-block-content {
    padding-top: 3rem;
  }
  .entry-desc-block-content > p {
    margin-bottom: 3rem;
  }
}

.entry-desc-block-content > dl {
  margin-top: 1em;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.entry-desc-block-content > dl > dt,
.entry-desc-block-content > dl > dd {
  padding: 1rem 0;
}
.entry-desc-block-content > dl > dt:not(:last-of-type),
.entry-desc-block-content > dl > dd:not(:last-of-type) {
  background-image: radial-gradient(circle, #ddd 1px, transparent 1px);
  background-position: bottom left;
  background-repeat: repeat-x;
  background-size: 6px 2px;
}
.entry-desc-block-content > dl > dt {
  font-family: var(--font-bold);
  font-weight: 600;
  width: 8rem;
  padding-right: 1em;
}
.entry-desc-block-content > dl > dd {
  width: calc(100% - 8rem);
  text-align: justify;
  text-justify: inter-ideograph;
}
@media print, screen and (min-width:813px) {
  .entry-desc-block-content > dl > dt,
  .entry-desc-block-content > dl > dd {
    padding: 1.5rem 0;
  }
  .entry-desc-block-content > dl > dt {
    width: 16rem;
  }
  .entry-desc-block-content > dl > dd {
    width: calc(100% - 16rem);
  }
}

/**
  エントリーの流れ
 */
.entry-flow {
  background-color: #C4DFE8;
  text-align: center;
  color: var(--col_dblue);
  padding: 3rem 3rem 5rem;
}
@media print, screen and (min-width:813px) {
  .entry-flow {
    padding: 5rem 6rem 8rem;
  }
}

.entry-flow__fig {
  counter-reset: num 0;
  position: relative;
}
@media only screen and (max-width: 812px) {
  .entry-flow__fig {
    margin-top: 4rem;
  }
  .entry-flow__fig::before {
    content: "";
    display: block;
    position: absolute;
    height: calc(100% - 6.5rem);
    width: 0.3rem;
    left: 3.5rem;
    top: 3.2rem;
    background-color: var(--col_dblue);
    transition: transform 2s;
    transform-origin: 0 0;
    transition-timing-function: linear;
  }
  .entry-flow__fig > li {
    position: relative;
    text-align: left;
    padding-left: 10rem;
    font-family: var(--font-bold);
    font-weight: 600;
    font-size: 1.8rem;
    line-height: 1.5;
    height: 6.5rem;
    display: flex;
    justify-content: center;
    flex-direction: column;
  }
  .entry-flow__fig > li span {
    transition: opacity 0.7s;
  }
  .entry-flow__fig > li::before {
    content: "";
    display: block;
    position: absolute;
    width: 7.5rem;
    height: 6.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Outfit", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-weight: 700;
    left: 0;
    font-size: 2.1rem;
    background-color: #fff;
    mask: url(../../entry/img/flow_shape.svg) no-repeat center center/contain;
    content: "0" counter(num);
    counter-increment: num 1;
    transition: transform 0.5s, opacity 0.5s;
    transition-timing-function: cubic-bezier(0.73, 0, 0.3, 1.38);
    transform-origin: 50% 50%;
  }
  .entry-flow__fig > li:nth-child(1)::before {
    transition-delay: 0s;
  }
  .entry-flow__fig > li:nth-child(1) span {
    transition-delay: 0s;
  }
  .entry-flow__fig > li:nth-child(2)::before {
    transition-delay: 0.5s;
  }
  .entry-flow__fig > li:nth-child(2) span {
    transition-delay: 0.5s;
  }
  .entry-flow__fig > li:nth-child(3)::before {
    transition-delay: 1s;
  }
  .entry-flow__fig > li:nth-child(3) span {
    transition-delay: 1s;
  }
  .entry-flow__fig > li:nth-child(4)::before {
    transition-delay: 1.5s;
  }
  .entry-flow__fig > li:nth-child(4) span {
    transition-delay: 1.5s;
  }
  .entry-flow__fig > li:nth-child(5)::before {
    transition-delay: 2s;
  }
  .entry-flow__fig > li:nth-child(5) span {
    transition-delay: 2s;
  }
  .entry-flow__fig > li:nth-child(6)::before {
    transition-delay: 2.5s;
  }
  .entry-flow__fig > li:nth-child(6) span {
    transition-delay: 2.5s;
  }
  .entry-flow__fig > li:nth-child(7)::before {
    transition-delay: 3s;
  }
  .entry-flow__fig > li:nth-child(7) span {
    transition-delay: 3s;
  }
  .entry-flow__fig > li:nth-child(8)::before {
    transition-delay: 3.5s;
  }
  .entry-flow__fig > li:nth-child(8) span {
    transition-delay: 3.5s;
  }
  .entry-flow__fig > li:nth-child(9)::before {
    transition-delay: 4s;
  }
  .entry-flow__fig > li:nth-child(9) span {
    transition-delay: 4s;
  }
  .entry-flow__fig > li:nth-child(10)::before {
    transition-delay: 4.5s;
  }
  .entry-flow__fig > li:nth-child(10) span {
    transition-delay: 4.5s;
  }
  .entry-flow__fig > li:not(:last-child) {
    margin-bottom: 1.5rem;
  }
  .entry-flow__fig.ef-io::before {
    transform: scale3d(1, 0, 1);
  }
  .entry-flow__fig.ef-io > li span {
    opacity: 0;
  }
  .entry-flow__fig.ef-io > li::before {
    opacity: 0;
    transform: scale3d(0.7, 0.7, 1);
  }
}
@media print, screen and (min-width:813px) {
  .entry-flow__fig {
    position: relative;
    margin-top: 5rem;
    display: flex;
    gap: 2.3rem;
    justify-content: center;
  }
  .entry-flow__fig::before {
    content: "";
    display: block;
    position: absolute;
    width: calc(100% - 22.5rem);
    left: 11.3rem;
    top: calc(50% - 0.2rem);
    height: 0.4rem;
    background-color: var(--col_dblue);
    transition: transform 2s;
    transform-origin: 0 0;
    transition-timing-function: linear;
  }
  .entry-flow__fig > li {
    background-color: #fff;
    mask: url(../../entry/img/flow_shape.svg) no-repeat center center/contain;
    width: 22.5rem;
    height: 19.4rem;
    text-align: center;
    color: var(--col_dblue);
    line-height: 1.5;
    font-family: var(--font-bold);
    font-weight: 600;
    font-size: 2.1rem;
    padding-top: 3rem;
    transition: transform 0.5s, opacity 0.5s;
    transition-timing-function: cubic-bezier(0.73, 0, 0.3, 1.38);
    transform-origin: 50% 50%;
  }
  .entry-flow__fig > li:nth-child(1) {
    transition-delay: 0s;
  }
  .entry-flow__fig > li:nth-child(2) {
    transition-delay: 0.5s;
  }
  .entry-flow__fig > li:nth-child(3) {
    transition-delay: 1s;
  }
  .entry-flow__fig > li:nth-child(4) {
    transition-delay: 1.5s;
  }
  .entry-flow__fig > li:nth-child(5) {
    transition-delay: 2s;
  }
  .entry-flow__fig > li:nth-child(6) {
    transition-delay: 2.5s;
  }
  .entry-flow__fig > li:nth-child(7) {
    transition-delay: 3s;
  }
  .entry-flow__fig > li:nth-child(8) {
    transition-delay: 3.5s;
  }
  .entry-flow__fig > li:nth-child(9) {
    transition-delay: 4s;
  }
  .entry-flow__fig > li:nth-child(10) {
    transition-delay: 4.5s;
  }
  .entry-flow__fig > li > small {
    font-size: 0.7em;
  }
  .entry-flow__fig > li::before {
    display: block;
    content: "0" counter(num);
    counter-increment: num 1;
    margin-bottom: 1rem;
    font-family: "Outfit", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-weight: 700;
    font-size: 3.5rem;
  }
  .entry-flow__fig.ef-io::before {
    transform: scale3d(0, 1, 1);
  }
  .entry-flow__fig.ef-io > li {
    opacity: 0;
    transform: scale3d(0.7, 0.7, 1);
  }
}

/**
  エントリー
 */
.entry-entry {
  position: relative;
  z-index: 3;
  padding: 8rem 0;
}
.entry-entry::after {
  content: "";
  display: block;
  position: absolute;
  pointer-events: none;
  width: 100%;
  height: 8vw;
  background-color: var(--col_lblue);
  bottom: -8vw;
  mask: url(../img/sec_shape_mask_sp.svg) no-repeat center top/100% auto;
}
@media print, screen and (min-width:813px) {
  .entry-entry::after {
    height: 10vw;
    bottom: calc(-10vw + 1px);
    mask-image: url(../img/sec_shape_mask.svg);
  }
}
@media print, screen and (min-width:813px) {
  .entry-entry {
    padding: 16rem 0;
  }
}

.entry-entry__button {
  margin-left: auto;
  margin-right: auto;
}
.entry-entry__button:not(:last-of-type) {
  margin-bottom: 1.2rem;
}
.entry-entry__button .button-inner {
  background-color: #ddd;
  color: #Fff;
  border-radius: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  letter-spacing: 0.1em;
  height: 7.2rem;
  font-size: 2.1rem;
  transition: 0.3s background-color, 0.3s color;
}
.entry-entry__button .button-inner::after {
  content: "";
  display: block;
  position: absolute;
  width: 1rem;
  height: 1.7rem;
  background-color: #fff;
  right: 3rem;
  top: calc(50% - 0.85rem);
  mask: url(../img/ic_arrow_a.svg) no-repeat center center/contain;
  transition: background-color 0.3s;
}
@media only screen and (max-width: 812px) {
  .entry-entry__button {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
  }
}
@media print, screen and (min-width:813px) {
  .entry-entry__button {
    max-width: 90rem;
  }
  .entry-entry__button:not(:last-of-type) {
    margin-bottom: 3rem;
  }
  .entry-entry__button .button-inner {
    height: 14.5rem;
    font-size: 3rem;
  }
  .entry-entry__button .button-inner::after {
    content: "";
    display: block;
    position: absolute;
    width: 1.4rem;
    height: 2.8rem;
    right: 6rem;
    top: calc(50% - 1.4rem);
    mask: url(../img/ic_arrow_a2.svg) no-repeat center center/contain;
  }
}

.entry-entry__button.--entry .button-inner {
  border: 1px solid var(--col_orange);
  background-color: var(--col_orange);
}
@media print, screen and (min-width:813px) {
  .entry-entry__button.--entry .button-inner:hover {
    color: var(--col_orange);
    background-color: #fff;
  }
  .entry-entry__button.--entry .button-inner:hover::after {
    background-color: var(--col_orange);
  }
}

.entry-entry__button.--contact .button-inner {
  border: 1px solid var(--col_blue);
  background-color: var(--col_blue);
}
@media print, screen and (min-width:813px) {
  .entry-entry__button.--contact .button-inner:hover {
    color: var(--col_blue);
    background-color: #fff;
  }
  .entry-entry__button.--contact .button-inner:hover::after {
    background-color: var(--col_blue);
  }
}

/**
  FAQ
 */
.entry-faq {
  background-color: #FEF3E7;
  position: relative;
  padding: 6rem 0;
}
@media print, screen and (min-width:813px) {
  .entry-faq {
    padding: 10vw 0 12rem;
  }
}

@media print, screen and (min-width:813px) {
  .entry-faq .heading-sec {
    /*transform: translate3d(0, -3vw, 0);
    margin-bottom: -3vw;*/
  }
}

.entry-faq__list {
  margin-top: 3rem;
}
@media print, screen and (min-width:813px) {
  .entry-faq__list {
    margin-top: 7rem;
  }
}

.contact-head {
  color: var(--col_dblue);
  margin-bottom: 5rem;
}
.contact-head > p {
  text-align: center;
  font-family: var(--font-bold);
  font-weight: 600;
  letter-spacing: 0.1em;
}
@media print, screen and (min-width:813px) {
  .contact-head {
    margin-bottom: 8rem;
  }
}

.contact-form {
  background-color: #fff;
  padding: 4.5rem 3rem 6rem;
}
@media print, screen and (min-width:813px) {
  .contact-form {
    padding: 5rem 15% 6rem;
  }
}

.contact__complete-button {
  margin-left: auto;
  margin-right: auto;
  margin-top: 3rem;
  width: 24rem;
}
@media print, screen and (min-width:813px) {
  .contact__complete-button {
    margin-top: 4rem;
    width: 30rem;
  }
}

/* ==========================================================================
   Utilities
   ========================================================================== */
/* ==========================================================================

	#テキストモジュールとユーティリティ

	36　コピー
	27　 H1相当　ページタイトル
	25　 H2相当　コピー・見出しおよびラベル
	24　 H3相当　見出しおよびラベル
	20　コピー・中見出し・ラベル
	18　本文：大・ラベル
	16　本文：中
	14　本文：小を使用しています。
	12　最小（注文など一部のみ）

 */
/* -------------------------------------------------------------------------
	本文指定
*/
.txt-ll,
.txt-l,
.txt-m,
.txt-s,
.txt-ss {
  line-height: 1.85;
}

.txt-ll {
  font-size: var(--f20);
}

.txt-l {
  font-size: var(--f18);
}

.txt-m {
  font-size: var(--f16);
}

.txt-s {
  font-size: var(--f14);
}

.txt-ss {
  font-size: var(--f12);
}

@media only screen and (max-width: 812px) {
  .txt-ll {
    font-size: var(--f16);
  }
  .txt-l {
    font-size: var(--f14);
  }
  .txt-m {
    font-size: var(--f13);
  }
  .txt-s {
    font-size: var(--f12);
  }
  .txt-ss {
    font-size: var(--f11);
  }
}
/* -------------------------------------------------------------------------
	ユーティリティmisc
*/
/*一字下げ*/
.indent-head {
  padding-left: 1.2em;
  text-indent: -1.2em;
}

.font-bold {
  font-weight: 700;
}

.font-semi-bold {
  font-weight: 600;
}

.font-normal {
  font-weight: normal;
}

/* ==========================================================================

   ユーティリティモジュール

 */
/* -------------------------------------------------------------------------
	画像を100%に/100%を解除
	<img class="u-fit" src="xxx.jpg" />
*/
.u-fit {
  width: 100%;
  height: auto;
}

.u-free {
  width: auto;
}

/* -------------------------------------------------------------------------
	SPのみ、PCのみで改行させる
	<br class="u-spbr" />
	<br class="u-pcbr" />
*/
.u-spbr {
  display: none;
}
@media only screen and (max-width: 812px) {
  .u-spbr {
    display: inline;
  }
}

.u-pcbr {
  display: none;
}
@media print, screen and (min-width:813px) {
  .u-pcbr {
    display: inline;
  }
}

.u-tdbr {
  display: none;
}
@media only screen and (max-width: 812px) {
  .u-tdbr {
    display: inline;
  }
}

/* -------------------------------------------------------------------------
	フロート
*/
@media print, screen and (min-width:813px) {
  .u-floatL {
    float: left;
  }
}

@media print, screen and (min-width:813px) {
  .u-floatR {
    float: right;
  }
}

/* -------------------------------------------------------------------------
	position:relative
*/
.u-relative {
  position: relative;
}

/* -------------------------------------------------------------------------
	インラインテキストリンク
*/
.u-textLink:link, .u-textLink:visited {
  text-decoration: underline;
}
@media print, screen and (min-width:813px) {
  .u-textLink:hover {
    text-decoration: none;
  }
}

.u-textLink.--newwin::after {
  display: inline-block;
  content: "";
  width: 1.7rem;
  height: 1.7rem;
  margin-left: 1rem;
  background: url(../img/ic_newwin.svg) no-repeat center center/contain;
}

/* -------------------------------------------------------------------------
	縦書きテキスト
*/
.u-vertical-text {
  font-feature-settings: "pkna";
  writing-mode: vertical-rl;
  text-orientation: mixed;
  -ms-text-combine-horizontal: all;
}

/* -------------------------------------------------------------------------
	ブロック指定
*/
.u-inlineBlock {
  display: inline-block;
}

@media only screen and (max-width: 812px) {
  .u-sp-inlineBlock {
    display: inline-block;
  }
}

.u-block {
  display: block;
}

/* -------------------------------------------------------------------------
	リスト要素のスタイル
*/
.u-list-indent li {
  padding-left: 1em;
  text-indent: -1em;
}

.u-list-disc li {
  list-style-type: disc;
  margin-bottom: 1em;
  margin-left: 1.2em;
}

/* -------------------------------------------------------------------------
	PCレイアウト時に非表示
*/
.u-sp-only {
  display: none !important;
}

.u-pc-only {
  display: block !important;
}

@media only screen and (min-width: 0px) and (max-width: 812px) {
  .u-sp-only {
    display: block !important;
  }
  .u-pc-only {
    display: none !important;
  }
}
.u-noWrap {
  white-space: nowrap;
}

@media print, screen and (min-width:813px) {
  .u-pc-pdng {
    display: inline-block;
    width: 20px;
  }
}

/* -------------------------------------------------------------------------
	罫線
*/
.u-hr {
  border-top: 1px solid #B9B9B9;
}

/* -------------------------------------------------------------------------
	マージン bottom top
*/
.l-mb0 {
  margin-bottom: 0rem;
}

.l-mt0 {
  margin-top: 0rem;
}

@media only screen and (max-width: 812px) {
  .l-mb0-sp {
    margin-bottom: 0rem !important;
  }
  .l-mt0-sp {
    margin-top: 0rem !important;
  }
}
.l-mb5 {
  margin-bottom: 0.5rem;
}

.l-mt5 {
  margin-top: 0.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb5-sp {
    margin-bottom: 0.5rem !important;
  }
  .l-mt5-sp {
    margin-top: 0.5rem !important;
  }
}
.l-mb10 {
  margin-bottom: 1rem;
}

.l-mt10 {
  margin-top: 1rem;
}

@media only screen and (max-width: 812px) {
  .l-mb10-sp {
    margin-bottom: 1rem !important;
  }
  .l-mt10-sp {
    margin-top: 1rem !important;
  }
}
.l-mb15 {
  margin-bottom: 1.5rem;
}

.l-mt15 {
  margin-top: 1.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb15-sp {
    margin-bottom: 1.5rem !important;
  }
  .l-mt15-sp {
    margin-top: 1.5rem !important;
  }
}
.l-mb20 {
  margin-bottom: 2rem;
}

.l-mt20 {
  margin-top: 2rem;
}

@media only screen and (max-width: 812px) {
  .l-mb20-sp {
    margin-bottom: 2rem !important;
  }
  .l-mt20-sp {
    margin-top: 2rem !important;
  }
}
.l-mb25 {
  margin-bottom: 2.5rem;
}

.l-mt25 {
  margin-top: 2.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb25-sp {
    margin-bottom: 2.5rem !important;
  }
  .l-mt25-sp {
    margin-top: 2.5rem !important;
  }
}
.l-mb30 {
  margin-bottom: 3rem;
}

.l-mt30 {
  margin-top: 3rem;
}

@media only screen and (max-width: 812px) {
  .l-mb30-sp {
    margin-bottom: 3rem !important;
  }
  .l-mt30-sp {
    margin-top: 3rem !important;
  }
}
.l-mb35 {
  margin-bottom: 3.5rem;
}

.l-mt35 {
  margin-top: 3.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb35-sp {
    margin-bottom: 3.5rem !important;
  }
  .l-mt35-sp {
    margin-top: 3.5rem !important;
  }
}
.l-mb40 {
  margin-bottom: 4rem;
}

.l-mt40 {
  margin-top: 4rem;
}

@media only screen and (max-width: 812px) {
  .l-mb40-sp {
    margin-bottom: 4rem !important;
  }
  .l-mt40-sp {
    margin-top: 4rem !important;
  }
}
.l-mb45 {
  margin-bottom: 4.5rem;
}

.l-mt45 {
  margin-top: 4.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb45-sp {
    margin-bottom: 4.5rem !important;
  }
  .l-mt45-sp {
    margin-top: 4.5rem !important;
  }
}
.l-mb50 {
  margin-bottom: 5rem;
}

.l-mt50 {
  margin-top: 5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb50-sp {
    margin-bottom: 5rem !important;
  }
  .l-mt50-sp {
    margin-top: 5rem !important;
  }
}
.l-mb55 {
  margin-bottom: 5.5rem;
}

.l-mt55 {
  margin-top: 5.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb55-sp {
    margin-bottom: 5.5rem !important;
  }
  .l-mt55-sp {
    margin-top: 5.5rem !important;
  }
}
.l-mb60 {
  margin-bottom: 6rem;
}

.l-mt60 {
  margin-top: 6rem;
}

@media only screen and (max-width: 812px) {
  .l-mb60-sp {
    margin-bottom: 6rem !important;
  }
  .l-mt60-sp {
    margin-top: 6rem !important;
  }
}
.l-mb65 {
  margin-bottom: 6.5rem;
}

.l-mt65 {
  margin-top: 6.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb65-sp {
    margin-bottom: 6.5rem !important;
  }
  .l-mt65-sp {
    margin-top: 6.5rem !important;
  }
}
.l-mb70 {
  margin-bottom: 7rem;
}

.l-mt70 {
  margin-top: 7rem;
}

@media only screen and (max-width: 812px) {
  .l-mb70-sp {
    margin-bottom: 7rem !important;
  }
  .l-mt70-sp {
    margin-top: 7rem !important;
  }
}
.l-mb75 {
  margin-bottom: 7.5rem;
}

.l-mt75 {
  margin-top: 7.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb75-sp {
    margin-bottom: 7.5rem !important;
  }
  .l-mt75-sp {
    margin-top: 7.5rem !important;
  }
}
.l-mb80 {
  margin-bottom: 8rem;
}

.l-mt80 {
  margin-top: 8rem;
}

@media only screen and (max-width: 812px) {
  .l-mb80-sp {
    margin-bottom: 8rem !important;
  }
  .l-mt80-sp {
    margin-top: 8rem !important;
  }
}
.l-mb85 {
  margin-bottom: 8.5rem;
}

.l-mt85 {
  margin-top: 8.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb85-sp {
    margin-bottom: 8.5rem !important;
  }
  .l-mt85-sp {
    margin-top: 8.5rem !important;
  }
}
.l-mb90 {
  margin-bottom: 9rem;
}

.l-mt90 {
  margin-top: 9rem;
}

@media only screen and (max-width: 812px) {
  .l-mb90-sp {
    margin-bottom: 9rem !important;
  }
  .l-mt90-sp {
    margin-top: 9rem !important;
  }
}
.l-mb95 {
  margin-bottom: 9.5rem;
}

.l-mt95 {
  margin-top: 9.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb95-sp {
    margin-bottom: 9.5rem !important;
  }
  .l-mt95-sp {
    margin-top: 9.5rem !important;
  }
}
.l-mb100 {
  margin-bottom: 10rem;
}

.l-mt100 {
  margin-top: 10rem;
}

@media only screen and (max-width: 812px) {
  .l-mb100-sp {
    margin-bottom: 10rem !important;
  }
  .l-mt100-sp {
    margin-top: 10rem !important;
  }
}
.l-mb105 {
  margin-bottom: 10.5rem;
}

.l-mt105 {
  margin-top: 10.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb105-sp {
    margin-bottom: 10.5rem !important;
  }
  .l-mt105-sp {
    margin-top: 10.5rem !important;
  }
}
.l-mb110 {
  margin-bottom: 11rem;
}

.l-mt110 {
  margin-top: 11rem;
}

@media only screen and (max-width: 812px) {
  .l-mb110-sp {
    margin-bottom: 11rem !important;
  }
  .l-mt110-sp {
    margin-top: 11rem !important;
  }
}
.l-mb115 {
  margin-bottom: 11.5rem;
}

.l-mt115 {
  margin-top: 11.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb115-sp {
    margin-bottom: 11.5rem !important;
  }
  .l-mt115-sp {
    margin-top: 11.5rem !important;
  }
}
.l-mb120 {
  margin-bottom: 12rem;
}

.l-mt120 {
  margin-top: 12rem;
}

@media only screen and (max-width: 812px) {
  .l-mb120-sp {
    margin-bottom: 12rem !important;
  }
  .l-mt120-sp {
    margin-top: 12rem !important;
  }
}
.l-mb125 {
  margin-bottom: 12.5rem;
}

.l-mt125 {
  margin-top: 12.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb125-sp {
    margin-bottom: 12.5rem !important;
  }
  .l-mt125-sp {
    margin-top: 12.5rem !important;
  }
}
.l-mb130 {
  margin-bottom: 13rem;
}

.l-mt130 {
  margin-top: 13rem;
}

@media only screen and (max-width: 812px) {
  .l-mb130-sp {
    margin-bottom: 13rem !important;
  }
  .l-mt130-sp {
    margin-top: 13rem !important;
  }
}
.l-mb135 {
  margin-bottom: 13.5rem;
}

.l-mt135 {
  margin-top: 13.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb135-sp {
    margin-bottom: 13.5rem !important;
  }
  .l-mt135-sp {
    margin-top: 13.5rem !important;
  }
}
.l-mb140 {
  margin-bottom: 14rem;
}

.l-mt140 {
  margin-top: 14rem;
}

@media only screen and (max-width: 812px) {
  .l-mb140-sp {
    margin-bottom: 14rem !important;
  }
  .l-mt140-sp {
    margin-top: 14rem !important;
  }
}
.l-mb145 {
  margin-bottom: 14.5rem;
}

.l-mt145 {
  margin-top: 14.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb145-sp {
    margin-bottom: 14.5rem !important;
  }
  .l-mt145-sp {
    margin-top: 14.5rem !important;
  }
}
.l-mb150 {
  margin-bottom: 15rem;
}

.l-mt150 {
  margin-top: 15rem;
}

@media only screen and (max-width: 812px) {
  .l-mb150-sp {
    margin-bottom: 15rem !important;
  }
  .l-mt150-sp {
    margin-top: 15rem !important;
  }
}
.l-mb155 {
  margin-bottom: 15.5rem;
}

.l-mt155 {
  margin-top: 15.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb155-sp {
    margin-bottom: 15.5rem !important;
  }
  .l-mt155-sp {
    margin-top: 15.5rem !important;
  }
}
.l-mb160 {
  margin-bottom: 16rem;
}

.l-mt160 {
  margin-top: 16rem;
}

@media only screen and (max-width: 812px) {
  .l-mb160-sp {
    margin-bottom: 16rem !important;
  }
  .l-mt160-sp {
    margin-top: 16rem !important;
  }
}
.l-mb165 {
  margin-bottom: 16.5rem;
}

.l-mt165 {
  margin-top: 16.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb165-sp {
    margin-bottom: 16.5rem !important;
  }
  .l-mt165-sp {
    margin-top: 16.5rem !important;
  }
}
.l-mb170 {
  margin-bottom: 17rem;
}

.l-mt170 {
  margin-top: 17rem;
}

@media only screen and (max-width: 812px) {
  .l-mb170-sp {
    margin-bottom: 17rem !important;
  }
  .l-mt170-sp {
    margin-top: 17rem !important;
  }
}
.l-mb175 {
  margin-bottom: 17.5rem;
}

.l-mt175 {
  margin-top: 17.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb175-sp {
    margin-bottom: 17.5rem !important;
  }
  .l-mt175-sp {
    margin-top: 17.5rem !important;
  }
}
.l-mb180 {
  margin-bottom: 18rem;
}

.l-mt180 {
  margin-top: 18rem;
}

@media only screen and (max-width: 812px) {
  .l-mb180-sp {
    margin-bottom: 18rem !important;
  }
  .l-mt180-sp {
    margin-top: 18rem !important;
  }
}
.l-mb185 {
  margin-bottom: 18.5rem;
}

.l-mt185 {
  margin-top: 18.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb185-sp {
    margin-bottom: 18.5rem !important;
  }
  .l-mt185-sp {
    margin-top: 18.5rem !important;
  }
}
.l-mb190 {
  margin-bottom: 19rem;
}

.l-mt190 {
  margin-top: 19rem;
}

@media only screen and (max-width: 812px) {
  .l-mb190-sp {
    margin-bottom: 19rem !important;
  }
  .l-mt190-sp {
    margin-top: 19rem !important;
  }
}
.l-mb195 {
  margin-bottom: 19.5rem;
}

.l-mt195 {
  margin-top: 19.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb195-sp {
    margin-bottom: 19.5rem !important;
  }
  .l-mt195-sp {
    margin-top: 19.5rem !important;
  }
}
.l-mb200 {
  margin-bottom: 20rem;
}

.l-mt200 {
  margin-top: 20rem;
}

@media only screen and (max-width: 812px) {
  .l-mb200-sp {
    margin-bottom: 20rem !important;
  }
  .l-mt200-sp {
    margin-top: 20rem !important;
  }
}
.l-mb205 {
  margin-bottom: 20.5rem;
}

.l-mt205 {
  margin-top: 20.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb205-sp {
    margin-bottom: 20.5rem !important;
  }
  .l-mt205-sp {
    margin-top: 20.5rem !important;
  }
}
.l-mb210 {
  margin-bottom: 21rem;
}

.l-mt210 {
  margin-top: 21rem;
}

@media only screen and (max-width: 812px) {
  .l-mb210-sp {
    margin-bottom: 21rem !important;
  }
  .l-mt210-sp {
    margin-top: 21rem !important;
  }
}
.l-mb215 {
  margin-bottom: 21.5rem;
}

.l-mt215 {
  margin-top: 21.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb215-sp {
    margin-bottom: 21.5rem !important;
  }
  .l-mt215-sp {
    margin-top: 21.5rem !important;
  }
}
.l-mb220 {
  margin-bottom: 22rem;
}

.l-mt220 {
  margin-top: 22rem;
}

@media only screen and (max-width: 812px) {
  .l-mb220-sp {
    margin-bottom: 22rem !important;
  }
  .l-mt220-sp {
    margin-top: 22rem !important;
  }
}
.l-mb225 {
  margin-bottom: 22.5rem;
}

.l-mt225 {
  margin-top: 22.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb225-sp {
    margin-bottom: 22.5rem !important;
  }
  .l-mt225-sp {
    margin-top: 22.5rem !important;
  }
}
.l-mb230 {
  margin-bottom: 23rem;
}

.l-mt230 {
  margin-top: 23rem;
}

@media only screen and (max-width: 812px) {
  .l-mb230-sp {
    margin-bottom: 23rem !important;
  }
  .l-mt230-sp {
    margin-top: 23rem !important;
  }
}
.l-mb235 {
  margin-bottom: 23.5rem;
}

.l-mt235 {
  margin-top: 23.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb235-sp {
    margin-bottom: 23.5rem !important;
  }
  .l-mt235-sp {
    margin-top: 23.5rem !important;
  }
}
.l-mb240 {
  margin-bottom: 24rem;
}

.l-mt240 {
  margin-top: 24rem;
}

@media only screen and (max-width: 812px) {
  .l-mb240-sp {
    margin-bottom: 24rem !important;
  }
  .l-mt240-sp {
    margin-top: 24rem !important;
  }
}
.l-mb245 {
  margin-bottom: 24.5rem;
}

.l-mt245 {
  margin-top: 24.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb245-sp {
    margin-bottom: 24.5rem !important;
  }
  .l-mt245-sp {
    margin-top: 24.5rem !important;
  }
}
.l-mb250 {
  margin-bottom: 25rem;
}

.l-mt250 {
  margin-top: 25rem;
}

@media only screen and (max-width: 812px) {
  .l-mb250-sp {
    margin-bottom: 25rem !important;
  }
  .l-mt250-sp {
    margin-top: 25rem !important;
  }
}
.l-mb255 {
  margin-bottom: 25.5rem;
}

.l-mt255 {
  margin-top: 25.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb255-sp {
    margin-bottom: 25.5rem !important;
  }
  .l-mt255-sp {
    margin-top: 25.5rem !important;
  }
}
.l-mb260 {
  margin-bottom: 26rem;
}

.l-mt260 {
  margin-top: 26rem;
}

@media only screen and (max-width: 812px) {
  .l-mb260-sp {
    margin-bottom: 26rem !important;
  }
  .l-mt260-sp {
    margin-top: 26rem !important;
  }
}
.l-mb265 {
  margin-bottom: 26.5rem;
}

.l-mt265 {
  margin-top: 26.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb265-sp {
    margin-bottom: 26.5rem !important;
  }
  .l-mt265-sp {
    margin-top: 26.5rem !important;
  }
}
.l-mb270 {
  margin-bottom: 27rem;
}

.l-mt270 {
  margin-top: 27rem;
}

@media only screen and (max-width: 812px) {
  .l-mb270-sp {
    margin-bottom: 27rem !important;
  }
  .l-mt270-sp {
    margin-top: 27rem !important;
  }
}
.l-mb275 {
  margin-bottom: 27.5rem;
}

.l-mt275 {
  margin-top: 27.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb275-sp {
    margin-bottom: 27.5rem !important;
  }
  .l-mt275-sp {
    margin-top: 27.5rem !important;
  }
}
.l-mb280 {
  margin-bottom: 28rem;
}

.l-mt280 {
  margin-top: 28rem;
}

@media only screen and (max-width: 812px) {
  .l-mb280-sp {
    margin-bottom: 28rem !important;
  }
  .l-mt280-sp {
    margin-top: 28rem !important;
  }
}
.l-mb285 {
  margin-bottom: 28.5rem;
}

.l-mt285 {
  margin-top: 28.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb285-sp {
    margin-bottom: 28.5rem !important;
  }
  .l-mt285-sp {
    margin-top: 28.5rem !important;
  }
}
.l-mb290 {
  margin-bottom: 29rem;
}

.l-mt290 {
  margin-top: 29rem;
}

@media only screen and (max-width: 812px) {
  .l-mb290-sp {
    margin-bottom: 29rem !important;
  }
  .l-mt290-sp {
    margin-top: 29rem !important;
  }
}
.l-mb295 {
  margin-bottom: 29.5rem;
}

.l-mt295 {
  margin-top: 29.5rem;
}

@media only screen and (max-width: 812px) {
  .l-mb295-sp {
    margin-bottom: 29.5rem !important;
  }
  .l-mt295-sp {
    margin-top: 29.5rem !important;
  }
}
.l-mb300 {
  margin-bottom: 30rem;
}

.l-mt300 {
  margin-top: 30rem;
}

@media only screen and (max-width: 812px) {
  .l-mb300-sp {
    margin-bottom: 30rem !important;
  }
  .l-mt300-sp {
    margin-top: 30rem !important;
  }
}
/* -------------------------------------------------------------------------
	テキスト揃え
*/
.l-alignL {
  text-align: left;
}

.l-alignR {
  text-align: right;
}

.l-alignC {
  text-align: center;
}

.l-block-alignC {
  margin-left: auto;
  margin-right: auto;
}

.l-valign-m {
  display: flex;
  align-items: center;
}

@media only screen and (max-width: 812px) {
  .l-alignL-sp {
    text-align: left;
  }
  .l-alignR-sp {
    text-align: right;
  }
  .l-alignC-sp {
    text-align: center;
  }
}
/* ==========================================================================
   animation
   ========================================================================== */
.ef-io,
.ef-io-in,
.ef-intro {
  pointer-events: none;
}

.tr-fade-up {
  transition: transform 1s, opacity 1s;
}
.tr-fade-up.ef-io, .tr-fade-up.ef-io-in {
  opacity: 0;
  transform: translate3d(0, 3rem, 0);
}
@media print, screen and (min-width:813px) {
  .tr-fade-up.ef-io, .tr-fade-up.ef-io-in {
    transform: translate3d(0, 6rem, 0);
  }
}

.tr-fade-right {
  transition: transform 1s, opacity 1s;
}
.tr-fade-right.ef-io, .tr-fade-right.ef-io-in {
  opacity: 0;
  transform: translate3d(-30px, 0, 0);
}
@media print, screen and (min-width:813px) {
  .tr-fade-right.ef-io, .tr-fade-right.ef-io-in {
    transform: translate3d(-60px, 0, 0);
  }
}

.tr-fade-in {
  transition: transform 1s, opacity 1s;
}
.tr-fade-in.ef-io, .tr-fade-in.ef-io-in {
  opacity: 0;
}
.tr-mask-lr {
  transition: mask-position 0.7s;
  transition-timing-function: cubic-bezier(1, 0, 0, 1) !important;
  mask-image: linear-gradient(90deg, transparent 50%, red 50%);
  mask-size: 200% 100%;
  mask-position: -100% 0;
}
.tr-mask-lr.ef-io, .tr-mask-lr.ef-io-inner {
  mask-position: 0 0;
}

.tr-mask-rl {
  transition: mask-position 0.7s;
  transition-timing-function: cubic-bezier(1, 0, 0, 1) !important;
  mask-image: linear-gradient(90deg, red 50%, transparent 50%);
  mask-size: 200% 100%;
  mask-position: 0 0;
}
.tr-mask-rl.ef-io, .tr-mask-rl.ef-io-inner {
  mask-position: -100% 0;
}

.tr-pop-l {
  transition: transform 0.5s, opacity 0.5s;
  transition-timing-function: cubic-bezier(0.73, 0, 0.3, 1.38);
  transform-origin: 50% 50%;
}
.tr-pop-l.ef-io, .tr-pop-l.ef-io-in {
  opacity: 0;
  transform: scale3d(0.7, 0.7, 1);
}

.tr-pop-r {
  transition: transform 0.5s, opacity 0.5s;
  transition-timing-function: cubic-bezier(0.73, 0, 0.3, 1.38);
  transform-origin: 50% 50%;
}
.tr-pop-r.ef-io, .tr-pop-r.ef-io-in {
  opacity: 0;
  transform: scale3d(0.7, 0.7, 1);
}

.tr-drop {
  transition: transform 0.5s, opacity 0.5s;
  transition-timing-function: ease-out;
}
.tr-drop.ef-io, .tr-drop.ef-io-in {
  opacity: 0;
  transform: translate3d(0, -40%, 0);
}