@charset "UTF-8";
/*! destyle.css v4.0.1 | MIT License | https://github.com/nicolas-cusan/destyle.css */
/* Reset box-model and set borders */
/* ============================================ */
*,
::before,
::after {
  box-sizing: border-box;
  border-style: solid;
  border-width: 0;
  min-width: 0;
}

/* Document */
/* ============================================ */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 * 3. Remove gray overlay on links for iOS.
 */
html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -webkit-tap-highlight-color: transparent; /* 3*/
}

/* Sections */
/* ============================================ */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block;
}

/* Vertical rhythm */
/* ============================================ */
p,
table,
blockquote,
address,
pre,
iframe,
form,
figure,
dl {
  margin: 0;
}

/* Headings */
/* ============================================ */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
  margin: 0;
}

/* Lists (enumeration) */
/* ============================================ */
ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Lists (definition) */
/* ============================================ */
dt {
  font-weight: bold;
}

dd {
  margin-left: 0;
}

/* Grouping content */
/* ============================================ */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
  border-top-width: 1px;
  margin: 0;
  clear: both;
  color: inherit;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace; /* 1 */
  font-size: inherit; /* 2 */
}

address {
  font-style: inherit;
}

/* Text-level semantics */
/* ============================================ */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
  text-decoration: none;
  color: inherit;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: inherit; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Replaced content */
/* ============================================ */
/**
 * Prevent vertical alignment issues.
 */
svg,
img,
embed,
object,
iframe {
  vertical-align: bottom;
}

/* Forms */
/* ============================================ */
/**
 * Reset form fields to make them styleable.
 * 1. Make form elements stylable across systems iOS especially.
 * 2. Inherit text-transform from parent.
 */
button,
input,
optgroup,
select,
textarea {
  -webkit-appearance: none; /* 1 */
  appearance: none;
  vertical-align: middle;
  color: inherit;
  font: inherit;
  background: transparent;
  padding: 0;
  margin: 0;
  border-radius: 0;
  text-align: inherit;
  text-transform: inherit; /* 2 */
}

/**
 * Correct cursors for clickable elements.
 */
button,
[type=button],
[type=reset],
[type=submit] {
  cursor: pointer;
}

button:disabled,
[type=button]:disabled,
[type=reset]:disabled,
[type=submit]:disabled {
  cursor: default;
}

/**
 * Improve outlines for Firefox and unify style with input elements & buttons.
 */
:-moz-focusring {
  outline: auto;
}

select:disabled {
  opacity: inherit;
}

/**
 * Remove padding
 */
option {
  padding: 0;
}

/**
 * Reset to invisible
 */
fieldset {
  margin: 0;
  padding: 0;
  min-width: 0;
}

legend {
  padding: 0;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * Correct the outline style in Safari.
 */
[type=search] {
  outline-offset: -2px; /* 1 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Fix font inheritance.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/**
 * Fix appearance for Firefox
 */
[type=number] {
  -moz-appearance: textfield;
}

/**
 * Clickable labels
 */
label[for] {
  cursor: pointer;
}

/* Interactive */
/* ============================================ */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/*
 * Remove outline for editable content.
 */
[contenteditable]:focus {
  outline: auto;
}

/* Tables */
/* ============================================ */
/**
1. Correct table border color inheritance in all Chrome and Safari.
*/
table {
  border-color: inherit; /* 1 */
  border-collapse: collapse;
}

caption {
  text-align: left;
}

td,
th {
  vertical-align: top;
  padding: 0;
}

th {
  text-align: left;
  font-weight: bold;
}

/**
 * 数値計算
 * ---------------------------------------- */
/**
 * pcVW計算
 * ---------------------------------------- */
/**
 * pcVH計算
 * ---------------------------------------- */
/**
 * pcVW-VH計算
 * ---------------------------------------- */
/**
 * ブレイクポイント
 * ---------------------------------------- */
/**
 * フォント
 * ---------------------------------------- */
/**
 * カラー
 * ---------------------------------------- */
/**
 * カラー以外の変数を定義
 * ---------------------------------------- */
/**
 * 改行
 * ---------------------------------------- */
/**
 * サイト全体で共通するベースのスタイル
 * ---------------------------------------- */
body {
  color: #000;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0;
}

/**
 * ホバー
 * ---------------------------------------- */
/**
 * c-icon（アイコン）
 * ---------------------------------------- */
.c-icon {
  display: inline-block;
  width: 40px;
  height: 40px;
  mask-repeat: no-repeat;
  mask-size: contain;
  background-color: #fff;
  transition: opacity 0.3s ease-out;
}
@media screen and (max-width: 767px) {
  .c-icon {
    width: 24px;
    height: 24px;
  }
}
.c-icon.-book {
  mask-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2240%22%20height%3D%2240%22%20viewBox%3D%220%200%2040%2040%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_1134_3595)%22%3E%3Cpath%20d%3D%22M5%2031.6659C7.28029%2030.3493%209.86695%2029.6562%2012.5%2029.6562C15.133%2029.6562%2017.7197%2030.3493%2020%2031.6659C22.2803%2030.3493%2024.8669%2029.6562%2027.5%2029.6562C30.133%2029.6562%2032.7197%2030.3493%2035%2031.6659%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M5%2010.0018C7.28029%208.68528%209.86695%207.99219%2012.5%207.99219C15.133%207.99219%2017.7197%208.68528%2020%2010.0018C22.2803%208.68528%2024.8669%207.99219%2027.5%207.99219C30.133%207.99219%2032.7197%208.68528%2035%2010.0018%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M5%2010V31.6667%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M20%2010V31.6667%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M35%2010V31.6667%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_1134_3595%22%3E%3Crect%20width%3D%2240%22%20height%3D%2240%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E");
}
@media screen and (max-width: 767px) {
  .c-icon.-book {
    mask-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_331_1540)%22%3E%3Cpath%20d%3D%22M3%2019C4.36817%2018.2101%205.92017%2017.7942%207.5%2017.7942C9.07983%2017.7942%2010.6318%2018.2101%2012%2019C13.3682%2018.2101%2014.9202%2017.7942%2016.5%2017.7942C18.0798%2017.7942%2019.6318%2018.2101%2021%2019%22%20stroke%3D%22white%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M3%206.00001C4.36817%205.21009%205.92017%204.79424%207.5%204.79424C9.07983%204.79424%2010.6318%205.21009%2012%206.00001C13.3682%205.21009%2014.9202%204.79424%2016.5%204.79424C18.0798%204.79424%2019.6318%205.21009%2021%206.00001%22%20stroke%3D%22white%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M3%206V19%22%20stroke%3D%22white%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M12%206V19%22%20stroke%3D%22white%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M21%206V19%22%20stroke%3D%22white%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_331_1540%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E");
  }
}
.c-icon.-contact {
  mask-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2240%22%20height%3D%2240%22%20viewBox%3D%220%200%2040%2040%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_331_1616)%22%3E%3Cpath%20d%3D%22M31.6667%208.33334H8.33333C6.49238%208.33334%205%209.82573%205%2011.6667V28.3333C5%2030.1743%206.49238%2031.6667%208.33333%2031.6667H31.6667C33.5076%2031.6667%2035%2030.1743%2035%2028.3333V11.6667C35%209.82573%2033.5076%208.33334%2031.6667%208.33334Z%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M5%2011.6667L20%2021.6667L35%2011.6667%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_331_1616%22%3E%3Crect%20width%3D%2240%22%20height%3D%2240%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E");
}
@media screen and (max-width: 767px) {
  .c-icon.-contact {
    mask-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_331_1544)%22%3E%3Cpath%20d%3D%22M19%205H5C3.89543%205%203%205.89543%203%207V17C3%2018.1046%203.89543%2019%205%2019H19C20.1046%2019%2021%2018.1046%2021%2017V7C21%205.89543%2020.1046%205%2019%205Z%22%20stroke%3D%22white%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M3%207L12%2013L21%207%22%20stroke%3D%22white%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_331_1544%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E");
  }
}

/**
 * c-arrow（矢印）
 * ---------------------------------------- */
