/* ------------------------------------------------------------------------------------
Variables
------------------------------------------------------------------------------------ */
:root {
  /*  colors  */
  --white: #ffffff;
  --black: #000000;
  --blue: #0050a4;
  --light-blue: #f8fafe;
  --link-blue: #0d6efd;
  --gray: #7a7a7a;
  --dark-gray: #515256;
  --dark-gray-sub: #494a4c;
  --light-gray: #f8f9fa;
  --light-gray-sub: #f5f5f5;
  --red: #EE2B00;
  --light-red: #fbefee;
  --gold: #b39d56;
  --yellow: #ffd156;
  --orange: #f8813c;
  --light-orange: #f9f0cc;
  --primary: #034a9e;
  --sub: #006d72;
  --default: #212529;
  --bgcolor: #FFFFFF;
  --bg_subcolor: #F8F9FA;
  --column2-gap: clamp(12px, 2cqi, 24px);
  --column3-gap: clamp(10px, 2cqi, 20px);
  --column4-gap: clamp(8px, 2cqi, 16px);
  --jpfont: "Noto Sans JP";
  --enfont: "Jost";
  --padding-x: clamp(1.25rem, 0.321rem + 4.64vw, 4.5rem);
  --color-theme-1: var(--primary);
  --color-theme-1-1: #e3f2fc;
  --color-theme-1-2: #90CBF7;
  --color-theme-2: #33485E;
  --color-theme-3: var(--sub);
  --color-gray-1: var(--light-gray); 
}

/* Generic */
/*! destyle.css v4.0.0 | MIT License | https://github.com/nicolas-cusan/destyle.min.css */
*,::before,::after{box-sizing:border-box;border-style:solid;border-width:0}html{line-height:1.15;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}body{margin:0}main{display:block}p,table,blockquote,address,pre,iframe,form,figure,dl{margin:0}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit;margin:0}ul,ol{margin:0;padding:0;list-style:none}dt{font-weight:700}dd{margin-left:0}hr{box-sizing:content-box;height:0;overflow:visible;border-top-width:1px;margin:0;clear:both;color:inherit}pre{font-family:monospace,sans-serif;font-size:inherit}address{font-style:inherit}a{background-color:transparent;text-decoration:none;color:inherit}abbr[title]{text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,sans-serif;font-size:inherit}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}svg,img,embed,object,iframe{vertical-align:bottom}button,input,optgroup,select,textarea{-webkit-appearance:none;appearance:none;vertical-align:middle;color:inherit;font:inherit;background:transparent;padding:0;margin:0;border-radius:0;text-align:inherit;text-transform:inherit}button,[type="button"],[type="reset"],[type="submit"]{cursor:pointer}button:disabled,[type="button"]:disabled,[type="reset"]:disabled,[type="submit"]:disabled{cursor:default}:-moz-focusring{outline:auto}select:disabled{opacity:inherit}option{padding:0}fieldset{margin:0;padding:0;min-width:0}legend{padding:0}progress{vertical-align:baseline}textarea{overflow:auto}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{outline-offset:-2px}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}[type="number"]{-moz-appearance:textfield}label[for]{cursor:pointer}details{display:block}summary{display:list-item}[contenteditable]:focus{outline:auto}table{border-color:inherit;border-collapse:collapse}caption{text-align:left}td,th{vertical-align:top;padding:0}th{text-align:left;font-weight:700}
/* ------------------------------------------------------------------------------------
 web fonts
------------------------------------------------------------------------------------ */

/* Noto Sanas JP */
/* Bold */
@font-face {
  font-family: 'Noto Sans JP';
  src: url('//21507825.fs1.hubspotusercontent-na1.net/hubfs/21507825/raw_assets/public/recruit/fonts/NotoSansJP-Bold.woff2') format('woff2'),
       url('//21507825.fs1.hubspotusercontent-na1.net/hubfs/21507825/raw_assets/public/recruit/fonts/NotoSansJP-Bold.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* jost */
/* Italic */
@font-face {
  font-family: 'jost';
  src: url('//21507825.fs1.hubspotusercontent-na1.net/hubfs/21507825/raw_assets/public/recruit/fonts/Jost-MediumItalic.ttf') format('ttf');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

/* @font-face {
    font-family: 'FontAwesome';
    src: url('../fonts/fontawesome-webfont.eot?v=4.7.0');
    src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'),url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'),url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'),url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'),url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
    font-weight: normal;
    font-style: normal
} */

/* Objects */
html {
  scroll-behavior: smooth;
  scroll-padding-top: 126px;
}

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

@media screen and (max-width: 1024px) {
  html {
    scroll-padding-top: 72px;
  }
}

html body .body-wrapper {
  position: relative;
  overflow-x: hidden;
}

.body-wrapper .body-container-wrapper {
  margin-top: 80px;
}

@media screen and (max-width: 1024px) {
  .body-wrapper > div + main#main-content {
    margin-bottom: 0;
  }
}
@media screen and (max-width: 767px) {
  .body-wrapper .body-container-wrapper {
    margin-top: 60px;
  }
}

/* layout */
.l-landing-page {
  background-color: #f5f5f5;
}
.l-section-wrapper {
  max-width: 1140px;
  width: calc(100% - 40px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}

.l-twocolumn--main_left {
  flex: 1;
  position: relative;
}

@media screen and (max-width: 767px) {
  .l-section-wrapper {
    width: 100%;
  }
}
/* image */
.p-eyecatch {
  aspect-ratio: 16 / 9;
  overflow: hidden;
  width: 100%;
}
.p-eyecatch img {
  aspect-ratio: 16 / 9;
  width: 100%;
  min-width: 100%;
  object-fit: cover;
  transition: .4s;
}
a:hover .p-eyecatch img {
  transform: scale(1.1);
}

/* title */
.p-heading {
  margin-bottom: 50px;
}

.p-heading .subtitle {
  font-size: 1.125rem;
  font-weight: 700;
}
.p-heading .en-title {
  margin-bottom: .5rem;
  display: inline-block;
  color: var(--sub);
  font-family: var(--enfont);
  font-size: 1.3125rem;
  font-style: italic;
  line-height: 1.2;
  line-break: strict;
  overflow-wrap: anywhere;
  word-break: normal;
}
.p-heading.p-heading__style .en-title {
  padding: 8px 0;
  background: linear-gradient(135deg,transparent 0%,transparent 49%,#bfdfdf 49%,#bfdfdf 51%,transparent 51%,transparent 100%);
}
.p-heading.p-heading__style h2 {
  font-size: 1.875rem;
  font-style: italic;
  line-height: 1.3;
}
.text-dot {
  background-image: radial-gradient(4px 4px at center center, var(--primary), var(--primary) 100%, transparent, transparent);
  background-position: top left 0;
  background-repeat: repeat-x;
  background-size: 1.2em 12px;
  padding-top: .25em;
}
.p-heading.p-heading__style h2 + .subtitle {
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .p-heading {
    margin-bottom: 1.5rem;
  }
  .p-heading .en-title {
    font-size: 1rem;
  }
  .p-heading:has(+ .p-content-body) {
    margin-bottom: 1.5rem;
  }
  .p-heading.p-heading__style h2 {
    font-size: 1.5rem;
  }
  .text-dot {
    padding-top: .5em;
  }
}

/* content */
.p-content-body p, .p-content-body ul, .p-content-body ol {
  margin: 1.675rem 0;
}
.p-content-body p:first-child,
.p-content-body ul:first-child,
.p-content-body ol:first-child {
  margin-top: 0;
}
.p-content-body p:last-child,
.p-content-body ul:last-child,
.p-content-body ol:last-child {
  margin-bottom: 0;
}
.p-content-body ul,
.p-content-body ol {
  list-style-position: outside;
  line-height: 1.4;
}
.p-content-body ul li {
  margin: 8px 0 8px 20px;
  list-style-type: disc;
}
.p-content-body ol li {
  margin: 8px 0 8px 20px;
  list-style-type: decimal;
}

.p-content-title {
  --fs: 30;
  font-size: var(--font-size);
  font-style: italic;
  text-align: center;
  margin-bottom: 40px;
}

.p-content-title::before {
  background-color: var(--primary);
  content: '';
  display: block;
  width: 34px;
  height: 4px;
  margin: 0 auto;
}

.p-content-body {
  h3:not([class]) {
    --fs: 24;
    background-color: var(--color-theme-2);
    border-radius: 10px 10px 0 0;
    color: #fff;
    font-size: var(--font-size);
    padding: 10px 30px;
    margin: 60px 0 30px;
  }
  h4 {
    --fs: 22;
    align-items: center;
    display: flex;
    gap: 12px;
    font-size: var(--font-size);
    margin: 40px 0 1.5rem;
    &::before {
      aspect-ratio: 1;
      background-color: var(--color-theme-1);
      border-radius: 50%;
      content: '';
      display: inline-block;
      height: auto;
      width: 12px;
      flex: 0 0 auto;
    }
  }
}

@media(max-width: 767px) {
  .p-content-title {
    --fs: 24;
    margin-bottom: 1.5rem;
  }
  .p-content-body {
     h3:not([class]) {
       --fs: 20;
       padding: 10px 15px;
       margin: 40px 0 1.5rem;
    }
    h4 {
      --fs: 18;
    }
  }
}

/* table */
.p-table {
  width: 100%;
}
.p-table th,
.p-table td {
  padding: 20px 12px;
}
.p-table th {
  width: 20%;
  font-size: 0.9375rem;
  vertical-align: middle;
  border-bottom: 2px solid var(--color-theme-2);
}
.p-table td {
  border-bottom: 2px solid #adb5bd;
}

@media screen and (max-width: 819px) {
  .p-table th,
  .p-table td {
    padding: 20px 0;
    display: block;
  }
  .p-table th {
    padding-bottom: 0;
    width: 100%;
    border-bottom: 0;
  }
  .p-table td {
    padding-top: 10px;
  }
}

/* js-accordion */
.js-accordion:not(.open) .js-accordion-body {
  display: none;
}

/* p_btn */
.p_btn {
  width: 20px;
  height: 20px;
  position: relative;
}

.p_btn svg:first-child,
.p_btn svg:nth-child(2) {
  margin: auto;
  content: "";
  display: inline-block;
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  transition: opacity 1s;
}

.p_btn svg:nth-child(2) {
  transform: translateY(-50%) rotate(90deg);
  transition: transform .4s
}

.active .p_btn svg:first-child {
  opacity: 0
}

.active .p_btn svg:nth-child(2) {
  transform: translateY(-50%) rotate(180deg)
}

/* Elements */
/* common */
html body {
  font: 16px/1.6 'Noto Sans JP','Noto Sans JP', 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
  font-weight: 400;
  color: var(--default);
  letter-spacing: 0.1em;
  line-height: ;

}

@media screen and (max-width: 767px) {
  html body {
    font: 14px/1.6 'Noto Sans JP','Noto Sans JP', 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
  }
}

a {
  transition: .2s;
  word-break: break-all;
}
#main-contents a:not([class])[target="_blank"]::after {
  margin-left: 8px;
  content: '';
  display: inline-block;
  width: 16px;
  height: 16px;
  background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBjbGlwLXBhdGg9InVybCgjY2xpcDBfMjcxXzExODYpIj48cGF0aCBkPSJNMTUuMjcyOSAwSDkuNDU0N0M5LjA1MzA0IDAgOC43Mjc0MSAwLjMyNTYyNSA4LjcyNzQxIDAuNzI3MjgxQzguNzI3NDEgMS4xMjg5NCA5LjA1MzA0IDEuNDU0NTYgOS40NTQ3IDEuNDU0NTZIMTMuNTE3MUw2LjAzMTM4IDguOTQwMzFDNS43NDczNSA5LjIyNDM0IDUuNzQ3MzUgOS42ODQ3OCA2LjAzMTM4IDkuOTY4ODFDNi4xNzMzNSAxMC4xMTA4IDYuMzU5NDggMTAuMTgxOCA2LjU0NTYgMTAuMTgxOEM2LjczMTczIDEwLjE4MTggNi45MTc4OCAxMC4xMTA4IDcuMDU5ODggOS45Njg3OEwxNC41NDU2IDIuNDgzMDZWNi41NDU0N0MxNC41NDU2IDYuOTQ3MTIgMTQuODcxMyA3LjI3Mjc1IDE1LjI3MjkgNy4yNzI3NUMxNS42NzQ2IDcuMjcyNzUgMTYuMDAwMiA2Ljk0NzEyIDE2LjAwMDIgNi41NDU0N1YwLjcyNzI4MUMxNi4wMDAyIDAuMzI1NjI1IDE1LjY3NDUgMCAxNS4yNzI5IDBaIiBmaWxsPSIjMDA1MEE0Ii8+PHBhdGggZD0iTTEyLjM2MzYgNy4yNzI2OEMxMS45NjIgNy4yNzI2OCAxMS42MzYzIDcuNTk4MzEgMTEuNjM2MyA3Ljk5OTk2VjE0LjU0NTRIMS40NTQ1M1Y0LjM2MzU5SDhDOC40MDE2NiA0LjM2MzU5IDguNzI3MjggNC4wMzc5NiA4LjcyNzI4IDMuNjM2MzFDOC43MjcyOCAzLjIzNDY1IDguNDAxNjYgMi45MDkwNiA4IDIuOTA5MDZIMC43MjcyODFDMC4zMjU2MjUgMi45MDkwNiAwIDMuMjM0NjggMCAzLjYzNjM0VjE1LjI3MjdDMCAxNS42NzQzIDAuMzI1NjI1IDE2IDAuNzI3MjgxIDE2SDEyLjM2MzdDMTIuNzY1MyAxNiAxMy4wOTA5IDE1LjY3NDMgMTMuMDkwOSAxNS4yNzI3VjcuOTk5OTZDMTMuMDkwOSA3LjU5ODMxIDEyLjc2NTMgNy4yNzI2OCAxMi4zNjM2IDcuMjcyNjhaIiBmaWxsPSIjMDA1MEE0Ii8+PC9nPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDBfMjcxXzExODYiPjxyZWN0IHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0id2hpdGUiLz48L2NsaXBQYXRoPjwvZGVmcz48L3N2Zz4=');
  background-size: contain;
  vertical-align: initial;
}
#main-contents a:not([class]) {
  color: var(--blue);
  text-decoration: underline;
}

p {
  word-break: break-all;
}

#main-contents ul:not([class]) li:not(:first-child),
#main-contents ol:not([class]) li:not(:first-child) {
  margin-top: 8px;
  position: relative;
}
#main-contents ul:not([class]) li {
  list-style: disc outside;
  margin-left: 20px;
}
#main-contents ol:not([class]) li {
  list-style: decimal outside;
  margin-left: 20px;
}

h1 {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.5;
}

h2, h3, h4, h5, h6 {
  font-weight: 700;
  line-height: 1.6;
}

h2:not([class]) {
  font-size: 2.625rem;
}

h3:not([class]) {
  font-size: 1.5rem;
}

@media screen and (max-width: 767px) {
  h1 {
    font-size: 1.25rem;
  }
  h2:not([class]) {
    font-size: 1.25rem;
  }
  h3:not([class]) {
    font-size: 1.125rem;
  }
}

/* wysiwyg */
.wysiwyg *:first-child {
  margin-top: 0;
}

.wysiwyg *:last-child {
  margin-bottom: 0;
}

.wysiwyg h2 {
  font-size: 1.75rem;  /* 28px */
  font-weight: 700;
  line-height: 1.4;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--blue);
  margin-top: 70px;
  margin-bottom: 40px;
}

.wysiwyg h2 + h3 {
  font-size: 1.375rem;  /* 22px */
  font-weight: 700;
  line-height: 1.4;
  padding: 8px 20px;
  background-color: #F8F8F8;
  margin-top: 50px;
  margin-bottom: 40px;
}

.wysiwyg h3:not(h2 + h3) {
  font-size: 1.375rem;  /* 22px */
  font-weight: 700;
  line-height: 1.4;
  padding: 8px 20px;
  background-color: #F8F8F8;
  margin-top: 70px;
  margin-bottom: 40px;
}

.wysiwyg h4 {
  font-size: 1.125rem;  /* 18px */
  font-weight: 700;
  line-height: 1.4;
  margin-top: 50px;
  margin-bottom: 40px;
}

.wysiwyg h5 {
  font-size: 1rem;  /* 16px */
  font-weight: 700;
  line-height: 1.4;  
  margin-top: 50px;
  margin-bottom: 30px;
}

.wysiwyg h6 {
  font-size: 1rem;  /* 16px */
  font-weight: 400;
  line-height: 1.4;
  color: var(--blue);
  margin-top: 50px;
  margin-bottom: 30px;
}

.wysiwyg p {
  font-size: 1rem;  /* 16px */
  font-weight: 400;
  line-height: 2;
  color: var(--dark-gray);
  margin-top: 30px;
  margin-bottom: 30px;
}

.wysiwyg ul {
  line-height: 2.0;
  list-style: none;
  margin: 40px 0;
  padding: 0;
  text-indent: -24px;
  color: var(--dark-gray);
}

.wysiwyg ul p {
  display: inline;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  color: inherit;
  margin-left: -5px;
}

.wysiwyg ul li {
  margin-left: 23px;
  margin-bottom: 10px;
}

.wysiwyg ul > li::before {
  content: "";
  width: 15px;
  height: 15px;
  display: inline-block;
  background-color: var(--light-blue);
  border-radius: 100%;
  position:  relative;
  top: 2px;
  margin-right: 8px;
}

.wysiwyg ul ul {
  margin-top: 10px;
  margin-left: 17px;
  text-indent: -20px;
}

.wysiwyg ul ul li {
  margin-left: 0;
  border-radius: 50%;
  box-sizing: border-box;
  position: relative;
}

.wysiwyg ul ul li::before {
  border: 2px solid var(--light-blue);
  border-radius: 50%;
  box-sizing: border-box;
  content: "";
  height: 10px;
  position: relative;
  top: 0;
  background: white;
  width: 10px;
}

.wysiwyg ol {
  line-height: 2;
  counter-reset: ol-li;
  margin: 0 0 40px 0;
  text-indent: -22px;
  color: var(--dark-gray);
}

.wysiwyg ol li {
  margin-left: 23px;
  margin-bottom: 10px;
}

.wysiwyg ol li::before {
  font-weight: 700;
  counter-increment: ol-li;
  content: counter(ol-li)". ";
  color: var(--light-blue);
}

