@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@200;300;400;500;600;700;900&display=swap");
/* Document
 * ========================================================================== */
/**
 * Add border box sizing in all browsers (opinionated).
 */
*, ::before, ::after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

/**
 * 1. Add text decoration inheritance in all browsers (opinionated).
 * 2. Add vertical alignment inheritance in all browsers (opinionated).
 */
::before, ::after {
  text-decoration: inherit;
  /* 1 */
  vertical-align: inherit;
  /* 2 */
}

/**
 * 1. Use the default cursor in all browsers (opinionated).
 * 2. Change the line height in all browsers (opinionated).
 * 3. Use a 4-space tab width in all browsers (opinionated).
 * 4. Remove the grey highlight on links in iOS (opinionated).
 * 5. Prevent adjustments of font size after orientation changes in
 *    IE on Windows Phone and in iOS.
 * 6. Breaks words to prevent overflow in all browsers (opinionated).
 */
html {
  cursor: default;
  /* 1 */
  line-height: 1.5;
  /* 2 */
  -moz-tab-size: 4;
  /* 3 */
  -o-tab-size: 4;
     tab-size: 4;
  /* 3 */
  -webkit-tap-highlight-color: transparent;
  -ms-text-size-adjust: 100%;
  /* 5 */
  -webkit-text-size-adjust: 100%;
  /* 5 */
  word-break: break-word;
  /* 6 */
}

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

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Edge, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
 * ========================================================================== */
/**
 * Remove the margin on nested lists in Chrome, Edge, IE, and Safari.
 */
dl dl, dl ol, dl ul {
  margin: 0;
}

ol dl, ul dl {
  margin: 0;
}

/**
 * Remove the margin on nested lists in Edge 18- and IE.
 */
ol ol, ol ul {
  margin: 0;
}

ul ol, ul ul {
  margin: 0;
}

/**
 * 1. Add the correct sizing in Firefox.
 * 2. Show the overflow in Edge 18- and IE.
 */
hr {
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */
}

/**
 * Add the correct display in IE.
 */
main {
  display: block;
}

/**
 * Remove the list style on navigation lists in all browsers (opinionated).
 */
nav ol, nav ul {
  list-style: none;
  padding: 0;
}

/**
 * 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: 1em;
  /* 2 */
}

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

/**
 * Add the correct text decoration in Edge 18-, IE, and Safari.
 */
abbr[title] {
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/**
 * 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: 1em;
  /* 2 */
}

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

/* Embedded content
 * ========================================================================== */
/*
 * Change the alignment on media elements in all browsers (opinionated).
 */
audio, canvas, iframe, img, svg, video {
  vertical-align: middle;
}

/**
 * Add the correct display in IE 9-.
 */
audio, video {
  display: inline-block;
}

/**
 * Add the correct display in iOS 4-7.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Remove the border on iframes in all browsers (opinionated).
 */
iframe, img {
  border-style: none;
}

/**
 * Remove the border on images within links in IE 10-.
 */
/**
 * Change the fill color to match the text color in all browsers (opinionated).
 */
svg:not([fill]) {
  fill: currentColor;
}
svg:not(:root) {
  overflow: hidden;
}

/**
 * Hide the overflow in IE.
 */
/* Tabular data
 * ========================================================================== */
/**
 * Collapse border spacing in all browsers (opinionated).
 */
table {
  border-collapse: collapse;
}

/* Forms
 * ========================================================================== */
/**
 * Remove the margin on controls in Safari.
 */
button, input, select {
  margin: 0;
}

/**
 * 1. Show the overflow in IE.
 * 2. Remove the inheritance of text transform in Edge 18-, Firefox, and IE.
 */
button {
  overflow: visible;
  /* 1 */
  text-transform: none;
  /* 2 */
  -webkit-appearance: button;
}

/**
 * Correct the inability to style buttons in iOS and Safari.
 */
[type=button], [type=reset], [type=submit] {
  -webkit-appearance: button;
}

/**
 * 1. Change the inconsistent appearance in all browsers (opinionated).
 * 2. Correct the padding in Firefox.
 */
fieldset {
  border: 1px solid #a0a0a0;
  /* 1 */
  padding: 0.35em 0.75em 0.625em;
  /* 2 */
}

