@charset "UTF-8";
/*div1*/
.div1_dm_left, .div1_dm_right {
    float: left; /* 這是大與中尺寸的共用值，手機版會再覆寫 */
}

.div1_dm_left_top {
    color: #ffffff;
    font-weight: bold;
}

.div1_dm_left_bottom img {
	max-width: 414px;
}
.div1_dm .article{
	color:#ffffff;
}
.div1_dm .title_leftborder_dm{
		margin:20px 0 20px 0;
	}
.div1_dm .article{
	line-height: 2;
}
.div1_dm_right{
	text-align: center;
	padding-top: 15%;
}
.div1_dm .div1_dm_right_img{
	width: 80%;
}
/*div end1*/
/*div2*/
/* --- 1. 全域共用樣式 (div2) --- */
.div2 .css_table {
    width: 100%;
}

.div2 .div2_css_td1,
.div2 .div2_css_td2 {
    text-align: center;
    vertical-align: top;
}

.div2 .div2_css_td1 .div2_css_tr1_img {
    max-width: 126px;
}

.div2 .div2_text1_dm {
    color: #a5d5b7;
    margin: 14px 0;
}

.div2 .div2_text2_dm {
    color: #ffffff;
    margin: auto;
    line-height: 1.9;
}

/*div2 end*/
.div34_bg_dm{
    background-image:url("../img/DGM_bg_01_new.png");
    background-repeat: no-repeat;
    background-position: center 0%;
    background-size: 1920px 762px;
}
/*div3 end*/
.div3_left{
    color:#ffffff;
}
       .div3 .outer-flex-carousel {
            display: flex;
            align-items: center; 
            gap: 25px;
            width: 100%
            max-width: 1000px;
            margin: 0 auto;
        }

        /* 左側指示器樣式維持 */
        .div3 .custom-indicators-outside {
            position: static; 
            display: flex;
            flex-direction: column; 
            margin: 0;
            padding: 0;
            z-index: 10;
        }

        .div3 .custom-indicators-outside [data-bs-target] {
            width: 14px;
            height: 14px;
            border-radius: 50%;
            margin: 12px 0;
            background-color: transparent;
            border: none;
            box-shadow: 0 0 0 1.5px rgba(255, 255, 255, 0.8); 
            transition: all 0.5s ease;
        }

        .div3 .custom-indicators-outside .active {
            box-shadow: none; 
            background-image: radial-gradient(circle at center, #98ebc3 0%, #4ac7ff 70%, #2f9dd1 100%);
            filter: drop-shadow(0 0 5px rgba(74, 199, 255, 0.6));
            transform: scale(1.1);
        }

        /* 圖片容器：核心修正 */
        .div3 .custom-rounded-inner {
            border-radius: 30px;
            overflow: hidden;
            box-shadow: 0 25px 60px rgba(0, 0, 0, 0.6);
            flex: 1;
            position: relative;
            background-color: transparent; /* 移除背景色 */
        }

        /* 關鍵修正：不再寫死 height，使用 aspect-ratio 維持比例 */
        .div3 .carousel-item img {
            width: 100%;
            height: auto; /* 讓高度自動 */
            /* 假設你的圖片大多是這個比例，你可以微調或是直接不設讓圖片撐開 */
            aspect-ratio: 6 / 4; 
            object-fit: cover; /* 改回 cover，但因為高度是自動的，所以不會裁切到內容 */
            display: block;
        }

        .div3 .carousel-fade .carousel-item { transition-duration: 1.2s; }

        /* 左右箭頭 */
        .div3 .carousel-control-prev, .carousel-control-next {
            width: 50px;
            z-index: 20;
            filter: drop-shadow(0 2px 4px rgba(0,0,0,0.5));
        }
/*div3 end*/
/*div4*/
.div4 .title2_dm{
    margin-bottom: 20px;
}
.div4_img{
    width: 100%;
    background: #ffffff;
    border-radius: 1em;
    margin-top: 10px;
    margin-bottom:10px;
}
.div4_img img{
    width: 100%;
}
/*div4 end*/
@media (min-width: 1920px) {
.div34_bg_dm{
    background-size: 100% 762px;
}
}
@media (min-width: 1200px) {
	/* 大螢幕版 */

    .div1_dm_left {width: 60%;   padding-top: 20px; }
    .div1_dm_left_top { font-size: 45px; padding-bottom: 10px; }
    .div1_dm_left_bottom img { width: 80%; }
    .div1_dm_right { width: 40%;}
    .div34_bg_dm{
    background-size: 100%;
    background-position: center 0%;
    }
}


@media screen and (min-width: 992px) and (max-width: 1199px) {
	/* 電腦/平板中螢幕 */

    .div1_dm_left { width: 60%;padding-top: 20px; }
    .div1_dm_left_top { font-size: 40px; padding-bottom: 10px; }
    .div1_dm_left_bottom img { width: 80%; }
    .div1_dm_right {  width: 40%; }
    .div34_bg_dm{
    background-size: 100%;
    background-position: center 12%;
    }
}
@media screen and (min-width: 992px) {
	/* 電腦版 */
/*div2*/
.div2 { margin-top: 60px; }
    
    .div2 .div2_css_td1 { width: 26%; }
    .div2 .div2_css_td2 { width: 11%; padding-top: 4%; }
    
    .div2 .div2_css_td1 .div2_css_tr1_img { width: 50%; }
    .div2 .div2_css_td2 .div2_css_tr2_img { width: 50%; max-width: 70px; margin-top: 10%; }
    
    .div2 .div2_text2_dm { max-width: 266px; }
/*div2 end*/
/*div3*/
.div3 { margin-top: 60px; }
/*div3 end*/
/*div4*/
.div4 { margin-top: 60px; }
/*div4 end*/
}

@media screen and (max-width: 991px) {
	/* 手機版 */

    .div1_dm_left { 
        width: 100%; 
        /*max-width: 400px; */
        padding-top: 10px; 
        margin: auto; 
        float: none; /* 手機版取消浮動 */
    }
    .div1_dm_left_top { font-size: 29px; padding-bottom: 6px; }
    .div1_dm_left_bottom img { width: 100%; }
    .div1_dm_right { 
        width: 100%; 
        margin-top: 20px; 
        float: none; /* 手機版取消浮動 */
    }
    .div1_dm_right{
	text-align: center;
	padding-top: 3%;
	}
	/*div2*/
.div2 { margin-top: 70px; }
    
    .div2 .css_table,
    .div2 .div2_css_td1,
    .div2 .div2_css_td2 { 
        display: block; 
        width: 100%; 
    }
    
    .div2 .div2_css_td2 .div2_css_tr2_img {
        width: 1px;
        height: 35px;
        margin-top: 20px;
        margin-bottom: 20px;
    }
/*div2 end*/
.div34_bg_dm{
    background-size: 240%;
    background-position: center 23%;
}   
/*div3*/
.div3 { margin-top: 70px; }
.div3 .col-md-8{
    margin-top: 20px;
}
/*div3 end*/
/*div4*/
.col-sm-6{
    width: 50%;
}
.div4 { margin-top: 70px; }
/*div4 end*/
}