.c-arrow {
  display: inline-block;
  position: relative;
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background: linear-gradient(270deg, rgb(0, 100, 184) 0%, rgb(0, 0, 128) 100%);
  overflow-x: hidden;
  flex-shrink: 0;
}
.c-arrow::before {
  content: "";
  position: absolute;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2264%22%20height%3D%2224%22%20viewBox%3D%220%200%2064%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M49%2018.0001L55%2012.0001L49%206.00012%22%20stroke%3D%22white%22%20stroke-width%3D%221.5%22%2F%3E%3Cpath%20d%3D%22M9%2018L15%2012L9%206%22%20stroke%3D%22white%22%20stroke-width%3D%221.5%22%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-size: auto 100%;
  background-position: right center;
  transition: background-position 0.3s ease-out;
  width: 24px;
  height: 24px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/**
 * c-button（ボタン）
 * ---------------------------------------- */
.c-button {
  display: grid;
  grid-template-columns: 40px 1fr;
  align-items: center;
  column-gap: 8px;
  padding-top: 10px;
  padding-right: 16px;
  padding-bottom: 10px;
  padding-left: 16px;
  background: linear-gradient(130deg, rgb(0, 100, 184) 0%, rgb(0, 0, 128) 100%);
  border-radius: 8px;
  max-width: 100%;
  position: relative;
  overflow: hidden;
  transition: box-shadow 0.3s ease-out;
}
@media screen and (max-width: 767px) {
  .c-button {
    grid-template-columns: 1fr;
    justify-items: center;
    padding-top: 4px;
    padding-right: 7px;
    padding-bottom: 6px;
    padding-left: 7px;
  }
}
.c-button::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(130deg, rgb(0, 0, 128) 0%, rgb(0, 100, 184) 100%);
  opacity: 0;
  transition: opacity 0.3s ease-out;
  border-radius: 8px;
  z-index: 0;
}
.c-button > * {
  position: relative;
  z-index: 1;
}
.c-button.-size-medium {
  width: 274px;
}
@media screen and (max-width: 767px) {
  .c-button.-size-medium {
    width: max-content;
  }
}
@media (hover: hover) {
  .c-button:where(:any-link, :enabled, summary):hover {
    box-shadow: 0px 8px 20px 0px rgba(0, 107, 179, 0.25);
  }
  .c-button:where(:any-link, :enabled, summary):hover::before {
    opacity: 1;
  }
  .c-button:where(:any-link, :enabled, summary):hover .c-icon {
    opacity: 0.7;
  }
  .c-button:where(:any-link, :enabled, summary):hover .c-button__text {
    opacity: 0.7;
  }
}

.c-button__text {
  display: block;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: 700;
  color: #fff;
  text-align: center;
  transition: opacity 0.3s ease-out;
}
@media screen and (max-width: 767px) {
  .c-button__text {
    font-size: 11px;
    font-size: 0.6875rem;
    line-height: 1.2;
  }
}

/**
 * c-cta-button（ボタン/CTA）
 * ---------------------------------------- */
.c-cta-button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  column-gap: clamp(0px, 0px + (16 - 0) * (100vw - 768px) / (1920 - 768), 16px);
  padding-top: 15px;
  padding-right: clamp(8px, 8px + (15 - 8) * (100vw - 768px) / (1920 - 768), 15px);
  padding-bottom: 15px;
  padding-left: clamp(12px, 12px + (24 - 12) * (100vw - 768px) / (1920 - 768), 24px);
  background-color: #fff;
  border-radius: 8px;
  transition: flter;
  transition: box-shadow 0.3s ease-out;
  max-width: 320px;
}
@media screen and (max-width: 767px) {
  .c-cta-button {
    column-gap: 16px;
    padding-right: 24px;
    padding-left: 24px;
    max-width: 100%;
  }
}
@media (hover: hover) {
  .c-cta-button:where(:any-link, :enabled, summary):hover {
    box-shadow: 0 8px 30px 0 rgba(255, 255, 255, 0.4);
  }
  .c-cta-button:where(:any-link, :enabled, summary):hover .c-cta-button__text {
    opacity: 0.7;
  }
  .c-cta-button:where(:any-link, :enabled, summary):hover .c-arrow::before {
    background-position: left center;
  }
}

.c-cta-button__text {
  font-size: clamp(16px, 16px + (20 - 16) * (100vw - 768px) / (1920 - 768), 20px);
  font-weight: 700;
  line-height: 1;
  color: #0d2ea0;
  padding-right: 12.5px;
  padding-left: 12.5px;
  transition: opacity 0.3s ease-out;
}
@media screen and (max-width: 767px) {
  .c-cta-button__text {
    font-size: 20px;
    font-size: 1.25rem;
  }
}

/**
 * c-heading（見出し）
 * ---------------------------------------- */
.c-heading.-level2 {
  font-size: 48px;
  font-size: 3rem;
  font-weight: 700;
}
@media screen and (max-width: 767px) {
  .c-heading.-level2 {
    font-size: 32px;
    font-size: 2rem;
  }
}
.c-heading.-level2.-use {
  font-size: clamp(32px, min(calc(32px + (48 - 32) * (100vw - 768px) / (1920 - 768)), calc(32px + (48 - 32) * (100vh - 680px) / (1080 - 680))), 48px);
}
@media screen and (max-width: 767px) {
  .c-heading.-level2.-use {
    font-size: 32px;
    font-size: 2rem;
  }
}
.c-heading.-level3 .c-heading__text {
  font-size: 32px;
  font-size: 2rem;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  .c-heading.-level3 .c-heading__text {
    font-size: 24px;
    font-size: 1.5rem;
  }
}
.c-heading.-fz-48-32 .c-heading__text {
  font-size: 48px;
  font-size: 3rem;
}
@media screen and (max-width: 767px) {
  .c-heading.-fz-48-32 .c-heading__text {
    font-size: 32px;
    font-size: 2rem;
  }
}
.c-heading.-ff-secondary {
  font-family: "Zen Old Mincho", serif;
}
.c-heading.-fw-black .c-heading__text {
  font-weight: 900;
}
.c-heading.-fw-bold .c-heading__text {
  font-weight: 700;
}
.c-heading.-clr-white {
  color: #ffffff;
}
.c-heading.-clr-primary {
  color: #0081cc;
}

/**
 * c-text（テキスト）
 * ---------------------------------------- */
.c-text.-fz-32-26 {
  font-size: 32px;
  font-size: 2rem;
}
@media screen and (max-width: 767px) {
  .c-text.-fz-32-26 {
    font-size: 26px;
    font-size: 1.625rem;
  }
}
.c-text.-fz-24-20 {
  font-size: 24px;
  font-size: 1.5rem;
}
@media screen and (max-width: 767px) {
  .c-text.-fz-24-20 {
    font-size: 20px;
    font-size: 1.25rem;
  }
}
.c-text.-fz-24-18 {
  font-size: 24px;
  font-size: 1.5rem;
}
@media screen and (max-width: 767px) {
  .c-text.-fz-24-18 {
    font-size: 18px;
    font-size: 1.125rem;
  }
}
.c-text.-fz-24-16 {
  font-size: 24px;
  font-size: 1.5rem;
}
@media screen and (max-width: 767px) {
  .c-text.-fz-24-16 {
    font-size: 16px;
    font-size: 1rem;
  }
}
.c-text.-fz-20-18 {
  font-size: 20px;
  font-size: 1.25rem;
}
@media screen and (max-width: 767px) {
  .c-text.-fz-20-18 {
    font-size: 18px;
    font-size: 1.125rem;
  }
}
.c-text.-fz-18-16 {
  font-size: 18px;
  font-size: 1.125rem;
}
@media screen and (max-width: 767px) {
  .c-text.-fz-18-16 {
    font-size: 16px;
    font-size: 1rem;
  }
}
.c-text.-fz-14-14 {
  font-size: 14px;
  font-size: 0.875rem;
}
.c-text.-fz-13-12 {
  font-size: 13px;
  font-size: 0.8125rem;
}
@media screen and (max-width: 767px) {
  .c-text.-fz-13-12 {
    font-size: 12px;
    font-size: 0.75rem;
  }
}
.c-text.-ff-secondary {
  font-family: "Zen Old Mincho", serif;
}
.c-text.-ff-tertiary {
  font-family: "Roboto", sans-serif;
}
.c-text.-fw-bold {
  font-weight: 700;
}
.c-text.-fw-medium {
  font-weight: 500;
}
.c-text.-clr-white {
  color: #fff;
}
.c-text.-fbess {
  font-size: clamp(20px, min(calc(20px + (24 - 20) * (100vw - 768px) / (1920 - 768)), calc(20px + (24 - 20) * (100vh - 680px) / (1080 - 680))), 24px);
}
@media screen and (max-width: 767px) {
  .c-text.-fbess {
    font-size: 20px;
    font-size: 1.25rem;
  }
}

/**
 * c-image（画像）
 * ---------------------------------------- */
.c-image img {
  max-width: 100%;
  height: auto;
}

/**
 * c-page-top（ページトップに戻る）
 * ---------------------------------------- */
.c-page-top {
  position: absolute;
  right: 55px;
  bottom: 15px;
  z-index: 10;
}
@media screen and (max-width: 767px) {
  .c-page-top {
    right: 51px;
  }
}

.c-page-top__button {
  position: fixed;
  display: inline-block;
  width: 51px;
  height: 42px;
  background: rgba(0, 0, 0, 0.53);
  opacity: 0;
}
.c-page-top__button::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -5px;
  margin-left: -9px;
  display: block;
  width: 17px;
  height: 17px;
  border-top: 3px solid #ffffff;
  border-left: 3px solid #ffffff;
  transform: rotate(45deg);
}

