@charset "utf-8";

/* CSS Document */
body{font-family:'Lato','微軟正黑體',sans-serif;font-size:16px;line-height:1.5;color:#333;overflow-x: hidden;}
a{color:#000;text-decoration:none;-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear}
a:hover{color:#777;}
*{ backface-visibility: hidden; -wetkit-backface-visibility: hidden;}
/*---------------------- 基礎設定 ----------------------*/
/*反白設定
::selection { background: #666; color: #FFF; }
::-moz-selection { background: #666; color: #FFF; }
*/
.alert_line{border-color: #d40023;}
.red{color: #d40023;}
.blue{color: #143572;}
/* 回頂端 */
#goTop{display:none;cursor:pointer;position:fixed;bottom:1rem;right:1rem;width:50px;height:50px;line-height:50px;text-align:center;color:#ccc;background:#fff;border:solid 1px #ccc;border-radius:100%;box-shadow:rgba(0,0,0,.5) 0 0 5px}
#goTop:hover{background:#999;color:#FFF}

/*按鈕*/


/*RWD編輯器表格(X捲軸)*/
.table-container table td{min-width:100px;padding:5px;border:1px solid #ccc;white-space:inherit}
@media screen and (max-width: 768px) {
.table-container{width:100%;overflow-y:auto;_overflow:auto;margin:0 0 1em}
}
/*IE瀏覽器*/
.warning{width:100%;color:#fff;text-align: center;max-width: 1500px;padding: 60px 50px 50px;position:fixed;left:50%;transform: translate(-50%, -50%);top: 50%;background-color: #283d86;box-shadow:0 0 15px rgba(51,51,51,.5);border-radius:3px;z-index:9999999999;-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear;}
.off{cursor: pointer;position:absolute;right: 10px;top: 10px;border: 1px solid #eee;padding: 3px 5px 3px 10px;}
.off:hover{background-color:#fff;color:#333;}

.warning-item p{font-size: 25px;font-weight: 600;margin-bottom: 30px;}
.use-tool ul{padding-left:0;list-style:none}
.use-tool ul li{display:inline-block;margin: 0 5px;}
.use-tool ul a{display:block;background: #fff;padding: 7px 10px;border-radius: 60px;}
.use-tool-sm{margin-bottom: 10px;display: block;text-align: center;}
.use-tool figure{width: 30px;float:left;margin-right: 5px;margin-bottom: 0;}
.use-tool span{float:right;margin-top: 2px;font-weight: 600;}
/*---------------------- 頁面開始 ----------------------*/
/*歡迎頁*/
.welcomeBg{background: url(../images/welcome/welcomeBg.jpg)no-repeat center/cover fixed;/* min-height: 100vh; */}
.welcomeLink{position:relative;display: block;}
.welcomeLink:before{content:'';position:absolute;left:0;bottom:0;width: 0;transition: all .5s;height:100%;background: rgb(68 118 118 / 50%);z-index: 1;}
.welcomeLink figure{overflow:hidden}
.welcomeLink figure img{transition:all .5s}
.welcomeZone{display:flex;align-items: center;padding: 20px 0;}
.welcomeFt{display:flex;align-items: center;background: #828282;padding: 10px 0;justify-content: center;font-size: 1.2rem;}
.welcomeFt a{padding:0px 10px;color: #fff;}
.welcomeBox{width:50%;text-align: center;padding: 20px;position: relative;}
.welcomeBig{font-weight:bold;letter-spacing:3px;margin-top: 20px;color: #447676;font-size: 1.4rem;}
.welcomeList{list-style:none;padding-left:0;display: grid;grid-template-columns: repeat(4, 1fr);grid-column-gap: 4em;max-width: 450px;margin: 20px auto;}
.welcomeList i{width: 35px;line-height: 35px;height: 35px;background: #447676;display: inline-block;margin-right: 5px;border-radius: 100%;color: #fff;}
.welcomeList.blue i{background: #2b4576;}
.welcomeLink:hover figure img{transform:scale(1.1)}
.welcomeLink:hover:before{width:100%}
.welcomeLink.blue:hover::before{width:100%;background: rgb(43 69 118 / 50%);}
/*歡迎頁按鈕*/
.learn-more{position: absolute;right: 5%;bottom: 5%;color: #fff;width: 12rem;z-index: 2;}
.learn-more .circle .icon{transition:all .45s cubic-bezier(0.65,0,0.076,1);position:absolute;top:0;bottom:0;margin:auto;background:#fff}
.learn-more .circle .icon.arrow{transition:all .45s cubic-bezier(0.65,0,0.076,1);left:.625rem;width:1.125rem;height:.125rem;background:none}
.learn-more .circle .icon.arrow::before{position:absolute;content:"";top:-.25rem;right:.0625rem;width:.625rem;height:.625rem;border-top: .125rem solid #000;border-right: .125rem solid #000;transform:rotate(45deg)}
.learn-more .circle{transition:all .45s cubic-bezier(0.65,0,0.076,1);position:relative;display:block;margin:0;width:3rem;height:3rem;background: #ffffff;border-radius:1.625rem;margin-right: 20px;}
.learn-more .button-text {
    transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0.75rem 0;
    margin: 0 0 0 1.85rem;
    color: #282936;
    font-weight: 700;
    line-height: 1.6;
    text-align: center;
    text-transform: uppercase;
    font-size: 1.6rem;
    color: #fff;
}
.learn-more:hover .circle {width: 100%;background: #447676;box-shadow: 0px 10px 10px rgb(0 0 0 / 50%);}
.learn-more:hover .circle .icon.arrow::before{border-top: 0.125rem solid #fff; border-right: 0.125rem solid #fff;}
.learn-more.blue:hover .circle{background:#2b4576}
@media screen and (max-width: 991px) {
    .welcomeZone{flex-wrap:wrap;}
    .welcomeBox{width:100%}
}
@media screen and (max-width:640px) {
    .welcomeList {grid-column-gap: .5em;}
    .welcomeList a{text-align:center;display: inline-block;}
    .welcomeList i{display:block;margin: 0 auto;}
    .welcomeFt{flex-wrap:wrap;}
}

/*全頁佈局*/
.wrapper {padding-top:4rem}
.wrapper:last-child{padding-bottom:4rem}
h1,h2,h3,h4,ul,figure,ul,p{margin-bottom:0;}
/*首頁*/
.ixBanner{margin-top: 85px;}
.banner .item{position:relative}
.banner .item h4{margin:0;position:absolute;left:50%;bottom:50px;transform:translateX(-50%);color:#fff}
.banner .owl-dots{position:absolute;bottom:10px;left:50%;transform:translateX(-50%)}
.banner__info{transition:all .5s}
.slick-active .banner__info{transform: translateX(0%);}
.banner__info .solgan{position:absolute;top:50%;right: 120px;transform:translateY(-50%);color: #fff;text-align: right;z-index: 1;background: rgb(213 237 247 / 80%);padding: 50px;}
.banner__info .solgan:before{content:'';position:absolute;left:5%;top:5%;width:90%;height:90%;border:1px solid }
.banner__info .solgan .bannerTitle{font-weight:700;color:#fff;text-shadow: 0 0 10px #2b4576;text-align:right;font-size: 3.25rem;letter-spacing: 1px;margin-bottom: 10px;}
.banner__info .solgan .bannerTxt{font-size: 1.5rem;font-weight: 700;/* color: #ffe700; */text-shadow: 0 0 7px #2b4576;}
.slick-active .banner__info img {
    animation: zoomMove1 20s cubic-bezier(.165,.84,.44,1);
    animation-iteration-count: infinite;
    animation-direction: alternate;
}
@keyframes zoomMove1 {
    0% {
        transform: scale(1)
    }

    100% {
        transform: scale(1.05)
    }
}


.index-pd{padding:50px 0}
.index-pd h2{text-align:center;margin-bottom:1.8em}
.index-pd .item{text-align:center}
.slick-dots{bottom: 30px !important;}
/* menu */
.navbar-brand img{max-width:350px}
.navbar .navbar-nav .nav-link {color: #172e58 !important;}
.navbar .navbar-nav .nav-link:focus, .navbar .navbar-nav .nav-link:hover {color: #172e58 !important;}
.navbar{background:#fff}
.navbar.navbar--fixed {padding: 0px 40px;box-shadow: 0px 0px 10px rgb(0 0 0 / 20%);width: 100%;background: #fff;}
.navbar.navbar--fixed .navbar-brand {transform: scale(0.7);padding: 0;}
.slick-dotted.slick-slider{margin-bottom: 0 !important;}
.nav-item.language {display: flex;align-items: center;}
.navbar .navbar-nav .language a {background: #d5edf7;margin: 2px;font-size: 14px;width: 45px;text-align: center;border-radius: 30px;padding: 10px 5px !important;}
.navbar .navbar-nav .language a:hover, .navbar .navbar-nav .language a.active {background: #6cacc6;color: #ffffff !important;}
.navbar--fixed.navbar .navbar-nav .nav-link {height: 60px;transition: all 2s cubic-bezier(0.165, 0.84, 0.44, 1);}
.navbar .navbar-nav .nav-link {display: flex;padding: 10px 20px !important;height: 80px;align-items: center;position: relative;}
.navbar .navbar-nav .nav-link:before{content:'';background:url(../images/all/menuIcon.png)no-repeat center/cover;width:40px;height:40px;position: absolute;top: -25px;left: 50%;transform: translateX(-50%);/* background-size: 55%; */transition: all .5s;opacity: 0;}
.navbar-nav {display: flex;align-items: center;}
.navbar .navbar-nav .nav-link:focus, .navbar .navbar-nav .nav-link:hover {/* background: #2b4576 !important; *//* color: #ffffff !important; */}
.navbar .navbar-nav .nav-link:hover:before{opacity: .2;top: 50%;transform: translate(-50%,-50%);}
/*最新消息*/
.ixNews__zone{background: url(../images/index/newsBg.jpg)no-repeat center/cover fixed;/* margin: 50px; */padding: 6rem 4rem 10rem 4rem;}
/*首頁-聯絡我們*/
.ixContact__inner{background:#fff;margin-top: -120px;margin-bottom: 50px;padding: 50px 100px;box-shadow: 0px -20px 15px rgb(0 0 0 / 20%);display:flex;justify-content: space-between;align-items: center;}
.ixContact__left{position:relative;width: 30%;}
.ixContact__left:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:3px;background: rgb(60,129,159); /* Old browsers */background: -moz-linear-gradient(-45deg, rgba(60,129,159,1) 0%, rgba(22,43,86,1) 100%); /* FF3.6-15 */background: -webkit-linear-gradient(-45deg, rgba(60,129,159,1) 0%,rgba(22,43,86,1) 100%); /* Chrome10-25,Safari5.1-6 */background: linear-gradient(135deg, rgba(60,129,159,1) 0%,rgba(22,43,86,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3c819f', endColorstr='#162b56',GradientType=1 );}
.ixContact__right{display:flex;width: 70%;justify-content: end;}
.ixContact__link span{display:block;font-size: 1.4rem;font-weight: bold;}
.ixContact__link{text-align:center;padding: 30px;}
.ixContact__link i{font-size: 1.6rem;width: 80px;height: 80px;line-height: 80px;border-radius: 100%;display: inline-block;color: #2b4576;margin-bottom: 10px;border: 1px solid;transition: all .5s;}
.ixContact__link i:hover{background: #ddeef5;}
/* footer */
.copyright {padding: 10px;border-top: 1px solid #fff;font-size: 12px;/* text-align: right; */}
footer{background: #2b4576;color:#fff;padding: 0;text-align:center}
.ft__inner {display: flex;flex-direction: column;text-align: left;}
.ft__inner img{max-width:350px}
.ft__inner figure {margin: 0 0 0;}
.ft__inner .introduce{padding: 10px;}
footer .ftList{margin: 10px 0 0 0;padding-left:0;list-style:none;display: flex;flex-direction: column;align-items: flex-start;}
footer .ftList i,.ftIcon i{width: 25px;height: 25px;background: rgb(255 255 255 / 80%);color:#2b4576;display: inline-block;border-radius: 100%;margin-right: 8px;text-align: center;}
footer ul li{display:inline-block;padding: 0;margin-bottom: 10px;text-align: left;}
footer a{color: rgba(255,255,255,.75);}
footer a:hover{color:rgba(255,255,255,1); text-decoration:none;}
.footer__info {padding: 30px 0;display: flex;flex-direction: row;justify-content: space-between;}
footer .ftList p, footer .ftList a {margin: 0;color: #ffffff;/* font-size: 14px; */letter-spacing: 1px;}
.ftList .remark{display: block;margin-top: 5px;margin-left: 34px;}
.ftIcon {display: flex;flex-direction: column;align-items: flex-start;padding-left: 0;margin: 10px 0px 0px;}
.ftIcon a {font-size: 16px;margin-bottom: 10px;}
.ftIcon i{margin-right: 8px;font-size: 17px;}


/*標題*/
.titleInner{position:relative;border-top: 1px solid #ddd;border-bottom:1px solid #ddd;display:flex;flex-direction:row;align-items: center;justify-content: center;background: #fff;}
.title__style1{font-size: 1.5rem;font-weight:700;color:#152b56;margin:0;width: 90%;padding: 1rem 2rem;border-right: 1px solid #ddd;}
.titleInner .fontStyle{display: flex;width:10%;margin:0;text-align:right;padding: 1.2rem 2rem;flex-direction: row;align-items: center;}
.title__style2{font-size: 18px;font-weight:bolder;text-align:center;letter-spacing:1px;color: #ffffff;margin: 0;}
.title__style3{position: relative;font-size:1.75rem;font-weight:700;color:#1b2f5a;margin: 0px 0 20px;/* padding: 0 0 20px; */}
.fontStyle{font-size:1rem;margin:0;letter-spacing:1px;text-align: justify;}
.title__style3.white{color: #fff;}
.title__style3.white span{color:rgb(255 255 255 / 0.3)}
/* index */
.indexProduct{position:relative}
.indexProduct .pdBox {width: 45%;}
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after, .swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {color: #ffffff !important;font-size: 14px !important;background: #2b4576 !important;border-radius: 50%;padding: 7px 10px;}
.productInfo{position:relative}
.productInner__icon{position:relative;display:flex}
.iconInner{position:relative;padding: 2rem 1rem;width: calc(100% / 6);display: flex;align-items: center;flex-direction: row;align-content: center;background: #143572;}
.iconInner figure {max-width: 95px;padding: 15px;margin: 0;background: #fff;border-radius: 50%;border: 7px solid rgb(55 154 196 / 50%);transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);}
.iconInner:hover figure {border: 10px solid rgb(95 168 95 / 50%);box-shadow: 0px 0px 10px #000000;}
.iconInner__txt{width:100%}
.iconInner:nth-child(2){background:#2b4576}
.iconInner:nth-child(3){background:#3f84a1}
.iconInner:nth-child(4){background:#6cacc6}
.iconInner:nth-child(5){background:#97c9dd}
.iconInner:nth-child(6){background:#b6d8e6}
.indexAbout__info{position:relative;display:flex;/* align-items: center; */}
.indexAbout .indexAbout__img{margin-top: 20px;}
.indexAbout__pic {width: 45%;/* margin: 10px; */position: relative;/* display: flex; *//* flex-wrap: wrap; */}
.indexAbout__inner {width: 55%;padding-right: 3rem;}
.indexAbout__inner .fontStyle {/* color: #fff; */}
.indexAbout__pic figure{margin:0;padding-right:2rem}
.indexAbout__pic:before{content:"";width:95%;height:100%;position:absolute;/* border: 4px solid rgb(109 172 198 / 77%); */top:-6%;right:9%;z-index:-2;}
.indexAbout__pic:after{content:"";width:95%;height:100%;position:absolute;/* background: rgb(109 172 198); */z-index:-1;bottom:-6%;right:2%;}
.titleInner .fontStyle i {position: relative;display: block;background: #6cacc6;border-radius: 50%;padding: 3px 5px;margin: 0 0 0 10px;font-size: 12px;color: #fff;transition: all 2s cubic-bezier(0.165, 0.84, 0.44, 1);}
.titleInner .fontStyle:hover {background: #2b4576;color: #ffffff;}
.titleInner .fontStyle:hover i {transform: translateX(10px);}

/*首頁--產品*/
.ixPdt__zone{position: relative;}
.ixPdt__zone::before{content:'';position: absolute;width: 100%;height: 100%;background: #efefef;z-index: -2;}
.indexProduct .productInfo__style1 {position: relative;display: flex;align-items: center;padding: 80px 0;}
.indexProduct .productInfo__style1:before{content:'';position:absolute;left: 10%;width: 100%;height: 90%;bottom: 5%;border: 2px solid #fff;z-index: -1;}
.pdAdvantage {width: 50%;padding-left: 60px;}
.pdList {padding-left: 0;list-style: none;}
.pdList li{font-size: 1.2rem;display: flex;align-items: center;}
.pdList li i{color:#6cacc6;font-size: 1.8rem;margin-right: 10px;}
section.indexArea.bg {position: relative;padding-bottom: 4rem;}
.index .btn {margin: 40px 0 0;padding: 10px 30px;font-size: 14px;font-weight: 700;letter-spacing: 1px;background: #fff;border: 1px solid #ddd;border-radius: 0;display: inline-block;border-radius: 25px;}
.index .btn:hover {background: #212529;/* box-shadow: inset 0px 0px 10px 1px #3e3e3e; */border: 1px solid #212529;color: #fff;}
.indexAbout .title__style3 {/* color: #fff; */}
.picTxt {/* border-top: 1px solid #1b305a; *//* padding: 10px; */}
.title__style3 span{position:absolute;top: 10%;left:0;z-index:-1;color: rgb(108 172 198 / 20%);font-size: 3rem;font-weight: 700;}
.picTxt .title__style3{padding:0}
.warningTxt{background:#6cacc6;color:#fff;}

/* .productInfo__style1 .icon{position: relative;} */
.newsList{list-style:none;margin:0;padding:0;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between;align-items:center}
.newsList .newsList__link{position:relative;padding:20px;border:1px solid #ddd;display:flex;flex-direction:column;flex-wrap:nowrap;background: #fff;}
.newsList__title{font-size:1.25rem;font-weight:700;margin:5px 0;padding:0 0 10px;border-bottom:1px dashed #ddd;display: -webkit-box;white-space: normal;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
.newsList__txt{margin:0;padding:5px 0;font-size:15px;font-weight:500;display:-webkit-box;white-space:normal;-webkit-line-clamp:2;-webkit-box-orient:vertical;height:50px;overflow:hidden;color:#9e9e9e}
.newsList time{display:inline-block;background:#167ac6;color:#fff;width:25%;padding:3px 5px;margin-bottom:5px;text-align:center;border-radius:20px;font-size:12px}
.newsList .newsItem{width:calc(100% / 3 - 10px)}
.newsList .newsList__link:hover{background:#ddeef5}
.newsList .newsList__link:hover .newsList__title{color:#2b4576}
.newsList .newsList__link:hover .newsList__txt{color:#515151}
.indexNews__info{display:flex;flex-direction:column;align-items:center;justify-content:center;align-content:center}
/*最新消息-資料*/
.newsBox{padding: 40px;position: relative;transition: all .5s;border: 2px solid #eee;}
.newsBox__txt p {margin-bottom: 20px;}
.newsBox_bg{background: url(../images/news/newsBg.png) no-repeat;position: absolute;bottom: 0;right: 0;width: 500px;height: 100%;background-size: cover;z-index: -1;}
.newsBox::before{display: block;content: "";width: 20%;height: 45%;position: absolute;bottom: -2px;right: -2px;border-bottom: 2px solid #a5d5ea;border-right: 2px solid #a5d5ea;}
.newsBox::after{display: block;content: "";width: 20%;height: 45%;position: absolute;top: -2px;left: -2px;border-top: 2px solid #a5d5ea;border-left: 2px solid #a5d5ea;}
.newsBox:hover{transform: translateY(-10px);box-shadow: 0px 0px 15px rgb(0 0 0 / 20%);background-color: #f8fdff;}
.newsBox time{display: inline-block;background: #167ac6;color: #fff;padding: 5px 14px;margin-bottom: 5px;text-align: center;border-radius: 20px;font-size: 12px;}
.newsBox:not(:last-child){margin-bottom: 50px;}
.newsLeft{width: 35%;}
.newsLeft + .newsRight{width: 65%;}
.newsRight{width: 100%;}
.newsBox .newsBox__content{margin-top: 20px;display: flex;}
.newsBox .newsBox__content img{width: 400px;margin-right: 20px;}
.newsLink i{margin: auto 5px;font-size: 26px;vertical-align: sub;z-index: 999;}
.ytLink{width: 160px;
    font-weight: bold;
    color: #fff;
    cursor: pointer;
    margin: 5px;
    text-align:center;
    border: none;
    background-size: 300% 100%;
    background-image: linear-gradient(to right, #eb3941, #f15e64, #e14e53, #e2373f);  
    box-shadow: 0 5px 15px rgba(242, 97, 103, .4);
    border-radius: 50px;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
   }
.ytLink:hover{ background-position: 100% 0;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;}
.telLink{width: 150px;
    font-weight: bold;
    color: #fff;
    cursor: pointer;
    margin: 5px;
    text-align:center;
    border: none;
    background-size: 300% 100%;
    background-image: linear-gradient(to right, #25aae1, #4481eb, #04befe, #3f86ed);
    box-shadow: 0 4px 15px 0 rgba(65, 132, 234, 0.75);
    border-radius: 50px;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;}
.telLink:hover{ background-position: 100% 0;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;}
.contactLink{width: 150px;
    font-weight: bold;
    color: #fff;
    cursor: pointer;
    margin: 5px;
    text-align:center;
    border: none;
    background-size: 300% 100%;
    background-image: linear-gradient(to right, #0ba360, #3cba92, #30dd8a, #2bb673);
    box-shadow: 0 4px 15px 0 rgba(23, 168, 108, 0.75);
    border-radius: 50px;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;}
.contactLink:hover{ background-position: 100% 0;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}
/*-------------內頁-----------*/
.area_pro{position:relative}
.area_pro .area_abso{position:absolute;left:0;top:-100px;}
/*麵包屑*/
.breadCrumbs-block{bottom: 0;padding: 10px 15px;}
.breadCrumbs-block .breadCrumbs{float: right;list-style:  none;margin:  0;padding:  0;}
.breadCrumbs-block .breadCrumbs .item{display: inline-block;padding: 0 7px 0 0;font-size: 14px;}
.breadCrumbs-block .breadCrumbs .item:after{content: '/';display: inline-block;color:#999}
.breadCrumbs-block .breadCrumbs .item a{display: inline-block;padding: 0 7px 0 0;color:#999;}
.breadCrumbs-block .breadCrumbs .item.active:after{display:none}
.breadCrumbs-block .breadCrumbs .item.active a{padding-right:0;color: #4a4948;}
/*內頁Banner*/
.pageBanner{position:relative;margin-top: 100px;}
.pageBanner__slogan{position:absolute;top:30%;right: 200px;color: #fff;padding: 30px 50px;width: 450px;text-shadow: 0px 0px 7px #000;}
.pageBanner__slogan .big{font-weight:bold;margin-bottom: 10px;}
.pageBanner__slogan .txt{font-size:1rem;letter-spacing:3px;font-size: 1.4rem;}
/*關於我們*/
.aboutBg{background: url(../images/about/aboutBtm02.png)no-repeat bottom;padding-bottom: 50px;}
.aboutZone{display:flex;}
.aboutLeft{/* position: sticky; */width: 25%;display: inline-block;}
.aboutLeft .circle{position:relative;right: 0;background: inherit;width: 250px;bottom: 0;height: 250px;margin-top: -60px;border-radius: 50%;display: flex;align-items: center;justify-content: center;}
.bigTitle{font-size: 1.4rem;font-weight:bold;letter-spacing: 3px;line-height: 1.4;}
.aboutRight{width:75%;padding-left: 100px;}
.aboutRight .txt{letter-spacing:3px;line-height:1.6;color:#6c6c6c}
.aboutIdea{display:flex;justify-content: space-around;margin-top: 180px;padding: 0px 150px 50px;}
.ideaBox img{max-width:100px}
.ideaBox{text-align:center;padding: 20px;position: relative;width: 250px;background: #fff;}
.ideaName{font-size:1.4rem;font-weight:bold;position: relative;margin-bottom: 20px;}
.ideaName:before{content:'';position:absolute;left:50%;transform:translateX(-50%);width: 30px;height: 3px;background: #2b4576;bottom: -10px;}
.ideaBox:before,.ideaBox:after{content:'';position:absolute;width: 100%;height:100%;transition: all .5s;}
.ideaBox:before{border: 3px solid rgb(108 172 198 / 30%);left: -10px;top: -5px;/* z-index: -1; */}
.ideaBox:after{border: 3px solid rgb(213 237 247 / 70%);right: -20px;bottom: -15px;/* z-index: -1; */}
.ideaTxt{letter-spacing: 3px;line-height: 1.6;color: #6c6c6c;}
.ideaBox:hover:before{left: 0px;top: 0px;/* z-index: -1; */}
.ideaBox:hover:after{right: 0px;bottom:0px;/* z-index: -1; */}
/*產品介紹*/
.titleTop{margin-bottom: 80px;text-align: center;}
.titleTop .big{font-weight:bold;letter-spacing: 3px;font-size: 2.8rem;line-height: 1;}
.advanTitle span{/* font-size: 5rem; */padding:0px 10px;font-style: italic;}
.titleTop .sm{width: 45%;font-weight: bold;letter-spacing: 3px;font-size: 1.5rem;}
.advanList{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 2em;
    grid-row-gap: 4em;
    margin-top: 50px;
    }
.advaBox{border: 1px solid #eee;padding: 20px;position: relative;text-align: center;font-size: 20px;font-weight: bold;}
.advaBox .num{position:absolute;left: 13px;top: -30px;font-size:2rem;font-weight: bold;font-style: italic;background: #fff;padding: 0 5px;color: #6cacc6;z-index: 1;}
.advaBox:before{display:block;content:"";width:10%;height:45%;position:absolute;bottom:-2px;right:-2px;border-bottom:3px solid #d5edf7;border-right:3px solid #d5edf7;transition: all .5s;}
.advaBox:after{display:block;content:"";width:10%;height:50%;position:absolute;top:-2px;left:-2px;border-top:3px solid #d5edf7;border-left:3px solid #d5edf7;transition: all .5s;}
.advaBox:hover:after{width: 90%;height: 80%;}
.advaBox:hover:before{width: 90%;height: 80%;}

/*服務*/
.serviceZone__outer{display:flex;align-items: center;}
.serviceLeft{width: 60%;}
.serviceRight{width: 60%;padding-left: 2em;/* margin-top: -150px; *//* margin-left: -160px; */}
.serviceBox__outer{ display: grid;grid-template-columns: repeat(2, 1fr);grid-column-gap: 2em; grid-row-gap: 2em;}
.serviceTitle .big{font-weight: bold;letter-spacing: 3px;font-size: 3.4rem;}
.serviceBox{text-align:center;padding: 50px 20px 20px;border: 1px solid #eee;background: #fff;}
.serviceBox figure{position:relative;}
.serviceBox figure:before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width: 120px;height: 120px;border-radius: 100%;background: #d5edf7;transition: all .5s;}
.serviceBox:hover figure:before{transform:translate(-50%,-50%) scale(1.1)}
.serviceBox img{max-width: 60px;position: relative;}
.serviceName{font-weight:bold;font-size:1.4rem;margin-top: 40px;}
/*產品介紹*/
.pdtZone{padding:50px}
.pdtZone:nth-child(odd){background:#eee;}
.pdtBox__left{width: 55%;padding-right: 5%;}
.pdtBox__right{width: 45%;padding-top: 90px;}
.pdtBox__top,.pdtBox__bottom{width: 100%;}
.pdtbox__outer{display:flex;}
.pdtZone:nth-child(even) .pdtbox__outer{flex-direction: row-reverse;align-items: start;}
.pdtZone:nth-child(even) .pdtbox__outer .pdtBox__left{padding-right:0;padding-left:5%}
.pdtName__outer{display:flex;align-items: center;margin-bottom: 20px;flex-wrap: wrap;}
.pdtName__outer .pdtSub__red{margin-left: 95px;}
.accessories__box{border:1px solid #eee}
.pdtName__outer img{max-width:50px;}
.pdtName__outer figure{width:80px;height:80px;background: #d5edf7;border-radius:100%;text-align: center;line-height: 80px;position: relative;box-shadow: 10px -10px 10px rgb(0 0 0 / 15%);}
.pdtName{font-weight:bold;letter-spacing:3px;background: #6cacc6;padding: 10px 20px;margin-left: -20px;color: #fff;padding-left: 35px;border-radius: 0 0 25px;}
.pdtPic{text-align:center;margin-bottom: 30px;}
.pdtPic img{max-width:450px;margin:0}
.pdtSub{font-size:1.4rem;font-weight:bold;margin-bottom:10px;}
.pdtSub__red{font-weight: bold;font-size: 18px;margin-left: 30px;margin-bottom: 10px;}
.pdtList{/* list-style:none; */}
.pdtList li{letter-spacing:3px;/* border: 1px solid #6cacc6; */margin-bottom:10px;/* border-left: 5px solid #6cacc6; *//* padding-left: 10px; */}
.bgGary {background-color: #eeeeee;}
.accessories .textBox .name,.plasticBox .textBox .name,.equipmentBox .textBox .name{font-size: 20px;color: #2b4576;font-weight: bold;text-align: center;margin: 10px auto;}
.equipment .pdtPic img{width: 300px;margin-bottom: 0;}
.equipmentBox {margin-bottom: 40px;}
.plasticBox figure{background-color: #fff;padding: 40px;}
/*表格樣式*/
.tableStyle{width:100%;/* margin-top: 120px; */}
.tableStyle td{border:1px solid #6cacc6;padding:10px;}
.tableStyle td:first-child{background:#6cacc6;color:#fff;border:1px solid #fff;width: 220px;}
.tableStyle02{width:100%;margin-top: 120px;}
.tableStyle02 td{border:1px solid #6cacc6;padding:10px;text-align: center;}
.tableStyle02 tr:first-child{background: #d5edf7;border-top: 3px solid #6cacc6;}
.pdtBox__bottom .tableStyle02{margin-top: 0;}
/*聯絡我們*/
.contant_info ul{list-style:none;padding-left:0;}
.contant_info ul li{margin-bottom:10px;}
.contant_info ul li i{background:#2b4576;color: #fff;width: 30px;height: 30px;display: inline-block;text-align: center;border-radius: 100%;margin-right: 10px;line-height: 30px;}
.contant_info .addText{margin-left: 40px; color: #000;}
.form-group input[type="text"]{border-radius:0;}
.form-group{margin-bottom:20px;}

/*--------------RWD設定------------*/
@media screen and (max-width:991px) {
    .circle{right: -10%;top: 0;z-index: -1;width: 200px;height: 200px;}
    /*menu*/
    .navbar.navbar--fixed{padding:0 10px}
    .navbar-brand img{max-width:250px}
    .banner__info .solgan .bannerTitle{font-size: 1.6rem;text-align: center;}
    /*首頁BN*/
    .ixBanner{margin-top: 50px;}
    /*首頁-產品*/
    .iconInner figure{max-width:80px;}
    .productInner__icon{flex-wrap:wrap;}
    .iconInner{width: calc(100% / 2);}
    /*首頁-聯絡我們*/
    .ixContact__inner{padding: 30px 20px;margin-top: 50px;flex-wrap: wrap;}
    .ixContact__link span{font-size:1rem}
    /*內頁pageBn*/
    .pageBanner{margin-top: 75px;}
    .pageBanner__slogan{right:50px;}
    /*關於昱舜*/
    .aboutZone{flex-wrap:wrap;justify-content: end;}
    .aboutLeft,.aboutRight{width:100%;padding-left: 0;}
    .aboutLeft{width: 60%;}
    .ideaBox img{max-width:80px;}
    .ideaBox{width:200px}
    .ideaBox:before, .ideaBox:after{width:90%;height:90%}
    .ideaBox:before{left:20px;top:5px}
    .ideaBox:after{right:20px;bottom:5px}
    .aboutBg{padding-bottom:80px}
    /*產品介紹*/
    .pdtbox__outer{flex-wrap:wrap;}
    .pdtBox__left,.pdtBox__right{width:100%;padding: 0;}
    .pdtZone:nth-child(even) .pdtbox__outer .pdtBox__left {padding-right: 0;padding-left: 0%;}
    .pdtPic img{max-width:100%}
    .pdtZone{padding:30px 20px;}
    .tableStyle{margin-top: 20px;}
    /*最新消息*/
    .newsBox .newsBox__content{display: block;}
    .newsLeft{width: 100%;}
    .newsRight{width: 100%;}
    .newsLeft + .newsRight{width: 100%;margin-top: 20px;}
}
@media screen and (max-width:768px) {
    .ixNews__zone{padding: 20px;}
    /*首頁-產品*/
    .circle{top:50%}
    .indexProduct .productInfo__style1{flex-wrap:wrap;}
    .indexProduct .pdBox{width:100%}
    .pdAdvantage{width:100%;padding-left: 20px;margin-top: 30px;}
    /*首頁-關於我們*/
    .indexAbout__info{flex-wrap:wrap;}
    .indexAbout__inner{width:100%;padding-right: 0;}
    .indexAbout__pic{width:100%;margin:0;padding-top:30px;}
    /*首頁-最新消息*/
    .newsList{flex-wrap:wrap;}
    .newsList li {width: calc(100%);}
    /*首頁-聯絡我們*/
    .ixContact__left{width:100%}
    .ixContact__right{width:100%;justify-content: center;flex-wrap: wrap;}
    /*頁尾*/
    .footer__info{flex-wrap:wrap;}
    /*產品介紹*/
    .titleTop{flex-wrap:wrap;}
    .titleTop .big{width:100%;font-size: 2rem;}
    .titleTop .sm{width:100%;margin-top:30px;font-size: 1.2rem;}
    .advanList {grid-template-columns: repeat(2, 1fr);}
    .serviceZone__outer{flex-wrap:wrap;}
    .serviceLeft{width:100%}
    .serviceRight{width:100%;margin-left: 0;margin-top: 0;}
}
@media screen and (max-width:640px) {
    .ixBanner{margin-top:80px}
    .circle{display:none;}
    .pageBanner__slogan{position:relative;left:0;width: 100%;}
    /*首頁-bn*/
    .banner__info .solgan .bannerTxt{font-size:1.2rem;}
    .banner__info .solgan{position:relative;top: 0;background: #b6d8e6;right: 0;padding: 20px;transform: translateY(0%);text-align: center;}
    .ixBanner .slick-dots{bottom: 0!important;}
    .ixContact__link{width: 100%;padding: 20px 10px;}
    /*關於我們*/
    .aboutIdea{flex-wrap:wrap;padding: 0px;margin-top: 40px;}
    .ideaBox{width:100%;margin-bottom: 20px;}
    .aboutLeft{width:100%}
    .breadCrumbs-block{width:100%;bottom: -45px;}
    .advanList {grid-template-columns: repeat(1, 1fr);}
    /*產品介紹*/
    .pdtName{font-size:1.2rem;width: calc(100% - 80px);}
    .pdtName__outer .pdtSub__red{margin-left: 15px;}
}