/*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;}
.re-style-flex{display: flex; justify-content: flex-end;}

/*reset*/
.attr-nav {margin-left: 0!important; min-height: 81px;}
nav.navbar.attr-border .attr-nav{ border-left: unset; }
.logo{ width: 100%;min-width: 300px; }
nav.navbar.bootsnav ul.nav > li > a{ padding: 37px 15px; color: #6b3180!important;}
nav.navbar.bootsnav ul.nav > li > a:hover{ background-color: #fff!important; color:#6b31809c!important; }
.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:  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: #6B3180;}
.breadcrumb-area .breadcrumb a, .breadcrumb-area .breadcrumb li{ color: #6B3180; 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: #e0d7e1; border-color: #fff;}
.pagination>li>a, .pagination>li>span{ color:  #6B3180; }
nav.navbar.bootsnav.navbar-default.navbar-fixed.navbar-transparent.inc-topbar{margin-top: 0!important; }
nav.navbar.bootsnav {  box-shadow:unset!important;     background-color: #fff!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; }
.panel-title{     font-size: 20px!important;}
.panel-collapse .panel-body p{ font-size: 16px!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-888{ color:#888!important; }
.c-1D2D90{ color:#1D2D90; }
.c-604C3F{color: #604C3F;}
.c-AF7E46{color: #AF7E46;}
.bg-d7643a{ background-color: #d7643a; }
.bg-269d86{ background-color: #269d86;}
.bg-af8923{background-color: #af8923;}
.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;}
.line-h-2{line-height:1.5!important;}
.width-90{ width:90%; margin: auto;}
.width-80{ width:80%; margin: auto;}
.width-70{ width:70%; margin: auto;}
.border-radius{ border-radius: 20px 20px ; }

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

.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; }
.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% - 53px ) ; 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%); }
/*contact-store-box-img 5x4*/
.contact-store-box-img{ overflow: hidden; width: 100%; padding-top: 100%; margin: auto; position: relative; background-color: #e9e9e9; }
.contact-store-box-img img{  position: absolute;left: 50%;top: 50%; transform: translate(-50%, -50%);width: 100%; height: 100%; object-fit: cover; }
/*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;}
.hidden-0824{ overflow: hidden; }

/*pagetop*/
.breadcrumb-area{ position: relative; background-position: center; padding: 0 0 240px 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; justify-content: flex-start!important; flex-direction: column;flex-wrap: wrap;align-content: flex-start;justify-content: center;}*/
.contact-info h2{ margin-bottom: 100px; }
.contact-item-block{border-bottom: 1px solid #ccc; overflow: hidden; padding-bottom: 15px;padding-top: 15px;}
.contact-item-block:last-child{ border-bottom: unset!important; }
.contact-item-block p ,.contact-item-block a{ color:#000; font-size: 16px;line-height:1.2; }
.shop-title-btn{display: flex; justify-content: space-between;align-items: center; margin-bottom: 30px;}
.shop-title-btn h4{margin-bottom: 0!important; font-size: 20px;}
.btn-shop{ border:1px solid #000; background-color: #000; color: #fff!important; padding: 5px 30px; border-radius: 50px;line-height: 1.8!important; font-size: 14px!important; }
.btn-shop:hover{ opacity: 0.7; }
.city-left-sildebar li::before{content: ''; border-left: 6px solid transparent;border-right: 6px solid transparent; border-top: 6px solid #ccc;transform: rotate(270deg); display: inline-block; width: 4px; margin-right: 15px; }
.city-left-sildebar li{transition: ease 0.8s all;}
.city-left-sildebar li:hover{transform: translateX(10px) ; }
.city-left-sildebar li{margin-bottom: 5px;}
.city-sildebar-tt{padding: 10px 30px; background-color: #6b3180;color: #fff;text-align: center; font-size: 16px!important;}
.page-shop-title-btn{ margin-bottom: 10px!important; }

.f-items .item .f-btn-00{margin-left: 15px; padding: 5px 20px; background-color: #decde9; color: #451961; border-radius: 50px; border: 1px solid #fff;font-size: 20px; }

/*----*/
.mt-head-main{ margin-top: 50px; }
.mt-head-logo{ /*margin-top: 30px; */}
.width-free{ width:97%; }
.search-top{ display: inline-block; background-color: #fff; width: 100px;  margin-top: 0px;  border: 1px solid #ccc; border-radius: 30px;  }
.search-btn{ position: absolute;right: 0px;top: 1px;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{ border-top: 1px solid #000 ; 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;  width: 98%; margin: auto;}
.padding-non{ padding: unset!important; }
.margin-r-30{margin-right: 30px;}
.shadow-non{ shadow-box: unset!important;}
.news-img{ overflow: hidden; width: 100%; padding-top: 100% ; position: relative; }
.news-img 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: 100%; }
.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:#888; text-decoration:line-through ; }
.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; font-size: 30px; margin-right: 15px; color:#000; }

/*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 ; }

/*----*/
.btn-0823{ padding: 10px 20px; background-color: #6b3180; color:#fff; border-radius: 50px; letter-spacing: 2px; }
.btn-0823:hover{ color:#ccc; }
.about-txt{ padding-top: 50px; }
.about-txt p{ font-size: 18px; margin-top: 30px; margin-bottom: 30px; color:#000; }
.about-img img{ max-width: 500px; }
.page-about-main img{ max-width: 100%;  }
.service-list-0824{list-style-type: disc; font-size: 20px;}
.service-list-0824 li{ margin-left: 50px; }
.process-list{ background-color: #fff; width: 90%; margin: auto; display: block;}
.process-list li{ border-bottom: 1px solid #662D91; display: flex; align-items: center; }
.process-list li p{  font-size: 20px; color:#000; display: inline; }
.process-list img{ border:1px solid #662D91; background-color: #fff; margin-right: 20px; }
.pro1-c{ background-color: #f9cfcf!important; }
.pro2-c{ background-color: #dfcff9!important; }
.pro3-c{ background-color: #eeffe5!important; }
.pro4-c{ background-color: #cff4f9!important; }
.pro5-c{ background-color: #eef387!important; }
.product-intro{ border-top:5px solid #662D91!important; color: #662D91; line-height:1.5;padding:10px 10px 10px 15px; border:1px solid #662D91;}
.product-block{ position: relative; border: 1px solid #662D91; display: flex; min-height: 380px; padding: 30px 30px 30px 0;}
.product-block p{ font-size: 16px; line-height: 2; color: #662D91;}
.product-block .box-img{position: absolute; width: 100%; padding-top:calc(  100% - 45px ); border:1px solid #662D91;  top: 5px; left: -30px; }
.product-block .box-img img{ width: 100%; border:1px solid transparent; }
.page-product-area .item-p-list .hover-shadow{ box-shadow: 0px 0px 10px #888; }
.page-product-area .item-p-list .hover-shadow:hover{ box-shadow: 0px 0px 15px #888!important; }
.page-product-area .brand-block:hover >.hover-shadow{ box-shadow: 0px 0px 10px #888; }
.brand-item-intro img{ max-width: 900px; }
.brand-item-intro p{ font-size: 20px; line-height: 1.8; }
.hover-p-tt:hover{ color: #6b3180}
.product-txt-height{ height:100px; overflow: hidden;}
.product-title-height{ height: 50px;overflow: hidden;}
.scale-1-5:hover >img{ transform: scale(1.2) translate(-40%, -40%)!important; transition: ease 1s all; }
.product-list-txt{padding:10px ; background-color: #f4f4f4;}
.btn0828{ padding: 10px 20px; border-radius: 30px; background-color: #ffc731; color:#000; }
.btn0828:hover{box-shadow: 0 0 10px #888;}
.product-content img{ max-width: 900px;  }
.product-content p{ font-size: 18px;line-height: 1.8; }
.product-content{ padding: 80px 0;}

.tg tr, .tg td{ border:1px solid #000;  }
.tg td{padding: 10px;}
.bg-6b3180{background-color: #6b3180;}
.aac-item p{ font-size: 18px; line-height: 1.8; }
.aac-item h3{line-height: 1.8;}
.aac-item img{ max-width: 900px;  }

.btn-c-fb{ padding: 5px 20px; background-color: #6b3180; color: #fff; display: inline-block; margin-right: 15px;}
.btn-c-line{ padding: 5px 20px; background-color: #6b3180; color: #fff; display: inline-block; }
.contact-link{ display:flex; justify-content: center; width: 88%; margin-top: 50px; }
.br-b{display: none;}

.index-hover-08:hover{ opacity: 0.8; }
.hover-tt-1 a h4:hover{ color:#888; }
.index-transform-ps:hover{ transform: translate( -50%, -50% ) scale(1.2)!important; transition:ease 1s all; }
.store-news-wrape{display: flex; justify-content: space-between;  border-bottom: 1px solid #888; padding-bottom: 15px; padding-top: 15px;}
.store-news-wrape h4{display: flex; align-items: center; margin-bottom: 0; transition: ease 0.5s all;}
.store-news-wrape:hover h4{ transform: translateX(30px); }
.store-news-title{display: flex;}
.store-news-wrape .store-news-icon::before{ content: ''; margin-right: 15px; display: block; width: 25px; height: 25px; background-image: url(assets/img/news/store-news-icon.png); background-repeat:no-repeat ; background-position: left;background-size: 100%;  }
.store-news-wrape:hover .store-news-icon::before{ transform: translateX(0px); }

.p-a-area-flex{  display: flex; justify-content: center; }
.f-items .item h4{ font-size: 24px; }
.f-items .item ul li{margin-bottom: 15px;}
.f-items .item ul li a{font-size: 20px;}

.f-items .item ul li span{ color: #232323;  font-size: 20px; }


@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;}
	.logo{ min-width: unset; }

	.f-items .item .f-btn-00{display: block; width: 150px; text-align: center; margin: 5px 0 20px 0; }

}

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

	.navbar-header{ width: 27%!important; }
	nav.navbar.bootsnav .navbar-brand{ padding: 0px 15px 0 11px!important; }
	nav.navbar.bootsnav ul.nav > li > a{padding: 10px 5px; font-size: 14px; }
	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: 208px; background: rgba(255, 255, 255, 1);}
	nav.navbar.bootsnav ul.navbar-right li.dropdown ul.dropdown-menu li a{color: #6b3180;}
	nav.navbar.bootsnav li.dropdown ul.dropdown-menu > li > a{     border-bottom: unset; }
	nav.navbar.bootsnav ul.nav > li > a:hover{ color:#AF7E46; }
	nav.navbar.bootsnav ul.navbar-right li.dropdown ul.dropdown-menu li a:hover{ opacity: 0.8; color: #c588db!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 55px 0 11px; }
	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: #fff; }
	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.navbar-transparent.white{  background: #6b3180 none repeat scroll 0 0;}
	


	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; }

	.head-flex-c-0823{display: flex; align-items: center;}

}

@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:17px; }
	.navbar-header{ z-index: -999;}
	nav.navbar.bootsnav .navbar-brand{ z-index: 1;    padding: 15px 0px;}
	nav.navbar.bootsnav .navbar-toggle{z-index: 99; }
	nav.navbar.bootsnav{     background-color: #fff!important; }
	nav.navbar.bootsnav .navbar-toggle i{ color:#6b3180; }
	nav.navbar.bootsnav .navbar-collapse.collapse.in{ background: #fff none repeat scroll 0 0!important; }
	.width-free{width: 100%;}
	nav.navbar.bootsnav ul.nav li.dropdown > ul.dropdown-menu li:hover > a{color: #6b3180 !important; }

}

@media (max-width: 1024px){

	/*tool*/
	.m-non-float{ float: unset; }
	.m-pb-40{ padding-bottom: 50px; }
	.m-pd-15{ padding:15px; }
	.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: 256px;}
	.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; color: #6b3180; }
	nav.navbar.bootsnav ul.nav li.dropdown ul.dropdown-menu > li > a{ font-size: 18px; }
	nav.navbar.bootsnav ul.nav li.dropdown > ul.dropdown-menu li > a{  border-bottom: unset ; color: #6b3180; }
	

	.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:0; position: relative;  bottom: 0px;  }
	.breadcrumb-area{background-image: unset!important; background-position: 0 ; margin-top: 0px!important; padding: 0 0 0px 0!important; }
	.re-style-flex{display: unset!important; }

}	

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

@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-hidden{ overflow: hidden;}
	/*article set*/
	.max-w-800 img{ max-width: 100%; width:100%; }
	.m-flex-left{ display: flex; }
	.m-flex-right{ display: flex; flex-direction: row-reverse; }
	.m-tra-15{ transform: scale(1.5); }
	.m-width-90{width: 90%!important; display: block;margin: auto;}

	.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}
	.table-rwd table{ width:500px; }

	.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{ max-width: 100%; width: 100% ; height: unset!important; }
	.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; }
	
	.page-about-main img{ max-width: 100%;  width:100%; }
	.product-block{ width: 100%!important; height: unset;flex-direction: column; padding: 0px 0px 50px 0;}
	.product-block .box-img{position: unset;}
	.brand-item-intro img{ max-width: 100%; width:100%; }
	.product-content img{ max-width: 100%; width: 100%; }
	.aac-item img{ max-width: 100%; width:100%;  }

	.contact-info{display:block; }
	.contact-info span{display:block; }
	.contact-info span, .contact-info a{font-size: 16px;}
	.contact-link{ display:block;  width: 100%; }
	.contact-main{width: 100%;}
	.br-b{display: block;}
	.about-img img{ max-width: 100%; width:100%; }
	.process-list{  width: 80%; }
	.process-list li{ }
	.process-list li p{  font-size: 16px; display: inline-block; padding-top: 10px; }
	.shop-title-btn{    flex-direction: column; align-items: flex-start;  margin-top: 20px;}
	.shop-title-btn h4{margin-bottom: 15px!important;}
	.btn-shop{font-size: 12px!important;}
	.store-news-wrape{display: flex; flex-direction: column; }
	.store-news-title{ margin-bottom: 30px;}

	.f-items .item img{width: 100%;}
	
}

@media(min-width: 768px){
	.navbar-collapse.collapse{ display: flex; justify-content: flex-end; align-items: center;}
	.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% ; }
	#slide-pc{margin-top: 92px!important;}
}

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

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