/**
 * l-header（ヘッダー）
 * ---------------------------------------- */
.l-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100;
  background-color: rgba(241, 243, 245, 0.5);
}

.l-header__inner {
  padding-top: 20px;
  padding-right: clamp(20px, 20px + (40 - 20) * (100vw - 768px) / (1920 - 768), 40px);
  padding-bottom: 20px;
  padding-left: clamp(20px, 20px + (40 - 20) * (100vw - 768px) / (1920 - 768), 40px);
}
@media screen and (max-width: 767px) {
  .l-header__inner {
    padding-top: 0;
    padding-right: 0;
    padding-bottom: 0;
  }
}

.l-header__group {
  display: flex;
  align-items: center;
  justify-content: space-between;
  column-gap: clamp(12px, 12px + (16 - 12) * (100vw - 768px) / (1920 - 768), 16px);
}

.l-header__cta {
  display: flex;
  align-items: center;
  column-gap: clamp(8px, 8px + (29 - 8) * (100vw - 768px) / (1920 - 768), 29px);
}
@media screen and (max-width: 767px) {
  .l-header__cta {
    column-gap: 2px;
  }
}
@media screen and (max-width: 767px) {
  .l-header__cta .c-button {
    border-radius: 0;
  }
}
@media screen and (max-width: 767px) {
  .l-header__cta .c-button:first-child {
    border-bottom-left-radius: 8px;
  }
}

.l-header__logo img {
  max-width: 100%;
  height: auto;
}
@media screen and (max-width: 767px) {
  .l-header__logo img {
    width: 131px;
  }
}

/**
 * l-footer（フッター）
 * ---------------------------------------- */
