@charset "utf-8";
/*banner
.banner_box{ width:100%; height:350px; background:no-repeat center 135px #eee; background-attachment:fixed; display:flex; flex-direction:column; justify-content:center; align-items:center; position:relative; overflow:hidden;}
.banner_box h1{ color:#fff; font-size:50px; font-family: 'Noto Serif TC'; font-weight: 700; margin-bottom:10px;}
.banner_box p{ color:#fff; font-size:16px; line-height:35px; max-width:420px; font-weight:200;}
.banner_box::after{ content:""; display:block; position:absolute; top:0; left:-500px; bottom:0; width:500px; background:-moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 30%, rgba(255,255,255,1) 70%, rgba(255,255,255,0) 100%); background:-webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%); background:linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%); mix-blend-mode:overlay; opacity:.25; animation:banner_light 13s 1s infinite; pointer-events:none;}
@keyframes banner_light{from{left:-500px;}to{left:120%;}}
*/
/*banner*/
.banner_box{ position:relative;}
.banner_box .banner_slide{ position:relative;}
.banner_box .banner_slide .banner_image{ width:100%; height:0; background:no-repeat center; background-size:cover; display:flex; flex-direction:column; justify-content:center; align-items:center; padding-top:39%;}
.banner_box .banner_slide .banner_image .content_box{ padding:0 75px;}
.banner_box .banner_slide .banner_image .content_box .t01{ color:#fff; font-size:50px; font-family: 'Noto Serif TC'; font-weight: 700; margin-bottom:30px;}
.banner_box .banner_slide .banner_image .content_box .t02{ color:#fff; font-size:16px; line-height:40px; max-width:420px;}
.banner_box .banner_slide .banner_image .content_box .more_btn{ line-height:40px; height:42px; font-size:18px; color:#fff; padding:0 30px; border:1px solid #fff; border-radius:21px; margin-top:40px; display:inline-block;}
.banner_box .banner_slide .banner_image_mobile{ display:none;}
.banner_box .slide_btn_left{ position:absolute; top:0; left:0; bottom:0; padding:30px; display:flex; flex-direction:column; justify-content:center; align-items:center; cursor:pointer;}
.banner_box .slide_btn_left .fa{ color:#fff; font-size:50px; opacity:.5; transition:.3s;}
.banner_box .slide_btn_right{ position:absolute; top:0; right:0; bottom:0; padding:30px; display:flex; flex-direction:column; justify-content:center; align-items:center; cursor:pointer;}
.banner_box .slide_btn_right .fa{ color:#fff; font-size:50px; opacity:.5; transition:.3s;}
.banner_box .slide_display{ position:absolute; bottom:0; left:0; right:0; text-align:center; font-size:0; padding:20px;}
.banner_box .slide_display p{ display:inline-block; width:45px; height:4px; background-color:#fff; margin:0 5px; opacity:.5; transition:.3s;}
.banner_box .slide_display p.focus{ opacity:1; transition:.3s;}
.banner_box .banner_slick .slick-slide{ height:auto; }

/*banner slick*/
.banner_slick.onloadRemove .slick-active .content_box .t01 { opacity: 0 !important; }
.banner_slick.onloadRemove .slick-active .content_box .t02 { opacity: 0 !important; }
.banner_slick.onloadRemove .slick-active .content_box .more_btn { opacity: 0 !important; }
.banner_slick.onloadRemove.onloadShow .slick-active .content_box .t01 { opacity: 1 !important; }
.banner_slick.onloadRemove.onloadShow .slick-active .content_box .t02 { opacity: 1 !important; }
.banner_slick.onloadRemove.onloadShow .slick-active .content_box .more_btn { opacity: 1 !important; }
.banner_box .banner_slide.banner_slick .banner_image .content_box .t01 { opacity: 0; transition: all 1s; transition-delay: .5s; }
.banner_box .banner_slide.banner_slick .banner_image .content_box .t02 { opacity: 0; transition: all 1s; transition-delay: .75s; }
.banner_box .banner_slide.banner_slick .banner_image .content_box .more_btn { opacity: 0; transition: all 1s; transition-delay: 1s; }
.banner_box .banner_slide.banner_slick .slick-active .banner_image .content_box .t01 { opacity: 1; }
.banner_box .banner_slide.banner_slick .slick-active .banner_image .content_box .t02 { opacity: 1; }
.banner_box .banner_slide.banner_slick .slick-active .banner_image .content_box .more_btn { opacity: 1; }

/*page_info*/
.page_info{ background-color:#f5f5f5; position:relative; z-index:10;}
.page_info .label{ padding:10px 0;}
.page_info .label .page_name{ line-height:20px; color:#777; font-size:14px; display:inline-block; vertical-align:text-bottom;}
.page_info .label a.page_name{ padding-right:25px; position:relative;}
.page_info .label a.page_name::before{ line-height:20px; top:0; right:10px; position:absolute;}
.page_info .label p.page_name{ color:#333; font-weight:300;}
.page_info .page_menu{ border-top:1px solid #ccc; padding:20px 0; z-index:2 !important;}
.page_info .page_menu .select_box_01{ display:inline-block; vertical-align:top; position:relative; margin-right:20px;}
.page_info .page_menu .select_box_01 .display_area{ width:210px; color:#fff; padding:0 40px 0 20px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; line-height:40px; height:40px; background:#6b8ba0; background:-moz-linear-gradient(left, #6b8ba0 0%, #356080 100%); background:-webkit-linear-gradient(left, #6b8ba0 0%,#356080 100%); background:linear-gradient(to right, #6b8ba0 0%,#356080 100%); cursor:pointer; position:relative;}
.page_info .page_menu .select_box_01 .display_area .fa{ line-height:40px; position:absolute; top:0; right:20px; color:#fff;}
.page_info .page_menu .select_box_01 .select_box{ display:none; width:210px; box-shadow:0 4px 8px 0 rgba(0,0,0,.2); border:1px solid #ccc; background-color:#fff; max-height:450px; overflow-x:auto; position:absolute; top:45px; left:0; z-index: 1;}
.page_info .page_menu .select_box_01 .select_box a{ display:block; line-height:30px; padding:5px 20px; color:#333; transition:.3s;}
.page_info .page_menu .select_box_02{ display:inline-block; vertical-align:top; position:relative; margin-right:20px;}
.page_info .page_menu .select_box_02 .display_area{ width:210px; color:#333; padding:0 20px; line-height:38px; height:40px; background:#f5f5f5; border:1px solid #333; cursor:pointer; position:relative;}
.page_info .page_menu .select_box_02 .display_area .fa{ line-height:40px; position:absolute; top:0; right:20px; color:#333;}
.page_info .page_menu .select_box_02 .select_box{ display:none; width:210px; box-shadow:0 4px 8px 0 rgba(0,0,0,.2); border:1px solid #ccc; background-color:#fff; position:absolute; top:45px; left:0; z-index: 1;}
.page_info .page_menu .select_box_02 .select_box a{ display:block; line-height:30px; padding:5px 20px; color:#333; transition:.3s;}
.page_info .page_menu .select_ap{ line-height:38px; height:40px; border:1px solid #ccc; padding:0 20px; color:#333; margin-right:6px; border:1px solid #ccc; display:inline-block; vertical-align:top;}
.page_info .page_menu .select_ap.focus{ border-color:#356080; color:#356080; font-weight:400;}

/*content*/
.wrapper .content_word{ margin:100px auto; position:relative;}
.wrapper .content_word h3{ font-size:35px; font-family:'Noto Serif TC'; font-weight:700; margin:0 0 20px 0;}
.wrapper .content_word h5{ font-size:25px; font-family:'Noto Serif TC'; font-weight:700; margin:20px 0; text-align:center;}
.wrapper .content_word h6{ font-size:18px; font-family:'Noto Serif TC'; font-weight:700; margin:10px 0; color:#073c84;}
.wrapper .content_word p{ margin:20px 0; line-height:1.8;}
.wrapper .content_word strong{ font-weight:500;}
.wrapper .content_word ul{ padding-left:30px;}
.wrapper .content_word ol{ padding-left:30px;}
.wrapper .content_word ul li{ list-style-type:none; padding:10px 0; position:relative;}
.wrapper .content_word ul li::before{ content:""; display:inline-block; width:8px; height:8px; border-radius:50%; border:6px solid #073c84; background-color:#fff; position:absolute; top:13px; left:-30px;}
.wrapper .content_word ul li p{ margin:10px 0 20px 0;}
.wrapper .content_word .data{ color:#777; margin:20px 0; line-height:1.8; font-size:14px;}
.wrapper .content_word .data span{ display:inline-block; line-height:20px; border:1px solid #073c84; color:#073c84; padding:0 3px; margin-right:5px; font-size:14px;}
.wrapper .content_word *{ font-weight:revert; font-size:inherit; color: revert; }
.wrapper .content_word a{ /*text-decoration: underline;*/ color:#0d3f87;}
.wrapper .content_word ul,.de_contbox .a01Content ol{ margin:0 0 0 25px; }
.wrapper .content_word img{ max-width:100%; }
.wrapper .btn{ color:#356080; font-size:14px; border:1px solid #356080; background-color:#fff; border-radius:13px; padding:0 15px; line-height:25px; height:27px; margin-right:5px; vertical-align:middle;}
.wrapper .btn{ text-overflow:ellipsis; overflow:hidden; white-space:nowrap; max-width:100%; display:inline-block;}
.wrapper .btn .fa{ color:#356080; margin-right:5px;}

/*重點區塊*/
.wrapper .content_report{ position:relative;}
.wrapper .content_report .word_box{ min-height:400px; margin-right:300px; background-color:#f5f5f5; padding:80px 200px 80px 80px;}
.wrapper .content_report .word_box p{ line-height:2.2; margin:10px 0;}
.wrapper .content_report .img_box{ width:420px; position:absolute; top:20px; right:40px; font-size:0;}
.wrapper .content_report .img_box img{ box-shadow:0 8px 16px 0 rgba(0,0,0,.2);}
.wrapper .card_display .content_mark{ margin:0 -10px 20px -10px;}
.wrapper .card_display .content_mark .mark_data{ width:25%; border:0; padding:0 10px 30px 10px; flex:none;}
.wrapper .card_display .content_mark .mark_data .card_con{ display:block; height:100%; background-color:#f5f5f5; overflow:hidden; text-decoration:none;}
.wrapper .card_display .content_mark .mark_data .card_con .image{ padding-bottom:100%; background:no-repeat center; background-size:cover; display:block; position:relative; transform:scale(1); transform-origin:bottom; transition:.3s;}
.wrapper .card_display .content_mark .mark_data .card_con .image .fa-search{ position:absolute; bottom:10px; right:10px; width:25px; height:25px; line-height:25px; border-radius:50%; display:block; background-color:#073c84; color:#fff; font-size:14px; text-align:center;}
.wrapper .card_display .content_mark .mark_data .card_con .word{ background-color:#f5f5f5; padding:20px 30px 30px 30px; text-align:left;}
.wrapper .card_display .content_mark .mark_data .card_con .word .t01{ font-size:17px; margin:0; letter-spacing:2px;}
.wrapper .card_display .content_mark .mark_data .card_con .word .t02{ font-size:14px; margin:0; font-weight:300; line-height:1.6; letter-spacing:0;}
.wrapper .card_display .content_mark .mark_data .card_con .word .t03{ font-size:16px; margin:0; font-weight:300; line-height:1.6; letter-spacing:0; color:#333; text-decoration:none;}
.wrapper .card_display .content_mark .mark_data .card_con .word .t04{ font-size:18px; margin:0; line-height:1.6; letter-spacing:0; font-family:'Noto Serif TC'; font-weight:700;}
.wrapper .card_display .content_mark .mark_data .card_con .word .t05{ font-size:12px; margin:0; font-weight:300; line-height:1.6; letter-spacing:0;}
.wrapper .content_mark.photo .mark_data{ width:33.3%;}
.wrapper .content_mark.contact_form .mark_data{ width:50%;}
/*附圖文案*/
.wrapper .content_mark{ display:flex; margin:50px auto; flex-wrap: wrap; justify-content: center;}
.wrapper .content_mark .mark_data{ font-size:14px; color:#333; text-align:center; border-left:1px solid #ccc; padding:35px 20px; flex: 1; }
.wrapper .content_mark .mark_data:first-child{ border:0;}
.wrapper .content_mark .mark_data img{ width:100%; max-width:270px; display:block; margin:auto; padding-bottom:3px;}
.wrapper .content_mark .mark_data p{ font-size:25px; font-weight:400; letter-spacing:5px;}
.wrapper .content_mark .mark_data .data_block{ padding-top:10px;}
.wrapper .content_mark .mark_data .data_block p{ font-size:16px; display:block; letter-spacing:0; margin:0;}
.wrapper .content_mark .mark_data .data_block p span{ margin:0 5px; display:inline-block; letter-spacing:3px; font-size:25px;}
.wrapper .content_mark.green_bg{ background-color:#ceec97;}
.wrapper .content_mark.green_bg .mark_data{ border:0;}
.wrapper .content_mark.green_bg .mark_data:last-child{ border-right:0;}
.wrapper .content_mark.green_bg .mark_data .word{ font-size:20px; font-weight:700;}
.wrapper .content_mark.green_bg .mark_data .word .data_block{ color:#009572;}
.wrapper .content_mark.yellow_bg{ background-color:#fff59a;}
.wrapper .content_mark.yellow_bg .mark_data{ border:0;}
.wrapper .content_mark.yellow_bg .mark_data:last-child{ border-right:0;}
.wrapper .content_mark.yellow_bg .mark_data .word{ font-size:20px; font-weight:700;}
.wrapper .content_mark.yellow_bg .mark_data .word .data_block{ color:#cd9907;}
.wrapper .content_mark.process .mark_data{ border:0; padding:35px 0; position:relative;}
.wrapper .content_mark.process .mark_data::after{ content:""; display:block; height:calc(100% - 110px); position:absolute; top:110px; border-top:2px dashed #ccc; left:0; right:0; z-index:-1;}
.wrapper .content_mark.process .mark_data:first-child::after{ left:50%;}
.wrapper .content_mark.process .mark_data:last-child::after{ border-radius:0 20px 20px 0; border-right:2px dashed #ccc; border-bottom:2px dashed #ccc;}
.wrapper .content_mark.process .mark_data:nth-last-child(2)::before{ content:""; display:block; height:100px; position:absolute; top:calc(100% + 2px); border-top:2px dashed #ccc; border-left:2px dashed #ccc; border-radius:20px 0 0 0; left:0; right:0; z-index:-1;}
.wrapper .content_mark.process .mark_data .icon{ width:150px; height:150px; border-radius:50%; background:#eee; display:flex; margin:auto; align-items:center;}
.wrapper .content_mark.process .mark_data .word{ padding:10px 20px 0 20px; line-height:1.8;}

.products_show .card_display .content_mark.half .mark_data{ width:50%;}

/*圖文對照*/
.wrapper .story_box{ display:flex; align-items:center; background-color:#f5f5f5; margin:0;}
.wrapper .story_box .story_con{ flex:1; overflow:hidden;}
.wrapper .story_box .story_con .effect_center{ width:100%; height:100%; padding:30px 80px; background:no-repeat center; background-size:cover; align-items:initial;}
.wrapper .story_box .story_con h5{ text-align:left;}
.wrapper .story_box .story_con p{ line-height:2.2; margin:10px 0 30px 0;}
.wrapper .story_box .story_con.photo{ font-size:0;}
.wrapper .story_box .story_con.photo img{ width:100%; transform:scale(1); transition:.3s;}
.wrapper .story_box .story_con.photo .effect_center{ transform:scale(1); transition:.3s;}

/*Products*/
.products_show{ margin:0 !important;}
.products_show .card_display .content_mark .mark_data{ width:33.3%;}
.products_show .card_display .content_mark .mark_data .card_con .word{ padding:20px 30px 60px 30px;}
.products_show .t01{ font-family:'Noto Serif TC'; font-weight:700 !important;}
.products_show .t05{ color:#333; margin:20px 0 !important;}
.process_box{ font-size:0; margin:0 -20px; padding-top:20px;}
.process_box .process_btn{ transition:all 0.2s; width:calc( 25% - 40px ); min-width: -moz-fit-content;; min-width: fit-content; display:inline-block; line-height:30px; border-radius:30px; padding:15px 30px; background-color:#f5f5f5; color:#333; font-size:20px; font-weight:400; margin:15px 20px; vertical-align:top;}
.process_box .process_btn span{ font-size:20px; color:#333; padding-right:10px; opacity:.3;}
.process_box .process_btn.focus,
.process_box .process_btn:hover{ color:#ffffff; background-color: #356080;}
.process_box .process_btn.focus span,
.process_box .process_btn:hover span{ color: #a8c0d2; opacity: 1;}
.products_con{ padding-top:30px;}
.products_con .products_data{ width:100%; border-collapse:collapse; margin-bottom:10px;}
.products_con .products_data tr{ border:1px solid #ccc;}
.products_con .products_data tr td{ padding:10px;}
.products_con .products_data .products_img{ text-align: center; }
.products_con .products_content{ position: relative; }
.products_con .products_content .products_title{ font-size: 25px; color: #333333; font-weight: bold; margin-top: 30px; margin-bottom: 5px; }
.products_con .products_content .products_text{ font-size: 16px; color: #333333; line-height: 35px; text-align: justify; }
.products_con .products_content .products_links { margin-top: 25px; }
.products_con .products_content .products_links .product_btn{ display: inline-block; font-size: 16px; color: #ffffff; padding: 15px 30px; border-radius: 5px; }
.products_con .products_content .products_links .red{ background-color: #f56666; }
.products_con .products_content .products_links .gray{ background-color: #777777; }

.prod_light_box{ position:fixed; width:100vw; height:100vh; background-color:rgba(0,0,0,.75); left:0; top:0; display:flex; align-items:flex-end; justify-content:center; z-index:99;}
.prod_light_box .products_con{ background-color:#fff; padding:50px 50px 100px 50px; width:100%; max-height:80%;}
.prod_light_box .products_con .products_right .products_content{ overflow-y:auto;}
.prod_light_box .products_links{ position: absolute; width: 100%; left: 50%; bottom:0; transform: translateX(-50%); text-align: center; padding:15px; background-color:#eee;}
.prod_light_box .products_links .product_btn{ display: inline-block; font-size: 16px; color: #ffffff; padding: 15px 30px; border-radius: 5px; }
.prod_light_box .products_links .product_btn{ display: inline-block; font-size: 16px; color: #ffffff; padding: 15px 30px; border-radius: 5px; }
.prod_light_box .products_links .red{ background-color: #f56666; }
.prod_light_box .products_links .gray{ background-color: #777777; }

.products_information{ border-top: 1px solid #ccc; padding-top: 30px; }

.products_con .right_word .list_type{ margin:6px 0; font-size: 16px; }

@media screen and ( min-width: 768px) {
    .products_con{ display: flex; }
    .products_con .products_left{ flex: 35; }
    .products_con .products_right{ flex: 65; }
    .products_con .products_content{ height: 100%; padding-bottom: 90px; padding-left: 45px; }
    .products_con .products_content .products_title{ margin-top: 0px; }
}


/*企業永續*/
.enterprise_exhibition{ position:relative;}
.enterprise_exhibition .title{ text-align:center; padding:100px 0;}
.enterprise_exhibition .title h5{ font-size:40px; font-family:'Noto Serif TC'; font-weight:700;}
.enterprise_exhibition .title p{ font-size:16px;}
.enterprise_exhibition .slide_box{ position:relative; overflow:hidden;}
.enterprise_exhibition .slide_box .event_block{ max-width:400px; padding:0 20px 200px 20px; margin:0 20px; position:relative; border-left:1px solid rgba(0,0,0,.3); display:inline-block;}
.enterprise_exhibition .slide_box .event_block::after{ content:""; display:block; width:10px; height:10px; border-radius:50%; border:5px solid #073c84; background-color:#fff; position:absolute; top:0px; left:-10px;}
.enterprise_exhibition .slide_box .event_block .data{ font-size:14px; color:#333; margin-top:-2px;}
.enterprise_exhibition .slide_box .event_block .data span{ font-size:14px; color:#073c84; padding-left:6px}
.enterprise_exhibition .slide_box .event_block .t01{ line-height:1.2; font-size:25px; color:#333; font-family:'Noto Serif TC'; font-weight:700; padding:5px 0 15px 0;}
.enterprise_exhibition .slide_box .event_block .t02{ line-height:1.8; font-size:14px; color:#333;}
.enterprise_exhibition .bg_box{ position:absolute; top:0; left:0; right:0; bottom:0; z-index:-1; overflow:hidden;}
.enterprise_exhibition .bg_box div{ font-size:0;}
.enterprise_exhibition .bg_box .rendering_left{ position:absolute; top:0; left:0; bottom:0;}
.enterprise_exhibition .bg_box .rendering_left img{ height:100%; animation:rendering_left 5s infinite alternate;}
.enterprise_exhibition .bg_box .rendering_right{ position:absolute; top:0; right:0; bottom:0;}
.enterprise_exhibition .bg_box .rendering_right img{ height:100%; animation:rendering_right 8s infinite alternate;}
.enterprise_exhibition .bg_box .strokes_left{ position:absolute; left:0; bottom:0;}
.enterprise_exhibition .bg_box .strokes_right{ position:absolute; right:0; bottom:50px;}
.enterprise_exhibition .bg_box .leaves_01{ position:absolute; top:0; left:0;}
.enterprise_exhibition .bg_box .leaves_02{ position:absolute; right:140px; bottom:0; animation:leaves_02 15s infinite alternate;}
.enterprise_exhibition .bg_box .leaves_03{ position:absolute; left:50%; bottom:0px; animation:leaves_03 7s infinite alternate;}
.enterprise_exhibition .bg_box .leaves_04{ position:absolute; left:0; bottom:0;}
.enterprise_exhibition .bg_box .leaves_05{ position:absolute; right:0; bottom:0;}
@keyframes rendering_left{0%{ height:100%;}100%{ height:102%;}}
@keyframes rendering_right{0%{ height:100%;}100%{ height:102%;}}
@keyframes leaves_02{0%{transform:translateY(0px) rotate(0deg);}100%{transform:translateY(-30px) rotate(20deg);}}
@keyframes leaves_03{0%{transform:translateY(0px) rotate(180deg);}100%{transform:translateY(30px) rotate(160deg);}}
.label_box{ overflow:hidden; padding-bottom:15px;}
.label_box .rendering_left{ display:inline-block; border:1px solid #ccc; border-radius:3px; padding:0 10px; line-height:38px; height:40px; font-size:16px; color:#333; margin-right:10px; transition:.3s;}
.label_box .label_link{ border:1px solid #ccc; line-height:38px; height:40px; padding:0 10px; display:inline-block; border-radius:3px; margin-right:10px;}
.label_box .label_link.focus{ background-color:#073c84; border-color:#073c84; color:#fff;}

/*news*/
.news_top{ min-height:400px; box-shadow:0 4px 10px 0 rgba(0,0,0,.1); display:flex; border:1px solid #eee; background-color:#fff; flex-wrap:wrap;}
.news_top .left_image{ width:400px; height:400px; background:no-repeat center #f5f5f5; background-size:cover;}
.news_top .right_word{ width: calc(100% - 400px); padding:50px; flex:auto;}
.news_top .right_word .effect_center{ align-items:flex-start; height:100%;}
.news_top .right_word h5{ margin:6px 0;}
.news_top .right_word .data{ margin:6px 0;}
.news_top .right_word p{ margin:6px 0;}
.news_top.move_up{ margin-top:-390px;}
.wrapper .waterfall{ margin-top:-70px;}
.wrapper .waterfall .content_mark{ display:block; font-size:0;}
.wrapper .waterfall .content_mark .mark_data{ display:inline-block; width:25%; vertical-align:top; margin-bottom:30px;}
.button_btn_box{ text-align:center;}
.button_btn_box .back_btn{ display:inline-block; padding:0 30px; line-height:50px; height:50px; border-radius:25px; color:#fff; background: #6b8ba0; background: -moz-linear-gradient(left, #6b8ba0 0%, #356080 100%); background: -webkit-linear-gradient(left, #6b8ba0 0%,#356080 100%); background: linear-gradient(to right, #6b8ba0 0%,#356080 100%); border:0; margin:0 10px; cursor:pointer;}
.button_btn_box .link_btn{ display:inline-block; padding:0 30px; line-height:50px; height:50px; border-radius:25px; color:#333; background:#f5f5f5; border:0; margin:0 10px; cursor:pointer;}
.button_btn_box .open_btn{ display:inline-block; padding:0 30px; line-height:50px; height:50px; border-radius:25px; color:#fff; background:#123377; border:0; margin:0 10px; cursor:pointer;}
.button_btn_box .open_btn .fa{ color:#fff;}
.line{ border-top:1px solid #ccc; margin:50px 0;}

/*investors*/
.finance_box{ padding:20px 30px;}
.finance_box .investors_year{ font-size:25px; font-weight:700; font-family:'Noto Serif TC'; border-bottom:1px solid #ccc; color:#073c84; text-align:left; padding-bottom:20px; margin-bottom:10px;}
.finance_box .investors_season{ text-align:left; padding:10px 0;}
.finance_box .investors_season .download{ margin-left:10px; line-height:25px; height:25px; padding:0 10px; color:#fff; border-radius:15px; background-color:#073c84; font-size:14px; display:inline-block;}
.finance_box .investors_season .download .fa{ color:#fff; font-size:12px; margin-right:5px;}
.chart_box{ border:1px solid #ccc; padding:25px 30px;}
.chart_box .chart_data{ padding-bottom:30px;}
.chart_box .chart_data h5{ font-size:16px; color:#333; margin:0; font-family:'Noto Sans TC'; font-weight:300;}
.chart_box .chart_data .year_point_01{ padding:0 12px; position:relative; color:#777; font-size:14px;}
.chart_box .chart_data .year_point_01::after{ content:""; width:6px; height:6px; border-radius:50%; background-color:#ef5f5f; display:inline-block; position:absolute; top:8px; left:0;}
.chart_box .chart_data .year_point_02{ padding:0 12px; position:relative; color:#777; font-size:14px}
.chart_box .chart_data .year_point_02::after{ content:""; width:6px; height:6px; border-radius:50%; background-color:#87a0b1; display:inline-block; position:absolute; top:8px; left:0;}
.finance_data{ border:1px solid #ccc; margin-top:10px;}
.finance_data table{ width:100%; border-collapse:collapse; background-color:#fff;}
.finance_data table tr th{ background-color:#123377; color:#fff !important; padding:10px 25px; line-height:30px; height:50px; text-align:left;}
.finance_data table tr th.most{ min-width:200px; white-space:normal;}
.finance_data table tr td{ color:#333; padding:10px 25px; line-height:30px; height:50px; border-top:1px solid #ccc; text-align:left; transition:.3s;}
.finance_data table tr td.most{ min-width:200px; white-space:normal;}
/*.finance_data table tr td.most[colspan]{ width:400px;}*/
.finance_data table tr:first-child td{ border:0;}
.finance_data table tr:nth-child(2n) td{ background-color:#f5f5f5;}
.finance_data table tr td a{ line-height:25px; height:25px; padding:0 10px; color:#fff; border-radius:15px; background-color:#073c84; font-size:14px; display:inline-block;}
.finance_data table tr td a .fa{ color:#fff; font-size:12px; margin-right:5px;}
.finance_data.td_blue table tr:nth-child(2n) td{ background-color:#c8dff5;}
.hidden_slide{ overflow-y:hidden;}
.finance_data.con_right table tr td{ text-align:right;}
.finance_data.con_right table tr th{ text-align:right;}
.wrapper .content_mark.slide_box{ position:relative; display:block;}
.wrapper .content_mark.slide_box .slide_block{ font-size:0;}
.wrapper .content_mark.slide_box .slide_block .mark_data{ width:25%; min-width:290px; display:inline-block; vertical-align:top;}
.wrapper .content_mark.slide_box .slide_block .mark_data .card_con{ min-height:390px;}
.wrapper .content_mark.slide_box .slide_left_btn{ width:30px; height:30px; border-radius:50%; display:inline-block; text-align:center; background-color:#000; position:absolute; top:50%; left:0; transform:translate(-5px,-50%); cursor:pointer; opacity:.5;}
.wrapper .content_mark.slide_box .slide_left_btn .fa{ line-height:30px; color:#fff; font-size:14px;}
.wrapper .content_mark.slide_box .slide_right_btn{ width:30px; height:30px; border-radius:50%; display:inline-block; text-align:center; background-color:#000; position:absolute; top:50%; right:0; transform:translate(5px,-50%); cursor:pointer; opacity:.5;}
.wrapper .content_mark.slide_box .slide_right_btn .fa{ line-height:30px; color:#fff; font-size:14px;}

/*content*/
.redpoint{ display:inline-block; width:5px; height:5px; border-radius:50%; background-color:#f13f3f; margin:0 5px; vertical-align:middle;}
.form_box{ border:1px solid #ccc; padding:20px 30px 50px 30px; display:flex; flex-wrap:wrap; margin-top:40px;}
.form_box .pubgrids{ width:50%; padding:0 20px; position:relative;}
.form_box .pubgrids .pg_title{ margin:30px 0 10px 0; font-size:14px;}
.form_box .pubgrids.address{}
.form_box .pubgrids.address .fillin_block{ border-bottom:1px solid #ccc; display:flex;}
.form_box .pubgrids.address input{ border:0;}
.form_box .pubgrids.address select{ border:0;}
.form_box .pubgrids.address .add01{ width:120px;}
.form_box .pubgrids.address .add02{ width:120px;}
.form_box .pubgrids.address .add03{ width:100px;}
.form_box .pubgrids.address .add04{ width:auto;}
.form_box .pubgrids.textarea{ width:100%;}
.form_box .pubgrids.verification_code .fillin_block{ display:flex; position:relative;}
.form_box .pubgrids.verification_code .fillin_block::after{ content:"點擊圖片更換一組驗證碼"; position:absolute; top:38px; right:0; color:#777; font-size:13px;}
.form_box .pubgrids.verification_code .fillin_block .code_image{ height:40px; border-bottom:1px solid #ccc;}
.form_box .pubgrids.verification_code .fillin_block .code_image img{ height:39px; cursor:pointer;}
.form_box .pubgrids .fillin_block textarea{ width:100%; height:150px; border:0; border-bottom:1px solid #ccc; line-height:30px; padding:5px 15px; resize:none;}
.form_box .pubgrids .fillin_block textarea:focus{ border-bottom-color:#6b8ba0; transition:.3s;}
.form_box .pubgrids.required::after{ content:""; display:block; width:5px; height:5px; border-radius:50%; background-color:#f13f3f; position:absolute; top:83px; left:20px;}
.form_box .btn_block .btn_enter{ height:40px; line-height:40px; border-radius:20px; color:#fff; margin-right:20px; background: #6b8ba0; background: -moz-linear-gradient(left, #6b8ba0 0%, #356080 100%); background: -webkit-linear-gradient(left, #6b8ba0 0%,#356080 100%); background: linear-gradient(to right, #6b8ba0 0%,#356080 100%); cursor:pointer; border:0; padding:0 30px;}
.form_box .btn_block{ width:100%; padding:60px 10px 0; text-align:left}
.situation_box{ padding:50px 0 150px; background-color:#264a62; background: -moz-linear-gradient(left, #6b8ba0 0%, #356080 100%); background: -webkit-linear-gradient(left, #6b8ba0 0%,#356080 100%); background: linear-gradient(to right, #6b8ba0 0%,#356080 100%); overflow:hidden; position:relative;}
.situation_box::after{ content:""; display:block; background-color:#24485f; background: -moz-linear-gradient(left, #24485f 0%, #456d8a 100%); background: -webkit-linear-gradient(left, #24485f 0%,#456d8a 100%); background: linear-gradient(to right, #24485f 0%,#456d8a 100%); position:absolute; top:0; left:-55%; right:55%; bottom:0; transform:skewX(-60deg);}
.situation_box .content_word{ margin:0 auto; position:relative; z-index:1;}
.situation_box h5{ color:#fff;}
.situation_box p{ color:#fff; font-weight:100;}
.situation_box .card_con{ min-height:200px; position:relative;}
.situation_box .t01{ color:#333;}
.situation_box .t02{ color:#333; font-size:16px;}
.situation_box .features{ position:absolute; left:30px; right:30px; bottom:30px;}
.situation_box .features .btn{ color:#356080; font-size:14px; border:1px solid #356080; border-radius:13px; padding:0 15px; line-height:25px; height:27px; margin-right:5px; vertical-align:top;}
.factory_box{ flex-wrap:wrap;}
.factory_block{ height:270px; display:flex; flex-wrap:wrap; padding:10px;}
.factory_block.wider{ width:100%; height:290px;}
.factory_block.half{ width:50%;}
.factory_block .card_con{ width:100%; height:250px; display:flex; flex-wrap:wrap; align-items:center; background-color:#f5f5f5;}
.factory_block.wider .card_con{ height:270px;}
.factory_block .card_con .image{ width:250px; height:250px; background:no-repeat center; background-size:cover;}
.factory_block.wider .card_con .image{ width:440px; height:270px;}
.factory_block .card_con .word{ padding:30px;}
.factory_block.wider .card_con .word{ padding:30px 70px; height:270px;}
.factory_block .card_con .word{ width:calc( 100% - 270px );}
.factory_block .card_con .word .t01{ font-size:25px; font-weight:700; color:#356080; margin:0 0 5px 0; font-family:'Noto Serif TC';}
.factory_block .card_con .word .t02{ font-size:16px; color:#333; margin:5px 0;}
.factory_block.wider .card_con .word{ width:calc( 100% - 440px );}
.factory_block.half .card_con .word .t01{ font-size:18px;}
.fa-map-marker{ color:#f13f3f; margin:0 5px;}
.factory_map{ width:100%; height:500px; border:0;}


.double_layer_box{ height:500px; position:relative; background:#ccc; display:flex; background:no-repeat center top; background-size:cover;}
.double_layer_box .oblk{ padding:20px; flex:1; display:block;}
.double_layer_box .oblk .lv01_block{ height:100px; background-color:rgba(255,255,255,.7); padding:20px; display:flex; justify-content:center; align-items:center; cursor:pointer; border-radius:5px; transition:.3s;}
.double_layer_box .oblk input{ width:0; height:0; opacity:0; position:absolute;}
.double_layer_box .oblk .lv02_block{ position:absolute; top:140px; left:20px; right:20px; bottom:20px; background-color:#fff; padding:20px; overflow-y:auto; border-radius:10px; transform:scale(0); transition:.3s;}
.double_layer_box .oblk .lv02_block ul{ display:flex; flex-wrap:wrap;}
.double_layer_box .oblk .lv02_block ul li{ width:50%;}
.double_layer_box .oblk:nth-child(6n-4) .lv02_block ul li::before{ border-color:#629460;}
.double_layer_box .oblk:nth-child(6n-3) .lv02_block ul li::before{ border-color:#dd6031;}
.double_layer_box .oblk:nth-child(6n-2) .lv02_block ul li::before{ border-color:#81a4cd;}
.double_layer_box .oblk:nth-child(6n-1) .lv02_block ul li::before{ border-color:#224870;}
.double_layer_box .oblk:nth-child(6n-0) .lv02_block ul li::before{ border-color:#007ea7;}
.double_layer_box .oblk input:checked + .lv02_block{ transform:scale(1); transition:.3s;}
.double_layer_box .oblk input:checked ~ .lv01_block{ background-color:#073c84; color:#fff; transition:.3s;}
.double_layer_box .oblk:nth-child(6n-4) input:checked ~ .lv01_block{ background-color:#629460; color:#fff; transition:.3s;}
.double_layer_box .oblk:nth-child(6n-3) input:checked ~ .lv01_block{ background-color:#dd6031; color:#fff; transition:.3s;}
.double_layer_box .oblk:nth-child(6n-2) input:checked ~ .lv01_block{ background-color:#81a4cd; color:#fff; transition:.3s;}
.double_layer_box .oblk:nth-child(6n-1) input:checked ~ .lv01_block{ background-color:#224870; color:#fff; transition:.3s;}
.double_layer_box .oblk:nth-child(6n-0) input:checked ~ .lv01_block{ background-color:#007ea7; color:#fff; transition:.3s;}

.dataonimage{ background:no-repeat center; background-size:cover; position:relative; display:flex;}
.dataonimage .nonebk{ flex:1;}
.dataonimage .dataon{ flex:1; padding:50px 50px 50px 0;}
.dataonimage .dataon .odt{ background-color:rgba(215,215,215,.8); margin-bottom:5px;}
.dataonimage .dataon .odt .t01{ font-size:20px; padding:5px 20px; background-color:#0191b4; color:#fff; margin:0;}
.dataonimage .dataon .odt .t02{ font-size:16px; padding:10px 20px; margin:0;}

.video_box{ position:relative;}
.video_box .bg{ height:300px;}
.video_box .con{ position:relative; margin-top:-250px; display:flex; padding:0 30px; align-items:center;}
.video_box .con .video{ flex:1.25; position:relative; padding-bottom:34%;}
.video_box .con .video iframe{ width:100%; position:absolute; top:0; left:0; right:0; bottom:0; height:100%;}
.video_box .con .video img{ width:100%; position:absolute; top:0; left:0; right:0; bottom:0; height:100%;}
.video_box .con .word{ flex:0.75; padding-left:30px;}
.video_box .con .word .t01{ font-size:24px; font-weight:700;}
.video_box .con .word .t02{ font-size:16px; line-height:2;}

/*smart*/
.bn_btn{ padding-bottom:30px;}
.bn_btn a{ display:inline-block; line-height:50px; padding:0 20px; font-size:18px; background-color:#fff; color:#777; margin-right:10px; border-radius:5px; border:1px solid #ccc;}
.bn_btn a.focus{ background-color:#1f2b5e; color:#fff; border:1px solid #1f2b5e;}
.smart_box{ padding-bottom:50px;}
.smart_box .remind{ text-align:center; padding-bottom:20px; display:none;}
.smart_box .remind p{ display:inline-block; margin:auto; background-color:#777; text-align:center; color:#fff; line-height:30px;}
.smart_box .remind p .fa{ color:#fff; font-size:14px; padding:0 20px; line-height:30px;}
.smart_box .finance_data{ border:0;}
.smart_box .finance_data table tr td{ background-color:#fff; border:0;}
.smart_box .smart_table{ flex-direction:column;}
.smart_box .smart_table .label_box{ padding:0; transition:.3s;}
.smart_box .smart_table .label_box td{ font-size:14px; color:#333; text-align:center; flex:1; padding:20px 10px; margin:0; border-left:1px solid #eee; line-height:20px;}
.smart_box .smart_table .label_box td.title{ text-align:right; color:#aaa; font-size:14px; border:0; position:sticky; left:0;}
.smart_box .smart_table .label_box td.title::after{ content:""; border-right:1px solid #eee; position:absolute; right:0; top:0; height:100%;}
.smart_box .smart_table .label_box img{ width:100%;}
.onedms{ border-top:1px solid #ccc; padding:10px 0;}
.onedms .dms_title{ font-size:18px; margin:0 0 10px 0; background-color:#59ade1; color:#fff; padding:0 10px;}
.onedms .flex{ display:flex; align-items:flex-end;}
.onedms .flex .photo{ flex:2;}
.onedms .flex .icon{ flex:1; text-align:center;}
.onedms .flex .icon img{ display:block; margin:auto;}
.onedms .flex .icon p{ margin:0; height:60px; padding-top:10px; line-height:1.6;}

/*AI*/
.schedule .single_day{ border:1px solid #ccc; margin-bottom:10px;}
.schedule .single_day p{ margin:0;}
.schedule .single_day .top_info{ padding:10px 20px; display:flex; justify-content:space-between; align-items:center;}
.schedule .single_day .title{ font-size:24px; font-weight:700; font-family:'Noto Serif TC'; position:relative; padding-left:65px;}
.schedule .single_day .title img{ height:40px; position:absolute; top:0; left:0;}
.schedule .single_day .time{ font-size:16px; color:#333;}
.schedule .single_day .con{ background-color:#f5f5f5; padding:10px 20px 5px 20px;}
.schedule .single_day .ps{ font-size:14px; color:#777; background-color:#f5f5f5; padding:5px 20px 10px 20px;}
.download_block{ display:flex; flex-wrap:wrap;}
.download_block .btn{ width:180px; display:inline-block; padding:30px 20px 20px 20px; line-height:1.6; color:#333; background:#f5f5f5; border:0; margin:0 5px 10px 5px; cursor:pointer; height:auto; white-space:normal; text-align:center; font-size:16px;}
.download_block .btn .fa{ display:block; text-align:center; font-size:25px; margin-bottom:10px;}
.download_block .btn .fa.fa-file-word-o{ color:#2c75e3;}
.download_block .btn .fa.fa-file-pdf-o{ color:#ed3a3a;}
.download_block .btn .fa.fa-file-excel-o{ color:#2da953;}
.download_block .btn .fa.fa-file-image-o{ color:#9daeb9;}
.download_block .btn .fa.fa-file-powerpoint-o{ color:#ed3a3a;}

/*404*/
.page404{ padding:0;}
.page404 .story_box{ min-height:100vh;}
.page404 .story_box h1{ font-size:100px; font-family:'Noto Serif TC'; font-weight:700 !important;}
.page404 .story_box .logo{ width:150px; display:block;}
.page404 .story_box .btn_block{ text-align:left; padding-top:50px;}
.page404 .story_box .btn_block .back_btn{ margin:0 10px 0 0;}
.page404 .story_box .btn_block .link_btn{ margin:0 10px 0 0; border:1px solid #ccc; line-height:48px;}
.page404 .story_box .story_con{ min-height:100vh;}
.page404 .story_box .story_con .effect_center{ min-height:100vh;}

/*full*/
.wrapper .story_box.full_block .computer{ display:block;}
.wrapper .story_box.full_block .mobile{ display:none;}

/*---------hover---------*/
@media screen and ( min-width: 1201px) {
.page_info .page_menu .select_box_01 .select_box a:hover{ background-color:#e4eef5; transition:.3s;}
.page_info .page_menu .select_box_02 .select_box a:hover{ background-color:#e4eef5; transition:.3s;}

/*重點區塊*/
.wrapper .card_display .content_mark .mark_data:hover .card_con .image{ transform:scale(1.1); transform-origin:bottom; transition:1s;}

/*企業永續*/
.label_box .label_link:hover{ border-color:#073c84; color:#073c84; transition:.3s;}
.label_box .label_link.focus:hover{ color:#fff;}

/*圖文對照*/
.wrapper .story_box .story_con.photo img:hover{ transform:scale(1.1); transition:.3s;}
.wrapper .story_box .story_con.photo .effect_center:hover{ transform:scale(1.1); transition:.3s;}

/*investors*/
.finance_data table tr:hover td{ color:#000; font-weight:400; background-color:rgba(0,0,0,.05); transition:.3s;}

.double_layer_box .oblk .lv01_block:hover{ background-color:rgba(255,255,255,1); transition:.3s;}

.smart_box .finance_data table tr:hover td{ background-color:rgba(31,43,94,.03); color:#000; font-weight:300; transition:.3s;}
.smart_box .finance_data table tr.nohover:hover td{ background:none;}

.finance_data.con_average table{ table-layout:fixed;}
}


/*---------pad---------*/
@media screen and ( max-width: 1200px) and ( min-width: 768px) {
/*重點區塊*/
.wrapper .content_mark{}
.wrapper .card_display .content_mark .mark_data .card_con .word{ padding:15px;}
.wrapper .content_word .data{ margin:10px 0;}

/*content*/
.wrapper .content_word{ margin:100px auto;}

/*重點區塊*/
.wrapper .card_display .content_mark .mark_data{ padding:0 5px 10px 5px;}

/*附圖文案*/
.wrapper .content_report .word_box{ margin-right:60px; padding:40px 180px 40px 40px;}
.wrapper .content_report .img_box{ width:210px; top:40px; right:20px;}

/*圖文對照*/
.wrapper .story_box{ min-height:450px; margin:0;}
.wrapper .story_box .story_con .effect_center{ padding:50px;}

/*products*/
.process_box .process_btn{ width: calc(50% - 40px); }

/*contact*/
.form_box .pubgrids.address{ width:100%;}
.situation_box .content_word{ margin:0 auto;}
.factory_block.half{ width:100%;}
.factory_block.wider .card_con .word{ padding:30px;}

/*news*/
.news_top{ justify-content: center;}

/*investors*/
.finance_data table tr th{ white-space:nowrap;}
.finance_data table tr td{ white-space:nowrap;}

/*AI*/
.download_block .btn{ width:23%; margin:0 1% 2% 1%;}

/*404*/
.page404 .story_box{ margin:0; min-height:100vh;}
}


/*---------mobile---------*/
@media screen and ( max-width: 767px) {
/*banner
.banner_box{ height:250px; background-position:center; background-color:rgba(0,0,0,.3); background-blend-mode:multiply; background-attachment:inherit; background-size:cover;}
.banner_box h1{ font-size:35px;}
.banner_box p{ font-size:14px; line-height:25px;}
*/
/*banner*/
.banner_box .banner_slide .banner_image{ display:none;}
.banner_box .banner_slide .banner_image_mobile{ display:block; width:100%; height:0; background:no-repeat center; background-size:cover; display:flex; flex-direction:column; justify-content:center; align-items:center; padding-top:144%;}
.banner_box .banner_slide .banner_image_mobile .content_box{ padding:0 30px;}
.banner_box .banner_slide .banner_image_mobile .content_box .t01{ font-size:35px; margin-bottom:15px;}
.banner_box .banner_slide .banner_image_mobile .content_box .t02{ line-height:35px;}
.banner_box .banner_slide .banner_image_mobile .content_box .more_btn{ margin-top:20px;}
.banner_box .slide_btn_right{ display:none;}
.banner_box .slide_btn_left{ display:none;}

/*page_info*/
.page_info .label{ padding:5px 0;}
.page_info .page_menu{ padding:10px 0;}
.page_info .page_menu .select_box_01{ width:100%; margin:0 0 10px 0;}
.page_info .page_menu .select_box_01 .display_area{ width:100%; display:block;}
.page_info .page_menu .select_box_01 .select_box{ width:100%;}
.page_info .page_menu .select_box_02{ width:100%; margin:0 0 10px 0;}
.page_info .page_menu .select_box_02 .display_area{ width:100%; display:block;}
.page_info .page_menu .select_box_02 .select_box{ width:100%;}
.page_info .page_menu .select_ap{ height:30px; line-height:28px; padding:0 10px; margin-right:3px; font-size:14px;}

/*content*/
.wrapper .content_word{ margin:50px auto;}

/*重點區塊*/
.wrapper .content_mark{ justify-content:flex-start; margin:0;}
.wrapper .content_mark .mark_data{ width:50%; flex:none; border:0; padding:0 5px 20px 5px; position:relative; text-align:left;}
.wrapper .content_mark .mark_data .icon{ vertical-align:top;}
.wrapper .content_mark .mark_data .icon img{ max-width:100%; height:auto;}
.wrapper .content_mark .mark_data .word{}
.wrapper .content_mark .mark_data .word p{ margin:0; font-size:20px; line-height:1.4; letter-spacing:0;}

/*附圖文案*/
.wrapper .content_report{ display:flex; flex-direction:column;}
.wrapper .content_report .word_box{ margin:-150px 0 0 0; padding:50% 20px 20px 20px; order:2;}
.wrapper .content_report .img_box{ max-width:100%; position:relative; margin:auto; right:auto; padding:0 5%; order:1;}
.wrapper .content_mark.green_bg{ border:0 !important; background:none;}
.wrapper .content_mark.green_bg .mark_data{ background-color:#ceec97; margin-bottom:10px; border:0; padding:10px 0;}
.wrapper .card_display .content_mark .mark_data{ margin-bottom:10px;}
.wrapper .content_mark.process .mark_data::after{ border-top:0; border-left: 2px dashed #ccc; left:80px; top:0; bottom:0; height:100%;}
.wrapper .content_mark.process .mark_data:first-child::after{ left:80px; top:50%; height:50%;}
.wrapper .content_mark.process .mark_data:nth-last-child(2)::before{ display:none;}
.wrapper .content_mark.process .mark_data:last-child::after{ border-right:0; border-radius:0 0 0 20px; right:50%;}
.wrapper .content_mark.process .mark_data:last-child::before{ content:""; display:block; height:100px; position:absolute; top:100%; border-top:2px dashed #ccc; border-right:2px dashed #ccc; border-radius:0 20px 0 0; left:50%; right:40%; z-index:-1;}

.products_show .card_display .content_mark.half .mark_data{ width:100%;}
.products_show .card_display .content_mark.half .mark_data .card_con{ height:auto;}

/*圖文對照*/
.wrapper .story_box{ min-height:auto; margin:0; flex-wrap:wrap; flex-direction:column;}
.wrapper .story_box .story_con{ width:100%;}
.wrapper .story_box .story_con .effect_center{ padding:40px; min-height:100vw;}
.wrapper .story_box .story_con.photo{ order:1;}
.wrapper .story_box .story_con.video_style{ width:100%; padding-top:56.2%; position:relative;}
.wrapper .story_box .story_con.video_style iframe{ position:absolute; top:0; left:0; right:0; bottom:0; height:100%;}

/*enterprise*/
.enterprise_exhibition .title{ padding:70px 0 0 0;}

/*news*/
.news_top{ display:block;}
.news_top .left_image{ width:100%; height:auto; padding-top:100%;}
.news_top .right_word{ width:100%; padding:30px;}
.news_top.move_up{ margin-top:-270px;}
.wrapper .card_display .content_mark .mark_data{ width:100%; display:block;}

/*企業永續*/
.label_box .label_link{ border:1px solid #ccc; line-height:28px; height:30px;}

/*investors*/
.wrapper .content_mark.slide_box .slide_block .mark_data{ width:100%; display:block;}
.finance_data table tr th{ padding:0 15px;}
.finance_data table tr td{ padding:0 15px;}
.finance_data.mobile_list table{ display:block; width:100%;}
.finance_data.mobile_list tbody{ display:block; width:100%;}
.finance_data.mobile_list tr{ display:block; width:100%;}
.finance_data.mobile_list th{ display:block; width:100%; height:auto;}
.finance_data.mobile_list td{ display:block; width:100%; height:auto;}
.chart_box{ padding:10px;}

/*products*/
.process_box .process_btn{ width: calc(100% - 40px); }
.products_con .products_data{ width: 100%; }
.wrapper .content_word.products_information{ margin-top: 65px; }
.prod_light_box .products_con{ padding:0px 20px 100px 20px; overflow-y:auto; border-top:20px solid #fff; overflow-y: auto;}
.prod_light_box .products_links{ position:fixed;}

/*contact*/
.form_box{ padding:20px 15px;}
.form_box .pubgrids{ width:100%; padding:0;}
.form_box .pubgrids.address .fillin_block{ flex-wrap:wrap;}
.form_box .pubgrids.address .add01{ width:38%;}
.form_box .pubgrids.address .add02{ width:38%;}
.form_box .pubgrids.address .add03{ width:24%;}
.form_box .pubgrids.address .add04{ width:100%;}
.form_box .pubgrids.required::after{ left:0;}
.form_box .btn_block{ padding:60px 0 0 0;}
.button_btn_box .back_btn{ width:100%; text-align:center; margin:0 0 10px 0;}
.button_btn_box .link_btn{ width:100%; text-align:center; margin:0 0 10px 0;}
.situation_box .content_word{ margin:0 auto;}
.situation_box::after{transform: skewX(-20deg);}
.factory_block.half{ width:100%; display:block; height:auto;}
.factory_block .card_con{ display:block; height:auto;}
.factory_block .card_con .image{ width:100%;}
.factory_block .card_con .word{ width:100%; padding:20px;}
.factory_block.wider{ height:auto;}
.factory_block.wider .card_con{ height:auto;}
.factory_block.wider .card_con .word{ width:100%; height:auto; padding:20px;}
.factory_block.wider .card_con .image{ width:100%;}

/*investors*/
.finance_data table tr th{ white-space:nowrap;}
.finance_data table tr td{ white-space:nowrap;}

.double_layer_box{ display:block; height:auto;}
.double_layer_box .oblk .lv02_block{ position:static; transform:scale(1);}
.double_layer_box .oblk .lv02_block ul li{ width:100%;}
.double_layer_box .oblk .lv01_block{ background-color:#073c84; color:#fff;}
.double_layer_box .oblk:nth-child(6n-4) .lv01_block{ background-color:#629460; color:#fff;}
.double_layer_box .oblk:nth-child(6n-3) .lv01_block{ background-color:#dd6031; color:#fff;}
.double_layer_box .oblk:nth-child(6n-2) .lv01_block{ background-color:#81a4cd; color:#fff;}
.double_layer_box .oblk:nth-child(6n-1) .lv01_block{ background-color:#007ea7; color:#fff;}
.double_layer_box .oblk:nth-child(6n-0) .lv01_block{ background-color:#224870; color:#fff;}

.dataonimage{ display:block;}
.dataonimage .dataon{ padding:20px 0;}

.video_box .con{ display:block;}
.video_box .con .video{ padding-bottom:56%;}
.video_box .con .word{ padding-left:0;}

/*smart*/
.smart_box .remind{ display:block;}
.smart_box .smart_table .label_box td{ padding:10px;}
.onedms{ padding:10px 0;}
.onedms .flex{ flex-wrap:wrap;}
.onedms .flex .photo{ flex:auto; width:100%; text-align:center; padding-bottom:10px;}
.onedms .flex .photo img{ max-width:128px;}
.onedms .flex .icon img{ max-width:42px;}
.onedms .flex .icon p{ font-size:14px;}

/*AI*/
.schedule .single_day .top_info{ display:block; padding:10px;}
.schedule .single_day .title{ font-size:20px;}
.schedule .single_day .title img{ height:50px; top:7px; left:-10px;}
.schedule .single_day .time{ padding-left:65px;}
.download_block .btn{ width:48%; margin:0 1% 2% 1%;}

/*404*/
.page404 .story_box{ margin:0; min-height:100vh; display:block;}
.page404 .story_box h1{ text-align:center;}
.page404 .story_box h5{ margin:0;}
.wrapper .story_box .story_con p{ font-size:14px;}
.page404 .story_box .story_con{ flex:none; min-height:50vh;}
.page404 .story_box .btn_block .back_btn{ margin-bottom:20px;}
.page404 .story_box .story_con .effect_center.word{}
.page404 .story_box .story_con .effect_center.image{ height:50vh;}

/*full*/
.wrapper .story_box.full_block .computer{ display:none;}
.wrapper .story_box.full_block .mobile{ display:block;}
}

/*banner_revise*/
@media screen and ( max-width: 767px) {
.banner_box{ position:relative;}
.banner_box h1{ font-size:25px;}
.banner_box p{ display:none;}
}