.hand{display:none; padding:20px; margin:20px; font-size:16px;}
/*layout reset*/
.head-left{ width: 30%; float: left;  }
.head-right{ width: 70%; display: flex; flex-direction: column; align-items: flex-end; }
.non-float{ float: unset!important;}

/*reset*/
.attr-nav {margin-left: 0!important;}
nav.navbar.attr-border .attr-nav{ border-left: unset; }
.logo{ width: 80%; }
nav.navbar.bootsnav ul.nav > li > a{ padding: 10px 15px; margin-bottom: 20px; }
.about-area .about-content .info h2::after{ content: unset!important; }
.product-p1 button.owl-prev{    position: relative;  left: -50%;}
.product-p1 button.owl-next{ border: unset;   position: relative; ; right: -50%;}
.product-p1 .owl-theme .owl-nav [class*=owl-]{ background: transparent!important; color: #E0DCDA!important;font-size: 36px!important;}
.product-p1 .owl-theme .owl-nav{ margin-top: -18%; position: relative; }

.product-p2 button.owl-prev{    position: relative;  left: -50%;}
.product-p2 button.owl-next{ border: unset;   position: relative; ; right: -50%;}
.product-p2 .owl-theme .owl-nav [class*=owl-]{ background: transparent!important; color: #E0DCDA!important;font-size: 36px!important;}
.product-p2 .owl-theme .owl-nav{ margin-top: -13%; position: relative; }
nav.navbar.attr-border .attr-nav{ min-height: 57px; }
.attr-nav > ul > li{ padding: 37px 0 11px 0; }
footer .f-item h4{ font-weight: 900; font-size: 24px; }
.text-light h1, .text-light h2, .text-light h3, .text-light h4, .text-light h5, .text-light h6, .text-light p, .text-light a{ color: #AF7E46;}
.breadcrumb-area .breadcrumb a, .breadcrumb-area .breadcrumb li{ color: #AF7E46; font-weight: 900; }
.breadcrumb-area .breadcrumb li.active{color: #000;}
.breadcrumb-area .breadcrumb::after{ background: transparent;}
.breadcrumb-area .breadcrumb li::after{ border: unset; content: '▸'; margin-top: -12px!important;}
.breadcrumb-area h1{ font-size: 30px;  margin-left: 11px; }
.breadcrumb-area .breadcrumb{ padding: unset;}
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover{ background-color: #282623; border-color: #fff;}
.pagination>li>a, .pagination>li>span{ color:  #ccc; }
nav.navbar.bootsnav.navbar-default.navbar-fixed.navbar-transparent.inc-topbar{margin-top: 0!important; }
nav.navbar.bootsnav {  box-shadow:unset!important;}
.portfolio-area .effect-left-swipe a i{  background: transparent none repeat scroll 0 0!important;  color: #fff!important;}
.effect-left-swipe > a{ right: 10px!important; top:5px!important; }

 

/*tool*/
.none{display: none!important;}
.text-d-s{text-decoration:line-through;}
.justify{ text-align: justify!important; }
.clear{ clear:both; }
.f-36{ font-size: 36px; }
.f-30{ font-size: 30px; }
.f-24{ font-size: 24px; }
.f-20{ font-size: 20px; }
.f-18{ font-size: 18px!important; }
.f-12{ font-size: 12px!important; }
.f-16{ font-size: 16px; }
.c-000{ color:#000; }
.c-fff{ color:#fff!important; }
.c-1D2D90{ color:#1D2D90; }
.c-604C3F{color: #604C3F;}
.c-AF7E46{color: #AF7E46;}
.c-808080{ color:#808080!important; }
.bgc-535d97{ background-color: #535d97; }
.bgc-fff{ background-color: #fff; }
.bg-888{background-color: #888888;}
.bg-3443a4{ background-color: #3443a4; }
.bg-000{ background-color: #000; }
.bg-ccc{ background-color: #ccc!important; }
.line-h-1{line-height:2!important;}
.width-90{ width:90%; margin: auto;}
.width-80{ width:80%; margin: auto;}

.m-open{ display: none; }
.f-w-900{ font-weight: 900!important; }
.f-w-700{ font-weight: 700!important; }
.pd-10{ padding:10px!important; }
.pd-50{ padding:50px; }

.pb-20{ padding-bottom:20px; }
.pb-40{padding-bottom: 40px;}
.mb-20{ margin-bottom: 20px;}
.mb-30{margin-bottom: 30px!important;}
.mb-50{margin-bottom: 50px!important;}
.mt-50{ margin-top:50px; }
.mt-30{ margin-top:30px; }
.mr-20{ margin-right:20px; }
.ml-20{ margin-left:20px; }
.height-233{ height: 233px;}

.inline-block{display: inline-block;}
.block{ display: block; }
.t-boder-b{ border-bottom:1px solid #4C4B4B; }

.t-boder-t{ border-top:1px solid #AF7E46; }
.border-000{border: 1px solid #000;}
.radius-non{ border-radius: unset!important;}
.float-r{ float: right;}
.float-l{ float: left;}
.clear{ clear:both: }
/*btn*/
.letter-s{ letter-spacing: 5px;}
.move-l{ position: relative;  }
.move-l .move-box-o >span{  transition-property: margin-left; transition-timing-function: ease ;  transition-duration: 0.5s; }
.move-l:hover .move-box-o >span{ margin-left:10px;  }
.move-box-o{ width: 25px; height: 20px; overflow: hidden; display: inline-block;}
.table-rwd{ overflow-x: auto; }
/*box-img 1x1*/
.box-img{ overflow: hidden; width: 100%; padding-top:100%; position: relative; }
.box-img img{  position: absolute;left: 50%;top: 50%; transform: translate(-50%, -50%); }
/*box-img 16x9*/
.box-img-16-9{ overflow: hidden; width: 100%; padding-top:calc( 9 / 16 * 100% + 45px ); position: relative; }
.box-img-16-9 img{  position: absolute;left: 50%;top: 50%; transform: translate(-50%, -50%); }
/*box-img 5x4*/
.box-img-5-4{ overflow: hidden; width: 100%; padding-top: calc( 4 / 5 * 100% ) ; position: relative; }
.box-img-5-4 img{  position: absolute;left: 50%;top: 50%; transform: translate(-50%, -50%); }
/*box-img 4x5*/
.box-img-4-5{ overflow: hidden; width: 100%; padding-top: calc( 5 / 4 * 100% ) ; position: relative; }
.box-img-4-5 img{  position: absolute;left: 50%;top: 50%; transform: translate(-50%, -50%); }
/*article set*/
.max-w-800 img{ max-width: 800px; }


.product-p1 .icon ,.product-p2 .icon{display: block; height: 50px; overflow: hidden;}
.btn-230524{ padding: 12px 20px;  display: inline-block;  border-radius: 50px;  border:1px solid #000; color: #000; overflow: hidden; }
.mask-btn{ position: absolute; top: 0; left: 0; transition-property: width; width: 0; height: 300px;    transition-timing-function: ease ;  transition-duration: 0.5s;}
.btn-230524:hover >.mask-btn{ width: 100%; background-color: #000; z-index: -100;}
.btn-230524:hover{ color:#fff ;}
body .about-area .about-content .info .btn-position-b{ margin-top:calc( 100% / 4); }
body .about-area .about-content .info .btn-position-b-en{ margin-top:100px; }
.btn-230524-2{ padding: 32px 0px;  display: inline-block; font-size: 24px; border-radius: 50px;   color: #000; overflow: hidden; }

.news-list{ padding: 0; list-style: none; }
.news-list li{ border-bottom:1px solid #4C4B4B;  }
.news-list li a{  display: flex; margin: 15px 0 5px 0;  }
.news-list li a p{  transition: margin-left;transition-timing-function: ease ;  transition-duration: 0.5s; font-size: 20px;color: #000; font-weight: 700; line-height: 2.4; }
.news-list li:hover > a{ margin-left: 30px; }
.news-c-title{margin-left: 180px;}
.p1-t-icon{display: block;}
.en-title-s{ display: block; }
.product-2-title{ align-items: center;display: flex;justify-content: space-between;}
.shape01{ width:10px; height:20px; display: inline-block; background-color: #000; margin-right: 10px; }
.f-item a{ font-size: 16px; font-weight: 500; color:#6A6766; }
.f-item ul{padding: 0; margin: 0;}
.f-item li{ margin-bottom: 10px; }
.f-icon{ display: flex; margin-top: 16px;}
.f-icon li{ margin-right: 10px; }
.f-add{width: 119px; }
.f-add-en{width: 119px; margin-right: 16px; }
.f-phone{ letter-spacing: 41px;}
.f-phone-en{ letter-spacing: 4px;}
.f-phone-last{margin-right: 20px;}
.f-phone-last-en{margin-right: 20px;}
.f-fax{ letter-spacing: 19px;}
.f-fax-last{margin-right: 20px;}
.txt-indent-2{text-indent: 2em;}


/*pagetop*/
.breadcrumb-area{ position: relative; background-position: center; padding: 0 0 430px 0; }
.page-top{ display: block;  bottom: -240px; position: relative;  background: linear-gradient(0deg,#ffffffdb 31%,#ffffff57 76%,#ffffff00 100%); padding: 94px 40px 30px 40px;  }
.top-info{ display: inline-block; padding: 20px; }
.page-line{  }
.page-line-mo{ animation-name: page-line-mo; animation-fill-mode: forwards; animation-delay: 1s; animation-duration: 1s; transition: all 2s ease-out;  }
@keyframes page-line-mo{ from {transform: translateY(-200px); }to {transform: translateY(0px); }}
.page-line img{ position: absolute; }
.line-1{ left: -74px; top:42%; }
.line-2{ left: -242px;  top: 56% }
.line-3{ left: -154px; top:62%; }
.move-line-1{ animation-name: line1; animation-fill-mode: forwards; animation-delay: 0.1s; animation-duration: 1s; transition: all 2s ease-out; }
@keyframes line1{ from {transform: translate(-74px); }to {transform: translate(74px); }}
.move-line-2{ animation-name: line2; animation-fill-mode: forwards; animation-delay: 0.2s; animation-duration: 2s; transition: all 2s ease-out; }
@keyframes line2{ from {transform: translate(-242px);}to {transform: translate(242px);} }
.move-line-3{ animation-name: line3; animation-fill-mode: forwards; animation-delay: 0.3s; animation-duration: 2s; transition: all 2s ease-out; }
@keyframes line3{ from {transform: translate(-154px);}to {transform: translate(154px);} }

/*aboutpage*/
.circle-a{ z-index: 99; border-radius: 50%; width: 200px; height: 200px; ; margin:auto;  }
.circle-a p{ color: #4c59a4;transition: color 0.5s ease-out 100ms; font-size: 30px; text-align: center; transform: translateY(356%); }
.circle-a:hover > p{color: #fff;}
.circle-a::after{ z-index: -99; content: ''; width:3px; height:50px; display: block; background-color: #dcdcdc; position: absolute; top: 200px; left: 50%; }
.circle-a::hover{ animation-name: circlea; animation-fill-mode: forwards; animation-delay: 0.1s; animation-duration: 1s; transition: all 2s ease-out;}

.hover-co{ background-color: #dcdcdc; transition: background-color 0.5s ease-out 100ms; }
.hover-co:hover{ background-color: #535d97;  }
.hover-co:hover::before{opacity: 0; content: ''; animation-name: ho1; animation-fill-mode: forwards; animation-delay: 0.3s; animation-duration: 2s; transition: all 2s ease-out; width:3px; height:50px; z-index: -1;position: absolute; top: 199px; left: 50%; background-color:#535d97 ; }
@keyframes ho1{  from {transform: translateY(-50px); opacity: 0;}to {transform: translateY(0px);opacity: 1;} }

.about-txt ul li{ font-size: 20px; color:#535d97; font-weight: 800; text-align: center; }
.about-txt ul{ padding: 50px 0;  margin:auto ; }

/*page*/
.page-news-2305 h3{ margin-top:30px;  }
.page-news-2305 .page-news-time{margin-bottom: 30px;}
.page-news-2305 p{ font-size: 18px; color:#000; margin:15px 30px 15px 0; line-height: 1.8; }

.flex-product-c{    display: flex;align-items: center; justify-content: center;}
.page-products-main{ transition: background-color 0.5s ease-out 100ms; }
.page-products-main a:hover{ background-color:#404a7f; }
.page-products a:hover{ border:1px solid #535d97; background-color: #535d97; }
.page-products h3{ font-size: 18px; }
.page-products a:hover > h3{color: #fff;}
.page-products a img{ margin-bottom: 20px; }
.p-type p{ padding: 3px 12px; background-color: #535d97; color:#fff; display: inline-block; margin-right: 15px; margin-bottom: 30px; }
.p-txt p span{ float: left; color: #000; font-size: 18px; margin-bottom: 30px; }
.product-main-info-bottom p{ font-size: 18px; line-height: 1.8; color:#000; }
.product-tt td{ border:1px solid #000; padding: 5px 10px; text-align: center; color:#000; }
.contact-info{display: flex;flex-direction: column;flex-wrap: wrap;align-content: center;justify-content: center;height: 600px;}
.contact-info h2{ margin-bottom: 100px; }
.contact-info p ,.contact-info a{ color:#000; font-size: 18px;line-height: 2.2; }



/*----*/
.mt-head-main{ margin-top: 59px; }
.mt-head-logo{ margin-top: 30px; }
.width-free{ width:97%; }
.search-top{ display: inline-block; background-color: #fff; width: 100px;  margin-top: 9px;  border: 1px solid #ccc; border-radius: 30px;  }
.search-btn{ position: absolute;right: 0px;top: 47px;border: 1px solid #959595;border-radius: 100px;background-color: #ededed; }
.attr-nav input{ width: 55px;padding-left: 20px; font-size: 14px;  height: 20px; min-height: 37px!important; overflow: hidden; border: unset!important;}
.meta{  padding: 15px 0 ; }
.txt-height{ height:40px; overflow: hidden; }
.txt-height-service{ height:50px; overflow: hidden; }

.block-shadow{box-shadow: 1px 1px 5px 2px #ccc;}
.news-info{ padding: 20px;   }
.index-title{ padding: 5px 0; border-bottom: 1px solid #eee; width: 98%; margin: auto;}
.padding-non{ padding: unset!important; }
.margin-r-30{margin-right: 30px;}
.shadow-non{ shadow-box: unset!important;}
.news-img-1{ overflow: hidden; width: 100%; padding-top: calc( 4 / 5 * 100% - 155px ) ; position: relative; }
.news-img-1 img{ width: 100%;  position: absolute;left: 50%;top: 50%; transform: translate(-50%, -50%); }
.news-img-2{ overflow: hidden; width: 100%; padding-top: calc( 4 / 5 * 100% - 74px ) ; position: relative; }
.news-img-2 img{ width: 100%;  position: absolute;left: 50%;top: 50%; transform: translate(-50%, -50%); }

.brand-img{ overflow: hidden; width: 100%; padding-top: calc( 9 / 16 * 100% + 45px ) ; position: relative;}
.brand-img img{ width: 100%; position: absolute;left: 50%;top: 50%; transform: translate(-50%, -50%); }
.page-service-img{ overflow: hidden; width: 100%; padding-top: calc( 9 / 16 * 100% + 45px ) ; position: relative;}
.page-service-img img{ width: 100%; position: absolute;left: 50%;top: 50%; transform: translate(-50%, -50%); }
.page-notice-img{ overflow: hidden; width: 100%; padding-top:100% ; position: relative;}
.page-notice-img img{width: 100%; position: absolute; right: 0;top: 0; }
.gallery-img{ overflow: hidden; width: 100%; padding-top: calc( 9 / 16 * 100% + 40px ) ; position: relative;}
.gallery-img img{  position: absolute; top: 0; left: 0;}
.page-lens-img{ overflow: hidden; width: 100%; padding-top:100% ; position: relative; }
.page-lens-img img{ width: 100%; position: absolute;left: 50%;top: 50%; transform: translate(-50%, -50%); }

.notice-txt{ display:flex; color:#000; line-height:1.8; text-align: justify;}
.page-about-txt-l{ display: flex;align-items: center; margin-bottom: 50px;  }
.page-about-txt-l p{ color: #000; line-height: 2;}
.page-about-txt-l span{ text-align: end;}
.page-about-txt-r{ display: flex;align-items: center; flex-direction: row-reverse; margin-bottom: 50px; }
.page-about-txt-r p{ color: #000; line-height: 2;}
.page-about-txt-r span{ text-align: end; }
.page-news-main img{  max-width: 800px; }
.page-news-main p{font-size: 18px; color: #000;}
.lens-pic-max img{ max-width: 900px; }
/*購物車模板設定*/
.product-checkout{ padding:50px 0; }
.product-checkout p{ line-height: 2; }
.product-right{ padding:50px 0; }
.shipping{ display: flex; }
.shipping span{ padding-left: 70px; }
.frame-p-info img{ max-width: 900px; }
.frame-p-info{ padding-bottom: 100px;}
.special{ font-size: 30px; color:#000; }
.original{ color:#ccc; }
.product-checkout .page-price{ display: flex;  align-items: center;}
.page-tips{width: 100%; margin-bottom: 50px; border: 1px solid #ccc; padding: 20px; border-radius: 10px;max-height: 160px; overflow-x: auto;}
.page-tips p{line-height: 0.8!important; }
.btn-add{ padding: 10px 20px; border: 1px solid #000; color:#000 }
.nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover{ color: #000;  border-bottom: 3px solid #000;  background-color: transparent!important;}
.nav-pills>li{ border: unset!important; }
.nav-pills>li>a{ border-radius: unset!important; }
.tab-content-info{ padding: 50px 0; }
.tab-pane .info p{ font-size: 18px; line-height: 1.5; }

/*car*/
.num-bt{ display: flex; }
.num-bt .num{ color:#AF7E46; }
.pp-block{ display: flex; margin-bottom: 30px;}
.pp-block select{  width: 100px; }
.pp-block .num-bt .minus , .pp-block .num-bt .plus{ border: 1px solid #AF7E46; color: #AF7E46; background-color: transparent;}
.minus ,.plus{width: 30px; height: 30px; border-radius: 50%;}
.price{width: 170px;}

/*shopping-list*/
.shopping-step{width: 100%; margin: auto; margin-bottom: 80px;}
.shopping-step ul{ list-style: none; display: flex; justify-content: center; }
.shopping-step ul li{ background-color: #ccc; color:#fff; box-shadow: 1px 1px 4px #888; padding:10px 120px; font-size: 18px; letter-spacing:3px ; font-weight: 900; }
.shopping-step ul li.active{ background-color: #AF7E46; }
.submit{ padding:5px 20px; background-color: #AF7E46;  border: unset; color: #fff;}
.revise{ padding:5px 20px; background-color: #ccc; border: unset; color: #000;}

.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th{     border-top: 1px solid #dcdcdc;  }
.tden{ background-color: #b79b7a; color:#fff; font-size: 18px; text-align: center; }
.tdens{ font-weight: 900; font-size: 18px; text-align: center; padding: 30px; }
.car-align{ padding: 30px!important;}

.list-finish{ width: 100%; border: 1px solid #AF7E46; padding: 30px;  margin-bottom: 100px;}
.list-finish p{ font-size: 20px; color: #AF7E46; text-align: center;}

/*login*/
.bg-AF7E46{background-color: #AF7E46;}
.login{ width: 30%; margin:auto; display: block;  border: 1px solid #AF7E46; padding: 20px 50px;}

/*register*/

.register{  width: 50%; margin:auto; display: block;}
.register button{ border: unset; color: #fff; background-color:#AF7E46 ; }


/*-----*/
.index-bg-area{ background-image: url("assets/img/index-bg1.jpg"); background-attachment:fixed ; padding: 150px 0;}
.bg-info-0831 img{display: block; margin: auto; width: 700px;}

.process-pic{ max-width: 180px; display: block; margin: auto;}
.f-items p{ padding: 0!important; margin:0!important; color:#fff; }
.f-logo{margin-bottom: 30px;}
.arrow{position: relative;bottom: -3px;right: 0;height: 20px;width: 80px;display: block;  }
.arrow::after{content: '';position: absolute;top: 10px;width: 67px;height: 2px;background-color: #ccc;}
 .arrow::before{content: '';position: absolute;margin-top: -5px;margin-left: -5px;height: 23px;top: 7px;right: 15px; width: 30px;border-right: 2px solid #ccc;transform: rotate(-45deg);}   
.meta:hover >.arrow{ transform: translateX(10px); transition:ease 0.5s all; }
.hover-box:hover{ box-shadow: 0 0 15px #ccc; transition:ease 0.5s all; }
.hover-box{ padding: 10px; }
.concept-line{ position: relative;z-index: -2; top: -60px; right: 0; display: inline-block; width: 100%; height: 2px; background-color: #131210;}
.concept-title h2{ padding: 10px; background-color: #fff; display: inline-block; position: relative; z-index: 10; }
.cs-num{margin-right: 20px;}
.cs-num p{ border-radius: 7px; background-color: #b98f6d; padding:2px 10px; font-size: 18px; color:#fff; }
.cs-txt{ display: table; }
.cs-txt h4{ margin-bottom: 5px!important; color:#b98f6d; font-weight: 900; font-size: 24px; }
.cs-txt p{ font-size: 16px; color:#000; }
.concept-fix-bg{ background-image: url(assets/img/concept/concept-fix-bg.jpg); background-attachment: fixed;  }
.concept-fix-txt h3{color: #fff; font-weight: 900; line-height: 1.8; margin:0 20px; }
.c-131210{color: #131210!important;}
.brn-230905-a{ padding: 10px 30px; border:1px solid #b98f6d; color:#b98f6d;letter-spacing: 3px; font-weight: 900; border-radius: 10px; }
.brn-230905-a-arrow{    position: relative;bottom: 21px;right: -27px;height: 0px; width: 102px;display: block;}
.brn-230905-a-arrow::after{  content: '';position: absolute;top: 10px; right: 13px;width: 37px; height: 2px; background-color: #b98f6d; }
.brn-230905-a-arrow::before{ content: ''; position: absolute;margin-top: -5px; margin-left: -5px;height: 13px; top: 14px; right: 14px;width: 30px;border-right: 2px solid #b98f6d;transform: rotate(-45deg); }
.brn-230905-b-arrow{ position: relative; bottom: 21px;right: -27px;height: 0px; width: 102px; display: block;}
.brn-230905-b-arrow::after{  content: '';position: absolute;top: 10px; right: 13px;width: 37px; height: 2px; background-color: #b98f6d; }
.brn-230905-b-arrow::before{ content: ''; position: absolute;margin-top: -5px; margin-left: -5px;height: 13px; top: 14px; right: 14px;width: 30px;border-right: 2px solid #b98f6d;transform: rotate(-45deg); }
.brn-230905-a:hover{ background-color: #282623!important; color:#fff;  }
.brn-230905-a:hover >.brn-230905-a-arrow{transform: translateX(10px);transition: ease 0.5s all;}
.brn-230905-a:hover .brn-230905-a-arrow::after{background-color: #fff; transition: ease 0.5s all; }
.brn-230905-a:hover .brn-230905-a-arrow::before{border-right: 2px solid #fff; transition: ease 0.5s all;}
.brn-230905-b:hover >.brn-230905-b-arrow{transform: translateX(10px);transition: ease 0.5s all;}
.brn-230905-b:hover .brn-230905-b-arrow::after{background-color: #fff; transition: ease 0.5s all; }
.brn-230905-b:hover .brn-230905-b-arrow::before{border-right: 2px solid #fff; transition: ease 0.5s all;}
.brn-230905-b{ position: absolute; padding: 10px 30px; border:1px solid #b98f6d; color:#b98f6d;letter-spacing: 3px; font-weight: 900; border-radius: 10px; }
.brn-230905-b:hover{ background-color: #282623!important; color:#fff; }
.concept-btn{ display:table; margin:130px auto 0 auto; transform: translateX(-50px); }
.cooperate-title p{ background-color: #282623; padding:1px 5px; display: inline-block; color:#fff; }
.cooperate-list ul li{display: flex; justify-content: center; }
.cooperate-list-info{display: flex;flex-wrap: wrap;align-content: center; justify-content: center;}
.cooperate-list-num{  background-color: #282623;  text-align: center; color: #fff!important; font-size: 30px!important; min-width: 100px; }
.cooperate-list-info p{ font-size: 20px; color:#000; padding:10px 20px; border:1px solid #282623; min-height: 100px; }
.cooperate-txt-center{ display: flex; align-content: center;justify-content: center;flex-wrap: wrap; }
.cooperate-list-title{font-weight: 900; min-width: 200px;}
.cooperate-main{ min-width: 600px; font-size: 16px!important; }
.cooperate-left-img{  display: flex; justify-content: flex-end; }
.cooperate-left-img img{ max-width: 300px; width: 100%; }
.reference-block{ overflow: hidden;  }
.reference-flex-reverse{display: flex; flex-direction: row-reverse; }
.reference-flex-reverse .cooperate-left-img{ justify-content: flex-start!important;}
.reference-flex-reverse .reference-info{ display: flex; flex-direction: column;justify-content: flex-start; flex-wrap: wrap;align-content: flex-end; }
.reference-info{padding: 30px 10px;}
.cooperate-line{     width: 50%;height: 1px; background-color: #000;display: block; position: relative; top: -34px; right: -236px;z-index: -1; }
.cooperate-line-title{    background-color: #fff; display: inline-block;}
.casetype{display: flex; justify-content: space-evenly; flex-wrap: wrap;}
.casetype-block{ width: calc( 100% / 2 - 30px ) ; margin-bottom: 30px; }
.casetype-info h3{ margin-bottom: 0px!important; margin-top: 10px; font-size: 22px; }
.br-b{ display: none; }
.spatial-title{margin-bottom: 50px; font-size: 26px;}
.spatial-block {color: #000;}
.spatial-link{ position: relative; left: 50%; transform: translateX(-50%); }
.spatial-link p{text-align: center; font-size: 20px; color: #000;}
.spatial-link a{ border: 1px solid #ccc; padding: 0 10px; display: block; margin-bottom: 30px; }
.spatial-link a:hover{ box-shadow: 0 0 10px #ccc; }
.spatial-arrow{ transform: translateX(211px);}
.spatial-link a:hover .spatial-arrow{ transform: translateX(220px); transition: ease 0.5s all;}
.sfc-ca{ box-shadow: 0 0 5px #ccc; border-radius: 20px; display: block; padding: 20px!important;}
.sfc-ca:hover{box-shadow: 0 0 20px #ccc;}
.box-img-5-4-sfc{ overflow: hidden; width: 100%; padding-top: calc( 4 / 5 * 100% - 58px ) ; position: relative; }
.box-img-5-4-sfc img{  position: absolute;left: 50%;top: 50%; transform: translate(-50%, -50%); }
.sfc-ca:hover .box-img-5-4-sfc img{ transform: translate(-50%, -50%) scale(1.3); transition: ease 0.5s all; }
.sfc-ca-p{box-shadow: 0 0 5px #ccc; border-radius: 10px; display: block; padding: 10px!important;}
.sfc-ca-p:hover{box-shadow: 0 0 20px #ccc;}
.sfc-ca-p:hover .box-img-5-4-sfc img{ transform: translate(-50%, -50%) scale(1.3); transition: ease 0.5s all; }
.sfc-main-txt{color:#000; font-size: 16px;}
.sfc-main-txt img{  max-width: 900px; }


@media(max-width: 1520px) and (min-width: 1200px ){

	/*reset*/
	.product-p1 button.owl-prev{    position: relative;  left: -50%;}
	.product-p1 button.owl-next{    position: relative;  right: -50%;}

}

@media(min-width: 1200px){ 
	nav.navbar.bootsnav ul.nav > li > a{ font-size: 18px; }
 }
@media(max-width: 1200px){
	/*reset*/
	.product-p1 button.owl-prev{    position: relative;  left: -52%;}
	.product-p1 button.owl-next{    position: relative;  right: -52%;}




	.f-add{ width: 132px;  margin-right: 20px; }

	nav.navbar.bootsnav ul.nav > li > a{ font-size: 14px; }
	.mt-head-main{      margin-top: 19px;}
}

@media(max-width: 1350px) and (min-width: 991px ){

	.navbar-header{ width: 27%!important; }
	nav.navbar.bootsnav .navbar-brand{ padding: 0px 15px 0 20px!important; }
	nav.navbar.bootsnav ul.nav > li > a{padding: 10px 10px; font-size: 16px; }
	nav.navbar.bootsnav ul.navbar-right li.dropdown ul.dropdown-menu li a{font-size: 16px!important; }

}
@media(min-width: 1024px){

	/*reset*/
	
	nav.navbar.bootsnav ul.navbar-right li.dropdown ul.dropdown-menu li a{ font-size: 18px;}
	nav.navbar.bootsnav li.dropdown ul.dropdown-menu{ width: 200px; background: rgba(255, 255, 255, 0.8);}
	nav.navbar.bootsnav ul.navbar-right li.dropdown ul.dropdown-menu li a{color: #000;}
	nav.navbar.bootsnav li.dropdown ul.dropdown-menu > li > a{     border-bottom: unset; }
	nav.navbar.bootsnav ul.nav > li > a:hover{ color:#BAA58C!important; }
	nav.navbar.bootsnav ul.navbar-right li.dropdown ul.dropdown-menu li a:hover{ opacity: 0.8; color: #BAA58C!important;}
	nav.navbar.bootsnav ul.nav > li.dropdown > a.dropdown-toggle::after{  }
	nav.navbar.bootsnav.sticked ul.nav > li > a{    padding: 10px 15px;}
	nav.navbar.bootsnav .navbar-brand{ padding: 0px 15px 0 190px; }
	nav.navbar.bootsnav.no-background.white .attr-nav > ul > li > a, nav.navbar.bootsnav.navbar-transparent.white .attr-nav > ul > li > a, nav.navbar.bootsnav.navbar-transparent.white ul.nav > li > a, nav.navbar.bootsnav.no-background.white ul.nav > li > a{color: #000; font-weight: 400!important; }
	nav.navbar.bootsnav.navbar-transparent.white .attr-nav{ border-left: 1px solid rgba(255, 255, 255, 0.0)!important; }
	nav.navbar.bootsnav.navbar-transparent.white{border-bottom: unset!important;}
	nav.navbar.bootsnav.navbar-fixed .logo-scrolled{    margin-top: 27px;}
	nav.navbar.bootsnav.navbar-transparent .attr-nav{      padding-left:0!important;   margin-left: unset!important; }

	nav.navbar.bootsnav ul.nav > li > a::before{ content: unset; transition: width 0.7s; width: 0px; height: 2px; background-color: #1D2D90; position: absolute; left: 10; bottom: 0;  }
	nav.navbar.bootsnav ul.nav > li > a:hover::before{  width: 85px; }
	nav.navbar.bootsnav ul.nav > li > a{ font-weight: 400!important; }

}

@media(max-width: 1023px){
	nav.navbar.bootsnav .navbar-nav > li > a{ border-top: unset; }
	nav.navbar.bootsnav .navbar-nav > li > a:last-child{ border-bottom: unset; }
	nav.navbar.bootsnav .navbar-nav{ margin-top: 30px; }
	.attr-nav{ float: unset!important; }
	.search-top{ width: 150px; }
	.search-btn{ top:26px; }
	.navbar-header{ z-index: -999;}
	nav.navbar.bootsnav .navbar-brand{ z-index: 1; }
	nav.navbar.bootsnav .navbar-toggle{z-index: 99; }

}

@media (max-width: 1024px){

	/*tool*/
	.m-non-float{ float: unset; }
	.m-pb-40{ padding-bottom: 50px; }
	.m-mb-50{ margin-bottom: 50px; }
	.m-mb-317{ margin-bottom: 317px!important; }

	/*layout reset*/
	.head-left{ float: unset; width: 100%; }
	.head-right{  align-items: center; justify-content: unset!important;   width: 100%; justify-content: center; margin-bottom: 15px; margin-top: -15px;}
	.logo{ width: 250px; }

	/*reset*/
	nav.navbar .navbar-brand img.logo{ height: unset; transform: translate(5%, 0%); max-width: 280px;}
	.attr-nav{     position: unset; }
	nav.navbar.bootsnav.attr-border .navbar-header{ border-bottom: unset; }
	nav.navbar.attr-border .attr-nav{    margin-left: 0px!important; padding-left: 0px!important; }
	.navbar-collapse{width: 100%;}
	nav.navbar.bootsnav ul.nav > li > a{ font-size: 20px; font-weight: 400!important; }
	nav.navbar.bootsnav ul.nav li.dropdown ul.dropdown-menu > li > a{ font-size: 18px;font-weight: 400!important; }
	nav.navbar.bootsnav ul.nav li.dropdown > ul.dropdown-menu li > a{  border-bottom: unset ; }
	

	.img-r-mail{ height:40px!important; }
	.img-r-tw{ height:33px!important; margin-top: 2px; }
	.img-r-en{ height:17px!important; }


	body .about-area .about-content .info .btn-position-b{ margin-top:50px!important; }
	.product-2-title{ flex-direction: column; align-items: flex-start;}
	.page-top{   padding: 89px 10px 30px 10px; position: relative; left: 50%; bottom: -201px; transform: translateX(-50%);  }
	.breadcrumb-area{ background-position: 0 ; padding: 0 0 166px 0!important; }


}	

@media(min-width: 991px){
	.navbar-header{ width: 37%; }
}

@media (max-width: 991px){

	/*reset*/
	.navbar-collapse{width: 100%;}
	.product-p1 button.owl-prev{    position: relative;  left: -51%;}
	.product-p1 button.owl-next{    position: relative;  right: -51%;}
	.product-p1 .owl-theme .owl-nav{ margin-top: -30%; }
	.product-p2 .owl-theme .owl-nav{ margin-top: -19%; position: relative; }
	.breadcrumb-area h1{ font-size: 30px!important;}

	/*tool*/
	.m-close{ display: none!important; }
	.m-open{ display: block!important; }
	.m-float-non{ float: unset!important; }
	.m-mt-50{ margin-top:50px; }
	.m-f-18{font-size: 18px!important;}
	.m-f-20{font-size: 20px!important;}
	.m-pb-20{padding: 20px 0!important;}
	/*article set*/
	.max-w-800 img{ max-width: 100%; width:100%; }

	.logo{ width: 98%; }
	.news-c-title{margin-left: 80px;}
	.f-add{ width: 100px;  margin-right: 0; }

	.contact-info{ padding: 10px ; }
	.news-list li a p{font-size: 16px;}
	.product-p1 .icon ,.product-p2 .icon{ height:80px; }

	.table-rwd{width: 100%;overflow-y: hidden;-ms-overflow-style: -ms-autohiding-scrollbar; }
	.table-rwd{width:100%;margin-bottom:15px;overflow-y:hidden;-ms-overflow-style:-ms-autohiding-scrollbar;border:1px solid #ddd}.product-tt>.table{margin-bottom:0}.product-tt>.table>tbody>tr>td,.product-tt>.table>tbody>tr>th,.product-tt>.table>tfoot>tr>td,.product-tt>.table>tfoot>tr>th,.product-tt>.table>thead>tr>td,.product-tt>.table>thead>tr>th{white-space:nowrap}.product-tt>.table-bordered{border:0}.product-tt>.table-bordered>tbody>tr>td:first-child,.product-tt>.table-bordered>tbody>tr>th:first-child,.product-tt>.table-bordered>tfoot>tr>td:first-child,.product-tt>.table-bordered>tfoot>tr>th:first-child,.product-tt>.table-bordered>thead>tr>td:first-child,.product-tt>.table-bordered>thead>tr>th:first-child{border-left:0}.product-tt>.table-bordered>tbody>tr>td:last-child,.product-tt>.table-bordered>tbody>tr>th:last-child,.product-tt>.table-bordered>tfoot>tr>td:last-child,.product-tt>.table-bordered>tfoot>tr>th:last-child,.product-tt>.table-bordered>thead>tr>td:last-child,.product-tt>.table-bordered>thead>tr>th:last-child{border-right:0}.product-tt>.table-bordered>tbody>tr:last-child>td,.product-tt>.table-bordered>tbody>tr:last-child>th,.product-tt>.table-bordered>tfoot>tr:last-child>td,.product-tt>.table-bordered>tfoot>tr:last-child>th{border-bottom:0}

	.index-title{ width: 90%; }
	.page-about-txt-l{flex-direction: column-reverse;}
	.page-about-txt-r{     flex-direction: column-reverse;  }
	.page-about-txt-l span{margin-bottom: 20px;}
	.page-about-txt-r span{margin-bottom: 20px;}
	.page-news-main img{  width: 100% ; }
	.lens-pic-max img{ max-width: 100%; width: 100%; }
	.shipping span{ float: unset; display: block; padding-left: unset; font-size: 16px;  }
	.frame-p-info img{ max-width: 100%; width:100%; }

	/*shopping*/
	.shopping-step ul li{ padding:10px 20px; font-size: 12px; letter-spacing: 0; }
	.car-align a{ display: block; width: 70px!important;  }

	/*login*/
	.login{ width: 90%; }


	.txt-height{ height:70px; overflow: hidden; }

	.bg-info-0831 img{ width: 260px; background-position: 66% bottom;}
	.index-bg-area{ background-image: url("assets/img/m-index-bg1.jpg"); }

	.concept-fix-bg{ background-image: url(assets/img/concept/m-concept-fix-bg.jpg);}
	.brn-230905-a{ display: block; margin-bottom: 20px;}
	.concept-btn{  transform: unset; }
	.cooperate-list ul li{ margin-bottom: 20px;}
	.cooperate-main{ min-width: 100%; }
	.cooperate-list-info p{margin-bottom: 0;}
	.cooperate-list-num{min-width: 100px;}
	.cooperate-list-title{ min-width: calc(100% - 100px); }
	.cooperate-list-info{ width: 100%; }
	.cooperate-left-img{  display: flex; justify-content: flex-start; }
	.reference-flex-reverse{ display: flex;flex-direction: row;flex-wrap: wrap; }
	.reference-main{    width: 80%;display: block; margin: auto;}
	.cooperate-line{ display: none;}

	.casetype-block{ width: 80% ; }
	.spatial-title{ font-size: 20px; }
	.br-b{ display: block; }
	.spatial-arrow{ transform: translateX(321px);}
	.spatial-link a:hover .spatial-arrow{ transform: translateX(330px); transition: ease 0.5s all;}
	.spatial-link{ width: 100%!important; }
	.sfc-main-txt img{  max-width: 100%; width:100%; height:unset!important;  }

	.news-img-1{  padding-top: calc( 4 / 5 * 100% - 40px ) ;  }
	.news-img-2{  padding-top: calc( 4 / 5 * 100% - 40px ) ;  }

	.sfc-main-title h2{ font-size: 20px; }
}

@media(min-width: 768px){
	.navbar-collapse.collapse{ display: flex; justify-content: flex-start; }
	.navbar-right{     margin-right: 0!important; }
}

@media(max-width: 768px){

	/*reset*/
	.product-p1 .owl-theme .owl-nav{ margin-top: -30%; }

	.news-c-title{margin-left: 30px;}
	.breadcrumb-area{ background-position: 15% ; }

	.process-pic{ max-width: 100%; }

	
}

@media(max-width: 598px){
	/*reset*/
	.product-p1 .owl-theme .owl-nav{ margin-top: -50%; }

	.spatial-arrow{ transform: translateX(135px);}
	.spatial-link a:hover .spatial-arrow{ transform: translateX(140px); transition: ease 0.5s all;}
}

@media(max-width: 592px){
	.product-p2 .owl-theme .owl-nav{ margin-top: -56%; position: relative; }
}