.wysiwyg a {
  color: var(--light-blue);
  border-bottom: 1px solid var(--light-blue);
  transition: border-bottom 0.1s
}

.wysiwyg a:hover {
  border-bottom: transparent 1px solid;
}

.wysiwyg img {
  width: 100% !important;
}

.wysiwyg figure {
  width: 100% !important;
  margin: 40px 0;
}

.wysiwyg figcaption {
  font-size: .875rem;  /* 14px */
  color: var(--dark-gray);
  line-height: 1.5;
  margin-top: 20px;
}

.wysiwyg hr {
  border-color: #C9CED1;
}

.wysiwyg pre {
  line-height: 1.5;
  background: #2D2D2D;
  margin: 40px 0;
  border-radius: 0;
}

.wysiwyg pre code {
  margin: 0;
  padding: 0;
}

.wysiwyg code {
  display: block;
  padding: 20px;
  background: #2d2d2d;
  margin: 40px 0;
  border-radius: 0;
}

.wysiwyg strong {
  font-weight: 700;
}

.wysiwyg blockquote {
  position: relative;
  font-size: .875rem;  /* 14px */
  line-height: 1.5;
  background: #F5F5F5;
  margin: 40px 0;
  padding: 39px 30px;
  background: var(--white);
}

.wysiwyg blockquote::before {
  content: "";
  position: absolute;
  top: 15px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2214%22%20viewBox%3D%220%200%2020%2014%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M18.5714%201.78246e-06L14.2857%201.40779e-06L11.4286%205.6L11.4286%2014L20%2014L20%205.6L15.7143%205.6L18.5714%201.78246e-06ZM7.14286%207.83341e-07L2.85714%204.08672e-07L-1.173e-06%205.6L-1.90735e-06%2014L8.57143%2014L8.57143%205.6L4.28571%205.6L7.14286%207.83341e-07Z%22%20fill%3D%22%23C9CED1%22%2F%3E%3C%2Fsvg%3E");
  width: 20px;
  height: 14px;
}

.wysiwyg blockquote::after {
  content: "";
  position: absolute;
  bottom: 15px;
  right: 30px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2214%22%20viewBox%3D%220%200%2020%2014%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M1.42857%2014H5.71429L8.57143%208.4L8.57143%200L0%200L0%208.4H4.28571L1.42857%2014ZM12.8571%2014H17.1429L20%208.4V0L11.4286%200L11.4286%208.4H15.7143L12.8571%2014Z%22%20fill%3D%22%23C9CED1%22%2F%3E%3C%2Fsvg%3E");
  width: 20px;
  height: 14px;
}

.wysiwyg table {
  width: 100% !important;
  height: auto !important;
  table-layout: fixed;
  margin-top: 40px;
  margin-bottom: 70px;
  display: block;
  overflow-x: auto;
}

.wysiwyg table tbody {
  width: 100%;
  display: table;
}

.wysiwyg table tr th {
  font-size: .875rem;  /* 14px */
  line-height: 1.5;
  padding: 15px 12px;
  border: 1px solid #DDDDDD;
  background: #F8FBFF;
  vertical-align: middle;
}

.wysiwyg table tr td {
  font-size: .875rem;  /* 14px */
  line-height: 1.5;
  padding: 15px 12px;
  border: 1px solid #ddd;
  vertical-align: middle;
  background: var(--white);
}

.wysiwyg table p {
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  color: inherit;
  margin: 0;
}

.wysiwyg table ul {
  margin: 0 !important;
}

.wysiwyg table ul ul {
  margin-left: 20px !important;
  margin-top: 10px !important;
}

.wysiwyg table ol {
  margin: 0 !important;
}

@media screen and (max-width: 1024px) {
  .wysiwyg h1 {
    font-size: 1.375rem;  /* 22px */
    margin-top: 20px;
    margin-bottom: 20px;
  }

  .wysiwyg h2 {
    font-size: 1.25rem;  /* 20px */
    margin-top: 60px;
  }

  .wysiwyg h3:not(.post-appendarea-wrapper h3) {
    font-size: 1.125rem !important;  /* 18px */
    margin-bottom: 30px;
    padding: 6px 10px;
  }

  .wysiwyg h4 {
    font-size: 1rem;  /* 16px */
    margin-top: 40px;
    margin-bottom: 30px;
  }

  .wysiwyg h5 {
    font-size: .9375rem;  /* 15px */
    margin-top: 40px;
    margin-bottom: 30px;
  }

  .wysiwyg h6 {
    font-size: .9375rem;  /* 15px */
    margin-top: 40px;
    margin-bottom: 30px;
  }

  .wysiwyg pre {
    margin: 30px 0;
  }

  .wysiwyg code {
    margin: 30px 0;
  }

  .wysiwyg blockquote {
    margin: 30px 0;
    padding: 39px 20px;
  }

  .wysiwyg table tr th, 
  .wysiwyg table tr td {
    font-size: .75rem;  /* 12px */
  }

  .wysiwyg ul {
    font-size: .9375rem;  /* 15px */
    margin: 30px 0;
    text-indent: -20px;
  }

  .wysiwyg ul ul {
    margin-left: 14px;
  }

  .wysiwyg p {
    font-size: .9375rem;  /* 15px */
    line-height: 1.8;
    margin: 30px 0;
  }
}
/* BreadCrumb

====================================================*/
#BreadCrumb ul.breadcrumb,#BreadCrumb ul.hs-breadcrumb-menu {
  --fs: 12;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 5px;
  padding: 10px 20px;
  clear: both;
  max-width: 1140px;
  list-style-type: none;
  margin-bottom: 40px;
  position: relative;
}

#BreadCrumb ul.breadcrumb li,#BreadCrumb ul.hs-breadcrumb-menu li {
  display: inline;
  float: none
}

#BreadCrumb ul.breadcrumb li a,#BreadCrumb ul.hs-breadcrumb-menu li a {
  color: var(--gray);
}

#BreadCrumb ul.breadcrumb li a:hover,#BreadCrumb ul.hs-breadcrumb-menu li a:hover {
  color: var(--black);
  text-decoration: none
}

#BreadCrumb ul.breadcrumb li:after,#BreadCrumb ul.hs-breadcrumb-menu li:after {
  content: ">";
  color: var(--gray);
  margin-left: 5px;
  margin-right: 5px
}

#BreadCrumb ul.breadcrumb li:last-child:after,#BreadCrumb ul.hs-breadcrumb-menu li:last-child:after {
  content: none
}

#BreadCrumb ul.breadcrumb li.post span,#BreadCrumb ul.hs-breadcrumb-menu li.post span {
  color: #707070
}

#BreadCrumb ul.breadcrumb li.hs-breadcrumb-menu-item,#BreadCrumb ul.hs-breadcrumb-menu li.hs-breadcrumb-menu-item {
  float: none;
  padding: 0
}

#BreadCrumb ul.breadcrumb li .hs-breadcrumb-menu-divider:before,#BreadCrumb ul.hs-breadcrumb-menu li .hs-breadcrumb-menu-divider:before {
  display: none
}
/* Button

====================================================*/
.c-button--wrap {
  gap: 20px 40px;
}
.c-button {
  padding: 12px 24px;
  min-width: 180px;
  background-color: var(--primary);
  border-radius: 60px;
  display: inline-block;
  line-height: 1.2;
  color: var(--white);
  font-size: .875rem;
  font-weight: 700;
  box-shadow: 2px 4px 13px 2px rgba(0, 0, 0, 0.12);
  position: relative;
  transition: .4s;
}

.c-button::before {
  aspect-ratio: 1;
  background-color: var(--white);
  border-radius: 100px;
  content: '';
  display: inline-block;
  height: auto;
  width: 20px;
  position: absolute;
  right: 12px;
  top: calc(50% - 10px);
}
.c-button::after {
  aspect-ratio: 1;
  background: url(/hubfs/21507825/recruit/common/icon-arrow.svg) no-repeat center/contain;
  content: '';
  display: inline-block;
  height: auto;
  width: 9px;
  position: absolute;
  right: 17.5px;
  top: calc(50% - 4.5px);
}

.c-button__large {
  background-color: var(--orange) !important;
  line-height: 1.4;
  max-width: 350px;
  min-width: initial !important;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.c-button__large::after {
  background: url(/hubfs/21507825/recruit/common/arrow-right_orange.svg) no-repeat center/contain;
}

@media (hover: hover) {
  a.c-button:hover,
  a:hover span.c-button {
    background-color: var(--sub);
  }
  a.c-button:hover::after,
  a:hover span.c-button::after {
    animation: 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s 1 normal none running arrow-line;
  }
  a.c-button__large:hover,
  a:hover span.c-button__large {
    background-color: var(--yellow) !important;
  }
}

@media screen and (min-width: 1180px) {
  .c-button {
    padding: 12px 24px;
    min-width: 220px;
    font-size: 1.125rem;
  }
  .c-button__large {
    min-width: 350px !important;
    min-height: 70px;
    font-size: 1.25rem !important;
  }
}
@media screen and (max-width: 819px) {
  .c-button--wrap {
    flex-direction: column;
  }
}
.m-form-section .p-content-title {
  max-width: 1100px;
  width: 94%;
  margin-left: auto;
  margin-right: auto;
}

.form-wrap {
  padding: 3.75rem;
  background-color: var(--white);
  border-radius: 8px;
  box-shadow: 0px 4px 30px 8px rgba(90, 90, 90, 0.07);
}

@media screen and (max-width: 767px) {
  .form-wrap {
    padding: 40px 20px;
  }
}


/* form setting */
form.hs-form fieldset {
  margin: 0 0 30px;
  max-width: initial;
}

form.hs-form fieldset.hidden {
  margin: 0;  
}

form.hs-form fieldset.form-columns-0 {
  margin-bottom: 0;
}

form.hs-form fieldset.form-columns-1 .hs-form-field {
  width: 100%;
}

form.hs-form fieldset.form-columns-1 .hs-form-field .hs-input {
  width: 100%;
}

form.hs-form fieldset.form-columns-2 .hs-form-field:last-child {
  margin-left: 26px;
}

section.contents form.hs-form fieldset.form-columns-2 .hs-form-field:last-child {
  margin-left: 20px;
}

form.hs-form fieldset .hs-fieldtype-booleancheckbox {
  text-align: center;
}

form.hs-form .hs-fieldtype-file .input {
  border: none !important;
}

form.hs-form .hs_product_image legend {
  margin-bottom: 10px;
}

form.hs-form input[type="file"] {
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  color: var(--dark-gray);
}

form.hs-form input[type="file"]:before {
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  color: var(--dark-gray);
}

form.hs-form .form-columns-0 .hs-richtext {
  width: 100%;
}
form.hs-form .form-columns-1 .hs-richtext {
  margin: 0 auto 32px;
  max-width: 450px;
  width: 100%;
  font-size: .875rem;
}

form.hs-form fieldset p {
  font-size: 14px;
}

form.hs-form .privacySet {
  margin: 0;
  text-align: center;
}

form.hs-form .privacySet h3 {
  font-weight: 700;
  font-size: 18px;
  margin-top: 0.8em !important;
  margin-bottom: 0.8em;
  color: var(--default);
}
form.hs-form .privacySet p {
  margin: 0 0 1em 0;
}

form.hs-form .privacySet p a {
  text-decoration: underline;
}

form.hs-form .privacySet p a:hover {
  text-decoration: none;
}

form.hs-form .hs-error-msgs {
  margin: .5em 0 0 0;
  list-style: none;
}

form.hs-form .hs_error_rollup {
  text-align: center;
  margin: 0 0 1em 0;
}

form.hs-form .hs-form-field .grecaptcha-badge {
  text-align: center;
  margin: 0 auto 30px;
}

form.hs-form fieldset.form-columns-2 {
  display: grid;
  grid-template-columns: 48% 48%;
}

form.hs-form fieldset.form-columns-3 {
  display: grid;
  grid-template-columns: 31% 31% 31%;
  grid-column-gap: 23px;
}

section.contents form.hs-form fieldset.form-columns-3 {
  grid-column-gap: 19px;
}

form.hs-form fieldset.form-columns-2 .hs-form-field {
  width: 100%;
}

form.hs-form fieldset.form-columns-3 .hs-form-field {
  width: 100%;
}

form.hs-form fieldset.form-columns-2 .hs-form-field:not(.hs-fieldtype-checkbox):not(.hs-fieldtype-radio),
section.contents form.hs-form fieldset.form-columns-2 .hs-form-field:not(.hs-fieldtype-checkbox):not(.hs-fieldtype-radio),
section.contents form.hs-form fieldset.form-columns-3 .hs-form-field:not(.hs-fieldtype-checkbox):not(.hs-fieldtype-radio) {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

form.hs-form fieldset legend {
  font-size: 14px;
  line-height: 1.45;
  color: var(--default);
  margin: 0 0 8px;
}

form.hs-form fieldset legend a {
  border-bottom: 1px solid var(--primary);
  color: var(--primary);
  display: inline-block;
  margin-bottom: -1px;
}

form.hs-form fieldset legend a:hover {
  border: 0;
}

form.hs-form p.text {
  font-size: 16px;
  line-height: 2;
  color: var(--default);
  margin-bottom: 30px;
}

form.hs-form fieldset ul.inputs-list.multi-container {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}

form.hs-form fieldset label:not(.hs-form-radio-display):not(.hs-error-msg):not(.hs-form-booleancheckbox-display):not(.hs-form-checkbox-display) {
  cursor: default;
  position: relative;
  color: var(--default);
  text-align: left;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 1.4px;
  margin-bottom: 4px;
  display: inline-block;
}

form.hs-form .hs-error-msgs label.hs-error-msg,
form.hs-form .hs_error_rollup label.hs-main-font-element {
  font-size: 13px;
  font-weight: 400;
  line-height: 1.45;
  color: #ff0000;
}


form.hs-form fieldset .hs-form-field .input {
  margin: 0;
}

form.hs-form fieldset .hs-form-field .input textarea {
  width: 100%;
  padding: 17px 14px;
  margin-right: 0;
  border: 1px solid #C9CED1;
  border-radius: 3px;
}

form.hs-form fieldset .hs-form-field .input input:not([type=radio]):not([type=file]) {
  border: 1px solid #C9CED1;
  border-radius: 3px;
  height: 40px;
  margin-right: 0;
  padding: 12px 12px;
  width: 100%;
  background-color: #fff;
}
form.hs-form fieldset .hs-form-field .input input:-internal-autofill-selected {
  background-color: var(--light-red) !important;
}
form.hs-form fieldset .hs-form-field .input:has(input[type=file]) {
  padding: 8px 0;
}

form.hs-form fieldset .hs-form-field .input input::placeholder {
  font-size: 16px;
  font-weight: 400;
  color: #A6A6A6;

}

form.hs-form fieldset .hs-form-field .input textarea::placeholder {
  font-size: 16px;
  font-weight: 400;
  color: #A6A6A6;
}

form.hs-form fieldset .hs-form-field:not(.hs-fieldtype-booleancheckbox):not(.hs-fieldtype-checkbox) .input input:focus,
form.hs-form fieldset .hs-form-field .input textarea:focus {
  outline: 0;
}

form.hs-form fieldset .hs-form-field .input input.invalid,
form.hs-form fieldset .hs-fieldtype-select .input select.invalid,
form.hs-form fieldset .hs-fieldtype-select .input:has(select.invalid):after,
form.hs-form ul.inputs-list.invalid,
form.hs-form fieldset .hs-fieldtype-file:has(.hs-error-msgs) .input:has(input[type=file]) {
  background: var(--light-red);
}

form.hs-form fieldset label .hs-form-required {
  color: var(--red);
  font-size: 12px;
}

form.hs-form .form-privacy {
  font-size: 12px;
  line-height: 1.45;
  color: var(--black);
  margin-top: 10px;
  margin-bottom: 35px;
  display: flex;
  gap: 20px;
}
form.hs-form .form-privacy > a {
  max-width: 80px;
  width: 100%;
}
form.hs-form fieldset .form-privacy p.att {
  font-size: 12px;
}
form.hs-form .form-privacy p.att a {
  color: var(--primary);
  border-bottom: 1px solid var(--primary);
  margin-bottom: -1px;
}


form.hs-form .hs-form fieldset .hs-fieldtype-booleancheckbox span {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.45;
  color: var(--default);
}

form.hs-form .actions:has(.hs-button.primary) {
  text-align: center;
}

form.hs-form .hs-button.primary {
  background: var(--orange) url('//21507825.fs1.hubspotusercontent-na1.net/hubfs/21507825/raw_assets/public/recruit/images/icons/arrow-right_orange.svg')no-repeat 95% center;
  color: var(--white);
  cursor: pointer;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 1.6px;
  width: 350px;
  padding: 20px;
  text-align: center;
  border-radius: 50px;
  transition: .3s;
}

form.hs-form .hs-button.primary:hover {
  opacity: .8;
}

form.hs-form [type=checkbox]:checked {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0'/%3E%3C/svg%3E");
}

form.hs-form [type=checkbox]:checked, form.hs-form [type=checkbox]:checked:focus {
  border-color: transparent;
  background-color: var(--primary) !important;
  background-size: 22px 22px;
  background-position: center;
  background-repeat: no-repeat;
  border: none !important;
}

form.hs-form fieldset .hs-fieldtype-radio label:has(input)::before {
  content: "";
  background: #F5F5F5;
  border-radius: 100%;
  border: 1px solid #c9ced1;
  display: inline-block;
  min-width: 20px;
  height: 20px;
  position: relative;
  text-align: center;
  transition: all 250ms ease;
}

form.hs-form fieldset .hs-fieldtype-radio label:has([type=radio]:checked)::before {
  background-color: var(--primary);
  box-shadow: inset 0 0 0 4px var(--white);
}

form.hs-form fieldset .hs-fieldtype-radio label:has(input) {
  display: flex;
  grid-column-gap: 15px;
  align-items: center;
  width: fit-content;
  padding: 8px;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.45;
  color: var(--default);
}

form.hs-form fieldset .hs-fieldtype-radio label>input {
  display: none;
}

form.hs-form fieldset .hs-form-booleancheckbox label {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  margin: 0 auto;
  padding: 8px;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.45;
  color: var(--default);
}
form.hs-form fieldset .hs_privacy_policy_check_leadplus .hs-form-booleancheckbox label {
  text-align: left;
}

form.hs-form fieldset .hs-fieldtype-checkbox .input label {
  display: flex;
  grid-column-gap: 15px;
  align-items: center;
  margin: 0 auto;
  padding: 8px;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.45;
  cursor: default;
  color: var(--default);
}

form.hs-form fieldset .hs_privacy_policy_check:has(ul.hs-error-msgs) .hs-form-booleancheckbox label {
  background: #FBEFEE;
}

form.hs-form fieldset .hs-form-booleancheckbox label input,
form.hs-form fieldset .hs-fieldtype-checkbox label input {
  width: 20px !important;
  height: 20px !important;
  max-width: 20px;
  min-width: 20px;
  padding: 0 !important;
  background: var(--white);
}

form.hs-form fieldset .hs-form-booleancheckbox label input:focus {
  outline: 0;
}

form.hs-form fieldset .hs-fieldtype-checkbox label input:focus {
  outline: 0;
}

form.hs-form fieldset .hs-fieldtype-select .input select {
  border: 1px solid #C9CED1;
  border-radius: 3px;
  color: var(--default);
  font-size: 1rem;
  height: 48px;
  line-height: 1.45;
  margin-right: 0;
  padding: 10px 14px;
  width: 100% !important;
  background: #fff;
}

form.hs-form fieldset .hs-fieldtype-select .input select option {
  color: var(--default);
}
form.hs-form fieldset .hs-fieldtype-select .hs-input.is-placeholder, form.hs-form fieldset .hs-fieldtype-select .input select option:first-child {
  color: #999;
}

form.hs-form fieldset .hs-fieldtype-date .input>.hs-dateinput input {
  font-size: 16px;
  line-height: 1.45;
  color: var(--default);
}

form.hs-form fieldset .hs-fieldtype-select .input {
  position: relative;
  width: 100%;
}

form.hs-form fieldset .hs-fieldtype-select .input:after {
  align-items: center;
  background: #fff;
  content: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2236%22%20viewBox%3D%220%200%2024%2036%22%20fill%3D%22none%22%3E%3Cg%20clip-path%3D%22url(%23clip0_1818_4177)%22%3E%3Cpath%20d%3D%22M0.857422%200.999023L0.999268%2034.999%22%20stroke%3D%22%236C757D%22%2F%3E%3Cpath%20d%3D%22M13%2012.999L18%207.99902L23%2012.999%22%20stroke%3D%22%236C757D%22%2F%3E%3Cpath%20d%3D%22M23%2023.999L18%2028.999L13%2023.999%22%20stroke%3D%22%236C757D%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_1818_4177%22%3E%3Crect%20width%3D%2224%22%20height%3D%2236%22%20fill%3D%22white%22%20transform%3D%22translate(0%20-0.000976562)%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E');
  display: flex;
  font-size: 10px;
  height: 25px;
  padding-left: 15px;
  padding-top: 3px;
  pointer-events: none;
  position: absolute;
  right: 22px;
  top: 12px;
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  width: 30px;
}

form.hs-form fieldset .hs-fieldtype-select .input select:focus {
  outline: 0;
}

form.hs-form fieldset .hs-form-booleancheckbox label span {
  position: relative;
  display: flex;
  text-align: left;
}
.legal-consent-container .hs-form-booleancheckbox-display > span {
  margin-left: 10px !important;
}

@media screen and (max-width: 1024px) {
  h3.form-title {
    font-size: 18px;
    margin-bottom: 20px;
  }

  form.hs-form fieldset {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin: 0;
  }

  form.hs-form fieldset.form-columns-0,
  form.hs-form fieldset.form-columns-1 .hs-form-field,
  form.hs-form fieldset.form-columns-2 .hs-form-field,
  form.hs-form fieldset.form-columns-3 .hs-form-field {
    width: 100% !important;
    margin: 0 0 30px;
  }

  form.hs-form fieldset.form-columns-2 .hs-form-field .hs-input {
    width: 100% !important;
  }

  form.hs-form fieldset .input:last-child {
    margin: 0 0 0 0;
  }

  form.hs-form .privacySet {
    margin: 0 0 30px 0;
    text-align: center;
  }

  form.hs-form #agreeWrap {
    display: flex !important;
    align-items: flex-start;
    text-align: left;
  }

  form.hs-form fieldset.form-columns-2 .hs-form-field:last-child {
    margin-left: 0;
  }

  section.contents form.hs-form fieldset.form-columns-2 .hs-form-field:last-child {
    margin-left: 0;
  }

  form.hs-form p.text {
    font-size: 15px;
  }

  form.hs-form .form-privacy {
    font-size: 15px;
    margin: 0 0 30px;
  }

  form.hs-form .form-privacy a.tac {
    width: 100%;
    margin-top: 0;
    margin-right: 0;
    margin-bottom: 20px;
  }

  form.hs-form fieldset label {
    font-size: 12px;
  }

  form.hs-form .hs-button.primary {
        width: 280px;
  }

  form.hs-form fieldset .hs-form-booleancheckbox label {
    font-size: 15px;
  }

  form.hs-form .hs_recaptcha {
    margin-top: 10px;
  }

  form.hs-form fieldset .hs-fieldtype-radio label:has(input) {
    font-size: 15px;
    width: 100%;
  }

  form.hs-form fieldset .hs-fieldtype-checkbox .input label {
    font-size: 15px;
  }

  form.hs-form fieldset .hs-fieldtype-select .input select {
    font-size: 15px;
  }

  form.hs-form fieldset .hs-fieldtype-date .input input[type=date] {
    font-size: 15px;
  }

  form.hs-form fieldset .hs-fieldtype-date .input input[type=file] {
    font-size: 15px;
  }
}

@media screen and (max-width: 599px) {
  form.hs-form fieldset.form-columns-2,
  form.hs-form fieldset.form-columns-3 {
    display: block;
  }
  form.hs-form .hs-button.primary {
    font-size: 1rem;
    padding: 15px 30px;
  }
}

/* Components */
.head {
  width: 100%;
  height: 80px;
  top: 0;
  position: fixed;
  z-index: 400;
  width: 100%;
  background-color: white;
}
.head.down-move {
  box-shadow: 0 2px 2px rgba(0, 0, 0, .1);
}

body:not(.drawer-open) .head .h-logo {
  position: relative;
  z-index: 411;
}
.head .h-logo a#logo {
  top: 15px;
  left: var(--padding-x);
}

