@charset "UTF-8";
@import url(all.css);
/* ###################### */
/* ######## 変数 ######## */
/* ###################### */
/* カラー */
/* パターン */
/* 書式 */
/* ###################### */
/* ######## 関数 ######## */
/* ###################### */
/*===============================================
  切り替え用
===============================================*/
.pc-none {
  display: none !important;
}

a[href^="tel:"] {
  pointer-events: none;
}

/*===============================================
  ページネーション
===============================================*/
.pagenation {
  padding-top: 48px;
}
.pagenation li {
  width: 36px;
  font-size: 1.6rem;
  line-height: 40px;
  margin: 5px 4px 0;
}

/*===============================================
  詳細ページ前後
===============================================*/
.paginated-link {
  padding-top: 24px;
  margin-top: 32px;
}
.paginated-link li {
  width: 110px;
}
.paginated-link li a {
  font-size: 1.6rem;
  line-height: 1.625;
  letter-spacing: 0em;
}
.paginated-link li.prev-link a::before {
  margin-right: 1em;
}
.paginated-link li.next-link a::after {
  margin-left: 1em;
}

/*===============================================
  wrapper
===============================================*/
#wrapper {
  min-width: 1280px;
}

/*===============================================
  header
===============================================*/
#header .h-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#header.oth_head .h-logo {
  width: 202px;
  height: 120px;
}
#header.oth_head .h-logo a {
  border-bottom-right-radius: 60px;
}
#header.oth_head .h-logo img {
  width: 82px;
}
#header .h-right {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  flex-direction: column;
  padding-right: 60px;
  padding-bottom: 10px;
}
#header .h-right > * {
  margin-bottom: 20px;
}
#header .h-right > *:last-child {
  margin-bottom: 0;
}
#header .h-oth {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  -moz-column-gap: 30px;
       column-gap: 30px;
}
#header .h-tels .com-replace {
  padding-left: 36px;
  margin-top: -2px;
}
#header .h-sns {
  width: 40px;
}
#header .h-sns a {
  display: block;
  transition: all 0.3s;
}
#header .h-sns a:hover {
  opacity: 0.64;
}
#header.ent_head {
  width: 0;
  height: calc(100% - 3.542vw - 52px);
  min-height: calc(100% - 98px);
  position: absolute;
  top: 0;
  left: 50%;
}
#header.ent_head .h-logo {
  width: clamp(150px, 11.6666666667vw, 224px);
  height: clamp(150px, 11.6666666667vw, 224px);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#header.ent_head .h-logo a {
  border-radius: 50%;
}
#header.ent_head .h-logo img {
  width: 39.286%;
  min-width: 67px;
}

/*===============================================
  footer
===============================================*/
#footer {
  padding: 60px 0 70px;
}
#footer .f-inner > * {
  margin-bottom: 30px;
}
#footer .f-inner > *:last-child {
  margin-bottom: 0;
}
#footer .f-logo img {
  height: 102px;
}
#footer .f-links {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  padding-top: 10px;
  border-top: solid 1px rgba(255, 255, 255, 0.2);
}
#footer .f-links li {
  margin: 20px 20px 0;
  border-radius: 12px;
  box-shadow: 0 0 29px rgba(0, 0, 0, 0.23);
}

/*フッターナビ
-----------------------------*/
.fnav {
  padding-top: 30px;
}
.fnav ul {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.6rem;
  line-height: 2;
}
.fnav ul:first-child {
  margin-top: -0.5em;
}
.fnav ul:last-child {
  margin-bottom: -0.5em;
}
.fnav li {
  display: flex;
  justify-content: center;
  align-items: center;
  letter-spacing: 0.06em;
}
.fnav li::after {
  content: "|";
  margin: 0 1em;
}
.fnav li:last-of-type::after {
  display: none;
}

/*コピーライト
-----------------------------*/
.copy {
  padding: 12px 0;
}
.copy p {
  font-size: 1.4rem;
  letter-spacing: 0.08em;
}

/*===============================================
  fixed固定
===============================================*/
/*サイドボタン
-----------------------------*/
#side {
  width: clamp(95px, 10vw - 39px, 153px);
  height: clamp(64px, 10vw - 99px, 93px);
  border-radius: 12px;
  bottom: 25px;
  right: clamp(2px, 10vw - 167px, 25px);
  box-shadow: 0 0 0 2px #91c541 inset, 0 3px 12px rgba(0, 0, 0, 0.1);
}
#side a {
  flex-direction: column;
}
#side a::before {
  width: 22.876%;
  padding-top: 15.033%;
  margin-bottom: 6.536%;
}
#side a > span {
  font-size: clamp(1.2rem, 0.8854166667vw, 1.7rem);
  letter-spacing: 0.06em;
}
#side a > span::after {
  margin-top: clamp(4px, 0.3125vw, 6px);
}

/*===============================================
  visual
===============================================*/
.visual-wrap:has(.sub-visual) {
  padding-top: 25px;
}

