@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100..900&family=Noto+Serif+TC&family=Noto+Serif:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
body{overflow-x:hidden; font-family: 'Oswald', Noto Sans TC;}
/*
關於CSS設定說明
CSS屬性是會繼承的，而且還是由上往下繼承。
同樣元素設定16px 後 12px 再 15px 最後會以最後設定的15px為準
但是有兩種情況除外:
1.絕對路徑命名. 如: .xx .yy .zz p {設定值;}
2.important.  如: .xx p {設定值 !important;}

CSS3選取器語法 :nth-child(n) 

*/


/*  = 預設解除背景輪播 =  */

#content_main {
    margin: 0;
}

.bannerindex {
    position: static;
    height: auto;
}

.swiper-banner {
    position: static;
    margin: 0;
    height: auto;
}

.swiper-slide img {
    height: auto;
}

@media screen and (max-width: 768px) {
    .bannerindex {
        padding: 0;
        margin: 0;
    }
}



/* = = = banner = = = = = = = = = = = = = = = = = = = = = = = = = = = = = */

.banner {padding: 75px 0 ;background-image: url(https://pic03.eapple.com.tw/shengkuncontrol/00002.jpg);}
.banner h5 {letter-spacing: 3px; color:#fff}
.banner.banA {}
.banner.banblog {}
.banE {}
.banC {}
.banB {}
.banD {}
@media screen and (max-width: 768px) { .banner h5 { font-size: 28px;}}
@media screen and (max-width: 600px) { .banner h5 { font-size: 24px;}}


/*Banner/＝＝＝＝＝*/

body.map_page .banner {
	/*display:none;*/
}

body.services_page .banB h5::before{
	content:"SERVICES";
}

.banE h5::before{
	content:"CASES";
}

.banF h5::before{
	content:"COST";
}

.banC h5::before, body.map_page .banB h5::before{
	content:"QUOTE";
}

.banner.banB h5::before {
    content: "RESERVE";
}

.banblog h5::before {
    content: "NEWS";
}


.banner h5::before{
	font-family: 'Oswald', Noto Sans TC;
    font-weight: 500;
	font-size: 65px;
    display: block;
	letter-spacing: 5px;
}

.banner h5{
	font-size: 24px;
    font-family: "Oswald", Noto Sans TC;
    letter-spacing: 8px;
    font-weight: 600;
    color: #fff;
    max-width: 1600px;
    width: 100%;
    padding: 120px 8vw 0px;
    text-align: left;
	text-shadow: 0px 0px 10px rgb(0 0 0 / 30%);
	line-height: 1.3;
}

.banner h5::after{
	content: "";
    max-width: 500px;
	width:100%;
    height: 1px;
    background: #FFFFFF;
    display: block;
    margin: 15px 0px;
}

body.map_page .banB h5::after{
	content: "聯絡我們";
    height: unset;
    background: unset;
    border-bottom: 1px #FFFFFF solid;
    margin-top: 0px;
    padding-bottom: 15px;
}



@media screen and (max-width: 1920px){
	.banner {

	}
}

@media screen and (max-width:1200px) {
	.banner {
		height: 520px;
	}
	
	.banner h5::before {
		font-size: 50px;
	}
	
	.banner h5{
		text-shadow: 0px 0px 10px rgb(0 0 0 / 70%);
		font-size: 22px;
	}
    .banner {
        height: 450px;
    }
}

@media screen and (max-width:1024px) {
	.banner {
		height: 430px;
	}
	
	.banner h5 {
		padding: 60px 8vw 0px;
	}

   
}

@media screen and (max-width:768px) {
	.banner {
		height: 330px;
	}
	.banner h5::before {
		font-size: 40px;
	}
	.banner h5 {
		font-size: 22px;
	}
	
	.banner h5::after {
		max-width: 340px;
	}

    .header_area.sticky {    position: fixed;}
}


@media screen and (max-width:600px) {
	.banner h5::before {
		font-size: 36px;
		line-height: 1;
    	margin-bottom: 5px;
	}
	
	.banner h5 {
		font-size: 20px;
	}
}

@media screen and (max-width:480px) {
	.banner {
    	height: 200px;
	}
	
	.banner h5 {
		padding: 35px 6vw 0px;
	}
	
	.banner h5::after {
		max-width: 270px;
	}
}


@media screen and (max-width:425px) {

.banner h5::before {
    font-size: 32px;
    line-height: 1;
    margin-bottom: 5px;
}

.banner h5 {
    font-size: 10px;
}

}

#page{
	/*background: url(https://pic03.eapple.com.tw/jiang/bg.jpg)no-repeat top center;
    background-size: cover;*/
}

#content_main, #content {
    background: url(https://pic03.eapple.com.tw/shengkuncontrol/bg.jpg)repeat center center;
    background-size: 100%;
}




/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

.header_area{padding: 0px;}

.nav-brand {
    padding: 5px 0 0;
}

.nav-brand img {
    max-width: 205px;
    transition: all 0.6s;
    animation-timing-function: cubic-bezier(0.6, -0.28, 0.74, 0.05);
}

.sticky .nav-brand img {
    margin-top: 8px;
    width: 200px;
    max-width: 200px;
    filter: contrast(0) brightness(100) drop-shadow(0px 0px 2px #222);
    transition: all 1s;
    animation-timing-function: cubic-bezier(0.18, 0.89, 0.32, 1.28);
}


.pageIndex .header_area {
    position: relative;
    width: 100%;
    padding: 0px;
}

header.header_area.sticky {
    position: fixed;
    width: 100%;
}

.pageIndex .main_header_area {
    background: linear-gradient(176deg, #ffffff, rgb(255 255 255 / 90%));
}

.main_header_area {
    background: linear-gradient(90deg, #eee, #fffdfd);
    box-shadow: 0 0 7px 3px #00000029;
}

.main_header_area .container {
    max-width: 95%;
}

.nav-brand:before {
    content: '';
    width: 0;
    width: calc(100% + 0px);
    height: 110px;
    background: linear-gradient(30deg, #01598b 25%, #033661 75%);
    position: absolute;
    top: 0;
    left: -1800px;
    -webkit-transform: skewX(-20deg);
    transform: skewX(-20deg);
    z-index: -1;
    box-shadow: 0 0 7px 0px #00000078;
    transition: all 1s;
    animation-timing-function: ease-out;
}

.sticky .nav-brand:before {
    content: '';
    /* width: 0; */
    width: calc(18% + 420px);
    height: 110px;
    background: linear-gradient(30deg, #17296b 25%, #4e5b8b 75%);
    position: absolute;
    top: 0;
    left: -400px;
    -webkit-transform: skewX(-20deg);
    transform: skewX(-20deg);
    z-index: -1;
    box-shadow: 0 0 7px 0px #00000078;
    transition: all 1s;
    animation-timing-function: ease-out;
}

.sticky .main_header_area {
    background: linear-gradient(90deg, #eee, #fffdfd);
    box-shadow: 0 0 7px 3px #00000029;
}

.sticky .nav-menu>li>a {
    color: #000;
}

.sticky .nav-menu>li:not(.tp_links) {
    border-left: 0px solid #eee;
}

.sticky .nav-menu>li:nth-child(5) {
    border-right: 0px solid #eee;
}

.tp_links {
    display: none;
}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */


/*新選單*/
.navigation {
    padding: 10px 0 0px 50px;
}

.stellarnav li {
    font-family: 'Noto Sans TC';
    font-size: 17px;
}

.stellarnav li a {
    color: #000;
    padding: 10px 10px;
}

.stellarnav>ul>li {
    padding: 0 5px;
}

/*第一層*/
.stellarnav>ul>li>a {
    margin: 10px 10px 8px;
    padding: 0px 10px 0;
    position: relative;
    letter-spacing: 1.1px;
    color: #000000;
    transition: all 0.3s;
    font-weight: 800;
}

.stellarnav>ul>li>a:hover {
    color: #033661;
}

.stellarnav li li a {
    transition: all 0.2s ease-in-out;
}



/*下拉分類滑過後*/

/*選單下拉三角槓槓*/
.stellarnav li.has-sub>a:after {
    content: '';
    display: inline-block;
    position: absolute;
    top: 45%;
    transform: translateY(-50%);
    height: 5px;
    width: 5px;
    display: block;
    border-style: solid;
    border-width: 0 1px 1px 0;
    border-color: transparent #cccccc #cccccc transparent;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}



/*按鈕效果*/
.stellarnav>ul>li:hover::after {
    transform: scale(1);
    transition: 0.3s ease-in-out;
}


.stellarnav>ul>li::before {
    content: "";
    width: 2px;
    height: 10px;
    border-radius: 0;
    background-color: #dddddd;
    position: absolute;
    bottom: 25px;
    right: 0;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}


.stellarnav>ul>li::after {
    content: "";
    background: #033661;
    height: 3px;
    width: 60%;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 20%;
    transform: scale(0, 1);
    transition: 0.3s ease-in-out;
}



/*下拉分類橫向箭頭*/
.stellarnav li li.has-sub>a:after {
    content: '';
    display: inline-block;
    position: absolute;
    top: 45%;
    right: 10px;
    transform: translateY(-50%);
    height: 5px;
    width: 5px;
    display: block;
    border-style: solid;
    border-width: 0 1px 1px 0;
    border-color: transparent #cccccc #cccccc transparent;
    -webkit-transform: rotate(253deg);
    transform: rotate(-45deg);
}



/*-------------------------------------------------*/

/*第二層*/
.stellarnav li {font-weight: 800;}
.stellarnav li li>a,
.stellarnav li li.has-sub>a {
    padding: 10px 15px;
    transition: all 0.3s;
    letter-spacing: 1.5px;
    border-left: 1px solid transparent;
    font-size: 14px;
}
.stellarnav li li:hover{    background-color: #033661; font-weight: 800; }
.stellarnav li li:hover>a,
.stellarnav li li.has-sub:hover>a {
    padding-left: 20px;
    border-left: 1px solid #033661;
    color:#fff;
}


.stellarnav>ul>li>ul {
    left: 50%;
    transform: translateX(-42%);
}

.stellarnav ul ul {
    width: 200px;
    border: 1px solid #eeeeee;
}

/*下拉分類寬度*/
.stellarnav li li {
    border: none;
}

.stellarnav li li+li {
    border-top: 1px solid #eeeeee;
}

.stellarnav li.drop-left ul ul {
    right: 100%;
}

.stellarnav ul ul ul {
    left: 100%;
}



@media screen and (max-width: 1366px) {
    .sticky .nav-brand:before {
        width: calc(100% + 345px);
    }

    .sticky .nav-brand img {
        margin-top: 15px;
        width: 180px;
        max-width: 350px;
    }
}

@media screen and (max-width: 1280px) {
    .nav-header {
        position: static;
        text-align: center;
    }

    .stellarnav ul {
        text-align: center;
    }

    .navigation {
        padding: 10px;
    }

    .main_header_area .container {
        max-width: 100%;
    }

    .sticky .nav-brand img {
        margin-top: 0px;
        filter: none;
        transition: all 1s;
        animation-timing-function: cubic-bezier(0.18, 0.89, 0.32, 1.28);
    }

    .nav-brand {
        width: 350px;
    }

    .nav-brand:before {
        display: none;
    }

    .pageIndex .header_area {
        position: relative;
        width: 100%;
    }

    .sticky .main_header_area {
        background: #fff;
    }

    .pageIndex .main_header_area {
        background: #fff;
    }

    .main_header_area {
        background: #fff;
        box-shadow: 0 0 7px 3px #00000029;
    }
}


@media screen and (max-width: 768px) {
.stellarnav.mobile.right .close-menu, .stellarnav.mobile.left .close-menu{background: #033661;}
.stellarnav .icon-close:before{border-bottom: solid 3px #ffffff;}
.stellarnav .icon-close:after{border-bottom: solid 3px #ffffff;}
.stellarnav a {color: #ffffff;}
.stellarnav.mobile li.open{background: #ffffff;}
.nav-brand {width: 300px;}
}


@media screen and (max-width: 450px) {
    .sticky .nav-brand img {
        margin-top: 15px;
        width: 185px;
    }
}

@media screen and (max-width: 350px) {
    .sticky .nav-brand img {
        margin-top: 0px;
        width: 165px;
    }
}


.path p, .path p a{display: none;}





/* ====footer===================================================================================================================== */
/*Footer/＝＝＝＝＝*/
.box_link {display: none;}
#to_top {      color: #ffffff;    font-weight: 800;  background: #193898; border-radius: 0%;}
#to_top i:before, #to_top i:after{background:#ffffff;}
#to_top i.top:before, #to_top i.top:after{    width: 3px;}
.footer {    padding: 80px 0 0;     background-color:#193898;}
.footer_info li p, .footer_info li p > a { color: #ffffff; line-height: 220%;}
.footer_info { display: flex; padding: 0; justify-content: space-between;}
.footer_logo { display: none; }
.footer_logo img { max-width: 100px;}
.footer_info ul { display: flex;    align-items: flex-start;    justify-content: space-between;    width: 100%;}
.footer_info li { padding: 0;     font-weight: 600;}
.footer_info li:nth-child(1) {    width: 48%;}
.footer_info li:nth-child(2) {    width: 48%;    text-align: right;}

.footer_menu a {
    background: transparent;
    color: #ffffff;
    border: none;
    /* width: 42%; */
    display: block;
}
.footer_menu a:first-child {    display: none;}
.footer_menu a:hover {    background: transparent; color: #99FFFF;}

.box_link {
    top: 100%;
    width: 100%;
    text-align: left;
    padding: 0 13.5%;
    transition: all 0.3s;
}
.box_link a {
    display: inline-block;
    width: 30px;
    height: 30px;
    background: transparent;
    border-radius: 30px;
    font-size: 18px;
    padding: 2px;
    color: #eee;
    border: 1px #88888847 solid;
    transition: all .3s;
}
.box_link a:hover {    background: transparent;    color: #767676;}
.copy {    border: none;    padding: 85px 0 60px;    text-align: right;    width: 100%;    max-width: 1300px;    margin: 0 auto;}
.copy, .copy a {    color: #ddd; transition:all 0.3s;}
.copy a:hover {
    color: rgb(147, 221, 255);
}


/*--RWD---------------------------------------*/

@media screen and (max-width: 1024px){
    /*.footer_info {padding: 0 80px 0 0;}*/
    .footer .center {max-width: 800px;}
    .copy {max-width: 800px;}

}

@media screen and (max-width: 768px) {
    /*footer*/
    .footer_info { align-items: center;}
    .footer_logo { text-align: center;}
    .footer_info ul { flex-direction: column;}
    .footer_info li:nth-child(1) { width: 100%;text-align: center;}
    .footer_info li:nth-child(2) { width: 100%; border-left: none;text-align: center;}
    .copy { text-align: center;}
    .double_key { text-align: center;}
    

    /*底部按鈕*/
    #to_top { bottom:60px;}
    #bottom_menu {display:none; }
    .footer.with_shopping_mode { padding:30px 0 70px; }

    .footer_menu {
        display: flex;
        width: 100%;
        justify-content: center;
        margin: 15px 0;
    }
    .copy {    padding: 20px 0 60px;}
}

@media screen and (max-width: 600px) { 
    /*footer*/
    .footer_info ul { width: 100%;}

    /*聯絡icon*/
    .box_link { text-align: center;}

    .copy {
        padding: 0px 0 60px;
    }
}


@media screen and (max-width: 460px) {
    .footer_menu {
        display: flex;
        width: 100%;
        justify-content: center;
        flex-direction: column;
    }
    .copy {
        padding: 80px 0 70px;
    }
}

/* 原浮動隱藏 */

.linksBtn{display:none}






/* = = = 購物車 = = = = = = = = = = = = = = = = = = = = = = = = = = = = = */

/*--首頁、外層 共同設定---------------------------------------*/

.products-list { display: grid; gap: 10px; grid-template-columns: repeat(4,1fr);}
.products-list::before { content:none;}
.products-list .item { width: 100%;}

/*--首頁區塊---------------------------------------*/

.prod_part { width: 100%;}

/*英文標題*/
.prod_part .i_prod_tit h2 { display: none; color: #1D3995;}

/*中文*/
.prod_part .i_prod_tit span { position: relative; color: #3F4049; font-weight: 600; text-shadow: 2px 2px 0 #FFFFFF, -2px -2px 0 #FFFFFF, 2px -2px 0 #FFFFFF, -2px 2px 0 #FFFFFF;}
.prod_part .i_prod_tit span::before {
    content: "PRODUCT";
    position: absolute;
    top: -45px;
    left: -60%;
    width: 100%;
    text-align: center;
    font-size: 60px;
    color: #1D3995;
    letter-spacing: 3px;
    text-shadow: none;
    transform: translateX(-50%);
    z-index: -1;
}

/*--購物車/外層---------------------------------------*/

/*顏色*/
.products-list .more { border: 1px solid #1D3995; color: #1D3995;}
.products-list .item a:hover .more { background: #1D3995;}

/*名稱*/
.products-list .name { color: #1D3995; font-weight: 600; font-size: 16px; height: 51px;}

/*價格*/
.products-list .price { display: flex; margin-bottom: 5px; align-items: center; justify-content: center; flex-wrap: wrap;}
.products-list .price b { margin: 0 5px; line-height: 180%; text-align: center;color: #1D3995;}
.products-list .price b.ori_price { font-size: 14px;}

/*外層版面*/
.product_page .main_part { width: 90%;	max-width: 1500px;}
.product_page .show_content { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between;gap: 10px;}
.product_page .products-list { width: calc(100% - 280px);}
.product-layer-two { width: 250px; margin: 0;}
.product_info_page .product-layer-two { display: none;}
.product-layer-two li { margin: 0; width: 100%; padding: 0 10px;}
.product-layer-two > li.active { background: #1D3995; border-radius:0px;}
.product-layer-two li.active li a { color: #fff; border: unset;}

/**/
.product-layer-two li a { color: #222; border: none; border-bottom: 1px dotted transparent; background: transparent; line-height: 200%; transition: all 0.3s;}
.product-layer-two > li > a { border-bottom: 1px dotted #ccc; padding-left: 25px;}
.product-layer-two li:hover > a { color: #1D3995;}
.product-layer-two li.active > a { color: #fff; border: none;}
.product-layer-two li:hover > a:before { background: #1D3995; color:#fff;}
.product-layer-two li.active > a:before { background: #fff; color:#1D3995;}
.product-layer-two > li > a:before {
    border-radius: 100%;
    align-items: center;
    justify-content: center;
    display: flex;
    height: 18px;
    content: "＞";
    color: #1D3995;
    background: #f2f2f2;
    width: 18px;
    text-align: center;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.3s;
    padding-left: 2px;
    font-size: 13px;
}

/**/
.product-layer-two li ul { position: relative; padding-top: 1px;}
.product-layer-two li li { border: none; background: transparent;}
.product-layer-two li li a { background: transparent;}
.product-layer-two li li:hover a { color: #1D3995;}
.product-layer-two li.active li:hover a { color: #1D3995;}

/*hover到才顯示副選單 關掉↓*/
.product-layer-two li li { display: block;}

/*--購物車/內層---------------------------------------*/

.product_info_page .main_part { width: 90%;}
.mobile_product_name { color: #1D3995; font-size: 24px; text-align: center;}

/*次分類*/
.block { background: #1D3995;}

/*按鈕顏色*/
.inquiry_a1 { display: none; }
.inquiry_a2 { display: none; }
.inquiry_a3 { background: #1D3995; transition: .3s ease-in-out;}
.inquiry_a1:hover, .inquiry_a2:hover, .inquiry_a3:hover { background: #222; transition: .3s ease-in-out;}
.lastaction { color: #fff; background-color: #1D3995; transition: .3s ease-in-out;}
.lastaction:hover { color: #fff; background-color: #222; transition: .3s ease-in-out;}
.nextaction { background-color: #1D3995; transition: .3s ease-in-out;}
.nextaction:hover { color: #fff; background-color: #222; transition: .3s ease-in-out;}
.lastPage { background: transparent; border: 1px solid #1D3995; color: #1D3995; transition: all 0.3s;}
.lastPage:hover { color: #fff; background-color: #1D3995; border: 1px solid #1D3995; transition: all 0.3s;}

/*商品照輪播*/
/*..product_main { width: 100%;}*/
.product_pic h6 { display: none; color: #444;}
.product_pic #bx-pager .block { background: #444;}

/*商品側邊規格*/
.product-layer-two li:hover li{display: block;}
/*.sidebarBtn { display: none;}*/
.product_info li .txt_box { color: #222222; width: 100%;}
.sidebarBtn .sp_price { color: #1D3995;}

/*區塊*/
.prod li { text-align: center;}
.prod li .prod-panel { margin: 20px 0 40px; text-align: justify;}

/*內文*/
ul.prod li h3.prod-thumb { background: transparent; color: #1D3995; border-bottom: 1px solid #1D399588; padding: 5px 5px 15px; display: inline-block;}

/*Q&A*/
/*li.prod-item:not(.is-active) { display: none;}隱藏*/
.qaform .breakF { background: transparent;}
.half_box ul li { text-align: left;}
.half_box ul li img { margin-left: 10px;}/*驗證碼*/

/*相關推薦*/
.prod_related { background: transparent; text-align: center;}
.prod_related h6 { color: #1D3995; border-bottom: 2px solid #1D399588; padding: 5px 5px 15px; display: inline-block;}
.prod_related h6 span:before { font-size: 20px; color: #1D3995;}
.related_list { display: grid; grid-template-columns: repeat(4,1fr);}
.related_list li { padding: 7px 7px 22px; overflow: hidden; width: auto;}
.related_list li:hover { opacity: 0.6; transition: .3s ease-in-out;}
.related_list li a { max-height: 300px;}
.related_list li a img { max-height: 250px;}
.related_list li a p { margin-top: 10px;}

/*--RWD---------------------------------------*/

@media screen and (max-width: 1200px) { .products-list { grid-template-columns: repeat(3,1fr);}}
@media screen and (max-width: 1024px) { .product_page .products-list { grid-template-columns: repeat(2,1fr);}}
@media screen and (max-width: 768px) { 
    .products-list { grid-template-columns: repeat(2,1fr);}
    .product_page .products-list, .product-layer-two { width:100%;}
    .prod_related h6 span:before { font-size: 24px;}
    /*順序*/
    .product_page .products-list { order: -1;}
}
@media screen and (max-width: 600px) { 
    .prod_related h6 span:before{font-size: 20px;}
    .related_list { grid-template-columns: repeat(2,1fr);}
}
@media screen and (max-width: 375px) { .products-list, .product_page .products-list  { grid-template-columns: 1fr;}}





/*文章管理/＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*首頁_文章管理*/
h5.blog_le_t em{display: none;}
h5.blog_le_t span {display: none;}


/*首*/
.module_i_news ul{width: 90%;	grid-template-columns:1fr 1fr 1fr 1fr ;}
.module_i_news ul, .blog_subbox {  display: grid;  gap: 30px;}
.blog_subbox {    grid-template-columns: unset;}
.pageIndex .module_i_news { max-width: 2000px; margin: 0 auto; padding: 70px 0 120px 0; background-image: url(https://pic03.eapple.com.tw/700451/ind_news_bg.jpg), url(https://pic03.eapple.com.tw/700451/ind_bg.jpg);
    background-position: left top, center; background-repeat: no-repeat, repeat;}
.pageIndex .module_i_news ul { max-width: 1400px; width: 100%; margin: 70px auto 20px auto;}
.pageIndex .module_i_news li {border-bottom: 0px #eee solid; }
.pageIndex .module_i_news .title_i_box:before { content: ""; width: 550px; border-top: 1px solid #DDE3D2;  position: absolute;  z-index: 1;}
.module_i_news .title_i_box {  text-align: center;  display: flex;  justify-content: center; align-items: flex-end; margin: 0;}
.pageIndex .module_i_news .title_i_box h6:before {	content: "01"; position: relative; top: 132px; left: -120px; width: 90px; font-size: 12px; border: 1px solid #7F9F7D; padding: 35px 35px; height: 90px; display: block;
	    transform: rotate(90deg) translateX(0);}
.pageIndex .module_i_news .title_i_box h6 {font-size: 110px; color: #5F745D; font-weight: 500; font-family: Noto Sans TC; letter-spacing: 5px; padding: 0 0 0 120px;}/*英標*/
.pageIndex .module_i_news .title_i_box h4 {  font-size: 18px;   color: #858585;  font-weight: 300;  font-family: Noto Sans TC;  padding: 0 0px 0px 20px;  bottom: 28px;  position: relative;}/*中標*/
.pageIndex .i_blog_ri { background: #fff; transform: translate(35px, -60px); padding: 15px 35px; position: relative;}
.pageIndex .i_blog_ri h5 {  height: 66px; font-size: 18px; padding: 10px 0; color: #555555; transition: all 0.3s; -webkit-line-clamp: 2;}
.pageIndex .module_i_news li a:hover h5 { color:#A28C62;}
.i_blog_le{ box-shadow: 4px 16px 40px rgba(30, 103, 64, 0.16);}
.blog_list_le { box-shadow: 4px 16px 40px rgba(30, 103, 64, 0.16);}
.pageIndex .i_blog_ri em { font-size: 12px;  margin: 0;}
.pageIndex .i_blog_ri p { display:none;}
.module_i_news li:hover .i_blog_ri:before { width: 100%;}
.i_blog_ri:before { content: ""; width: 0;  height: 1px;  background: #A28C62;  transition: all .5s;  position: absolute;  bottom: 0;  left: 0;}
.pageIndex .i_blog_le, .blog_list_le {  overflow: hidden;}
.i_blog_le, .i_blog_ri{  width: 100%;}
.pageIndex .i_blog_le img, .blog_list_le img { transition: 0.5s;}
.pageIndex .module_i_news li :hover .i_blog_le img, .subbox_item:hover .blog_list_le img { transform: translate(-50%, -50%) scale(1.05); }
.pageIndex .subbox_item a:hover:before, .subbox_item a:hover:after { opacity: 0; transition: all .5s;}
.module_i_news li{  width: 100%;}

/*查看更多按鈕*/
.fa-arrow-right::before { content: "+";}
.animated-arrow { font-size: 16px; font-weight: 200;  font-family: Noto Sans TC;}
/*-------------------------------------------------------------------------------------------------------------------------------------------------*/





/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*文章設定*/
/*一排呈現
.subbox_item { width:100%;}
*/
.share_page .edit {    text-align: justify;    line-height: 180%;}
.subbox_item a:before , .subbox_item a:after {    transition: 0.3s;}
.blog_le .accordion > li {    transition: all 0.3s;}
.blog_box_edit {    line-height: 180%;    text-align: justify;}
h4.blog_category_title {    text-align: justify;}
.link a {
    width: 100%;
    display: block;
    padding: 15px 10px;
    color: #000000;
}
.accordion li .link {    padding: 0;}

h5.blog_le_t {
    color: #fff;
    letter-spacing: 2px;
    margin-bottom: 7px;
}
h5.blog_le_t span {
    font-family: Arial;
    display: inline-block;
}

.subbox_item a:before{
    padding: 10px 20px;
    background-color: #1D3995;
	color: #d3d3d3;
}

.blog_list_ri h5 {
    color: #000000;
}

.blog_search input[type=search] {
    outline: none;
    box-sizing: border-box;
    width: 100%;
    font-size: 14px;
    color: #fff;
    border: 0;
    border-bottom: 1px #fff9 solid;
    border-radius: 0;
    padding: 10px 35px 10px 10px;
    background: transparent;
}
.blog_le .accordion {
    padding: 10px;
    border: 0;
    overflow: visible;
}
.blog_le .accordion > li {
    transition: all 0.3s;
    border-bottom: 1px #fff9 solid;
}
.blog_le .accordion > li:hover, .blog_le .accordion > li.on_this_category {
    background: #ffffff17 !important;
}


/*文章變1排3個*/
.blog_page .main_part {    max-width: 1400px;}
.blog_list_le , .blog_list_ri {    width: 100%;}
.blog_subbox {    display: flex;    flex-wrap: wrap;    justify-content: flex-start;}
.subbox_item {
    width: 40%;
    padding: 5px;
    margin-bottom: 5%;
}
.subbox_item:nth-child(even) {
    margin-left: 10%;
}
.subbox_item:nth-child(even) .blog_list_ri{
    text-align: left;
}

.subbox_item:nth-child(even) a:before {
    bottom: 10px;
}




.subbox_item a {
    position: relative;
    display: block;
}
.subbox_item a:after {
    content: '';
    width: 0%;
    position: absolute;
    left: 50px;
    top: auto;
    bottom: 50px;
    z-index: 8;
    height: 1px;
    background: #1D3995;
    opacity: 0;
    border: none;
    transition: all 0.5s;
}
.subbox_item a:hover:after {
    width: 100%;
    left: 0;
    bottom: -5px;
    opacity: 1;
    transition: all 1s;
	border-color: #1D3995;
}


.blog_list_le {
    height: 0;
    width: 100%;
    line-height: 0;
    padding: 0;
    padding-bottom: 100%;
    overflow: hidden;
    position: relative;
}
.blog_list_le img {
    width: 100%;
    max-width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
h4.blog_category_title {
    text-align: justify;
    color: #000000;
}
.blog_box_edit * {
    line-height: 150%;
    color: #000000;
}


h5.blog_le_t em    {    display: none;}
h5.blog_le_t span {    display: none;}
.blog_le .accordion > li:hover .link a, .blog_le .accordion > li.on_this_category .link a{color: #000000 !important;}

.blog_back a.article_btn_back{background: #1D3995;}
.articel_mainPic img{display: none;}

@media screen and (max-width: 1024px) {.subbox_item {width: 80%;}}
@media screen and (max-width: 960px) {
    .subbox_item {
        width: 100%;
        border-bottom: none;
    }
    
}
@media screen and (max-width: 768px) {
    .blog_page .main_part {
        max-width: 80%;
    }
    
}




@media screen and (max-width: 600px) {.subbox_item {    width: 100%;}}
/**/






/* 相簿============================================================== */
/* 首頁相簿 */
.module_i_album {background-color: #000;}
.i_album_list li a p{background: #1D3995;color: #ffffff;}
.module_i_album .title_i_box h4{color: #ffffff;    font-size: 30px;}
.i_prod_tit h2, .i_video_tit h2 {font-size: 30px;    font-weight: 500;}

.show-list {    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));}

.other_album_choice li {border-radius: 0px;}

.path {
    display: none;
}

/* 標題 */
.subalbum-menu h2 {
    color: #fff;
}

.block {
    background: #fff;
}

/* 觀看其他 */
/*觀看其他作品*/
.album_fixed_title embed {
    display: none;
}

.album_fixed_title {
    display: none;
}

.other_album_choice li a {
    color: #fff;
}

.other_album_choice li {
    background: #1D3995;
}


.other_album_choice li {
    margin-top: 2%;
}




/* 相簿第一層內頁=========== */


body.album_page .show_content {
    width: 95%;
    padding: 0;
    display: grid;
    flex-wrap: wrap;
}

.subalbum-menu {
    padding: 0;
}

.other_subalbum li {
    width: 33%;
    margin: 0;
}


ul.show-list.clearfix {
    width: 100%;
    max-width: 1326px;
    margin: 0 auto;
    padding: 0;
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 30px;
}

body.album_page .main_part {
    max-width: 1100px;
    margin: 5% auto auto auto;
    padding: 0 0 80px 0;
}

.album_page .show-list .item {
    width: 100%;
    display: inline-block;
    vertical-align: top;
    padding: 0 10px;
    margin: 20px 10px;
    padding: 0;
    margin: 0.4%;
    box-sizing: border-box;
}

.overlay {
    display: none;
}


.album_page .show-list .item a {
    max-width: 100%;
}

.album_page .show-list .show_pic {
    display: block;
    position: relative;
    text-align: center;
    height: auto;
    aspect-ratio: 12 / 8;
    overflow: hidden;
    padding-bottom: 0;
}

.album_page .show-list .show_pic img {
    max-width: 100%;
    max-height: 100%;
    transition: 1s;
    object-fit: cover;
    height: 100%;
    width: 100%;
}

.album_page .show-list .show_pic img:hover {
    transform: scale(1.1);
}

.album_page .show-list .show_name {
    background: rgb(0 0 0 / 54%);
    width: -webkit-calc(100% - 50px);
    width: calc(100% - 50px);
    height: -webkit-calc(100% - 50px);
    height: calc(100% - 50px);
    top: 25px;
    left: 25px;
    opacity: 0;
    cursor: pointer;
    -webkit-transform: scale(0.95);
    -ms-transform: scale(0.95);
    transform: scale(0.95);
    -webkit-transition: .2s ease-in-out;
    -o-transition: .2s ease-in-out;
    transition: .2s ease-in-out;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    -o-transition-property: opacity, transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    position: absolute;
    color: transparent;
}


.album_page .show-list .item:hover .show_name {
    opacity: 1;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    color: #fff;
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    display: flex;
    justify-content: center;
    align-content: center;
    flex-wrap: wrap;
}



.album_page .show-list .item a:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    border: 0px solid rgba(255, 255, 255, 0.4);
    -webkit-transition: border 0.5s;
    -o-transition: border 0.5s;
    transition: border 0.5s;
    transition: 0.5s;
    pointer-events: none;
}

ul.show-list.clearfix:hover a:hover:after {
    border-width: 13px;
}


@media screen and (max-width: 768px) {
    ul.show-list.clearfix {
        gap: 10px;

    }

    .album_page .show-list .item,
    .album_page .show-list .item:hover {
        flex-basis: 100%;
        margin-bottom: 2%;
    }

    body.album_page .show_content {
        padding-bottom: 80px;
    }

    .album_page .show-list .show_name,
    .album_page .show-list .item:hover .show_name {
        opacity: 1;
        position: relative;
        color: #222;
        background: transparent;
        height: auto;
        top: 0;
        padding: 0;
        font-size: 13px;
        width: 100%;
        text-align: center;
        left: 0;
        margin: 10px 0 0 0;
    }

    ul.show-list.clearfix:hover a:hover:after {
        display: none;
    }

  
}




/* 相簿第二層內頁===========================--- */


body.album_class_page .main_part {
    max-width: 1100px;

    margin: 0 auto;
    padding: 0;
}

body.album_class_page .subalbum-menu h2 {
    display: none;
}

.other_subalbum {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 30px;
}

.subalbum-menu {
    margin: 80px 0;
}

.other_subalbum li {
    position: relative;
    width: 100%;
}


.other_subalbum li p {
    position: absolute;
    right: 50%;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, 0%);
    width: 100%;
    height: auto;
    font-size: 13px;
    color: #FFFFFF !important;
    border: none;
    text-align: center;
    background: rgba(0, 0, 0, .3);
    padding: 10px;
    transition: all ease-in .3s;
    border-radius: 10px;
}

.other_subalbum li:hover p {
    opacity: 1;
}

.other_subalbum li a>div {
    display: block;
    position: relative;
    text-align: center;
    height: auto;
    aspect-ratio: 12 / 8;
    overflow: hidden;
    padding-bottom: 0;
}



.other_subalbum li a img {
    max-width: 100%;
    max-width: 100%;
    min-width: 100%;
    object-fit: cover;
    height: 100%;
    -moz-object-fit: cover;
    -ms-object-fit: cover;
    -o-object-fit: cover;
    -webkit-object-fit: cover;
    transition: all 0.2s;
}

.other_subalbum li a:hover img {
    transform: scale(1.1);
    max-width: 100%;
    max-height: 100%;
    transition: 1s;
    object-fit: cover;
    height: 100%;
    width: 100%;
}


.other_subalbum li a:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: #ffffff3b;
    z-index: 1;
    opacity: 0;
    transition: 0.5s;
    pointer-events: none;
}


.other_subalbum:hover a:hover:after {
    opacity: 0;
    transition: 0.5s;
}

.other_subalbum:hover a:after {
    opacity: 1;
    transition: 0.5s;
}

@media screen and (max-width: 1200px) {}


@media screen and (max-width: 768px) {
    body.album_class_page .main_part {}

    body.album_class_page .subalbum-menu {
        margin-top: 0;
    }

    .other_subalbum {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 10px;
    }

    body.album_class_page .show_content {
        padding-bottom: 80px;
    }

    .other_subalbum li p,
    .other_subalbum li:hover p {
        opacity: 1;
        position: relative;
        background: rgba(0, 0, 0, .3);
        height: auto;
        top: -30px;
        padding: 0;
        font-size: 13px;
        width: 100%;
        text-align: center;
    }

}


@media screen and (max-width: 476px) {

    .other_subalbum {
        grid-template-columns: minmax(0, 1fr);
    }

    .show-list {
        display: flex;
        flex-direction: column;
    }
}

/* 相簿第三層內頁================== */


body.album_info_page .main_part {
    margin: 0 auto;
    padding: 5% 0;
    max-width: 1100px;

    width: 95%;
}

ul.pic-list.clearfix {
    display: grid;
    width: 100%;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 30px;

}

.album_info_page .pic-list .show_pic img {
    max-width: 100%;
    max-height: 100%;
    transition: 1s;
    object-fit: cover;
    height: 100%;
    width: 100%;
}

.album_info_page .pic-list .show_pic {
    display: block;
    position: relative;
    text-align: center;
    height: auto;
    aspect-ratio: 12 / 8;
    overflow: hidden;
    padding-bottom: 0;
}


.album_info_page .pic-list .item {
    position: relative;
    padding: 0;
    margin: 0;
    width: 100%;
}

.album_info_page .pic-list .item h6 {
    position: absolute;
    right: 50%;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, 0%);
    width: 100%;
    height: auto;
    font-size: 13px;
    color: #FFFFFF !important;
    border: none;
    text-align: center;
    /* background: rgba(0,0,0,.3); */
    padding: 10px;
    transition: all ease-in .3s;
}


ul.pic-list.clearfix li a:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: #989d8f75;
    z-index: 1;
    opacity: 0;
    transition: 0.5s;
    pointer-events: none;
    mix-blend-mode: multiply;
}


ul.pic-list.clearfix:hover a:after {
    opacity: 1;
    transition: 0.5s;
}

ul.pic-list.clearfix:hover a:hover:after {
    opacity: 0;
    transition: 0.5s;
}



@media screen and (max-width: 1200px) {}

@media screen and (max-width: 768px) {
    .album_info_page .pic-list .item h6 {

        opacity: 1;
        position: relative;
        color: #222;
        background: transparent;
        height: auto;
        top: 0;
        padding: 0;
        font-size: 13px;
        width: 100%;
        text-align: center;
        left: 0;
    }

    .album_info_page .show_content {
        padding-bottom: 80px;
    }

    ul.pic-list.clearfix {
        gap: 10px;
    }

    ul.pic-list.clearfix li a:after {
        display: none;
    }

}