.head a#logo {
  display: block;
  position: fixed;
  top: 40px;
  left: 24px;
  z-index: 410;
  width: 250px;
}
.head a#logo img {
  width: 100%;
  height: auto;
}

.head.is-search a#logo img {
  -webkit-filter: brightness(0) invert(1);
  filter: brightness(0) invert(1);
}

.head .responsive-tab {
  position: absolute;
  top: 0;
  right: 80px;
}

#gNavi ul.drawer-menu {
  margin: 0 0 0 0;
}


#gNavi ul li a {
  font-size: 15px !important;
  text-decoration: none;
  font-weight: 700;
  text-align: left;
  color: var(--default);
}

@media (hover: hover) {
  #gNavi ul li a:hover {
    color: var(--primary);
  }
}

.head.is-search #gNavi ul li a {
  color: #fff;
}

.head.is-fixed:before {
  content: "";
  display: block;
  background-color: rgba(255, 255, 255, 1);
  /* background:#ccc; */
  height: 110px;
  position: fixed;
  z-index: 80;
  width: 100%;
  border-bottom: 1px solid #dccdcd;
  box-sizing: border-box;
}

.home .head.is-fixed a#logo {
  display: block;
}


.drawer-dropdown-menu {
  padding: .8em 0 !important;
  z-index: 90;
}

.drawer-dropdown-menu li a {
  padding: .5em 1em .5em 1em !important;
  line-height: 1.8em !important;
  color: #000 !important;
}

.drawer-dropdown-menu li a:before {
  content: "‐";
  vertical-align: middle;
}

.drawer-open .head .drawer-hamburger {
  top: 0;
}

@media screen and (max-width: 1200px) {

    .drawer-nav {
      background-color: rgba(23, 23, 30, 1) !important;
      box-sizing: border-box;
      text-align: center;
    }

    #navWrap {
      padding: 130px 0 30px 0 !important;
    }

    #gNavi ul.drawer-menu {
      margin: 0 0 0 0;
      padding: 0 0 0 0;
    }

    #gNavi ul li:nth-child(1) {
      display: block;
    }

    .drawer-dropdown-menu {
      background: none !important;
    }

    .drawer-navbar-header {
      height: 0 !important;
    }

    .drawer-navbar .drawer-brand {
      line-height: 3.75rem !important;
    }

    .drawer-navbar .drawer-nav {
      padding-top: 0 !important;
    }

    #gNavi .drawer-menu-item {
      position: relative;
      padding: 1em 50px 1em 2em;
      margin: 0 0 0 0;
      border-bottom: 1px solid #3C3C3C;
      color: #fff !important;
      font-weight: 400 !important;
      z-index: 0;
    }

    #gNavi .drawer-menu-item:hover {
      color: #fff !important;
      opacity: 1 !important;
    }

    #gNavi .drawer-dropdown.open .drawer-menu-item {
      border-bottom: none !important;
    }

    li.searchDropdown a {
      display: none !important;
    }

    .drawer-navbar .drawer-dropdown-menu.x2 {
      display: block;
      position: absolute;
      width: 100%;
      border: none;
      top: 80px !important;
      ;
      left: 0;
      background-color: rgba(255, 255, 255, 1);
      padding: 0 0 !important;
      z-index: 999;
    }

    .drawer-navbar .drawer-dropdown-menu.x2 form.searchKeyword {
      width: 90%;
      margin: 0 auto 0 auto;
      position: relative;
    }

    .drawer-navbar .drawer-dropdown-menu.x2 form.searchKeyword input[type="text"] {
      width: 100%;
      box-sizing: border-box;
      border-radius: 5px;
      padding: .5em .3em .5em 40px;
      border: none;
      color: #000;
      font-weight: 300 !important;
      background: #F4F4F4;
      text-align: left;
    }


    .drawer-navbar .drawer-dropdown-menu.x2 form.searchKeyword:after {
      content: "";
      display: block;
      width: 18px;
      height: 18px;
      background: url('data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2.42928%202.4299C4.04496%200.813039%206.17758%20-0.00120963%208.295%201.34876e-06C10.413%20-0.00120963%2012.545%200.813039%2014.1607%202.4299C15.7775%204.04558%2016.5924%206.1782%2016.59%208.29499C16.5918%209.77392%2016.1853%2011.2547%2015.3967%2012.567L19.4136%2016.5839C20.1955%2017.3658%2020.1955%2018.6329%2019.4136%2019.4148C18.6323%2020.1967%2017.3646%2020.1967%2016.5833%2019.4148L12.5658%2015.3973C11.2541%2016.1865%209.77271%2016.5924%208.295%2016.5906C6.17762%2016.5924%204.04496%2015.7782%202.42931%2014.1613C0.813044%2012.5456%20-0.001791%2010.4135%205.72205e-06%208.29496C-0.00245476%206.1782%200.813004%204.04558%202.42928%202.4299ZM4.6944%2011.8968C5.69236%2012.8941%206.98636%2013.3861%208.295%2013.3886C9.60364%2013.3861%2010.897%2012.8942%2011.8962%2011.8968C12.8936%2010.8976%2013.3855%209.60422%2013.388%208.29499C13.3855%206.98698%2012.8936%205.69299%2011.8962%204.69439C10.897%203.69705%209.60364%203.20508%208.295%203.20262C6.98636%203.20508%205.69236%203.69701%204.69377%204.69439C3.69643%205.69299%203.20446%206.98698%203.202%208.29499C3.20446%209.60426%203.69643%2010.8976%204.6944%2011.8968Z%22%20fill%3D%22%23333%22%2F%3E%3C%2Fsvg%3E') center center no-repeat;
      background-size: contain;
      position: absolute;
      top: 50%;
      left: 14px;
      z-index: 999;
      color: #fff;
      margin-top: -9px;
  }

  .drawer-dropdown-menu {
    margin: -1em 0 1em 0 !important;
  }

  .drawer-dropdown-menu li a {
    padding: .4em 1em .4em 0em !important;
    line-height: 1.8em !important;
    color: #fff !important;
    border-bottom: 1px solid #3C3C3C;
    margin: 0 0 0 60px;
    position: relative;
  }


  .drawer-dropdown-menu li a:before {
    display: none;
  }


  .head.is-fixed .drawer-hamburger-icon,
  .head.is-fixed .drawer-hamburger-icon:before,
  .head.is-fixed .drawer-hamburger-icon:after {
    background-color: #17171E;
  }

  .head.is-fixed #gNavi ul.drawer-menu {
    margin: 0 0 0 0;
    position: static;
    left: 0;
  }

  .head.is-fixed #gNavi ul li a {
    color: #fff;
  }


  .head.is-fixed:before {
    height: 60px;
  }


  .head.is-fixed .drawer-menu-item #icon_blank path,
  .head.is-fixed .drawer-menu-item #icon_blank rect,
  .head.is-fixed .drawer-menu-item #icon_blank polygon {
    fill: #fff;
  }

  .head .h-logo a#logo {
    top: 15px;
    left: 20px;
    max-width: 240px;
  }

}

@media screen and (max-width: 767px) {
  .head {
    height: 60px;
  }
  .head .h-logo a#logo {
    top: 15px;
    left: 15px;
    max-width: 160px;
  }
  .head .h-logo a#logo svg {
    width: 60px;
  }

}
.bottom-wrapper {
  background-color: #33485E;
  color: white;
}
.footer-inner {
  margin: auto;
  padding: 50px 0;
  max-width: 800px;
}
.footer-inner__info {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.footer-logo {
  max-width: 105px;
}
.bottom-wrapper .copyright {
  height: 70px;
  border-top: 1px solid #697d92;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.bottom-wrapper .copyright small {
  font-size: 13px;
}

/* footer-nav */
#hs_menu_wrapper_foot_nav > ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0 60px;
}
#hs_menu_wrapper_foot_nav > ul a {
  display: inline-block;
  color: white;
  font-size: 15px;
  font-weight: 700;
  white-space: nowrap;
  transition: .4s;
}
#hs_menu_wrapper_foot_nav > ul a:hover {
  opacity: .7;
}

#hs_menu_wrapper_foot_nav > ul .hs-menu-depth-1:not(:nth-child(1)) > a {
  margin-bottom: 1rem;
}

#hs_menu_wrapper_foot_nav > ul .hs-menu-depth-1:last-child .child-items > ul {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: .1875rem;
}
#hs_menu_wrapper_foot_nav > ul .hs-menu-depth-1:last-child .child-items a {
  font-weight: 700;
}
#hs_menu_wrapper_foot_nav > ul .hs-menu-depth-1:last-child .child-items a span {
  display: block;
  font-size: 10px;
  font-weight: 400;
  color: #bae4ff;
}

#hs_menu_wrapper_foot_nav > ul .hs-menu-depth-1:nth-child(1) .hs-menu-depth-2 > a {
  margin-top: .5rem;
  font-size: .875rem;
  font-weight: 400;
}

.footer-inner a:not(.bottom-logo)[target="_blank"]::after {
  margin-left: 8px;
  content: '';
  display: inline-block;
  width: 16px;
  height: 16px;
  background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMyIgaGVpZ2h0PSIxMiIgdmlld0JveD0iMCAwIDEzIDEyIiBmaWxsPSJub25lIj48cGF0aCBkPSJNMTAuNjI1IDExLjI1SDEuNjI1QzEuNTI1NTQgMTEuMjUgMS40MzAxNiAxMS4yMTA1IDEuMzU5ODMgMTEuMTQwMkMxLjI4OTUxIDExLjA2OTggMS4yNSAxMC45NzQ1IDEuMjUgMTAuODc1VjEuODc1QzEuMjUgMS43NzU1NCAxLjI4OTUxIDEuNjgwMTYgMS4zNTk4MyAxLjYwOTg0QzEuNDMwMTYgMS41Mzk1MSAxLjUyNTU0IDEuNSAxLjYyNSAxLjVINy42MjVDNy43MjQ0NiAxLjUgNy44MTk4NCAxLjUzOTUxIDcuODkwMTcgMS42MDk4NEM3Ljk2MDQ5IDEuNjgwMTYgOCAxLjc3NTU0IDggMS44NzVDOCAxLjk3NDQ2IDcuOTYwNDkgMi4wNjk4NCA3Ljg5MDE3IDIuMTQwMTZDNy44MTk4NCAyLjIxMDQ5IDcuNzI0NDYgMi4yNSA3LjYyNSAyLjI1SDJWMTAuNUgxMC4yNVY0Ljg3NUMxMC4yNSA0Ljc3NTU0IDEwLjI4OTUgNC42ODAxNiAxMC4zNTk4IDQuNjA5ODRDMTAuNDMwMiA0LjUzOTUxIDEwLjUyNTUgNC41IDEwLjYyNSA0LjVDMTAuNzI0NSA0LjUgMTAuODE5OCA0LjUzOTUxIDEwLjg5MDIgNC42MDk4NEMxMC45NjA1IDQuNjgwMTYgMTEgNC43NzU1NCAxMSA0Ljg3NVYxMC44NzVDMTEgMTAuOTc0NSAxMC45NjA1IDExLjA2OTggMTAuODkwMiAxMS4xNDAyQzEwLjgxOTggMTEuMjEwNSAxMC43MjQ1IDExLjI1IDEwLjYyNSAxMS4yNVpNMTEuMzc1IDAuNzVIOS4xMjVDOS4wMjU1NCAwLjc1IDguOTMwMTYgMC43ODk1MDkgOC44NTk4MyAwLjg1OTgzNUM4Ljc4OTUxIDAuOTMwMTYxIDguNzUgMS4wMjU1NCA4Ljc1IDEuMTI1QzguNzUgMS4yMjQ0NiA4Ljc4OTUxIDEuMzE5ODQgOC44NTk4MyAxLjM5MDE3QzguOTMwMTYgMS40NjA0OSA5LjAyNTU0IDEuNSA5LjEyNSAxLjVIMTAuNDY3NUw2LjIzMzc1IDUuNzMzNzVDNi4xOTg2IDUuNzY4NjEgNi4xNzA3IDUuODEwMDkgNi4xNTE2NyA1Ljg1NTc4QzYuMTMyNjMgNS45MDE0OCA2LjEyMjgzIDUuOTUwNSA2LjEyMjgzIDZDNi4xMjI4MyA2LjA0OTUgNi4xMzI2MyA2LjA5ODUyIDYuMTUxNjcgNi4xNDQyMkM2LjE3MDcgNi4xODk5MSA2LjE5ODYgNi4yMzEzOSA2LjIzMzc1IDYuMjY2MjVDNi4yNjg2MSA2LjMwMTQgNi4zMTAwOSA2LjMyOTMgNi4zNTU3OCA2LjM0ODMzQzYuNDAxNDggNi4zNjczNyA2LjQ1MDUgNi4zNzcxNyA2LjUgNi4zNzcxN0M2LjU0OTUgNi4zNzcxNyA2LjU5ODUyIDYuMzY3MzcgNi42NDQyMiA2LjM0ODMzQzYuNjg5OTEgNi4zMjkzIDYuNzMxMzkgNi4zMDE0IDYuNzY2MjUgNi4yNjYyNUwxMSAyLjAyODc1VjMuMzkzNzVDMTEgMy40OTMyMSAxMS4wMzk1IDMuNTg4NTkgMTEuMTA5OCAzLjY1ODkyQzExLjE4MDIgMy43MjkyNCAxMS4yNzU1IDMuNzY4NzUgMTEuMzc1IDMuNzY4NzVDMTEuNDc0NSAzLjc2ODc1IDExLjU2OTggMy43MjkyNCAxMS42NDAyIDMuNjU4OTJDMTEuNzEwNSAzLjU4ODU5IDExLjc1IDMuNDkzMjEgMTEuNzUgMy4zOTM3NVYxLjEyNUMxMS43NSAxLjAyNTU0IDExLjcxMDUgMC45MzAxNjEgMTEuNjQwMiAwLjg1OTgzNUMxMS41Njk4IDAuNzg5NTA5IDExLjQ3NDUgMC43NSAxMS4zNzUgMC43NVoiIGZpbGw9IndoaXRlIi8+PC9zdmc+');
  background-size: contain;
  vertical-align: middle;
}

