@charset "UTF-8";
/*
セッテイング 共通設定
*/
ul,dl,ol {
  list-style: none;
}
main {
  margin-top: 40px;
}
@media screen and (max-width: 768px) {
  main {
    margin-top: 20px;
  }
}
a img:hover {
  opacity: .8;
}

@media print, screen and (min-width: 769px) {
  header {
    position: static;
  }

  section {
    max-width: 1024px;
    margin: 0 auto;
    width: 100%;
  }
}

h2 {
  line-height: 1;
}

a {
  text-decoration: none;
}

.pc {
  display: block !important;
}

.pc-tablerow {
  display: table-row;
}

.sp {
  display: none !important;
}

.pc-inline {
  display: inline-block !important;
}

.sp-inline {
  display: none;
}

.sp-tablecell {
  display: none;
}

.fontSM {
  font-size: 10px;
}

sup {
  vertical-align: top;
  font-size: 10px;
}

.textCenter {
  text-align: center;
  letter-spacing: 0.5px;
}

img {
  width: auto;
}

@media screen and (max-width: 768px) {
  img {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .pc {
    display: none !important;
  }

  .pc-inline {
    display: none !important;
  }

  .pc-tablerow {
    display: none;
  }

  .sp {
    display: block !important;
  }

  .sp-inline {
    display: inline-block;
  }

  .sp-tablecell {
    display: table-cell;
  }
}
.wrap__inner {
  width: 1024px;
  margin: 0 auto;
  min-width: 980px;
}
@media screen and (max-width: 768px) {
  .wrap__inner {
    width: 90%;
    min-width: auto;
  }
}

.pb-10 {
  padding-bottom: 10px !important;
}
@media screen and (max-width: 768px) {
  .pb-10 {
    padding-bottom: 0px !important;
  }
}

.pb-20 {
  padding-bottom: 20px !important;
}
@media screen and (max-width: 768px) {
  .pb-20 {
    padding-bottom: 10px;
  }
}

.pb-40 {
  padding-bottom: 40px;
}
@media screen and (max-width: 768px) {
  .pb-40 {
    padding-bottom: 40px;
  }
}

.pb-80 {
  padding-bottom: 80px;
}
@media screen and (max-width: 768px) {
  .pb-80 {
    padding-bottom: 40px;
  }
}

.pb-100 {
  padding-bottom: 100px !important;
}
@media screen and (max-width: 768px) {
  .pb-100 {
    padding-bottom: 50px;
  }
}

.pb-120 {
  padding-bottom: 120px !important;
}
@media screen and (max-width: 768px) {
  .pb-120 {
    padding-bottom: 60px;
  }
}

.pt-40 {
  padding-top: 40px;
}
@media screen and (max-width: 768px) {
  .pt-40 {
    padding-top: 20px;
  }
}

.pt-80 {
  padding-top: 80px;
}
@media screen and (max-width: 768px) {
  .pt-80 {
    padding-top: 40px;
  }
}

.mt-40 {
  margin-top: 40px;
}
@media screen and (max-width: 768px) {
  .mt-40 {
    margin-top: 20px;
  }
}

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

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

.mb-80 {
  margin-bottom: 80px;
}
@media screen and (max-width: 768px) {
  .mb-80 {
    margin-bottom: 40px;
  }
}

.js-accordion .name {
  position: relative;
}
.js-accordion .name:before, .js-accordion .name:after {
  content: "";
  display: inline-block;
  width: 30px;
  height: 30px;
  color: #6e6e6e;
  border-top: 2px solid #6e6e6e;
  position: absolute;
  top: 50%;
  left: 83%;
  transition: .3s;
}
.js-accordion .name:before {
  transform: rotate(90deg);
  margin-top: -14px;
}
@media screen and (max-width: 320px) {
  .js-accordion .name:before {
    left: 80%;
  }
}
.js-accordion .name:after {
  transform: translateX(50%);
}
.js-accordion .name.open:before {
  display: none;
}
.js-accordion.last .name {
  border-bottom: 0px;
}

.accordion-box {
  display: none;
}

.font-red {
  color: red;
}

.feature_ttl {
  margin: 80px 0 40px;
}

.contact__wrap .contact__top {
  max-width: 1280px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .contact__wrap .contact__top {
    width: 100%;
  }
}
.contact__wrap .contact__top__lists {
  display: flex;
}
@media screen and (max-width: 768px) {
  .contact__wrap .contact__top__lists {
    display: block;
  }
}
.contact__wrap .contact__top__lists li {
  position: relative;
  width: 33.59375%;
}
@media screen and (max-width: 768px) {
  .contact__wrap .contact__top__lists li {
    width: 100%;
  }
}
.contact__wrap .contact__top__lists li a {
  display: block;
  color: #fff;
}
.contact__wrap .contact__top__lists li a.cat {
  content: '';
  display: block;
  background-size: 100%;
  background-repeat: no-repeat;
  padding: 13.95349%;
}
@media screen and (max-width: 768px) {
  .contact__wrap .contact__top__lists li a.cat {
    height: 140px;
  }
}
.contact__wrap .contact__top__lists li a.cat01 {
  background-image: url("../img/cta_01.jpg");
}
@media screen and (max-width: 768px) {
  .contact__wrap .contact__top__lists li a.cat01 {
    background-image: url("../img/cta_01_sp.jpg");
  }
}
.contact__wrap .contact__top__lists li a.cat02 {
  background-image: url("../img/cta_02.jpg");
}
@media screen and (max-width: 768px) {
  .contact__wrap .contact__top__lists li a.cat02 {
    background-image: url("../img/cta_02_sp.jpg");
  }
}
.contact__wrap .contact__top__lists li a.cat03 {
  background-image: url("../img/cta_03.jpg");
}
@media screen and (max-width: 768px) {
  .contact__wrap .contact__top__lists li a.cat03 {
    background-image: url("../img/cta_03_sp.jpg");
  }
}
.contact__wrap .contact__top__lists li a:hover {
  opacity: .8;
}
.contact__wrap .contact__top__lists li img {
  vertical-align: bottom;
}
.contact__wrap .contact__top__lists__title {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit-transform: translateY(-50%) translateX(-50%);
  text-align: center;
  font-size: 24px;
  font-family: FuturaStd, sans-serif;
  font-weight: lighter;
  width: 100%;
}
.contact__wrap .contact__top__lists__title span {
  display: block;
  font-size: 12px;
  padding-top: 10px;
}
.contact__wrap .contact__bottom {
  background: #304993;
}
.contact__wrap .contact__bottom__txt {
  text-align: center;
}
.contact__wrap .contact__bottom__txt a {
  padding: 80px 0px;
  font-family: FuturaStd, sans-serif;
  font-weight: 100;
  display: block;
  color: #fff;
  font-size: 56px;
}
@media screen and (max-width: 768px) {
  .contact__wrap .contact__bottom__txt a {
    font-size: 43px;
  }
}
.contact__wrap .contact__bottom__txt a span {
  display: block;
  font-size: 14px;
  padding-top: 12px;
}
@media screen and (max-width: 768px) {
  .contact__wrap .contact__bottom__txt a span {
    font-size: 10px;
  }
}
.contact__wrap .contact__bottom__txt a:hover {
  opacity: .5;
}

.bg__gray {
  background-color: #fafafa;
}

.bg__green {
  background-color: #ebf7f0;
}

.ess_contents__mv {
  max-width: 1280px;
  height: 400px;
  margin: 0 auto;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  font-family: "Noto Sans Japanese", sans-serif;
}
.ess_contents__mv .end {
  position: absolute;
  margin: auto;
  padding: 5px;
  top: 129px;
  right: 0;
  left: 0;
  width: fit-content;
  font-size: 1.8rem;
  color: #fff;
  text-align: center;
  font-weight: bold;
  background-color: red;
}
@media screen and (max-width: 768px) {
  .ess_contents__mv .end {
    top: 165px;
    font-size: 1.6rem;
  }
}
.ess_contents__mv.bg_abouttop {
  background-image: url("../../_shared/img/about/mv.png");
}
@media screen and (max-width: 768px) {
  .ess_contents__mv.bg_abouttop {
    background-image: url("../../_shared/img/about/mv_sp.png");
  }
}
.ess_contents__mv.bg_usersvoice {
  background-image: url("../../_shared/img/about/usersvoice/mv.png");
}
@media screen and (max-width: 768px) {
  .ess_contents__mv.bg_usersvoice {
    background-image: url("../../_shared/img/about/usersvoice/mv_sp.png");
  }
}
.ess_contents__mv.bg_hybrid {
  background-image: url("../../_shared/img/hybrid/mv.png");
}
@media screen and (max-width: 768px) {
  .ess_contents__mv.bg_hybrid {
    background-image: url("../../_shared/img/hybrid/mv_sp.png");
    padding-top: 60%;
  }
}
.ess_contents__mv.bg_portable {
  background-image: url("../../_shared/img/portable/mv.png");
}
@media screen and (max-width: 768px) {
  .ess_contents__mv.bg_portable {
    background-image: url("../../_shared/img/portable/mv_sp.png");
    padding-top: 60%;
  }
}
.ess_contents__mv.bg_tribrid {
  background-image: url("../../_shared/img/tribrid/mv.png?v2");
}
@media screen and (max-width: 768px) {
  .ess_contents__mv.bg_tribrid {
    background-image: url("../../_shared/img/tribrid/mv_sp.png");
    padding-top: 60%;
  }
}
.ess_contents__mv.bg_list {
  background-image: url("../../_shared/img/list/mv.png");
}
@media screen and (max-width: 768px) {
  .ess_contents__mv.bg_list {
    background-image: url("../../_shared/img/list/mv_sp.png");
    padding-top: 60%;
  }
}
.ess_contents__mv.bg_tankinou {
  background-image: url("../../_shared/img/tankinou/mv.png");
}
@media screen and (max-width: 768px) {
  .ess_contents__mv.bg_tankinou {
    background-image: url("../../_shared/img/tankinou/mv_sp.png");
    padding-top: 60%;
  }
}
.ess_contents__mv.bg_fit {
  background-image: url("../../_shared/img/fit/mv.png");
}
@media screen and (max-width: 768px) {
  .ess_contents__mv.bg_fit {
    background-image: url("../../_shared/img/fit/mv_sp.png");
    padding-top: 60%;
  }
}
.ess_contents__mv.bg_catalog {
  background-image: url("../../_shared/img/catalog_library/mv.png");
}
@media screen and (max-width: 768px) {
  .ess_contents__mv.bg_catalog {
    background-image: url("../../_shared/img/catalog_library/mv_sp.png");
    padding-top: 60%;
  }
}
.ess_contents__mv.bg_user__support {
  background-image: url("../../_shared/img/user_support/mv.png");
}
@media screen and (max-width: 768px) {
  .ess_contents__mv.bg_user__support {
    background-image: url("../../_shared/img/user_support/mv_sp.png");
    padding-top: 60%;
  }
}
.ess_contents__mv.bg_qa {
  background-image: url("../../_shared/img/user_support/mv.png");
}
@media screen and (max-width: 768px) {
  .ess_contents__mv.bg_qa {
    background-image: url("../../_shared/img/user_support/mv_sp.png");
    padding-top: 60%;
  }
}
.ess_contents__mv.bg_series_ess-u2x {
  background-image: url("../../_shared/img/series/u2x/mv.png");
}
@media screen and (max-width: 768px) {
  .ess_contents__mv.bg_series_ess-u2x {
    background-image: url("../../_shared/img/series/u2x/mv_sp.png");
    padding-top: 60%;
    margin-top: 40px;
  }
}
.ess_contents__mv.bg_series_ess-u21 {
  background-image: url("../../_shared/img/series/u21/mv.png");
}
@media screen and (max-width: 768px) {
  .ess_contents__mv.bg_series_ess-u21 {
    background-image: url("../../_shared/img/series/u21/mv_sp.png");
    padding-top: 60%;
  }
}
.ess_contents__mv.bg_series_ess-h2l1 {
  background-image: url("../../_shared/img/series/h2l1/mv.png");
}
@media screen and (max-width: 768px) {
  .ess_contents__mv.bg_series_ess-h2l1 {
    background-image: url("../../_shared/img/series/h2l1/mv_sp.png");
    padding-top: 60%;
    margin-top: 40px;
  }
}
.ess_contents__mv.bg_series_ess-U2l2 {
  background-image: url("../../_shared/img/series/u2l2/mv.png");
}
@media screen and (max-width: 768px) {
  .ess_contents__mv.bg_series_ess-U2l2 {
    background-image: url("../../_shared/img/series/u2l2/mv_sp.png");
    padding-top: 60%;
    margin-top: 40px;
  }
}
.ess_contents__mv.bg_series_ess-u4x {
  background-image: url("../../_shared/img/series/u4x/mv.png");
}
@media screen and (max-width: 768px) {
  .ess_contents__mv.bg_series_ess-u4x {
    background-image: url("../../_shared/img/series/u4x/mv_sp.png");
    padding-top: 60%;
    margin-top: 40px;
  }
}
.ess_contents__mv.bg_contact {
  background-image: url("../../_shared/img/contact/mv.png");
}
@media screen and (max-width: 768px) {
  .ess_contents__mv.bg_contact {
    background-image: url("../../_shared/img/contact/mv_sp.png");
    padding-top: 60%;
  }
}
@media screen and (max-width: 768px) {
  .ess_contents__mv {
    width: 100%;
    height: auto;
    padding-top: 64%;
  }
}
.ess_contents__mv__title {
  font-weight: bold;
  font-family: "GothicMB101Pr6-De", "メイリオ", "ＭＳ Ｐゴシック", sans-serif;
  font-size: 45px;
  color: #333;
  position: absolute;
  top: 50%;
  left: 10%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
}
.ess_contents__mv__title.tankinou, .ess_contents__mv__title.portable, .ess_contents__mv__title.fit, .ess_contents__mv__title.usersupporttop, .ess_contents__mv__title.ess-u2x, .ess_contents__mv__title.ess-u2l2, .ess_contents__mv__title.contact {
  color: #fff;
}
.ess_contents__mv__title .type {
  margin-top: 10px;
  display: block;
  font-size: 24px;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  .ess_contents__mv__title .type {
    font-size: 14px;
  }
}
.ess_contents__mv__title .small_text {
  font-size: 16px;
  display: inline-block;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  .ess_contents__mv__title .small_text {
    display: block;
    font-size: 12px;
  }
}
.ess_contents__mv__title.tribrid {
  top: 60%;
}
.ess_contents__mv__title.tribrid .mark {
  display: inline-block;
  vertical-align: bottom;
  font-size: 45px;
}
@media screen and (max-width: 768px) {
  .ess_contents__mv__title.tribrid .mark {
    font-size: 28px;
    margin-left: -3px;
  }
}
@media screen and (max-width: 768px) {
  .ess_contents__mv__title {
    left: 5%;
  }
}
@media screen and (max-width: 768px) {
  .ess_contents__mv__title {
    font-size: 28px;
    line-height: 1.2;
  }
}
.ess_contents__mv__title span {
  display: block;
  font-size: 18px;
  margin-bottom: 16px;
  font-weight: normal;
}
@media screen and (max-width: 768px) {
  .ess_contents__mv__title span {
    margin-bottom: 8px;
    font-size: 12px;
    line-height: 1.3;
  }
}

.merit__section__block {
  padding-bottom: 120px;
}
@media screen and (max-width: 768px) {
  .merit__section__block {
    width: 90%;
    margin: 0 auto;
    padding-bottom: 60px;
  }
}
.merit__section__block .sec__top {
  padding: 120px 0px 40px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .merit__section__block .sec__top {
    padding: 60px 0px 20px;
  }
}
.merit__section__block .sec__top__title {
  font-size: 28px;
  font-family: "Noto Sans Japanese", sans-serif;
  font-weight: bold;
  margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
  .merit__section__block .sec__top__title {
    margin-bottom: 14px;
    font-size: 22px;
  }
}
.merit__section__block .sec__top__title__middle {
  font-family: FuturaStd, sans-serif;
  font-size: 16px;
  color: #304993;
  line-height: 1;
  display: inline-block;
  margin-bottom: 40px;
  font-weight: 300;
  letter-spacing: 1.3px;
}
@media screen and (max-width: 768px) {
  .merit__section__block .sec__top__title__middle {
    font-size: 14px;
    margin-bottom: 25px;
  }
}
.merit__section__block .sec__top__title__bottom {
  font-size: 14px;
  line-height: 2;
}
@media screen and (max-width: 768px) {
  .merit__section__block .sec__top__title__bottom {
    text-align: left;
  }
}
.merit__section__block img {
  width: auto;
}
.merit__section__block .merit {
  border: 2px solid #c7cee0;
  background: #fff;
  border-radius: 16px;
  margin-top: 75px;
  margin-bottom: 115px;
  padding: 0px 35px 55px;
}
@media screen and (max-width: 768px) {
  .merit__section__block .merit {
    margin-top: 100px;
    padding: 0px 20px 40px;
  }
}
.merit__section__block .merit:last-child {
  margin-bottom: 0px;
}
.merit__section__block .merit__bulb {
  text-align: center;
  margin-top: -75px;
}
@media screen and (max-width: 768px) {
  .merit__section__block .merit__bulb {
    margin-top: -100px;
    padding-bottom: 0px;
  }
}
.merit__section__block .merit__title {
  line-height: 1.8;
  color: #fff;
  padding-top: 20px;
  font-size: 20px;
}
@media screen and (max-width: 768px) {
  .merit__section__block .merit__title {
    padding-top: 15px;
    padding-bottom: 0px;
  }
}
.merit__section__block .merit__title span {
  background: #304993;
  padding: 5px 11px;
  display: inline-block;
}
@media screen and (max-width: 768px) {
  .merit__section__block .merit__title span {
    display: block;
    font-size: 19px;
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  .merit__section__block .merit__title__01 span, .merit__section__block .merit__title__02 span, .merit__section__block .merit__title__03 span {
    display: inline-block;
    padding: 3px 10px;
    margin-bottom: 5px;
    margin: 5px 9% 0;
  }
  .merit__section__block .merit__title__01 span {
    display: block;
    margin: 0;
  }
}
.merit__section__block .merit__box {
  display: flex;
  margin-top: 40px;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .merit__section__block .merit__box {
    display: block;
    margin-top: 0px;
    font-size: 14px;
  }
}
.merit__section__block .merit__box__left {
  line-height: 2;
}
@media screen and (max-width: 768px) {
  .merit__section__block .merit__box__left {
    padding-bottom: 20px;
  }
  .merit__section__block .merit__box__left p {
    line-height: 1.6;
    letter-spacing: 1.12px;
  }
}
.merit__section__block .merit__box__right {
  margin-left: 40px;
}
@media screen and (max-width: 768px) {
  .merit__section__block .merit__box__right {
    margin-left: 0px;
  }
  .merit__section__block .merit__box__right img {
    width: 100%;
  }
}

.link__area {
  margin-top: 16px;
}
.link__area.catalog__contents.soldout .link__btn {
  padding-right: 45px;
}
@media screen and (max-width: 768px) {
  .link__area.catalog__contents.soldout .link__btn {
    padding-right: 0px;
  }
}
.link__area .btn-subtitle {
  font-size: 16px;
  display: block;
  margin-bottom: 10px;
}
.link__area.lists--option {
  width: 465px;
  margin: 30px auto 0;
}
@media screen and (max-width: 768px) {
  .link__area.lists--option {
    width: 100%;
  }
}
.link__area a img {
  width: 100%;
}

.link__btn {
  position: relative;
  display: block;
  width: 100%;
  font-size: 14px;
  color: #fff;
  background: #304993;
  padding: 18px 55px 18px 30px;
  text-align: center;
  border-radius: 60px;
  letter-spacing: 1.04px;
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  .link__btn {
    width: 100%;
  }
}
.link__btn:hover {
  opacity: .8;
}
.link__btn:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 25px;
  width: 7px;
  height: 7px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  margin-top: -5px;
}
.link__btn[href*=".pdf"]:after, .link__btn[href*=".xlsx"]:after, .link__btn[href*="docx"]:after {
  background-image: url("../../_shared/img/pdf-icon.png");
  background-repeat: no-repeat;
  background-size: cover;
  width: 41px;
  height: 40px;
  top: 50%;
  right: 5px;
  border: none;
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  margin-top: -20px;
}
@media screen and (max-width: 768px) {
  .link__btn[href*=".pdf"]:after, .link__btn[href*=".xlsx"]:after, .link__btn[href*="docx"]:after {
    width: 45px;
    height: 45px;
    right: 5px;
    margin-top: -23px;
  }
}
.link__btn[href*="xlsx"]:after {
  background-image: url("../../_shared/img/xlsx-icon.png");
}
.link__btn[href*="docx"]:after {
  background-image: url("../../_shared/img/docx-icon.png");
}

.col1 {
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 768px) {
  .col1 {
    display: block;
  }
}

.col2 {
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 768px) {
  .col2 {
    display: block;
  }
}

.col3 {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: flex-end;
}
@media screen and (max-width: 768px) {
  .col3 {
    display: block;
  }
}

.col4 {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: flex-start;
}
@media screen and (max-width: 768px) {
  .col4 {
    display: block;
  }
}

.col3-wpcenter {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  padding-bottom: 40px;
}
@media screen and (max-width: 768px) {
  .col3-wpcenter {
    display: block;
  }
}

.col4-wpcenter {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  padding-bottom: 40px;
}
@media screen and (max-width: 768px) {
  .col4-wpcenter {
    display: block;
  }
}
.col4-wpcenter .listsystem__section__contents, .col4-wpcenter .fit__systemLists__contents {
  width: 240px !important;
}
@media screen and (max-width: 768px) {
  .col4-wpcenter .listsystem__section__contents, .col4-wpcenter .fit__systemLists__contents {
    width: 100% !important;
  }
}

.tableCol2 {
  display: table;
}

.tableCell {
  display: table-cell;
}

.w-50 {
  width: calc(96% / 2);
}
@media screen and (max-width: 768px) {
  .w-50 {
    width: 100%;
  }
}

.pankz {
  max-width: 1000px;
  margin: -30px auto 40px;
  font-size: 14px;
}
.pankz a {
  color: #111;
}
@media screen and (max-width: 768px) {
  .pankz {
    margin: -15px auto 30px;
    padding: 0 16px;
    font-size: 12px;
  }
  .ess__navi .scroll--contents {
    padding-top: 10px;
  }
}
.essproducts__table--TableArea {
  font-size: 14px;
}
.essproducts__table--TableArea th {
  font-weight: normal;
}

.feature_ttl .label-soldout{
  display: block;
  width: 125px;
  margin: 0 auto 10px;
  padding: 5px 0;
  color: #fff;
  font-size: 16px;
  background: #e60122;
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.64px;
  text-align: center;
}