@media screen and (max-width: 767px) {
  .l-footer {
    padding-top: 48px;
    padding-right: 16px;
    padding-bottom: 48px;
    padding-left: 16px;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .l-footer {
    padding-top: 0;
    padding-right: 10px;
    padding-bottom: 40px;
    padding-left: 10px;
    overflow-x: hidden;
  }
}

.l-footer__inner {
  max-width: 1200px;
  margin-right: auto;
  margin-left: auto;
}

.l-footer__top {
  background-image: url("/FBESS-LA261A/img/common/bg_footer_top_01.webp");
  background-size: cover;
  background-repeat: no-repeat;
  padding-right: 20px;
  padding-left: 20px;
}
@media screen and (max-width: 767px) {
  .l-footer__top {
    display: none;
  }
}

.l-footer__topInner {
  max-width: 1260px;
  margin-right: auto;
  margin-left: auto;
  padding-top: 64px;
  padding-bottom: 56px;
}

.l-footer__topGrid {
  display: grid;
  grid-template-columns: 21.9841269841% 16.5079365079% 16.5079365079% 16.5079365079%;
  grid-template-areas: "first second forth sixth seventh" "first second . . ." "first third fifth . .";
  column-gap: 12px;
}

.l-footer__topLink {
  position: relative;
  font-size: 14px;
  font-size: 0.875rem;
  color: #ffffff;
  line-height: 1.2;
}
@media (hover: hover) {
  .l-footer__topLink:where(:any-link, :enabled, summary):hover {
    text-decoration: underline;
    text-decoration-color: #ffffff;
  }
}

.l-footer__topList:nth-child(1) {
  grid-area: first;
}
.l-footer__topList:nth-child(1) .l-footer__topLink {
  font-size: 16px;
  font-size: 1rem;
}
.l-footer__topList:nth-child(2) {
  grid-area: second;
}
.l-footer__topList:nth-child(3) {
  grid-area: third;
  margin-top: 24px;
}
.l-footer__topList:nth-child(4) {
  grid-area: forth;
}
.l-footer__topList:nth-child(5) {
  grid-area: fifth;
  margin-top: 24px;
}
.l-footer__topList:nth-child(6) {
  grid-area: sixth;
}
.l-footer__topList:nth-child(7) {
  grid-area: seventh;
}

.l-footer__topItem {
  line-height: 1.2;
}

.l-footer__topSecondList {
  margin-top: 24px;
}

.l-footer__topSecondItem {
  line-height: 1;
}
.l-footer__topSecondItem:not(:first-child) {
  margin-top: 12px;
}

.l-footer__topSecondLink {
  display: inline-block;
  font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 12px;
  font-size: 0.75rem;
  color: #ffffff;
}
@media (hover: hover) {
  .l-footer__topSecondLink:where(:any-link, :enabled, summary):hover {
    text-decoration: underline;
    text-decoration-color: #ffffff;
  }
}

.l-footer__middle {
  padding-top: 25px;
  padding-right: 20px;
  padding-bottom: 25px;
  padding-left: 20px;
  background-color: #e6e6e6;
}
@media screen and (max-width: 767px) {
  .l-footer__middle {
    padding-top: 0;
    padding-right: 0;
    padding-bottom: 0;
    padding-left: 0;
    background-color: initial;
    width: 100vw;
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
  }
}

.l-footer__middleInner {
  max-width: 1260px;
  margin-right: auto;
  margin-left: auto;
}

.l-footer__middleList {
  display: flex;
}
@media screen and (max-width: 767px) {
  .l-footer__middleList {
    flex-direction: column;
  }
}

.l-footer__middleLink {
  display: inline-block;
  padding-right: 6px;
  padding-left: 6px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .l-footer__middleLink {
    padding-top: 15px;
    padding-right: 35px;
    padding-bottom: 15px;
    padding-left: 11px;
    background-color: #f2f2f2;
    width: 100%;
    line-height: 1.1;
  }
}
.l-footer__middleLink::before, .l-footer__middleLink::after {
  content: "";
  position: absolute;
}
.l-footer__middleLink::before {
  left: 0;
  top: 60%;
  transform: translateY(-50%);
  width: 1px;
  height: 14px;
  background-color: #737373;
}
@media screen and (max-width: 767px) {
  .l-footer__middleLink::before {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .l-footer__middleLink::after {
    margin-top: -0.3em;
    border-top: 1px solid #e50000;
    border-right: 1px solid #e50000;
    width: 7.2px;
    height: 7.2px;
    position: absolute;
    top: 50%;
    right: 14.4px;
    transform: rotate(45deg);
  }
}
@media (hover: hover) {
  .l-footer__middleLink:where(:any-link, :enabled, summary):hover .l-footer__middleText::before {
    opacity: 1;
  }
}

@media screen and (max-width: 767px) {
  .l-footer__middleItem {
    border-bottom: 1px solid #d9d9d9;
  }
}

.l-footer__middleText {
  font-size: 12px;
  font-size: 0.75rem;
  color: #333;
}
.l-footer__middleText::before {
  content: "";
  position: absolute;
  bottom: 3px;
  left: 50%;
  transform: translateX(-50%);
  background-color: #737373;
  width: calc(100% - 12px);
  height: 1px;
  opacity: 0;
}
@media screen and (max-width: 767px) {
  .l-footer__middleText::before {
    display: none;
  }
}

.l-footer__bottom {
  padding-top: 30px;
  padding-right: 20px;
  padding-bottom: 30px;
  padding-left: 20px;
}
@media screen and (max-width: 767px) {
  .l-footer__bottom {
    padding-top: 0;
    padding-right: 0;
    padding-bottom: 0;
    padding-left: 0;
  }
}

.l-footer__bottomInner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  column-gap: 12px;
  max-width: 1260px;
  margin-right: auto;
  margin-left: auto;
}
@media screen and (max-width: 767px) {
  .l-footer__bottomInner {
    flex-direction: column;
    row-gap: 30px;
    align-items: initial;
    margin-top: 48px;
  }
}

.l-footer__bottomText {
  font-size: 12px;
  font-size: 0.75rem;
  color: #333;
}
@media screen and (max-width: 767px) {
  .l-footer__bottomText {
    font-size: 10px;
    font-size: 0.625rem;
  }
}

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

/**
 * l-block（共通セクション）
 * ---------------------------------------- */
.l-block {
  padding-top: 120px;
  padding-right: 20px;
  padding-bottom: 120px;
  padding-left: 20px;
}
@media screen and (max-width: 767px) {
  .l-block {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}
.l-block.-overflow-hidden {
  overflow: hidden;
}
.l-block.-bg-blue {
  background-color: #0064b8;
}
.l-block.-reason {
  position: relative;
  padding-right: 0;
}
@media screen and (max-width: 767px) {
  .l-block.-reason {
    padding-right: 10px;
    padding-bottom: 84px;
    padding-left: 10px;
  }
}
.l-block.-reason::before {
  content: "";
  position: absolute;
  top: 670px;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom, rgb(241, 243, 245) 0%, rgb(241, 243, 245) 100%);
  z-index: 0;
  pointer-events: none;
}
@media screen and (max-width: 767px) {
  .l-block.-reason::before {
    top: 12.2%;
  }
}
.l-block.-reason .l-block__inner {
  position: relative;
  max-width: 1700px;
  z-index: 1;
}
.l-block.-use {
  padding-top: 0;
  padding-bottom: 0;
}
@media screen and (max-width: 767px) {
  .l-block.-use {
    padding-right: 11px;
    padding-left: 11px;
  }
}
.l-block.-use .l-block__inner {
  max-width: 1760px;
  padding-top: clamp(20px, min(calc(20px + (120 - 20) * (100vw - 768px) / (1920 - 768)), calc(20px + (120 - 20) * (100vh - 680px) / (1080 - 680))), 120px);
  padding-bottom: clamp(20px, min(calc(20px + (120 - 20) * (100vw - 768px) / (1920 - 768)), calc(20px + (120 - 20) * (100vh - 680px) / (1080 - 680))), 120px);
}
@media screen and (max-width: 767px) {
  .l-block.-use .l-block__inner {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}

.l-block__inner {
  max-width: 1200px;
  margin-right: auto;
  margin-left: auto;
}

/**
 * p-grid（グリッドレイアウト）
 * ---------------------------------------- */
.p-grid {
  display: grid;
}
.p-grid.-col-4-2 {
  grid-template-columns: repeat(4, 1fr);
}
@media screen and (max-width: 767px) {
  .p-grid.-col-4-2 {
    grid-template-columns: repeat(2, 1fr);
  }
}
.p-grid.-col-3-1 {
  grid-template-columns: repeat(3, 1fr);
}
@media screen and (max-width: 767px) {
  .p-grid.-col-3-1 {
    grid-template-columns: repeat(1, 1fr);
  }
}
.p-grid.-col-3-2 {
  grid-template-columns: repeat(3, 1fr);
}
@media screen and (max-width: 767px) {
  .p-grid.-col-3-2 {
    grid-template-columns: repeat(2, 1fr);
  }
}
.p-grid.-col-2-2 {
  grid-template-columns: repeat(2, 1fr);
}
.p-grid.-col-2-1 {
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (max-width: 767px) {
  .p-grid.-col-2-1 {
    grid-template-columns: 1fr;
  }
}
.p-grid.-justify-items-center {
  justify-items: center;
}
.p-grid.-gap-x-8-8 {
  row-gap: 8px;
}
@media screen and (max-width: 767px) {
  .p-grid.-gap-x-8-8 {
    row-gap: 8px;
  }
}
.p-grid.-gap-x-8-0 {
  row-gap: 8px;
}
@media screen and (max-width: 767px) {
  .p-grid.-gap-x-8-0 {
    row-gap: 0;
  }
}
@media screen and (max-width: 767px) {
  .p-grid.-gap-x-0-24 {
    row-gap: 24px;
  }
}
.p-grid.-gap-y-60-0 {
  column-gap: 60px;
}
.p-grid.-gap-y-39-39 {
  column-gap: 39px;
}
@media screen and (max-width: 767px) {
  .p-grid.-about {
    max-width: 400px;
    margin-right: auto;
    margin-left: auto;
  }
}
.p-grid.-about .p-grid__item {
  display: grid;
  justify-items: center;
  row-gap: 16px;
}
@media screen and (max-width: 767px) {
  .p-grid.-about .p-grid__item {
    row-gap: 8px;
  }
}

/**
 * p-flex（フレックスレイアウト）
 * ---------------------------------------- */
.p-flex {
  display: flex;
}
.p-flex.-justify-center {
  justify-content: center;
}
.p-flex.-justify-end {
  justify-content: flex-end;
}
.p-flex.-items-center {
  align-items: center;
}
.p-flex.-gap-y-71-30 {
  column-gap: 71px;
}
@media screen and (max-width: 767px) {
  .p-flex.-gap-y-71-30 {
    column-gap: 30px;
  }
}

/**
 * p-top（トップ）
 * ---------------------------------------- */
.p-top__bg {
  position: relative;
  background-image: url("/FBESS-LA261A/img/bg_top_mv_pc_01.webp");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  width: 100%;
  height: 600px;
}
@media screen and (max-width: 767px) {
  .p-top__bg {
    background-image: url("/FBESS-LA261A/img/bg_top_mv_sp_01.webp");
    background-position: center bottom;
    height: 380px;
  }
}

.p-top__inner {
  max-width: 1200px;
  margin-right: auto;
  margin-left: auto;
  padding-right: 20px;
  padding-left: 20px;
  height: 100%;
  left: 50%;
  max-width: 1200px;
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  width: 100%;
}

.p-top__box {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
  .p-top__box {
    left: 20px;
  }
}

.p-top__title {
  font-size: clamp(24px, 24px + (32 - 24) * (100vw - 768px) / (1920 - 768), 32px);
  font-weight: 700;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .p-top__title {
    font-size: 18px;
    font-size: 1.125rem;
    text-align: left;
  }
}

.p-top__wrapper {
  padding-right: clamp(32px, 32px + (80 - 32) * (100vw - 768px) / (1920 - 768), 80px);
  padding-bottom: clamp(64px, 64px + (112 - 64) * (100vw - 768px) / (1920 - 768), 112px);
  background-color: #f1f3f5;
}
@media screen and (max-width: 767px) {
  .p-top__wrapper {
    padding-right: 20px;
    padding-bottom: 80px;
  }
}

.p-top__image {
  display: block;
  margin-top: 32px;
  padding-right: 18px;
  padding-left: 18px;
}
@media screen and (max-width: 767px) {
  .p-top__image {
    padding-right: 0;
    padding-left: 0;
  }
}

.p-top__image img {
  width: clamp(443px, 443px + (540 - 443) * (100vw - 768px) / (1920 - 768), 540px);
  height: auto;
}
@media screen and (max-width: 767px) {
  .p-top__image img {
    width: max-content;
  }
}

/**
 * p-about
 * ---------------------------------------- */
.p-about {
  position: relative;
  margin-top: -80px;
}
@media screen and (max-width: 767px) {
  .p-about {
    margin-top: -40px;
  }
}
.p-about::before, .p-about::after {
  content: "";
  position: absolute;
  width: 16px;
  height: 16px;
  z-index: 3;
}
@media screen and (max-width: 767px) {
  .p-about::before, .p-about::after {
    width: 8px;
    height: 8px;
  }
}
.p-about::before {
  top: -8px;
  right: -8px;
  background-color: #c0c0c0;
}
@media screen and (max-width: 767px) {
  .p-about::before {
    top: -4px;
    right: -4px;
  }
}
.p-about::after {
  bottom: -8px;
  right: -8px;
  background-color: #7d7d7d;
}
@media screen and (max-width: 767px) {
  .p-about::after {
    bottom: -4px;
    right: -4px;
  }
}

.p-about__bg {
  position: relative;
}
.p-about__bg::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  z-index: 1;
}

.p-about__row {
  position: relative;
  display: flex;
  align-items: flex-end;
  column-gap: clamp(40px, 40px + (87 - 40) * (100vw - 768px) / (1920 - 768), 87px);
  max-width: 1213px;
  margin-right: auto;
  margin-left: auto;
  padding-top: clamp(40px, 40px + (80 - 40) * (100vw - 768px) / (1920 - 768), 80px);
  padding-right: 20px;
  padding-bottom: 25px;
  padding-left: 20px;
  z-index: 2;
}
@media screen and (max-width: 767px) {
  .p-about__row {
    flex-direction: column-reverse;
    align-items: center;
    padding-right: 24px;
    padding-bottom: 44px;
  }
}

.p-about__content {
  width: 59.0792838875%;
  padding-bottom: 55px;
}
@media screen and (max-width: 767px) {
  .p-about__content {
    width: 100%;
    margin-top: 32px;
    padding-bottom: 0;
  }
}

.p-about__image {
  position: relative;
  top: -80px;
  display: block;
  width: 33.5038363171%;
  margin-top: -80px;
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .p-about__image {
    width: max-content;
    top: initial;
    margin-top: -74px;
  }
}

.p-about__image img {
  max-width: 100%;
  height: auto;
}

/**
 * p-cta
 * ---------------------------------------- */
.p-cta {
  padding-top: 60px;
  padding-right: 20px;
  padding-bottom: 60px;
  padding-left: 20px;
  background: linear-gradient(to right, rgb(0, 0, 128) 0%, rgb(7, 65, 173) 25%, rgb(17, 160, 170) 50%, rgb(7, 65, 173) 75%, rgb(0, 0, 128) 100%);
  background-size: 400% auto;
  animation: bgGradationAnimation 8s linear infinite alternate;
}
@media screen and (max-width: 767px) {
  .p-cta {
    padding-top: 40px;
    padding-bottom: 60px;
  }
}

@keyframes bgGradationAnimation {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 100% 50%;
  }
}
.p-cta__inner {
  max-width: 1140px;
  margin-right: auto;
  margin-left: auto;
}

.p-cta__row {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: clamp(40px, 40px + (80 - 40) * (100vw - 768px) / (1920 - 768), 80px);
}
@media screen and (max-width: 767px) {
  .p-cta__row {
    grid-template-columns: 1fr;
    row-gap: 40px;
  }
}
.p-cta__row::before {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.3);
}
@media screen and (max-width: 767px) {
  .p-cta__row::before {
    display: none;
  }
}