/*メインビジュアル
-----------------------------*/
.main-visual {
  height: clamp(600px, 46.3541666667vw, 890px);
  padding-top: clamp(17px, 1.3020833333vw, 25px);
}
.main-visual .catch {
  width: clamp(604px, 47.1875vw, 906px);
  margin-left: max(50% - 817px, 7.448%);
}
.main-visual .mv-imgs {
  width: 64.792%;
  max-width: 1244px;
  right: max(50% - 960px, 0%);
}
.main-visual .mv-imgs li {
  width: 46.785%;
  height: 43.259%;
  margin-right: 3.215%;
  border-radius: 12px;
}
.main-visual .mv-imgs li:nth-of-type(1) {
  height: 91.012%;
}
.main-visual .mv-imgs li:nth-of-type(2) {
  margin-top: auto;
  margin-bottom: 3.215%;
}

/*サブビジュアル
-----------------------------*/
.sub-visual {
  height: clamp(350px, 27.0833333333vw, 520px);
}
.sub-visual::before {
  width: calc(100% - 80px);
  max-width: 1760px;
  border-radius: 20px;
  background-size: 17.614%, 17.614%, cover;
}
.sub-visual .catch::before {
  width: clamp(100% + 94px, 100% + 7.292vw, 100% + 140px);
  height: clamp(100% + 40px, 100% + 3.125vw, 100% + 60px);
}
.sub-visual .catch > span {
  font-size: clamp(3.6rem, 2.8125vw, 5.4rem);
  letter-spacing: 0.08em;
  padding-bottom: clamp(7px, 0.5208333333vw, 10px);
  border-bottom-width: clamp(2px, 0.15625vw, 3px);
}

/*===============================================
  グローバルナビ
===============================================*/
#nav {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  color: #222;
  letter-spacing: 0;
  line-height: 1;
}
#nav .gnav-list {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.6rem;
  line-height: 2;
  margin: -0.5em 0;
}
#nav .gnav-list-item {
  display: flex;
  justify-content: center;
  align-items: center;
  letter-spacing: 0.06em;
}
#nav .gnav-list-item::after {
  content: "";
  display: block;
  width: 2px;
  height: 1em;
  background: linear-gradient(to bottom, #222 2px, transparent 2px, transparent 4px) repeat-y center top/2px 4px;
  margin: 0 28px;
  opacity: 0.3;
}
#nav .gnav-list-item:last-of-type::after {
  display: none;
}
#nav .gnav-list-item a {
  display: block;
  transition: all 0.12s;
}
#nav .gnav-list-item a:hover {
  color: #5bb25e;
}
#nav .gnav-list-item a.current {
  color: #5bb25e;
}

/*===============================================
  main#container
===============================================*/
#container {
  font-size: 1.7rem;
  line-height: 1.82353;
  letter-spacing: 0.06em;
}

/*===============================================
  パンくずリスト
===============================================*/
.bread {
  height: 73px;
}
.bread .breadcrumbs {
  width: 1080px;
}
.bread .breadcrumbs li {
  font-size: 1.3rem;
  letter-spacing: 0.06em;
  line-height: 1.76924;
}
.bread .breadcrumbs li::after {
  margin: 0 1em;
}

/*===============================================
  main共通
===============================================*/
.inbox {
  width: 1080px;
}

/*電話番号
-----------------------------*/
.com-tels .com-tel {
  font-size: 3.4rem;
  letter-spacing: 0.06em;
}
.com-tels .com-tel::before {
  width: 24px;
  height: 40px;
  margin-right: 12px;
}
.com-tels .com-tel a {
  margin: -6px -0.06em -3px 0;
}
.com-tels .com-replace {
  margin-top: 8px;
}
.com-tels .com-replace img {
  height: 11px;
}

/*ボタン
-----------------------------*/
.com-btn {
  width: 300px;
  height: 55px;
  margin: 0 auto;
}
.com-btn a {
  font-size: 1.7rem;
  letter-spacing: 0.06em;
}
.com-btn a::after {
  width: 55px;
  height: 52px;
  right: 14px;
}

.com-line,
.com-mail {
  width: 355px;
  height: 55px;
}
.com-line a,
.com-mail a {
  font-size: 1.7rem;
  letter-spacing: 0.06em;
}
.com-line a::before,
.com-mail a::before {
  width: 27px;
  height: 27px;
  margin-right: 14px;
}

/*テーブル
-----------------------------*/
.com-table table {
  border-collapse: separate;
}
.com-table tr th {
  width: 230px;
  padding: 13px 30px;
  border-bottom: solid 1px #fff;
}
.com-table tr td {
  padding: 13px 30px;
  border-bottom: solid 1px #91c541;
}
.com-table tr:first-of-type th {
  border-top-left-radius: 6px;
}
.com-table tr:last-of-type th {
  border-bottom-left-radius: 6px;
  border-bottom: none;
}
.com-table tr:last-of-type td {
  border-bottom: none;
}

/*テキストボックス
-----------------------------*/
.com-text-box {
  margin: -7px 0;
}
.com-text-box p {
  margin-right: -0.06em;
}
.com-text-box .mb {
  margin-bottom: 20px;
}

/*画像
-----------------------------*/
.com-img div {
  border-radius: 12px;
}
.com-img.line div::before {
  border-width: 7px;
}

/*SB未記入テキスト
-----------------------------*/
.com-no-txt {
  font-size: 2.4rem;
  line-height: 1.66667;
  padding: 60px 0;
  border-radius: 12px;
}

