@charset "utf-8";

/* CSS Document */
body{font-family:'Poppins','微軟正黑體',sans-serif;font-size: 16px;line-height:1.5;color: #5f5d5d;}
a{color:#000;text-decoration:none}
a:hover{color:#777;-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear}

/*---------------------- 基礎設定 ----------------------*/
/*反白設定
::selection { background: #666; color: #FFF; }
::-moz-selection { background: #666; color: #FFF; }
*/
.aleart_line{border-color: #d40023;}
.red{color: #d40023;}
.blue{color:#389ad4}
/* 回頂端 */
#goTop{color:#aaa;background:#FFF;text-align:center;cursor:pointer;display:none;margin-top: 75px;position: relative;}
#goTop:before{content:'';position:absolute;left:0;bottom: 25px;width:100%;height:1px;background:#eee;}
#goTop i{width:50px;height:50px;background: #389ad4;line-height:50px;border-radius:100%;z-index:1;position: relative;color: #fff;}
/*按鈕*/
.btn-style{width: 50px;height: 50px;border:none;padding:10px 20px;background: #389ad4;color: #fff;display: flex;align-items: center;margin-top: auto;margin-top: auto!important;border-radius: 100%;transition: all .5s;}
.btn-style:hover{background:#bd782f;box-shadow:0px 10px 15px rgb(0 0 0 / 0.15)}
.big-btn-style{display:inline-block;border:1px solid #389ad4;background:#389ad4;background: #389ad4;padding: 10px 20px;color: #fff;/* margin-left: 20px; */transition: all .5s;}
.big-btn-style:hover{background:inherit;color:#389ad4}
.big-btn-style2{display:inline-block;border:1px solid #389ad4;background:#389ad4;background: #389ad4;padding: 10px 70px;color: #fff;/* margin-left: 20px; */transition: all .5s;}
/*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}
}

/*---------------------- 頁面開始 ----------------------*/
/*page number*/
.page-number{margin-top: 50px;}
.pagination{display: block;}
.pagination>li{display: inline-block;}
.pagination>li>a{border:none;color:#333;transition: all .5s;padding: 5px 10px;}
.pagination>li>a:hover{color: #389ad4;}
.pagination>li.on a{background: #389ad4;color: #fff;border-radius: inherit;}

.area_pro{position:relative}
.area_pro .area_abso{position:absolute;left:0;top:-100px;}
p,figure{margin-bottom:0;}
/*標題*/
.main-title p{font-family: 'Bebas Neue', cursive;font-size:1.5rem;margin-bottom:0;color: #bd782f;}
.main-title h2{/* font-weight:bold; */letter-spacing:3px;margin-bottom: 0;}
/*主選單*/
header{/* border-top:3px solid #cc9622 */}
header.fixed{position:fixed;top:0;width:100%;z-index: 10;}
header .header-top{background: #ececec;padding: 5px 50px;}
header .header-top ul{display:flex;margin-left: auto;align-items: center;justify-content: flex-end;margin-bottom: 0;list-style: none;padding-left: 0;}
header .header-top ul li{margin-left: 30px;font-size:.9rem;position: relative;}
header .header-top ul li:after{content:'';position:absolute;right: -15px;bottom: 2px;width: 1px;height: 15px;background:#000;}
header .header-top ul li:last-child:after{display:none;}
header .header-top ul i{margin-right:3px;}
header .header-top ul li.lang-list{position:relative;}
header .header-top ul li.lang-list .lang-menu{position:absolute;background: #eee;z-index: 10;top: 25px;display: none;width: 185%;}
header .header-top ul li.lang-list .lang-menu a{padding: 15px 10px;display:inline-block;width: 100%;}

.navbar-brand img{max-width: 220px;}
header .navbar{padding: 15px 50px;border-bottom: 1px solid #eee;}
header.fixed .navbar{-webkit-animation: .95s ease-in-out 0s normal none 1 running fadeInDown;animation: .95s ease-in-out 0s normal none 1 running fadeInDown;background: #fff;box-shadow: 0px 0px 10px rgb(0 0 0 / 0.2);}
header.fixed .header-top{display:none;}
.navbar-expand-lg .navbar-nav .nav-link{/* font-weight: bold; */padding: 10px 20px;position: relative;}
.dropdown-menu{background:#eee;border-radius:0;border:none;}
.dropdown-menu .dropdown-item{padding:10px 20px;}
.dropdown-menu .dropdown-item:active{background:inherit;}
.navbar-expand-lg .navbar-nav .nav-link:before{content:'';position:absolute;left:0;bottom:0;height:3px;background:#389ad4;transition: all .5s;width: 0;}
.navbar-expand-lg .navbar-nav .nav-item:last-child .nav-link{background: #389ad4;padding: 10px 20px;color: #fff;margin-left: 20px;}
.navbar-expand-lg .navbar-nav .nav-link:hover{color:#389ad4}
.navbar-expand-lg .navbar-nav .nav-link:hover:before{width:100%}
/*----------------------首頁--------------------*/
/*麵包屑*/
.breadCrumbs-block{/* padding: 0px 15px; */margin: 10px 0px;position: relative;}
.breadCrumbs-block:before{content:'';position:absolute;left:0;bottom: 11px;width: 100%;height: 1px;background: #eee;}
.breadCrumbs-block .breadCrumbs{/* float: right; */list-style:  none;margin:  0;padding: 0px 10px;background: #fff;position: relative;display: inline-block;margin-left: 50px;}
.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: #389ad4;}
/*區塊設定*/
.border-width{margin: 0px 50px}
.block-height{padding-bottom: 120px;}
.title-block{display:flex;align-items:center;margin-bottom: 20px;}
.title-block p.intro{border-left: 3px solid #bd782f;margin-bottom: 0;letter-spacing: 3px;line-height: 2;padding-left: 50px;}
/*首頁-banner*/
.ix-banner{position:relative;padding: 50px,0px;}
.ix-banner .slick-slide{position:relative;z-index:10;}
.ix-banner .slick-slide:before{content:'';position:absolute;bottom:0;width:100%;left:0;height: 100%;background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 50%, rgba(0,0,0,0.65) 97%, rgba(0,0,0,0.65) 100%); /* FF3.6-15 */background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.65) 97%,rgba(0,0,0,0.65) 100%); /* Chrome10-25,Safari5.1-6 */background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.65) 97%,rgba(0,0,0,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 );z-index: 1;}
.ix-banner .slick-dots{bottom: 40px;z-index: 10;text-align: right;padding-right: 50px;}
.ix-banner .slick-dots li button:before{color:#fff;opacity: .4;}
.ix-banner .slick-dots li.slick-active button:before{color:#fff;opacity:1!important;}
.banner-slogan{position:absolute;left: 14%;bottom: 30%;z-index: 10;color: #fff;border-left: 3px solid #389ad4;padding-left: 20px;}
.banner-slogan h2{font-family: 'Bebas Neue', cursive;color:#389ad4;font-size: 1.5rem;letter-spacing: 1px;}
.banner-slogan h3{font-weight:bold;font-size: 2.5rem;}
.banner-slogan p{margin-bottom:0;font-size: 1.5rem;}
/*首頁-產品*/
.ix-pdt-list{display:grid;grid-template-columns:repeat(4,1fr);grid-column-gap:30px;grid-row-gap:30px;margin-top:50px}
.ix-pdt-list a{display:inline-block;position:relative;transition:all .5s}
.ix-pdt-list a:before,.ix-pdt-list a:after{content:'';position:absolute;top:0;left:0;width:100%;height:3px;background:#eee}
.ix-pdt-list a:after{width:0;transition:all .5s}
.ix-pdt-list a figure{position:relative}
.ix-pdt-list a figure:before{content:'';position:absolute;left:0;bottom:0;width:100%;height:100%;background:#000;transition:all .5s;opacity:0}
.ix-pdt-list a figure .btn-style{position:absolute;left:50%;top:25%;transform:translate(-50%,50%);transition:all .5s;opacity:0;z-index:1}
.ix-pdt-list a h2{font-size:1.4rem;margin:20px 0}
.ix-pdt-list a p{display:-webkit-box;white-space:normal;-webkit-line-clamp:2;-webkit-box-orient:vertical;height:60px;overflow:hidden;margin-bottom:0;letter-spacing:3px;line-height:2}
.ix-pdt-list a:hover figure:before{opacity:1}
.ix-pdt-list a:hover:after{width:100%;background:#bd782f}
.ix-pdt-list a:hover h2{color:#bd782f}
.ix-pdt-list a:hover figure .btn-style{opacity:1}
.ix-about-zone{background:url(../images/index/about-bg.jpg)no-repeat center/cover fixed;padding:80px 0;color:#fff;text-align:center}
.ix-about-zone h2{font-weight:700;letter-spacing:3px;border-bottom:1px solid #fff;display:inline-block}
.ix-about-zone p{font-size:1.2rem;letter-spacing:3px}
/*首頁-登入*/
.ix-login{/* margin-top: -180px; */}
.login-box{background:#fff;display: flex;}
.login-left{background:url(../images/index/login-pic.jpg)no-repeat bottom/cover;color: #fff;padding: 50px 30px;font-size: 2rem;/* font-weight: bold; */letter-spacing: 3px;overflow: hidden;position: relative;width: 40%;display: flex;align-items: center;justify-content: center;}
.login-left figure{position:absolute;}
.login-right{padding:50px;width: 60%;background: #dbdbdb;}
.form-group{text-align:left;}
/*首頁-常見問題*/
.question{display:grid;grid-template-columns:repeat(3,1fr);grid-column-gap:20px;grid-row-gap:10px}
.question-box{padding:20px;position:relative;display:flex;flex-wrap:wrap;transition:all .5s}
.question-box:before,.question-box:after{content:'';position:absolute;left:0;top:0;width:100%;height:3px;background:#eee}
.question-box:after{width:0;transition:all .5s}
.question-box h3{margin-bottom:20px;font-size:1.4rem}
.question-box p{display:-webkit-box;white-space:normal;-webkit-line-clamp:4;-webkit-box-orient:vertical;height:130px;overflow:hidden;margin-bottom:0;letter-spacing:3px;line-height:2;margin-bottom:30px}
.question-box:hover:after{width:100%;background:#bd782f}
.question-box:hover{background:#eee;box-shadow:0 0 10px #000}
.question-box:hover h3{color:#bd782f}
/*--關於我們--*/
.about-title{margin: 120px 0;position:relative;}
.about-title span{position:absolute;top: -60px;font-size: 10rem;left: 50%;transform: translateX(-50%);color: rgb(189 120 47 / 0.05);z-index: -1;font-family: 'Bebas Neue', cursive;}
.about-title h3{letter-spacing:3px;font-weight: bold;font-size: 1.4rem;}
.block-info{max-width:800px;margin:0 auto;padding-top: 50px;}
.block-info h3{line-height:2.1;letter-spacing: 3px;font-size: 1.4rem;}
.block-info p{letter-spacing:3px;line-height:2;}
.pic-phone{display: none;}
/*人才招募*/
.career-list{display:grid;grid-template-columns: repeat(3,1fr);grid-column-gap:20px;grid-row-gap:10px;}
.career-box{padding:20px;border:1px solid #eee;display: flex;flex-wrap: wrap;flex-direction: column;}
.career-box .type{display:flex;align-items:center;justify-content:space-between;/* color: #bd782f; */font-weight: bold;}
.career-box .care-info{padding:20px 0;}
.career-box .care-info h2{font-size:1.6rem;margin-bottom: 30px;/* font-weight: bold; */position: relative;color: #389ad4;}
.career-box .care-info h2:before{content:'';position:absolute;left:0;bottom: -15px;width: 60px;height:1px;background: #389ad4;}
.career-box .career-btm{margin-top:auto;color: #adadad;}
.career-box .career-btm .info{display:flex;font-size: .9rem;}
.career-box .career-btm .info i{width:15px;margin-right: 10px;margin-top: 5px;}
.career-box .career-btm .info span{width:calc(100% - 20px)}

.career-container{}
.career-tit{font-size: 1.4rem; font-weight: bold; margin: 20px 0; text-align: center;}
.career-container p{line-height: 2; font-weight: bold;padding: 2% 0;}
.career-container span,li{line-height: 2; }

/*產品與服務*/
.service-block{margin-bottom:20px;}
.service-block .service-title p{display:inline-block;border-bottom: 1px solid #389ad4;color: #389ad4;}
.service-block .service-title h2{font-size:1.4rem;font-weight:bold;margin-top:20px;}
.service-info{margin-left:auto;width:80%}
.service-info p{letter-spacing: 3px;line-height: 2;}
/*crs*/
.qa-box.crs .service-info p{letter-spacing:0;}
/*常見問題*/
.page-zone{margin-top:50px;}
.page-zone:after{content:'';display:block;clear:both;}
.sidebar{width:200px;float:left;position: sticky;top: 120px;z-index: 5;}
.sidebar button{display:none;}
.sidebar ul{list-style:none;padding-left:0;}
.sidebar ul li{margin-bottom: 20px;font-weight:bold;}
.sidebar ul li a{display:inline-block;padding-left:10px;border-left:3px solid #eee}
.sidebar ul li.active a,.sidebar ul li:hover a{color:#389ad4;border-left:3px solid #389ad4;}
.sidebar ul.second-list{padding-left:20px;margin-top:10px;}
.sidebar ul.second-list li a{border-left: none;position: relative;color: #000;}
.sidebar ul.second-list li.active a,.sidebar ul.second-list li:hover a{
    color: #389ad4;
}
.sidebar ul.second-list li a:before{content:'';position:absolute;left: -5px;bottom: 8px;width:8px;height:8px;border-radius:100%;background: #eee;}
.sidebar ul.second-list li.active a:before,.sidebar ul.second-list li:hover a:before{background: #5daddc;}

/*問答樣式*/
.qa-box{display:inline-block;width:calc(100% - 200px);padding-left: 50px;}
.qa-block{border-top:1px solid #eee;padding:20px 0px;border-bottom: 1px solid #e3e3e3;margin-top: -1px;}
.qa-block .qa-title h2{font-size: 1.2rem;font-weight:bold;position:relative;cursor:pointer;margin-bottom: 0;}
.qa-block .qa-title.open h2,.qa-block .qa-title:hover h2{color:#389ad4}
.qa-block .qa-title h2 span{width:calc(100% - 30px);display: inline-block;}
.qa-block .qa-title h2:before{content:'+';position: absolute;right: 10px;}
.qa-block .qa-title.open h2:before{content:'-'}
.qa-info{display:none;padding: 15px;margin-top: 10px;background: #eee;}
/*進階服務*/
.adv-title{padding:80px 0px;background:#389ad4;color:#fff;margin-bottom: 40px;}
.adv-title h2{margin-bottom:30px;}
.down-box {margin-top:30px;}
.down-box a{display:inline-block;padding:5px 20px;color:#fff;border:1px solid #fff;transition: all .5s;}
.down-box a:hover{background:#fff;color:#389ad4}
.down-box a:nth-child(2){margin-left:10px;}
.down-box a i{margin-left:5px}
/*檔案下載*/
.qa-box.download a{display:flex;align-items:center;justify-content:space-between;margin-bottom: 15px;border-bottom: 1px solid #eee;padding-bottom: 15px;transition: all .5s;}
.qa-box.download a:hover{color:#389ad4}

/*最新消息*/
.twoColumns__list{display: grid;grid-template-columns: repeat(2,1fr);grid-column-gap:40px;grid-row-gap:40px;list-style: none;padding-left: 0;}
.listItem{position: relative;transition: all .5s;}
.listItem__link{padding: 20px;display: inline-block;width: 100%;}
.listItem::before{content: '';position: absolute;top: 0px;left: 0;width: 100%;height: 3px;background: #eee;}
.listItem::after{content: ''; position: absolute;top: 0px;left: 0;width: 0%; height: 3px;transition: all .5s;}
.listItem__title{display: flex;align-items: center;font-weight: 600;line-height: 30px;margin-bottom: 10px;padding-bottom: 10px; border-bottom: 1px solid #eee;}
.listItem__date{display: flex;align-items: center;color: #389ad4;margin-right: 20px;}
.listItem__date .date{font-size: 45px;margin-right: 10px;}
.monthYear{display: flex;flex-direction: column;font-size: 14px;line-height: 20px;}
.listItem__title .title{font-size: 20px;}
.listItem__text{display: flex;align-items: center; justify-content: space-between;}
.listItem__text figure{width: calc(100% - 40% - 20px);margin-right: 10px;}
.listItem__text .text{width: 100%;display: flex;align-items: flex-end;justify-content: space-between;}
.listItem__text .text p{ overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;margin-right: 20px;}
.listItem__arrow{display: flex;align-items: center;width: 46px;height: 46px;border: 1px solid #389ad4;background: #389ad4;    color: #fff;padding: 10px 20px;}
.listItem:hover{background: #eee;box-shadow: 0px 0px 8px rgb(0 0 0 / 0.3);}
.listItem:hover::after{width: 100%;background: #bd782f;}
.listItem:hover .listItem__title{border-bottom: 1px solid #fff;}
.listItem:hover .listItem__arrow{background: #fff;color: #389ad4;}


/*社群分享*/
.shareZone {display: flex;align-items: center;justify-content: flex-end;}
.fb_iframe_widget {margin-right: 5px;}
/*六圖六文*/
.picTitle {font-weight: bold;margin-top: 10px;}
.picTitle__box {border-bottom: 1px solid #eee;padding-bottom: 10px;margin-bottom: 10px;}
.picTitle__box .date{background-color: #bd782f;font-size: 14px;color: #fff;padding: 2px 10px;letter-spacing: 1px;}
.pageContent {margin-top: 30px;}
.pageContent table {max-width: 100%;}
.tx01 {clear: both;margin-bottom: 2em;}  
.tx01 figure {margin-bottom: 10px;}
.tx01 p {line-height: 1.75;}
.imgLeft {display: flex;align-items: center;}
.imgLeft figure,.imgRight figure {width: 50%;}
.imgRight {display: flex;flex-direction: row-reverse;align-items: center;}
.imgRight.tx01 figure+.text {width: 50%;padding-right: 1rem;}
.imgLeft.tx01 figure+.text {width: 50%;padding-left: 1rem;}
.imgLeft img,
.imgRight img {max-width: 100%;}
.imgLeft figure:only-child,
.imgRight figure:only-child {float: none;padding: 0;margin: auto;max-width: inherit;text-align: center;}

@media (max-width: 768px) {
    .pageContent iframe {height: 400px;}
    .imgLeft,.imgRight {flex-direction: column;}
    .imgLeft figure,.imgRight figure {width: 100%}
    .imgLeft.tx01 figure+.text {width: 100%;padding: 1rem 0 0 0}
    .imgRight.tx01 figure+.text {width: 100%;padding: 1rem 0 0 0}
}
@media (max-width: 640px) {
    .pageContent iframe {height: 320px;}
}
@media (max-width: 480px) {
    .pageContent iframe {height: 250px;}
}
/*linkBox__link*/
.linkBox{margin-top: 10px;}
.linkBox__link{display: inline-flex;align-items: center;padding: 5px 15px; border: 1px solid #389ad4;color: #389ad4;margin: 5px 5px;}
.linkBox__link span{max-width: 200px;overflow:hidden;white-space: nowrap;text-overflow: ellipsis;display: inline-block;}
.linkBox__link i{padding-left: 5px;}
.linkBox__link:hover{background-color: #389ad4;color: #fff;}

/*聯絡我們*/
.contant_info h3{font-size:1.3rem;font-weight:bold;}
.contant_info>ul{list-style:none;padding-left:0;}
.contant_info>ul li{width:100%}
.contant_info table{margin:20px 0}
.contant_info table td{border: 1px solid #c8c8c8;padding:5px }
.contant_info ul p{display:flex;margin: 15px 0;}
.contant_info ul b{display:inline-block;width: 90px;text-align: center;border-top: 1px solid #bd782f;color: #bd782f;padding: 10px 0;border-bottom: 1px solid #bd782f;}
.contant_info ul span{border-top: 1px solid #818181;border-bottom: 1px solid #818181;display: inline-block;padding: 10px 0;width: calc(100% - 90px);}
.form-group{margin-bottom:10px;}
/*進階產品*/
.list-zone{display: grid;
    grid-template-columns: repeat(4,1fr);
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    margin-top: 50px;}
.list-box{border-right: 1px solid #dadada;padding-right: 15px;}    
.list-box:nth-child(4n){border-right:none}
.list-box h2{font-size:1.4rem;margin-bottom:30px;transition:all .5s}
.list-box:hover h2{color:#389ad4}

/*六圖六文*/
.page-content{max-width: 1140px;margin:0 auto;margin-top: 50px;}
.page-content table{max-width:100%}
.imgg{max-width:100%;display:block;margin:1em 0}
.imgg2{max-width:100%;display:block}
.tx01{clear:both;margin-bottom: 20px;word-break: break-all;word-wrap: break-word;}
.tx01+.tx01{border-top: 1px dashed #eeee;padding-top: 30px;}
.tx02{clear:both;overflow:hidden;margin-bottom:2em;word-break: break-all;word-wrap: break-word;}
.tx01 img{margin-bottom:1em}
.tx01 p{word-break: break-all;word-wrap: break-word;}
.img-left,.img-left1{float:left;padding-bottom:1em;padding-right:2em;max-width:50%;}
.img-right,.img-right1{float:right;padding-bottom:1em;padding-left:2em;max-width:50%}
.img_center{width:33.3%}
.img-left img,.img-right img{max-width:100%}
.img-left1 img,.img-right1 img{max-width:100%}
.img_center img{float:left;padding:1em;width:100%;text-align:center}

/*頁尾*/
.ft-list ul{list-style:none;padding-left: 0;display: flex;font-size: .9rem;margin-top: 10px;}
.ft-list ul li{margin-right: 20px;color:#5f5d5d;position: relative;}
.ft-list ul li:not(:last-child):before{content:'';position:absolute;right: -10px;bottom: 4px;width:1px;height: 12px;background: #a2a2a2;}
footer{color: #5f5d5d;border-bottom: 5px solid #bf8d20;}
.top,.down{display:flex;align-items:center;justify-content: space-between;}
.top{flex-direction: row-reverse;}
.top-left img{max-width:200px;}
.ft-info{padding:80px 0px;background: #f1f0ef;}
.map-info h3{color:#bd782f}
.map-info p{margin-bottom:0;}
.copyright{background: #d5d3d3;color: #5f5d5d;padding:5px 0px;font-size:.9rem;text-align: center;}
.copyright a{color: #5f5d5d;}

/*RWD*/
@media screen and (min-width: 991px){
    .nav-rwd{display:none}

}
@media screen and (max-width: 991px){
/*主選單*/
header .header-top ul li:nth-child(1),header .header-top ul li:nth-child(2){display:none;}
.border-width{margin:0 20px}
.navbar-expand-lg .navbar-nav .nav-link{text-align:center;padding:20px;border-bottom:1px solid #eee;}
.navbar-expand-lg .navbar-nav .nav-item:last-child .nav-link{margin-left:0;}
header .navbar{padding:0 20px}
.about-title span{font-size:5rem;width: 100%;top: 0;}
/*banner*/
.ix-banner{padding:5px}
.ix-banner .slick-dots{bottom:10px;z-index:10;text-align:center;padding-right:0}
.banner-slogan{position:absolute;left:5%;bottom:20%;z-index:10;color:#fff;border-left:3px solid #389ad4;padding-left:20px}
.banner-slogan h3{font-size:1.8rem}
.banner-slogan p{font-size:1.4rem}
/*產品與服務*/
.title-block p.intro{padding-left:25px}
.ix-pdt-list{display:grid;grid-template-columns:repeat(2,1fr)}
.question{display:grid;grid-template-columns:repeat(2,1fr)}
/*進階服務*/
.list-zone {display: grid;grid-template-columns: repeat(2,1fr);}
.list-box:nth-child(4n){border-right:1px solid #eee;}
.list-box:nth-child(2n){border-right:none}
/*人才招募*/
.career-list {display: grid;grid-template-columns: repeat(2,1fr);}
/*常見問題*/
.block-height .main-title{padding-left:20px;margin-bottom:20px}
/*最新消息*/
.twoColumns__list{grid-template-columns: repeat(1,1fr);}
/*側選單*/
.sidebar ul li a{border-left:none;border-bottom:3px solid #eee;padding-left: 0;padding-bottom: 10px;width: 100%;font-size: .9rem;}
.sidebar ul li.active a, .sidebar ul li:hover a{border-left:none;border-bottom:3px solid #389ad4}
.qa-box{width:100%;padding-left:0;margin-top:30px;}
.sidebar{width: 100%;float: inherit;/* position: relative; */top: 80px;text-align: center;}
.sidebar ul{background:#fff;box-shadow:0px 10px 10px rgb(0 0 0 / 0.05)}
.sidebar ul li{padding:10px 0px;margin-bottom: 0;}
.sidebar button{display:block;width: 100%;padding: 10px;border: none;background: #389ad4;color: #fff;}
/**login*/
.ix-login .login-box{display:flex;flex-wrap:wrap}
.ix-login .login-box .login-left,.login-right{width:100%}
/*頁尾*/
.top,.down{flex-wrap:wrap;justify-content:center;align-items:center;text-align:center}
.top-left img{margin-bottom:50px}
/*inner*/
.about-title{margin:100px 0}
}

@media screen and (max-width: 768px){
    .border-width{margin:0 10px}
    /*nav*/
    .navbar-brand img{max-width:300px}
    header .navbar{padding:0 10px}
    /*banner*/
    .ix-banner{padding:5px}
    .ix-banner .slick-dots{bottom:10px;z-index:10;text-align:center;padding-right:0}
    .banner-slogan{
    position: relative;
    left: 0;
    bottom: 20%;
    z-index: 10;
    color: #fff;
    border-left: 3px solid #389ad4;
    padding: 20px;
    background: #636363;
}
    .banner-slogan h2{font-size:1.4rem;margin-bottom:.3rem}
    .banner-slogan h3{font-size:1.4rem;margin-bottom:.3rem}
    .banner-slogan p{font-size:1.2rem}
    /*產品與服務*/
    .title-block p.intro{border:solid 0 transparent;padding-left:25px}
    .ix-pdt-list{display:grid;grid-template-columns:repeat(2,1fr)}
    .question{display:grid;grid-template-columns:repeat(1,1fr)}
    /*常見問題*/
    .block-height .main-title{padding-left:20px;margin-bottom:20px}
    /*最新消息*/
    .listItem__title{display: block;}
    .listItem__date{margin-right: 0;margin-bottom: 10px;}
    /*登入*/
    .ix-login .login-box{display:flex;flex-wrap:wrap}
    .ix-login .login-box .login-left,.login-right{width:100%}
    /**login*/
    .ix-login .login-box{display:flex;flex-wrap:wrap}
    .ix-login .login-box .login-left,.login-right{width:100%}
    .login-left{font-size:1.6rem;text-align:center}
    /**頁尾**/
    .top,.down{flex-wrap:wrap;justify-content:center;align-items:center;text-align:center}
    .top-left img{margin-bottom:50px}
    /*inner*/
    .block-info h3{font-size:1.2rem}
    .block-info p{letter-spacing:1px}
    .about-title{margin:70px 0}
    .pic-web{display:none}
    .pic-phone{display:block}

     .service-info{width:100%;margin-top:30px;}
}
@media screen and (max-width:640px){
    .img-left,.img-left1,.img-right,.img-right1{float:inherit;max-width:100%;padding: 0;}
    header .header-top{padding: 5px;text-align:center;}
    header .header-top ul{justify-content:center;}
    header .header-top ul li{margin-left:15px;}
    header .header-top ul li:after{right:-8px}
    /*最新消息*/
    .listItem__text{    display: block;}
    .listItem__text figure{width: 100%;margin-right: 0;margin-bottom: 10px;}
    /*人才招募*/
.career-list {display: grid;grid-template-columns: repeat(1,1fr);}
}
@media screen and (max-width: 480px){
    .border-width{margin:0 10px}
    /*nav*/
    header .navbar{padding:0 10px}
    .navbar-brand img{max-width:200px}
    /*banner*/
    .ix-banner{padding:5px}
    .ix-banner .slick-dots{bottom:10px;z-index:10;text-align:center;padding-right:0}
    .banner-slogan{/* position:absolute; *//* left:5%; *//* bottom:15%; */z-index:10;color:#fff;border-left:3px solid #389ad4;padding-left:20px;}
    .banner-slogan h2{font-size:1.4rem}
    .banner-slogan h3{font-size:1rem}
    .banner-slogan p{font-size:.8rem}
    .ix-banner .slick-dots{bottom:3px}
    .about-title h3{font-size:1.2rem}
    /*進階服務*/
    .list-zone {display: grid;grid-template-columns: repeat(1,1fr);}
    .list-box{border-right:none;border-bottom:1px solid #eee;padding-bottom:20px;}
    /*產品與服務*/
    .title-block p.intro{border:solid 0 transparent;padding-left:25px}
    .ix-pdt-list{display:grid;grid-template-columns:repeat(1,1fr)}
    .question{display:grid;grid-template-columns:repeat(1,1fr)}
    /*常見問題*/
    .block-height .main-title{padding-left:20px;margin-bottom:20px}
    .main-title h2{font-size:1.4rem}
    .main-title p{font-size:.8rem}
    .question-box h3{font-size:20px}
    .question-box p{font-size:16px}
    /**login*/
    .ix-login .login-box{display:flex;flex-wrap:wrap}
    .ix-login .login-box .login-left,.login-right{width:100%}
    .login-left{font-size:1.5rem;text-align:center}
    /**頁尾**/
    .block-height{padding-bottom:50px}
    .top,.down{flex-wrap:wrap;justify-content:center;align-items:center;text-align:center}
    .ft-info{padding:40px 0}
    .ft-list ul{flex-wrap:wrap;justify-content: center;}
    .top-left img{margin-bottom:30px}
    .top-right h3{font-size:1.5rem}
    .top-right p{font-size:1.2rem;letter-spacing:1px}
    /*inner*/
    .block-info h3{font-size:1.3rem}
    .block-info p{font-size:1.2rem;letter-spacing:1px}
    .about-title{margin:40px 0}

   
}