.p-cta__content {
  display: flex;
  align-items: center;
  column-gap: clamp(24px, 24px + (40 - 24) * (100vw - 768px) / (1920 - 768), 40px);
}
@media screen and (max-width: 767px) {
  .p-cta__content {
    flex-direction: column;
    align-items: center;
  }
}

.p-cta__box {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.p-cta__box .c-text:nth-of-type(2) {
  flex: 1;
}

.p-cta__image {
  position: relative;
  display: inline-block;
  padding-top: clamp(24px, 24px + (40 - 24) * (100vw - 768px) / (1920 - 768), 40px);
  padding-right: clamp(24px, 24px + (40 - 24) * (100vw - 768px) / (1920 - 768), 40px);
  padding-bottom: clamp(24px, 24px + (40 - 24) * (100vw - 768px) / (1920 - 768), 40px);
  padding-left: clamp(24px, 24px + (40 - 24) * (100vw - 768px) / (1920 - 768), 40px);
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .p-cta__image {
    padding-top: 24px;
    padding-right: 32px;
    padding-bottom: 24px;
    padding-left: 32px;
  }
}
.p-cta__image::before, .p-cta__image::after {
  content: "";
  position: absolute;
  background-size: contain;
  background-repeat: no-repeat;
  width: 64px;
  height: 89px;
}
@media screen and (max-width: 767px) {
  .p-cta__image::before, .p-cta__image::after {
    width: 50px;
    height: 70px;
  }
}
.p-cta__image::before {
  top: 0;
  right: 0;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2264%22%20height%3D%2289%22%20viewBox%3D%220%200%2064%2089%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M54.9%200H0V8.63333H54.9L63.5333%200H54.9Z%22%20fill%3D%22%23000080%22%2F%3E%3Cpath%20opacity%3D%220.3%22%20d%3D%22M63.5337%208.63333V89H54.9004V8.63333L63.5337%200V8.63333Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E");
}
@media screen and (max-width: 767px) {
  .p-cta__image::before {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2250%22%20height%3D%2270%22%20viewBox%3D%220%200%2050%2070%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M43.1798%200H0V6.79026H43.1798L49.97%200H43.1798Z%22%20fill%3D%22%23000080%22%2F%3E%3Cpath%20opacity%3D%220.3%22%20d%3D%22M49.97%206.79026V70H43.1797V6.79026L49.97%200V6.79026Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E");
  }
}
.p-cta__image::after {
  bottom: 0;
  left: 0;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2264%22%20height%3D%2289%22%20viewBox%3D%220%200%2064%2089%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M8.63373%2089H63.5337V80.3667H8.63373L0.000400543%2089H8.63373Z%22%20fill%3D%22%23000080%22%2F%3E%3Cpath%20opacity%3D%220.3%22%20d%3D%22M9.53674e-07%2080.3667V0H8.63334V80.3667L9.53674e-07%2089V80.3667Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E");
}
@media screen and (max-width: 767px) {
  .p-cta__image::after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2250%22%20height%3D%2270%22%20viewBox%3D%220%200%2050%2070%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M6.79093%2070H49.9707V63.2097H6.79093L0.000671387%2070H6.79093Z%22%20fill%3D%22%23000080%22%2F%3E%3Cpath%20opacity%3D%220.3%22%20d%3D%22M0.000752926%2063.2097V0H6.79102V63.2097L0.000752926%2070V63.2097Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E");
  }
}

.p-cta__image img {
  width: clamp(64px, 64px + (80 - 64) * (100vw - 768px) / (1920 - 768), 80px);
  height: clamp(64px, 64px + (80 - 64) * (100vw - 768px) / (1920 - 768), 80px);
}

/**
 * p-reason
 * ---------------------------------------- */
.p-reason {
  display: flex;
  width: max-content;
  will-change: transform;
  column-gap: clamp(32px, 32px + (80 - 32) * (100vw - 768px) / (1920 - 768), 80px);
}
@media screen and (max-width: 767px) {
  .p-reason {
    flex-direction: column;
    width: 100%;
    row-gap: 94px;
    margin-top: 94px;
    padding-bottom: 80px;
  }
}

.p-reason__item {
  position: relative;
  display: flex;
  flex-direction: column;
  max-width: clamp(600px, min(calc(600px + (1150 - 600) * (100vw - 768px) / (1920 - 768)), calc(600px + (1150 - 600) * (100vh - 680px) / (1080 - 680))), 1150px);
}
@media print, screen and (max-width: 1440px) {
  .p-reason__item {
    flex: 0 0 50vw;
    width: 50vw;
  }
}
@media screen and (max-width: 767px) {
  .p-reason__item {
    flex: initial;
    width: 100%;
    max-width: 100%;
  }
}
.p-reason__item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: clamp(130px, min(calc(130px + (240 - 130) * (100vw - 768px) / (1920 - 768)), calc(130px + (240 - 130) * (100vh - 680px) / (1080 - 680))), 240px);
  height: clamp(130px, min(calc(130px + (240 - 130) * (100vw - 768px) / (1920 - 768)), calc(130px + (240 - 130) * (100vh - 680px) / (1080 - 680))), 240px);
  background-repeat: no-repeat;
  background-size: contain;
}
@media screen and (max-width: 767px) {
  .p-reason__item::before {
    width: 120px;
    height: 120px;
    top: -54px;
    left: -20px;
  }
}
.p-reason__item:nth-child(1)::before {
  background-image: url("/FBESS-LA261A/img/icon_reason_space_01.svg");
}
.p-reason__item:nth-child(2)::before {
  background-image: url("/FBESS-LA261A/img/icon_reason_speed_01.svg");
}
.p-reason__item:nth-child(3)::before {
  background-image: url("/FBESS-LA261A/img/icon_reason_cost_01.svg");
}
.p-reason__item:nth-child(4) {
  margin-right: calc(50vw - 160px);
}
@media print, screen and (max-width: 1440px) {
  .p-reason__item:nth-child(4) {
    margin-right: 40vw;
  }
}
@media screen and (max-width: 767px) {
  .p-reason__item:nth-child(4) {
    margin-right: initial;
  }
}
.p-reason__item:nth-child(4)::before {
  background-image: url("/FBESS-LA261A/img/icon_reason_safety_01.svg");
}

.p-reason__image img {
  display: block;
  max-height: clamp(240px, min(calc(240px + (600 - 240) * (100vw - 768px) / (1920 - 768)), calc(240px + (600 - 240) * (100vh - 680px) / (1080 - 680))), 600px);
  max-width: 100%;
  height: auto;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .p-reason__image img {
    width: max-content;
    max-height: initial;
  }
}

.p-reason__content {
  display: flex;
  align-items: center;
  background-color: #0064b8;
  column-gap: clamp(24px, min(calc(24px + (60 - 24) * (100vw - 768px) / (1920 - 768)), calc(24px + (60 - 24) * (100vh - 680px) / (1080 - 680))), 60px);
  padding-top: clamp(20px, min(calc(20px + (40 - 20) * (100vw - 768px) / (1920 - 768)), calc(20px + (40 - 20) * (100vh - 680px) / (1080 - 680))), 40px);
  padding-right: clamp(20px, min(calc(20px + (60 - 20) * (100vw - 768px) / (1920 - 768)), calc(20px + (60 - 20) * (100vh - 680px) / (1080 - 680))), 60px);
  padding-bottom: clamp(20px, min(calc(20px + (40 - 20) * (100vw - 768px) / (1920 - 768)), calc(20px + (40 - 20) * (100vh - 680px) / (1080 - 680))), 40px);
  padding-left: clamp(20px, min(calc(20px + (60 - 20) * (100vw - 768px) / (1920 - 768)), calc(20px + (60 - 20) * (100vh - 680px) / (1080 - 680))), 60px);
  flex: 1;
}
@media screen and (max-width: 767px) {
  .p-reason__content {
    flex-direction: column;
    row-gap: 16px;
    padding-top: 32px;
    padding-right: 24px;
    padding-bottom: 32px;
    padding-left: 24px;
  }
}
.p-reason__content .c-heading {
  width: auto;
}
@media print, screen and (max-width: 1440px) {
  .p-reason__content .c-heading {
    width: 30%;
  }
}
@media screen and (max-width: 767px) {
  .p-reason__content .c-heading {
    width: 100%;
  }
}
.p-reason__content .c-heading.-level3 .c-heading__text {
  font-size: clamp(24px, min(calc(24px + (32 - 24) * (100vw - 768px) / (1920 - 768)), calc(24px + (32 - 24) * (100vh - 680px) / (1080 - 680))), 32px);
}
.p-reason__content .c-text {
  flex: 1;
  font-size: clamp(17px, min(calc(17px + (18 - 17) * (100vw - 768px) / (1920 - 768)), calc(17px + (18 - 17) * (100vh - 680px) / (1080 - 680))), 18px);
}
@media screen and (max-width: 767px) {
  .p-reason__content .c-text {
    width: 100%;
    font-size: 16px;
    font-size: 1rem;
  }
}