@media screen and (max-width: 1023px) {
  .footer-inner {
    padding-bottom: 20px;
    max-width: 800px;
    width: calc(100% - 40px);
  }
}

@media screen and (max-width: 819px) {
  .footer-inner {
    flex-direction: column;
  }
  .footer-inner__info {
    margin-bottom: 20px;
  }
  #hs_menu_wrapper_foot_nav > ul {
    flex-direction: column;
    gap: 1rem;
  }
  #hs_menu_wrapper_foot_nav > ul .hs-menu-depth-1:first-child .hs-menu-depth-2 > a {
    font-size: 15px;
    font-weight: 700;
    margin-top: 1rem
  }
  .bottom-wrapper .copyright {
    padding-left: 20px;
    padding-right: 70px;
  }
  .bottom-wrapper .copyright small {
    font-size: 11px;
  }
}

@media screen and (max-width: 767px) {
  .bottom-wrapper .copyright {
    padding-top: 15px;
    padding-bottom: 70px;
    height: auto;
  }
}

/* pageTop */
#pageTop{
	display:table;
	position:fixed;
	bottom:-200px;
	right:0;
	margin:0;
	padding:0;
	width:70px;
	height:70px;
	text-align:center;
	z-index:100;
	background:var(--primary);
}
#pageTop a {
	display:table-cell;
	width:70px;
	height:70px; 
	vertical-align:middle;
	line-height:1em;
	text-decoration:none;
}

#pageTop img {
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-o-transition: all .3s ease;
}


#pageTop a:hover img {
	opacity:.8;
}

@media screen and (max-width: 1024px) {
	#pageTop{
		right:0;
		margin:0;
		padding:0;
		width:50px;
		height:50px;
	}
	
	#pageTop a {
		width:50px;
		height:50px;
	}
}

/* Templates */
::after,
::before,
* {
	--font-size: calc((var(--fs) / 16) * 1rem);
	font-size: var(--font-size);
}

/* TOP */
#message.m-twocolumn {
  margin-top: 20px;
  position: relative;
}
#message.m-twocolumn::before {
  content: "";
  width: 180px;
  background-color: var(--primary);
  aspect-ratio: 1 / cos(20deg);
  clip-path: polygon(0 0, 90% 0, 0 100%);
  position: absolute;
  top: 0;
  left: 0;
}

.floating-item {
  width: 100%;
  position: fixed;
  bottom: 0;
  z-index: 100;
}
.floating-item .flex {
  display: flex;
}
.floating-item .flex-item {
  width: 50%;
}

@media screen and (min-width: 768px) {
  #message.m-twocolumn h2 {
    font-size: 2.625rem;
    letter-spacing: .1em;
  }
  #message.m-twocolumn .p-content-body {
    max-width: 580px;
  }
  #message.m-twocolumn .pic {
    padding-top: 100px;
    margin-left: -200px;
    z-index: 0;
    margin-right: calc(50% - 50vw);
  }
  #top-data.m-grid .u-grid-column3 {
    row-gap: 50px;
  }
  #top-data.m-grid .u-grid-column3 .card-item {
    padding-left: 0;
    padding-right: 0;
  }
  #top-company.m-grid .u-grid-column4 {
    grid-template-columns: repeat(
      auto-fit,
      calc((100% - var(--column2-gap) * (4 - 1)) / 4)
    );
    gap: var(--column2-gap);
  }
}
@media screen and (max-width: 1200px) {
  #message.m-twocolumn::before {
    width: 100px;
  }
}
@media screen and (max-width: 819px) {
  #message.m-twocolumn::before {
    width: 60px;
  }
  #message.m-twocolumn {
    margin-top: 0;
  }
}

@keyframes arrow-line {
  0% {
    transform: translateX(0px) scaleX(1);
    transform-origin: right center;
  }
  50% {
    transform: translateX(8px) scaleX(0.1);
    transform-origin: right center;
  }
  50.1% {
      transform: translateX(-8px) scaleX(0);
      transform-origin: left center;
  }
  100% {
      transform: translateX(0px) scaleX(1);
      transform-origin: left center;
  }
}

/*    社員紹介    */
.m-grid-interview .p-heading.p-heading__style h2 {
  display: grid;
  justify-content: center;
  gap: 10px;
}
.m-grid-interview .p-heading.p-heading__style h2::before {
  content: "";
  display: block;
  width: 34px;
  height: 4px;
  background: var(--color-theme-1);
  margin-inline: auto;
}
.m-grid-interview .grid {
  position: relative;
  justify-content: center;
  z-index: 1;
}

/* Modules */
.m-hero__top {
  margin-left: auto;
  padding-bottom: 200px;
  max-width: 1440px;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 0;
}
.m-hero__top::before {
  content: "";
  width: 438px;
  height: 592px;
  background-image: url("/hubfs/21507825/recruit/top/hero_mask01.svg");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 0;
  left: 0;
}
.m-hero__top .m-hero__top__copy {
  position: absolute;
  top: 20%;
  left: 130px;
  z-index: 2;
  /*mix-blend-mode: soft-light;*/
}
.m-hero__top .m-hero__top__copy.test_190652133794 {
  font-size: 3.5rem;
  left: 200px;
  mix-blend-mode: difference;
}
.m-hero__top__mask {
  width: 480px;
  height: 544px;
  background-image: url("/hubfs/21507825/recruit/top/hero_mask02.svg");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 2;
}
.m-hero__top .swiper {
  margin-left: auto;
  margin-right: 0;
  max-width: 1000px;
}
/*@media screen and (min-width: 1024px) {
  .m-hero__top .m-hero__top__copy:not(.white) {
    mix-blend-mode: difference;
  }
}*/
@media screen and (max-width: 1024px) {
  .m-hero__top {
    padding-left: 100px;
    padding-bottom: 150px;
  }
  .m-hero__top:before {
    aspect-ratio: 23 / 43;
    width: 235px;
    height: auto;
    background-image: url("/hubfs/21507825/recruit/top/hero_mask01_sp.svg");
  }
  .m-hero__top__mask {
    aspect-ratio: 15 / 16;
    width: 300px;
    height: auto;
    background-image: url("/hubfs/21507825/recruit/top/hero_mask02_sp.svg");
    bottom: 90px;
  }
  .m-hero__top .m-hero__top__copy {
    max-width: 500px;
    top: auto;
    left: 80px;
    bottom: 0;
  }
  .m-hero__top .m-hero__top__copy::before {
    content: "";
    aspect-ratio: 30 / 13;
    width: 300px;
    height: auto;
    background: url('/hubfs/21507825/recruit/top/text_pos.svg') no-repeat;
    background-size: contain;
    position: absolute;
    top: -90px;
    left: -60px;
    z-index: -1;
  }
}
@media screen and (max-width: 767px) {
  .m-hero__top {
    padding-left: 50px;
    padding-bottom: 80px;
  }
  .m-hero__top:before {
    width: 100px;
  }
  .m-hero__top__mask {
    width: 140px;
    bottom: 50px;
  }
  .m-hero__top .m-hero__top__copy {
    max-width: 270px;
    left: 20px;
  }
  .m-hero__top .m-hero__top__copy::before {
    width: 140px;
    top: -50px;
    left: -10px;
  }
}
.m-news__top {
  margin-top: -160px;
  margin-bottom: 80px;
  position: relative;
  z-index: 0;
}
.m-news__top .l-section-wrapper {
  padding: 20px;
  background-color: var(--light-gray);
  position: relative;
}
.m-news__top .l-section-wrapper::before {
  content: "";
  width: 436px;
  height: 176px;
  background: url('/hubfs/21507825/recruit/top/text_pos.svg') no-repeat;
  background-size: contain;
  position: absolute;
  top: -120px;
  left: -80px;
  z-index: -1;
}
.m-news__top .l-section-wrapper::after {
  content: "";
  width: 48px;
  height: 6px;
  background-color: var(--sub);
  clip-path: polygon(0% 0%, 100% 0%, 75% 100%, 0% 100%);
  position: absolute;
  top: -2px;
  left: 0;
}
.m-news__top__list a {
  display: flex;
  gap: 15px 30px;
}
.m-news__top__list .date {
  width: 100px;
  color: var(--gray);
}
.m-news__top__list .meta {
  flex: 1;
  transition: .4s;
}

@media (hover: hover) {
  .m-news__top__list a:hover .meta {
    text-decoration: underline;
  }
}

@media screen and (max-width: 1024px) {
  .m-news__top {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  .m-news__top .l-section-wrapper::before {
    content: none;
  }
}
@media screen and (max-width: 767px) {
  .m-news__top__list a {
    flex-direction: column;
    gap: 4px;
  }
  .m-news__top__list .date {
    width: 100%;
  }
}
.m-grid .ico-item {
  margin-top: 50px;
  padding: 20px 15px;
  border-radius: 10px;
  border: 1px solid #90cbf7;
  background: #e3f2fc;
  text-align: center;
}
.m-grid .ico-item .ico {
  margin: -65px auto 16px;
  max-width: 136px;
}
.m-grid .ico-item .ico img {
  transition: .4s;
}
.m-grid a.ico-item:hover .ico img {
  transform: scale(1.1);
}

.m-grid .card-item {
  padding: 20px;
  background-color: white;
  border-radius: 8px;
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 2;
  gap: 15px;
}
.m-grid .card-item h3 {
  color: var(--primary);
  font-size: 1.375rem;
}
.m-grid .card-item .pic {
  display: flex;
  justify-content: center;
  align-items: center;
}

.m-grid .interview-item .pic {
  padding-right: 30px;
  position: relative;
  z-index: -1;
}
.m-grid .interview-item .p-eyecatch {
  position: relative;
}
.m-grid .interview-item .p-eyecatch::before {
  content: "";
  width: calc(100% - 32px);
  height: calc(100% - 32px);
  background: url('/hubfs/21507825/recruit/top/frame.png') no-repeat center top;
  background-size: contain;
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 1;
  mix-blend-mode: exclusion;
}
.m-grid .interview-item .p-eyecatch,
.m-grid .interview-item .p-eyecatch img {
  aspect-ratio: 3 / 4;
}
.m-grid .interview-item__text {
  margin-top: -120px;
  margin-left: auto;
  padding: 30px;
  width: calc(100% - 30px);
  background-color: white;
  box-shadow: 2px 4px 13px 2px rgba(0, 0, 0, 0.12);
  font-size: 1.125rem;
}
.m-grid .interview-item__text h3 {
  font-size: 1.125rem;
  margin-bottom: 16px;
}
.m-grid .interview-item__text .flex {
  margin-bottom: 4px;
}
.m-grid .interview-item__text .type + .join::before {
  content: "/";
  display: inline-block;
  margin: 0 2px;
}

#top-interview .grid {
  position: relative;
  justify-content: center;
  z-index: 1;
}
.m-twocolumn__text {
  max-width: 670px;
  width: 65%;
  z-index: 1;
}
.m-twocolumn .pic {
  flex: 1;
}


@media screen and (max-width: 819px) {
  .m-twocolumn > .flex {
    flex-direction: column;
    gap: 20px;
  }
  .m-twocolumn__text {
    max-width: initial;
    width: 100%;
  }
}
.m-cta__bnr {
  padding: 20px;
  display: inline-block;
  width: 100%;
  background-color: var(--primary);
  display: flex;
  align-items: center;
  gap: 12px 24px;
  border-radius: 10px;
  position: relative;
}
.m-cta__bnr::after {
  content: "";
  width: 21px;
  height: 21px;
  background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAyMSAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTAgNy4wMDA5NUMwIDYuODAyMDMgMC4wNzkwMTc2IDYuNjExMjcgMC4yMTk2NyA2LjQ3MDYyQzAuMzYwMzIyIDYuMzI5OTcgMC41NTEwODggNi4yNTA5NSAwLjc1IDYuMjUwOTVIMTguNDM5NUwxMy43MTkgMS41MzE5NUMxMy41NzgyIDEuMzkxMTIgMTMuNDk5MSAxLjIwMDExIDEzLjQ5OTEgMS4wMDA5NUMxMy40OTkxIDAuODAxNzg0IDEzLjU3ODIgMC42MTA3NzcgMTMuNzE5IDAuNDY5OTQ3QzEzLjg1OTggMC4zMjkxMTcgMTQuMDUwOCAwLjI1IDE0LjI1IDAuMjVDMTQuNDQ5MiAwLjI1IDE0LjY0MDIgMC4zMjkxMTcgMTQuNzgxIDAuNDY5OTQ3TDIwLjc4MSA2LjQ2OTk1QzIwLjg1MDggNi41Mzk2MiAyMC45MDYzIDYuNjIyMzggMjAuOTQ0MSA2LjcxMzVDMjAuOTgxOSA2LjgwNDYyIDIxLjAwMTMgNi45MDIzIDIxLjAwMTMgNy4wMDA5NUMyMS4wMDEzIDcuMDk5NiAyMC45ODE5IDcuMTk3MjggMjAuOTQ0MSA3LjI4ODRDMjAuOTA2MyA3LjM3OTUxIDIwLjg1MDggNy40NjIyOCAyMC43ODEgNy41MzE5NUwxNC43ODEgMTMuNTMxOUMxNC42NDAyIDEzLjY3MjggMTQuNDQ5MiAxMy43NTE5IDE0LjI1IDEzLjc1MTlDMTQuMDUwOCAxMy43NTE5IDEzLjg1OTggMTMuNjcyOCAxMy43MTkgMTMuNTMxOUMxMy41NzgyIDEzLjM5MTEgMTMuNDk5MSAxMy4yMDAxIDEzLjQ5OTEgMTMuMDAwOUMxMy40OTkxIDEyLjgwMTggMTMuNTc4MiAxMi42MTA4IDEzLjcxOSAxMi40Njk5TDE4LjQzOTUgNy43NTA5NUgwLjc1QzAuNTUxMDg4IDcuNzUwOTUgMC4zNjAzMjIgNy42NzE5MyAwLjIxOTY3IDcuNTMxMjhDMC4wNzkwMTc2IDcuMzkwNjMgMCA3LjE5OTg2IDAgNy4wMDA5NVoiIGZpbGw9IndoaXRlIi8+PC9zdmc+")
    no-repeat center center;
  background-size: contain;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
}
.m-cta__bnr .pic {
  max-width: 110px;
}
.m-cta__bnr .meta {
  flex: 1;
}

@media (hover: hover) {
  a.m-cta__bnr:hover {
    opacity: 0.7;
  }
}

@media screen and (max-width: 1024px) {
  .m-cta__bnr .pic {
    max-width: 60px;
  }
  .m-cta__bnr .meta {
    font-size: 1.125rem !important;
  }
}
.m-hero__page {
  position: relative;
  padding: 30px 0 0;
}
.m-hero__page::before {
  aspect-ratio: 275/284;
  content: '';
  width: clamp(159px, 26.429px + 17.262vw, 275px);
  height: auto;
  background: url('/hubfs/21507825/recruit/common/hero-deco-01.svg') no-repeat top/100% auto;
  position: absolute;
  top: 0;
  left: 0;
}
.m-hero__page::after {
  aspect-ratio: 180/257;
  content: '';
  width: clamp(104px, 17.143px + 11.31vw, 180px);
  height: auto;
  background: url('/hubfs/21507825/recruit/common/hero-deco-02.svg') no-repeat bottom/100% auto;
  position: absolute;
  top: calc(100% - 50px);
  right: 0;
}

.m-hero__page__container {
  background-color: var(--color-theme-1-1);
  padding: 60px 0;
  display: grid;
  text-align: center;
  line-height: 1.3;
}

.m-hero__page__container > * {
  margin-bottom: 0;
}

.m-hero__page__title {
  font-size: clamp(1.375rem, 0.518rem + 1.786vw, 2.125rem);/*34→22*/
}

.m-hero__page__subtitle {
  color: var(--color-theme-1);
  order: -1;
  font-size: clamp(0.813rem, 0.598rem + 0.446vw, 1rem);/*16→13*/
  font-family: var(--enfont);
  font-style: italic;
}

