@charset "utf-8";


/**
 * X9NXL Style
 * ================================================================================
 * Table of Contents:
 *
 * Common Settings
 * Functions Page Settings
 * Top Page Settings
 * ================================================================================
 */






/**
 * ================================================================================
 * Common Settings
 * ================================================================================
 */


/* -- Display -- */
.nv-x9nxl-disBlock { display: block !important; }
.nv-x9nxl-disInlineblock { display: inline-block !important; }
.nv-x9nxl-disInline { display: inline !important; }
.nv-x9nxl-disFlex { display: flex !important; }
.nv-x9nxl-disInlineFlex { display: inline-flex !important; }
.nv-x9nxl-disNone { display: none !important; }






/**
 * ================================================================================
 * Module Settings
 * ================================================================================
 */


/**
 * Modal
 * -------------------------------
 */

#nv-modalDifferent {
  min-width: 1280px;
  padding-bottom: 50px;
  font-size: 3.3rem;
  }

  #nv-modalDifferent .nv-modalDifferentTtl {
    background-color: #00469C;
    padding: 25px 0;
    border-bottom: 4px solid #001F46;
    text-align: center;
    }

    #nv-modalDifferent .nv-modalDifferentTtl > span {
      display: inline-block;
      padding-right: 105px;
      position: relative;
      color: #FFDC00;
      font-size: 3.8rem;
      font-weight: bold;
      }

      #nv-modalDifferent .nv-modalDifferentTtl > span:after {
        content: "";
        background-image: url("/files/cdb/ZZ/products/navi/x9nxl/common/2112/zzproducts_navi_x9nxl_common_modal-ttl.png");
        background-position: 50% 50%;
        background-repeat: no-repeat;
        background-size: 100% auto;
        width: 82px;
        height: 82px;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        }

  #nv-modalDifferent .nv-modalDifferentTxt { font-size: 3.3rem; }

  #nv-modalDifferent .posAbsolute {
    right: 0;
    top: 0;
    }

    #nv-modalDifferent .posAbsolute img { height: 47px; }

  #nv-modalDifferent .nv-modalDifferentBorderTxt {
    display: inline-block;
    width: 100%;
    padding: 15px;
    border: 3px solid #00469C;
    color: #00469C;
    font-size: 4.0rem;
    font-weight: bold;
    }






/**
 * ================================================================================
 * Top Page Settings
 * ================================================================================
 */


/**
 * Block
 * -------------------------------
 */

/* -- .sectionBlock01 -- */
#topPage .keyVisualArea.sectionBlock01 { padding-top: 480px; }

  #topPage .keyVisualArea.sectionBlock01 .posAbsolute {
    top: 230px;
    right: 0;
    }
  #topPage .keyVisualArea.sectionBlock01 .posAbsolute img { height: 41px; }






/**
 * ================================================================================
 * Functions Page Settings
 * ================================================================================
 */


/**
 * Block
 * -------------------------------
 */


/* -- .sectionBlock25 -- */
#functionsPage .sectionBlock25 { display: block !important; }








@media only screen and (min-width: 0px) and (max-width: 767px) {
  
  
/**
 * ================================================================================
 * Module Settings
 * ================================================================================
 */


/**
 * Modal
 * -------------------------------
 */

#nv-modalDifferent {
  min-width: 100%;
  padding-bottom: 30px;
  font-size: 1.4rem;
  }

  #nv-modalDifferent .nv-modalDifferentTtl {
    padding: 10px 0;
    border-bottom: 2px solid #001F46;
    }

    #nv-modalDifferent .nv-modalDifferentTtl > span {
      padding-right: calc(105px * 0.5);
      font-size: 1.8rem;
      }

      #nv-modalDifferent .nv-modalDifferentTtl > span:after {
        width: calc(82px * 0.5);
        height: calc(82px * 0.5);
        }

  #nv-modalDifferent .nv-modalDifferentTxt { font-size: 1.4rem; }
  
  #nv-modalDifferent .posAbsolute { margin-top: 15px; }
  
    #nv-modalDifferent .posAbsolute img { height: calc(100vw * (47 / 640)); }

  #nv-modalDifferent .nv-modalDifferentBorderTxt {
    padding: 10px;
    border: 2px solid #00469C;
    font-size: 1.8rem;
    }
  
  
  
  
  
  
/**
 * ================================================================================
 * Top Page Settings
 * ================================================================================
 */


/**
 * Block
 * -------------------------------
 */

/* -- .sectionBlock01 -- */
#topPage .keyVisualArea.sectionBlock01 { padding-top: 0; }
  
  #topPage .keyVisualArea.sectionBlock01 .posAbsolute img { height: calc(100vw * (41 / 640)); }


}