.p-reason__frame {
  display: flex;
  flex-direction: column;
  position: relative;
  max-width: 1065px;
  padding-top: 42px;
  padding-right: 42px;
  padding-bottom: 42px;
  padding-left: 42px;
  box-sizing: content-box;
  flex: 1;
}
@media screen and (max-width: 767px) {
  .p-reason__frame {
    padding-top: 16px;
    padding-right: 16px;
    padding-bottom: 16px;
    padding-left: 16px;
  }
}
.p-reason__frame::before, .p-reason__frame::after {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  width: 128px;
  height: 179px;
}
@media screen and (max-width: 767px) {
  .p-reason__frame::before, .p-reason__frame::after {
    width: 65px;
    height: 90px;
  }
}
.p-reason__frame::before {
  top: 0;
  right: 0;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%22128%22%20height%3D%22179%22%20viewBox%3D%220%200%20128%20179%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M109.877%200H0V17.2787H109.877L127.155%200H109.877Z%22%20fill%3D%22%237D7D7D%22%2F%3E%3Cpath%20d%3D%22M127.156%2017.2787V178.124H109.877V17.2787L127.156%200V17.2787Z%22%20fill%3D%22%23B4B4B5%22%2F%3E%3C%2Fsvg%3E");
}
@media screen and (max-width: 767px) {
  .p-reason__frame::before {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2265%22%20height%3D%2290%22%20viewBox%3D%220%200%2065%2090%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M55.5168%200H0V8.73034H55.5168L64.2472%200H55.5168Z%22%20fill%3D%22%237D7D7D%22%2F%3E%3Cpath%20d%3D%22M64.2469%208.73034V90H55.5166V8.73034L64.2469%200V8.73034Z%22%20fill%3D%22%23B4B4B5%22%2F%3E%3C%2Fsvg%3E");
  }
}
.p-reason__frame::after {
  bottom: 0;
  left: 0;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%22128%22%20height%3D%22179%22%20viewBox%3D%220%200%20128%20179%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M17.2791%20178.124H127.156V160.846H17.2791L0.000389099%20178.124H17.2791Z%22%20fill%3D%22%237D7D7D%22%2F%3E%3Cpath%20d%3D%22M8.39233e-05%20160.846V0H17.2788V160.846L8.39233e-05%20178.124V160.846Z%22%20fill%3D%22%23B4B4B5%22%2F%3E%3C%2Fsvg%3E");
}
@media screen and (max-width: 767px) {
  .p-reason__frame::after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2265%22%20height%3D%2290%22%20viewBox%3D%220%200%2065%2090%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M8.73107%2090H64.2479V81.2697H8.73107L0.000734193%2090H8.73107Z%22%20fill%3D%22%237D7D7D%22%2F%3E%3Cpath%20d%3D%22M0.000977631%2081.2697V-2.11362e-07H8.73132V81.2697L0.000977631%2090V81.2697Z%22%20fill%3D%22%23B4B4B5%22%2F%3E%3C%2Fsvg%3E");
  }
}

/**
 * p-basic
 * ---------------------------------------- */
.p-basic__inner {
  max-width: 1200px;
  margin-right: auto;
  margin-left: auto;
  padding-top: clamp(32px, min(calc(32px + (122 - 32) * (100vw - 768px) / (1920 - 768)), calc(32px + (122 - 32) * (100vh - 680px) / (1080 - 680))), 122px);
}
@media screen and (max-width: 767px) {
  .p-basic__inner {
    padding-top: 0;
  }
}

.p-basic__frame01 {
  position: relative;
}
.p-basic__frame01::before, .p-basic__frame01::after {
  content: "";
  position: absolute;
  width: 16px;
  height: 16px;
  z-index: 1;
}
@media screen and (max-width: 767px) {
  .p-basic__frame01::before, .p-basic__frame01::after {
    width: 8px;
    height: 8px;
  }
}
.p-basic__frame01::before {
  top: -8px;
  left: -8px;
  background-color: #c0c0c0;
}
@media screen and (max-width: 767px) {
  .p-basic__frame01::before {
    top: -4px;
    left: -4px;
  }
}
.p-basic__frame01::after {
  top: -8px;
  right: -8px;
  background-color: #7d7d7d;
}
@media screen and (max-width: 767px) {
  .p-basic__frame01::after {
    top: -4px;
    right: -4px;
  }
}

.p-basic__frame02 {
  position: relative;
}
.p-basic__frame02::before, .p-basic__frame02::after {
  content: "";
  position: absolute;
  width: 16px;
  height: 16px;
  z-index: 1;
}
@media screen and (max-width: 767px) {
  .p-basic__frame02::before, .p-basic__frame02::after {
    width: 8px;
    height: 8px;
  }
}
.p-basic__frame02::before {
  bottom: -8px;
  left: -8px;
  background-color: #7d7d7d;
}
@media screen and (max-width: 767px) {
  .p-basic__frame02::before {
    bottom: -4px;
    left: -4px;
  }
}
.p-basic__frame02::after {
  bottom: -8px;
  right: -8px;
  background-color: #c0c0c0;
}
@media screen and (max-width: 767px) {
  .p-basic__frame02::after {
    bottom: -4px;
    right: -4px;
  }
}

.p-basic__content {
  position: relative;
  background-color: #ffffff;
  padding-top: clamp(16px, 16px + (59 - 16) * (100vw - 768px) / (1920 - 768), 59px);
  padding-right: clamp(16px, 16px + (56 - 16) * (100vw - 768px) / (1920 - 768), 56px);
  padding-bottom: clamp(16px, 16px + (59 - 16) * (100vw - 768px) / (1920 - 768), 59px);
  padding-left: clamp(16px, 16px + (56 - 16) * (100vw - 768px) / (1920 - 768), 56px);
  border: 1px solid #c0c0c0;
}
@media screen and (max-width: 767px) {
  .p-basic__content {
    padding-top: 39px;
    padding-right: 23px;
    padding-bottom: 39px;
    padding-left: 23px;
  }
}

.p-basic__grid {
  display: grid;
  grid-template-columns: 46.2962962963% 50%;
  grid-template-areas: "image table" "image thumbnail";
  column-gap: clamp(16px, 16px + (40 - 16) * (100vw - 768px) / (1920 - 768), 40px);
  row-gap: 47px;
  margin-top: 60px;
}
@media screen and (max-width: 767px) {
  .p-basic__grid {
    margin-top: 32px;
    grid-template-columns: 1fr;
    grid-template-areas: "image" "thumbnail" "table";
    row-gap: 0;
  }
}

.p-basic__image {
  grid-area: image;
  display: inline-block;
  border: 1px solid #f1f3f5;
}

.p-basic__image img {
  max-width: 100%;
  height: auto;
}
@media screen and (max-width: 767px) {
  .p-basic__image img {
    width: 100%;
  }
}

.p-basic__box {
  display: grid;
  grid-area: table;
}
@media screen and (max-width: 767px) {
  .p-basic__box {
    margin-top: 32px;
  }
}

.p-basic__dl {
  display: grid;
  grid-template-columns: 80px 1fr;
  column-gap: clamp(16px, 16px + (60 - 16) * (100vw - 768px) / (1920 - 768), 60px);
  padding-top: 12px;
  padding-right: 24px;
  padding-bottom: 12px;
  padding-left: 24px;
  background-color: rgba(115, 127, 153, 0.1);
}
@media screen and (max-width: 767px) {
  .p-basic__dl {
    padding-right: 28px;
    padding-left: 16px;
    column-gap: 40px;
  }
}
.p-basic__dl:not(:first-child) {
  border-top: 2px solid #fff;
}

.p-basic__dt {
  color: #737f99;
  font-weight: 700;
  line-height: 1;
}

.p-basic__dd {
  line-height: 1;
}

.p-basic__list {
  grid-area: thumbnail;
  display: flex;
  column-gap: 24px;
}
@media screen and (max-width: 767px) {
  .p-basic__list {
    justify-content: center;
    margin-top: 16px;
    column-gap: 13px;
  }
}

.p-basic__image {
  display: none;
}

