/* --Guide--
1. Preset
    1-2. Media Query
    1-3. Initial value settings
    1-4. Font settings
    1-5. Padding / Margin
    1-6. Height / Width
    1-7. Background settings
    1-8. Border settings
    1-9. Text decoration
    1-10. White space
    1-11. List Icons
    1-12. Shadow

2. Modules
    2-1. Text styles
    2-2. Icons
    2-3. Header
    2-4. Footer
    2-5. Layout
    2-6. Form
    2-7. Buttons
    2-8. Table
    2-9. Navigation
    2-10. Step Bar
    2-11. Member add box
    2-12. Main KV
    2-13. Member label
    2-14. Accordion list
    2-15. Member carousel
    2-16. Alert massage
    2-17. List items
    2-18. Dialog
    2-19. Modal
    2-20. Inform bar

3. Page Customize


*/
/* ----------
 1. Preset
---------- */
/* 1-2. Media Query */
@media screen and (min-width: 1024px) {
  .hide_pc {
    display: none !important;
  }
}
@media screen and (min-width: 768px) {
  .hide_pc_tab {
    display: none !important;
  }
}
@media screen and (max-width: 1023px) {
  .hide_sp_tab {
    display: none !important;
  }
}
@media screen and (max-width: 767px) {
  .hide_sp {
    display: none !important;
  }
}
/* 1-3. Initial value settings */
/* Colors */
/* Transition */
/* Radius */
.radius {
  border-radius: 3px;
}
/* Hover Opacity */
/* Padding */
/* 1-4. Font settings */
/* Font Weight */
.fw_b {
  font-weight: 700 !important;
}
/* Bold */
.fw_m {
  font-weight: 500 !important;
}
/* Medium */
.fw_n {
  font-weight: 400 !important;
}
/* Normal */
/* Font layout */
.ta_l {
  text-align: left;
}
.ta_c {
  text-align: center;
}
.ta_r {
  text-align: right;
}
/* Font size */
.fz_12 {
  font-size: 12px !important;
}
.fz_13 {
  font-size: 13px !important;
}
.fz_14 {
  font-size: 14px !important;
}
.fz_16 {
  font-size: 16px !important;
}
.fz_18 {
  font-size: 18px !important;
}
.fz_20 {
  font-size: 20px !important;
}
.fz_30 {
  font-size: 30px !important;
}
/* English and Number Fonts */
.josefin_sans {
  font-family: "Josefin Sans", sans-serif;
}
/* English and Number Fonts */
.mincho {
  font-family: "Hiragino Mincho ProN", "Noto Serif JP", serif;
}
/* Font colors */
.tcr_default {
  color: #000 !important;
}
.tcr_link {
  color: #787878 !important;
}
.tcr_primary {
  color: #ef6c1a !important;
}
.tcr_secondary {
  color: #3c3c3c !important;
}
.tcr_attention {
  color: #f49452 !important;
}
.tcr_darkgray {
  color: #27253b;
}
.tcr_gray {
  color: #9b98a2;
}
.tcr_blue {
  color: #424b8e !important;
}
.tcr_white {
  color: #fff !important;
}
.tcr_skyblue {
  color: #5cb5d0 !important;
}
.tcr_outline_white {
  text-shadow: 1px 1px 0px #ffffff, -1px 1px 0px #ffffff, 1px -1px 0px #ffffff,
    -1px -1px 0px #ffffff, 1px 0px 0px #ffffff, 0px 1px 0px #ffffff,
    -1px 0px 0px #ffffff, 0px -1px 0px #ffffff;
}
/* Line height */
.lh_12 {
  line-height: 1.2;
}
.lh_default {
  line-height: 1.5;
}
/* default */
/* 1-5. Padding / Margin */
.pb_8 {
  padding-bottom: 8px !important;
}
.pb_12 {
  padding-bottom: 12px !important;
}
.pb_16 {
  padding-bottom: 16px !important;
}
.pb_24 {
  padding-bottom: 24px !important;
}
.pb_32 {
  padding-bottom: 32px !important;
}
.pb_40 {
  padding-bottom: 40px !important;
}
.pb_64 {
  padding-bottom: 64px !important;
}
.pb_80 {
  padding-bottom: 80px !important;
}
.pb_120 {
  padding-bottom: 120px !important;
}
.pt_0 {
  padding-top: 0px !important;
}
.pt_8 {
  padding-top: 8px !important;
}
.pt_16 {
  padding-top: 16px !important;
}
.pt_24 {
  padding-top: 24px !important;
}
.pt_32 {
  padding-top: 32px !important;
}
.pt_34 {
  padding-top: 32px !important;
}
.pt_40 {
  padding-top: 40px !important;
}
.pt_64 {
  padding-top: 64px !important;
}
.pt_80 {
  padding-top: 80px !important;
}
.pt_120 {
  padding-top: 120px !important;
}
.pr_8 {
  padding-right: 8px !important;
}
.pr_16 {
  padding-right: 16px !important;
}
.pr_24 {
  padding-right: 24px !important;
}
.pl_4 {
  padding-left: 4px !important;
}
.pl_8 {
  padding-left: 8px !important;
}
.pl_16 {
  padding-left: 16px !important;
}
.pl_24 {
  padding-left: 24px !important;
}
.mb_4 {
  margin-bottom: 4px !important;
}
.mb_8 {
  margin-bottom: 8px !important;
}
.mb_16 {
  margin-bottom: 16px !important;
}
.mb_24 {
  margin-bottom: 24px !important;
}
.mb_32 {
  margin-bottom: 32px !important;
}
.mb_40 {
  margin-bottom: 40px !important;
}
.mb_56 {
  margin-bottom: 56px !important;
}
.mb_64 {
  margin-bottom: 64px !important;
}
.mb_80 {
  margin-bottom: 80px !important;
}
.mb_120 {
  margin-bottom: 120px !important;
}
.mb_140 {
  margin-bottom: 140px !important;
}
.mt_8 {
  margin-top: 8px !important;
}
.mt_16 {
  margin-top: 16px !important;
}
.mt_24 {
  margin-top: 24px !important;
}
.mt_32 {
  margin-top: 32px !important;
}
.mt_40 {
  margin-top: 40px !important;
}
.mt_64 {
  margin-top: 64px !important;
}
.mt_80 {
  margin-top: 80px !important;
}
.mt_120 {
  margin-top: 120px !important;
}
.mt_160 {
  margin-top: 160px !important;
}
.mr_8 {
  margin-right: 8px !important;
}
.mr_16 {
  margin-right: 16px !important;
}
.mr_24 {
  margin-right: 24px !important;
}
.mr_32 {
  margin-right: 32px !important;
}
.mr_40 {
  margin-right: 40px !important;
}
.ml_8 {
  margin-left: 8px !important;
}
.ml_16 {
  margin-left: 16px !important;
}
.ml_24 {
  margin-left: 24px !important;
}
.ml_32 {
  margin-left: 32px !important;
}
.ml_40 {
  margin-left: 40px !important;
}
/* Height / Width */
.h0 {
  height: 0 !important;
}
.h40 {
  height: 40px;
}
.h50 {
  height: 50px;
}
.h60 {
  height: 60px;
}
.w40 {
  width: 40px;
}
.w50 {
  width: 50px;
}
.w60 {
  width: 60px;
}
.mw_40 {
  min-width: 40px;
}
.mw_60 {
  min-width: 60px;
}
.mw_80 {
  min-width: 80px;
}
.mw_130 {
  min-width: 130px;
}
.mx_340 {
  max-width: 340px;
}
.mx_480 {
  max-width: 480px;
}
/* Background settings */
.bg_base_primary {
  background: #ef6c1a;
}
.bg_base_secondary {
  background: #3c3c3c;
}
.bg_base_white {
  background: #fff;
}
.bg_base_gray {
  background: #ebebed;
}
.bg_base_lightblue {
  background: #e0f1f6;
}
/* Border settings */
.bd_all {
  border: 1px solid #cacaca;
}
.bd_b {
  border-bottom: 1px solid #cacaca;
}
/* Text decoration */
.td_n {
  text-decoration: none;
}
/* Strong Number */
.strong_num {
  font-size: 24px;
  margin: 0 2px;
  color: #36b6d3;
  font-weight: bold;
}
/* ----------
 2. Modules
---------- */
/* Text styles */
.mod_txt_h1 {
  font-size: 30px;
  font-weight: 700;
  line-height: 1.5;
}
.mod_txt_h2 {
  font-size: 36px;
  font-weight: 700;
  line-height: 1.5;
}
@media screen and (min-width: 767px) and (max-width: 1024px) {
  .mod_txt_h2 {
    font-size: 30px;
  }
}
@media screen and (max-width: 767px) {
  .mod_txt_h2 {
    font-size: 24px;
  }
}
.mod_txt_h3 {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
}
.mod_txt_button {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
}
.mod_txt_title {
  font-size: 12px;
  font-weight: 500;
  line-height: 1.2;
}
.mod_txt_message {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
}
.mod_txt_normal {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
}
.mod_txt_light {
  font-size: 12px;
  color: #787878;
  line-height: 1.5;
}
.mod_txt_caption {
  font-size: 10px;
  color: #787878;
  font-weight: 700;
  line-height: 1.5;
}
.mod_txt_link {
  font-size: 12px;
  font-weight: 700;
  color: #3c3c3c;
  line-height: 1.5;
  text-decoration: none;
}
.mod_page_title {
  font-size: 30px;
  font-weight: 700;
  line-height: 1.5;
  color: #ef6c1a;
  padding-left: 40px;
  margin: 40px 0 20px 0;
}
@media screen and (max-width: 767px) {
  .mod_page_title {
    font-size: 24px;
    margin: 24px 0 11px 0;
    padding-right: 19px !important;
    padding-left: 19px !important;
  }
}
.mod_txt_copy {
  font-size: 10px;
  font-weight: 700;
}
.mod_txt_left-line {
  border-left: 3px solid #5cb5d0;
}
/* 2-3. Header */
header {
  border-bottom: 1px solid #cacaca;
  position: sticky;
  overflow: hidden;
  top: 0;
  z-index: 20;
  background: #fff;
}
header.open {
  overflow: visible;
}
header h1 {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
header .inner {
  height: 56px;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1023px) {
  header .inner .left p {
    display: none;
  }
}
header .inner .right {
  display: flex;
}
@media screen and (max-width: 1023px) {
  header .inner .right {
    display: none;
  }
}
header .inner .right p {
  display: flex;
  flex-direction: column;
  justify-content: center;
  color: #ef6c1a;
}
header .inner .right p:first-child {
  margin-right: 15px;
}
header .inner .right .links {
  margin: 0;
  padding: 0;
  list-style-type: none;
  display: flex;
  margin-right: 20px;
}
header .inner .right .links li {
  width: 120px;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
header .inner .right .links li a {
  text-decoration: none;
  color: #000;
  font-size: 14px;
}
header .inner .right .links li a:hover {
  text-decoration: underline;
}
header .inner .hamburger {
  position: absolute;
  top: 0;
  right: 0;
  width: 56px;
  height: 56px;
}
header .inner .hamburger .panel {
  display: block;
  width: 100%;
  height: 100%;
  background: url("../img/top/icon_sort.svg") no-repeat center center;
}
header .inner .hamburger .panel.open {
  background: url("../img/top/icon_close.svg") no-repeat center center;
}
header .inner .hamburger_inner {
  position: absolute;
  right: -100%;
  top: 56px;
  padding: 40px 15px;
  z-index: 5;
  width: 175px;
  background: #fff;
  border-left: 1px solid #cacaca;
  border-bottom: 1px solid #cacaca;
  transition: 0.3s;
}
header .inner .hamburger_inner.open {
  right: 0;
}
header .inner .hamburger_inner .hamburger_links {
  display: flex;
  flex-direction: column;
  margin-bottom: 18px;
}
header .inner .hamburger_inner .hamburger_links li {
  margin-bottom: 4px;
}
header .inner .hamburger_inner .hamburger_links li a {
  text-decoration: none;
  color: #000;
  font-size: 14px;
}
header .inner .hamburger_inner .hamburger_links li a:hover {
  text-decoration: underline;
}
/* SP Header */
.mod_header_sp {
  padding: 10px 10px 10px 24px;
  display: flex;
  justify-content: space-between;
}
.mod_header_sp .logo {
  max-width: 150px;
}
/* 2-4. Footer */
#footer_default {
  padding: 70px 0 35px 0;
  background: #3e3e43;
  color: #fff;
}
@media screen and (max-width: 767px) {
  #footer_default {
    padding: 40px 0 12px 0;
  }
}
#footer_default .ly_flex {
  margin-bottom: 100px;
}
@media screen and (max-width: 767px) {
  #footer_default .ly_flex {
    flex-direction: column;
  }
}
#footer_default .left {
  font-size: 14px;
}
@media screen and (max-width: 767px) {
  #footer_default .left {
    margin-bottom: 37px;
  }
}
#footer_default .left .logo {
  margin-bottom: 30px;
}
#footer_default h4 {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 17px;
}
#footer_default .company {
  margin: 0;
  padding: 0;
  list-style-type: none;
  font-size: 14px;
}
#footer_default .company li {
  margin-bottom: 20px;
}
#footer_default .company li a {
  color: #fff;
}
#footer_default .company li a:not(:hover) {
  text-decoration: none;
}
#footer_default .copy {
  text-align: center;
  display: block;
  font-size: 12px;
}
/* Layout */
.ly_dis_b {
  display: block;
}
.ly_dis_ib {
  display: inline-block;
}
.ly_dis_i {
  display: inline;
}
.ly_center {
  display: block;
  margin-right: auto !important;
  margin-left: auto !important;
}
.ly_flex {
  display: flex;
}
.ly_flex .ly_cont {
  margin-right: 4px;
  margin-left: 4px;
}
.ly_flex.wrap {
  flex-wrap: wrap;
}
.ly_flex.center {
  justify-content: center;
}
.ly_flex.side {
  justify-content: space-between;
}
.ly_flex.left {
  justify-content: start;
}
.ly_flex.right {
  justify-content: flex-end;
}
@media screen and (min-width: 768px) {
  .ly_flex.pc_center {
    justify-content: center;
  }
}
@media screen and (max-width: 767px) {
  .ly_flex.sp_center {
    justify-content: center;
  }
}
@media screen and (max-width: 767px) {
  .ly_flex.sp_2_column .ly_cont {
    width: calc((100% - 16px) / 2);
  }
}
.ly_flex_vertical {
  display: flex;
  flex-direction: column;
}
.ly_flex_vertical.center {
  justify-content: center;
}
.ly_flex_vertical.side {
  justify-content: space-between;
}
/* Form */
.form_text {
  width: 100%;
  padding: 8px;
  font-size: 14px;
  color: #000;
  border: 1px solid #cacaca;
  border-radius: 3px;
  font-weight: 700;
}
.form_text::placeholder {
  color: #787878;
  font-weight: 400 !important;
}
.form_text.alert {
  border: 1px solid #e41a10;
}
.alert-text {
  font-size: 12px;
  color: #e41a10;
  text-align: right;
}
.form_textarea {
  width: 100%;
  padding: 8px;
  font-size: 14px;
  color: #000;
  border: 1px solid #cacaca;
  border-radius: 3px;
  font-weight: 700;
}
.form_textarea::placeholder {
  color: #787878;
  font-weight: 400 !important;
}
.form_textarea.alert {
  border: 1px solid #e41a10;
}
.form_select {
  position: relative;
}
.form_select::after {
  display: block;
  content: " ";
  position: absolute;
  top: 50%;
  right: 8px;
  width: 20px;
  height: 20px;
  margin-top: -8px;
  background: url("../img/common/icons/icon_expand_more.svg") 0 0 no-repeat;
  background-size: 20px;
  pointer-events: none;
}
.form_select select {
  width: 100%;
  padding: 8px;
  font-size: 14px;
  color: #000;
  border: 1px solid #cacaca;
  border-radius: 3px;
  background: #fff;
  border-radius: 0;
  border: none;
  border-bottom: 1px solid #cacaca;
  position: relative;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-weight: 700;
}
.form_select select::placeholder {
  color: #787878;
  font-weight: 400 !important;
}
.form_select select.alert {
  border: 1px solid #e41a10;
}
@media screen and (max-width: 767px) {
  .form_select select {
    font-size: 12px;
  }
}
.form_radio input {
  display: none;
}
.form_radio input + label {
  padding-left: 20px;
  position: relative;
  margin-right: 20px;
}
.form_radio input + label::before {
  display: block;
  content: " ";
  position: absolute;
  top: 45%;
  left: -2px;
  width: 20px;
  height: 20px;
  margin-top: -8px;
  background: url("../img/common/icons/icon_radio_off.svg") 0 0 no-repeat;
  background-size: 20px;
  pointer-events: none;
}
.form_radio input:checked + label::before {
  background: url("../img/common/icons/icon_radio_on.svg") 0 0 no-repeat;
  background-size: 20px;
}
.form_checkbox input {
  display: none;
}
.form_checkbox input + label {
  display: block;
  padding-left: 20px;
  margin-right: 20px;
  position: relative;
}
.form_checkbox input + label::before {
  display: block;
  content: " ";
  position: absolute;
  top: 8px;
  left: -2px;
  width: 20px;
  height: 20px;
  margin-top: -8px;
  background: url("../img/common/icons/icon_check_off.svg") 0 0 no-repeat;
  background-size: 20px;
  pointer-events: none;
}
.form_checkbox input:checked + label::before {
  background: url("../img/common/icons/icon_check_on.svg") 0 0 no-repeat;
  background-size: 20px;
}
.form_toggle input {
  display: none;
}
.form_toggle label {
  position: relative;
  display: block;
  padding-right: 35px;
  cursor: pointer;
}
.form_toggle label::selection {
  background: none;
}
.form_toggle input[type="checkbox"] {
  position: absolute;
  visibility: hidden !important;
}
.form_toggle input[type="checkbox"] + label:before,
.form_toggle input[type="checkbox"] + label:after {
  position: absolute;
  top: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin-top: -7.5px;
  content: "";
}
.form_toggle input[type="checkbox"] + label:before {
  right: 0;
  width: 36px;
  height: 20px;
  border: 3px solid #dadada;
  border-radius: 15px;
  background: #fff;
}
.form_toggle input[type="checkbox"]:checked + label:before {
  border: 3px solid #ef6c1a;
}
.form_toggle input[type="checkbox"] + label:after {
  right: 21px;
  top: 15px;
  width: 10px;
  height: 10px;
  -webkit-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
  border-radius: 50%;
  background: #dadada;
}
.form_toggle input[type="checkbox"]:checked + label:after {
  right: 5px;
  background: #ef6c1a;
}
/* Buttons */
.btn_sizing.negative {
  opacity: 0.5;
  pointer-events: none;
}
.btn_sizing.fit {
  width: 100%;
}
.btn_sizing.small {
  width: 145px;
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}
.btn_sizing.middle {
  width: 180px;
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}
.btn_sizing.large {
  width: 280px;
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}
.btn_sizing.thin {
  padding-top: 8px;
  padding-bottom: 8px;
}
.btn_primary {
  display: inline-block;
  padding: 18px 10px;
  max-width: 100%;
  background: #5cb5d0;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  border-radius: 4px;
  border: none;
  cursor: pointer;
  transition: 0.3s;
  filter: drop-shadow(4px 4px 10px rgba(0, 0, 0, 0.2));
}
.btn_primary.negative {
  opacity: 0.5;
  pointer-events: none;
}
.btn_primary.fit {
  width: 100%;
}
.btn_primary.small {
  width: 145px;
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}
.btn_primary.middle {
  width: 180px;
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}
.btn_primary.large {
  width: 280px;
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}
.btn_primary.thin {
  padding-top: 8px;
  padding-bottom: 8px;
}
@media screen and (max-width: 767px) {
  .btn_primary {
    padding: 20px 8px;
  }
}
.btn_primary.white {
  color: #5cb5d0;
  background: #fff;
}
.btn_primary:hover {
  opacity: 0.8;
}
.btn_primary.disable {
  cursor: not-allowed;
  background: rgba(239, 108, 26, 0.2);
}
.btn_secondary {
  display: block;
  font-size: 12px;
  font-weight: bold;
  color: #424b8e;
  border: 1px solid #424b8e;
  background: #fff;
  border-radius: 4px;
  text-decoration: none;
  text-align: center;
  padding: 7px 0;
}
.btn_secondary.negative {
  opacity: 0.5;
  pointer-events: none;
}
.btn_secondary.fit {
  width: 100%;
}
.btn_secondary.small {
  width: 145px;
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}
.btn_secondary.middle {
  width: 180px;
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}
.btn_secondary.large {
  width: 280px;
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}
.btn_secondary.thin {
  padding-top: 8px;
  padding-bottom: 8px;
}
.btn_secondary:hover {
  opacity: 0.8;
}
/* CSS Preset */
* {
  box-sizing: border-box;
}
body,
#__next {
  font-family: "Noto Sans JP", sans-serif;
  color: #000;
  font-size: 16px;
  position: relative;
  display: flex;
  display: -ms-flexbox;
  flex-direction: column;
  -ms-flex-direction: column;
  min-height: 100vh;
  width: 100%;
}
body > .content,
#__next > .content {
  flex: 1 0 auto;
  min-height: 1px;
  /*IE11 img resizing bug*/
}
body .modal_page,
#__next .modal_page {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: 1;
  background: #fff;
  transition: 0.6s;
  overflow-x: hidden;
  overflow-y: auto;
  z-index: 1;
}
img {
  max-width: 100%;
  max-height: 100%;
}
img:not([alt]) {
  /* Counter reset css */
  filter: none;
}
@media screen and (max-width: 1023px) {
  .sp_default {
    padding-right: 19px !important;
    padding-left: 19px !important;
  }
}
@media screen and (min-width: 1024px) {
  .width_default {
    max-width: 980px;
    margin-right: auto;
    margin-left: auto;
  }
}
@media screen and (min-width: 1024px) {
  .width_default_pc560 {
    max-width: 560px;
    margin-right: auto;
    margin-left: auto;
  }
}
@media screen and (min-width: 1024px) {
  .width_default_pc670 {
    max-width: 670px;
    margin-right: auto;
    margin-left: auto;
  }
}
@media screen and (min-width: 1024px) {
  .width_default_pc860 {
    max-width: 860px;
    margin-right: auto;
    margin-left: auto;
  }
}
@media screen and (min-width: 1024px) {
  .width_default_pc900 {
    max-width: 900px;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
@media screen and (min-width: 1024px) {
  .width_default_pc950 {
    max-width: 950px;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
@media screen and (min-width: 1024px) {
  .width_default_pc990 {
    max-width: 990px;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
@media screen and (min-width: 1024px) {
  .width_default_pc1030 {
    max-width: 1030px;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
@media screen and (min-width: 1024px) {
  .width_default_pc1080 {
    max-width: 1080px;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
@media screen and (min-width: 1024px) {
  .width_default_pc1200 {
    max-width: 1200px;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
.reset_list {
  margin: 0;
  padding: 0;
  list-style-type: none;
}
/* ----------
 3. Page Customize
---------- */
/* 3-1. Contact form */
.wrap-form-contact {
  padding: 70px 0 120px 0;
}
@media screen and (max-width: 767px) {
  .wrap-form-contact {
    padding: 40px 0 30px 0;
  }
}
.wrap-form-contact h2 {
  margin-bottom: 70px;
}
@media screen and (max-width: 767px) {
  .wrap-form-contact h2 {
    text-align: left;
    margin-bottom: 40px;
  }
}
.wrap-form-contact > .note {
  margin: 0;
  padding: 0;
  list-style-type: none;
}
.wrap-form-contact > .note li {
  border-left: 3px solid #5cb5d0;
  margin-bottom: 1rem;
  padding-left: 0.5rem;
}
.contact-form .row:not(.is-note),
.contact-form .note {
  margin-bottom: 16px;
}
@media screen and (max-width: 767px) {
  .contact-form .row {
    flex-wrap: wrap;
  }
  .contact-form .row .left {
    width: auto;
    margin-right: 8px;
  }
  .contact-form .row .middle {
    width: auto;
  }
  .contact-form .row .right {
    width: 100%;
    margin-top: 8px;
  }
}
.contact-form .left,
.contact-form .middle,
.contact-form .right {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.contact-form .left,
.contact-form .note {
  width: 250px;
}
.contact-form .middle {
  width: 4rem;
}
.contact-form .right {
  width: calc(100% - (250px + 4rem));
}
.contact-form .right.two_column {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.contact-form .right.two_column .ly_cont {
  margin: 0;
  max-width: 49%;
}
.contact-form .right#postal_code .top {
  display: flex;
  flex-direction: row;
  justify-content: left;
}
.contact-form .right#postal_code .top input[name="pcode_1"] {
  width: 80px;
}
.contact-form .right#postal_code .top input[name="pcode_2"] {
  width: 120px;
}
.contact-form .right#postal_code .top span {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.contact-form .required {
  display: block;
  color: #fff;
  font-size: 10px;
  background: #424b8e;
  border-radius: 11px;
  width: 32px;
  padding: 2px 3px 3px 3px;
  text-align: center;
}
.wrap_info {
  max-width: 990px;
  margin: 30px 0 0 0;
}
.border_red {
  border: 1px solid #d90000;
  padding: 10px;
}
@media screen and (max-width: 767px) {
  .wrap_info {
    max-width: 100%;
  }
}
/* 3-4. KV */
.wrap_kv {
  position: relative;
  min-height: 535px;
  background: url("../img/top/bg_kv_pc.png") no-repeat center;
  background-size: cover;
  display: flex;
  justify-content: center;
}
.wrap_kv .btn_primary {
  margin-top: 40px;
}
.wrap_kv #sub_title {
  font-size: 30px;
  font-weight: bold;
}
.wrap_kv .lead {
  font-size: 20px;
}
@media screen and (max-width: 767px) {
  .wrap_kv {
    padding-bottom: 35px;
    min-height: 484px;
    background: url("../img/top/bg_kv_sp.png") no-repeat center;
    flex-direction: column;
    background-size: cover;
  }
  .wrap_kv .btn_primary {
    display: block;
    margin-top: 0;
  }
  .wrap_kv #sub_title {
    font-size: 24px;
    font-weight: bold;
  }
  .wrap_kv .lead {
    font-size: 16px;
  }
}
@media screen and (min-width: 768px) {
  .wrap_kv .right,
  .wrap_kv .left {
    max-width: 40%;
  }
}
/* 3-5. Sass */
.wrap_sass {
  padding: 80px 0;
}
@media screen and (max-width: 767px) {
  .wrap_sass {
    padding: 40px 0;
  }
}
@media screen and (max-width: 767px) {
  .wrap_sass .ly_flex {
    flex-direction: column;
  }
  .wrap_sass .ly_flex .left {
    margin-bottom: 26px;
  }
}
.wrap_sass .ly_flex .left h2 {
  margin-bottom: 20px;
}
@media screen and (min-width: 768px) {
  .wrap_sass .ly_flex .left {
    margin-right: 32px;
  }
}
/* Problem */
.wrap_problem {
  padding: 80px 0;
}
@media screen and (max-width: 767px) {
  .wrap_problem {
    padding: 40px 0;
  }
}
.wrap_problem h2 {
  margin-bottom: 40px;
}
@media screen and (max-width: 767px) {
  .wrap_problem h2 {
    margin-bottom: 20px;
  }
}
.wrap_problem dl {
  width: 990px;
  max-width: 100%;
}
.wrap_problem dl dt {
  width: 100%;
  font-size: 16px;
  height: 68px;
  background: #fff;
  display: flex;
  flex-direction: column-reverse;
  justify-content: center;
  padding-left: 68px;
  position: relative;
  cursor: pointer;
}
@media screen and (max-width: 767px) {
  .wrap_problem dl dt {
    height: auto;
    padding: 20px 50px 20px 68px;
  }
}
.wrap_problem dl dt:not(:first-child) {
  margin-top: 10px;
}
.wrap_problem dl dt::before {
  content: url("../img/top/icon_check.svg");
  position: absolute;
  left: 23px;
  top: 54%;
  transform: translateY(-50%);
}
.wrap_problem dl dt::after {
  content: url("../img/top/icon_arrow.svg");
  position: absolute;
  right: 23px;
  top: 50%;
  transform: translateY(-50%);
}
.wrap_problem dl dt.open::after {
  transform: rotate(180deg);
  top: 40%;
}
.wrap_problem dl dd {
  display: none;
  width: 100%;
  padding: 20px;
  background: #fafafa;
}
/* About IT board */
.wrap_about_itboard {
  padding: 80px 0;
}
@media screen and (max-width: 767px) {
  .wrap_about_itboard {
    padding: 40px 0;
  }
}
.wrap_about_itboard h2 {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 50px;
}
@media screen and (max-width: 767px) {
  .wrap_about_itboard h2 {
    margin-bottom: 20px;
  }
}
.wrap_about_itboard .row:not(:last-child) {
  margin-bottom: 80px;
}
@media screen and (max-width: 767px) {
  .wrap_about_itboard .row:not(:last-child) {
    margin-bottom: 40px;
  }
}
.wrap_about_itboard .row .left {
  max-width: 353px;
  margin-top: 20px;
  position: relative;
  font-size: 14px;
}
.wrap_about_itboard .row .left .icon {
  position: absolute;
  top: 0;
  right: 0;
}
.wrap_about_itboard .row .left h3 {
  font-size: 20px;
  font-weight: bold;
  margin-top: 80px;
  margin-bottom: 20px;
  display: block;
}
@media screen and (min-width: 768px) {
  .wrap_about_itboard .row .left {
    margin-right: 20px;
  }
  .wrap_about_itboard .row .right {
    margin-left: 20px;
  }
  .wrap_about_itboard .row:nth-child(even) {
    flex-direction: row-reverse;
  }
  .wrap_about_itboard .row:nth-child(even) .left {
    margin-right: 0;
    margin-left: 20px;
  }
  .wrap_about_itboard .row:nth-child(even) .left .icon {
    position: absolute;
    top: 0;
    right: auto;
    left: 0;
  }
  .wrap_about_itboard .row:nth-child(even) .right {
    margin-left: 0;
    margin-right: 20px;
  }
}
@media screen and (max-width: 767px) {
  .wrap_about_itboard .row {
    flex-direction: column;
  }
  .wrap_about_itboard .row .left {
    margin-bottom: 20px;
  }
  .wrap_about_itboard .row .left .icon {
    right: auto;
  }
}
/* Company List */
.wrap_company_list {
  padding: 134px 0 80px 0;
}
@media screen and (max-width: 767px) {
  .wrap_company_list {
    padding: 40px 0;
  }
}
.wrap_company_list h2 {
  font-weight: bold;
  margin-bottom: 36px;
}
@media screen and (max-width: 767px) {
  .wrap_company_list h2 {
    margin-bottom: 20px;
    text-align: left;
  }
}
.wrap_company_list .cv-button {
  margin-bottom: 70px;
}
@media screen and (max-width: 767px) {
  .wrap_company_list .cv-button {
    margin-bottom: 40px;
  }
}
.wrap_company_list .company_list {
  display: flex;
  justify-content: space-between;
  word-break: break-word;
  margin-bottom: 80px;
}
@media screen and (max-width: 767px) {
  .wrap_company_list .company_list {
    flex-direction: column;
    margin-bottom: 40px;
  }
}
.wrap_company_list .company_list > div {
  width: calc((100% - (26px * 2)) / 3);
}
@media screen and (max-width: 767px) {
  .wrap_company_list .company_list > div {
    width: 100%;
  }
  .wrap_company_list .company_list > div:not(:last-child) {
    margin-bottom: 30px;
  }
}
.wrap_company_list .company_list .card {
  padding: 10px;
  border-radius: 8px;
  box-shadow: 0px 2px 8px 0px rgba(39, 37, 59, 0.1);
  margin-bottom: 22px;
}
.wrap_company_list .company_list h3 {
  margin-bottom: 13px;
}
.wrap_company_list .company_list .title {
  margin: 20px 0 13px 0;
}
.wrap_company_list .company_list .tags {
  margin-bottom: 13px;
  display: flex;
  justify-content: space-between;
}
.wrap_company_list .company_list .tags div {
  width: calc((100% - 12px) / 2);
  font-size: 14px;
  padding: 10px 13px;
  background-color: #f0f6ff;
}
.wrap_company_list .company_list .text {
  font-size: 14px;
}
.wrap_company_list .company_list .sub-card {
  padding: 0 10px;
  display: flex;
  justify-content: space-between;
}
/* Movie */
.wrap_movie {
  padding-bottom: 100px;
}
@media screen and (max-width: 767px) {
  .wrap_movie {
    padding-bottom: 60px;
  }
}
.wrap_movie .box_movie {
  margin-top: 24px;
}
.wrap_movie .box_movie iframe {
  margin: 0 auto;
}
@media screen and (max-width: 1023px) {
  .wrap_movie .box_movie iframe {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .wrap_movie .box_movie iframe {
    height: 52vw;
  }
}
/* News */
.wrap_news {
  padding: 40px 0 204px 0;
}
@media screen and (max-width: 767px) {
  .wrap_news {
    padding-bottom: 60px;
  }
}
.wrap_news .news_list {
  max-width: 960px;
  margin: 0;
  padding: 0;
  list-style-type: none;
  margin: 24px 0 36px 0;
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 767px) {
  .wrap_news .news_list {
    margin: 36px 0;
  }
}
.wrap_news .news_list li {
  padding: 30px 0;
  display: flex;
  border-bottom: 1px solid #d1d0d5;
}
@media screen and (max-width: 767px) {
  .wrap_news .news_list li {
    padding: 58px 0 8px 0;
    display: flex;
    flex-direction: column;
  }
}
.wrap_news .news_list li:first-child {
  padding-top: 0;
}
.wrap_news .news_list li .left {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .wrap_news .news_list li .left {
    flex-direction: row;
    margin-bottom: 9px;
    justify-content: flex-start;
  }
}
.wrap_news .news_list li .date,
.wrap_news .news_list li .text {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.wrap_news .news_list li a {
  color: #36b6d3;
  text-decoration: none;
}
.wrap_news .news_list li a:hover {
  text-decoration: underline;
}
.wrap_news .news_list li .date {
  font-size: 12px;
  min-width: 6rem;
}
.wrap_news .news_list li .text {
  font-size: 16px;
  font-weight: bold;
}
.wrap_news .news_list li .category {
  display: none;
  font-size: 10px;
  color: #fff;
  background: #424993;
  padding: 2px 23px;
  border-radius: 10px;
}
@media screen and (max-width: 767px) {
  .wrap_news .news_list li .category {
    display: block;
  }
}
/* Free trial */
.wrap_freetrial {
  padding: 53px 0;
  background: #fafafa;
}
@media screen and (max-width: 767px) {
  .wrap_freetrial {
    padding: 40px 30px;
  }
}
.wrap_freetrial h2 {
  font-size: 24px;
  text-align: center;
  font-weight: 700;
  color: #424993;
  margin-bottom: 24px;
}
.wrap_freetrial .ly_flex {
  justify-content: center;
}
.wrap_freetrial .ly_flex .left,
.wrap_freetrial .ly_flex .right {
  margin: 0 60px;
}
.wrap_freetrial .ly_flex .left {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .wrap_freetrial .ly_flex {
    flex-direction: column;
  }
  .wrap_freetrial .ly_flex .left {
    margin: 0 0 20px 0;
  }
  .wrap_freetrial .ly_flex .right {
    margin: 0;
    text-align: center;
  }
}
/* Problem */
.wrap_service_list {
  padding: 40px 0 100px 0;
}
@media screen and (max-width: 767px) {
  .wrap_service_list {
    padding-bottom: 33px;
  }
}
.wrap_service_list .inner {
  width: 1130px;
  max-width: 100%;
}
.wrap_service_list h2 {
  margin-bottom: 40px;
}
@media screen and (max-width: 767px) {
  .wrap_service_list h2 {
    margin-bottom: 20px;
  }
}
.wrap_service_list .service_list {
  margin: 0;
  padding: 0;
  list-style-type: none;
  max-width: 100%;
  margin-bottom: 18px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 767px) {
  .wrap_service_list .service_list {
    justify-content: center;
  }
}
.wrap_service_list .service_list li {
  margin: 8px 6px;
  display: flex;
  flex-direction: column-reverse;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .wrap_service_list .service_list li {
    margin: 0 6px;
  }
  .wrap_service_list .service_list li.sp_dummy {
    width: 148px;
  }
}
/* Case study */
.wrap_case_study {
  padding: 80px 0;
}
@media screen and (max-width: 767px) {
  .wrap_case_study {
    padding: 40px 0;
  }
}
.wrap_case_study h2 {
  margin-bottom: 50px;
}
@media screen and (max-width: 767px) {
  .wrap_case_study h2 {
    margin-bottom: 20px;
  }
}
.wrap_case_study .row {
  margin-bottom: 80px;
}
@media screen and (min-width: 768px) {
  .wrap_case_study .row.reverse {
    flex-direction: row-reverse;
  }
  .wrap_case_study .row.reverse .left {
    margin-left: 40px;
  }
  .wrap_case_study .row.reverse .right {
    margin-right: 40px;
  }
}
.wrap_case_study .row .right {
  margin-left: 40px;
}
.wrap_case_study .row .left {
  max-width: 353px;
  margin-right: 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.wrap_case_study .row .left h3 {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 20px;
  display: block;
}
@media screen and (max-width: 767px) {
  .wrap_case_study .row {
    flex-direction: column;
  }
  .wrap_case_study .row .left,
  .wrap_case_study .row .right {
    margin: 0;
  }
  .wrap_case_study .row .left {
    margin-bottom: 20px;
  }
}

/* help */
.help {
  background-color: #fafafa;
  display: flex;
}
.help .alignment_contents .title_area {
  padding: 32px 0 0 0;
}
.help .alignment_contents .title_area h2 {
  font-size: 32px;
  padding: 0 0 32px 0;
}
.help .alignment_contents .list_contents_area {
  background-color: #fff;
  padding: 34px 74px 0 74px;
}
@media screen and (min-width: 1024px) {
  .help .alignment_contents {
    max-width: 850px;
    min-width: 850px;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
@media screen and (max-width: 767px) {
  .help .alignment_contents {
    padding: 0 16px;
  }
  .help .alignment_contents .title_area {
    padding: 16px 0;
  }
  .help .alignment_contents .title_area h2 {
    font-size: 24px;
    padding: 0;
  }
  .help .alignment_contents .list_contents_area {
    padding: 20px 8px 0 8px;
    font-size: 16px;
  }
  .help .alignment_contents .contents_area {
    padding: 8px 8px 0 8px;
    font-size: 24px;
  }
  .help .alignment_contents .contents_area .app_area {
    margin-bottom: 32px !important;
  }
}
/* beginner */
.beginner {
  background-color: #fafafa;
  display: flex;
}
.beginner .alignment_contents .title_area {
  padding: 32px 0 0 0;
}
.beginner .alignment_contents .title_area h2 {
  font-size: 32px;
  padding: 0 0 32px 0;
}
.beginner .alignment_contents .list_contents_area {
  background-color: #fff;
  padding: 34px 74px 0 74px;
}
@media screen and (min-width: 1024px) {
  .beginner .alignment_contents {
    max-width: 850px;
    min-width: 850px;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
@media screen and (max-width: 767px) {
  .beginner .alignment_contents {
    padding: 0 16px;
  }
  .beginner .alignment_contents .title_area {
    padding: 16px 0;
  }
  .beginner .alignment_contents .title_area h2 {
    font-size: 24px;
    padding: 0;
  }
  .beginner .alignment_contents .list_contents_area {
    padding: 20px 8px 0 8px;
    font-size: 16px;
  }
  .beginner .alignment_contents .contents_area {
    padding: 8px 8px 0 8px;
    font-size: 24px;
  }
  .beginner .alignment_contents .contents_area .app_area {
    margin-bottom: 32px !important;
  }
}

/* function */
.function {
  background-color: #fafafa;
  display: flex;
}
.function .alignment_contents .title_area {
  padding: 32px 0 0 0;
}
.function .alignment_contents .title_area h2 {
  font-size: 32px;
  padding: 0 0 32px 0;
}
.function .alignment_contents .list_contents_area {
  background-color: #fff;
  padding: 34px 74px 0 74px;
}
@media screen and (min-width: 1024px) {
  .function .alignment_contents {
    max-width: 850px;
    min-width: 850px;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
@media screen and (max-width: 767px) {
  .function .alignment_contents {
    padding: 0 16px;
  }
  .function .alignment_contents .title_area {
    padding: 16px 0;
  }
  .function .alignment_contents .title_area h2 {
    font-size: 24px;
    padding: 0;
  }
  .function .alignment_contents .list_contents_area {
    padding: 20px 8px 0 8px;
    font-size: 16px;
  }
  .function .alignment_contents .contents_area {
    padding: 8px 8px 0 8px;
    font-size: 24px;
  }
  .function .alignment_contents .contents_area .app_area {
    margin-bottom: 32px !important;
  }
}
/* integration */
.integration_wrap {
  display: flex;
  max-width: 1100px;
  margin-right: auto !important;
  margin-left: auto !important;
}
#integration_index {
  width: 250px;
  margin-top: 8px;
  padding: 0 8px 0 0;
}
#integration_index .ez-toc-widget-container {
  background: #fff;
  border: 1px solid #cacaca;
  position: sticky;
  top: 64px;
}
#integration_index .ez-toc-widget-container ul.ez-toc-list {
  padding: 8px !important;
}
#integration_index ul li {
  font-size: 14px;
  line-height: 1.4;
  margin: 0 0 4px 0;
}
#integration_index ul.ez-toc-list a {
  color: #000;
  display: block;
  text-decoration: none;
  padding: 4px;
}
#integration_index ul.ez-toc-list a:hover {
  background-color: #ebebed !important;
}
.ez-toc-widget-container li.active > a {
  background-color: #ebebed !important;
  font-weight: 500 !important;
}
.ez-toc-widget-container ul.ez-toc-list li.active::before {
  background-color: none !important;
  height: 0 !important;
}
ul.ez-toc-list-level-3 {
  margin: 4px 0 4px 1rem;
}

.integration {
  background-color: #fafafa;
  display: flex;
  padding: 20px 0;
}
.integration .ez-toc-section {
  margin-top: -30px;
  padding-top: 30px;
}
.integration .alignment_contents .title_area {
  padding: 32px 0 0 0;
}
.integration .alignment_contents .title_area h2 {
  font-size: 32px;
  padding: 0 0 32px 0;
}
.integration .alignment_contents .list_contents_area {
  background-color: #fff;
  padding: 34px 74px 0 74px;
}
.integration .alignment_contents .list_contents_area .integration_lead {
  margin: 0 0 40px 0;
}
.integration .alignment_contents .list_contents_area .integration_lead a {
  text-decoration: underline;
  color: #000;
}
.integration .alignment_contents .list_contents_area .integration_lead a:hover {
  text-decoration: none;
}
.integration .alignment_contents .list_contents_area h3 {
  font-size: 16px;
}
.integration .alignment_contents .list_contents_area .app_list ul {
  padding-left: 0;
  display: flex;
  flex-flow: column;
  max-width: 100%;
}
.integration .alignment_contents .list_contents_area .app_list ul li {
  width: 100%;
  font-size: 14px;
  height: 22px;
  background: #fff;
  display: flex;
  position: relative;
}
.integration .alignment_contents .list_contents_area .app_list ul li img {
  width: 22px;
  height: 22px;
  object-fit: contain;
}
.integration
  .alignment_contents
  .list_contents_area
  .app_list
  ul
  li:not(:last-child) {
  margin-bottom: 22px;
}
.integration .alignment_contents .list_contents_area .app_list ul li a {
  color: #000;
  height: 22px;
}
.integration .alignment_contents .list_contents_area .app_list ul li a:hover {
  text-decoration: none;
}
.integration .alignment_contents .breadcrumbs a {
  color: #000;
}
.integration .alignment_contents .breadcrumbs a:hover {
  text-decoration: none;
}
.integration .alignment_contents .contents_area {
  background-color: #fff;
  padding: 32px 24px 0 24px;
}
.integration .alignment_contents .contents_area .app_area .main {
  align-items: flex-end;
}
.integration .alignment_contents .contents_area .app_area .main .text {
  font-size: 24px;
}
.integration .alignment_contents .contents_area .app_area .main .image {
  height: 120px;
  width: 120px;
}
.integration .alignment_contents .contents_area .app_area .main .image img {
  object-fit: contain;
}
.integration .alignment_contents .contents_area .item_area .image {
  width: 100%;
}
.integration .alignment_contents .contents_area .item_area .image img {
  width: 100%;
}
@media screen and (min-width: 1024px) {
  .integration .alignment_contents {
    max-width: 850px;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
@media screen and (max-width: 767px) {
  .integration .alignment_contents {
    padding: 0 16px;
  }
  .integration .alignment_contents .title_area {
    padding: 16px 0;
  }
  .integration .alignment_contents .title_area h2 {
    font-size: 24px;
    padding: 0;
  }
  .integration .alignment_contents .list_contents_area {
    padding: 20px 8px 0 8px;
    font-size: 16px;
  }
  .integration .alignment_contents .contents_area {
    padding: 8px 8px 0 8px;
    font-size: 24px;
  }
  .integration .alignment_contents .contents_area .app_area {
    margin-bottom: 32px !important;
  }
  .integration .alignment_contents .list_contents_area .app_list ul {
    width: auto;
  }
  .integration .alignment_contents .contents_area .app_area .main {
    align-items: flex-start;
    flex-direction: column;
    margin-bottom: 0 !important;
  }
  .integration .alignment_contents .contents_area .app_area .main .image {
    margin-right: 0 !important;
    margin-bottom: 12px !important;
  }
  .integration .alignment_contents .contents_area .item_area {
    margin-bottom: 32px !important;
  }
  .integration .alignment_contents .contents_area .item_area .title {
    margin-bottom: 12px !important;
  }
}