@media screen and (max-width: 1024px) {
  .m-hero__page {
    padding: 15px 0;
  }
  .m-hero__page::after {
    top: 70px;
  }
  .m-hero__page__container {
    padding: 30px 0;
  }
}
@media screen and (max-width: 767px) {
  .m-hero__page::before {
    aspect-ratio: 84/97;
    width: 84px;
    background-image: url('/hubfs/21507825/recruit/common/hero-deco-01-sp.svg');
  }
  .m-hero__page::after {
    aspect-ratio: 52/64;
    width: 52px;
    background-image: url('/hubfs/21507825/recruit/common/hero-deco-02-sp.svg');
    top: auto;
    bottom: 0;
  }
}
.m-hero__interview {
  position: relative;
  max-width: 1440px;
  margin-inline: auto;
}
.m-hero__interview::before {
  content: "";
  width: 572px;
  aspect-ratio: 572 / 561;
  height: auto;
  background-image: url("/hubfs/21507825/recruit/interview/hero_interview_mask01.svg");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
.m-hero__interview__header {
  display: grid;
  max-width: 1260px;
  width: 100%;
  padding-right: 20px;
  padding-left: 20px;
  position: absolute;
  top: 60px;
  left: 50%;
  transform: translateX(-50%);
}
.m-hero__interview__title {
  --fs: 34;
  font-size: var(--font-size);
  letter-spacing: 0.1em;
  color: var(--white);
}
.m-hero__interview__subtitle {
  font-family: var(--enfont);
  font-style: italic;
  color: #90CBF7;
  order: -1;
}
.m-hero__interview__container {
  max-width: 1140px;
  display: grid;
  align-items: center;
  padding-top: 40px;
  padding-right: 20px;
  padding-left: 20px;
  margin-inline: auto;
}
.m-hero__interview__content {
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  max-width: 540px;
  background: rgba(255,255,255,0.9);
  box-shadow: 2px 4px 13px 2px rgba(0, 0, 0, 0.12); 
  padding: 30px 55px;
  transform: translateY(15%);
}
.m-hero__interview__text {
  --fs: 28;
  font-size: var(--font-size);
  line-height: 1.6;
  letter-spacing: 0.1em;
  margin-bottom: 25px;
}
.m-hero__interview__content .flex {
  flex-wrap: wrap;
}
.hero__interview__image {
  position: relative;
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  max-width: 784px;
  width: 100%;
  margin-right: calc((1440px - 100%) / -2);
  margin-left: auto;
  z-index: -1;
}
.hero__interview__image::before {
  content: "";
  aspect-ratio: 170 / 384;
  width: 170px;
  height: auto;
  background-image: url("/hubfs/21507825/recruit/interview/hero_interview_mask02.svg");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  bottom: -100px;
  right: 0;
  z-index: 1;
}
.hero__interview__image img {
  clip-path: polygon(36.5% 0, 100% 0, 100% 100%, 0 100%, 0 65%);
}
@media(max-width: 1439px) {
  .hero__interview__image {
     margin-right: calc((100vw - 100%) / -2);
  }
}
@media(max-width: 1024px) {
  .m-hero__interview {
    margin-bottom: 30px;
  }
  .m-hero__interview::before {
    width: 325px;
  }
  .m-hero__interview__header {
    top: 35px;
  }
  .m-hero__interview__title {
    --fs: 30;
  }
  .m-hero__interview__container {
    padding-top: 0;
  }
  .m-hero__interview__content {
    max-width: unset;
    max-inline-size: max-content;
    grid-row: 2 / 3;
    padding: 32px 60px;
    margin-top: -70px;
    transform: none;
  }
  .m-hero__interview__text {
    --fs: 32;
  }
  .m-hero__interview__type,
  .m-hero__interview__join,
  .m-hero__interview__name {
    --fs: 24;
  }
  .hero__interview__image {
    max-width: 85%;
  }
  .hero__interview__image::before {
    width: 100px;
    bottom: 5%;
  }
}
@media(max-width: 767px) {
  .m-hero__interview {
    margin-bottom: 15px;
  }
  .m-hero__interview__header {
    top: clamp(10px, -15.862px + 6.631vw, 35px);
    padding-left: clamp(10px, -0.345px + 2.653vw, 20px);
    padding-right: clamp(10px, -0.345px + 2.653vw, 20px);
  }
  .m-hero__interview::before {
    width: clamp(170px, 9.655px + 41.114vw, 325px);
  }
  .m-hero__interview__title {
    font-size: clamp(1.125rem, 0.349rem + 3.183vw, 1.875rem);
  }
  .m-hero__interview__subtitle {
    font-size: clamp(0.688rem, 0.494rem + 0.796vw, 0.875rem);
  }
  .m-hero__interview__content {
    padding: clamp(15px, -2.586px + 4.509vw, 32px) clamp(28px, -5.103px + 8.488vw, 60px);;
    margin-top: -30px;
  }
  .m-hero__interview__text {
    font-size: clamp(0.938rem, -0.162rem + 4.509vw, 2rem);
    margin-bottom: 10px;
  }
  .m-hero__interview__type,
  .m-hero__interview__join,
  .m-hero__interview__name {
    font-size: clamp(0.75rem, -0.026rem + 3.183vw, 1.5rem);
  }
  .m-hero__interview__content .flex {
    flex-direction: column;
  }
  .hero__interview__image::before {
    width: clamp(50px, -1.724px + 13.263vw, 100px);
  }
}
@media(max-width: 575px) {
  
}
.m-toc {
  flex-wrap: wrap;
  gap: 15px 0;
}

.m-toc__item {
  position: relative;
}

.m-toc__item:not(:last-child)::after {
  content: '';
  background-color: #c9ced1;
  width: 1px;
  height: 24px;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

.m-toc__box {
  --fs: 20;
  align-items: center;
  display: inline-flex;
  margin: 0 25px;  
  gap: 10px;
  position: relative;
  transition: .4s;
}

.m-toc__box::before {
  background-color: var(--color-theme-1);
  bottom: -3px;
  content: '';
  display: block;
  height: 2px;
  left: 0;
  position: absolute;
  right: 0;
  transition: .4s;
}

a.m-toc__box:not(:hover)::before {
  transform: scaleX(0);
}

.m-toc__box::after {
  aspect-ratio: 1;
  content: '';
  background: url('/hubfs/21507825/recruit/common/icon-chevron.svg') no-repeat center/contain;
  display: inline-block;
  height: auto;
  width: 15px;
}

@media screen and (max-width: 767px) {
  .m-toc__item:not(:last-child)::after {
    height: 12px;
  }
  .m-toc__box {
    --fs: 14;
    gap; 5px;
    margin: 0 15px;
  }
  .m-toc__box::after {
    width: 10px;
  } 
}
.m-service {
  --gap: 1.5rem;
  --column2-gap: var(--gap);
  --column3-gap: var(--gap);
  --column4-gap: var(--gap);
}

.m-service__item {
  display: contents;
}

.m-service__box {
  background-color: var(--color-gray-1);
  border-radius: 10px;
  display: grid;
  grid-template-rows: subgrid;
  gap: 0;
  grid-row: span 4;  
  text-align: center;
  margin: 40px 0 0;
  &:hover {
    .m-service__more {
      background-color: var(--color-theme-1);
      color: var(--white);
      &::after {
          animation: 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s 1 normal none running arrow-line;
      }
    }
  }
}

.m-service__icon {
  margin: -40px auto 15px;
}

.m-service__title {
  --fs: 18;
  color: var(--color-theme-1);
  line-height: 1.6;
  font-weight: 700;
  padding: 0 10px;
  margin-bottom: 5px;
  align-self: center;
}

.m-service__text {
  --fs: 15;
  font-weight: 700;
  padding: 0 10px;
  margin-bottom: 15px;
}

.m-service__more {
  background-color: var(--color-theme-1-1);
  border-radius: 0 0 10px 10px;
  color: var(--color-theme-1);
  padding: 10px;
  position: relative;
  transition: .4s;
  &::before {
    aspect-ratio: 1;
    background-color: var(--white);
    border-radius: 100px;
    content: '';
    display: inline-block;
    height: auto;
    width: 20px;
    position: absolute;
    right: 10px;
    top: calc(50% - 10px);
  }
  &::after {
    aspect-ratio: 1;
    background: url(/hubfs/21507825/recruit/common/icon-arrow.svg) no-repeat center/contain;
    content: '';
    display: inline-block;
    height: auto;
    width: 9px;
    position: absolute;
    right: 15.5px;
    top: calc(50% - 4.5px);
  }
}
.m-work {
  grid-template-columns: 1fr 50%;
  margin-bottom: 40px;
  gap: 30px 90px;
}

.m-work__article + .m-work {
  margin-top: 70px;
}

.m-work__header {
  display: grid;
  margin-bottom: 30px;
}

.m-work__header > * {
  margin-bottom: 0;
}

.m-work__title {
  --fs: 26;
  color: var(--color-theme-1);
  font-size: var(--font-size);
}

.m-work__subtitle {
  color: var(--color-theme-1-2);
  font-style: italic;
  order: -1;
}

.m-work__article + .m-work__article {
    margin-top: 10px;
}

.m-work__article__box {
  background-color: var(--white);
  border: 2px solid var(--color-theme-1);
  border-radius: 10px;
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 0 40px;
  padding: 30px;
  align-items: start;
}

.m-work__article__img {
  border-radius: 6px;
  grid-row: span 3;
  overflow: hidden;
}

.m-work__article__img img {
  transition: .4s;
}

.m-work__article__header {
  align-items: baseline;
  color: var(--color-theme-1);
  display: flex;
  margin-bottom: 5px;
  flex-wrap: wrap;
}

.m-work__article__header > * {
  margin-bottom: 0;
}

.m-work__article__title {
  --fs: 22;
  font-size: var(--font-size);
}

.m-work__article__text {
  --fs: 20;
  font-weight: 700;
  margin-bottom: 20px;
}

.m-work__article__button {
  place-items: center;
  background-color: var(--color-theme-1);
  border-radius: 50px;
  color: var(--white);
  display: inline-grid;
  grid-template-columns: auto auto;
  gap: 12px;
  font-weight: 700;
  padding: 12px 22px;
  position: relative;
  justify-self: end;
  margin-top: auto;
  transition: .4s;
  &::before {
    aspect-ratio: 1;
    background-color: var(--white);
    border-radius: 100px;
    content: '';
    display: inline-block;
    height: auto;
    width: 20px;
    grid-column: 2;
    grid-row: 1;
  }
  &::after {
    aspect-ratio: 1;
    background: url(/hubfs/21507825/recruit/common/icon-arrow.svg) no-repeat center/contain;
    content: '';
    display: inline-block;
    height: auto;
    width: 9px;
    grid-column: 2;
    grid-row: 1;
  }
}

.m-work__article__box:hover .m-work__article__img > img {
  transform: scale(1.1);
}

.m-work__article__box:hover .m-work__article__button::after {
  animation: 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s 1 normal none running arrow-line;
}

.m-work__article__box:hover .m-work__article__button {
  background-color: var(--color-theme-3);
}

@media(max-width: 1024px) {
  .m-work {
    gap: 30px;
  }
}

@media(max-width: 767px) {
  .m-work {
    grid-template-columns: 1fr;
  }
  .m-work__article + .m-work {
    margin-top: 40px;
  }
  .m-work__header {
    margin-bottom: 1.5rem;
  }
  .m-work__title {
    --fs: 22;
  }
  .m-work__article__box {
    gap: 0 15px;
    padding: 15px;
  }
}

@media(max-width: 575px) {
  .m-work__article__box {
    grid-template-columns: 1fr;
  }
  .m-work__article__img {
    margin-bottom: 20px;
  }
  .m-work__article__title {
    --fs: 18;
  }
  .m-work__article__text {
    --fs: 18;
  }
  .m-work__article__button {
    --fs: 14;
    justify-self: center;
  }
}
.m-card {
  --gap: 1.5rem;
  --column2-gap: var(--gap);
  --column3-gap: var(--gap);
  --column4-gap: var(--gap);
  margin: 40px 0 0;
}

.m-card__item {
  background-color: #fff;
  border: 1px solid #e5e9eb;
  display: grid;
  grid-template-rows: subgrid;
  gap: 0;
  grid-row: span 3;
  place-items: center;
  padding: 30px 1.5rem;
}

.m-card__title {
  --fs: 22;
  font-size: var(--font-size);
  margin-bottom: 20px;
  text-align: center;
}

.m-card__img {
  margin-bottom: 1.5rem;
}

.m-card__text {
  --fs: 18;
  margin-bottom: auto;
}

.m-card__text > :las-child {
  margin-bottom: 0;
}

@media(max-width: 767px) {
  .m-card {
    margin-top: 1.5rem;
  }
  .m-card__title {
    --fs: 18;
  }
  .m-card__text {
    --fs: 16;
  }
}
.m-interview-title {
  display: grid;
  --fs: 26;
  font-size: var(--font-size);
  font-weight: 600;
  margin-bottom: 30px;
}
.m-interview-title::before {
  content: "";
  display: block;
  width: 34px;
  height: 4px;
  background: var(--color-theme-1);
}
.m-interview {
  --column2-gap: 40px;
}
.m-interview:has(+ .m-timeline) {
  margin-bottom: 30px;
}
.grid-item:has(.m-interview__img--left) {
  order: -1;
}
.m-timeline {
  background: linear-gradient(88.12deg, #F5F5F5 -0.76%, #D4EBF8 99.63%);
  border-radius: 10px;
  padding: 30px 90px;
}
.m-timeline__title {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 10px;
  --fs: 26;
  font-size: var(--font-size);
  color: var(--color-theme-1);
  margin-bottom: 30px;
}
.m-timeline__title::before {
  content: "";
  display: block;
  width: 44px;
  min-width: 44px;
  height: 44px;
  background: url(/hubfs/21507825/recruit/interview/interview_timeline_img.svg) center / cover;
}
.m-timeline__grid {
  align-items: flex-start;
}
.m-tileline__list {
  position: relative;
}
.m-tileline__list::before {
  content: "";
  display: block;
  width: 1px;
  height: calc(100% - 22px);
  background: var(--color-theme-1);
  position: absolute;
  top: 11px;
  left: calc(11px / 2);
  transform: translateX(-50%);
}
.m-timeline__grid.u-grid-column2 .m-tileline__list:nth-child(1)::before {
  height: calc(100% - 11px);
}
.m-timeline__grid.u-grid-column2 .m-tileline__list:nth-child(2)::before {
  height: calc(100% - 11px);
  top: 0;
}
.m-tileline__list li {
  display: grid;
  grid-template-columns: 70px 1fr;
  gap: 20px;
  --fs: 20;
  padding-left: 20px;
  position: relative;
}
.m-tileline__list li:not(:last-child) {
  margin-bottom: 30px;
}
.m-tileline__list li::before {
  content: "";
  display: block;
  width: 11px;
  height: 11px;
  background: var(--color-theme-1);
  border-radius: 50%;
  position: absolute;
  top: 11px;
  left: 0;
}
.m-tileline__list li span {
  font-weight: 600;
}
@media(max-width: 1024px) {
  .m-interview {
    --column2-gap: clamp(12px, 2cqi, 24px);
  }
  .m-timeline {
    padding: 30px;
  }
}
@media(max-width: 767px) {
  .m-interview-title {
    --fs: 18;
    margin-bottom: 15px;
  }
  .grid-item:has(.m-interview__img--left) {
    order: 0;
  }
  .m-timeline {
    padding: 25px 15px;
  }
  .m-timeline__title {
    --fs: 20;
    grid-template-columns: 34px 1fr;
    margin-bottom: 25px;
  }
  .m-timeline__title::before {
    width: 34px;
    min-width: 34px;
    height: 34px;
  }
  .m-timeline__grid.u-grid-column2 {
    gap: 0;
  }
  .m-tileline__list::before {
    top: 9px;
    left: calc(9px / 2);
    height: calc(100% - 18px)
  }
  .m-timeline__grid.u-grid-column2 .m-tileline__list:nth-child(1)::before {
    height: calc(100% - 9px);
  }
  .m-timeline__grid.u-grid-column2 .m-tileline__list:nth-child(2)::before {
    height: calc(100% - 9px);
  }
  .m-tileline__list li {
    grid-template-columns: 55px 1fr;
    --fs: 16;
  }
  .m-tileline__list li:not(:last-child) {
    margin-bottom: 20px;
  }
  .m-tileline__list:has(+ .m-tileline__list ) li:last-child {
    margin-bottom: 20px;
  }
  .m-tileline__list li::before {
    width: 9px;
    height: 9px;
    top: 9px;
  }
  
}
.m-accordion--panel {
  margin-top: 20px;
}
.m-accordion--panel:has(> .active) + .m-accordion--panel {
  margin-top: 70px;
}
.m-accordion--panel__title {
  padding: 20px 30px;
  cursor: pointer;
  color: white;
  background-color: var(--color-theme-2);
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  display: flex;
  gap: 20px;
  justify-content: space-between;
  align-items: center;
}
.m-accordion--panel__title .p_btn {
  width: 36px;
  height: 36px;
  background-color: white;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
}
.m-accordion--panel__title h3 {
  margin-bottom: 10px;
}
.m-accordion--panel__body {
  padding: 40px 50px;
  border: 1px solid #adb5bd;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

@media screen and (max-width: 819px) {
  .m-accordion--panel__title {
    padding: 15px;
    display: block;
    position: relative;
  }
  .m-accordion--panel__title .p_btn {
    width: 24px;
    height: 24px;
    position: absolute;
    top: 15px;
    right: 15px;
  }
  .m-accordion--panel__body {
    padding: 20px;
  }
}
.m-faq--panel {
  margin-top: 30px;
}
.m-faq--panel__title {
  cursor: pointer;
  padding-bottom: 10px;
  border-bottom: 1px solid #dee2e6;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.m-faq--panel__title h3 {
  padding-top: 5px;
  padding-left: 50px;
  font-size: 1rem;
  position: relative;
}
.m-faq--panel__title h3::before {
  content: 'Q.';
  color: var(--primary);
  font-size: 1.25rem;
  position: absolute;
  top: 0;
  left: 0;
}
.m-faq--panel__title .p_btn {
  width: 28px;
  height: 28px;
  background-color: #f3f2fc;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
}
.m-faq--panel__body {
  padding: 20px 0 0 50px;
  position: relative;
}
.m-faq--panel__body::before {
  content: 'A.';
  color: var(--sub);
  font-size: 1.25rem;
  font-weight: 700;
  position: absolute;
  top: 15px;
  left: 0;
}

@media screen and (max-width: 819px) {
  .m-faq--panel__title h3 {
    padding-left: 30px;
  }
  .m-faq--panel__body {
    padding-left: 30px;
  }
}
.m-table .p-table {
  margin: auto;
  max-width: 1000px;
}

/* Utilities */
/* ------------------------------------------------------------------------------------
Display
------------------------------------------------------------------------------------ */
.block {
  display: block;
}
.flex {
  display: flex;
}
.grid {
  display: grid;
}
.none {
  display: none;
}
/* ------------------------------------------------------------------------------------
Overflow
------------------------------------------------------------------------------------ */
.overflow-hidden {
  overflow: hidden;
}

/* ------------------------------------------------------------------------------------
Flex
------------------------------------------------------------------------------------ */
.u-items-center {
  align-items: center;
}
.u-justify-start {
  justify-content: start;
}
.u-justify-center {
  justify-content: center;
}
.u-justify-end {
  justify-content: end;
}
.u-justify-between {
  justify-content: space-between;
}
.u-justify-around {
  justify-content: space-around;
}
.u-align-start {
  align-items: start;
}
.u-align-center {
  align-items: center;
}
.u-align-end {
  align-items: end;
}
.u-row-reverse {
  flex-direction: row-reverse;
}

.u-flex-column2 .flex-item {
  width: 50%;
}

.u-flex-column3 {
  flex-wrap: wrap;
  gap: 24px 42px;
}
.u-flex-column3 .flex-item {
  width: calc(33.333% - 28px);
}
.u-flex-column4 {
  flex-wrap: wrap;
  gap: 42px 4%;
}
.u-flex-column4 .flex-item {
  width: calc(25% - 3%);
}

@media screen and (max-width: 767px) {
  .u-flex-column2 {
    flex-direction: column;
  }
  .u-flex-column2 .flex-item {
    width: 100%;
  }
  .u-flex-column3 {
    gap: 24px;
  }
  .u-flex-column3 .flex-item {
    width: 100%;
  }
  .u-flex-column4 {
    gap: 30px 4%;
  }
  .u-flex-column4 .flex-item {
    width: calc(50% - 2%);
  }
}

/* ------------------------------------------------------------------------------------
grid
------------------------------------------------------------------------------------ */

.u-grid-center {
  justify-content: center;
}

.u-grid-columnauto {
  grid-template-columns: repeat(auto-fit, 22%);
  row-gap: 24px;
  column-gap: 4%;
  justify-content: center;
}

.u-grid-column1 {
  grid-template-columns: repeat(1, 1fr);
  gap: 32px;
}

.u-grid-column2 {
  grid-template-columns: repeat(auto-fit, calc((100% - var(--column2-gap) * (2 - 1)) / 2));
  gap: var(--column2-gap);
}
.u-grid-column3 {
  grid-template-columns: repeat(auto-fit, calc((100% - var(--column3-gap) * (3 - 1)) / 3));
  gap: var(--column3-gap);
}
.u-grid-column4 {
  grid-template-columns: repeat(auto-fit, calc((100% - var(--column4-gap) * (4 - 1)) / 4));
  gap: var(--column4-gap);
}

@media screen and (max-width: 1023px) {
  .u-grid-column3, .u-grid-column4 {
    gap: 40px 16px;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (max-width: 767px) {
  .u-grid-column2 {
    gap: 24px;
    grid-template-columns: repeat(1, 1fr);
  }
  .u-grid-column3, .u-grid-column4 {
    gap: 16px;
    grid-template-columns: repeat(1, 1fr);
  }
  .u-grid-column2-sp {
    grid-template-columns: repeat(auto-fit, calc((100% - var(--column2-gap) * (2 - 1)) / 2));
    gap: var(--column2-gap);
  }
}


/* ------------------------------------------------------------------------------------
Width/Height
------------------------------------------------------------------------------------ */
.w-auto {
  width: auto;
}
.w-full {
  width: 100%;
}
.w-fit {
  width: fit-content;
}
.h-auto {
  height: auto;
}
.h-full {
  height: 100%;
}

/* ------------------------------------------------------------------------------------
Margin
------------------------------------------------------------------------------------ */
.mx-auto {
  margin-left: auto;
  margin-right: auto;
}
.ml-auto {
  margin-left: auto;
}
.mr-auto {
  margin-right: auto;
}




.m-0 {
  margin: 0px !important;
}

.mx-0 {
  margin-left: 0px !important;
  margin-right: 0px !important;
}

.my-0 {
  margin-top: 0px !important;
  margin-bottom: 0px !important;
}

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

.mb-0 {
  margin-bottom: 0px !important;
}

.ml-0 {
  margin-left: 0px !important;
}

.m-5 {
  margin: 5px !important;
}

.mx-5 {
  margin-left: 5px !important;
  margin-right: 5px !important;
}

.my-5 {
  margin-top: 5px !important;
  margin-bottom: 5px !important;
}

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

.mb-5 {
  margin-bottom: 5px !important;
}

.ml-5 {
  margin-left: 5px !important;
}

.m-10 {
  margin: 10px !important;
}

.mx-10 {
  margin-left: 10px !important;
  margin-right: 10px !important;
}

.my-10 {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}

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

.mb-10 {
  margin-bottom: 10px !important;
}

.ml-10 {
  margin-left: 10px !important;
}

.m-15 {
  margin: 15px !important;
}

.mx-15 {
  margin-left: 15px !important;
  margin-right: 15px !important;
}

.my-15 {
  margin-top: 15px !important;
  margin-bottom: 15px !important;
}

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

.mb-15 {
  margin-bottom: 15px !important;
}

.ml-15 {
  margin-left: 15px !important;
}

.m-20 {
  margin: 20px !important;
}

.mx-20 {
  margin-left: 20px !important;
  margin-right: 20px !important;
}

.my-20 {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
}

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

.mb-20 {
  margin-bottom: 20px !important;
}

.ml-20 {
  margin-left: 20px !important;
}

.m-25 {
  margin: 25px !important;
}

.mx-25 {
  margin-left: 25px !important;
  margin-right: 25px !important;
}

.my-25 {
  margin-top: 25px !important;
  margin-bottom: 25px !important;
}

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

.mb-25 {
  margin-bottom: 25px !important;
}

.ml-25 {
  margin-left: 25px !important;
}

.m-30 {
  margin: 30px !important;
}

.mx-30 {
  margin-left: 30px !important;
  margin-right: 30px !important;
}

.my-30 {
  margin-top: 30px !important;
  margin-bottom: 30px !important;
}

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

.mb-30 {
  margin-bottom: 30px !important;
}

.ml-30 {
  margin-left: 30px !important;
}

.m-35 {
  margin: 35px !important;
}

.mx-35 {
  margin-left: 35px !important;
  margin-right: 35px !important;
}

.my-35 {
  margin-top: 35px !important;
  margin-bottom: 35px !important;
}

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

.mb-35 {
  margin-bottom: 35px !important;
}

.ml-35 {
  margin-left: 35px !important;
}

.m-40 {
  margin: 40px !important;
}

.mx-40 {
  margin-left: 40px !important;
  margin-right: 40px !important;
}

.my-40 {
  margin-top: 40px !important;
  margin-bottom: 40px !important;
}

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

.mb-40 {
  margin-bottom: 40px !important;
}

.ml-40 {
  margin-left: 40px !important;
}

.m-45 {
  margin: 45px !important;
}

.mx-45 {
  margin-left: 45px !important;
  margin-right: 45px !important;
}

.my-45 {
  margin-top: 45px !important;
  margin-bottom: 45px !important;
}

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

.mb-45 {
  margin-bottom: 45px !important;
}

.ml-45 {
  margin-left: 45px !important;
}

.m-50 {
  margin: 50px !important;
}

.mx-50 {
  margin-left: 50px !important;
  margin-right: 50px !important;
}

.my-50 {
  margin-top: 50px !important;
  margin-bottom: 50px !important;
}

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

.mb-50 {
  margin-bottom: 50px !important;
}

.ml-50 {
  margin-left: 50px !important;
}

.m-55 {
  margin: 55px !important;
}

.mx-55 {
  margin-left: 55px !important;
  margin-right: 55px !important;
}

.my-55 {
  margin-top: 55px !important;
  margin-bottom: 55px !important;
}

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

.mb-55 {
  margin-bottom: 55px !important;
}

.ml-55 {
  margin-left: 55px !important;
}

.m-60 {
  margin: 60px !important;
}

.mx-60 {
  margin-left: 60px !important;
  margin-right: 60px !important;
}

.my-60 {
  margin-top: 60px !important;
  margin-bottom: 60px !important;
}

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

.mb-60 {
  margin-bottom: 60px !important;
}

.ml-60 {
  margin-left: 60px !important;
}

.m-65 {
  margin: 65px !important;
}

.mx-65 {
  margin-left: 65px !important;
  margin-right: 65px !important;
}

.my-65 {
  margin-top: 65px !important;
  margin-bottom: 65px !important;
}

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

.mb-65 {
  margin-bottom: 65px !important;
}

.ml-65 {
  margin-left: 65px !important;
}

.m-70 {
  margin: 70px !important;
}

.mx-70 {
  margin-left: 70px !important;
  margin-right: 70px !important;
}

.my-70 {
  margin-top: 70px !important;
  margin-bottom: 70px !important;
}

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

.mb-70 {
  margin-bottom: 70px !important;
}

.ml-70 {
  margin-left: 70px !important;
}

.m-75 {
  margin: 75px !important;
}

.mx-75 {
  margin-left: 75px !important;
  margin-right: 75px !important;
}

.my-75 {
  margin-top: 75px !important;
  margin-bottom: 75px !important;
}

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

.mb-75 {
  margin-bottom: 75px !important;
}

.ml-75 {
  margin-left: 75px !important;
}

.m-80 {
  margin: 80px !important;
}

.mx-80 {
  margin-left: 80px !important;
  margin-right: 80px !important;
}

.my-80 {
  margin-top: 80px !important;
  margin-bottom: 80px !important;
}

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

.mb-80 {
  margin-bottom: 80px !important;
}

.ml-80 {
  margin-left: 80px !important;
}

.m-85 {
  margin: 85px !important;
}

.mx-85 {
  margin-left: 85px !important;
  margin-right: 85px !important;
}

.my-85 {
  margin-top: 85px !important;
  margin-bottom: 85px !important;
}

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

.mb-85 {
  margin-bottom: 85px !important;
}

.ml-85 {
  margin-left: 85px !important;
}

.m-90 {
  margin: 90px !important;
}

.mx-90 {
  margin-left: 90px !important;
  margin-right: 90px !important;
}

.my-90 {
  margin-top: 90px !important;
  margin-bottom: 90px !important;
}

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

.mb-90 {
  margin-bottom: 90px !important;
}

.ml-90 {
  margin-left: 90px !important;
}

.m-95 {
  margin: 95px !important;
}

.mx-95 {
  margin-left: 95px !important;
  margin-right: 95px !important;
}

.my-95 {
  margin-top: 95px !important;
  margin-bottom: 95px !important;
}

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

.mb-95 {
  margin-bottom: 95px !important;
}

.ml-95 {
  margin-left: 95px !important;
}

.m-100 {
  margin: 100px !important;
}

.mx-100 {
  margin-left: 100px !important;
  margin-right: 100px !important;
}

.my-100 {
  margin-top: 100px !important;
  margin-bottom: 100px !important;
}

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

.mb-100 {
  margin-bottom: 100px !important;
}

.ml-100 {
  margin-left: 100px !important;
}


/* sp */

@media screen and (max-width: 768px) {
  .sp-m-0 {
    margin: 0px !important;
  }
  
  .sp-mx-0 {
    margin-left: 0px !important;
    margin-right: 0px !important;
  }
  
  .sp-my-0 {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
  }

  .sp-mt-0 {
    margin-top: 0px !important;
  }

  .sp-mb-0 {
    margin-bottom: 0px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-5 {
    margin: 5px !important;
  }
  
  .sp-mx-5 {
    margin-left: 5px !important;
    margin-right: 5px !important;
  }
  
  .sp-my-5 {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
  }

  .sp-mt-5 {
    margin-top: 5px !important;
  }

  .sp-mb-5 {
    margin-bottom: 5px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-10 {
    margin: 10px !important;
  }
  
  .sp-mx-10 {
    margin-left: 10px !important;
    margin-right: 10px !important;
  }
  
  .sp-my-10 {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }

  .sp-mt-10 {
    margin-top: 10px !important;
  }

  .sp-mb-10 {
    margin-bottom: 10px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-15 {
    margin: 15px !important;
  }
  
  .sp-mx-15 {
    margin-left: 15px !important;
    margin-right: 15px !important;
  }
  
  .sp-my-15 {
    margin-top: 15px !important;
    margin-bottom: 15px !important;
  }

  .sp-mt-15 {
    margin-top: 15px !important;
  }

  .sp-mb-15 {
    margin-bottom: 15px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-20 {
    margin: 20px !important;
  }
  
  .sp-mx-20 {
    margin-left: 20px !important;
    margin-right: 20px !important;
  }
  
  .sp-my-20 {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
  }

  .sp-mt-20 {
    margin-top: 20px !important;
  }

  .sp-mb-20 {
    margin-bottom: 20px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-25 {
    margin: 25px !important;
  }
  
  .sp-mx-25 {
    margin-left: 25px !important;
    margin-right: 25px !important;
  }
  
  .sp-my-25 {
    margin-top: 25px !important;
    margin-bottom: 25px !important;
  }

  .sp-mt-25 {
    margin-top: 25px !important;
  }

  .sp-mb-25 {
    margin-bottom: 25px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-30 {
    margin: 30px !important;
  }
  
  .sp-mx-30 {
    margin-left: 30px !important;
    margin-right: 30px !important;
  }
  
  .sp-my-30 {
    margin-top: 30px !important;
    margin-bottom: 30px !important;
  }

  .sp-mt-30 {
    margin-top: 30px !important;
  }

  .sp-mb-30 {
    margin-bottom: 30px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-35 {
    margin: 35px !important;
  }
  
  .sp-mx-35 {
    margin-left: 35px !important;
    margin-right: 35px !important;
  }
  
  .sp-my-35 {
    margin-top: 35px !important;
    margin-bottom: 35px !important;
  }

  .sp-mt-35 {
    margin-top: 35px !important;
  }

  .sp-mb-35 {
    margin-bottom: 35px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-40 {
    margin: 40px !important;
  }
  
  .sp-mx-40 {
    margin-left: 40px !important;
    margin-right: 40px !important;
  }
  
  .sp-my-40 {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
  }

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

  .sp-mb-40 {
    margin-bottom: 40px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-45 {
    margin: 45px !important;
  }
  
  .sp-mx-45 {
    margin-left: 45px !important;
    margin-right: 45px !important;
  }
  
  .sp-my-45 {
    margin-top: 45px !important;
    margin-bottom: 45px !important;
  }

  .sp-mt-45 {
    margin-top: 45px !important;
  }

  .sp-mb-45 {
    margin-bottom: 45px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-50 {
    margin: 50px !important;
  }
  
  .sp-mx-50 {
    margin-left: 50px !important;
    margin-right: 50px !important;
  }
  
  .sp-my-50 {
    margin-top: 50px !important;
    margin-bottom: 50px !important;
  }

  .sp-mt-50 {
    margin-top: 50px !important;
  }

  .sp-mb-50 {
    margin-bottom: 50px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-55 {
    margin: 55px !important;
  }
  
  .sp-mx-55 {
    margin-left: 55px !important;
    margin-right: 55px !important;
  }
  
  .sp-my-55 {
    margin-top: 55px !important;
    margin-bottom: 55px !important;
  }

  .sp-mt-55 {
    margin-top: 55px !important;
  }

  .sp-mb-55 {
    margin-bottom: 55px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-60 {
    margin: 60px !important;
  }
  
  .sp-mx-60 {
    margin-left: 60px !important;
    margin-right: 60px !important;
  }
  
  .sp-my-60 {
    margin-top: 60px !important;
    margin-bottom: 60px !important;
  }

  .sp-mt-60 {
    margin-top: 60px !important;
  }

  .sp-mb-60 {
    margin-bottom: 60px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-65 {
    margin: 65px !important;
  }
  
  .sp-mx-65 {
    margin-left: 65px !important;
    margin-right: 65px !important;
  }
  
  .sp-my-65 {
    margin-top: 65px !important;
    margin-bottom: 65px !important;
  }

  .sp-mt-65 {
    margin-top: 65px !important;
  }

  .sp-mb-65 {
    margin-bottom: 65px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-70 {
    margin: 70px !important;
  }
  
  .sp-mx-70 {
    margin-left: 70px !important;
    margin-right: 70px !important;
  }
  
  .sp-my-70 {
    margin-top: 70px !important;
    margin-bottom: 70px !important;
  }

  .sp-mt-70 {
    margin-top: 70px !important;
  }

  .sp-mb-70 {
    margin-bottom: 70px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-75 {
    margin: 75px !important;
  }
  
  .sp-mx-75 {
    margin-left: 75px !important;
    margin-right: 75px !important;
  }
  
  .sp-my-75 {
    margin-top: 75px !important;
    margin-bottom: 75px !important;
  }

  .sp-mt-75 {
    margin-top: 75px !important;
  }

  .sp-mb-75 {
    margin-bottom: 75px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-80 {
    margin: 80px !important;
  }
  
  .sp-mx-80 {
    margin-left: 80px !important;
    margin-right: 80px !important;
  }
  
  .sp-my-80 {
    margin-top: 80px !important;
    margin-bottom: 80px !important;
  }

  .sp-mt-80 {
    margin-top: 80px !important;
  }

  .sp-mb-80 {
    margin-bottom: 80px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-85 {
    margin: 85px !important;
  }
  
  .sp-mx-85 {
    margin-left: 85px !important;
    margin-right: 85px !important;
  }
  
  .sp-my-85 {
    margin-top: 85px !important;
    margin-bottom: 85px !important;
  }

  .sp-mt-85 {
    margin-top: 85px !important;
  }

  .sp-mb-85 {
    margin-bottom: 85px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-90 {
    margin: 90px !important;
  }
  
  .sp-mx-90 {
    margin-left: 90px !important;
    margin-right: 90px !important;
  }
  
  .sp-my-90 {
    margin-top: 90px !important;
    margin-bottom: 90px !important;
  }

  .sp-mt-90 {
    margin-top: 90px !important;
  }

  .sp-mb-90 {
    margin-bottom: 90px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-95 {
    margin: 95px !important;
  }
  
  .sp-mx-95 {
    margin-left: 95px !important;
    margin-right: 95px !important;
  }
  
  .sp-my-95 {
    margin-top: 95px !important;
    margin-bottom: 95px !important;
  }

  .sp-mt-95 {
    margin-top: 95px !important;
  }

  .sp-mb-95 {
    margin-bottom: 95px !important;
  }
}

@media screen and (max-width: 768px) {
  .sp-m-100 {
    margin: 100px !important;
  }
  
  .sp-mx-100 {
    margin-left: 100px !important;
    margin-right: 100px !important;
  }
  
  .sp-my-100 {
    margin-top: 100px !important;
    margin-bottom: 100px !important;
  }

  .sp-mt-100 {
    margin-top: 100px !important;
  }

  .sp-mb-100 {
    margin-bottom: 100px !important;
  }
}


/* ------------------------------------------------------------------------------------
Padding
------------------------------------------------------------------------------------ */


.p-0 {
  padding: 0px !important;
}

.px-0 {
  padding-left: 0px !important;
  padding-right: 0px !important;
}

.py-0 {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

.pt-0 {
  padding-top: 0px !important;
}

.pb-0 {
  padding-bottom: 0px !important;
}


.p-5 {
  padding: 5px !important;
}

.px-5 {
  padding-left: 5px !important;
  padding-right: 5px !important;
}

.py-5 {
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

.pt-5 {
  padding-top: 5px !important;
}

.pb-5 {
  padding-bottom: 5px !important;
}


.p-10 {
  padding: 10px !important;
}

.px-10 {
  padding-left: 10px !important;
  padding-right: 10px !important;
}

.py-10 {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.pt-10 {
  padding-top: 10px !important;
}

.pb-10 {
  padding-bottom: 10px !important;
}


.p-15 {
  padding: 15px !important;
}

.px-15 {
  padding-left: 15px !important;
  padding-right: 15px !important;
}

.py-15 {
  padding-top: 15px !important;
  padding-bottom: 15px !important;
}

.pt-15 {
  padding-top: 15px !important;
}

.pb-15 {
  padding-bottom: 15px !important;
}


.p-20 {
  padding: 20px !important;
}

.px-20 {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

.py-20 {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

.pt-20 {
  padding-top: 20px !important;
}

.pb-20 {
  padding-bottom: 20px !important;
}


.p-25 {
  padding: 25px !important;
}

.px-25 {
  padding-left: 25px !important;
  padding-right: 25px !important;
}

.py-25 {
  padding-top: 25px !important;
  padding-bottom: 25px !important;
}

.pt-25 {
  padding-top: 25px !important;
}

.pb-25 {
  padding-bottom: 25px !important;
}


.p-30 {
  padding: 30px !important;
}

.px-30 {
  padding-left: 30px !important;
  padding-right: 30px !important;
}

.py-30 {
  padding-top: 30px !important;
  padding-bottom: 30px !important;
}

.pt-30 {
  padding-top: 30px !important;
}

.pb-30 {
  padding-bottom: 30px !important;
}


.p-35 {
  padding: 35px !important;
}

.px-35 {
  padding-left: 35px !important;
  padding-right: 35px !important;
}

.py-35 {
  padding-top: 35px !important;
  padding-bottom: 35px !important;
}

.pt-35 {
  padding-top: 35px !important;
}

.pb-35 {
  padding-bottom: 35px !important;
}


.p-40 {
  padding: 40px !important;
}

.px-40 {
  padding-left: 40px !important;
  padding-right: 40px !important;
}

.py-40 {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

.pt-40 {
  padding-top: 40px !important;
}

.pb-40 {
  padding-bottom: 40px !important;
}


.p-45 {
  padding: 45px !important;
}

.px-45 {
  padding-left: 45px !important;
  padding-right: 45px !important;
}

.py-45 {
  padding-top: 45px !important;
  padding-bottom: 45px !important;
}

.pt-45 {
  padding-top: 45px !important;
}

.pb-45 {
  padding-bottom: 45px !important;
}


.p-50 {
  padding: 50px !important;
}

.px-50 {
  padding-left: 50px !important;
  padding-right: 50px !important;
}

.py-50 {
  padding-top: 50px !important;
  padding-bottom: 50px !important;
}

.pt-50 {
  padding-top: 50px !important;
}

.pb-50 {
  padding-bottom: 50px !important;
}


.p-55 {
  padding: 55px !important;
}

.px-55 {
  padding-left: 55px !important;
  padding-right: 55px !important;
}

.py-55 {
  padding-top: 55px !important;
  padding-bottom: 55px !important;
}

.pt-55 {
  padding-top: 55px !important;
}

.pb-55 {
  padding-bottom: 55px !important;
}


.p-60 {
  padding: 60px !important;
}

.px-60 {
  padding-left: 60px !important;
  padding-right: 60px !important;
}

.py-60 {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
}

.pt-60 {
  padding-top: 60px !important;
}

.pb-60 {
  padding-bottom: 60px !important;
}


.p-65 {
  padding: 65px !important;
}

.px-65 {
  padding-left: 65px !important;
  padding-right: 65px !important;
}

.py-65 {
  padding-top: 65px !important;
  padding-bottom: 65px !important;
}

.pt-65 {
  padding-top: 65px !important;
}

.pb-65 {
  padding-bottom: 65px !important;
}


.p-70 {
  padding: 70px !important;
}

.px-70 {
  padding-left: 70px !important;
  padding-right: 70px !important;
}

.py-70 {
  padding-top: 70px !important;
  padding-bottom: 70px !important;
}

.pt-70 {
  padding-top: 70px !important;
}

.pb-70 {
  padding-bottom: 70px !important;
}


.p-75 {
  padding: 75px !important;
}

.px-75 {
  padding-left: 75px !important;
  padding-right: 75px !important;
}

.py-75 {
  padding-top: 75px !important;
  padding-bottom: 75px !important;
}

.pt-75 {
  padding-top: 75px !important;
}

.pb-75 {
  padding-bottom: 75px !important;
}


.p-80 {
  padding: 80px !important;
}

.px-80 {
  padding-left: 80px !important;
  padding-right: 80px !important;
}

.py-80 {
  padding-top: 80px !important;
  padding-bottom: 80px !important;
}

.pt-80 {
  padding-top: 80px !important;
}

.pb-80 {
  padding-bottom: 80px !important;
}


.p-85 {
  padding: 85px !important;
}

.px-85 {
  padding-left: 85px !important;
  padding-right: 85px !important;
}

.py-85 {
  padding-top: 85px !important;
  padding-bottom: 85px !important;
}

.pt-85 {
  padding-top: 85px !important;
}

.pb-85 {
  padding-bottom: 85px !important;
}


.p-90 {
  padding: 90px !important;
}

.px-90 {
  padding-left: 90px !important;
  padding-right: 90px !important;
}

.py-90 {
  padding-top: 90px !important;
  padding-bottom: 90px !important;
}

.pt-90 {
  padding-top: 90px !important;
}

.pb-90 {
  padding-bottom: 90px !important;
}


.p-95 {
  padding: 95px !important;
}

.px-95 {
  padding-left: 95px !important;
  padding-right: 95px !important;
}

.py-95 {
  padding-top: 95px !important;
  padding-bottom: 95px !important;
}

.pt-95 {
  padding-top: 95px !important;
}

.pb-95 {
  padding-bottom: 95px !important;
}


.p-100 {
  padding: 100px !important;
}

.px-100 {
  padding-left: 100px !important;
  padding-right: 100px !important;
}

.py-100 {
  padding-top: 100px !important;
  padding-bottom: 100px !important;
}

.pt-100 {
  padding-top: 100px !important;
}

.pb-100 {
  padding-bottom: 100px !important;
}



/* sp */

@media screen and (max-width: 768px) {
  .sp-p-0 {
    padding: 0px !important;
  }
  
  .sp-px-0 {
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
  
  .sp-py-0 {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }

  .sp-pt-0 {
    padding-top: 0px !important;
  }

  .sp-pb-0 {
    padding-bottom: 0px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-5 {
    padding: 5px !important;
  }
  
  .sp-px-5 {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
  
  .sp-py-5 {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }

  .sp-pt-5 {
    padding-top: 5px !important;
  }

  .sp-pb-5 {
    padding-bottom: 5px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-10 {
    padding: 10px !important;
  }
  
  .sp-px-10 {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  
  .sp-py-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }

  .sp-pt-10 {
    padding-top: 10px !important;
  }

  .sp-pb-10 {
    padding-bottom: 10px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-15 {
    padding: 15px !important;
  }
  
  .sp-px-15 {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  
  .sp-py-15 {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
  }

  .sp-pt-15 {
    padding-top: 15px !important;
  }

  .sp-pb-15 {
    padding-bottom: 15px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-20 {
    padding: 20px !important;
  }
  
  .sp-px-20 {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  
  .sp-py-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }

  .sp-pt-20 {
    padding-top: 20px !important;
  }

  .sp-pb-20 {
    padding-bottom: 20px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-25 {
    padding: 25px !important;
  }
  
  .sp-px-25 {
    padding-left: 25px !important;
    padding-right: 25px !important;
  }
  
  .sp-py-25 {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
  }

  .sp-pt-25 {
    padding-top: 25px !important;
  }

  .sp-pb-25 {
    padding-bottom: 25px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-30 {
    padding: 30px !important;
  }
  
  .sp-px-30 {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
  
  .sp-py-30 {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }

  .sp-pt-30 {
    padding-top: 30px !important;
  }

  .sp-pb-30 {
    padding-bottom: 30px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-35 {
    padding: 35px !important;
  }
  
  .sp-px-35 {
    padding-left: 35px !important;
    padding-right: 35px !important;
  }
  
  .sp-py-35 {
    padding-top: 35px !important;
    padding-bottom: 35px !important;
  }

  .sp-pt-35 {
    padding-top: 35px !important;
  }

  .sp-pb-35 {
    padding-bottom: 35px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-40 {
    padding: 40px !important;
  }
  
  .sp-px-40 {
    padding-left: 40px !important;
    padding-right: 40px !important;
  }
  
  .sp-py-40 {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }

  .sp-pt-40 {
    padding-top: 40px !important;
  }

  .sp-pb-40 {
    padding-bottom: 40px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-45 {
    padding: 45px !important;
  }
  
  .sp-px-45 {
    padding-left: 45px !important;
    padding-right: 45px !important;
  }
  
  .sp-py-45 {
    padding-top: 45px !important;
    padding-bottom: 45px !important;
  }

  .sp-pt-45 {
    padding-top: 45px !important;
  }

  .sp-pb-45 {
    padding-bottom: 45px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-50 {
    padding: 50px !important;
  }
  
  .sp-px-50 {
    padding-left: 50px !important;
    padding-right: 50px !important;
  }
  
  .sp-py-50 {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }

  .sp-pt-50 {
    padding-top: 50px !important;
  }

  .sp-pb-50 {
    padding-bottom: 50px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-55 {
    padding: 55px !important;
  }
  
  .sp-px-55 {
    padding-left: 55px !important;
    padding-right: 55px !important;
  }
  
  .sp-py-55 {
    padding-top: 55px !important;
    padding-bottom: 55px !important;
  }

  .sp-pt-55 {
    padding-top: 55px !important;
  }

  .sp-pb-55 {
    padding-bottom: 55px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-60 {
    padding: 60px !important;
  }
  
  .sp-px-60 {
    padding-left: 60px !important;
    padding-right: 60px !important;
  }
  
  .sp-py-60 {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
  }

  .sp-pt-60 {
    padding-top: 60px !important;
  }

  .sp-pb-60 {
    padding-bottom: 60px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-65 {
    padding: 65px !important;
  }
  
  .sp-px-65 {
    padding-left: 65px !important;
    padding-right: 65px !important;
  }
  
  .sp-py-65 {
    padding-top: 65px !important;
    padding-bottom: 65px !important;
  }

  .sp-pt-65 {
    padding-top: 65px !important;
  }

  .sp-pb-65 {
    padding-bottom: 65px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-70 {
    padding: 70px !important;
  }
  
  .sp-px-70 {
    padding-left: 70px !important;
    padding-right: 70px !important;
  }
  
  .sp-py-70 {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
  }

  .sp-pt-70 {
    padding-top: 70px !important;
  }

  .sp-pb-70 {
    padding-bottom: 70px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-75 {
    padding: 75px !important;
  }
  
  .sp-px-75 {
    padding-left: 75px !important;
    padding-right: 75px !important;
  }
  
  .sp-py-75 {
    padding-top: 75px !important;
    padding-bottom: 75px !important;
  }

  .sp-pt-75 {
    padding-top: 75px !important;
  }

  .sp-pb-75 {
    padding-bottom: 75px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-80 {
    padding: 80px !important;
  }
  
  .sp-px-80 {
    padding-left: 80px !important;
    padding-right: 80px !important;
  }
  
  .sp-py-80 {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }

  .sp-pt-80 {
    padding-top: 80px !important;
  }

  .sp-pb-80 {
    padding-bottom: 80px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-85 {
    padding: 85px !important;
  }
  
  .sp-px-85 {
    padding-left: 85px !important;
    padding-right: 85px !important;
  }
  
  .sp-py-85 {
    padding-top: 85px !important;
    padding-bottom: 85px !important;
  }

  .sp-pt-85 {
    padding-top: 85px !important;
  }

  .sp-pb-85 {
    padding-bottom: 85px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-90 {
    padding: 90px !important;
  }
  
  .sp-px-90 {
    padding-left: 90px !important;
    padding-right: 90px !important;
  }
  
  .sp-py-90 {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
  }

  .sp-pt-90 {
    padding-top: 90px !important;
  }

  .sp-pb-90 {
    padding-bottom: 90px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-95 {
    padding: 95px !important;
  }
  
  .sp-px-95 {
    padding-left: 95px !important;
    padding-right: 95px !important;
  }
  
  .sp-py-95 {
    padding-top: 95px !important;
    padding-bottom: 95px !important;
  }

  .sp-pt-95 {
    padding-top: 95px !important;
  }

  .sp-pb-95 {
    padding-bottom: 95px !important;
  }

}

@media screen and (max-width: 768px) {
  .sp-p-100 {
    padding: 100px !important;
  }
  
  .sp-px-100 {
    padding-left: 100px !important;
    padding-right: 100px !important;
  }
  
  .sp-py-100 {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }

  .sp-pt-100 {
    padding-top: 100px !important;
  }

  .sp-pb-100 {
    padding-bottom: 100px !important;
  }

}


/* ------------------------------------------------------------------------------------
text-align
------------------------------------------------------------------------------------ */
.tac {
  text-align: center!important;
}

.tal {
  text-align: left!important;
}

.tar {
  text-align: right!important;
}

/* ------------------------------------------------------------------------------------
responsive
------------------------------------------------------------------------------------ */
@media screen and (min-width: 768px) {
  .responsive {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .responsive-pc {
    display: none;
  }
}
.responsive-tab {
  display: none;
}
@media (max-width: 1200px) and (min-width: 768px) {
  .responsive-tab {
    display: block;
  }
}

/* ------------------------------------------------------------------------------------
border
------------------------------------------------------------------------------------ */
.equal-border {
  border-top: 1px solid #ddd;
} 
.u-bordercolor-bgcolor {
  border-width: 2px;
  border-color: #BAC9D9;
}
.u-bordercolor-subcolor {
  border-width: 1px;
  border-color: var(--sub);
}
.u-bordercolor-primary {
  border-color: var(--primary);
}
.u-bordercolor-sub {
  border-color: var(--sub);
}

/* ------------------------------------------------------------------------------------
width
------------------------------------------------------------------------------------ */
.u-width-free {
  padding-left: var(--padding-x);
  padding-right: var(--padding-x);
}
.u-width-free .l-section-wrapper {
  max-width: 1366px;
  width: 100%;
  padding: 0;
}
.u-width-large .l-section-wrapper {
  max-width: 1480px;
}
.u-width-medium .l-section-wrapper {
  max-width: 1220px;
}
.u-width-small .l-section-wrapper {
  max-width: 935px;
}
.u-width-xsmall .l-section-wrapper {
  max-width: 815px;
}
.u-width-small2 .l-section-wrapper {
  max-width: 970px;
}
.u-width-small2 .l-section-wrapper,
.u-width-default .l-section-wrapper,
.u-width-large .l-section-wrapper,
.u-width-medium .l-section-wrapper,
.u-width-small .l-section-wrapper,
.u-width-xsmall .l-section-wrapper {
  margin: 0 auto;
}

/* ------------------------------------------------------------------------------------
background-color
------------------------------------------------------------------------------------ */
.u-bgcolor--gradient {
  background-color: var(--primary);
  background: linear-gradient(30deg, #F5F5F5, #D4EBF8);
}
.u-bgcolor--primary {
  background-color: var(--primary);
}
.u-bgcolor--subcolor {
  background-color: var(--sub);
}

.u-bgcolor--bg_subcolor {
  background-color: var(--bg_subcolor);
}
.u-bgcolor--white {
  background-color: white;
}
.u-bgcolor--gray {
  background-color: var(--light-gray);
}
.u-bgcolor--dark-gray {
  background-color: var(--dark-gray-sub);
}
.u-bgcolor--darkgray {
  background-color: #CED4DA;
}
.u-bgcolor--lightblue {
  background-color: var(--light-blue);
}
.u-bgcolor--orange {
  background-color: var(--orange);
}
.u-bgcolor--tagcolor {
  background-color: #D6E6F7;
}
.u-bgcolor--image {
  background-size: cover;
  background-repeat: no-repeat;
}

/* ------------------------------------------------------------------------------------
text-color
------------------------------------------------------------------------------------ */
.u-textcolor--primary {
  color: var(--primary);
}
.u-textcolor--subcolor {
  color: var(--sub);
}
.u-textcolor--default {
  color: var(--default);
}
.u-textcolor--white {
  color: white;
}
.u-textcolor--black {
  color: black;
}
.u-textcolor--gray {
  color: var(--gray);
}
.u-textcolor--darkgray {
  color: var(--dark-gray-sub);
}
.u-textcolor--blue {
  color: var(--blue);
}
.u-textcolor--orange {
  color: var(--orange);
}
.u-textcolor--gold {
  color: var(--gold);
}
/* ------------------------------------------------------------------------------------
font-size
------------------------------------------------------------------------------------ */
.u-textsize-default {
  font-size: initial;
}
.u-textsize-large {
  font-size: 1.5rem;
}
.u-textsize-medium {
  font-size: 1.25rem;
}
.u-textsize-small {
  font-size: 1.125rem;
}
.u-textsize-xsmall {
  font-size: .875rem;
}
.u-textsize-xxsmall {
  font-size: .75rem;
}
/* ------------------------------------------------------------------------------------
font-weight
------------------------------------------------------------------------------------ */
.u-bold {
  font-weight: bold !important;
}
.u-smbold {
  font-weight: 500 !important;
}

/* Vendor */
/* PrismJS 1.29.0
https://prismjs.com/download.html#themes=prism-okaidia&plugins=line-numbers */
code[class*=language-],pre[class*=language-]{color:#f8f8f2;background:0 0;text-shadow:0 1px rgba(0,0,0,.3);font-family:Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto;border-radius:.3em}:not(pre)>code[class*=language-],pre[class*=language-]{background:#272822}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal}.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#8292a2}.token.punctuation{color:#f8f8f2}.token.namespace{opacity:.7}.token.constant,.token.deleted,.token.property,.token.symbol,.token.tag{color:#f92672}.token.boolean,.token.number{color:#ae81ff}.token.attr-name,.token.builtin,.token.char,.token.inserted,.token.selector,.token.string{color:#a6e22e}.language-css .token.string,.style .token.string,.token.entity,.token.operator,.token.url,.token.variable{color:#f8f8f2}.token.atrule,.token.attr-value,.token.class-name,.token.function{color:#e6db74}.token.keyword{color:#66d9ef}.token.important,.token.regex{color:#fd971f}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}
pre[class*=language-].line-numbers{position:relative;padding-left:3.8em;counter-reset:linenumber}pre[class*=language-].line-numbers>code{position:relative;white-space:inherit}.line-numbers .line-numbers-rows{position:absolute;pointer-events:none;top:0;font-size:100%;left:-3.8em;width:3em;letter-spacing:-1px;border-right:1px solid #999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.line-numbers-rows>span{display:block;counter-increment:linenumber}.line-numbers-rows>span:before{content:counter(linenumber);color:#999;display:block;padding-right:.8em;text-align:right}
@keyframes scroll-hint-appear {
  0% {
    transform: translateX(40px);
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  50%,
  100% {
    transform: translateX(-40px);
    opacity: 0;
  }
}

.scroll-hint.is-right-scrollable {
  background: linear-gradient(270deg, rgba(0, 0, 0, .15) 0, rgba(0, 0, 0, 0) 16px, rgba(0, 0, 0, 0));
}

.scroll-hint.is-right-scrollable.is-left-scrollable {
  background: linear-gradient(90deg, rgba(0, 0, 0, .15) 0, rgba(0, 0, 0, 0) 16px, rgba(0, 0, 0, 0)), linear-gradient(270deg, rgba(0, 0, 0, .15) 0, rgba(0, 0, 0, 0) 16px, rgba(0, 0, 0, 0));
}

.scroll-hint.is-left-scrollable {
  background: linear-gradient(90deg, rgba(0, 0, 0, .15) 0, rgba(0, 0, 0, 0) 16px, rgba(0, 0, 0, 0));
}

.scroll-hint-icon {
  position: absolute;
  top: calc(50% - 25px);
  left: calc(50% - 60px);
  box-sizing: border-box;
  width: 120px;
  height: 90px;
  border-radius: 5px;
  transition: opacity .3s;
  opacity: 0;
  background: rgba(0, 0, 0, .7);
  text-align: center;
  padding: 20px 10px 10px 10px;
}

.scroll-hint-icon-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  max-height: 100%;
  pointer-events: none;
}

.scroll-hint-text {
  font-size: 10px;
  color: #FFF;
  margin-top: 5px;
}

.scroll-hint-icon-wrap.is-active .scroll-hint-icon {
  opacity: .8;
}

.scroll-hint-icon:before {
  display: inline-block;
  width: 40px;
  height: 40px;
  color: #FFF;
  vertical-align: middle;
  text-align: center;
  content: "";
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNS43NyIgaGVpZ2h0PSIzMC41MiIgdmlld0JveD0iMCAwIDI1Ljc3IDMwLjUyIj48dGl0bGU+44Ki44K744OD44OIIDM8L3RpdGxlPjxnIGlkPSLjg6zjgqTjg6Tjg7xfMiIgZGF0YS1uYW1lPSLjg6zjgqTjg6Tjg7wgMiI+PGcgaWQ9IuODrOOCpOODpOODvF8xLTIiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDEiPjxwYXRoIGQ9Ik0yMS4zMywzMC41Mkg3Ljg1QTEuNTUsMS41NSwwLDAsMSw2LjMsMjlhMTIuNDYsMTIuNDYsMCwwLDAtLjYzLTQuNDIsMjUuMTYsMjUuMTYsMCwwLDAtNC4yNS01bC0uMDYtLjA2QTUsNSwwLDAsMSwwLDE1Ljg2YTMuNjQsMy42NCwwLDAsMSwxLjE3LTIuNjIsMy42MywzLjYzLDAsMCwxLDUuMTQuMDdWMy43N2EzLjc3LDMuNzcsMCwxLDEsNy41NCwwVjguMzNhMy4zNSwzLjM1LDAsMCwxLDEuMjYsMCwzLDMsMCwwLDEsMiwxLjIyLDMuNSwzLjUsMCwwLDEsMi0uMDYsMy4yMSwzLjIxLDAsMCwxLDIsMS41NCwzLjc0LDMuNzQsMCwwLDEsMywuNDdBNC4yMSw0LjIxLDAsMCwxLDI1Ljc0LDE1YzAsLjExLDAsLjI3LDAsLjQ2YTE5LjI2LDE5LjI2LDAsMCwxLS44NCw3Yy0uMTQuMzgtLjM2LjgxLS41NiwxLjIybC0uMTEuMjJjMCwuMDctLjA5LjE0LS4xNC4yMWE3LjEzLDcuMTMsMCwwLDAtMS4xNywyLjE3Yy0uMDYuNTYtLjA2LDIuMTUtLjA1LDIuNzFBMS41NSwxLjU1LDAsMCwxLDIxLjMzLDMwLjUyWk04LjYxLDI4LjIxaDEyYzAtLjcxLDAtMS43MS4wNy0yLjIzYTguNzQsOC43NCwwLDAsMSwxLjU5LTMuMjVsLjA2LS4xMmExMCwxMCwwLDAsMCwuNDYtMSwxNi44LDE2LjgsMCwwLDAsLjctNi4xMmMwLS4yMywwLS40MSwwLS41NGgwYTIsMiwwLDAsMC0uNjQtMS41MiwxLjMzLDEuMzMsMCwwLDAtMS41NS4wOCwxLjEzLDEuMTMsMCwwLDEtMS4xOC4yOCwxLjE1LDEuMTUsMCwwLDEtLjc4LS45NCwxLjI2LDEuMjYsMCwwLDAtLjc1LTEuMTEsMSwxLDAsMCwwLTEuMTEuMjhsLS4xLjFhMS4xNSwxLjE1LDAsMCwxLTEuMTkuMjksMS4xNiwxLjE2LDAsMCwxLS43OC0uOTVjLS4wOS0uNjgtLjIxLS43Ny0uNy0uODdhLjgyLjgyLDAsMCwwLTEsLjQ4LDEuMTYsMS4xNiwwLDAsMS0yLjE2LS41OFYzLjc3YTEuNDYsMS40NiwwLDEsMC0yLjkyLDB2Ny44NWwwLDQuMzNhMS4xNywxLjE3LDAsMCwxLS44MywxLjExLDEuMTUsMS4xNSwwLDAsMS0xLjItLjM1bC0xLS45MWMtLjQ3LS40Mi0uNzMtLjY2LS44NC0uNzdhMS4zNSwxLjM1LDAsMCwwLTItLjEyTDIuNywxNWExLjMyLDEuMzIsMCwwLDAtLjM5LDFBMi41NywyLjU3LDAsMCwwLDMsMTcuODVsMCwwYTI3LjI0LDI3LjI0LDAsMCwxLDQuNyw1LjYyQTEyLjYzLDEyLjYzLDAsMCwxLDguNjEsMjguMjFaTTIzLjIsMjMuMzVaTTYuNTEsMTYuNTlaIiBmaWxsPSIjZmZmIi8+PC9nPjwvZz48L3N2Zz4=);
}

.scroll-hint-icon:after {
  content: "";
  width: 34px;
  height: 14px;
  display: block;
  position: absolute;
  top: 10px;
  left: 50%;
  margin-left: -20px;
  background-repeat: no-repeat;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMy4yOSIgaGVpZ2h0PSIxMi4wMiIgdmlld0JveD0iMCAwIDMzLjI5IDEyLjAyIj48dGl0bGU+44Ki44K744OD44OIIDE8L3RpdGxlPjxnIGlkPSLjg6zjgqTjg6Tjg7xfMiIgZGF0YS1uYW1lPSLjg6zjgqTjg6Tjg7wgMiI+PGcgaWQ9IuODrOOCpOODpOODvF8xLTIiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDEiPjxsaW5lIHgxPSIxLjg1IiB5MT0iNi4wMSIgeDI9IjEwLjQiIHkyPSI2LjAxIiBmaWxsPSIjZmZmIi8+PHBhdGggZD0iTTEwLjQsNy4xN0gxLjg1YTEuMTYsMS4xNiwwLDEsMSwwLTIuMzFIMTAuNGExLjE2LDEuMTYsMCwxLDEsMCwyLjMxWiIgZmlsbD0iI2ZmZiIvPjxwYXRoIGQ9Ik03LjQsMTJhMS4xNSwxLjE1LDAsMCwxLS43Mi0uMjVsLTYuMjUtNUExLjIsMS4yLDAsMCwxLDAsNS44NywxLjE0LDEuMTQsMCwwLDEsLjQ2LDVMNi43LjIzQTEuMTYsMS4xNiwwLDAsMSw4LjEsMi4wOEwzLDUuOTEsOC4xMiwxMEExLjE2LDEuMTYsMCwwLDEsNy40LDEyWiIgZmlsbD0iI2ZmZiIvPjxsaW5lIHgxPSIzMS40NSIgeTE9IjYuMDEiIHgyPSIyMi44OSIgeTI9IjYuMDEiIGZpbGw9IiNmZmYiLz48cGF0aCBkPSJNMzEuNDUsNy4xN0gyMi44OWExLjE2LDEuMTYsMCwxLDEsMC0yLjMxaDguNTZhMS4xNiwxLjE2LDAsMCwxLDAsMi4zMVoiIGZpbGw9IiNmZmYiLz48cGF0aCBkPSJNMjUuOSwxMmExLjE4LDEuMTgsMCwwLDEtLjkxLS40M0ExLjE3LDEuMTcsMCwwLDEsMjUuMTcsMTBsNS4wOS00LjA1TDI1LjIsMi4wOEExLjE2LDEuMTYsMCwwLDEsMjYuNTkuMjNMMzIuODQsNWExLjE2LDEuMTYsMCwwLDEsLjQ1LjkxLDEuMTQsMS4xNCwwLDAsMS0uNDMuOTJsLTYuMjQsNUExLjE3LDEuMTcsMCwwLDEsMjUuOSwxMloiIGZpbGw9IiNmZmYiLz48L2c+PC9nPjwvc3ZnPg==);
  opacity: 0;
  transition-delay: 2.4s;
}

.scroll-hint-icon-wrap.is-active .scroll-hint-icon:after {
  opacity: 1;
}

.scroll-hint-icon-wrap.is-active .scroll-hint-icon:before {
  animation: scroll-hint-appear 1.2s linear;
  animation-iteration-count: 2;
}

.scroll-hint-icon-white {
  background-color: #FFF;
  box-shadow: 0 4px 5px rgba(0, 0, 0, .4);
}

.scroll-hint-icon-white:before {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNS43NyIgaGVpZ2h0PSIzMC41MiIgdmlld0JveD0iMCAwIDI1Ljc3IDMwLjUyIj48dGl0bGU+44Ki44K744OD44OIIDQ8L3RpdGxlPjxnIGlkPSLjg6zjgqTjg6Tjg7xfMiIgZGF0YS1uYW1lPSLjg6zjgqTjg6Tjg7wgMiI+PGcgaWQ9IuODrOOCpOODpOODvF8xLTIiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDEiPjxwYXRoIGQ9Ik0yMS4zMywzMC41Mkg3Ljg1QTEuNTUsMS41NSwwLDAsMSw2LjMsMjlhMTIuNDYsMTIuNDYsMCwwLDAtLjYzLTQuNDIsMjUuMTYsMjUuMTYsMCwwLDAtNC4yNS01bC0uMDYtLjA2QTUsNSwwLDAsMSwwLDE1Ljg2YTMuNjQsMy42NCwwLDAsMSwxLjE3LTIuNjIsMy42MywzLjYzLDAsMCwxLDUuMTQuMDdWMy43N2EzLjc3LDMuNzcsMCwxLDEsNy41NCwwVjguMzNhMy4zNSwzLjM1LDAsMCwxLDEuMjYsMCwzLDMsMCwwLDEsMiwxLjIyLDMuNSwzLjUsMCwwLDEsMi0uMDYsMy4yMSwzLjIxLDAsMCwxLDIsMS41NCwzLjc0LDMuNzQsMCwwLDEsMywuNDdBNC4yMSw0LjIxLDAsMCwxLDI1Ljc0LDE1YzAsLjExLDAsLjI3LDAsLjQ2YTE5LjI2LDE5LjI2LDAsMCwxLS44NCw3Yy0uMTQuMzgtLjM2LjgxLS41NiwxLjIybC0uMTEuMjJjMCwuMDctLjA5LjE0LS4xNC4yMWE3LjEzLDcuMTMsMCwwLDAtMS4xNywyLjE3Yy0uMDYuNTYtLjA2LDIuMTUtLjA1LDIuNzFBMS41NSwxLjU1LDAsMCwxLDIxLjMzLDMwLjUyWk04LjYxLDI4LjIxaDEyYzAtLjcxLDAtMS43MS4wNy0yLjIzYTguNzQsOC43NCwwLDAsMSwxLjU5LTMuMjVsLjA2LS4xMmExMCwxMCwwLDAsMCwuNDYtMSwxNi44LDE2LjgsMCwwLDAsLjctNi4xMmMwLS4yMywwLS40MSwwLS41NGgwYTIsMiwwLDAsMC0uNjQtMS41MiwxLjMzLDEuMzMsMCwwLDAtMS41NS4wOCwxLjEzLDEuMTMsMCwwLDEtMS4xOC4yOCwxLjE1LDEuMTUsMCwwLDEtLjc4LS45NCwxLjI2LDEuMjYsMCwwLDAtLjc1LTEuMTEsMSwxLDAsMCwwLTEuMTEuMjhsLS4xLjFhMS4xNSwxLjE1LDAsMCwxLTEuMTkuMjksMS4xNiwxLjE2LDAsMCwxLS43OC0uOTVjLS4wOS0uNjgtLjIxLS43Ny0uNy0uODdhLjgyLjgyLDAsMCwwLTEsLjQ4LDEuMTYsMS4xNiwwLDAsMS0yLjE2LS41OFYzLjc3YTEuNDYsMS40NiwwLDEsMC0yLjkyLDB2Ny44NWwwLDQuMzNhMS4xNywxLjE3LDAsMCwxLS44MywxLjExLDEuMTUsMS4xNSwwLDAsMS0xLjItLjM1bC0xLS45MWMtLjQ3LS40Mi0uNzMtLjY2LS44NC0uNzdhMS4zNSwxLjM1LDAsMCwwLTItLjEyTDIuNywxNWExLjMyLDEuMzIsMCwwLDAtLjM5LDFBMi41NywyLjU3LDAsMCwwLDMsMTcuODVsMCwwYTI3LjI0LDI3LjI0LDAsMCwxLDQuNyw1LjYyQTEyLjYzLDEyLjYzLDAsMCwxLDguNjEsMjguMjFaTTIzLjIsMjMuMzVaTTYuNTEsMTYuNTlaIi8+PC9nPjwvZz48L3N2Zz4=);
}

.scroll-hint-icon-white:after {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMy4yOSIgaGVpZ2h0PSIxMi4wMiIgdmlld0JveD0iMCAwIDMzLjI5IDEyLjAyIj48dGl0bGU+44Ki44K744OD44OIIDI8L3RpdGxlPjxnIGlkPSLjg6zjgqTjg6Tjg7xfMiIgZGF0YS1uYW1lPSLjg6zjgqTjg6Tjg7wgMiI+PGcgaWQ9IuODrOOCpOODpOODvF8xLTIiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDEiPjxsaW5lIHgxPSIxLjg1IiB5MT0iNi4wMSIgeDI9IjEwLjQiIHkyPSI2LjAxIi8+PHBhdGggZD0iTTEwLjQsNy4xN0gxLjg1YTEuMTYsMS4xNiwwLDEsMSwwLTIuMzFIMTAuNGExLjE2LDEuMTYsMCwxLDEsMCwyLjMxWiIvPjxwYXRoIGQ9Ik03LjQsMTJhMS4xNSwxLjE1LDAsMCwxLS43Mi0uMjVsLTYuMjUtNUExLjIsMS4yLDAsMCwxLDAsNS44NywxLjE0LDEuMTQsMCwwLDEsLjQ2LDVMNi43LjIzQTEuMTYsMS4xNiwwLDAsMSw4LjEsMi4wOEwzLDUuOTEsOC4xMiwxMEExLjE2LDEuMTYsMCwwLDEsNy40LDEyWiIvPjxsaW5lIHgxPSIzMS40NSIgeTE9IjYuMDEiIHgyPSIyMi44OSIgeTI9IjYuMDEiLz48cGF0aCBkPSJNMzEuNDUsNy4xN0gyMi44OWExLjE2LDEuMTYsMCwxLDEsMC0yLjMxaDguNTZhMS4xNiwxLjE2LDAsMCwxLDAsMi4zMVoiLz48cGF0aCBkPSJNMjUuOSwxMmExLjE4LDEuMTgsMCwwLDEtLjkxLS40M0ExLjE3LDEuMTcsMCwwLDEsMjUuMTcsMTBsNS4wOS00LjA1TDI1LjIsMi4wOEExLjE2LDEuMTYsMCwwLDEsMjYuNTkuMjNMMzIuODQsNWExLjE2LDEuMTYsMCwwLDEsLjQ1LjkxLDEuMTQsMS4xNCwwLDAsMS0uNDMuOTJsLTYuMjQsNUExLjE3LDEuMTcsMCwwLDEsMjUuOSwxMloiLz48L2c+PC9nPjwvc3ZnPg==);
}

.scroll-hint-icon-white .scroll-hint-text {
  color: #000;
}