.p-basic__item {
  position: relative;
  cursor: pointer;
}
.p-basic__item::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  border: 1px solid #f1f3f5;
  width: 100%;
  height: 100%;
}
.p-basic__item.is-active::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 100, 184, 0.3);
}
.p-basic__item.is-active::after {
  border: 4px solid #0064b8;
}
@media screen and (max-width: 767px) {
  .p-basic__item.is-active::after {
    border: 3px solid #0064b8;
  }
}

.p-basic__item img {
  max-width: 100%;
  height: auto;
}

/**
 * p-link（リンク）
 * ---------------------------------------- */
.p-link {
  display: inline-flex;
  align-items: center;
  column-gap: 16px;
}
@media (hover: hover) {
  .p-link:where(:any-link, :enabled, summary):hover .p-link__text::before {
    opacity: 1;
  }
  .p-link:where(:any-link, :enabled, summary):hover .c-arrow::before {
    background-position: left center;
  }
}

.p-link__text {
  position: relative;
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: 700;
  color: #0d2ea0;
}
.p-link__text::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  background-color: #0d2ea0;
  bottom: 0;
  left: 0;
  opacity: 0;
  transition: opacity 0.3s ease-out;
}

/**
 * p-spec（定格仕様）
 * ---------------------------------------- */
.p-spec:last-child .p-spec__dl:last-child {
  border-bottom: 1px solid #c0c0c0;
}

.p-spec__title {
  padding-top: 11px;
  padding-bottom: 11px;
  background-color: #737f99;
  text-align: center;
}

.p-spec__titleText {
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1;
  color: #ffffff;
}
@media screen and (max-width: 767px) {
  .p-spec__titleText {
    font-size: 18px;
    font-size: 1.125rem;
  }
}

.p-spec__dl {
  display: grid;
  align-items: center;
  grid-template-columns: 156px 1fr;
  column-gap: clamp(32px, 32px + (60 - 32) * (100vw - 768px) / (1920 - 768), 60px);
  padding-top: 18px;
  padding-right: clamp(24px, 24px + (40 - 24) * (100vw - 768px) / (1920 - 768), 40px);
  padding-bottom: 18px;
  padding-left: clamp(24px, 24px + (40 - 24) * (100vw - 768px) / (1920 - 768), 40px);
}
@media screen and (max-width: 767px) {
  .p-spec__dl {
    grid-template-columns: 150px 1fr;
    column-gap: 16px;
    padding-top: 16px;
    padding-right: 0;
    padding-bottom: 16px;
    padding-left: 0;
  }
}
.p-spec__dl:not(:first-child) {
  border-top: 1px solid #c0c0c0;
}

.p-spec__dt {
  color: #737f99;
}

.p-spec__sup {
  position: relative;
  top: -2px;
}

/**
 * p-use（主な用途）
 * ---------------------------------------- */
.p-use {
  display: grid;
  grid-template-columns: 33.125% 63.9772727273%;
  grid-template-areas: "heading slide" "timeline slide" "img slide";
  column-gap: clamp(16px, 16px + (50 - 16) * (100vw - 768px) / (1920 - 768), 50px);
  align-items: center;
}
@media screen and (max-width: 767px) {
  .p-use {
    grid-template-columns: 80px 1fr;
    grid-template-areas: "heading heading" "img timeline" "slide slide";
    column-gap: 8px;
  }
}
.p-use .c-heading {
  grid-area: heading;
}

.p-use__box {
  grid-area: timeline;
  margin-top: clamp(24px, min(calc(24px + (73 - 24) * (100vw - 768px) / (1920 - 768)), calc(24px + (73 - 24) * (100vh - 680px) / (1080 - 680))), 73px);
}
@media screen and (max-width: 767px) {
  .p-use__box {
    margin-top: 0;
  }
}

.p-use__list {
  position: relative;
  display: flex;
  flex-direction: column;
}
.p-use__list::before {
  content: "";
  position: absolute;
  left: 7px;
  top: 16px;
  width: 2px;
  height: calc(100% - 32px);
  background-color: #66a2d4;
}
@media screen and (max-width: 767px) {
  .p-use__list::before {
    left: 4px;
  }
}

.p-use__item {
  position: relative;
  display: inline-flex;
  align-items: center;
  column-gap: 16px;
  font-family: "Zen Old Mincho", serif;
  font-size: clamp(20px, 20px + (24 - 20) * (100vw - 768px) / (1920 - 768), 24px);
  font-weight: 700;
  color: #66a2d4;
  transition: opacity 0.3s ease-out;
}
@media screen and (max-width: 767px) {
  .p-use__item {
    font-size: 16px;
    font-size: 1rem;
    column-gap: 8px;
  }
}
.p-use__item:not(:last-child) {
  padding-bottom: 24px;
}
@media screen and (max-width: 767px) {
  .p-use__item:not(:last-child) {
    padding-bottom: 11px;
  }
}
.p-use__item::before {
  content: "";
  display: inline-block;
  background-color: #66a2d4;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  transition: opacity 0.3s ease-out;
  flex-shrink: 0;
}
@media screen and (max-width: 767px) {
  .p-use__item::before {
    width: 10px;
    height: 10px;
  }
}
.p-use__item.is-current {
  opacity: 1;
  color: #ffffff;
}
.p-use__item.is-current::before {
  opacity: 1;
  background-color: #fff;
}

.p-use__battery {
  margin-top: clamp(40px, 40px + (60 - 40) * (100vw - 768px) / (1920 - 768), 60px);
}
@media screen and (max-width: 767px) {
  .p-use__battery {
    margin-top: 0;
  }
}

.p-use__battery img {
  width: clamp(150px, min(calc(150px + (300 - 150) * (100vw - 768px) / (1920 - 768)), calc(150px + (300 - 150) * (100vh - 680px) / (1080 - 680))), 300px);
  height: clamp(150px, min(calc(150px + (300 - 150) * (100vw - 768px) / (1920 - 768)), calc(150px + (300 - 150) * (100vh - 680px) / (1080 - 680))), 300px);
}
@media screen and (max-width: 767px) {
  .p-use__battery img {
    width: 80px;
    height: 80px;
  }
}

.p-use__batteryItem img {
  max-width: 100%;
  height: auto;
}

.p-use__image {
  grid-area: img;
  margin-top: 60px;
}
@media screen and (max-width: 767px) {
  .p-use__image {
    margin-top: 0;
  }
}

.p-use__image img {
  max-width: 100%;
  height: auto;
}

.p-use__wrap {
  position: relative;
  grid-area: slide;
  padding-top: clamp(28px, min(calc(28px + (39 - 28) * (100vw - 768px) / (1920 - 768)), calc(28px + (39 - 28) * (100vh - 680px) / (1080 - 680))), 39px);
  padding-right: clamp(20px, min(calc(20px + (43 - 20) * (100vw - 768px) / (1920 - 768)), calc(20px + (43 - 20) * (100vh - 680px) / (1080 - 680))), 43px);
  padding-bottom: clamp(28px, min(calc(28px + (43 - 28) * (100vw - 768px) / (1920 - 768)), calc(28px + (43 - 28) * (100vh - 680px) / (1080 - 680))), 43px);
  padding-left: clamp(20px, min(calc(20px + (43 - 20) * (100vw - 768px) / (1920 - 768)), calc(20px + (43 - 20) * (100vh - 680px) / (1080 - 680))), 43px);
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .p-use__wrap {
    margin-top: 24px;
    padding-top: 16px;
    padding-right: 14px;
    padding-bottom: 16px;
    padding-left: 14px;
    max-width: 350px;
    margin-right: auto;
    margin-left: auto;
  }
}
.p-use__wrap::before, .p-use__wrap::after {
  content: "";
  position: absolute;
  width: 128px;
  height: 179px;
  background-size: contain;
  background-repeat: no-repeat;
}
@media screen and (max-width: 767px) {
  .p-use__wrap::before, .p-use__wrap::after {
    width: 65px;
    height: 90px;
  }
}
.p-use__wrap::before {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%22128%22%20height%3D%22179%22%20viewBox%3D%220%200%20128%20179%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M109.877%200H0V17.2787H109.877L127.155%200H109.877Z%22%20fill%3D%22%237D7D7D%22%2F%3E%3Cpath%20d%3D%22M127.156%2017.2787V178.124H109.877V17.2787L127.156%200V17.2787Z%22%20fill%3D%22%23B4B4B5%22%2F%3E%3C%2Fsvg%3E");
  top: 0;
  right: 0;
}
@media screen and (max-width: 767px) {
  .p-use__wrap::before {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2265%22%20height%3D%2290%22%20viewBox%3D%220%200%2065%2090%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M55.5168%200H0V8.73034H55.5168L64.2472%200H55.5168Z%22%20fill%3D%22%237D7D7D%22%2F%3E%3Cpath%20d%3D%22M64.2479%208.73034V90H55.5176V8.73034L64.2479%200V8.73034Z%22%20fill%3D%22%23B4B4B5%22%2F%3E%3C%2Fsvg%3E");
  }
}
.p-use__wrap::after {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%22128%22%20height%3D%22179%22%20viewBox%3D%220%200%20128%20179%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M17.2796%20178.124H127.156V160.846H17.2796L0.00087738%20178.124H17.2796Z%22%20fill%3D%22%237D7D7D%22%2F%3E%3Cpath%20d%3D%22M0.000572205%20160.846V0H17.2793V160.846L0.000572205%20178.124V160.846Z%22%20fill%3D%22%23B4B4B5%22%2F%3E%3C%2Fsvg%3E");
  left: 0;
  bottom: 0;
}
@media screen and (max-width: 767px) {
  .p-use__wrap::after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2265%22%20height%3D%2290%22%20viewBox%3D%220%200%2065%2090%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M8.7312%2090H64.248V81.2697H8.7312L0.000862122%2090H8.7312Z%22%20fill%3D%22%237D7D7D%22%2F%3E%3Cpath%20d%3D%22M0.000130653%2081.2697V0H8.73047V81.2697L0.000130653%2090V81.2697Z%22%20fill%3D%22%23B4B4B5%22%2F%3E%3C%2Fsvg%3E");
  }
}

