@charset "UTF-8";
/*=======================================
	responsive
=======================================*/
/* ------------------------
- base
- breadcrumb
- sttl
- nav_sec
- inview
------------------------ */
/*=======================================
  base
=======================================*/
@media only screen and (max-width: 1024px) {
  body {
    padding-top: 45px; } }

#contentsArea {
  font-family: "Noto Sans JP", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN","Hiragino Maru Gothic W4 JIS2004", "メイリオ", Meiryo, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-feature-settings: "palt";
  color: #000;
  font-weight: 500;
  letter-spacing: 0;
  width: 100%;
  max-width: initial; }
  #contentsArea .clearfix::after {
    content: "";
    display: block;
    clear: both; }
  #contentsArea .anchor {
    padding-top: 80px;
    margin-top: -80px;
    display: block; }
    @media screen and (max-width: 767px) {
      #contentsArea .anchor {
        padding-top: 20px;
        margin-top: -20px; } }
  #contentsArea .inner {
    width: 90%;
    margin: 0 auto;
    max-width: 1200px; }
  #contentsArea a {
    transition: opacity 0.2s ease-in-out; }
  #contentsArea a:hover {
    opacity: 0.6; }
  #contentsArea sup {
    font-size: 55%; }

/*=======================================
  breadcrumb
=======================================*/
#breadcrumb {
  background: #323232;
  /* 背景が透明 */ }
  #breadcrumb ol {
    border-bottom: none; }
    #breadcrumb ol li {
      color: #fff; }
      #breadcrumb ol li a {
        color: #B4B4B4; }
        #breadcrumb ol li a:visited {
          color: #B4B4B4; }
        #breadcrumb ol li a:hover {
          opacity: 1; }
  #breadcrumb._transparent {
    background: transparent; }
    #breadcrumb._transparent ol li {
      color: #fff; }
      #breadcrumb._transparent ol li::before {
        background: url("/biz/common/images/ic_breadcrumb_white.webp") no-repeat;
        width: 9px;
        height: 10px; }
      #breadcrumb._transparent ol li a {
        color: #fff; }
        #breadcrumb._transparent ol li a:visited {
          color: #fff; }

#contentsArea {
  /*=======================================
    sttl
  =======================================*/
  /*=======================================
    nav_sec
  =======================================*/ }
  #contentsArea .sttl_area .sttl_01 {
    font-size: 38px;
    line-height: 1.184;
    letter-spacing: 0.08em;
    text-align: center;
    font-family: 'Oswald', sans-serif; }
  #contentsArea .sttl_area .txt_01 {
    font-size: 18px;
    text-align: center;
    line-height: 1.75;
    margin-top: 10px !important; }
    @media screen and (max-width: 767px) {
      #contentsArea .sttl_area .txt_01 {
        font-size: 14px; } }
  #contentsArea .sttl_area span {
    font-family: "Noto Sans JP", sans-serif;
    letter-spacing: 0.15em;
    color: #231815;
    margin-top: 13px; }
    #contentsArea .sttl_area span.biz_ma_top {
      font-size: 18px;
      display: block; }
      @media screen and (max-width: 767px) {
        #contentsArea .sttl_area span.biz_ma_top {
          font-size: 16px;
          margin-top: 5px; } }
    @media screen and (max-width: 767px) {
      #contentsArea .sttl_area span {
        line-height: 1.75; } }
  #contentsArea .nav_sec {
    height: 58px;
    background: #E7E7E7; }
    @media screen and (max-width: 767px) {
      #contentsArea .nav_sec {
        height: auto; } }
    #contentsArea .nav_sec ul {
      display: flex;
      flex-flow: wrap;
      height: 100%;
      max-width: 1200px;
      margin: 0 auto; }
      @media screen and (max-width: 767px) {
        #contentsArea .nav_sec ul {
          width: 90%; } }
      #contentsArea .nav_sec ul li {
        width: calc(100%/5);
        height: 100%;
        position: relative; }
        @media screen and (max-width: 767px) {
          #contentsArea .nav_sec ul li {
            width: calc(100%/2);
            border-bottom: 1px solid #8E8E8E;
            height: 70px; } }
        #contentsArea .nav_sec ul li::after {
          content: "";
          width: 1px;
          height: 100%;
          display: inline-block;
          background: linear-gradient(transparent 0%, transparent 9.5px, #8F8F8F 9.5px, #8F8F8F calc(100% - 9.5px), transparent calc(100% - 9.5px), transparent 100%);
          position: absolute;
          right: 0;
          top: 0; }
          @media screen and (max-width: 767px) {
            #contentsArea .nav_sec ul li::after {
              background: linear-gradient(transparent 0%, transparent 13.995px, #8F8F8F 13.995px, #8F8F8F calc(100% - 13.995px), transparent calc(100% - 13.995px), transparent 100%); } }
        @media screen and (max-width: 767px) {
          #contentsArea .nav_sec ul li:nth-child(even)::after, #contentsArea .nav_sec ul li:last-child::after {
            display: none; } }
        #contentsArea .nav_sec ul li:first-child::before {
          content: "";
          width: 1px;
          height: 100%;
          display: inline-block;
          background: linear-gradient(transparent 0%, transparent 9.5px, #8F8F8F 9.5px, #8F8F8F calc(100% - 9.5px), transparent calc(100% - 9.5px), transparent 100%);
          position: absolute;
          left: 0;
          top: 0; }
          @media screen and (max-width: 767px) {
            #contentsArea .nav_sec ul li:first-child::before {
              display: none; } }
        @media screen and (max-width: 767px) {
          #contentsArea .nav_sec ul li:last-child {
            width: 100%;
            border-bottom: none; } }
        #contentsArea .nav_sec ul li a {
          height: 100%;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          position: relative; }
          #contentsArea .nav_sec ul li a::after {
            content: "";
            position: absolute;
            background: url("../../common/images/arrow01.webp") no-repeat;
            background-size: cover;
            left: 0;
            width: 10px;
            height: 6px;
            position: absolute;
            bottom: 10px;
            left: 50%;
            transform: translateX(-50%); }
          #contentsArea .nav_sec ul li a span {
            font-size: 18px;
            line-height: 1;
            letter-spacing: 0.08em;
            color: #231815;
            font-family: 'Oswald', sans-serif;
            font-weight: 500;
            margin-bottom: 5px; }

/*=======================================
　inview
=======================================*/
.sli-up1 {
  opacity: 0;
  transform: translate(0px, 15px); }

.sli-up2 {
  opacity: 0; }

.slideInup1 {
  opacity: 1.0 !important;
  transform: translate(0, 0);
  transition-delay: 0.3s;
  transition-duration: 0.4s; }

/*==============================================================
  追記分
==============================================================*/
/* 2024/4/26追加
--------------------------------------------------------- */
.gray_area {
  position: relative; }
  .gray_area::after {
    content: "";
    width: 100%;
    height: 100%;
    display: inline-block;
    background: #d7d7d7;
    position: absolute;
    left: 0;
    top: 0;
    mix-blend-mode: multiply; }
