@charset "utf-8";

/* 使用する色 */
/* メイン : #D8412F */
/* アクセント : #FE7A47 */
/* 背景 : #FCFDFE */
/* サブ : #F5CA99 */
/* フォント : #151515 */

/* .biz-udpgothic-regular {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.biz-udpgothic-bold {
  font-family: "BIZ UDPGothic", sans-serif;
  font-weight: 700;
  font-style: normal;
} */

/* .ibm-plex-sans-<uniquifier> {
  font-family: "IBM Plex Sans", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-variation-settings:
  "wdth" 100;
} */

.setHeight {
  height: calc(var(--dvh, 1vh) * 100);
}

/* スクロールデザイン */
::-webkit-scrollbar {
  width: 0;
  height: 0;
}
::-webkit-scrollbar-track {
  background-color: transparent;
}
::-webkit-scrollbar-thumb {
  background-color: transparent;
}
/* --------------------------- */

body {
  width: 100%;
  background-color: #FCFDFE;
  font-family: "BIZ UDPGothic", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: #151515;
}

header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  background-color: rgb(216, 65, 47, 1);
  box-shadow: 0 0 7px -1px rgb(21, 21, 21, 0.4);
  color: #FCFDFE;
}
header.default {
  height: 110px;
  transition: height 0.3s, background-color 0.3s, color 0.3s;
}
header.first {
  height: calc(var(--dvh, 1vh) * 100);
  transition: height 0.3s, background-color 0.3s, color 0.3s;
}
header.color {
  background-color: rgb(252, 253, 254, 0.9);
  color: #d8412f;
}

main {
  min-height: 100%;
  padding-top: 110px;
}

.designContent {
  overflow: hidden;
  position: relative;
}

