@charset "utf-8";

/* CSS Document */
body{font-family: 'Noto Sans SC', Arial, sans-serif;font-size:16px;line-height: 1.75;color:#333;font-weight: 300;overflow-x: hidden;letter-spacing: .05em;padding-top: 0;}
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}
*{ backface-visibility: hidden; -wetkit-backface-visibility: hidden;}
img{max-width:100%;}
/*---------------------- 基礎設定 ----------------------*/
/*反白設定
::selection { background: #666; color: #FFF; }
::-moz-selection { background: #666; color: #FFF; }
*/
.alert_line{border-color: #d40023;}
.red{color: #d40023;}
/* img{max-width: 100%;} */
/* 回頂端 */
#goTop{display:none;cursor:pointer;position:fixed;z-index: 10;bottom: 6rem;right:1rem;width:64px;height:64px;line-height:64px;text-align:center;color: #caa971;background:#fff;border: solid 1px #caa971;border-radius:100%;/* box-shadow:rgba(0,0,0,.5) 0 0 5px; */}
#goTop:hover{background: #caa971;color:#FFF;}

/*按鈕*/
.btnWrap { margin:2em 0; text-align:center; }

/*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;}
/*---------------------- 頁面開始 ----------------------*/

/*全頁佈局*/
.wrapper { padding:2rem 0; }
.container{max-width:1280px}
.wrapper--page01{overflow: hidden;background: linear-gradient(45deg, rgb(0 34 62 / 80%), rgb(0 34 62 / 61%)),url(../images/index/bg.png) #eeeeee;background-attachment: fixed;background-size: cover;background-position: center top;color: #fff;}
/* 選單 */
.navbar{background: #fff;padding:0;box-shadow: 0 0 .5rem rgba(0,0,0,.5);border-top: solid 2px #caa971;flex-wrap: nowrap;}
.navbar-brand{display: flex;align-items: center;padding:.5rem 0;margin-left: 1rem;color: #caa971;text-transform: uppercase;}
.navbar-brand p{margin-bottom:0;font-size: 1.25rem;line-height:1;}
.navbar-brand small{display:block;margin-top:.25rem;font-size: .7em;letter-spacing: 1.5em;}
.brandImg{max-width: 60px;margin-right:1rem}
.navbar .navbar-brand .sub{max-width: 283px;position: relative;top: 1px;}
.navbar-brand .sub2{height:1.5rem;margin-left:1rem}
.navbar .nav-item{position:relative}
.navbar .nav-item+.nav-item::before{content:'';opacity:.7;position:absolute;left:1rem;top:0;width: calc(100% - 2rem);height:1px;background:#caa971;}
.navbar .nav-item .nav-link{padding: 1.75rem 1.25rem;}

.navbar .tel .nav-link{color: #9d7a40;font-weight:500}
.navbar-nav .nav-item .nav-link.dropdown-toggle::after{border:none;width:8px;height:8px;margin-left: .5rem;border-right:solid 1px #666;border-bottom:solid 1px #666;transform:rotate(45deg);transition:all .3s linear;}
.navbar-nav .nav-item .nav-link.dropdown-toggle.show::after{transform:rotate(-135deg) translate(-75%,0)}
.navbar-nav .nav-item .nav-link{position:relative;z-index: 1001;display: flex;align-items: center;height: 100%;}
.navbar-nav .nav-item .nav-link::before{content:'';position:absolute;left:50%;bottom:0;width: 100%;height: 4px;background:transparent;transform: translate(-50%,0);transition:all .3s cubic-bezier(0.165,0.84,0.44,1);}
.navbar-nav .nav-item .nav-link.show,
.navbar-nav .nav-item .nav-link:hover{color: #caa971;}
.navbar-nav .nav-item .nav-link.dropdown-toggle.show::after,
.navbar-nav .nav-item .nav-link.dropdown-toggle:hover::after{border-color: #caa971;}
.navbar-nav .nav-item .nav-link:hover::before, .navbar-nav .nav-item .nav-link.show::before {background: #caa971;}

.navbar .mailBig{}
.navbar .mailBig .nav-link{display: flex;height: 100%;padding: .75rem 1.25rem;background: #caa971;flex-direction: column;justify-content: center;text-align: center;color:#fff;font-size:.9rem;}
.navbar-nav .nav-item.mailBig .nav-link::before{display:none}
.navbar .mailBig .nav-link:hover{background:#9d7a40;color:#fff}
.mailBig .nav-link i{font-size:1.5rem;}

.navbar-nav .nav-item .dropdown-menu{margin-top:0;padding: 1.5rem;border-radius:0;border:none;text-align:center;background: rgb(245 238 225 / 90%);transition:all 1s cubic-bezier(0.165,0.84,0.44,1);}
.dropdown-menu .dropdown-item{position: relative;z-index:1;padding: .5rem 1rem;text-align: left;white-space: normal;border:solid 1px transparent;/* max-width: 140px; *//* margin: 0 auto; */}
.dropdown-menu .dropdown-item::before{content:'';position:absolute;z-index:1;left:0;top:50%;width:6px;height:6px;background: #caa971;border-radius:3rem;transform:translate(-50%,-50%);-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear}
.dropdown-menu .dropdown-item:hover{background: rgb(202 169 113 / 0.3);border-color:#caa971}
.dropdown-menu .dropdown-item:hover::before{height: 100%;background: #caa971;}
.menuToggle{position: relative;z-index: 999;display: inline-block;vertical-align: middle;border:none;background:transparent;width: 3.5rem;height: 3rem;margin-right: 1rem;padding: 0;}
.menuToggle,.menuToggle:focus,.menuToggle__line,.menuToggle__line:focus{outline:none}
.menuToggle__line{display: block;width: 100%;height: 2px;margin: .5rem 0 .5rem auto;background: #c7a770;-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear;transform-origin: center;}
.menuToggle__line:nth-child(1){width:100%}
.menuToggle__line:nth-child(2){width:100%}
.menuToggle__line:nth-child(3){width:100%}
.menuToggle:hover .menuToggle__line{width:100%}
.menuToggle:not(.collapsed) .menuToggle__line{margin:0;width:100%}
.menuToggle:not(.collapsed) .menuToggle__line:nth-child(1){transform:rotate(-45deg)}
.menuToggle:not(.collapsed) .menuToggle__line:nth-child(2){transform:rotate(45deg)}
.menuToggle:not(.collapsed) .menuToggle__line:nth-child(3){display:none}

/* banner */
.banner{position:relative;margin-bottom: 0!important;margin-top: 114px;}
.pdtBanner,.pageBanner,.aboutArea--1{margin-top: 114px;}
.banner__item{position: relative; overflow: hidden;display: block;height: calc(100vh - 114px);}
.banner__item .bannerPicBox{position: absolute;left: 0;top: 0;width: 100%;height: 100%;background-size: cover;background-position: center;}
.slick-cloned .bannerPicBox,
.slick-active .bannerPicBox{-o-animation: grow 15s  linear 10ms infinite;-webkit-animation: grow 15s  linear 10ms infinite;-moz-animation: grow 15s  linear 10ms infinite;animation: grow 15s  linear 10ms infinite;transition:all 0.2s ease-in-out;}
@-o-keyframes grow{
  0% { transform:scale(1)}
  100% { transform:scale(1.1)}
}
@-webkit-keyframes grow{
  0% { transform:scale(1)}
  100% { transform:scale(1.1)}
}
@-moz-keyframes grow{
  0% { transform:scale(1)}
  100% { transform:scale(1.1)}
}
@keyframes grow{
  0% { transform:scale(1)}
  100% { transform:scale(1.1)}
}
.bannerSlogan{position: absolute;left: 50%;top: 50%;width: 100%;max-width: 1320px;padding: 1rem;transform: translate(-50%,-30%);}
.bannerSlogan .bannerSlogan__title{margin-bottom: 1rem;color: #caa971;font-size: 4rem;text-shadow: 2px 2px 6px rgb(0 0 0 / 50%);/* text-shadow: 1px 1px 1px rgb(255 255 255), 0.25rem 0.25rem 0.5rem rgb(0 0 0 / 50%); */font-weight: 700;}
.bannerSlogan .bannerSlogan__info{max-width: 600px;margin-bottom: 1.5rem;padding: 0 .5rem;color:#fff;font-size: 1.25rem;line-height: 1.5;text-shadow: 0 0 6px rgb(0 0 0 / 50%);font-family: 'Lato','微軟正黑體',sans-serif;}
.bannerSlogan--bgWhite{}
.bannerSlogan--bgWhite .bannerSlogan__title{color:#a97e33;text-shadow:none;text-shadow:0.25rem 0.25rem 1.5rem #fff, 0 0 0.5rem #fff}
.bannerSlogan--bgWhite .bannerSlogan__info{color:#343a40;text-shadow:none;font-weight:400}

.slick-dots{position:absolute;left:0;right:0;bottom:0;margin-bottom: 1rem;}
.slick-dots li{width: auto;height: auto;margin:.25rem;}
.slick-dots li button{width: 4rem;height: 6px;padding: 0;background: #ccc;-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear}
.slick-dots li button:before{content: '';width:100%;height:100%;display: none;}
.slick-dots li button:hover, .slick-dots li button:focus, .slick-dots li.slick-active button{background:#caa971}

.slider.slick-slider .slick-arrow{z-index: 1;transform:rotate(45deg);}
.slider .slick-prev,.slider .slick-next{width:50px;height:50px}
.slider.slick-slider .slick-prev{left: 2rem;border-left: solid 2px #caa971;border-bottom: solid 2px #caa971;}
.slider.slick-slider .slick-next{right: 2rem;border-right: solid 2px #caa971;border-top: solid 2px #caa971;}
.slider.slick-slider .slick-prev::before,.slider.slick-slider .slick-next::before{content: '';display:none}
.slick-dotted.slick-slider{margin-bottom: 0;}
/* 單元banner */
.pageBanner{min-height: 350px;position:relative;}
.pageBanner__mask{position:absolute;background: rgb(52 58 64 / 0.5);width: 100%;height: 100%;top: 0;left: 0;}
.pageBanner__title{position: absolute;bottom: 2rem;padding: 1.5rem;right: 10%;background: #caa9717a;}
.pageBanner__title h2{color: #fff;font-size: 3rem;letter-spacing: .25em;font-weight: 400;text-shadow: 2px 2px 6px rgb(0 0 0 / 50%);}

/*麵包屑*/
.breadcrumbBox{background: #343a40;}
.breadcrumb{background: #343a40;text-align:right;justify-content: flex-end;border-radius: 0;margin-bottom: 0;color: #fff;}
.breadcrumb li{margin-left:.5rem;}
.breadcrumb a{color:#fff}
.breadcrumb .active{color: #ccae70;}

/* 按鈕 */
.btnStyle{position:relative;z-index: 1;padding: .75rem 2.5rem;display:inline-block;border: 1px solid #caa971;color: #ffffff;overflow: hidden;/* font-weight: 700; */background: rgb(202 169 113 / 46%);text-shadow: 0 0 5px rgb(0 0 0 / 70%);background: #343a40;}
.btnStyle span{position: absolute;z-index: -1;left: 0;top: 0;width: 100%;height: 100%;display: block;background: rgb(52 58 64);}
.btnStyle span::before,.btnStyle span::after{position:absolute;z-index:-1;content:'';-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear;}
.btnStyle span::before{display: block;width: 80px;height: 80px;border-radius: 100px;background-color: #caa971;border: solid 1px #caa971;right: 0;top: 100%;transform: translate(15%,-40%);opacity: .25;}
.btnStyle span::after{background-size:cover;width:16px;height:16px;bottom: 0;left: 0;width: 0;height: 0;border-style: solid;border-width: 0 40px 80px 40px;border-color: transparent transparent #cbad6c transparent;opacity: .25;}
.btnStyle:hover{text-decoration:none;color:#fff;background:rgba(202, 169, 113, 0.5)}
.btnStyle:hover::before{width:0}
.btnStyle:hover span{/* background:#caa971 */}
.btnStyle:hover span::before{transform:scale(1.75);background: #caa971;opacity: .8;}
.btnStyle:hover span::after{transform: rotate(-55deg) scale(1.25) translate(0rem,-1rem);border-color: transparent transparent #caa971 transparent;opacity: .5;}

/* 跑動圈圈 */
.animationBorder {width: 50vw;height: 50vw;position: absolute;z-index: 1;top: 60%;right: 0;transform: translate(20%,-40%);}
.animationBorder::before, .animationBorder__circle::after { content: ""; display: block; border-radius: 50%; position: absolute; }
.animationBorder::before {width: 100%;height: 100%;border: 1px dashed #caa971;background: rgb(255 214 144 / 22%);/* background: rgb(255 255 255 / 8%); */background: linear-gradient(135deg, rgb(202 169 113 / 25%), rgb(0 34 62 / 0%));}
.animationBorder__circle {position: absolute;display: block;width: 71.5%;height: 71.5%;top: 50%;left: 50%;transform: translate(-50% , -50%);animation: section2-rotate 20s linear infinite;}
.animationBorder__circle::after {width: 7px;height: 7px;background: #caa971;}

@keyframes section2-rotate {
	0% {transform:translate(-50% , -50%) rotate(270deg);}
	50% {transform:translate(-50% , -50%) rotate(-100deg);}
	100% {transform:translate(-50% , -50%) rotate(270deg);}
}
.animationLogoIcon2{display: block;width: 0;height: 0;border-style: solid;border-width: 0 70px 120px 70px;border-color: transparent transparent rgb(202 169 113 / 15%) transparent;}

/* footer */
footer{background:#343a40;/* padding: 20px; */font-family: 'Lato','微軟正黑體',sans-serif;text-align: center;}
footer .ftTop{padding: 1rem 10rem 1rem 1rem;}
footer .ftTop .navbar-brand{display: block;text-align:center;width: 100%;margin-left: 0;justify-content: center;padding: .5rem 1rem;padding-right: 0;}
footer .ftTop .navbar-brand img{display:inline-block;}
footer .ftTop .navbar-brand .brandImg{width: 20%;max-width: 75px;}
footer .ftTop .navbar-brand .brandImg{display: inline-block;vertical-align: middle;/* margin:0 auto 1rem */}
footer .ftTop .navbar-brand .sub{width: 80%;}
footer .companyInfo{margin: 0;padding: 1rem;list-style:none;}
footer .companyInfo .tt{font-weight:700}
footer .companyInfo li{padding: 0;}
footer .companyInfo i{display: inline-block;width: 16px;margin-right:.5rem}
footer .companyInfo i img{opacity:.6}
footer,footer a{color: #caa971;color: rgba(255,255,255,.7);}
footer a:hover{color: #ecd7b4;color: rgba(255,255,255,.9);text-decoration:none;}
.copyright{display: block;/* margin-top:1rem; */padding: 1rem;border-top:dotted 1px rgb(255 255 255 / 0.2);font-size:.9rem;}
.copyright a{display:block}


.contactBlock{position:relative;z-index:1;padding-top: 4rem;/* background: #eee; *//* background: linear-gradient(to right, #caa971, #00223e); */background: #333;overflow: hidden;}
.contactBlock::after{content:'';position:absolute;z-index:-1;left: 0;right: 10%;top: 4rem;bottom:0;background:#333;background: linear-gradient(to right, #caa971, #00223e);transform: skew(-30deg) translateX(0%);}
.contactBlock .virtual{pointer-events: none;position: absolute;left:0;top: 0;bottom: 4rem;width: 50%;/* height:100%; */overflow: hidden;display: block;margin: 0 auto;text-align: center;color: #caa971;transform:skew(-30deg) translateX(-15%);}
.contactBlock .virtual:before,.contactBlock .virtual:after{content:"";position:absolute;z-index: 1;top:0;bottom:0;left:0;right:0;background: #caa971;opacity:.5;-o-transition:all .3s ease-in-out;-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;transition:all .3s ease-in-out;}
.contactBlock .virtual:before{-webkit-transform:skew(0) translateX(-70%);transform:skew(0) translateX(-70%)}
.contactBlock .virtual:after{-webkit-transform:skew(-0) translateX(-50%);transform:skew(-0) translateX(-50%)}

.contactBlock .virtual__bg{display:block;width: 130%;height: 100%;background-image: url('../images/all/contact-1.png');background-position: right;background-attachment: fixed;background-size: cover;transform:skew(30deg);}

.contactBlock .virtual .virtual__inner{position: absolute;z-index: 1;left: 0;top: 0;width: 100%;height: 100%;display: block;background: rgb(52 58 64 / 0.5);/* background: linear-gradient(to right, rgb(202 169 113 / 0.6), rgb(0 34 62 / 0.8)); *//* text-shadow: 0 0 .5rem rgba(0,0,0,.5); */}
.contactBlock .virtual .virtual__inner:before,.contactBlock .virtual .virtual__inner:after{content:"";position:absolute;z-index: 2;top:0;bottom:0;left:0;right:0;background: #caa971;background: linear-gradient(-135deg, rgb(202 169 113 / 70%) 40%, hsl(38deg 47% 32% / 30%)),url(../images/all/contact.png);box-shadow: 0 0 20px rgb(0 0 0 / 50%);opacity:.5;-o-transition:all .3s ease-in-out;-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;transition:all .3s ease-in-out;}
.contactBlock .virtual .virtual__inner:before{-webkit-transform:skew(60deg) translateX(-100%);transform:skew(60deg) translateX(-100%)}
.contactBlock .virtual .virtual__inner:after{-webkit-transform:skew(-0) translateX(-90%);transform:skew(-0) translateX(-90%)}

.contactBlock:hover .virtual:before{-webkit-transform:skew(60deg) translateX(-20%);transform:skew(60deg) translateX(-20%);-webkit-transition-delay:.05s;transition-delay:.05s}
.contactBlock:hover .virtual:after{-webkit-transform:skew(-0) translateX(-10%);transform:skew(-0) translateX(-10%)}
.contactBlock:hover .virtual .virtual__inner:before{-webkit-transform:skew(60deg) translateX(-40%);transform:skew(60deg) translateX(-40%);-webkit-transition-delay:.15s;transition-delay:.15s}
.contactBlock:hover .virtual .virtual__inner:after{-webkit-transform:skew(-0) translateX(-30%);transform:skew(-0) translateX(-30%);-webkit-transition-delay:.1s;transition-delay:.1s}

.contactBlock .arrowArea{position: relative;}
.contactBlock .arrow{position:relative;display: inline-block;}
.contactBlock .arrow span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:block;width:30px;height:30px;border-bottom:5px solid #caa971;border-right:5px solid #caa971;transform:rotate(-45deg);animation:animate 2s infinite}
.contactBlock .arrow span:nth-child(2){animation-delay:-.2s}
.contactBlock .arrow span:nth-child(3){animation-delay:-.4s}

.contactBlock__box{position:relative;z-index: 1;display:block;padding: 6vw 1rem;text-align: center;color: #fff;}
.contactBlock__box .inner{}
.contactBlock__box .tt{position: relative;z-index: 3;margin: 0;font-size: 3rem;letter-spacing: .25em;font-weight: 400;}
.contactBlock__box .en{font-size:1.25rem;margin-bottom:.5rem}
.contactBlock__box:hover{color:#fff}
@keyframes animate {
  0%{opacity:0;transform:rotate(-45deg) translate(30px,30px)}
  50%{opacity:1}
  0%{opacity:0;transform:rotate(-45deg) translate(-50px,-50px)}
}
.contactBlock:hover .virtual .arrow span{border-color: #fff;}

/* 標題 */
.titleBox{}
.titleBox::after{content: '';display: block;width: 2rem;height: 3px;margin: 2rem 0;background-color: #caa971;}
.titleBox__sub{color: #caa971;font-weight: 500;font-size: 1.25rem;}
.titleBox__mj{font-weight:500;font-size:2.5rem}
.titleBox__mj .mj{color: #caa971;}
mark{padding-left:1rem;padding-right:1rem;background: #caa971;color: #fff;border-radius:3rem}
.titleBox__mj--1,.titleBox__sub--1{font-size:2rem}
.titleBox__date{color: #caa971;font-weight: 500;font-size: 1rem;margin: 1rem 0;line-height: 1.2;}
.titleBox__date span{font-size:1rem}
/* 定位 */
.proArea{position: relative;}
.proArea__dot{position: absolute;top: 0;}
.defaultImg{opacity: 0;}

/* layout 列表樣式--共同 */
.layoutLis{position:relative;z-index:2;list-style-type:none;margin:0;padding:0;/* display:flex; *//* flex-wrap:wrap; *//* margin-left:-1rem; *//* margin-right:-1rem */}
.layoutLis *{transition: all .3s cubic-bezier(0.165,0.84,0.44,1);}
.layoutLis__item{display: block;position:relative;}
.layoutLis__item .picBox{position: relative;z-index: 2;/* width: 50%; *//* margin-top: 2rem; *//* margin-right: 2rem; */background-size:auto 100%;background-repeat:no-repeat;background-position:center;transition:all 1s cubic-bezier(0.165,0.84,0.44,1);/* box-shadow: 0 0 1rem rgba(0,0,0,.5); */overflow: hidden;box-shadow: 0.5rem 0 2rem -0.5rem rgb(0 0 0 / 30%), -1rem -1rem 0 #caa971;border-radius: 5px;}
.layoutLis__item .picBox img{width:100%;transition: all 5s cubic-bezier(0.165,0.84,0.44,1);}
.layoutLis__item:hover .picBox img{transform:scale(1.15)}
.layoutLis__item:hover .picBox{background-size:auto 105%}
.iconPlay{position:relative;color:#C7000B}
.iconPlay img{height:1.75rem}
.iconPlay::after{content:'read more';opacity:0;position:absolute;top:50%;left:100%;width:100px;text-transform:uppercase;font-style:normal;font-size:.6rem;color:#fff;-webkit-transition:all 1s cubic-bezier(0.165,0.84,0.44,1);transition:all 1s cubic-bezier(0.165,0.84,0.44,1);-webkit-transform:translate(-3rem,-50%);transform:translate(-3rem,-50%)}
.iconPlay:hover::after{opacity:1;-webkit-transform:translate(0.5rem,-50%);transform:translate(0.5rem,-50%)}
a:hover .iconPlay::after{opacity:1;-webkit-transform:translate(0.5rem,-50%);transform:translate(0.5rem,-50%)}

/* layout 列表樣式1(首頁-產品列表) */
.layoutLis--1{display:block}
.layoutLis--1 .layoutLis__item{-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear}
.layoutLis--1 .layoutLis__item .infoBox{position: relative;z-index: 1;padding: 3rem 2rem;display: flex;flex-wrap: wrap;flex-direction: column;justify-content: space-between;align-items: flex-start;}
.layoutLis--1 .layoutLis__item .infoBox::before{position:absolute;z-index: -1;bottom: 0;right: 0;width: 100%;height: 100%;background: #ffffff;background: linear-gradient(220deg, #ffffff 50%, #caa971);-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear;box-shadow: 2rem 0 3rem -2rem rgb(0 0 0 / 30%);transform: skew(-10deg);}
.layoutLis--1 .layoutLis__item .infoBox__title{font-size: 1.75rem;font-weight: 700;margin-bottom: 0;color: #c7a670;}
.layoutLis--1 .layoutLis__item .infoBox__title::after{content:'';width:1em;height: 4px;background:#caa971;display:block;margin: 1rem 0;}
.layoutLis--1 .layoutLis__item .infoBox__txt{margin-bottom:0;color: #fff;}
.layoutLis--1 .layoutLis__item .picBox{background-size: cover;box-shadow: 0 0 1rem rgb(0 0 0 / 50%);box-shadow: 0.5rem 0 2rem -0.5rem rgb(0 0 0 / 30%), -1rem -1rem 0 #caa971;margin-top: 2rem;/* border: solid 4px #caa971; */}
.layoutLis--1 .layoutLis__item .picBox__img{opacity: 0;}
.layoutLis--1 .layoutLis__item{position: relative;padding: 1rem 0;}

.layoutLis--1 .layoutLis__item:nth-child(even) .infoBox::before{transform: skew(10deg);}

/* layout 列表樣式2(製造商) */
.layoutLis--2{}
.layoutLis--2 .layoutLis__item{margin:10rem 0}
.layoutLis--2>li{}
.layoutLis--2 .infoBox{padding:2rem}
.layoutLis--2 .infoBox__title{position:relative}
.layoutLis--2 .infoBox__title::before{content:'';position:absolute;left:-2rem;top:50%;height: .9em;width: .5rem;background:#caa971;transform: translate(0,-50%);}
.layoutLis--2>li:nth-child(even) .layoutLis__item{flex-direction: row-reverse;}

/* layout 列表樣式3(我們的團隊) */
.layoutLis--3{grid-gap: 45px;display: flex;flex-wrap: wrap;}

.layoutLis--3>li{width: calc(100%/2 - 22.5px);position: relative;}
.layoutLis--3 .picBox{overflow:hidden}
.layoutLis--3 .infoBox{margin-top:1rem;position: absolute;bottom: 0;left: 0;background: #36363685;color: #fff;padding: .5rem 1rem;width: 100%;}
.layoutLis--3 .infoBox p{margin-bottom:0}
.layoutLis--3 .infoBox span{position:absolute;left50%;transform:translate(0,0)}
.layoutLis--3 .infoBox__title{font-size: 1.5rem;}
.layoutLis--3 .category span{padding: 0 .5rem;background:#fff;letter-spacing:3px;margin-left: .5rem;}
.layoutLis--3 .dateBox{justify-content:space-between;display: inline-block;padding: .5rem;background: #caa971;color: #fff;position: absolute;text-align: center;z-index: 10;top: -10px;left: -10px;}
.layoutLis--3 .dateBox p{margin-bottom:0;font-size: 1.5rem;font-weight: bold;}
.layoutLis--3 .dateBox p.year{font-size: .9rem;}
.layoutLis--3__link{position:relative;/* overflow: hidden; */display:block}
.layoutLis--3__link:hover img{transform:scale(1.1)}
.layoutLis--3__link img{transition:all 5s cubic-bezier(0.165,0.84,0.44,1)}
/*layout 列表樣式4*/
.layoutLis--4{/* grid-gap: 20px; */}
.layoutLis--4 li{max-width: 1200px;margin: 2rem auto;text-align: center;}
.layoutLis--4 li figure{margin-bottom:0}
.layoutLis--4 li img{/* width:900px; */}
/*首頁*/
.ixBlock{position: relative;padding: 3rem 0;}
.ixBlock__box{}

.ixBlock--about{
    background: #caa971;
    background: linear-gradient(to right, #caa971, #00223e);
    color: #ffffff;
    text-shadow: 0 0 6px rgb(0 0 0 / 50%);
    overflow: hidden;
    min-height: 100vh;
}
.ixBlock--about .ixBlock__inner{display: flex;flex-wrap: wrap;align-items: center;padding: 8rem 1rem 0;}
.ixBlock--about .innerBox{width: 50%;}
.ixBlock--about .innerBox--info{font-size: 1.25rem;text-align: center;}
.ixBlock--about .innerBox--pic{text-align: center;}
.ixBlock--about .mjPic {position:relative;z-index:1}
.ixBlock--about .slogan{/* padding: 2rem 0; */color: #ffcd78;/* text-shadow: 0 0 6px rgb(0 0 0 / 50%); */font-size: 1.5rem;}
.ixBlock--about .slogan::after{content: '';display: block;width: 2rem;height: 3px;margin: 2rem auto;background-color: #ffcd78;}
.ixBlock--about .animationLogoIcon2{position:absolute;right: 35%;top: 50%;/* opacity: .2; */transform: scale(4) rotate(0deg);}
.ixBlock--about .titleBox{color: #ffcd78;text-shadow: 0 0 6px rgba(0,0,0,.5);text-align: center;}
.ixBlock--about .titleBox::after{background-color:#ffcd78;margin-left: auto;margin-right: auto;}
.ixBlock--about .titleBox__sub,
.ixBlock--about .titleBox__mj .mj{color: #ffcd78;text-shadow: 0 0 6px rgba(0,0,0,.5);}
.ixBlock--about .innerBox--info p{text-align:left}
.ixBlock--product{overflow: hidden;background: linear-gradient(45deg, rgb(0 34 62 / 80%), rgb(0 34 62 / 61%)),url(../images/index/bg.png) #eeeeee;background-attachment: fixed;background-size: cover;background-position: center top;}
.ixBlock--product .titleBox{color:#fff}
.ixBlock--product .titleBox::after{display: none;}
.ixBlock--product .animationBorder--top{top: 0;transform: translate(20%,-79%);}
.ixBlock--product .animationBorder--top::before{border-color: #ccc;background: linear-gradient(135deg, rgb(193 193 193 / 25%), rgb(245 245 245 / 0%));opacity: .9;}
.ixBlock--product .animationBorder--top .animationBorder__circle::after{background:#ccc;}

.ixBlock--product .animationBorder--bottom{right: inherit;left: 0;transform: translate(-30%,5%);width: 80vw;height: 80vw;}
.ixBlock--product .animationBorder--bottom::before{opacity: .9;transform: translate(10px, 10px);}
.slickMultiple.layoutLis{display: block;margin-bottom: 0;}
.slickMultiple .slick-dots{position:absolute;left:0;right:0;bottom:0}
/* .ixBlock--product .slick-slider .slick-arrow{transform:rotate(45deg)}
.ixBlock--product .slick-slider .slick-prev{border-left:solid 1px #000;border-bottom:solid 1px #000;}
.ixBlock--product .slick-slider .slick-next{border-right:solid 1px #000;border-top:solid 1px #000;}
.ixBlock--product .slick-slider .slick-prev::before,.ixBlock--product .slick-slider .slick-next::before{content: '';display:none}
.slick-slide img{width: 100%;}
 */

/*產品*/
.pdtBanner{overflow: hidden;display: block;position:relative}
.pdtBanner .btnStyle{}
.pdt-linkBox{position: absolute;left: 50%;bottom: 24%;width: 100%;max-width: 1320px;padding: 0 3rem;transform: translate(-50%,0);}

.pdtBanner__img{-o-animation: grow 15s  linear 10ms infinite;-webkit-animation: grow 15s  linear 10ms infinite;-moz-animation: grow 15s  linear 10ms infinite;animation: grow 15s  linear 10ms infinite;}
.brandArea{display:flex;/* background:#eee; */margin-bottom: 2rem;/* box-shadow: 0 1rem 3rem -1rem rgb(0 0 0 / 30%); */border-radius: 1rem;overflow: hidden;}
.brandArea>*{width:50%}
.brandArea__infoBox{padding:2rem;}
.brandArea__picBox{/* background: #eee; */}

/* 我們的團隊標題樣式 */
.brandArea--1{justify-content:center;text-align:center;padding: 0 2rem;}
.brandArea--1 .titleBox::after{margin:2rem auto}
.brandArea--1 .infoBox__txt{text-align:left}
.brandArea--1 .brandArea__infoBox{max-width: 800px;width: 100%;padding: 2rem 0;}
/*關於我們*/
.aboutArea--1{background: url(../images/about/aboutbg.png) no-repeat;position: relative;background-position: 40% 0;background-size: cover;}
.aboutArea--1 .container{/* position:absolute; *//* top: 50%; *//* left: 50%; *//* transform: translate(-50%, -50%); */display: flex;align-items: center;min-height: calc(100vh - 114px);padding: 1rem;}
.aboutArea__textBox{color:#fff;max-width: 660px;text-shadow: 0 0 6px rgb(0 0 0 / 50%);font-size: 1.25rem;}
.aboutArea__textBox h2{font-size: 2.5rem;margin-bottom: 1rem;color: #ffcd78;position: relative;}
.aboutArea__textBox h3{margin-bottom:3rem;color: #ffcd78;}
/* .aboutArea__textBox .dot{font-family: '微軟正黑體', Arial, sans-serif;font-weight: 700;} */
.aboutTitle{font-size: 2.5rem;text-align: center;color: #fff;position: relative;padding: 0 1rem;}
.aboutTitle:after{content: '';display: block;width: 2rem;height: 3px;margin: 2rem auto;background-color: #caa971;}
.aboutArea--2{background: linear-gradient(45deg, rgb(0 34 62 / 80%), rgb(0 34 62 / 61%)),url(../images/index/bg.png) no-repeat;position: relative;background-attachment: fixed;padding: 5rem 0;}
.aboutArea--2:before{position: absolute;top: 188px;bottom: 0;left: 50%;width: 2px;margin-left: -1px;content: "";background: rgba(255, 255, 255, 0.07);}
.aboutArea__item{display: flex;/* margin-bottom: 3rem; */opacity: .3;transition: all .3s linear;align-items: center;}
.aboutArea__item.active{opacity:1}
.aboutArea__item.active figure{transform:scale(1)}
.tag{transform: translateY(-750px);}
.aboutArea__item:nth-child(even){margin-left:auto;flex-direction: row-reverse;}
.aboutArea__item:nth-child(even) h3{text-align:right}
.aboutArea__itemText,.aboutArea__item figure{width:50%;position: relative;} 
.aboutArea__item figure{transform:scale(.9);transition: all .3s linear;padding: 5rem;}
.aboutArea__itemText{padding:0 0 0 3rem;color:#fff}
.aboutArea__itemText h3{color: #ffcd78;font-size: 2.5rem;}
.aboutArea__itemText h3 span{font-size: 2rem;letter-spacing: 0;color: #fff;}
.aboutArea__item:nth-child(even) .aboutArea__itemText{padding:0 3rem 0 0 }
.aboutArea__item figure:after{content:"";position: absolute;width: 2px;height: 30px;right: -1px;top: 50%;/* background: #fff; */}
.aboutArea__item:nth-child(even).aboutArea__item figure:after{left:-1px}
/*聯絡我們*/
.contact-form{max-width: 800px;margin:0 auto;padding: 2rem;border-radius: 1rem;box-shadow: 0 0 1rem rgb(0 0 0 / 50%);}
.contact-form h3{font-size:1.5rem;color: #caa971;/* text-align: center; */margin-bottom: 1.5rem;}
.contact-form h3 span{font-size:1rem}
.form-group{margin-bottom:1rem}
/*頁碼*/
.paginationBar small{color: #666;}
.pagination{justify-content:center;margin:2em 0 0;-ms-flex-wrap: wrap;flex-wrap: wrap;letter-spacing: 0;}
.pagination .page-item{margin-bottom:.5em;}
.pagination .page-item + .page-item{margin-left:.5em}
.pagination .page-item .page-link,.page-item:first-child .page-link{border-radius:0}
.pagination .page-item .page-link{border-color: #f2f2f2;color: #343a40;text-align:center;padding: .5rem 1rem;}
.pagination .page-item .page-link:hover{background: #f2f2f2;}
.pagination .page-item .page-link.ten{width:auto;padding-left: 5px;padding-right: 5px;font-size: .8rem;}
.page-item.active .page-link{background: #343a40;color: #fff;border-color: #343a40;}
.page-item.disabled .page-link{color:#6c757d}
.page-item.active .page-link:hover{background: #343a40}
/* 6圖文 */
.pageContent{}
.pageContent table { max-width:100%;}
.tx01 {clear: both;margin-bottom: 2rem;}
.img-left img, .img-right img { max-width:100%; }
.img-left:only-child,.img-right:only-child{float:none;padding: 0;margin: auto;max-width: inherit;text-align: center;}
.embed-responsive{margin-bottom:2rem}
@media screen and (max-width: 1250px) {
  /*header*/
  .brandImg{max-width:50px}
  .navbar .navbar-brand .sub{max-width: 245px;}
  .navbar .nav-item .nav-link{padding:1rem}
  .banner,.pdtBanner,.pageBanner,.aboutArea--1{margin-top:101px}
  .banner__item{height: calc(100vh - 101px);}
  .aboutArea--1 .container{min-height: calc(100vh - 101px);}
  /*footer*/
  footer .ftTop{flex-direction: column;padding-right: 1rem;padding-bottom: 10rem;}
  .ftTop__right{padding-left: 0 !important;padding-top:1rem;width: 100% !important;}
}

@media screen and (max-width: 1140px) {
  /*header*/
  .brandImg{max-width: 40px;}
  .navbar .navbar-brand .sub{max-width: 198px;}
  .navbar .nav-item .nav-link{padding: 1rem .75rem;}
}
@media screen and (max-width: 1030px) {
  /*header*/
  .navbar .nav-item .nav-link{padding: 1rem .5rem;}
}
@media screen and (max-width: 991px) {
  /*header*/
  .brandImg{max-width: 60px;}
  .navbar .navbar-brand .sub{max-width: 283px;}
  .navbar-collapse{position:absolute;top: 84px;background: #fff;overflow: auto;max-height: 60vh;}
  .navbar .nav-item .nav-link{padding:1.25rem }
  .navbar-nav .nav-item .nav-link::before{display:none}
  .navbar .mailBig .nav-link{flex-direction:row;font-size: 1.25rem;padding: .5rem 1.25rem;/* justify-content: flex-start; */}
  .navbar .mailBig .nav-link i{margin-right:.5rem}
  /*banner*/
  .pageBanner__title{padding: .5rem 1rem;right: inherit;left: 1rem;}
  .banner,.pdtBanner,.pageBanner,.aboutArea--1{margin-top: 87px;}
  .aboutArea--1 .container{min-height: calc(100vh - 87px);}
  .banner__item{height: calc(100vh - 78px);}
  /*首頁*/
  .ixBlock--about .ixBlock__inner{flex-direction:column}
  .ixBlock--about .innerBox{width:100%;}
  .ixBlock--about .innerBox--pic img{width: 120px;}
  /*產品*/
  .pdt-linkBox{bottom:0}
  /*footer*/
  .contactBlock .virtual__bg{background-attachment: unset;}

}
@media screen and (max-width: 768px) {
    /* layout 列表樣式1 */
    .layoutLis--1 .layoutLis__item{padding:1rem}
    .layoutLis--1 .layoutLis__item .container{padding:0;border-radius:1rem;overflow:hidden}
    .layoutLis--1 .layoutLis__item .infoBox__title{font-size: 1.25rem;}
    .layoutLis--1 .layoutLis__item .infoBox__txt{}
    .layoutLis--1 .layoutLis__item .picBox{margin-top:0}

  /* banner */
  .bannerSlogan{padding-left:2.5rem;padding-right:2.5rem}
  .bannerSlogan .bannerSlogan__title{font-size: 6.5vw;}
  .bannerSlogan .bannerSlogan__info{font-size: 1.25rem;}
  .slider .slick-prev, .slider .slick-next{width:30px;height:30px}
  .slider.slick-slider .slick-prev{left:1rem}
  .slider.slick-slider .slick-next{right:1rem}
  
  /*footer*/
  .contactBlock__box{padding: 15vw 1rem 25vw;}
  .contactBlock .virtual__bg{background-position: 49% 0;}

  /* 選單 */
  .navbar-brand .sub2{display:none}

  /* 聯絡我們 */
  .contactBlock .virtual{/* margin:1rem auto; */left: 0;bottom: 0;}
  .contactBlock{padding-top:0;}
  .contactBlock .virtual .virtual__inner{padding: 15vw 1rem 20vw;}
  .contactBlock::after{left: 0;right: 0;top: 0;bottom:0;background:#333;background: linear-gradient(to right, #caa971, #00223e);transform: skew(0) translateX(0%);}

  /*產品*/
  .brandArea{display:block;}
  .brandArea>*{width:100%}
  
  /* layout 列表樣式2 */
  .layoutLis--2>li{margin-bottom:1rem}
  .layoutLis--2>li:nth-child(even){/* background:#eee; */}
  /* layout 列表樣式3 */
  .layoutLis--3{flex-direction: column;}
  .layoutLis--3>li{width:100%}

  /*關於恩施*/
  .aboutArea__item,.aboutArea__item:nth-child(even){flex-direction: column;}
  .aboutArea__item:nth-child(even) h3,.aboutArea__itemText{text-align:center;padding: 0;}
  .aboutArea__itemText,.aboutArea__item figure{width:100%;}
  .aboutArea__item figure{padding:3rem}
  .aboutArea__item:nth-child(even) .aboutArea__itemText{padding:0}
  .aboutTitle,.aboutArea__itemText h3{font-size:1.75rem}
  .aboutArea__itemText h3 span{font-size:1.5rem}
  .aboutArea__item figure{transform:scale(1)}
  .aboutArea__item{opacity:1}
}
@media screen and (max-width: 640px){
  
  /*header*/
  .brandImg{max-width: 40px;}
  .navbar .navbar-brand .sub{max-width: 190px;}
  .navbar-collapse{top:53px;max-height:90vh}
  /*banner*/
  .banner,.pdtBanner,.pageBanner,.aboutArea--1{margin-top:58px}
  .banner__item{height: calc(100vh - 58px);}
  /*首頁*/
  .proArea__dot{top:6.5rem;}
  .layoutLis--1 .layoutLis__item .infoBox{padding: 2rem 0;}
  footer .ftTop .navbar-brand .sub{max-width: 268px;}
  footer .ftTop .navbar-brand .brandImg{max-width: 52px;}
  /*單元內頁*/
  .pageBanner__title h2{font-size: 2rem;}
  .titleBox__mj{font-size:2rem}
  .tag{transform: translateY(-104px);}
  /*about*/
  .aboutArea--1{background-position: 34% 0;}
  .aboutArea--1 .container{min-height:calc(100vh - 58px):}
  .aboutTitle{font-size: 1.4rem;}
  .aboutTitle:after{margin:1rem auto}
}

@media screen and (min-width: 769px) {
  /* 6圖文 */
  .img-left{float: left;margin-right: 2em;max-width:50%;}
  .img-right{float: right;margin-left: 2em;max-width:50%;}
  
  /* footer */
  footer .ftTop{display:flex;align-items: center;text-align:left}
  footer .ftTop .navbar-brand{width: 30%;margin-right: 0;/* min-width: 300px; */padding: 0.5rem 1rem;}
  .ftTop__right{width: 70%;flex: 1 1 auto;display: flex;flex-wrap: wrap;padding-left: 2rem;justify-content: space-between;}
  footer .companyInfo{width: calc(100% / 4);}
  .copyright{display: flex;justify-content: space-between;width:100%}

  /* layout 列表樣式1 */
  .layoutLis--1 .layoutLis__item{padding: 3rem 0;}
  .layoutLis--1 .layoutLis__item .container{display:flex;align-items: flex-start;margin: auto;}
  .layoutLis--1 .layoutLis__item:nth-child(even) .container{flex-direction: row-reverse;}
  .layoutLis--1 .layoutLis__item:nth-child(even) .infoBox::before{right:inherit;left:0}
  .layoutLis--1 .layoutLis__item .infoBox{width: 50%;max-width: 700px;}
  .layoutLis--1 .layoutLis__item .infoBox::before{width: 140%;/* border-radius: 2rem; */}
  .layoutLis--1 .layoutLis__item .picBox{width: 50%;/* border-radius: 50%; */overflow: hidden;border-radius: 5px;/* border: 3px solid #c6a56f; */}
  .layoutLis--1:hover .layoutLis__item .container{opacity:.3}
  .layoutLis--1:hover .layoutLis__item:hover .container{opacity:1}

  /* layout 列表樣式2 */
  .layoutLis--2 .layoutLis__item{display: flex;align-items: center;}
  .layoutLis--2 .layoutLis__item>*{width: 50%;}
  
}
@media screen and (min-width: 992px) {
  body{padding-top: 0;}

  /* 選單 */
  .navbar{padding-right:0}
  .navbar-nav .nav-item .dropdown-menu{display:flex;-ms-flex-wrap:wrap;flex-direction: column;align-content: center;flex-wrap:wrap;opacity:0;pointer-events:none;left: 0;width: 290px;min-width: 170px;transform: translate(-1rem,-30px);box-shadow: 0 .5rem 1rem -2px rgb(0 0 0 / 50%);-webkit-backdrop-filter: blur(3px);backdrop-filter: blur(3px);}
  .navbar-nav .nav-item .dropdown-menu.show{opacity:1;pointer-events:inherit;transform: translate(-1rem,0);}
  .navbar .nav-item+.nav-item::before{left: 0;top:50%;width:1px;height: 21%;transform:translateY(-50%);}
}