@charset "utf-8";
* {margin: 0;padding: 0;font-family: "microsoft yahei";color: #000;font-size: 14px;}
img{display: block;}
ul {list-style: none;}
a{text-decoration:none;cursor:pointer;outline:none}

/* reset css */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, input, textarea, p, th, td {margin:0; padding:0; -webkit-text-size-adjust:none;}
th{font-weight:normal; text-align:left;}
table{border-collapse:collapse; border-spacing:0;}
img{border:0;}
ol, ul{list-style:none;}
.clear{ clear:both;}
a{outline:none; hlbr:expression(this.onFocus=this.blur()); text-decoration:none; cursor:pointer;}
input , select , textarea , button{outline:none; border-radius:0; font-family:arial , Microsoft YaHei;}
button{cursor:pointer;}
a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {text-decoration:none;}
a:active {text-decoration:none;}
.blank30{ height:30px; clear:both;}
.blank10{ height:10px; clear:both;}
body{font-family:arial,"微軟正黑體";  font-size:15px; line-height:26px; color:#333333; overflow-x: hidden;}
.xs_wap{ display: none;}

.container2{width:96%; margin-left:auto; margin-right:auto ; max-width:1200px; min-width:280px;}
.container3{width:96%; margin-left:auto; margin-right:auto ; max-width:1200px; min-width:280px;}
.block{padding: 20px 0;}
.containernew{width:96%; margin-left:auto; margin-right:auto ; max-width:1200px; min-width:280px;}
.container-ad{width:96%; margin-left:auto; margin-right:auto ; max-width:1200px; min-width:280px;}
/* 主菜单 */
.xs_web{ display: block;width:100%;z-index:9999;}
.head{position: relative;height:85px;z-index: 9999;float:left;width:65%;}
.head .navbox{width:96%; margin-left:auto; margin-right:auto ; max-width:1200px; min-width:280px;}
.head .nav{display: block; float: right;width:calc(80% - 10px)}
.head .nav .nav_pc{ width: 100%;}
.head .nav ul li{float:left;position: relative;box-sizing: border-box;z-index: 999;}
.head .nav ul li span{display:none;}

.head .nav ul li .f_a{line-height:85px;display:block;text-align:center;font-size:15px;color:#000;}
.head .nav ul li:hover .f_a{color: #000; transition:all .3s}
.head .nav ul li:hover span{ display: block;position: absolute;top:20px; text-align: center; color:#fff;width:100%;}
.head .nav ul li .s_navbox{display:none;position: absolute;left: 0;width: 100%; background:#fff;background-color: #C5000B;z-index: 9999;box-sizing: border-box}
.head .nav ul li .s_navbox .s_a a{color:#fff;font-size:14px;text-transform:uppercase;display:block;text-align: center;padding: 10px 0;border-bottom: 1px solid #fff;}
.head .nav ul li .s_navbox .s_a a:hover{background-color:#666;color: #fff;}
.m_nav{display:none}
.headlf .m_logo{display: none}
.headrg .m_menuimg{display: none}
.active{background-color: #cf1322}
.activ2{background-color: #cf1322}

.news{margin-top:30px;}
.index_title{border-bottom:solid 1px #ccc;padding-bottom:10px;}
.index_title h3{float:left;font-size:18px;}
.index_title span{float:right;font-size:15px;color:#666;}
.index_title span a{color:#666;}
.processpic2{height:0; 
   width:100%;    
   margin:0%;
   position: relative; 
   padding-bottom:75%; 
   overflow: hidden;border:solid 1px #000;background-color: #666666;margin-top:20px;}
   .processpic2 img{cursor: pointer;position: absolute; 
      left: 0;
      top: 0;
      width: 100%  ;      
      height: 100%;display: block;}
       .newswarp h4{margin:10px; text-align:center;}
 .newswarp h4 a{color:#AA1D30;font-size:16px;line-height:24px;text-align:center;} 
  .newswarp p{color:#666;margin:10px;text-align:center;}
  
  .indexprolist{margin-top:30px;}
  .indexproitem h4{ text-align:center;color:#666;margin-top:10px;line-height:26px;}
/*** banner ***/
#slider{position:relative; margin:0 auto;}
#slider .item img{display:block; width:100%; height:auto;}
#slider .owl-pagination{position:absolute; left:0; bottom:10px; width:100%; padding:0px; text-align:center; box-sizing:border-box;}
#slider .owl-pagination .owl-page{display:inline-block; width:15px; height:15px; margin:0 8px; background:#fff; border-radius:50%;}
#slider .owl-pagination .owl-page.active{background:#FF6600;}
#slider .owl-buttons div{position:absolute; top:50%; width:16px; height:30px; margin-top:-15px; background:url("https://artcci.com.tw/public/web/images/slide_arrow.png"); text-indent:-9999px; transition:all .3s;}
#slider .owl-buttons div:hover{opacity:.6;}
#slider .owl-buttons .owl-prev{left:30px; background-position:left top;}
#slider .owl-buttons .owl-next{right:30px; background-position:right top;}
/*** banner ***/
#slider2{position:relative; margin:0 auto;}
#slider2 .item img{display:block; width:100%; height:auto;}
#slider2 .owl-pagination{position:absolute; left:0; bottom:10px; width:100%; padding:0px; text-align:center; box-sizing:border-box;}
#slider2 .owl-pagination .owl-page{display:inline-block; width:15px; height:15px; margin:0 8px; background:#fff; border-radius:50%;}
#slider2 .owl-pagination .owl-page.active{background:#FF6600;}
#slider2 .owl-buttons div{position:absolute; top:50%; width:16px; height:30px; margin-top:-15px; background:url("https://artcci.com.tw/public/web/images/slide_arrow.png"); text-indent:-9999px; transition:all .3s;}
#slider2 .owl-buttons div:hover{opacity:.6;}
#slider2 .owl-buttons .owl-prev{left:30px; background-position:left top;}
#slider2 .owl-buttons .owl-next{right:30px; background-position:right top;}

/*** banner ***/
#slider3{position:relative; margin:0 auto;margin-top:30px;}
#slider3 .item img{display:block; width:100%; height:auto;}
#slider3 .owl-pagination{position:absolute; left:0; bottom:10px; width:100%; padding:0px; text-align:center; box-sizing:border-box;}
#slider3 .owl-pagination .owl-page{display:inline-block; width:15px; height:15px; margin:0 8px; background:#fff; border-radius:50%;}
#slider3 .owl-pagination .owl-page.active{background:#FF6600;}
#slider3 .owl-buttons div{position:absolute; top:50%; width:16px; height:30px; margin-top:-15px; background:url("https://artcci.com.tw/public/web/images/slide_arrow.png"); text-indent:-9999px; transition:all .3s;}
#slider3 .owl-buttons div:hover{opacity:.6;}
#slider3 .owl-buttons .owl-prev{left:30px; background-position:left top;}
#slider3 .owl-buttons .owl-next{right:30px; background-position:right top;}

#slider4{position:relative; margin:0 auto;margin-top:20px;}
#slider4 .item img{display:block; width:100%; height:auto;}
#slider4 .owl-pagination{position:absolute; left:0; bottom:10px; width:100%; padding:0px; text-align:center; box-sizing:border-box;}
#slider4 .owl-pagination .owl-page{display:inline-block; width:15px; height:15px; margin:0 8px; background:#fff; border-radius:50%;}
#slider4 .owl-pagination .owl-page.active{background:#FF6600;}
#slider4 .owl-buttons div{position:absolute; top:50%; width:16px; height:30px; margin-top:-15px; background:url("https://artcci.com.tw/public/web/images/slide_arrow.png"); text-indent:-9999px; transition:all .3s;}
#slider4 .owl-buttons div:hover{opacity:.6;}
#slider4 .owl-buttons .owl-prev{left:30px; background-position:left top;}
#slider4 .owl-buttons .owl-next{right:30px; background-position:right top;}


/* 下拉侧边菜单 */
.sidenav{position: relative;width:180px;display: block; float: left;}
.sidenav label {width:180px;display: block;padding-left: 55px;box-sizing: border-box; background: #A4CC76;position: relative;height: 48px;line-height: 48px;color: #fff;font-size: 16px;}
.sidenav label i {width: 30px;height: 30px;display: block;position: absolute;background-size: 20px;left: 25px;top: 16px;}
.sidenav .side {display: inline-block;position: absolute;top: 48px;left: 0;z-index: 999;width: 180px;background: #fff;border-top: none;background-color: rgba(255, 255, 255, .95);box-sizing: border-box;}
.sidenav .side li {position: relative;width:100%; padding:5px 0px;border-bottom: 1px solid #cccccc;box-sizing: border-box}
.sidenav ul.side li:first-child {cursor: pointer;}
.sidenav .side li a {color: #333;height: 40px;line-height: 40px;padding: 8px 0 8px 0;display: block;font-size: 16px;}
.sidenav .side li a:hover {background: none;color: #0085cd;}
.sidenav .side li a i {transition: all 0.3s ease 0s;}
.sidenav .side li a i.side_t {margin-left:10px; width: 40px;height: 40px;display: inline-block;vertical-align: middle;background-size: 30px;}
.sidenav .side li a:hover i {margin-left: 15px;}
.icon1{background: url(https://artcci.com.tw/public/web/imgs/sideIcon1.png) no-repeat;}
.icon2{background: url(https://artcci.com.tw/public/web/imgs/sideIcon1.png) no-repeat;}
.icon3{background: url(https://artcci.com.tw/public/web/imgs/sideIcon1.png) no-repeat;}
.icon4{background: url(https://artcci.com.tw/public/web/imgs/sideIcon1.png) no-repeat;}
.icon5{background: url(https://artcci.com.tw/public/web/imgs/sideIcon1.png) no-repeat;}
.icon6{background: url(https://artcci.com.tw/public/web/imgs/sideIcon1.png) no-repeat;}
.icon7{background: url(https://artcci.com.tw/public/web/imgs/sideIcon1.png) no-repeat;}
.sidenav .side li:hover .side_main {display: block;z-index: 999;}
.sidenav .side .side_main {display: none;width: 500px;background: #FFFFFF;position: absolute;left: 180px;top:0;box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);border: 1px #cecece solid;z-index: 7;}
.sidenav .side .side_main dl {margin: 20px;padding: 0;}
.sidenav .side .side_main dl dt {font-size: 18px;margin-bottom: 10px;color: #0173b2;font-weight: bold;}
.sidenav .side .side_main dl dt b{font-size: 15px;}
.sidenav .side .side_main dl dd {margin-bottom: 10px;display: inline-block;}
.sidenav .side .side_main dl dd a {position: relative; display: inline-block;color: #777;font-size: 14px;margin:0 4px ;padding: 0 5px;border-right: 2px solid #bbbbbb; height: auto;line-height: 1.5;transition: all 0.2s ease 0s;}
i.icon-hot,i.icon-new {display: inline-block;height: 9px;width: 24px;background: url(https://artcci.com.tw/public/web/imgs/img_public.png) no-repeat;vertical-align: middle;}
i.icon-hot {background-position: 0 -240px;}
i.icon-new {background-position: -40px -240px;}
.sidenav .side .side_main dl dd a span {color: #999;}
.sidenav .side .side_main dl dd a:hover {background: none;color: #cf1322;transform:translateY(-2px);}
.sidenav .side .side_main dl dd a:hover b {color: #40adf5;}
.sidenav .side .side_main dl dd a:hover span {color: #40adf5;}

.header_top{ background-color: #fff;height:85px;}
.header_top h1{ float: left;width:15%;margin-top:22px;}

.nav_right{ float: right;width:20%;text-align: center;}
.nav_right img{margin-left:15px;  display: inline-block;margin-top:25px;}
.img100{width:100%;display: block;}

.nav_right a{position: relative;}
.nav_right a span{position: absolute;width:23px;height:23px;background-color: red;color:#fff;border-radius: 50px; text-align: center;line-height: 23px;top:0px;right:-10px;}

#btn {
   width:40px;
   height: 40px;
  position:fixed;
   right:10px;
   bottom:20px;
   background:url(https://artcci.com.tw/public/web/imgs/top.png)  no-repeat  left top ;
   margin-left: 610px;
}
#btn:hover {
   background:url(https://artcci.com.tw/public/web/imgs/top.png)  no-repeat  left -40px;
}

footer{background-color: #BF1A25;padding-top:30px;padding-bottom:30px; text-align: center;color:#fff;}
.compngname{ font-size: 15px; letter-spacing: 2px;margin-top:5px;color:#fff;}
.companyadddress{margin-top:10px;font-size: 15px;color:#fff;}
.companylable{ font-size: 15px; font-weight:lighter;color:#fff;}
.fenxiang{ text-align: center;padding-top:90px;color:#fff;display:inline-block;margin-left:20px;}
.fenxiang img{display: inline;margin-left:5px;margin-right:5px;color:#fff;max-width:40px;} 
.height50{height: 0px;}

.endcopryright{color:#fff;text-align: left;font-size:13px;line-height:26px;}
.endcopryright a{color:#fff;}

.end_nav li{font-size:15px;margin-bottom:20px; text-align:left;}
.end_nav li a{color:#fff;border-left:solid 1px #fff;line-height:15px;padding-left:15px;}
.end_logo{ display:inline-block;margin-top:40px;}
.end_logo img{max-width:130px;}
/*** 圖片交換 ***/
.height80{height:100px;background-color: #FFFBFA;}
.swiper-container {
   width: 100%;
   height: 100%;
   background: #FFFBFA;
   
 }
 .swiper-slide {
   font-size: 18px;
   color:#fff;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
   padding:0px 60px;
   padding-bottom: 100px;
 }
 .parallax-bg {
   position: absolute;
   left: 0;
   top: 0;
   width: 130%;
   height: 100%;
   -webkit-background-size: cover;
   background-size: cover;
   background-position: center;
 }
 .swiper-slide .title {
   font-size: 25px;
   font-weight: blod;
   margin-top: 30px;
   color:#C5000B;
   text-align: center;
 }
 .swiper-slide .subtitle {
   font-size: 40px;
   margin-top: 30px;
   line-height: 35px;
   color:#000;
   text-align: center;
 }
 .swiper-slide .text {
   font-size: 16px;
   max-width: 400px;
   line-height: 1.3;
   margin-top: 30px;
   color:#43403C;
 }
 .swiper-slide .more {background-color:#000; color:#fff; display:block; margin-top:40px;  padding-left: 8px; padding-right:8px; padding-top: 8px; padding-bottom:8px; font-size: 16px; font-weight: bold;margin-left:auto;margin-right:auto;max-width: 100px; text-align: center;}

  .swiper-slide .more  a{ border: solid 2px #FED44C; display: inline-block; border-radius: 20px; padding-left: 16px; padding-right: 16px; padding-top: 4px; padding-bottom: 4px; color:#FF6600}
  .swiper-slide .more:hover{background-color:#C5000B;}
  .swiper-slide .more a:hover {background-color:#FED44C; color:#fff;}

  .hpdimg{width:100%;  display: block;max-width:700px; margin: 0 auto;}

/*** 內頁開始***/
.sub_banner{ margin-top: 30px;}
.sub_banner h3{  color:rgb(121, 2, 2); font-size: 20px;background-image: url(https://artcci.com.tw/public/web/imgs/home.png); background-repeat: no-repeat; text-indent: 30px; font-weight: lighter;}
.sub_banner h3 a{ color:#CC1E28;font-size: 20px;}
.sub_banner h3 span{ color:#666;font-size: 20px;}
.top_nav{border-bottom:solid 1px #ccc;line-height: 35px;background-color: #fff;}
.topnavleft{ float: left;width:50%;}
.topnavleft a{color:#666;margin-right:15px;}
.topnavright001{ float: right;width:50%; text-align: right;}
.topnavright001 span{color:#666;}
.topnavright001 span b{margin-left:10px;margin-right: 10px;font-weight: lighter;color:#9496A2}
.topnavright001 a{color:#666;display:inline;}
.topnavright001 img{display: inline;width:25px;}
.m_menucart{display: none;}
.nav_wap_line{height:50px;display: none;}
.content{padding-top:80px;padding-bottom:80px;}

.xinpintitle{width:100%;border-bottom:solid 1px #ccc;}
.xinpintitle h3{float: left;width:35%;font-size: 24px;letter-spacing: 2px;text-indent: 20px;}
.xinpintype{float: right;width:65%; text-align: right;}
.xinpintitle ul li{display: inline;}
.xinpintitle ul li a{color:#16161A;line-height: 50px;display: inline-block;margin-left:20px;border-bottom: solid 3px #fff;margin-right:20px;}
.xinpintitle ul li a:hover{color:#C5000B;border-bottom: solid 3px #C5000B;}


.xinpinlist{width:100%;margin-top:30px;}
.xinpinlist li{margin-left:2%;margin-right:2%;width:21%;float: left;margin-top:20px;}
.xinpinlist li img{width:100%;display: block;}
.xinpinlist li h4{font-size:15px;color:#16161A;padding-top:10px; text-align: center;height:26px;overflow:hidden}
.jiage{margin-top:10px; text-align:center;}
.jiage span{color:#16161A;margin-right:10px;}
.jiage strong{color:#CEAD8D;font-weight: lighter;margin-left:10px;text-decoration:line-through}

.tupian{height:0; 
width:100%;    
margin:0 1%;
position: relative; 
padding-bottom:100%; 
overflow: hidden;box-shadow:0px 0px 8px #666;background-color: #eee;}


.xinpinlist li img{position: absolute; 
left: 0;
top: 0;
width: 100%        
height: auto;}
.box{padding-top:30px;padding-bottom:30px;}

.showtitle{background-color: #F3EAD8;padding-top:36px;padding-bottom:36px;}
.showtitle h3{color:#16161A; text-align: center;font-size: 22px;}
.showfenlei{ text-align: center;margin-top:20px;}
.showfenlei a{color:#43403C;}
.showfenlei span{color:#9496A2;margin-left:10px;margin-right:10px;}

.showpic{background-color: #433F3C;margin-top:50px;}
.showpic article{margin-left:50px;margin-right:50px;padding-top:30px;padding-bottom:30px;}
.showimg{float: left;width:40%;}
.showimg img{width:100%;}
.showimg_info{float: right;width:55%;color:#fff}
.showimg_info h4{color:#fff;font-size: 34px;}
.zuozhe{margin-top: 10px;color:#fff;margin-top:20px;}
.showjiage{color:#fff;font-size: 24px;margin-top:20px;}
.showjiage span{color:#fff;margin-right:20px;font-size: 24px;}
.showjiage s{color:#fff;font-size: 24px;}

.addorder{background-color: #fff;border-radius: 30px; display: inline-block; color:#433F3C;padding:5px 20px;margin-top:30px;}
.addorder:hover{color:#C5000B}

.showinfo{margin-top:50px;border-bottom:solid 1px #ccc;display: inline-block;}
.showinfo ul li{display: inline;}
.showinfo ul li a{color:#16161A;line-height: 50px;display: inline-block;border-bottom: solid 3px #fff;margin-right:40px;}
.showinfo ul li a:hover{color:#C5000B;border-bottom: solid 3px #C5000B;}

.xinpinshow{padding-bottom:50px;}
.showinfobox{margin-top:20px;color:#9694A2}

.yishu{margin-top:50px;margin-bottom:50px;}
.yishu aside{border:solid 1px #E5E5E5; border-radius: 10px;float: left;width:25%;padding-bottom:30px;}
.yishu aside h3{padding-top:30px;width:80%;margin:0 auto;font-size: 20px;margin-bottom:15px;}
.yishu aside  ul li{width:80%;margin:0 auto;color:#AAABB5; font-weight: lighter;}
.yishu aside  ul li label{cursor: pointer;color:#AAABB5;font-weight: lighter;}
.yishu aside  ul li label input{margin-right:10px;}
.line{border-top:solid 1px #efefef}
.yishu article{width:73%;float: right;}
.yishu article ul li{margin-left:2%;margin-right:2%;width:29.3333%;float: left;margin-bottom:20px;}
.yishu article ul li img{width:100%;display: block;}
.yishu article ul li h4{font-size:15px;color:#16161A;padding-top:10px; text-align: center;height:28px;overflow:hidden}
.yishu li img{position: absolute; 
left: 0;
top: 0;
width: 100%        
height: auto;}

.loginkang{padding-top:70px;padding-bottom:60px}
.logink{box-shadow:0px 0px 30px #666;border-radius: 30px;padding-top:30px;padding-bottom:50px;margin:0 auto;width:100%;max-width:700px;}
.logink h3{font-size:30px;color:#000; text-align: center;letter-spacing: 2px;}
.logink h3 span{display: block;margin-top:10px;font-size: 16px;letter-spacing:1px;color:#424242}
.logink form{width:90%;max-width: 520px;margin:0 auto;}
.loginline,.loginline2{margin-top:30px;}
.loginline3{margin-top:50px}
.loginline span{display: block;font-size: 16px;}
.loginline input{border:solid 1px #e5e5e5;width:100%;padding-top:10px;padding-bottom:10px;display: block;margin-top:5px;line-height:15tepx;font-size: 15px;text-indent: 10px;}
.jizhu{float: left;width:50%;font-size: 16px;}
.jizhu label{cursor: pointer; font-weight: lighter;font-size: 16px;}
.jizhu a{color:#000;font-size: 16px;}
.jizhu a span{color:#C5000B;}
.wangji{float:right;width:40%;text-align: right;}
.wangji a{color:#C5000B;font-size: 16px;}
.btnlogin{background-color: #C5000B;border:none;color:#fff;font-size:16px;padding:8px 50px 10px 50px;}

.ssbox{ text-align: center;}
.ssbox a{display: inline-block;background-color:#000;color:#fff;padding:5px 10px;margin-left:10px;margin-right:10px;}
.ssbox a:hover{color:#fff;}

/***　聯絡我們 ****/
.company_info2{font-size: 20px;line-height: 35px; text-align: center;}

.txt02{border:solid 1px #000; padding:5px; border-radius: 5px; line-height: 30px; position: relative;margin-top:30px;}
.txt02 span{font-size: 30px;color:red; display: inline-block; position: absolute;top:12px;}
.txt02 input{ text-indent: 30px;width:100%; border: none;}
.txt02 textarea{width:92%; border: none;padding-left:4%;padding-right:4%;}

.btntj{ background-color: #000;display: block;margin-top:30px;width:100%; border: none; border-radius: 5px;color:#fff;cursor: pointer;padding-top:10px;padding-bottom:10px;letter-spacing: 3px;font-weight: bold;}

.address_line{margin-top:30px;font-size:20px;width:80%; float: right;}
.address_line label{font-size: 20px;display: inline-block; position: relative;letter-spacing: 2px;float: left;width:100px;}
.address_line label span{height:8px;width:30px;background-color: #000;display: block;}
.address_line p{ display: inline-block;float: left;}
.address_line p a{color:#000}
.address_line p a:hover{color: tomato;}

.map{margin-top:80px;}
.map img{width:100%;}
/***自适应框架**/ 
.video-container {position: relative;padding-bottom: 56.25%;padding-top: 30px;height: 0;overflow: hidden;}
.video-container iframe { position: absolute; top:0;left: 0; width: 100%;height: 100%;}

/***　最新消息 ***/
.xinxilh{margin-bottom:30px;}
.xxli{width:17px;height:30px;background-image: url(https://artcci.com.tw/public/web/imgs/li2.jpg); float: left;width:5%; background-repeat: no-repeat;}
.xxliimg{width:21%; float: left;}
.xxliimg img{width:100%;min-width:100px;border:solid 1px #5C3120}
.xxinfo{width:73%; float: right;}
.xxinfo h5{color:#5189E8; font-weight: lighter;position: relative;line-height: 30px;}
.xxinfo h5 a{color:#5189E8;font-size:15px;width:80%;display: block; }
.xxinfo h5 a:hover{ color:red}
.xxinfo h5 span{color:#898B8C; position: absolute;right:10px;top:0px}
.xxinfo p{margin-top:10px;color:#888; font-size:13px;}

.picdetail{width:60%;margin:0 auto;margin-top:10px;}


.pager{ margin-top:30px; text-align:center; color:#000; font-size:15px;}
.pager a{ color:#000; margin-left:5px; margin-right:5px; background-color:#efefef;width:30px;height:30px;line-height: 30px;display: inline-block;}
.pager strong {
    color: #fff;
    margin-left: 5px;
    margin-right: 5px;
    background-color: #000;
    width:30px;height:30px;line-height: 30px;display: inline-block; font-weight:lighter;
}

/** 大師講堂 **/
.prowarp{ border-radius: 5px;box-shadow:0px 0px 8px #ccc; margin-top: 20px;} 
.prowarp img{ border-radius: 5px;width:100%;}

.proli{ width:85%; margin: 0 auto;margin-top:10px;height:50px;overflow:hidden;}
.proli h4 a{color:#000; font-size: 16px; font-weight: bold; display:block; text-align: center;line-height:26px;}
.containerlogin{width:40%;margin:0 auto;padding-top:100px;padding-bottom:50px;}
.wjmm{ font-size:13px; color:red; line-height: 26px;text-align: center;margin-top:10px;}
.wjmm p{color:#fff;}

/* 會員中心 **/
.contentuser{padding-bottom:50px;}
.userhuanyin{width:100%; text-align:center;padding-top:50px;font-size: 20px;}
.menusan{width:40%;margin:0 auto;margin-top:50px;min-height: 300px;;}
.menusan li{float: left;margin-left:2%;margin-right:2%;width:29.3333%;text-align: center;line-height: 30px;margin-top:50px;font-size: 15px;}
.menusan li img{display: block;margin:0 auto;width:50px;}
.contentuserform{width:40%;margin:0 auto;margin-top:90px;}
/***好友分享 ***/
.fenxiang2{width:100%;  margin:0 auto;background:#fff;max-width: 768px;margin-bottom:50px;}
.fenxiang2 .fx{max-width: 768px;height:2.8rem;width:100%;bottom:0px;background:#fff;z-index:99999; }
#sharehaoyou{ display:block;background:#CC1E28; font-size:15px;color:#fff; text-align:center;line-height:40px;max-width:200px;margin-left:auto;margin-right:auto;}
/*** 修改資料 **/
.list_index_my{}
.my_wode_ziliao{margin: 10px 0 0 0; }
.my_wode_ziliao .my_dind .bt h3 p{width: 20%;text-align: left;color: #544e4c;float: left;font-size:15px;}
.my_wode_ziliao .my_dind .bt h3 input{width:78%;border:none;color: #999;outline: none;float: right; font-size: 15px;}
.list_index_my .my_dind{padding: 2%;background: #fff;border-bottom: solid 1px #f6f6f6;}
.list_index_my .my_dind .bt {border-bottom: none;position: relative;}
.list_index_my .my_dind .bt a{display: flex;justify-content: space-between;width: 100%;color:#666;font-size:13px;}
.list_index_my .my_dind .bt a .right{align-items : center;display: flex;}
.list_index_my .my_dind .bt a .right img{width:9px;}
.list_index_my .my_dind .bt h3{font-weight: unset;align-items : center;display: flex;position: relative;}
.list_index_my .my_dind .bt h3 img{width: 16px;height: 16px; margin-right:5px;}
.list_index_my .my_dind .bt b{color: #ff2e26;}
.list_index_my .my_dind .bt .dian{width: 2px;height: 2px;border-radius: 50%;position: absolute;background: #ff2e26;top: 5px;right: 0px;}
.queding_wq {background:#CC1E28; background-image: url(https://artcci.com.tw/public/web/imgs/bgallbtn.png);width: 100%;display: block;color:#fff;border:none;padding-top:15px;padding-bottom:15px;cursor: pointer;margin-top:10px;}

/*** 購物車 ***/
.gwcbox{background:#fff}
.gwcbox_1{ background:#fff;margin-top:5px}
.gwcbox_1 .gwc1_2{}
.gwcbox_1 .gwc1_2 .gwcone{border-bottom:1px solid #eee; padding:10px; height:85px;padding-top:12px;}
.gwcbox_1 .gwc1_2 .gwcone:last-child{ border-bottom:0}
.gwcbox_1 .gwc1_2 .gwcone .go1{float:left; width:1.2rem; height:1.2rem; padding-right:0.5rem; margin-top:1.7rem}
.gwcbox_1 .gwc1_2 .gwcone .go2{ float:left; width:70px; height:60px; overflow:hidden;}
.gwcbox_1 .gwc1_2 .gwcone .go2 img{width:60px; height:60px; border:solid 1px #ccc;}
.gwcbox_1 .gwc1_2 .gwcone .go3{ flex:1; height:60px;}
.gwcbox_1 .gwc1_2 .gwcone .go3 .go3_1{ height:20px; overflow:hidden}
.gwcbox_1 .gwc1_2 .gwcone .go3 .go3_1 p.p1{width:70%;float: left;  text-overflow:ellipsis;overflow: hidden;white-space: nowrap; color:#333; font-size:13px; line-height: 20px;  white-space:nowrap;text-overflow:ellipsis; }
.gwcbox_1 .gwc1_2 .gwcone .go3 .go3_1 p.p2{float:right; color:#ff2150; font-size:13px;}
.gwcbox_1 .gwc1_2 .gwcone .go3 .go3_2{height:10px; overflow:hidden;line-height:13px;}
.gwcbox_1 .gwc1_2 .gwcone .go3 .go3_2 p.p3{float:left; color:#999; font-size:0.8rem; width:100%;overflow:hidden; white-space:nowrap;text-overflow:ellipsis}
.gwcbox_1 .gwc1_2 .gwcone .go3 .go3_2 p.p4{ font-size:1rem}
.gwcbox_1 .gwc1_2 .gwcone .go3 .go3_3{height:24px; overflow:hidden;margin-top:3px;}
.gwcbox_1 .gwc1_2 .gwcone .go3 .go3_3 .num1{ float:left;text-align:center;line-height:24px; width:24px; height:24px; background:#f7f7f7; color:#333; font-size:20px;cursor: pointer;}
.gwcbox_1 .gwc1_2 .gwcone .go3 .go3_3 .num2{ float:left;line-height:24px; width:50px; height:24px; background:#f7f7f7; color:#333; font-size:0.9rem; border-left:1px solid #fff; border-right:1px solid #fff; text-align:center;font-size:15px;}
.num2_1{width:100%; border:none; background:#f7f7f7; text-align: center;}
.gwcbox_1 .gwc1_2 .gwcone .go3 .go3_3 .num3{float:left;text-align:center;line-height:24px; width:24px; height:24px; background:#f7f7f7;font-size:20px ;color:#ff2150;cursor: pointer;}
.gwcbox_1 .gwc1_2 .gwcone .go3 .go3_3 .del{ float:right}
.gwcbox_1 .gwc1_2 .gwcone .go3 .go3_3 .del img{ height:20px;margin-top: 0.1rem;cursor: pointer;}

/**結算那行**/
.hejiBox{width:100%;  margin:0 auto;background:#fff;margin-top:20px;}
.hejiBox .heji{height:50px;width:100%;background:#fff;z-index:99999; border:1px solid #eee;}
.hejiBox .heji .heji_1{float:left; width:1.2rem; height:1.2rem;padding:0.8rem 0.5rem; }
.hejiBox .heji .heji_2{ float:left; color:#333; line-height:1.2rem; font-size:0.9rem;padding:0.8rem 0; padding-right:0.5rem}
.hejiBox .heji .heji_3{ float:left;padding-left:10px;}
.hejiBox .heji .heji_3 p{ color:#ff2150; font-size:15px;line-height: 50px;}
.hejiBox .heji .heji_3 p span{ font-size:15px}

.hejiBox .heji .heji_5{ float:right; width:100px; height:50px; overflow:hidden }
#alltotal{ color:#ff2150;font-size:15px}
.hejiBox .heji  #heji_5_btn{ display:block;background:#CC1E28;border:none; cursor: pointer; color:#fff; text-align:center; line-height:50px;width:100px;  height:50px; font-size:15px;}
.zxzf{width:80%; margin:0 auto; display: block; background-color:#FF6600; color:#fff; padding-top:7px; padding-bottom:7px; border-radius: 5px;border:none;cursor: pointer;}
.jsdingdan{ padding:0 0.5rem; border-top:1px solid #eee;background:#fff;margin-top:20px;}
.jsdp{padding:10px; height:50px; line-height:50px;border-bottom:1px solid #eee;overflow:hidden;white-space:nowrap;}
.jsdp img{ height:1.2rem; float:left}
.jsdp span{font-size:0.9rem; height:1.2rem; line-height:1.2rem; padding-left:0.3rem; color:#333}
.jsyf{padding:10px; border-bottom:1px solid #eee;overflow:hidden;background:#fff}
.jsyf .jsyfL{ color:#333; float:left; font-size:14px;}
.jsyf .jsyfR{ float:right;font-size:14px;}
.jsyf .jsyfC{ flex:1;font-size:14px; color:#999}
.jsyf .jsyfR img{ width:3rem; border-radius:100%}
.jsyf .jsyfL p{ line-height:3rem}

.jsyhq_2{padding:0.6rem 0; border-bottom:1px solid #eee;overflow:hidden;}
.jsyhq_2 .jsjfL{ float:left; height:1.2rem; line-height:1.2rem;}
.jsyhq_2 .jsjfL p{ color:#333; font-size:14px}
.jsyhq_2 .jsjfL p span{color:#ff2150; padding-left:0.5rem}
.jsyhq_2 .jsjfR{ float:right;width:1.2rem; height:1.2rem;}

.cartleft{float: left;width:70%;padding-bottom:50px;}
.cartright{float: right;width:25%;border-left:solid 1px #EFEFEF;padding-bottom:100px;}

.proother{ width:90%; margin-left:10%;}
.proother h3{background-image: url(https://artcci.com.tw/public/web/imgs/loginother.png);height:45px; text-align: center;}
.proother h3 span{ display:inline-block;height:45px;line-height: 45px; background-color: #fff;padding-left:10px;padding-right:10px; font-weight: lighter; font-size: 16px;color:#666;}
.proother ul li{margin-top:20px;}
.proother ul li img{display: block;width:100%;}
.proother ul li h4{font-size: 15px;font-weight: lighter;color:#fff; text-align: center;height:40px;line-height:40px;overflow: hidden;position:absolute;bottom:0px;width:100%;background-image: url(https://artcci.com.tw/public/web/imgs/li_bg.png);}
.proother ul li h4 a{color:#fff;}
.proother ul li h5 span{margin-top:10px;color:#e4393c; display: block; font-weight: lighter; text-align: center;}
.re_prowrap{position: relative;}
.linecart{background-color: #eee;margin-top:20px;padding-top:10px;padding-bottom:10px;background-image: url(https://artcci.com.tw/public/web/imgs/heart.png);background-repeat: no-repeat; text-indent: 30px;font-size: 15px;;}

/***我的紅利**/
.dingdannav{ background-color: #eee;height:50px;line-height: 50px; font-size: 15px;}
.dingdannav li{width:33.3333%; float: left; text-align: center;}
.dingdannav li a{ display: block; color:#000;}
.myhonglilist{border-bottom:dotted 1px #ccc; background-color: #fff;margin-top:1px;padding:15px 10px 15px 10px;position: relative;color:#aaa}
.myhonglilist span{position: absolute;right:10px;color:red;font-size:20px;top:5px;font-family: 'Times New Roman', Times, serif;}
/**我的訂單**/

.orderlist{margin:0 auto;width:100%;}
.orderlist li{ background-color: #fff;border-bottom: 1px solid #eee;border-radius: 4px;margin-top:10px;padding-top:20px;padding-bottom:10px;}
.dingdan{font-size: 15px;color:#000;  font-size:13px;}
.dingdan span{ float: right;color:#888;font-size:13px;} 
.ddprice{margin-top:10px;}
.ddprice strong{ float: left;width:20%; color:#D6171C;font-size:13px;font-weight: lighter; }
.ddprice a{width:30%; float: right; display: inline-block;width:80px;height: 24px; border-radius: 3px; background-color:#D6171C;color:#fff; text-align: center;font-size:12px;line-height: 24px;}
.ddprice span{float: left; width:50%; color:#6E3722; text-align: center; font-size:13px;}

/**訂單詳細***/
.dddetail{padding-top:20px; padding-bottom:20px; background-color:#333; }
.dddetail1{width:96%; margin:0 auto; color:#fff; font-size: 15px;line-height:26px;}
.qwzf{ text-align: center;margin-top:10px;max-width: 300px;display: block;margin-left:auto;margin-right: auto;}
.zxzf{width:80%; margin:0 auto; display: block; background-color:#FF6600; color:#fff; padding-top:7px; padding-bottom:7px; border-radius: 5px;border:none;cursor: pointer;display: block;}
.atmtable{margin-top:20px; text-align:center;line-height: 24px;background-color:#fff;color:#000;padding:10px;}
.atmtable table{border-right:1px solid #ccc;border-bottom:1px solid #ccc;}
.atmtable table th{background-color:#efefef;width:100px;border-left:1px solid #ccc;border-top:1px solid #ccc; line-height:24px; padding:5px; text-align:right;}
.atmtable table td{border-left:1px solid #ccc;border-top:1px solid #ccc; line-height:24px; padding:5px; text-align:left;}
.atmtable  table td a{ color:#333;}
.dddetail2{background-color: #fff;padding-top:10px; padding-bottom:10px;}
.shnobox2{padding:10px;border-bottom: 1px solid #eee;overflow: hidden;position: relative;}
.shnobox2 .shnobox2_L{float: left;width: 60px;height: 50px;overflow: hidden;padding-right: 0.5rem;margin-right:5px;}
.shnobox2 .shnobox2_L .img{width: 50px;height:50px;}
.shnobox2 .shnobox2_R{flex: 1;height: 3rem;}
.shnobox2_R_1{ height:16px; overflow:hidden}
.shnobox2_R_1 .le{float:left;font-size:13px;color:#333;line-height:16px;width:70%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.shnobox2_R_1 .ri{position: absolute; right:10px;font-size:13px;}
.shnobox2_R_2{ height:2rem; overflow:hidden}
.shnobox2_R_2 .lef{ float:left; width:70%; overflow:hidden}
.shnobox2_R_2 .lef .p1{ color:#999; font-size:13px;line-height:1rem; padding-top:0.2rem}
.shnobox2_R_2 .lef .p2{ width:100%; text-align:right;}
.shnobox2_R_2 .rig{ float:right; width:30%; overflow:hidden}
.shnobox2_R_2 .rig a{display: block;border: 1px solid #ff2150;color: #ff2150;font-size: 0.75rem;padding: 0 0.6rem;height: 1.2rem;line-height: 1.2rem;border-radius: 3px;box-sizing: border-box; float:right; margin-top:0.5rem}
.dphjbox{height:35px;line-height:35px;border-bottom: 1px solid #eee;}
.dphjbox .p5{ color:#999; font-size:13px; text-align:right}
.dphjbox .p5 span{color:#ff2150; font-size:13px; font-weight:500}


.usermenuleft{width:90%;float: right;background-color: #efefef;}
.usermenuleft ul li{line-height: 50px;background-image: url(https://artcci.com.tw/public/web/imgs/heart2.png);background-repeat: no-repeat; text-indent:30px;}
.usermenuleft ul li a{font-size: 17px;}
@media screen and (max-width:960px){

  .contentuserform{width:80%;margin:0 auto;margin-top:90px;}
   .loginkang{padding-top:30px;padding-bottom:30px}
   .containerlogin{width:80%;padding-top:50px;}
   .content{padding-top:30px;padding-bottom:30px;}
   .xs_wap{display: block;}
   .m_menucart{display:block}
.nav_wap_line{display: block;}
 .top_nav{display: none;}
   .xs_web{ display: none;}
   .msgNum{display: none;}
   .head{display:none}
   .m_img{display:block;background:#fff;position:fixed;top:0px;left:0px;width:100%;z-index:9999;border-bottom:1px solid #ddd;overflow: hidden; padding-top:5px; padding-bottom:5px;}
   .m_img .headlf{padding-top:2px;padding-left:5px;float: left;}
   .m_img .headlf .m_logo{height:40px;display: block}
   .m_img .headrg{padding-right:10px;padding-top:14px;float: right;}
   .m_menucart{float: right;}
   .m_menucart img{vertical-align: middle;margin-top:5px;margin-right:10px; display: inline-block;}
   .m_menucart a{position: relative;}
   .m_menucart a span{position: absolute;width:23px;height:23px;background-color: red;color:#fff;border-radius: 50px; text-align: center;line-height: 23px;top:-7px;left:15px;}
   .m_img .headrg a .m_menuimg{height:16px;vertical-align:top;display:inline-block}
   .m_nav {display:block;position:fixed;top:0px;left:0px;width:0px;height:0px;overflow:hidden;z-index:10000}
   .m_nav .closecover{position:absolute;width:100%;height:100%;background:#000;filter:alpha(opacity=0);opacity:0;left:0px;top:0px;z-index:1}
   .m_nav .closeicon{position:absolute;width:20%;left:30px;top:5%;z-index:100;text-align:center;filter:alpha(opacity=0);opacity:0}
   .m_nav .m_navList{position:absolute;width:80%;right:0px;top:0px;background:#000;height:100%;z-index:100;right:-80%;overflow-y: scroll;}
   .m_nav .m_navList ul{padding-left:5%;padding-right:5%}
   .m_nav .m_navList ul li{border-bottom:1px solid #444}
   .m_nav .m_navList ul li a{display:block;height:45px;color:#fff;line-height:45px;padding-left:5%;font-size:16px}
   .m_nav .m_navList ul li .m_f_a{display: flex;align-items: center;justify-content: space-between; width: 100%}
   .m_nav .m_navList ul li .m_f_a a{flex: 1;}
   .m_nav .m_navList ul li .m_f_a i{width: 40px;height:35px;box-sizing: border-box; padding:0 5px; display: block;}
   .icon{ background:url(https://artcci.com.tw/public/web/imgs/plus.png) 100% no-repeat;background-position: 50% 50%; -webkit-transition:all 0s;-moz-transition:all 0s;transition:all 0s}
   .icon_on{background:url(https://artcci.com.tw/public/web/imgs/reduce.jpg) 50% no-repeat!important;background-position: 50% 50%;-webkit-transition:all 0s;-moz-transition:all 0s;transition:all 0s}
   .m_nav .m_navList ul li .m_s_nav{display:none;width: 100%;}
   .m_nav .m_navList ul li .m_s_nav a{display: block; height:40px;line-height:40px;font-size:14px;padding-left:10%;overflow: hidden; white-space: nowrap;width: 90%;text-overflow: ellipsis;}

   .box{padding-top:30px;padding-bottom:30px;}
   .xinpinlist li{margin-left:2%;margin-right:2%;width:46%;}


   .yishu{margin-top:30px;margin-bottom:30px;}
.yishu aside{float: none;width:100%;}

.yishu article{width:100%;float: none;margin-top:30px;}

.yishu article ul li{width:46%;}

.height80{height:0px;}
.swiper-slide {padding-bottom:22px;}
.swiper-slide .text {margin-top: 10px;}
.hpdimg{margin-top:20px;}

.xxliimg{width:30%; float: left;margin-left:5px;}
.xxinfo{width:57%; float: right;margin-left:5px;}
}

@media screen and (max-width:768px){

  .cartleft{float: none;width:100%;}
.cartright{float: none;width:100%;display: none;}

  .menusan{width:96%;margin:0 auto;margin-top:20px;;min-height: 300px;}
   .xinpintitle{width:100%;border-bottom:solid 1px #ccc;}
   .xinpintitle h3{float: none;width:100%;text-indent: 0px; text-align: center;}
   .xinpintype{width:100%;margin-top:10px; text-align: center;}
   .xinpintitle ul li a{margin-left:10px;margin-right:10px;line-height: 30px;margin-bottom:10px;}
   .containerlogin{width:90%;padding-top:30px;padding-bottom:30px;}
   .logink{box-shadow:0px 0px 20px #666;border-radius: 10px;}
   .showimg{float: none;width:100%;}

.showimg_info{float: none;width:100%;margin-top:20px;}
.showinfo{margin-top:10px;}
.showpic{margin-top:20px;}
.contentuserform{width:96%;margin:0 auto;margin-top:40px;}
.contentuser{width:96%;}
}

@media screen and (max-width:640px){
   .xinpinlist li{width:96%;}
   .yishu article ul li{width:96%;}
}