body {	-webkit-text-size-adjust:100%; margin:0; font-family:'Noto Sans TC','Arial', sans-serif;word-wrap: break-word;word-break: break-all;line-height: 180%;font-size: 16px;color:#4c4c4c;}
img {	border:0; }

/* Reset ================================================================================= */

a { text-decoration:none; 
-webkit-transition: all 0.4s ease-out 0s;
-moz-transition: all 0.4s ease-out 0s;
transition: all 0.4s ease-out 0s; }
a:hover { text-decoration:none; }

* { margin:0; padding:0; list-style:none;
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */}
.content-box { max-width:1240px; margin:0 auto; text-align:left; position:relative; clear:both;}
.idx-banner{margin: 0 auto;padding: 0;}
.owl-carousel.banner-for-pc{max-width: 1920px;margin: 0 auto;overflow: hidden;}
.owl-carousel.banner-for-pc .owl-stage{display: flex;align-items: center;}
.owl-dots,.owl-nav.disabled{display: none;}
.owl-carousel.banner-for-pc div{}
.owl-carousel.banner-for-pc  img{width: auto;display: block;}
.banner-for-rwd{display: none;margin: 0 auto;overflow: hidden;}
.owl-carousel.banner-for-rwd .owl-stage{display: flex;align-items: center;}
.owl-carousel.banner-for-rwd  img{width: auto;display: block;}
.idx-banner-icon{position: relative;margin-bottom:80px;}
.idx-banner-icon .idx-icon-frame{position: absolute;display:flex;top: -50px;width: 100%;}
.idx-banner-icon ul {background: #0f4080; width: 58%;display: flex;align-items: center;padding:1vh 2vw 1vh 24vw;}
.idx-banner-icon ul li{display: flex;align-items: center;width: calc(100% / 3);}
.idx-banner-icon ul li span{color:#fff;font-size: 20px;margin-left: 25px;}
.idx-banner-icon .idx-icon-part{margin: 0 10px;overflow: hidden;display: flex;align-items: center;}
.idx-banner-icon .idx-icon-part::before{content:"";display:block;width:15px;height: 100%;background:#0f4080;padding: 2vh 0;margin-right: 10px; }
.idx-banner-icon .idx-icon-part::after{content:"";display:block;width:15px;height: 100%;background:#0f4080;padding: 2vh 0; }
.idx-about{padding: 3vh 0;position: relative;}
.idx-about-content{display: flex;background: #eaf3f8;max-width: 1920px;justify-content: center;min-height: 450px;}
.idx-about-img{width: 50%;background: url(../images/idx-about.jpg) no-repeat;background-size: cover;}
.idx-about-text {padding: 15px 30px 35px 30px;width: 50%;position: relative;}
.idx-about h1 {font-size: 35px;color: #0f4080;font-weight: 600;margin: 30px 0;padding: 5px 0;}
.idx-about-text ul{line-height: 200%;margin-bottom: 30px;}
.idx-about-text ul li{padding-bottom: 5px;margin: 10px 0;display: flex;align-items: center;}
.idx-about-text ul li::before{content: "\f105";font-family: 'Font Awesome 5 Free';font-weight: 900;font-size: 25px;color: #0f4080;margin-right: 15px;}
.idx-year {font-size: 22px;font-weight: 600;margin-right: 5px;}
.idx-about-text ul li span:last-child{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;max-width: 450px;}
.idx-btn{text-align: center;margin-right: 15px;right: 36%;position: absolute;bottom:0;}
.idx-btn a{color:#fff;width: 120px;background: #0f4080;padding: 5px 30px;min-height: 30px;overflow: hidden;position: relative;box-sizing: border-box;display: inline-block;z-index: 5;}
.idx-btn a::after{content:"";background:#2179eb;position: absolute;top:0;left:0;right: 0;bottom: 0;transform: translateX(-100%);z-index: 4;}
.idx-btn a:hover::after{transform: translateX(100%);transition: all .5s ease;overflow: hidden;visibility: hidden;}
.idx-btn a span{position: relative;z-index: 9;}
.idx-products {padding:5vh 0 20vh 0;}
.idx-products h2{font-size: 35px;color: #0f4080;font-weight: 600;margin: 5px 0;padding: 5px 0;text-align: center;display: flex;align-items: center;flex-direction: column;justify-content: center;}
.idx-products h2::after{content: "";width:80px;height: 3px;background:#fcbb20;margin: 15px 0;display: block;}
.idx-products ul{display: flex;align-items: center;}
.idx-products ul li{position: relative;margin: 0 5px;}
.idx-products ul li h3{text-align: center;position: absolute;top: 45%;right: 0;left: 0;font-size: 25px;color: #fff;letter-spacing: 1.8px;text-shadow: 1px 1px 8px rgba(0, 0, 0, 0.9);}
.idx-products ul li figure{position: relative;display: flex;flex-direction: column;align-items: center;justify-content: center;overflow: hidden;}
.idx-products ul li:hover figure {box-shadow: inset 1px 1px 20px 11px #000;}
.idx-products ul li:hover figure img{transform: scale(1.1,1.1);transition: all .2s ease;}
.idx-products ul li:hover figure h3 {text-shadow: unset;}
.idx-video{background: url(../images/idx-video-bg.jpg) no-repeat;background-size: cover;display: block;max-height: 416px;overflow: hidden;background-position: center 80%; background-attachment: fixed;position: relative;}
.idx-video::before{content: "";background:rgba(26, 64, 113, 0.78);display: block;width:100%;height: 100%;min-height: 416px;position: absolute;z-index: 0;}
.idx-video .content-box{padding: 5vh 0;height: 416px;display: block;}
.idx-video h2{font-size: 35px;color: #fff;font-weight: 600;margin: 30px 0;padding: 5px 0;text-align: center;display: flex;align-items: center;flex-direction: column;justify-content: center;}
.idx-video h2::after{content: "";width:80px;height: 3px;background:#fcbb20;margin: 15px 0;display: block;}
.video-text {text-align: center;color:#fff;}
.video-text a i{font-size: 70px;color:#fff;}
.video-text a h4{font-size: 25px;font-weight: normal;color:#fff;margin: 10px 0;}
.video-text a:hover i{transform: translateY(-5%);transition: all .3s ease-in;}
.idx-infor-all{padding: 4vh 15vw;}
.idx-infor-all .content-box {display: flex;}
.idx-infor{display: inline-block;margin: 0px 10px;padding: 2vh 0;position: relative;}
.idx-infor a{background: #000;display: block;}
.idx-infor figure{position: relative;display: flex;flex-direction: column;align-items: center;justify-content: center;overflow: hidden;background: #000;}
.idx-infor figure img{opacity: .5;}
.idx-infor figcaption{position: absolute;top:40%;left: 0;right: 0;}
.idx-infor-all h2{font-size: 25px;color:#fff;font-weight: 500;margin: 10px 0;padding:5px 0;display: flex;align-items: center;justify-content: center;letter-spacing: 2.5px;}
.idx-infor a::before{content: "";border: .5px solid #fff;display: block;width: 70%;max-height: 200px;margin: 0 auto;z-index: 99;position: absolute;
height: 90%;left: 0;right: 0;top: 25%;}
.idx-infor figure figcaption h3{text-align: center;position: absolute;top: 50%;left: 0;right: 0;color:#fff;font-weight:500;font-size: 20px;letter-spacing: 3px;z-index: 9999;text-shadow: 1px 1px 14px rgba(0, 0, 0, 0.8196078431372549);}
.idx-infor figure::before{content: "";display: block;width:100%;height: 100%;right: 100%;background: rgb(15, 64, 128);transition: all .3s ease;position: absolute;}
.idx-infor:hover figure::before{right:0;}

/*動畫*/
.fadeInLeft {transition:transform 1s ease,opacity 1s ease;transform: translate(0, 0);opacity:1;}
.fadeOutLeft {transition:transform 1s ease,opacity 1s ease;transform: translate(-10px, 0);opacity: 1;}
.fadeInUp {transition: transform 1s ease, opacity 1s ease; transform: translate(0, 0); opacity: 1.0; }
.fadeOutUp {transition: transform 1s ease, opacity 1s ease; transform: translate(0, 10px); opacity: 0; }
.fadeIndown{transition: transform 1s ease, opacity 1s ease; transform: translate(0, 0); opacity: 1.0;}
.fadeOutdown{transition: transform 1s ease, opacity 1s ease; transform: translate(0, -10px); opacity: 0;}
.scaleIn{transition: transform 1s ease, opacity 1s ease; transform:scale3d(1,1,1); opacity:1;}
.scaleOut{transition: transform 1s ease, opacity 1s ease; transform:scale3d(0,0,0); opacity:0;}

@media only screen and (max-width: 1366px) {
.idx-banner-icon ul{padding: 1vh 2vw 1vh 15vw;}
.idx-btn{right: 5%;bottom: 5%;}
.idx-infor-all .content-box{justify-content: center;}
.idx-infor{width: 45%;}
.idx-infor a::before{width: 80%;max-height: 185px;top: 17%;}
}
@media only screen and (max-width: 1240px) {
.idx-banner-icon ul {padding: 1vh 2vw 1vh 10vw;}
.idx-infor a::before{height: 62%;}
.idx-about-text ul li{flex-wrap: wrap;}
}
@media only screen and (max-width: 980px) {
.banner-for-pc{display: none;}
.owl-carousel.banner-for-rwd{display: block;}
.idx-about{flex-direction: column-reverse;    background-attachment: unset;}
.idx-about .content-box{width: 100%;}
.idx-infor-all .content-box{text-align: center;}
.idx-infor{width: 100%;}
.idx-infor a::before{width: 78%; max-height: 265px;}
.idx-banner-icon ul {padding: 1vh 2vw 1vh 5vw;}
.idx-banner-icon ul li span{margin-left: 20px;}
.idx-btn{bottom:0;}

}
@media only screen and (max-width: 840px) {
.idx-banner-icon ul {padding: 1vh 1vw;}
.idx-products ul{flex-direction: column;}
.idx-products ul li{margin: 15px auto;}
.idx-about-content{flex-direction: column;}
.idx-about-img,.idx-about-text{min-height: 450px;width: 100%;}
.idx-infor-all .content-box{flex-direction: column;}

}
@media only screen and (max-width: 768px) {
.idx-infor a::before {width: 90%;}
.idx-icon-img img{width: 70%;}
.idx-banner-icon ul li span {margin-left: 5px;}
.idx-banner-icon ul {padding: 1vh 2vw;}
}
@media only screen and (max-width: 640px) {}
@media only screen and (max-width: 570px) {
.idx-banner-icon ul{width: 75%;}
.idx-icon-img{text-align: center;}
.idx-icon-img img{width: 60%;}
.idx-banner-icon ul li span{font-size: 18px;}
.idx-about-img,.idx-about-text {min-height: 300px;}
.idx-products,.idx-infor-all{padding: 5vh 3vw;}
.idx-about h1,.idx-infor-all h2,.idx-products h2{font-size: 25px;}
.idx-products ul li h3,.video-text a h4{font-size: 18px;}
.idx-infor figure figcaption h3{font-size: 18px;top:45%;}
.idx-video{background-attachment: unset;}
.idx-video .content-box{height: 300px;}
.idx-video h2{margin: 20px auto;font-size: 25px;}
}
@media only screen and (max-width: 414px) {
.idx-banner-icon .idx-icon-frame{top:-30px;}
.idx-banner-icon{margin-bottom: 30px;}
.idx-banner-icon ul {width: 100%;}
.idx-icon-img{width: 50%;}
.idx-banner-icon .idx-icon-part::before{width:10px;margin-right: 5px;}
.idx-banner-icon .idx-icon-part::after{width: 10px;}
}
@media only screen and (max-width: 320px) {
}