/*===============================================
  タイトル
===============================================*/
/*大タイトル
-----------------------------*/
.com-ttl01 {
  margin-bottom: 60px;
}
.com-ttl01 .en {
  font-size: 2.1rem;
  letter-spacing: 0.06em;
  margin-right: -0.06em;
}
.com-ttl01 .en + span::before {
  width: calc(100% + 72px);
  height: 28px;
  top: -3px;
}
.com-ttl01 .en + span.ki::before {
  width: calc(100% + 72px - 1.5em);
}
.com-ttl01 .en:has(+ span) {
  margin-bottom: 15px;
}
.com-ttl01 > span:not(.en) {
  font-size: 3.2rem;
  line-height: 1.75;
  letter-spacing: 0.08em;
  margin-right: -0.08em;
}
.com-ttl01 > span:not(.en):first-child {
  margin-top: -0.375em;
}
.com-ttl01 > span:not(.en):last-child {
  margin-bottom: -0.375em;
}
.com-ttl01 .ki {
  margin-right: -0.5em;
}

/*中タイトル
-----------------------------*/
.com-ttl02 {
  margin-bottom: 30px;
}
.com-ttl02 > span {
  font-size: 2.4rem;
  line-height: 1.5;
  letter-spacing: 0.08em;
  margin-right: -0.08em;
}
.com-ttl02 > span:first-child {
  margin-top: -0.25em;
}
.com-ttl02 > span:last-child {
  margin-bottom: -0.25em;
}
.com-ttl02.line {
  padding-bottom: 20px;
}
.com-ttl02.bg {
  padding: 13px 20px;
  border-radius: 6px;
}