footer {
  min-height: 380px;
  padding: 30px 0 50px;
  background-color: #d8412f;
  font-family: "IBM Plex Sans", sans-serif;
  font-weight: 500;
  color: #FCFDFE;
  position: relative;
}
footer .copyRight {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 0);
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  width: 220px;
  height: 45px;
}
footer .copyRight a {
  display: block;
  line-height: 1.5;
  text-decoration: underline;
}
/* フッターロゴ */
footer .serviceLogo {
  width: 220px;
  margin: 0 auto;
  position: relative;
}
footer .serviceLogo a {
  display: block;
  height: 180px;
  background-image: url(../img/logo/service-logo-w.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
footer .serviceLogo p {
  position: absolute;
  bottom: 10px;
  left: 0;
  width: 100%;
  text-align: center;
}
/* SNS ロゴリンク */
footer .snsLinks {
  padding: 15px 0;
}
footer .snsLinks ul {
  display: flex;
  justify-content: center;
  align-items: center;
}
footer .snsLinks li a {
  display: block;
  width: 45px;
  height: 45px;
  margin: 0 15px;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 100px;
  box-shadow: 2px 2px 5px -2px rgb(21, 21, 21, 0.4);
}
footer .snsLinks li a.sns-x {
  background-image: url(../img/sns/x-logo.svg);
  background-color: #000000;
  background-size: 20px;
}
footer .snsLinks li a.sns-instagram {
  background-image: url(../img/sns/Instagram_Glyph_Gradient.svg);
  background-color: #FCFDFE;
  background-size: 30px;
}

/* ナビボタン */
.navBtn {
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translate(0, -50%);
  z-index: 100;
  display: none;
  width: 70px;
  height: 70px;
  background-color: #d8412f;
  border-radius: 100px;
}
header.first .navBtn {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.1s 0.3s;
}
.navBtn .item {
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 45px;
  height: 2px;
  background-color: #FCFDFE;
  transition: top 0.3s, transform 0.3s, opacity 0.3s;
}
.navBtn .item:nth-of-type(1) {
  top: calc((100% / 6) * 2);
}
.navBtn .item:nth-of-type(2) {
  top: 50%;
}
.navBtn .item:nth-of-type(3) {
  top: calc((100% / 6) * 4);
}
.navBtn.selected .item:nth-of-type(1) {
  top: 50%;
  transform: translate(-50%, -50%) rotate(40deg);
}
.navBtn.selected .item:nth-of-type(2) {
  opacity: 0;
}
.navBtn.selected .item:nth-of-type(3) {
  top: 50%;
  transform: translate(-50%, -50%) rotate(-40deg);
  box-shadow: 2px 2px 0 1px #d8412f;
}
/* メインナビ */
.mainNav {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  width: 100%;
  max-width: 695px;
  height: 110px;
}
header.default .mainNav.hidden {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.3s 0.1s, visibility 0.1s;
}
header.first .mainNav.hidden {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.1s 0.3s;
}
.mainNav ul {
  display: flex;
  justify-content: space-around;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 0 10px;
}
.mainNav li {
  margin: 0 10px
}
.mainNav li button {
  letter-spacing: 0.1em;
  font-weight: 700;
  position: relative;
}
.mainNav li button::before {
  content: '';
  position: absolute;
  bottom: -5px;
  left: 50%;
  transform: translate(-50%, 0);
  width: 0;
  height: 2px;
  border-radius: 100px;
  transition: width 0.2s ease-out, background-color 0.3s;
}
.default .mainNav li button::before {
  background-color: #FCFDFE;
}
.default.color .mainNav li button::before {
  background-color: #d8412f;
}
.mainNav li button:hover::before {
  width: 100%;
}

/* タイトル */
h1.title {
  position: absolute;
  height: 110px;
  opacity: 0;
}
header.default h1.title {
  top: 0;
  left: 10px;
  transform: translate(0, 0);
  width: 150px;
  opacity: 1;
  transition: top 0.3s,
              left 0.3s,
              transform 0.3s,
              width 0.3s,
              opacity 0.3s;
}
header.first h1.title {
  top: calc(50% - 30px);
  left: 50%;
  transform: translate(-50%, -50%);
  width: 420px;
  opacity: 1;
  transition: top 0.3s,
              left 0.3s,
              transform 0.3s,
              width 0.3s,
              opacity 0.3s;
}
h1.title a {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
}
h1.title a::before,
h1.title a::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  background-position: left;
  background-repeat: no-repeat;
}
h1.title a::before {
  background-image: url(../img/logo/service-logo-w.svg);
}
h1.title.default a::before {
  opacity: 1;
}
header.first h1.title a::before {
  opacity: 1;
}
header.default.color h1.title a::before {
  opacity: 0;
}
h1.title a::after {
  background-image: url(../img/logo/service-logo.svg);
}
header.first h1.title a::after {
  opacity: 0;
}
header.default h1.title a::after {
  opacity: 0;
}
header.default.color h1.title a::after {
  opacity: 1;
}
header.default h1.title a::before,
header.default h1.title a::after {
  background-size: 120px;
  transition: background-size 0.3s, opacity 0.3s;
}
header.first h1.title a::before,
header.first h1.title a::after {
  background-size: 220px;
  transition: background-size 0.3s, opacity 0.3s;
}
h1.title p {
  position: absolute;
  bottom: -30px;
  left: calc(50% + 10px);
  transform: translate(-50%, -50%);
  width: 420px;
  text-align: center;
  letter-spacing: 0.5em;
  opacity: 0;
  visibility: hidden;
  font-size: 20px;
}
header.first h1.title p.hidden {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.1s 0.3s;
}
header.default h1.title p.display {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.1s 0.3s;
}
header.first h1.title p.display {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.3s 0.1s, visibility 0.1s;
}

/* セクション */
section {
  padding: 195px 0;
  position: relative;
}
/* 中央揃え */
section .center {
  width: 100%;
  max-width: 1800px;
  min-height: 100%;
  margin: 0 auto;
  padding: 0 15px;
}
/* 背景変更 */
section.background {
  background-color: rgb(245, 202, 153, 0.6);
}

/* 見出し */
section .subtitle {
  padding-bottom: 165px;
  text-align: center;
  letter-spacing: 0.15em;
  font-size: 32px;
  font-weight: 700;
  position: relative;
}
section .subtitle::before {
  content: '';
  position: absolute;
  top: -95px;
  left: 50%;
  transform: translate(-50%, 0);
  width: 80px;
  height: 5px;
  background-color: #d8412f;
}
section .subtitle .en {
  position: absolute;
  top: 55px;
  left: 50%;
  transform: translate(-50%, 0);
  width: 100%;
  text-transform: capitalize;
  font-family: "IBM Plex Sans", sans-serif;
  font-size: 42px;
  font-weight: 700;
  opacity: 0.2;
}
/* 最初のテキスト */
section .text {
  text-align: center;
  line-height: 2;
  padding-bottom: 60px;
  font-size: 20px;
}

/* sec-01 */
main .sec-01 {
  overflow: hidden;
}
main .sec-01::before {
  content: '';
  position: absolute;
  bottom: -10px;
  left: -10px;
  width: 420px;
  height: 420px;
  background-image: url(../img/items/item-dot-pattern-w.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
main .sec-01::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 50%;
  height: 100%;
  background-image: url(../img/images/image-01.webp);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  clip-path: polygon(0 0, 100% 0, 70% 100%, 0% 100%);
}
/* サービス名 */
.serviceName {
  position: absolute;
  top: calc(50% - 130px);
  left: 60px;
  transform: translate(0, -50%);
}
.serviceName h2 {
  font-size: 42px;
  font-weight: 700;
  color: #FCFDFE;
}
.serviceName h2::before {
  content: '';
  position: absolute;
  top: -120px;
  left: -30px;
  transform: rotate(-10deg);
  width: 160px;
  height: 160px;
  background-image: url(../img/logo/logo-lets.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.serviceName span {
  font-size: 56px;
  color: #fed639;
}
.serviceName p {
  margin-top: 15px;
  line-height: 2;
  letter-spacing: 0.22em;
  font-size: 20px;
  color: #FCFDFE;
}
/* トップ写真 */
.topImage {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  padding-left: 30%;
}
.topImage::after {
  content: '';
  position: absolute;
  top: calc(50% - 120px);
  left: 70%;
  transform: translate(-50%, -50%);
  width: 700px;
  height: 700px;
  background-image: url(../img/logo/service-logo.svg);
  background-position: left;
  background-repeat: no-repeat;
  background-size: contain;
  letter-spacing: 0.3em;
  font-size: 68px;
  opacity: 0.6;
}
.topImage img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* sec-02 */
.sec-02 .scroll {
  width: 100%;
  max-width: 880px;
  margin: 0 auto;
  padding: 0 35px 120px 35px;
  overflow-x: auto;
  overflow-y: hidden;
}
.sec-02 table {
  width: 100%;
  min-width: 520px;
  margin-top: 95px;
  table-layout: fixed;
  position: relative;
}
.sec-02 table::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  width: calc((100% - 165px) / 3);
  height: 100%;
  background-color: rgb(254, 214, 57, 0.8);
  border: 2px solid rgb(21, 21, 21, 0.1);
  transition: transform 0.3s;
}
.sec-02 table:hover::before {
  transform: scale(1.04);
}
/* ヘッド */
.sec-02 table th {
  width: calc((100% - 165px) / 3);
  min-width: calc((520px - 165px) / 3);
  line-height: 5;
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  color: #FCFDFE;
}
.sec-02 table th.major,
.sec-02 table th.minor {
  width: 0;
}
.sec-02 table th.empty {
  width: 165px;
}
.sec-02 table th .item {
  background-color: #FE7A47;
}
.sec-02 table th.emphasis {
  background-image: url(../img/logo/service-logo.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  position: relative;
  z-index: 2;
  transition: transform 0.3s;
}
.sec-02 table:hover th.emphasis {
  transform: scale(1.1);
}
/* ボディ */
.sec-02 table td {
  position: relative;
}
.sec-02 table .item {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 110px;
}
.sec-02 table td .item {
  position: relative;
  z-index: 1;
}
.sec-02 table td #yes {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 25px;
  height: 25px;
  border: 3px solid #d8412f;
  border-radius: 100px;
}
.sec-02 tbody td.major {
  position: sticky;
  left: 0;
  z-index: 10;
  letter-spacing: 0.2em;
  font-weight: 700;
}
.sec-02 table td.major .item {
  position: absolute;
  top: 50%;
  left: 10px;
  transform: translate(0, -50%);
  display: flex;
  justify-content: center;
  align-items: center;
  width: 25px;
  padding: 15px 0;
  height: auto;
  background-color: rgb(254, 122, 71);
  box-shadow: 2px 2px 5px -2px rgb(21, 21, 21, 0.6);
  white-space: nowrap;
  writing-mode: vertical-rl;
  color: #FCFDFE;
}
.sec-02 table td.minor {
  position: sticky;
  left: 95px;
  z-index: 10;
}
.sec-02 table td.minor .item {
  position: absolute;
  top: 50%;
  left: -45px;
  transform: translate(0, -50%);
  display: flex;
  justify-content: start;
  align-items: center;
  border-radius: 5px;
  white-space: nowrap;
  font-size: 16px;
  font-weight: 700;
  color: rgb(21, 21, 21, 0.6);
}
.sec-02 tbody td.major[rowspan="3"] .item {
  height: calc((110px - 40px) * 3);
}
.sec-02 table .row:nth-child(even) td {
  background-color: rgb(245, 202, 153, 0.4);
}
.sec-02 table td.major {
  background-color: transparent !important;
}
/* LEOを強調 */
.sec-02 table .item.emphasis {
  color: #d8412f;
  font-size: 20px;
  font-weight: 700;
  position: relative;
  z-index: 2;
  transition: transform 0.3s;
}
.sec-02 table:hover .item.emphasis {
  transform: scale(1.1);
}

/* sec-03 */
.sec-03 {
  overflow: hidden;
  position: relative;
}
.sec-03::before {
  content: '';
  position: absolute;
  bottom: -195px;
  right: 0;
  transform: rotate(-90deg);
  z-index: -1;
  width: 1200px;
  height: 1200px;
  background-image: url(../img/items/item-dot-pattern-r.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  opacity: 0.2;
}
.sec-03 .row {
  display: flex;
  justify-content: start;
  align-items: start;
  flex-wrap: wrap;
  max-width: 100%;
  min-height: 710px;
  margin-top: 120px;
  position: relative;
}
.sec-03 .imageContent {
  width: 50%;
  min-width: 620px;
  max-width: 660px;
  height: 570px;
  position: relative;
}
.sec-03 .imageContent img {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sec-03 .imageContent h3 {
  position: absolute;
  top: -10px;
  left: 0;
  z-index: 1;
  display: flex;
  justify-content: start;
  align-items: center;
  height: 65px;
  padding: 10px;
  background-color: #FCFDFE;
  font-size: 20px;
  color: #d8412f;
}
.sec-03 .textContent {
  width: calc(100% - 660px);
  min-width: 520px;
  padding-left: 30px;
}
.sec-03 .textContent h3.column {
  display: inline-block;
  margin-bottom: 15px;
  text-align: center;
  font-size: 20px;
  color: #d8412f;
  position: relative;
}
.sec-03 .textContent h3.column::before {
  content: '';
  position: absolute;
  bottom: -5px;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #d8412f;
}
.sec-03 .textContent p {
  margin-top: 15px;
  line-height: 2;
  font-size: 18px;
}
.sec-03 .textContent .case {
  margin-top: 15px;
  padding: 10px;
  border: 1px solid rgb(21, 21, 21, 0.1);
  background-color: #FCFDFE;
  box-shadow: 2px 2px 5px -2px rgb(21, 21, 21, 0.6);
  position: relative;
}
.sec-03 .textContent .case::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  background-color: rgb(216, 65, 47, 0.6);
  clip-path: polygon(90% 0, 100% 0, 100% 100%, 50% 100%);
}
.sec-03 .textContent .case h4 {
  margin: 20px 0;
  padding-left: 35px;
  font-size: 20px;
  font-weight: 700;
  color: #d8412f;
  position: relative;
}
.sec-03 .textContent .case h4::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(0, -50%);
  width: 25px;
  height: 25px;
  background-color: #d8412f;
  clip-path: polygon(60% 0, 100% 0, 100% 100%, 10% 100%);
}
.sec-03 .textContent ul {
  padding: 0 0 25px;
  font-size: 18px;
  position: relative;
  z-index: 2;
}
.sec-03 .textContent li {
  margin-top: 10px;
  line-height: 2;
}
.sec-03 .sumupText {
  margin-top: 160px;
  text-align: center;
  line-height: 2.3;
  font-size: 22px;
}

/* sec-04 */
.sec-04 dl {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  padding-bottom: 5px;
}
.sec-04 dl .row {
  width: calc((100% - 60px) / 2);
  min-width: 580px;
  max-width: 760px;
  height: 460px;
  margin: 50px 10px;
  padding: 20px 10px;
  background-color: #FCFDFE;
  box-shadow: 2px 2px 5px -3px rgb(21, 21, 21, 0.4);
}
.sec-04 dt {
  display: flex;
  justify-content: start;
  align-items: center;
  width: 100%;
  max-width: 320px;
  height: 55px;
  font-size: 24px;
  position: relative;
}
.sec-04 dt::before {
  content: '';
  position: absolute;
  bottom: 5px;
  left: 80px;
  width: calc(100% - 80px);
  height: 3px;
  background-color: #d8412f;
}
.sec-04 .num {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 60px;
  height: 100%;
  margin-right: 20px;
  letter-spacing: 0.3em;
  position: relative;
  z-index: 1;
}
.sec-04 .num::before {
  content: '';
  position: absolute;
  bottom: 5px;
  right: -30px;
  z-index: -1;
  width: 70px;
  height: 70px;
  background-image: url(../img/items/item-num-line.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  opacity: 0.6;
}
.sec-04 dd {
  height: calc(100% - 55px);
  padding: 20px 0 0;
  line-height: 1.5;
  font-size: 18px;
  position: relative;
}
.sec-04 dd p {
  line-height: 1.8;
}
.sec-04 dd img {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 70%;
  object-fit: cover;
}
/* sec-05 */
.sec-05::before {
  content: '';
  position: absolute;
  top: 0;
  right: -120%;
  transform: rotate(45deg);
  z-index: -1;
  width: 200%;
  height: 100%;
  background-color: rgba(254, 122, 71, 0.4);
}
.sec-05 li {
  display: flex;
  justify-content: start;
  align-items: start;
  flex-wrap: wrap;
  margin-top: 60px;
  padding: 0 20px;
}
.sec-05 h3 {
  width: 340px;
  font-size: 24px;
  position: relative;
}
.sec-05 h3::before {
  content: '';
  position: absolute;
  top: 0;
  left: -15px;
  width: 5px;
  height: 30px;
  background-color: #d8412f;
}
.sec-05 h3 .promises {
  position: absolute;
  bottom: -35px;
  left: 0;
  width: 100%;
  height: 25px;
  white-space: nowrap;
  text-transform: capitalize;
  letter-spacing: 0.1em;
  font-size: 22px;
  color: rgb(216, 65, 47, 0.4);
}
.sec-05 .detail {
  width: calc(100% - 320px);
  max-width: 1230px;
  min-width: 470px;
  min-height: 320px;
  margin-top: 60px;
  padding-left: 360px;
  position: relative;
}
.sec-05 .detail::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 320px;
  height: 100%;
  background-position: top;
  background-repeat: no-repeat;
  background-size: cover;
}
.sec-05 li:nth-child(1) .detail::before {
  background-image: url(../img/images/image-13.webp);
}
.sec-05 li:nth-child(2) .detail::before {
  background-image: url(../img/images/image-14.webp);
}
.sec-05 li:nth-child(3) .detail::before {
  background-image: url(../img/images/image-15.webp);
}
.sec-05 .detail p {
  margin-bottom: 15px;
  line-height: 2;
  font-size: 18px;
}

/* sec-06 */
.sec-06 .case {
  display: flex;
  justify-content: center;
  align-items: start;
  flex-wrap: wrap;
  margin-bottom: 95px;
}
.sec-06 .image {
  width: 320px;
  height: 390px;
  position: relative;
}
.sec-06 .image img,
.sec-06 .image .noImage {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sec-06 .image .noImage {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgb(252, 253, 254, 0.6);
  border: 2px solid rgb(21, 21, 21, 0.6);
  font-size: 24px;
  color: rgb(21, 21, 21, 0.6);
}
.sec-06 .caseData {
  width: 100%;
  max-width: 480px;
  padding-left: 20px;
}
.sec-06 .caseData li {
  margin-bottom: 30px;
}
.sec-06 .caseData h3 {
  display: inline-block;
  width: auto;
  font-size: 24px;
  position: relative;
}
.sec-06 .caseData h3::before {
  content: '';
  position: absolute;
  bottom: -5px;
  left: 15px;
  width: calc(100% + 30px);
  height: 2px;
  background-color: #d8412f;
}
.sec-06 .caseData .name {
  margin-left: 15px;
  font-size: 20px;
  color: rgb(21, 21, 21, 0.6);
}
.sec-06 .caseData .message {
  line-height: 1.9;
}

/* company-sec */
main .company-sec {
  padding-top: 160px;
}
.company-sec .center dl {
  width: 100%;
  max-width: 680px;
  margin: 0 auto;
}
.company-sec .center dt {
  display: flex;
  justify-content: start;
  align-items: center;
  height: 50px;
  margin-top: 15px;
  padding-left: 20px;
  font-weight: 400;
  position: relative;
}
.company-sec .center dt::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(0, -50%);
  width: 3px;
  height: 35px;
  background-color: #d8412f;
}
.company-sec .center dd {
  display: flex;
  justify-content: start;
  align-items: center;
  flex-wrap: wrap;
  padding: 10px 10px 10px 20px;
  line-height: 1.5;
  border-bottom: 1px solid rgb(21, 21, 21, 0.1);
  font-size: 18px;
}
.company-sec .center .map {
  width: 100%;
  padding: 20px 0;
}
.company-sec .center .map iframe {
  width: 100%;
}
.company-sec .center .email {
  text-decoration: underline;
}

/* message-sec */
.message-sec .message {
  width: 100%;
  max-width: 680px;
  margin: 0 auto;
}
.message-sec p {
  margin-top: 20px;
  line-height: 2;
  letter-spacing: 0.1em;
}
.message-sec p.name {
  display: block;
  width: 190px;
  margin-left: auto;
  font-family: "Yuji Mai", serif;
  font-size: 24px;
  font-weight: 300;
}

/* recruit-sec */
main .recruit-sec .center {
  height: auto;
  min-height: auto;
}