/* ModeOfSecurityIndustry — ad / banner / responsive slogans
   Extracted from Content/mainStyle.css (PLAN-02).
*/
/*
    漸變背景 START ------------------------------------------------------------------------------
*/
/*  
        顏色調色板（基於 #0B0454 生成）：
        #0B0454 - 主背景色（您提供的）
        #1A0A8C - 深藍紫色
        #2D1DB8 - 藍紫色 
        #4A3AD9 - 亮紫色
        #5E4CE6 - 淺紫色
        #6B5BFF - 最亮的紫色
    */
.dgx_develop_ad_banner_container {
    margin-right: 0px;
    margin-left: 0px;
    padding-left: 10px;
    padding-right: 10px;
    height: auto;
    background: linear-gradient(to right, #152236 10%, #6b7f9d 56%,#8ba5cc,95%, #6b7f9d 100%);
}
 
/* 
   漸變背景 END ------------------------------------------------------------------------------  
*/

/* 手機設備 */
@media (min-device-width : 375px) and (max-device-width : 667px) and (-webkit-min-device-pixel-ratio : 2) {

    body {
        width: 100%;
        min-height: 100vh;
        height: auto;
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-y: contain;
    }

    .ad_main {
        background-image: url(/content/Images/AdMainAiBox_Mobile_20251026C.png);
        background-color: #47453e;
        background-size: 100% 100%;
        background-repeat: no-repeat;
        height: auto;
    }

    .logo_font_size_24_white {
        font-size: 24px;
        font-weight: 700;
        color: #FFFFFF;
    }

    .AttAndDevice_SloganP1 {
        font-size: 36px;
        color: #FFFFFF;
        margin-top: 60px;
        height: 90px;
    }

    .AttAndDevice_SloganP1_EN {
        font-family: 'Arial','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva', 'Verdana', 'sans-serif';
        font-size: 28px;
        color: #FFFFFF;
        margin-top: 30px;
        height: 90px;
    }

    .AttAndDevice_SloganP2 {
        font-size: 24px;
        color: #FFFFFF;
        margin-top: 20px;
        height: 200px;
    }

    .AttAndDevice_SloganP2_EN {
        font-family: 'Arial','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva', 'Verdana', 'sans-serif';
        font-size: 16px;
        color: #FFFFFF;
        margin-top: 30px;
        height: 200px;
    }
  
    .AdMain_SloganP1_EN {
        font-family: 'Arial','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva', 'Verdana', 'sans-serif';
        font-size: 28px;
        color: #FFFFFF;
        margin-top: 40px;
        height: 110px;
    }
   
    .compare_title{
        font-size:16px;
        font-weight:bold;
    }

    .span_h1_black_w900 {
        font-family: "Microsoft YaHei UI","Microsoft YaHei",'Arial','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva', 'Verdana', 'sans-serif';
        font-weight: 900 !important;
        font-size: 36px !important;
        color: black;
    }

    .span_h2_black_w900 {
        font-family: "Microsoft YaHei UI","Microsoft YaHei",'Arial','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva', 'Verdana', 'sans-serif';
        font-weight: 900 !important;
        font-size: 24px !important;
        color: black;
    }

    .span_h3_black_w900 {
        font-family: "Microsoft YaHei UI","Microsoft YaHei",'Arial','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva', 'Verdana', 'sans-serif';
        font-weight: 900 !important;
        font-size: 22px !important;
        color: black;
    }
     
    .b-big-page-divider {
        width: 100%;
        height: 1rem;
        background-color: #0000001a;
        border: solid rgba(0, 0, 0, 0.15);
        border-width: 1px 0;
        box-shadow: inset 0 0.5em 1.5em #0000001a, inset 0 0.125em 0.5em #00000026;
    }

    .why_choice_us_title {
        font-size: 36px;
        font-weight: 900 !important;
        font-family: 'Arial','Microsoft YaHei UI';
    }

    .footer_li_item_max_width {
        max-width: 130px;
    }
}

/* 手機設備 */
/*  < 767px AdMainAiBox_Mobile_20251026C.png */
/*  > 767px AdMainAiBox_SloganP1_20251026C.png */
@media (max-width: 767px) {
     
    body {
        width: 100%;
        min-height: 100vh;
        height: auto;
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-y: contain;
    }
      
    .logo_font_size_24_white {
        font-size: 24px;
        font-weight: 700;
        color: #FFFFFF;
    }

    .ad_main {
        background-image: url(/content/Images/AdMainAiBox_Mobile_20251026C.png);
        background-color: #47453e;
        background-size: 100% 100%;
        background-repeat: no-repeat;
        height: auto;
    }

    /*col-xs*/
    .AttAndDevice_SloganP1 {
        font-size: 36px;
        color: #FFFFFF;
        margin-top: 60px;
        height: 90px;
    }

    .AttAndDevice_SloganP1_EN {
        font-family: 'Arial','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva', 'Verdana', 'sans-serif';
        font-size: 28px;
        color: #FFFFFF;
        margin-top: 30px;
        height: 90px;
    }

    .AttAndDevice_SloganP2 {
        font-size: 24px;
        color: #FFFFFF;
        margin-top: 20px;
        height: 200px;
    }

    .AttAndDevice_SloganP2_EN {
        font-family: 'Arial','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva', 'Verdana', 'sans-serif';
        font-size: 16px;
        color: #FFFFFF;
        margin-top: 30px;
        height: 200px;
    }
   
    .AdMain_SloganP1_EN {
        font-family: 'Arial','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva', 'Verdana', 'sans-serif';
        font-size: 28px;
        color: #FFFFFF;
        margin-top: 40px;
        height: 110px;
    }

    .compare_title {
        font-size: 16px;
        font-weight: bold;
    }
     
     
    .span_h1_black_w900 {
        font-weight: 900 !important;
        font-size: 36px !important;
        color: black;
    }
   
    .span_h2_black_w900 {
        font-weight: 900 !important;
        font-size: 24px !important;
        color: black;
    }

    .span_h3_black_w900 {
        font-weight: 900 !important;
        font-size: 22px !important;
        color: black;
    }

    .b-big-page-divider {
        width: 100%;
        height: 1rem;
        background-color: #0000001a;
        border: solid rgba(0, 0, 0, 0.15);
        border-width: 1px 0;
        box-shadow: inset 0 0.5em 1.5em #0000001a, inset 0 0.125em 0.5em #00000026;
    }

    .why_choice_us_title {
        font-size: 36px;
        font-weight: 900 !important;
        color: black;
    }

    .footer_li_item_max_width {
        max-width: 130px;
    }

    .carousel-image {
        max-height: 300px;
    }
}
 
@media (min-width: 768px) and (max-width: 991px) {

    .ad_main {
        background-image: url(/content/Images/AdMainAiBox_Mobile_20251026C.png);
        background-color: #47453e;
        background-size: 100% 100%;
        background-repeat: no-repeat;
        height: auto;
    }

    .logo_font_size_24_white {
        font-size: 24px;
        font-weight: 700;
        color: #FFFFFF;
    }

    /*col-sm*/
    .AttAndDevice_SloganP1 {
        font-size: 36px;
        color: #FFFFFF;
        margin-top: 60px;
        height: 90px;
    }

    .AttAndDevice_SloganP1_EN {
        font-family: 'Arial','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva', 'Verdana', 'sans-serif';
        font-size: 28px;
        color: #FFFFFF;
        margin-top: 30px;
        height: 90px;
    }

    .AttAndDevice_SloganP2 {
        font-size: 24px;
        color: #FFFFFF;
        margin-top: 20px;
        height: 200px;
    }

    .AttAndDevice_SloganP2_EN {
        font-family: 'Arial','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva', 'Verdana', 'sans-serif';
        font-size: 16px;
        color: #FFFFFF;
        margin-top: 30px;
        height: 200px;
    }
     
    .AdMain_SloganP1_EN {
        font-family: 'Arial','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva', 'Verdana', 'sans-serif';
        font-size: 28px;
        color: #FFFFFF;
        margin-top: 40px;
        height: 110px;
    }

    .compare_title {
        font-size: 16px;
        font-weight: bold;
    }
     
    .dgx_develop_ad_banner_container {
        margin-right: 0px;
        margin-left: 0px;
        padding-left: 10px;
        padding-right: 10px;
        height: auto; /* 1000px; */
        background: linear-gradient(to right, #152236 10%, #6b7f9d 56%,#8ba5cc,95%, #6b7f9d 100%);
    }

    .span_h1_black_w900 {
        font-weight: 900 !important;
        font-size: 36px !important;
        color: black;
    }

    .span_h2_black_w900 {
        font-weight: 900 !important;
        font-size: 24px !important;
        color: black;
    }

    .span_h3_black_w900 {
        font-weight: 900 !important;
        font-size: 22px !important;
        color: black;
    }

    .b-big-page-divider {
        width: 100%;
        height: 1rem;
        background-color: #0000001a;
        border: solid rgba(0, 0, 0, 0.15);
        border-width: 1px 0;
        box-shadow: inset 0 0.5em 1.5em #0000001a, inset 0 0.125em 0.5em #00000026;
    }

    .why_choice_us_title {
        font-size: 60px;
        font-weight: 900 !important;
        /*font-family: 'Arial','Microsoft YaHei UI';*/
    }

    .footer_li_item_max_width {
        max-width: 190px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {

    .ad_main {
        background-image: url(/content/Images/AdMainAiBox_SloganP1_20251026C.png);
        background-color: #47453e;
        background-size: 100% 100%;
        background-repeat: no-repeat;
        min-block-size: 420px;
        height: auto;
    }

    .logo_font_size_24_white {
        font-size: 24px;
        font-weight: 700;
        color: #FFFFFF;
    }

    /*col-md*/
    .InfoListUnit-max-height {
        max-height: 120px;
        min-height: 120px;
        overflow-y: hidden;
        overflow: hidden;
    }

    .AttAndDevice_SloganP1 {
        font-size: 66px;
        color: #FFFFFF;
        margin-top: 70px;
        height: 110px;
    }

    .AttAndDevice_SloganP1_EN {
        font-family: 'Arial','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva', 'Verdana', 'sans-serif';
        font-size: 36px;
        color: #FFFFFF;
        margin-top: 80px;
        height: 90px;
    }

    .AttAndDevice_SloganP2 {
        font-size: 24px;
        color: #FFFFFF;
        margin-top: 10px;
        height: 180px;
    }

    .AttAndDevice_SloganP2_EN {
        font-family: 'Arial','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva', 'Verdana', 'sans-serif';
        font-size: 24px;
        color: #FFFFFF;
        margin-top: 10px;
        height: 120px;
    }
      
    .AdMain_SloganP1_EN {
        font-family: 'Arial','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva', 'Verdana', 'sans-serif';
        font-size: 46px;
        color: #FFFFFF;
        margin-top: 80px;
        height: 110px;
    }

    .compare_title {
        font-size: 22px;
        font-weight: bold;
    }
     
    .dgx_develop_ad_banner_container {
        margin-right: 0px;
        margin-left: 0px;
        padding-left: 10px;
        padding-right: 10px;
        height: auto; /* 560px; */
        background: linear-gradient(to right, #152236 10%, #6b7f9d 56%,#8ba5cc,95%, #6b7f9d 100%);
    }
    
    .span_h1_black_w900 {
        font-weight: 900 !important;
        font-size: 36px !important;
        color: black;
    } 
   
    .span_h2_black_w900 {
        font-weight: 900 !important;
        font-size: 24px !important;
        color: black;
    }

    .span_h3_black_w900 {
        font-weight: 900 !important;
        font-size: 22px !important;
        color: black;
    }

    .dgx_develop_ad_banner_container {
        margin-right: 0px;
        margin-left: 0px;
        padding-left: 10px;
        padding-right: 10px;
        height: auto; /* 560px; */
        background: linear-gradient(to right, #152236 10%, #6b7f9d 56%,#8ba5cc,95%, #6b7f9d 100%);
    }

    .b-big-page-divider {
        width: 100%;
        height: 1rem;
        background-color: #0000001a;
        border: solid rgba(0, 0, 0, 0.15);
        border-width: 1px 0;
        box-shadow: inset 0 0.5em 1.5em #0000001a, inset 0 0.125em 0.5em #00000026;
    }

    .why_choice_us_title {
        font-size: 60px;
        font-weight: 900 !important;
        font-family: 'Arial','Microsoft YaHei UI';
    }

    .footer_li_item_max_width {
        max-width: 190px;
    }
}

@media (min-width: 1200px) {

    .ad_main {
        background-image: url(/content/Images/AdMainAiBox_SloganP1_20251026C.png);
        background-color: #47453e;
        background-size: 100% 100%;
        background-repeat: no-repeat;
        min-block-size: 420px;
        height: auto;
    }

    .dgx_develop_ad_banner_container {
        margin-right: 0px;
        margin-left: 0px;
        padding-left: 10px;
        padding-right: 10px;
        height: auto; /* 560px; */
        background: linear-gradient(to right, #152236 10%, #6b7f9d 56%,#8ba5cc,95%, #6b7f9d 100%);
    }

    .logo_font_size_24_white {
        font-size: 24px;
        font-weight:700;
        color: #FFFFFF;
    }

    /*col-lg*/
    .InfoListUnit-max-height {
        max-height: 120px;
        min-height: 120px;
        overflow-y: hidden;
        overflow: hidden;
    }

    .AttAndDevice_SloganP1 {
        font-size: 66px;
        color: #FFFFFF;
        margin-top: 70px;
        height: 110px;
    }

    .AttAndDevice_SloganP1_EN {
        font-family: 'Arial','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva', 'Verdana', 'sans-serif';
        font-size: 36px;
        color: #FFFFFF;
        margin-top: 80px;
        height: 90px;
    }

    .AttAndDevice_SloganP2 {
        font-size: 24px;
        color: #FFFFFF;
        margin-top: 10px;
        height: 180px;
    }

    .AttAndDevice_SloganP2_EN {
        font-family: 'Arial','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva', 'Verdana', 'sans-serif';
        font-size: 24px;
        color: #FFFFFF;
        margin-top: 10px;
        height: 120px;
    }
  
    .AdMain_SloganP1_EN {
        font-family: 'Arial','Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', 'Geneva', 'Verdana', 'sans-serif';
        font-size: 46px;
        color: #FFFFFF;
        margin-top: 80px;
        height: 110px;
    }

    .compare_title {
        font-size: 22px;
        font-weight: bold;
    }
      
    .span_h1_black_w900 {
        font-weight: 900 !important;
        font-size: 36px !important;
        color: black;
    }

    .span_h2_black_w900 {
        font-weight: 900 !important;
        font-size: 24px !important;
        color: black;
    }

    .span_h3_black_w900 {
        font-weight: 900 !important;
        font-size: 22px !important;
        color: black;
    }

    .b-big-page-divider {
        width: 100%;
        height: 3rem;
        background-color: #0000001a;
        border: solid rgba(0, 0, 0, 0.15);
        border-width: 1px 0;
        box-shadow: inset 0 0.5em 1.5em #0000001a, inset 0 0.125em 0.5em #00000026;
    }

    .why_choice_us_title {
        font-size: 60px;
        font-weight: 900 !important;
       /* font-family: 'Arial','Microsoft YaHei UI';*/
    }

    .footer_li_item_max_width {
        max-width: 190px;
    }

    .carousel-image {
        max-height: 500px;
    }
}

/* global bg gradient sky blue*/
.dgx_hrms_ad_banner_container {
    margin-right: 0px;
    margin-left: 0px;
    padding-left: 10px;
    padding-right: 10px;
    height: auto;
    background: linear-gradient(to right, #152236 10%, #6b7f9d 56%,#8ba5cc,95%, #6b7f9d 100%);
}

.dgx_hrms_ad_banner_container_reverse {
    margin-right: 0px;
    margin-left: 0px;
    padding-left: 10px;
    padding-right: 10px;
    height: auto;
    background: linear-gradient(to left, #152236 10%, #6b7f9d 56%,#8ba5cc,95%, #6b7f9d 100%);
}

.AdMain_SloganP1 {
    margin-top: 30px;
    font-size: 24px;
    color: #FFFFFF;
    padding-top: 20px;
    padding-bottom: 20px;
    height: auto;
}