/**
 * Show the overflow in Edge 18- and IE.
 */
input {
  overflow: visible;
}

/**
 * 1. Correct the text wrapping in Edge 18- and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 */
legend {
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  white-space: normal;
  /* 1 */
}

/**
 * 1. Add the correct display in Edge 18- and IE.
 * 2. Add the correct vertical alignment in Chrome, Edge, and Firefox.
 */
progress {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */
}

/**
 * Remove the inheritance of text transform in Firefox.
 */
select {
  text-transform: none;
}

/**
 * 1. Remove the margin in Firefox and Safari.
 * 2. Remove the default vertical scrollbar in IE.
 * 3. Change the resize direction in all browsers (opinionated).
 */
textarea {
  margin: 0;
  /* 1 */
  overflow: auto;
  /* 2 */
  resize: vertical;
  /* 3 */
}

/**
 * Remove the padding in IE 10-.
 */
[type=checkbox], [type=radio] {
  padding: 0;
}

/**
 * 1. Correct the odd appearance in Chrome, Edge, and Safari.
 * 2. Correct the outline style in Safari.
 */
[type=search] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Safari.
 */
::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
  height: auto;
}

/**
 * Correct the text style of placeholders in Chrome, Edge, and Safari.
 */
::-webkit-input-placeholder {
  color: inherit;
  opacity: 0.54;
}

/**
 * Remove the inner padding in Chrome, Edge, and Safari on macOS.
 */
::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style upload buttons in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/**
 * Remove the inner border and padding of focus outlines in Firefox.
 */
::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus outline styles unset by the previous rule in Firefox.
 */
:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Remove the additional :invalid styles in Firefox.
 */
:-moz-ui-invalid {
  box-shadow: none;
}

/* Interactive
 * ========================================================================== */
/*
 * Add the correct display in Edge 18- and IE.
 */
details {
  display: block;
}

/*
 * Add the correct styles in Edge 18-, IE, and Safari.
 */
dialog {
  background-color: white;
  border: solid;
  color: black;
  display: block;
  height: -moz-fit-content;
  height: -webkit-fit-content;
  height: fit-content;
  left: 0;
  margin: auto;
  padding: 1em;
  position: absolute;
  right: 0;
  width: -moz-fit-content;
  width: -webkit-fit-content;
  width: fit-content;
}
dialog:not([open]) {
  display: none;
}

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

/* Scripting
 * ========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
canvas {
  display: inline-block;
}

/**
 * Add the correct display in IE.
 */
template {
  display: none;
}

/* User interaction
 * ========================================================================== */
/*
 * 1. Remove the tapping delay in IE 10.
 * 2. Remove the tapping delay on clickable elements
      in all browsers (opinionated).
 */
a, area, button, input, label, select, summary, textarea, [tabindex] {
  -ms-touch-action: manipulation;
  /* 1 */
  touch-action: manipulation;
  /* 2 */
}

/**
 * Add the correct display in IE 10-.
 */
[hidden] {
  display: none;
}

/* Accessibility
 * ========================================================================== */
/**
 * Change the cursor on busy elements in all browsers (opinionated).
 */
[aria-busy=true] {
  cursor: progress;
}

/*
 * Change the cursor on control elements in all browsers (opinionated).
 */
[aria-controls] {
  cursor: pointer;
}

/*
 * Change the cursor on disabled, not-editable, or otherwise
 * inoperable elements in all browsers (opinionated).
 */
[aria-disabled=true], [disabled] {
  cursor: not-allowed;
}

/*
 * Change the display on visually hidden accessible elements
 * in all browsers (opinionated).
 */
[aria-hidden=false][hidden] {
  display: initial;
}
[aria-hidden=false][hidden]:not(:focus) {
  clip: rect(0, 0, 0, 0);
  position: absolute;
}