/*小タイトル
-----------------------------*/
/*===============================================
  共通セクション
===============================================*/
/*ご応募はこちら
-----------------------------*/
.com-contact-sec {
  padding: 100px 0;
}
.com-contact-sec .contact-ttl {
  margin-bottom: 60px;
}
.com-contact-sec .contact-ttl .en {
  min-width: 137px;
  font-size: 2rem;
  line-height: 1.35;
  padding: 0 20px;
  margin-bottom: 29px;
}
.com-contact-sec .contact-ttl .txt {
  font-size: 4.2rem;
  letter-spacing: 0.08em;
  margin-right: -0.08em;
}
.com-contact-sec .contact-box {
  width: 825px;
  padding: 30px;
  border-radius: 12px;
  margin: 0 auto;
}
.com-contact-sec .contact-box::before {
  width: calc(100% + 66px);
  height: 207px;
  bottom: calc(100% + 7px);
}
.com-contact-sec .contact-box > * {
  margin-bottom: 32px;
}
.com-contact-sec .contact-box > *:last-child {
  margin-bottom: 0;
}
.com-contact-sec .contact-box .box-list {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
.com-contact-sec .contact-box .box-list .list-item {
  margin-right: 54px;
  position: relative;
}
.com-contact-sec .contact-box .box-list .list-item::after {
  content: "";
  width: 2px;
  height: 100%;
  background: linear-gradient(to bottom, #aaa, 2px, transparent 2px, transparent 4px) repeat-y center top/2px 4px;
  position: absolute;
  top: 0;
  left: calc(100% + 26px);
}
.com-contact-sec .contact-box .box-list .list-item:last-child {
  margin-right: 0;
}
.com-contact-sec .contact-box .box-list .list-item:last-child::after {
  display: none;
}

/*===============================================
  エントランスページ
===============================================*/
.entrance {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-direction: column;
  flex-wrap: wrap;
  height: clamp(714px, 55.7291666667vw, 1070px);
  min-height: calc(100vh - 52px);
  padding: clamp(15px, 1.0416666667vw, 20px) clamp(40px, 3.125vw, 60px) clamp(50px, 5.2083333333vw, 100px);
}
.entrance .entrance-box {
  width: 50%;
  height: 50%;
  padding: clamp(20px, 1.5625vw, 30px);
}
.entrance .entrance-box.hidden::after {
  width: clamp(100% - 60px, 100% - 3.125vw, 100% - 40px);
  height: clamp(100% - 60px, 100% - 3.125vw, 100% - 40px);
  top: clamp(20px, 1.5625vw, 30px);
  left: clamp(20px, 1.5625vw, 30px);
  font-size: clamp(2.4rem, 1.875vw, 3.6rem);
  letter-spacing: 0.08em;
  border-radius: 12px;
}
.entrance .entrance-box a {
  border-radius: 12px;
}
.entrance .entrance-box .box-in {
  width: 43.572%;
  min-width: 250px;
  height: clamp(100px, 7.2916666667vw, 140px);
  border-radius: 12px;
}
.entrance .entrance-box .box-in::before {
  width: clamp(100% + 210px, 100% + 16.146vw, 100% + 310px);
  height: clamp(142px, 11.09375vw, 213px);
}
.entrance .entrance-box .box-ttl.ttl01 .min {
  font-size: clamp(1.8rem, 1.40625vw, 2.7rem);
  line-height: calc(1em + 10px);
  letter-spacing: 0.08em;
  padding: 0 clamp(20px, 1.5625vw, 30px);
  margin-bottom: 10px;
}
.entrance .entrance-box .box-ttl.ttl01 .txt {
  font-size: clamp(3rem, 2.34375vw, 4.5rem);
  letter-spacing: 0.08em;
  margin-right: -0.08em;
}
.entrance .entrance-box .box-ttl.ttl02 .min {
  font-size: clamp(1.6rem, 1.25vw, 2.4rem);
  letter-spacing: 0.08em;
}
.entrance .entrance-box .box-ttl.ttl02 .min::after {
  margin: 3px 0;
}
.entrance .entrance-box .box-ttl.ttl02 .txt {
  font-size: clamp(2.4rem, 1.7708333333vw, 3.4rem);
  letter-spacing: 0.08em;
}
.entrance .entrance-box .box-ttl.ttl02 .txt::before {
  height: 18px;
  bottom: -6px;
}
.entrance .entrance-box.official {
  height: 100%;
}
.entrance .entrance-box.official .box-in {
  width: 49.524%;
  min-width: 286px;
  height: clamp(110px, 8.3333333333vw, 160px);
}

/*===============================================
  トップページ
===============================================*/
.top-ttl {
  margin-bottom: 50px;
}
.top-ttl .en {
  font-size: 2.6rem;
}
.top-ttl .en:has(+ .mid) {
  margin-bottom: 29px;
}
.top-ttl .en:has(+ .txt) {
  margin-bottom: 20px;
}
.top-ttl .txt {
  font-size: 4.2rem;
}
.top-ttl .mid {
  font-size: 2.8rem;
}
.top-ttl .mid:has(+ .txt) {
  margin-bottom: 22px;
}
.top-ttl.le {
  align-items: flex-start;
  text-align: left;
}

/*最高の安心と安全を提供する
警備の仕事を始めませんか？
-----------------------------*/
.top-about {
  padding: 100px 0;
}
.top-about .inbox {
  width: calc(100% - 80px);
  max-width: 1280px;
  min-width: 1200px;
}
.top-about .about-in {
  width: 1080px;
  min-height: 560px;
  padding-left: 500px;
  margin: 0 auto;
  position: relative;
  z-index: 0;
}
.top-about .about-ttl .txt {
  font-size: 4rem;
}
.top-about .about-ttl .mark {
  background: linear-gradient(to top, #fff5bb 15px, transparent 15px);
}
.top-about .about-ttl .line::after {
  top: calc(100% + 9px);
}
.top-about .about-ttl::before {
  width: 168px;
  height: 168px;
  bottom: -100px;
  right: -13px;
}
.top-about .about-box .box-ttl {
  margin-bottom: 20px;
}
.top-about .about-box .box-ttl > span {
  font-size: 1.7rem;
  line-height: 1.70589;
  padding: 0 6px;
  margin-bottom: 12px;
}
.top-about .about-img {
  width: calc(50vw - 100px);
  max-width: 820px;
  min-width: 540px;
  position: absolute;
  top: 0;
  right: calc(50% + 80px);
}
.top-about .about-img div {
  height: 560px;
}
.top-about .about-img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.top-about .about-btn {
  margin-top: 80px;
}

/* MAMORIAはどんな仕事をしてるの？ */
.top-about .about-job {
  padding-top: 100px;
}
.top-about .about-job .job-ttl {
  height: 95px;
  padding-top: 5px;
  border-radius: 12px;
  margin-bottom: 100px;
}
.top-about .about-job .job-ttl::before {
  width: calc(100% - 288px);
  height: 185px;
  bottom: -7px;
}
.top-about .about-job .job-ttl::after {
  width: 46px;
  height: 15px;
}
.top-about .about-job .job-ttl > span {
  font-size: 3.3rem;
  letter-spacing: 0.1em;
  margin-right: -0.6em;
}
.top-about .about-job .job-ttl > span::after {
  width: 169px;
  margin: 9px auto 0;
}
.top-about .about-job .job-list {
  padding-bottom: 70px;
}
.top-about .about-job .job-list-box {
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  margin-bottom: 70px;
}
.top-about .about-job .job-list-box .box-in {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-direction: column;
  width: 592px;
  padding: 0 10px 50px;
  margin-top: 20px;
  position: relative;
  z-index: 0;
}
.top-about .about-job .job-list-box .box-in::before {
  content: "";
  width: 100%;
  height: calc(100% - 28px);
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: -2;
  border-radius: 12px 32px;
}
.top-about .about-job .job-list-box .box-in::after {
  content: "";
  width: 56px;
  height: 56px;
  position: absolute;
  left: -21px;
  bottom: -21px;
  z-index: -1;
}
.top-about .about-job .job-list-box .box-ttl {
  padding: 5px 20px;
  margin-bottom: 23px;
}
.top-about .about-job .job-list-box .box-ttl::before {
  width: 48px;
  height: 35px;
  margin-right: 12px;
}
.top-about .about-job .job-list-box .box-ttl > span {
  font-size: 3rem;
  letter-spacing: 0.14em;
  margin-right: -0.14em;
}
.top-about .about-job .job-list-box .box-list {
  padding-left: 20px;
  margin-top: -15px;
}
.top-about .about-job .job-list-box .box-list::after {
  font-size: 1.6rem;
  line-height: 1.5;
  letter-spacing: 0.04em;
  margin-left: 1em;
  margin-top: 15px;
}
.top-about .about-job .job-list-box .box-list-item {
  font-size: 2rem;
  line-height: 1.5;
  letter-spacing: 0.1em;
  padding: 0 calc(10px - 0.1em) 0 10px;
  margin-top: 15px;
  margin-right: 15px;
}
.top-about .about-job .job-list-box .box-img {
  width: calc(50% - 110px);
  margin-left: 60px;
}
.top-about .about-job .job-list-box .box-img div {
  height: 390px;
}
.top-about .about-job .job-list-box .box-img div::before {
  border-width: 12px;
}
.top-about .about-job .job-list-box .box-img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.top-about .about-job .job-list-box:nth-of-type(2n + 1) {
  flex-direction: row-reverse;
}
.top-about .about-job .job-list-box:nth-of-type(2n + 1)::after {
  width: 1182px;
  height: 313px;
  bottom: -70px;
}
.top-about .about-job .job-list-box:nth-of-type(2n + 1) .box-img {
  margin: 0 60px 0 0;
  position: relative;
  z-index: 0;
}
.top-about .about-job .job-list-box:nth-of-type(2n + 1) .box-img::after {
  content: "";
  width: 221px;
  height: 222px;
  background: url(../img/index/deco_about_img.png) no-repeat right bottom/contain;
  position: absolute;
  right: -138px;
  bottom: -102px;
  z-index: -2;
}
.top-about .about-job .job-list-box:nth-of-type(2n)::after {
  width: 460px;
  height: 292px;
  bottom: -100px;
}

/*働く環境
-----------------------------*/
.top-environment {
  padding: 100px 0;
}
.top-environment .environment-ttl {
  margin-bottom: 60px;
}
.top-environment .environment-ttl .en {
  margin-bottom: 32px;
}
.top-environment .environment-ttl::before {
  width: 620px;
  height: 167px;
  bottom: -68px;
}
.top-environment .environment-list {
  display: flex;
  justify-content: center;
  align-items: stretch;
  flex-wrap: wrap;
  margin-top: -40px;
}
.top-environment .environment-list-item {
  width: 330px;
  box-shadow: 0 3px 29px 0 rgba(0, 0, 0, 0.05);
  border-radius: 12px;
  padding: 40px 15px;
  margin-top: 40px;
  margin-right: 45px;
}
.top-environment .environment-list-item:nth-of-type(3n), .top-environment .environment-list-item:last-of-type {
  margin-right: 0;
}
.top-environment .environment-list-item .item-num {
  position: absolute;
  top: -20px;
  left: -20px;
}
.top-environment .environment-list-item .item-icon {
  margin-bottom: 25px;
}
.top-environment .environment-list-item .item-txt {
  text-align: center;
  font-size: 2.1rem;
  line-height: 1.61905;
  margin: -7px 0 -6px;
}
.top-environment .environment-list-item .item-txt .b {
  font-size: 2.4rem;
  line-height: 1.41667;
  background: linear-gradient(to top, #fff5bb 14px, transparent 14px);
}
.top-environment .environment-btn {
  margin-top: 60px;
}

/*よくあるご質問
-----------------------------*/
.top-faq {
  padding: 100px 0;
}
.top-faq .faq-ttl {
  margin-bottom: 70px;
}
.top-faq .faq-ttl .en {
  margin-bottom: 32px;
}
.top-faq .faq-ttl .txt::before {
  width: calc(100% + 146px);
  height: 49px;
  top: 0;
}
.top-faq .faq-ttl .txt::after {
  width: calc(100% + 74px);
  height: 28px;
  top: 0;
}
.top-faq .faq-ttl .line::after {
  top: calc(100% + 9px);
}
.top-faq .faq-list-wrap {
  padding-top: 45px;
  position: relative;
  z-index: 0;
}
.top-faq .faq-list-item {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 370px;
  font-size: 1.9rem;
  line-height: 1.57895;
  background: #fff;
  border-radius: 100vh;
  padding: 20px 0;
  filter: drop-shadow(0 3px 23px rgba(0, 0, 0, 0.07));
  position: absolute;
}
.top-faq .faq-list-item::after {
  content: "";
  width: 38px;
  height: 17px;
  background: url(../img/index/balloon_faq.svg) no-repeat center top/contain;
  position: absolute;
  bottom: -16px;
}
.top-faq .faq-list-item .b {
  background: linear-gradient(to top, #fff5bb 11px, transparent 11px);
}
.top-faq .faq-list-item:nth-of-type(1) {
  top: 0;
  left: 81px;
}
.top-faq .faq-list-item:nth-of-type(1)::after {
  right: 50px;
}
.top-faq .faq-list-item:nth-of-type(2) {
  top: 111px;
  left: -10px;
}
.top-faq .faq-list-item:nth-of-type(2)::after {
  right: 50px;
}
.top-faq .faq-list-item:nth-of-type(3) {
  top: 225px;
  left: 2px;
}
.top-faq .faq-list-item:nth-of-type(3)::after {
  right: 50px;
}
.top-faq .faq-list-item:nth-of-type(4) {
  top: 6px;
  right: 71px;
}
.top-faq .faq-list-item:nth-of-type(4)::after {
  left: 50px;
  transform: scale(-1, 1);
}
.top-faq .faq-list-item:nth-of-type(5) {
  top: 113px;
  right: -18px;
}
.top-faq .faq-list-item:nth-of-type(5)::after {
  left: 50px;
  transform: scale(-1, 1);
}
.top-faq .faq-list-item:nth-of-type(6) {
  top: 252px;
  right: -2px;
}
.top-faq .faq-list-item:nth-of-type(6)::after {
  left: 50px;
  transform: scale(-1, 1);
}
.top-faq .faq-btn {
  margin-top: 20px;
}

/*採用情報
-----------------------------*/
.top-recruit {
  padding-bottom: 100px;
}
.top-recruit .recruit-ttl {
  padding: 50px 0 88px;
  margin-bottom: 80px;
}
.top-recruit .recruit-ttl::before {
  width: 628px;
  height: 229px;
}
.top-recruit .recruit-ttl .txt {
  font-size: 4.5rem;
}
.top-recruit .recruit-box {
  min-height: 596px;
  padding-top: 10px;
  padding-right: 530px;
}
.top-recruit .recruit-box .box-imgs {
  width: calc(50vw - 100px);
  max-width: 705px;
  min-width: 540px;
  padding-bottom: 100px;
  position: absolute;
  top: 0;
  left: calc(50% + 60px);
  z-index: 0;
}
.top-recruit .recruit-box .box-imgs::before {
  content: "";
  width: 198px;
  height: 198px;
  background: url(../img/index/img_recruit_bg.png) no-repeat left bottom/contain;
  position: absolute;
  bottom: 10px;
  left: -105px;
  z-index: -2;
}
.top-recruit .recruit-box .box-imgs li:nth-of-type(1) {
  width: 65.958%;
}
.top-recruit .recruit-box .box-imgs li:nth-of-type(1) div {
  height: 496px;
}
.top-recruit .recruit-box .box-imgs li:nth-of-type(2) {
  width: 68.086%;
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 1;
}
.top-recruit .recruit-box .box-imgs li:nth-of-type(2) div {
  height: 320px;
}
.top-recruit .recruit-box .box-ttl {
  margin-bottom: 20px;
}
.top-recruit .recruit-box .box-ttl > span {
  font-size: 2.9rem;
  line-height: 1.37932;
  padding: 0 3px;
  margin-bottom: 18px;
}
.top-recruit .recruit-box .box-btn {
  margin-left: 0;
  margin-top: 40px;
}

/*お知らせ
-----------------------------*/
.top-news {
  padding: 100px 0;
}
.top-news .news-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.top-news .news-ttl {
  width: 300px;
  margin-bottom: 134px;
}
.top-news .news-ttl::before {
  width: calc(100% + 138px);
  height: 199px;
  bottom: -59px;
}
.top-news .news-list {
  width: calc(100% - 360px);
}
.top-news .news-list-item {
  margin-bottom: 20px;
}
.top-news .news-list-item a {
  padding: 20px;
  border-radius: 12px;
}
.top-news .news-list-item a > * {
  margin-top: 10px !important;
}
.top-news .news-list-item a > *:first-child {
  margin-top: 0 !important;
}
.top-news .news-list-item .date {
  min-width: 85px;
  font-size: 1.4rem;
  line-height: 1.5;
  padding: 0 8px;
}
.top-news .news-list-item .item-ttl {
  font-size: 1.6rem;
  line-height: 1.625;
  margin: -5px 0;
}
.top-news .news-list-item .tag {
  font-size: 1.5rem;
  line-height: 1.66667;
  margin: -5px 0;
}
.top-news .news-btn {
  position: absolute;
  left: 0;
  top: calc(50% + 56px);
}

/*===============================================
  会社を知る
===============================================*/
/*お客様に最高の安心と安全を提供すること。
それがMAMORIAの使命です。
-----------------------------*/
.about-concept {
  padding: 110px 0 90px;
}
.about-concept::after {
  width: 1150px;
  height: 204px;
  bottom: -5px;
}
.about-concept .concept-in {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-direction: row-reverse;
}
.about-concept .concept-text {
  width: 520px;
}

/*仕事内容について
-----------------------------*/
.about-works {
  padding: 90px 0 180px;
}
.about-works .works-ttl {
  margin-bottom: 50px;
}
.about-works .works-text {
  padding: 22px 30px;
  border-radius: 12px;
}
.about-works .works-text:has(+ .works-list) {
  margin-bottom: 60px;
}
.about-works .works-text p {
  font-size: 2rem;
  line-height: 2.05;
  margin-right: -0.58em;
}
.about-works .works-text::before {
  width: calc(100% - 340px);
  height: 179px;
  bottom: -1px;
}
.about-works .works-list-box {
  min-height: 420px;
  margin-bottom: 140px;
}
.about-works .works-list-box .box-img {
  width: calc(50vw - 60px);
  max-width: 620px;
  min-width: 580px;
  position: absolute;
  top: 0;
}
.about-works .works-list-box .box-img div {
  height: 420px;
}
.about-works .works-list-box .box-img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.about-works .works-list-box .box-list {
  padding-top: 30px;
}
.about-works .works-list-box .box-list-item {
  line-height: 1.11765;
  padding-left: 39px;
  margin-bottom: 30px;
}
.about-works .works-list-box .box-list-item::before {
  width: 24px;
  height: 19px;
}
.about-works .works-list-box:nth-of-type(2n + 1) {
  padding-left: 570px;
}
.about-works .works-list-box:nth-of-type(2n + 1) .box-img {
  right: calc(50% + 20px);
}
.about-works .works-list-box:nth-of-type(2n) {
  padding-right: 570px;
}
.about-works .works-list-box:nth-of-type(2n) .box-img {
  left: calc(50% + 20px);
}
.about-works .works-list-box:nth-of-type(1)::after {
  width: 1216px;
  height: 313px;
  bottom: -124px;
}
.about-works .works-list-box:nth-of-type(2)::after {
  width: 648px;
  height: 292px;
  bottom: -105px;
}

/*株式会社MAMORIAの特徴
-----------------------------*/
.about-feature {
  padding: 100px 0;
}
.about-feature .feature-list-box {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 60px;
}
.about-feature .feature-list-box .box-in {
  width: 540px;
}
.about-feature .feature-list-box .box-ttl::before {
  font-size: 4.9rem;
  letter-spacing: 0.02em;
  margin: -5px 0 11px;
}

/*会社情報
-----------------------------*/
.about-company {
  padding: 100px 0;
}
.about-company .company-ttl {
  margin-bottom: 70px;
}
.about-company .company-table td span {
  margin-right: 20px;
}
.about-company .company-table td .replace {
  padding: 10px 0;
}
.about-company .company-table td .replace img {
  height: 11px;
}
.about-company .company-map {
  height: 480px;
  margin-top: 60px;
  border-radius: 20px;
}

/*===============================================
  働く環境
===============================================*/
/*MAMORIAで働く魅力
-----------------------------*/
.environment-point {
  padding: 100px 0;
}
.environment-point .point-list-box {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 70px;
}
.environment-point .point-list-box .box-in {
  width: calc(100% - 220px);
}
.environment-point .point-list-box .box-num {
  margin: -11px 0 20px;
}
.environment-point .point-list-box .box-ttl > span {
  background: linear-gradient(to top, #fff5bb 18px, transparent 18px);
}
.environment-point .point-list-box .box-text p {
  display: inline;
}

/*数字で見るMAMORIA
-----------------------------*/
.environment-data {
  padding: 100px 0 60px;
}
.environment-data .data-list {
  display: flex;
  justify-content: center;
  align-items: stretch;
  flex-wrap: wrap;
  margin-top: -25px;
}
.environment-data .data-list::after {
  width: 810px;
  height: 198px;
  bottom: calc(100% - 27px);
}
.environment-data .data-list-item {
  width: 252px;
  padding: 20px 0;
  margin-top: 25px;
  margin-right: 24px;
  border-radius: 12px;
}
.environment-data .data-list-item:nth-of-type(4n), .environment-data .data-list-item:last-of-type {
  margin-right: 0;
}
.environment-data .data-list-item .item-ttl,
.environment-data .data-list-item .item-icon {
  margin-bottom: 15px;
}
.environment-data .data-list-item .item-text {
  font-size: 2.6rem;
  letter-spacing: 0.02em;
}
.environment-data .data-list-item .item-text .b {
  font-size: 5.4rem;
  margin-top: -11px;
  padding-bottom: 1px;
  border-bottom-width: 3px;
}
.environment-data .data-list-item .item-text .ki {
  margin-right: -0.5em;
}

/*===============================================
  よくあるご質問
===============================================*/
.faq-contents {
  padding: 100px 0;
}
.faq-contents .faq-list-item {
  margin-bottom: 50px;
}
.faq-contents .faq-list-item .item-ttl {
  padding: 16px 20px;
  margin-bottom: 20px;
  border-radius: 12px;
}
.faq-contents .faq-list-item .item-ttl::before {
  width: 47px;
  height: 47px;
}
.faq-contents .faq-list-item .item-ttl > span {
  width: calc(100% - 77px);
  margin-top: 6px;
}
.faq-contents .faq-list-item .item-text {
  padding: 16px 20px;
  border-radius: 12px;
}
.faq-contents .faq-list-item .item-text::before {
  width: 47px;
  height: 47px;
}
.faq-contents .faq-list-item .item-text p {
  width: calc(100% - 77px);
  padding-top: 8px;
}

/*===============================================
  採用情報
===============================================*/
/*求める人物像
-----------------------------*/
.recruit-ideal {
  padding: 100px 0 120px;
}
.recruit-ideal .ideal-in {
  min-height: 555px;
  padding-left: 560px;
  position: relative;
}
.recruit-ideal .ideal-list-item {
  font-size: 1.8rem;
  line-height: 1.66667;
  padding: 15px 30px;
  border-radius: 12px;
  margin-bottom: 20px;
}
.recruit-ideal .ideal-list-item .b {
  font-size: 2.1rem;
  line-height: 1;
}
.recruit-ideal .ideal-imgs {
  width: calc(50vw - 60px);
  max-width: 780px;
  min-width: 580px;
  padding-bottom: 154px;
  position: absolute;
  top: 0;
  right: calc(50% + 40px);
}
.recruit-ideal .ideal-imgs li:nth-of-type(1) {
  width: 76.9231%;
  margin-left: auto;
}
.recruit-ideal .ideal-imgs li:nth-of-type(1) div {
  height: 401px;
}
.recruit-ideal .ideal-imgs li:nth-of-type(2) {
  width: 61.539%;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 1;
}
.recruit-ideal .ideal-imgs li:nth-of-type(2) div {
  height: 340px;
  outline: solid 10px #fff;
}
.recruit-ideal .ideal-imgs li div {
  border-radius: 20px;
}
.recruit-ideal .ideal-imgs li img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

/*選考フロー
-----------------------------*/
.recruit-flow {
  padding: 100px 0;
}
.recruit-flow .flow-ttl::after {
  content: "";
  width: 480px;
  height: 173px;
  background: url(../img/recruit/deco_flow.png) no-repeat left bottom/contain;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -60px;
  z-index: -2;
}
.recruit-flow .flow-list {
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(100% + 36px);
  margin-left: -18px;
}
.recruit-flow .flow-list::before {
  width: 1210px;
  height: 96px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: -82px;
}
.recruit-flow .flow-list::after {
  width: 70px;
  height: 146px;
  -webkit-clip-path: polygon(0 0, 100% 50%, 0 100%);
          clip-path: polygon(0 0, 100% 50%, 0 100%);
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: -82px;
}
.recruit-flow .flow-list-item {
  width: 100%;
  border-radius: 12px;
  padding: 19px;
  margin: 0 18px;
}
.recruit-flow .flow-list-item .item-num {
  font-size: 2.1rem;
  margin: -8px 0 14px;
}
.recruit-flow .flow-list-item .item-num span {
  font-size: 4.2rem;
}
.recruit-flow .flow-list-item .item-num::before {
  width: calc(100% + 52px);
  height: 12px;
  bottom: 3px;
}
.recruit-flow .flow-list-item .item-icon {
  margin-bottom: 18px;
}
.recruit-flow .flow-list-item .item-txt {
  font-size: 2.1rem;
  line-height: 1.80953;
  border-radius: 6px;
}
.recruit-flow .flow-list-item .item-txt p.ki {
  padding-left: 0.5em;
}

/*募集要項
-----------------------------*/
.recruit-contents {
  padding: 100px 0;
}
.recruit-contents .recruit-box {
  margin-bottom: 50px;
}
.recruit-contents .recruit-box .box-ttl {
  padding: 14px 20px;
}
.recruit-contents .recruit-box .box-ttl > span {
  font-size: 2.1rem;
}

/*==================================================
 ニュース一覧
================================================== */
.news-contents {
  padding: 100px 0;
}
.news-contents .news-list-item {
  margin-bottom: 20px;
}
.news-contents .news-list-item a {
  padding: 20px;
  border-radius: 12px;
}
.news-contents .news-list-item a > * {
  margin-top: 10px !important;
}
.news-contents .news-list-item a > *:first-child {
  margin-top: 0 !important;
}
.news-contents .news-list-item .date {
  min-width: 85px;
  font-size: 1.4rem;
  line-height: 1.5;
  padding: 0 8px;
}
.news-contents .news-list-item .item-ttl {
  font-size: 1.6rem;
  line-height: 1.625;
  margin: -5px 0;
}
.news-contents .news-list-item .tag {
  font-size: 1.5rem;
  line-height: 1.66667;
  margin: -5px 0;
}

/*タグリスト
-----------------------------*/
.tag-select-box-wrap {
  margin-bottom: 50px;
}
.tag-select-box-wrap .tag-select-box {
  min-width: 240px;
}
.tag-select-box-wrap .tag-select-box::after {
  right: 18px;
}
.tag-select-box-wrap .tag-select-box select {
  font-size: 1.4rem;
  line-height: 1.42858;
  padding: 12px 48px 12px 12px;
}

/*==================================================
 ニュース詳細
================================================== */
.news-detail {
  padding: 100px 0;
}
.news-detail .post-data {
  font-size: 1.4rem;
  line-height: 1.42858;
  margin-bottom: 20px;
}
/*==================================================
 お問い合わせ
================================================== */
.contact-contents {
  padding: 100px 0;
}
.contact-contents .contact-table {
  margin-bottom: 56px;
}
.contact-contents .contact-table th {
  width: 380px;
  text-align: left;
  line-height: 2.375;
}
.contact-contents .contact-table th .optional-mark,
.contact-contents .contact-table th .required-mark {
  font-size: 1.4rem;
  line-height: 2;
  margin-left: 1em;
}
.contact-contents .contact-table td {
  vertical-align: middle;
  line-height: 2.375;
}
.contact-contents .contact-submits-wrap {
  padding-top: 32px;
}
.contact-contents .contact-submits-wrap > * {
  width: 320px;
  height: 60px;
  margin: 20px 15px 0;
}

/*==================================================
 お問い合わせ完了
================================================== */
.complete-contents {
  padding: 100px 0;
}
.complete-contents .complete-box {
  text-align: center;
}

/*==================================================
プライバシーポリシー
================================================== */
.privacy-contents {
  padding: 100px 0;
}
.privacy-contents .item-box {
  margin-bottom: 60px;
}

/*==================================================
 サイトマップ
================================================== */
.site-contents {
  padding: 100px 0;
}
.site-contents .site-list {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-direction: column;
  flex-wrap: wrap;
  max-height: 400px;
  padding-top: 81px;
  position: relative;
}
.site-contents .site-list-item {
  width: 500px;
  margin-right: 80px;
}
.site-contents .site-list-item:nth-of-type(1) {
  width: 100%;
  margin-right: 0;
  position: absolute;
  top: 0;
  left: 0;
}
.site-contents .site-list-item a {
  font-size: 1.8rem;
  line-height: 1.66667;
  padding: 15px 20px;
}
.site-contents .site-list-item a::after {
  width: 55px;
  height: 20px;
}

/*===============================================
  404エラー
===============================================*/
.error-contents {
  padding: 100px 0;
}