.p-use__slide {
  position: relative;
  width: clamp(380px, 380px + (1040 - 380) * (100vw - 768px) / (1920 - 768), 1040px);
  height: clamp(175px, 175px + (480 - 175) * (100vw - 768px) / (1920 - 768), 480px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .p-use__slide {
    width: 320px;
    height: 217px;
  }
}

.p-use__slideItem {
  position: absolute;
}

.p-use__slideImage {
  display: block;
}

.p-use__slideImage img {
  width: clamp(380px, 380px + (1040 - 380) * (100vw - 768px) / (1920 - 768), 1040px);
  height: clamp(175px, 175px + (480 - 175) * (100vw - 768px) / (1920 - 768), 480px);
  max-width: 100%;
}
@media screen and (max-width: 767px) {
  .p-use__slideImage img {
    max-width: 100%;
    height: auto;
  }
}

/**
 * br
 * ---------------------------------------- */
.br-pc {
  display: block;
}
@media screen and (max-width: 767px) {
  .br-pc {
    display: none;
  }
}

.br-sp {
  display: none;
}
@media screen and (max-width: 767px) {
  .br-sp {
    display: block;
  }
}

/**
 * text-align
 * ---------------------------------------- */
.u-text-right {
  text-align: right;
}

.u-text-center {
  text-align: center !important;
}

@media screen and (max-width: 767px) {
  .u-sp-text-center {
    text-align: center !important;
  }
}

/**
 * margin-top
 * ---------------------------------------- */
.u-mt-100-64 {
  margin-top: 100px;
}
@media screen and (max-width: 767px) {
  .u-mt-100-64 {
    margin-top: 64px;
  }
}

.u-mt-96-56 {
  margin-top: 96px;
}
@media screen and (max-width: 767px) {
  .u-mt-96-56 {
    margin-top: 56px;
  }
}

.u-mt-60-40 {
  margin-top: 60px !important;
}
@media screen and (max-width: 767px) {
  .u-mt-60-40 {
    margin-top: 40px !important;
  }
}

.u-mt-60-32 {
  margin-top: 60px !important;
}
@media screen and (max-width: 767px) {
  .u-mt-60-32 {
    margin-top: 32px !important;
  }
}

.u-mt-48-40 {
  margin-top: 48px;
}
@media screen and (max-width: 767px) {
  .u-mt-48-40 {
    margin-top: 40px;
  }
}

.u-mt-48-36 {
  margin-top: 48px;
}
@media screen and (max-width: 767px) {
  .u-mt-48-36 {
    margin-top: 36px;
  }
}

.u-mt-48-26 {
  margin-top: 48px;
}
@media screen and (max-width: 767px) {
  .u-mt-48-26 {
    margin-top: 26px;
  }
}

.u-mt-45-23 {
  margin-top: 45px;
}
@media screen and (max-width: 767px) {
  .u-mt-45-23 {
    margin-top: 23px;
  }
}

.u-mt-43-24 {
  margin-top: 43px;
}
@media screen and (max-width: 767px) {
  .u-mt-43-24 {
    margin-top: 24px;
  }
}

.u-mt-40-40 {
  margin-top: 40px !important;
}

.u-mt-40-24 {
  margin-top: 40px;
}
@media screen and (max-width: 767px) {
  .u-mt-40-24 {
    margin-top: 24px;
  }
}

.u-mt-32-20 {
  margin-top: 32px;
}
@media screen and (max-width: 767px) {
  .u-mt-32-20 {
    margin-top: 20px;
  }
}

.u-mt-32-24 {
  margin-top: 32px;
}
@media screen and (max-width: 767px) {
  .u-mt-32-24 {
    margin-top: 24px;
  }
}

.u-mt-32-16 {
  margin-top: 32px;
}
@media screen and (max-width: 767px) {
  .u-mt-32-16 {
    margin-top: 16px;
  }
}

.u-mt-32-28 {
  margin-top: 32px;
}
@media screen and (max-width: 767px) {
  .u-mt-32-28 {
    margin-top: 28px;
  }
}

.u-mt-28-24 {
  margin-top: 28px;
}
@media screen and (max-width: 767px) {
  .u-mt-28-24 {
    margin-top: 24px;
  }
}

.u-mt-28-20 {
  margin-top: 28px;
}
@media screen and (max-width: 767px) {
  .u-mt-28-20 {
    margin-top: 20px;
  }
}

.u-mt-24-24 {
  margin-top: 24px !important;
}

.u-mt-24-16 {
  margin-top: 24px;
}
@media screen and (max-width: 767px) {
  .u-mt-24-16 {
    margin-top: 16px;
  }
}

.u-mt-20-24 {
  margin-top: 20px;
}
@media screen and (max-width: 767px) {
  .u-mt-20-24 {
    margin-top: 24px;
  }
}

.u-mt-16-16 {
  margin-top: 16px !important;
}

.u-mt-16-12 {
  margin-top: 16px;
}
@media screen and (max-width: 767px) {
  .u-mt-16-12 {
    margin-top: 12px;
  }
}

.u-mt-12-8 {
  margin-top: 12px;
}
@media screen and (max-width: 767px) {
  .u-mt-12-8 {
    margin-top: 8px;
  }
}

.u-mt-11-5 {
  margin-top: 11px;
}
@media screen and (max-width: 767px) {
  .u-mt-11-5 {
    margin-top: 5px;
  }
}

.u-mt-8-4 {
  margin-top: 8px;
}
@media screen and (max-width: 767px) {
  .u-mt-8-4 {
    margin-top: 4px;
  }
}

@media screen and (max-width: 767px) {
  .u-mt-0-24 {
    margin-top: 24px !important;
  }
}

@media screen and (max-width: 767px) {
  .u-mt-0-16 {
    margin-top: 16px;
  }
}

/**
 * margin-bottom
 * ---------------------------------------- */
.u-mb-44-36 {
  margin-bottom: 44px;
}
@media screen and (max-width: 767px) {
  .u-mb-44-36 {
    margin-bottom: 36px;
  }
}

.u-mb-43-24 {
  margin-bottom: 43px;
}
@media screen and (max-width: 767px) {
  .u-mb-43-24 {
    margin-bottom: 24px;
  }
}

.u-mb-28-28 {
  margin-bottom: 28px;
}

@media screen and (max-width: 767px) {
  .u-mb-0-32 {
    margin-bottom: 32px !important;
  }
}

/**
 * padding-top
 * ---------------------------------------- */
.u-pt-100-28 {
  padding-top: 100px;
}
@media screen and (max-width: 767px) {
  .u-pt-100-28 {
    padding-top: 28px;
  }
}

.u-pt-16-0 {
  padding-top: 16px;
}
@media screen and (max-width: 767px) {
  .u-pt-16-0 {
    padding-top: 0;
  }
}

@media screen and (max-width: 767px) {
  .u-pt-0-28 {
    padding-top: 28px;
  }
}

/**
 * padding-right、padding-left
 * ---------------------------------------- */
@media screen and (max-width: 767px) {
  .u-px-0-16 {
    padding-right: 16px;
    padding-left: 16px;
  }
}

@media screen and (max-width: 767px) {
  .u-px-0-9 {
    padding-right: 9px !important;
    padding-left: 9px !important;
  }
}

/**
 * line-height
 * ---------------------------------------- */
.u-lh-1\.3 {
  line-height: 1.3 !important;
}

.u-lh-1 {
  line-height: 1 !important;
}

.u-ls-0\.03 {
  letter-spacing: 0.03em !important;
}

/**
 * overflow
 * ---------------------------------------- */
.u-overflow-x-hidden {
  overflow-x: hidden;
}