:root {
  --fs-xxxs: clamp(0.8rem, 2.5vw, 0.68rem);
  --fs-xxs: clamp(0.9rem, 2.5vw, 0.9rem);
  --fs-xs: clamp(1.0rem, 2.5vw, 1.2rem);
  --fs-sm: clamp(1.3rem, 2.5vw, 1.3rem);
  --fs-sb: clamp(1.3rem, 2.5vw, 1.4rem);
  --fs-sb-l: clamp(1.3rem, 2.5vw, 1.5rem);
  --fs-base: clamp(1.4rem, 2.5vw, 1.6rem);
  --fs-lb: clamp(1.5rem, 2.5vw, 1.8rem);
  --fs-md: clamp(1.6rem, 2.5vw, 2rem);
  --fs-lg: clamp(1.7rem, 2.5vw, 2.2rem);
  --fs-lg-m: clamp(1.8rem, 2.5vw, 2.4rem);
  --fs-lg-l: clamp(1.9rem, 2.5vw, 3rem);
  --fs-xl: clamp(2.0rem, 2.5vw, 3.79rem);
  --fs-xl-b: clamp(2.2rem, 2.5vw, 4.0rem);
  --fs-xxl: clamp(2.4rem, 2.5vw, 5.05rem);
  --fs-xxxl: clamp(2.6rem, 2.5vw, 6rem);
  --fs-xxxxl: clamp(2.8rem, 2.5vw, 7rem);
  /* ======================================= */
  /* カラー設定
  /* ======================================= */
  --clr-red: #D8361E;
  --clr-yellow: #FFFF6E;
  --clr-gray: #333333;
  --clr-darkgray: #231815;
  --clr-lightgray: #717071;
}

/* ======================================= */
/* 書体の設定
/* ======================================= */
/* ExtraLight 200  Light 300  Regular 400  Medium 500 SemiBold 600  Bold 700 */
/*

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@200;300;400;500;600;700&display=swap');
$notoSans : 'Noto Sans JP', sans-serif;
/* ExtraLight 200  Light 300  Regular 400  Medium 500 SemiBold 600  Bold 700

@import url("https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@300;400;500;700&display=swap");
$zen: 'Zen Kaku Gothic New', sans-serif;

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+JP:wght@400;500;700&display=swap');
$ibm: 'IBM Plex Sans JP', sans-serif;
/* Regular 400  Medium 500 Bold 700

@import url('https://fonts.googleapis.com/css2?family=Jost:wght@400;500;600;700&display=swap');
$Jost : 'Jost', sans-serif;

@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@300;400;700&display=swap');
$roboto : 'Roboto Condensed',Arial,Sans-Serif;

@import url('https://fonts.googleapis.com/css?family=Archivo');
$Archivo : 'Archivo', sans-serif;

@import url('https://fonts.googleapis.com/css?family=Montserrat:400,600,700');
$Montserrat : 'Montserrat', sans-serif;

@import url('https://fonts.googleapis.com/css?family=Raleway:400,500,600,700&display=swap');
$Raleway : 'Raleway', sans-serif;

@import url('https://fonts.googleapis.com/css?family=Oswald:400,700');
$Oswald : 'Oswald', sans-serif;

@import url('https://fonts.googleapis.com/css2?family=Teko:wght@600&display=swap');
$teko : 'Teko', sans-serif;

@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400&display=swap');
$Lato : 'Lato', sans-serif;

@import url('https://fonts.googleapis.com/css2?family=Jost:wght@400;500;600;700&display=swap');
$Jost : 'Jost', sans-serif;

*/
/*
@import url('https://use.fontawesome.com/releases/v5.7.1/css/all.css');
@mixin fontAwesomeIcon($iconNumber) {
  content: $iconNumber;
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  line-height: 1;
};
*/
/*==　ハンバーガーメニュー　==*/
.ofi {
  -o-object-fit: cover;
     object-fit: cover;
  font-family: "object-fit: cover;"; /*IE対策*/
}

/*====================================================================
  html, body
====================================================================*/
* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

html {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  font-size: 62.5%;
}

body {
  margin: 0;
  padding: 0;
  color: #45433C;
  font-family: "Noto Sans JP", sans-serif, Hiragino Kaku Gothic ProN, Meiryo, sans-serif;
  position: relative;
  background-color: #FFF;
  font-size: 62.5%;
  font-weight: 400;
  font-style: normal;
  line-height: 1.6;
  letter-spacing: 0.06em;
  word-spacing: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ======================================= */
/* common
/* ======================================= */
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
  margin: 0;
  padding: 0;
}

main {
  display: block;
}

em, address {
  font-style: normal;
}

a {
  color: #45433C;
  text-decoration: none;
  opacity: 1;
  -webkit-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
}
a:hover {
  text-decoration: none;
  opacity: 0.75;
}

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

p {
  margin: 0;
  padding: 0;
}

ul {
  margin: 0;
  padding: 0;
}
ul li {
  list-style: none;
}

figure {
  margin: 0;
}

.l-header {
  width: 100%;
  min-width: 1366px;
  padding: 0;
  position: relative;
}
@media screen and (max-width: 768px) {
  .l-header {
    min-width: 100%;
  }
}
.l-header__row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media screen and (max-width: 768px) {
  .l-header__row {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: start;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    padding-top: 50px;
  }
}
.l-header__row-catch {
  width: 50%;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .l-header__row-catch {
    width: 100%;
    padding-bottom: 50px;
  }
}
.l-header__row-catch_id {
  width: 198px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .l-header__row-catch_id {
    width: 100px;
  }
}
.l-header__row-catch_title {
  margin-top: 75px;
  font-size: 8rem;
  font-weight: 900;
  line-height: 1.2;
}
@media screen and (max-width: 768px) {
  .l-header__row-catch_title {
    margin-top: 35px;
    font-size: 4rem;
  }
}
.l-header__row-catch_title span {
  position: relative;
}
.l-header__row-catch_title span::before, .l-header__row-catch_title span::after {
  display: block;
  color: var(--clr-red);
  font-size: 11rem;
  position: absolute;
}
@media screen and (max-width: 768px) {
  .l-header__row-catch_title span::before, .l-header__row-catch_title span::after {
    font-size: 5.5rem;
  }
}
.l-header__row-catch_title span::before {
  content: "“";
  top: -20px;
  left: -75px;
}
@media screen and (max-width: 768px) {
  .l-header__row-catch_title span::before {
    top: -10px;
    left: -40px;
  }
}
.l-header__row-catch_title span::after {
  content: "”";
  bottom: -65px;
  right: -80px;
}
@media screen and (max-width: 768px) {
  .l-header__row-catch_title span::after {
    bottom: -35px;
    right: -40px;
  }
}
.l-header__row-catch_start {
  width: 530px;
  margin: 75px auto 0;
}
@media screen and (max-width: 768px) {
  .l-header__row-catch_start {
    width: 265px;
    margin: 30px auto 0;
  }
}
.l-header__row-pic {
  width: 50%;
}
@media screen and (max-width: 768px) {
  .l-header__row-pic {
    width: 100%;
  }
}
.l-header__row-pic img {
  border-radius: 0 0 0 90px;
}
@media screen and (max-width: 768px) {
  .l-header__row-pic img {
    border-radius: 0;
  }
}

.dt-hidden {
  display: none;
}
@media screen and (max-width: 768px) {
  .dt-hidden {
    display: block;
  }
}

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

.l-about {
  margin-top: 70px;
  width: 100%;
  min-width: 1366px;
  background-image: url("../image/img-about.png");
  background-repeat: no-repeat;
  background-size: 100%;
  padding-top: 130px;
  padding-bottom: 140px;
}
@media screen and (max-width: 768px) {
  .l-about {
    background-size: 80%;
    background-position: top right;
    margin-top: 0;
    min-width: 100%;
    padding-top: 80px;
    padding-bottom: 70px;
  }
}
.l-about .inner {
  width: 1200px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .l-about .inner {
    width: 100%;
    padding: 0 5%;
  }
}
.l-about h2 {
  font-size: 3rem;
  font-weight: 700;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .l-about h2 {
    font-size: 2rem;
    text-align: center;
  }
}
.l-about h2 span {
  font-size: 4rem;
  color: var(--clr-red);
  position: relative;
}
@media screen and (max-width: 768px) {
  .l-about h2 span {
    font-size: 2.4rem;
  }
}
.l-about h2 span::before {
  content: "";
  display: block;
  width: 100%;
  height: 28px;
  background-color: var(--clr-yellow);
  position: absolute;
  bottom: -3px;
  left: 0;
  z-index: -1;
}
@media screen and (max-width: 768px) {
  .l-about h2 span::before {
    height: 16px;
  }
}
.l-about__txt {
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 2;
  margin-top: 55px;
}
@media screen and (max-width: 768px) {
  .l-about__txt {
    margin-top: 20px;
    font-size: 1.6rem;
    line-height: 1.9;
  }
}
.l-about__txt:first-of-type {
  margin-top: 75px;
}
@media screen and (max-width: 768px) {
  .l-about__txt:first-of-type {
    margin-top: 35px;
  }
}
.l-about__feature {
  margin-top: 330px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-image: url("../image/icon-feature_bg.svg");
  background-repeat: no-repeat;
  background-position: 50% -50%;
  background-size: 692px auto;
}
@media screen and (max-width: 768px) {
  .l-about__feature {
    background: unset;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin-top: 30px;
    gap: 25px 0;
  }
}
.l-about__feature-item {
  width: 390px;
  height: 390px;
  border-radius: 390px;
  background-color: var(--clr-red);
  color: white;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
@media screen and (max-width: 768px) {
  .l-about__feature-item {
    width: 290px;
    height: 290px;
    border-radius: 290px;
    margin: 0 auto;
  }
}
.l-about__feature-item:nth-of-type(1) {
  -webkit-transform: translateX(45px);
          transform: translateX(45px);
}
@media screen and (max-width: 768px) {
  .l-about__feature-item:nth-of-type(1) {
    -webkit-transform: unset;
            transform: unset;
  }
}
.l-about__feature-item:nth-of-type(2) {
  -webkit-transform: translateY(-245px);
          transform: translateY(-245px);
}
@media screen and (max-width: 768px) {
  .l-about__feature-item:nth-of-type(2) {
    -webkit-transform: unset;
            transform: unset;
  }
}
.l-about__feature-item:nth-of-type(3) {
  -webkit-transform: translateX(-45px);
          transform: translateX(-45px);
}
@media screen and (max-width: 768px) {
  .l-about__feature-item:nth-of-type(3) {
    -webkit-transform: unset;
            transform: unset;
  }
}
.l-about__feature-item img {
  display: block;
  margin: 0 auto;
  width: auto;
  height: 127px;
}
@media screen and (max-width: 768px) {
  .l-about__feature-item img {
    height: 90px;
  }
}
.l-about__feature-item_title {
  margin-top: 10px;
  font-size: 3rem;
  font-weight: 700;
  color: var(--clr-yellow);
}
@media screen and (max-width: 768px) {
  .l-about__feature-item_title {
    margin-top: 5px;
    font-size: 2.2rem;
  }
}
.l-about__feature-item_txt {
  margin-top: 5px;
  font-size: 1.6rem;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .l-about__feature-item_txt {
    font-size: 1.3rem;
    font-weight: 500;
  }
}

.l-imglist {
  width: 100%;
  min-width: 1366px;
}
@media screen and (max-width: 768px) {
  .l-imglist {
    min-width: 100%;
  }
}

.l-flowA {
  width: 100%;
  min-width: 1366px;
  padding-top: 145px;
  padding-bottom: 225px;
}
@media screen and (max-width: 768px) {
  .l-flowA {
    min-width: 100%;
    padding-top: 35px;
    padding-bottom: 110px;
  }
}
.l-flowA .inner {
  width: 1200px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .l-flowA .inner {
    width: 100%;
    margin: 0;
    padding: 0 5%;
  }
}
.l-flowA h2 {
  width: 600px;
  margin: 0 auto;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .l-flowA h2 {
    width: 100%;
  }
}
.l-flowA h2 span {
  display: inline-block;
  font-size: 3rem;
  font-weight: 700;
  width: 100%;
  padding-bottom: 15px;
  border-bottom: 1px solid var(--clr-gray);
}
@media screen and (max-width: 768px) {
  .l-flowA h2 span {
    font-size: 2rem;
    padding-bottom: 10px;
  }
}
.l-flowA .flow-lists {
  margin-top: 90px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media screen and (max-width: 768px) {
  .l-flowA .flow-lists {
    margin-top: 30px;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 25px 0;
  }
}
.l-flowA .flow-lists_item {
  width: 270px;
  height: 270px;
  border-radius: 270px;
  background-color: var(--clr-gray);
  color: white;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}
@media screen and (max-width: 768px) {
  .l-flowA .flow-lists_item {
    width: 155px;
    height: 155px;
    border-radius: 155px;
  }
  .l-flowA .flow-lists_item:nth-of-type(3)::before {
    left: unset;
    right: -20px;
    top: 0;
    -webkit-transform: translateY(-30px) rotate(135deg);
            transform: translateY(-30px) rotate(135deg);
  }
}
.l-flowA .flow-lists_item::before {
  content: "";
  display: block;
  width: 14px;
  height: 33px;
  background-image: url("../image/icon-arrow.svg");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  left: -28px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
  .l-flowA .flow-lists_item::before {
    width: 10px;
    height: 27px;
    left: -20px;
  }
}
.l-flowA .flow-lists_item:first-of-type::before {
  display: none;
}
.l-flowA .flow-lists_item:last-of-type {
  background-color: var(--clr-red);
}
.l-flowA .flow-lists_item figure img {
  width: auto;
  height: 90px;
}
@media screen and (max-width: 768px) {
  .l-flowA .flow-lists_item figure img {
    height: 60px;
  }
}
.l-flowA .flow-lists_item figure figcaption {
  margin-top: 15px;
  font-size: 2rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .l-flowA .flow-lists_item figure figcaption {
    margin-top: 7px;
    font-size: 1.4rem;
  }
}

.l-flowB {
  width: 100%;
  min-width: 1366px;
}
@media screen and (max-width: 768px) {
  .l-flowB {
    min-width: 100%;
  }
}
.l-flowB .inner {
  width: 92%;
  margin: 0 auto;
  background-color: rgba(216, 54, 30, 0.2);
  border-radius: 30px;
  position: relative;
  padding-top: 120px;
  padding-bottom: 70px;
}
@media screen and (max-width: 768px) {
  .l-flowB .inner {
    padding-top: 80px;
    padding-bottom: 40px;
  }
}
.l-flowB h2 {
  width: 797px;
  position: absolute;
  top: -55px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
@media screen and (max-width: 768px) {
  .l-flowB h2 {
    width: 90%;
    top: -40px;
  }
}
.l-flowB h2 span {
  text-align: center;
  width: 100%;
  font-size: 3.2rem;
  font-weight: 700;
  position: relative;
  line-height: 117px;
  display: inline-block;
  background-color: white;
  border-radius: 117px;
  border: 3px solid var(--clr-red);
}
@media screen and (max-width: 768px) {
  .l-flowB h2 span {
    font-size: 2.2rem;
    line-height: 1.3;
    padding: 12px 0;
  }
}
.l-flowB h2 span::before, .l-flowB h2 span::after {
  content: "";
  display: block;
  width: 62px;
  height: 62px;
  background-image: url("../image/icon-gear_r.svg");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
  .l-flowB h2 span::before, .l-flowB h2 span::after {
    display: none;
  }
}
.l-flowB h2 span::before {
  left: 30px;
}
.l-flowB h2 span::after {
  right: 30px;
}
.l-flowB .flow-lists {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0 40px;
}
@media screen and (max-width: 768px) {
  .l-flowB .flow-lists {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: start;
    gap: 40px 0;
  }
}
.l-flowB .flow-lists_item {
  width: 370px;
  height: 370px;
  border-radius: 370px;
  background-color: var(--clr-red);
  color: white;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}
@media screen and (max-width: 768px) {
  .l-flowB .flow-lists_item {
    width: 260px;
    height: 260px;
    border-radius: 260px;
    margin: 0 auto;
  }
}
.l-flowB .flow-lists_item::before {
  content: "";
  display: block;
  width: 14px;
  height: 33px;
  background-image: url("../image/icon-arrow.svg");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  left: -28px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
  .l-flowB .flow-lists_item::before {
    left: 50%;
    top: 0;
    -webkit-transform: translate(-50%, -35px) rotate(90deg);
            transform: translate(-50%, -35px) rotate(90deg);
  }
}
.l-flowB .flow-lists_item:first-of-type::before {
  display: none;
}
.l-flowB .flow-lists_item figure img {
  width: auto;
  height: 90px;
}
@media screen and (max-width: 768px) {
  .l-flowB .flow-lists_item figure img {
    height: 70px;
  }
}
.l-flowB .flow-lists_item figure figcaption {
  margin-top: 25px;
  font-size: 2.6rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .l-flowB .flow-lists_item figure figcaption {
    margin-top: 20px;
    font-size: 2rem;
  }
}
.l-flowB .catch {
  width: 780px;
  margin: 100px auto 0;
}
@media screen and (max-width: 768px) {
  .l-flowB .catch {
    width: 90%;
    text-align: center;
  }
}
.l-flowB .catch span {
  width: 100%;
  display: inline-block;
  background-color: var(--clr-yellow);
  font-size: 4.3rem;
  font-weight: 700;
  color: var(--clr-red);
  line-height: 94px;
  border-radius: 94px;
  padding: 0 50px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .l-flowB .catch span {
    font-size: 2rem;
    padding: 0 20px;
    line-height: 70px;
    border-radius: 70px;
  }
}
.l-flowB .catch span::after {
  content: "";
  display: block;
  width: 143px;
  height: 158px;
  background-image: url("../image/icon-maintenance.svg");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  bottom: 10px;
  right: 40px;
}
@media screen and (max-width: 768px) {
  .l-flowB .catch span::after {
    width: 70px;
    height: 77px;
    bottom: unset;
    right: unset;
    top: -60px;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}

.l-outline {
  width: 100%;
  min-width: 1366px;
  background-image: url("../image/img-outline.png");
  background-repeat: no-repeat;
  background-size: 70%;
  background-position: bottom right;
  padding-top: 120px;
  padding-bottom: 305px;
}
@media screen and (max-width: 768px) {
  .l-outline {
    min-width: 100%;
    padding-top: 60px;
    padding-bottom: 220px;
    background-size: 100%;
  }
}
.l-outline .inner {
  width: 1200px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .l-outline .inner {
    width: 100%;
    margin: 0;
    padding: 0 5%;
  }
}
.l-outline__lists {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 20px 0;
}
@media screen and (max-width: 768px) {
  .l-outline__lists {
    gap: 20px 0;
    text-align: center;
  }
}
.l-outline__lists dl {
  margin: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0 20px;
}
@media screen and (max-width: 768px) {
  .l-outline__lists dl {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 10px 0;
  }
}
.l-outline__lists dl dt, .l-outline__lists dl dd {
  margin: 0;
}
.l-outline__lists dl dt {
  width: 160px;
  color: white;
  line-height: 50px;
  border-radius: 50px;
  text-align: center;
  background-color: var(--clr-gray);
  font-size: 2.4rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .l-outline__lists dl dt {
    font-size: 1.8rem;
    line-height: 45px;
    border-radius: 45px;
  }
}
.l-outline__lists dl dd {
  font-size: 2.6rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .l-outline__lists dl dd {
    font-size: 1.8rem;
  }
}
.l-outline__lists dl dd span {
  margin-left: 15px;
  font-weight: 400;
  font-size: 2rem;
}
@media screen and (max-width: 768px) {
  .l-outline__lists dl dd span {
    display: block;
    margin-left: 0;
    font-size: 1.4rem;
  }
}

.l-contact {
  width: 100%;
  min-width: 1366px;
  background-color: var(--clr-darkgray);
  padding-top: 120px;
  padding-bottom: 135px;
  color: white;
}
@media screen and (max-width: 768px) {
  .l-contact {
    min-width: 100%;
    padding-top: 60px;
    padding-bottom: 65px;
  }
}
.l-contact .inner {
  width: 1200px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .l-contact .inner {
    width: 100%;
    margin: 0;
    padding: 0 5%;
  }
}
.l-contact h2 {
  width: 600px;
  margin: 0 auto;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .l-contact h2 {
    width: 100%;
  }
}
.l-contact h2 span {
  display: inline-block;
  font-size: 3rem;
  font-weight: 700;
  width: 100%;
  padding-bottom: 15px;
  border-bottom: 1px solid white;
}
@media screen and (max-width: 768px) {
  .l-contact h2 span {
    font-size: 2rem;
    padding-bottom: 10px;
  }
}
.l-contact .row {
  margin-top: 55px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0 50px;
}
@media screen and (max-width: 768px) {
  .l-contact .row {
    margin-top: 25px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: start;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    gap: 20px 0;
    text-align: center;
  }
}
.l-contact .row-manager {
  width: 248px;
  text-align: center;
  border: 1px solid white;
  line-height: 65px;
  font-size: 2.6rem;
  font-weight: 700;
  border-radius: 65px;
}
@media screen and (max-width: 768px) {
  .l-contact .row-manager {
    width: 200px;
    font-size: 1.8rem;
    line-height: 50px;
    border-radius: 50px;
    margin: 0 auto;
  }
}
.l-contact .row-phone a, .l-contact .row-mail a {
  font-size: 3rem;
  font-weight: 700;
  color: white;
}
@media screen and (max-width: 768px) {
  .l-contact .row-phone a, .l-contact .row-mail a {
    font-size: 1.8rem;
  }
}
.l-contact .row-phone img, .l-contact .row-mail img {
  width: 44px;
  vertical-align: -10px;
  margin-right: 10px;
}
@media screen and (max-width: 768px) {
  .l-contact .row-phone img, .l-contact .row-mail img {
    width: 32px;
    vertical-align: -8px;
    margin-right: 6px;
  }
}
.l-contact .btn {
  width: 600px;
  margin: 60px auto 0;
}
@media screen and (max-width: 768px) {
  .l-contact .btn {
    width: 100%;
    margin: 30px auto 0;
  }
}
.l-contact .btn a {
  display: block;
  background-color: var(--clr-red);
  color: white;
  text-align: center;
  line-height: 100px;
  border-radius: 100px;
  font-size: 3rem;
  font-weight: 700;
  position: relative;
}
@media screen and (max-width: 768px) {
  .l-contact .btn a {
    font-size: 1.8rem;
    line-height: 70px;
    border-radius: 70px;
  }
}
.l-contact .btn a::before, .l-contact .btn a::after {
  content: "";
  display: block;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.l-contact .btn a::before {
  width: 62px;
  height: 62px;
  left: 30px;
  background-image: url("../image/icon-gear.svg");
}
@media screen and (max-width: 768px) {
  .l-contact .btn a::before {
    width: 32px;
    height: 32px;
  }
}
.l-contact .btn a::after {
  width: 14px;
  height: 33px;
  right: 30px;
  background-image: url("../image/icon-arrow_w.svg");
}
@media screen and (max-width: 768px) {
  .l-contact .btn a::after {
    width: 7px;
    height: 20px;
  }
}

.l-footer {
  width: 100%;
  min-width: 1366px;
  background-color: var(--clr-red);
  padding: 65px 0 100px;
  color: white;
}
@media screen and (max-width: 768px) {
  .l-footer {
    min-width: 100%;
    padding: 40px 5% 50px;
    text-align: center;
  }
}
.l-footer .inner {
  width: 1200px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .l-footer .inner {
    width: 100%;
    margin: 0;
  }
}
.l-footer h1 {
  font-size: 1.6rem;
}
@media screen and (max-width: 768px) {
  .l-footer h1 {
    font-size: 1.3rem;
  }
}
.l-footer .row {
  margin-top: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media screen and (max-width: 768px) {
  .l-footer .row {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: start;
  }
}
.l-footer .row-id {
  width: 460px;
}
@media screen and (max-width: 768px) {
  .l-footer .row-id {
    width: 280px;
    margin: 0 auto;
  }
}
.l-footer .row-add {
  font-size: 2rem;
}
@media screen and (max-width: 768px) {
  .l-footer .row-add {
    font-size: 1.4rem;
    margin: 15px 0;
  }
}
.l-footer .row-bnr {
  width: 300px;
}
@media screen and (max-width: 768px) {
  .l-footer .row-bnr {
    width: 200px;
    margin: 0 auto;
  }
}
.l-footer address {
  margin-top: 15px;
  font-size: 1.4rem;
  text-align: right;
}
@media screen and (max-width: 768px) {
  .l-footer address {
    font-size: 1.2rem;
    text-align: center;
  }
}
/*# sourceMappingURL=style.css.map */