@charset "utf-8";
/* 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;}
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 , "微軟正黑體";}
input[type="number"]::-webkit-inner-spin-button ,
input[type="date"]::-webkit-inner-spin-button{-webkit-appearance:none;}
button{padding:0; cursor:pointer;}

body{font-family:arial , "微軟正黑體";}
#ascrail2000{z-index:10 !important;}
#all.active{position:fixed; left:0; top:0; width:100%;}

/* header */
#header{}
#header .wrap{position:relative; width:96%; max-width:1600px; margin:0 auto;}
#header .wrap:after{content:""; display:block; clear:both;}

#logo{float:left; width:150px; height:54px; margin-top:7px; background:url(../images/logo.png); text-indent:-9999px; cursor:pointer;}

#navigation{float:right;}
#navigation ul{display:inline-block;}
#navigation:after{content:""; display:block; clear:both;}
#navigation li{position:relative; display:inline-block; padding:20px 5px; text-align:center;}
#navigation li > a{display:inline-block; padding:5px 15px; font-size:16px; color:#000; transition:all .3s;}
#navigation li > a:hover{color:#1baacc;}
#navigation .sub-menu{position:absolute; left:-25%; top:100%; display:none; width:150%; background:rgba(255,255,255,.9); z-index:2}
#navigation .sub-menu a{display:block; padding:10px 0; font-size:15px; color:#444;}
#navigation .sub-menu a:hover{background:#DDD; color:#000;}
#navigation li:hover .sub-menu{display:block;}
#navigation .member{display:inline-block;}
#navigation .member a{display:inline-block; margin:0 5px; padding:5px 15px; font-size:16px; color:#000; transition:all .3s;}
#navigation .member a:hover{color:#1baacc;}

/* search */
#search{padding:10px 0; background:#444; text-align:right;}
#search .wrap{width:96%; max-width:1600px; margin:0 auto;}
#search .wrap .keyword{display:inline-block;}
#search .wrap .keyword a{display:inline-block; margin-right:10px; font-size:13px; color:#CCC; transition:all .3s;}
#search .wrap .keyword a:hover{color:#FFF;}
#search .wrap .search{position:relative; display:inline-block; width:200px; margin-left:10px; padding-right:20px; box-sizing:border-box;}
#search .wrap .search input{display:block; width:100%; height:25px; padding:0 5px; background:none; border:none; border-bottom:1px solid #CCC; font-size:13px; color:#CCC; box-sizing:border-box;}
#search .wrap .search button{position:absolute; right:0; top:5px; width:15px; height:15px; background:url(../images/search.png); border:none; text-indent:-9999px; box-sizing:border-box; transition:all .3s;}
#search .wrap .search button:hover{opacity:.6;}

/* mobile */
#mobi-btn{position:absolute; right:0; top:15px; display:none; width:40px; height:40px; background:#444;}
#mobi-btn:before ,
#mobi-btn hr ,
#mobi-btn:after{content:""; position:absolute; left:7px; display:block; width:26px; height:3px; margin:0; padding:0; background:#FFF; border:none;}
#mobi-btn:before{top:9px;}
#mobi-btn hr{top:18px;}
#mobi-btn:after{top:27px;}
#mask{position:fixed; left:0; top:0; display:none; width:100%; height:100%; background:rgba(0,0,0,.8); z-index:9;}
#mobile{position:absolute; left:-250px; top:0; width:250px; min-height:100%; background:#000; z-index:10;}
#mobile li > a ,
#mobile .member a{display:block; padding:0 20px; border-bottom:1px solid #333; font-size:16px; color:#FFF; line-height:50px;}
#mobile li .sub-menu{display:none; background:#FFF}
#mobile li .sub-menu a{display:block; padding:0 20px; border-bottom:1px solid #f1f1f1; font-size:15px; color:#999; line-height:40px;}

/* container */
#container{width:96%; max-width:1600px; margin:0 auto; padding:50px 0;}
#container .left .ad{margin-bottom:50px; overflow:hidden;}
#container .left .ad a{float:left; display:block; width:32.33%; margin:1.5% 0; transition:all .3s;}
#container .left .ad a:nth-child(3n+2){margin:1.5%;}
#container .left .ad a img{display:block; width:100%; height:auto;}
#container .left .ad a:hover{opacity:.6;}
#container .right .back{padding-top:50px; text-align:center;}
#container .right .back a{display:inline-block; padding:5px 10px; background:#666; font-size:14px; color:#FFF; transition:all .3s;}
#container .right .back a:hover{background:#333;}

/* product-type */
#product-type{margin-bottom:50px; padding:20px; background:#f1f1f1;}
#product-type h2{margin-bottom:15px; padding-bottom:15px; border-bottom:1px solid #CCC; font-size:22px; color:#444; font-weight:normal;}
#product-type li{padding:10px 0; }
#product-type li > a{position:relative; display:block; padding-right:20px; font-size:14px; color:#444; font-weight:bold; transition:all .3s;}
#product-type li > a img{display:inline-block; margin-right:20px; vertical-align:middle;}
#product-type li > a:after{content:" +";}
#product-type li > a:hover ,
#product-type li > a.active{color:#333;}
#product-type li > a:hover:after ,
#product-type li > a.active:after{opacity:1;}
#product-type li > a.active:after{background-position:left bottom;}
#product-type li .sub-menu{margin-top:10px;}
#product-type li .sub-menu a{display:inline-block; margin:0 10px 5px 0; padding:3px 10px; background:#dfdfdf; border-radius:3px; font-size:14px; color:#444; transition:all .3s;}
#product-type li .sub-menu a:last-child{margin-right:0;}
#product-type li .sub-menu a:hover{background:#FFF;}

/* float-product */
#float-product{position:fixed; left:0; top:-100px;width:100%; padding:10px; background:rgba(0,0,0,.8); text-align:center; box-sizing:border-box; transition:all .6s; z-index:8;}
#float-product.active{top:0;}
#float-product > li{display:inline-block; padding:0 10px;}
#float-product > li > a{display:inline-block; padding:3px 10px; border-radius:5px; font-size:14px; color:#FFF;}
#float-product > li > a:hover{background:#FFF; color:#444;}

#float-product .sub-menu{position:absolute; left:0; top:100%; display:none; width:100%; background:rgba(255,255,255,.9);}
#float-product .sub-menu a{display:inline-block; margin:5px; padding:5px 10px; font-size:14px; color:#444; transition:all .3s;}
#float-product .sub-menu a:hover{color:#CCC;}

#float-product > li.active > a{background:#FFF; color:#444;}

/* path */
#path{margin-bottom:20px; font-size:13px; color:#444;}
#path a{color:#444;}
#path a:after{content:">"; margin:0 5px; cursor:default}
#path a:hover{color:#000;}
#path a:hover:after{color:#999;}
#path span{color:#1baacc;}

/* main-title */
#main-title{margin-bottom:10px; padding-bottom:10px; border-bottom:1px solid #CCC; font-size:22px; color:#444; font-weight:normal;}
#main-title .time{display:block; font-size:13px;}

/* footer */
#footer{padding:20px; background:#000; font-size:13px; color:#FFF; text-align:center;}
#footer a{color:#666; transition:all .3s;}
#footer a:hover{color:#CCC;}
#footer .fb{display:block; width:40px; height:40px; margin:0 auto 10px auto; background:url(../images/fb.png); text-indent:-9999px;}
#footer .fb:hover{opacity:.6;}

/* side-function */
#side-function{position:fixed; right:20px; bottom:20px; z-index:1}
#side-function a{display:block; width:45px; height:45px; background:url(../images/side_function.png) #1baacc; border-radius:50%; text-indent:-9999px; transition:all .3s;}
#side-function a.gotop{margin-bottom:10px; background-position:left top;}
#side-function a.cart{background-position:right top;}
#side-function a:hover{background-color:#666;}

/* page */
#page{padding-top:50px; text-align:center;}
#page a{display:inline-block; width:30px; height:30px; margin:0 3px; background:#f9f9f9; border-radius:3px; font-size:14px; color:#333; line-height:30px;　text-align:center; box-sizing:border-box; transition:all .3s;}
#page a:hover ,
#page a.active{background:#CCC; color:#FFF;}
#page a.prev ,
#page a.next{position:relative; text-indent:-9999px;}
#page a.prev:before ,
#page a.next:before{position:absolute; left:50%; top:0; margin-left:-4px; text-indent:0;}
#page a.prev:before{content:"«";}
#page a.next:before{content:"»";}

/* product-list */
#product-list{overflow:hidden;}
#product-list dl{float:left; width:24%; margin:1% 1.33% 0 0}
#product-list dl:nth-child(4n){margin-right:0;}
#product-list dt{position:relative; margin-bottom:10px; overflow:hidden;}
#product-list dt:before{content:""; position:absolute; left:0; top:0; display:block; width:100%; height:100%; background:rgba(0,0,0,.8); opacity:0; transition:all .3s;}
#product-list dt img{display:block; width:100%; height:auto;}
#product-list dt .control{position:absolute; left:0; top:150%; width:100%; margin-top:-20px; text-align:center; transition:all .3s;}
#product-list dt .control a{position:relative; display:inline-block; width:40px; height:40px; margin:0 10px; background:url(../images/product_list_control.png); border-radius:50%; text-indent:-9999px; color:#333; transition:all .3s;}
#product-list dt .control a.view{background-position:left top;}
#product-list dt .control a.addcart{background-position:right top;}
#product-list dt .control a:hover{opacity:.6;}

#product-list dt:hover:before{opacity:1;}
#product-list dt:hover .control{top:50%;}

#product-list dd{font-size:14px; color:#444;}
#product-list dd .brand{font-weight:bold;}
#product-list dd p{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
#product-list dd .price{display:block; margin-top:5px; overflow:hidden; color:#999;}
#product-list dd .price:before{content:"$ ";}
#product-list .more{padding-top:50px; text-align:center;}
#product-list .more a{display:inline-block; padding:5px 10px; background:#1baacc; font-size:14px; color:#FFF; transition:all .3s;}
#product-list .more a:after{content:" +";}
#product-list .more:hover{opacity:.6;}

/* product */
#product{margin-bottom:50px;}
#product .feature{margin-bottom:50px;}
#product .feature:after{content:""; display:block; clear:both;}
#product .feature .img-show{position:relative; float:left; width:55%; padding-left:100px; box-sizing:border-box;}
#product .feature .img-show .full img{display:block; width:100%; height:auto;}
#product .feature .img-show .shortcut{position:absolute; left:0; top:0; width:80px;}
#product .feature .img-show .shortcut li{position:relative; cursor:pointer;}
#product .feature .img-show .shortcut li:after{content:""; position:absolute; left:0; top:0; display:block; width:100%; height:100%; background:rgba(0,0,0,.6); opacity:0; transition:all .3s;}
#product .feature .img-show .shortcut li:hover:after ,
#product .feature .img-show .shortcut li.active:after{opacity:.6;}
#product .feature .img-show .shortcut li img{display:block; width:100%; height:auto;}
#product .feature .detail{float:right; width:45%; padding-left:20px; box-sizing:border-box;}
#product .feature .detail h2{padding-bottom:10px; font-size:30px; color:#333; line-height:50px;}
#product .feature .detail h2 span{display:block; font-size:15px; line-height:15px; font-weight:normal;}
#product .feature .detail .series{display:block; margin-bottom:10px; font-size:14px; color:#999;}
#product .feature .detail ul{font-size:15px; color:#444;}
#product .feature .detail li{position:relative; padding:10px 0 10px 100px;}
#product .feature .detail li.discount{color:#1baacc;}
#product .feature .detail li span{position:absolute; left:0; top:12px;}
#product .feature .detail li b{font-size:20px; color:#000;}
#product .feature .detail li b:before{content:"$";}
#product .feature .detail li input{display:block; width:100%; max-width:120px; height:25px; padding:0 10px; border:none; border-bottom:1px solid #333; font-size:15px; color:#444; box-sizing:border-box;}
#product .feature .detail .addcart{display:block; width:175px; margin-top:30px; background:#1baacc; font-size:16px; color:#FFF; line-height:50px; text-align:center; box-sizing:border-box; transition:all .3s;}
#product .feature .detail .addcart:hover{background:#000;}

#product .info dt{margin-bottom:15px; padding-bottom:15px; border-bottom:1px solid #CCC; font-size:22px; color:#444;}
#product .info dd{font-size:18px; color:#333; line-height:30px;}

/* related-product */ 
#related-product{margin-bottom:50px;}
#related-product h2{margin-bottom:15px; padding-bottom:15px; border-bottom:1px solid #CCC; font-size:22px; color:#444; font-weight:normal;}
#related-product .owl-carousel dt{position:relative; margin-bottom:10px; overflow:hidden;}
#related-product .owl-carousel dt:before{content:""; position:absolute; left:0; top:0; display:block; width:100%; height:100%; background:rgba(0,0,0,.8); opacity:0; transition:all .3s;}
#related-product .owl-carousel dt img{display:block; width:100%; height:auto;}
#related-product .owl-carousel dt .control{position:absolute; left:0; top:150%; width:100%; margin-top:-20px; text-align:center; transition:all .3s;}
#related-product .owl-carousel dt .control a{position:relative; display:inline-block; width:40px; height:40px; margin:0 10px; background:url(../images/product_list_control.png); border-radius:50%; text-indent:-9999px; color:#333; transition:all .3s;}
#related-product .owl-carousel dt .control a.view{background-position:left top;}
#related-product .owl-carousel dt .control a.addcart{background-position:right top;}
#related-product .owl-carousel dt .control a:hover{opacity:.6;}

#related-product .owl-carousel dt:hover:before{opacity:1;}
#related-product .owl-carousel dt:hover .control{top:50%;}

#related-product .owl-carousel dd{font-size:14px; color:#444;}
#related-product .owl-carousel dd .brand{font-weight:bold;}
#related-product .owl-carousel dd p{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
#related-product .owl-carousel dd .price{display:block; margin-top:5px; overflow:hidden; color:#999;}
#related-product .owl-carousel dd .price:before{content:"$ ";}

#related-product .owl-carousel .owl-dots{padding-top:20px; text-align:center;}
#related-product .owl-carousel .owl-dots > .owl-dot{display:inline-block; width:10px; height:10px; margin:0 3px; background:#f1f1f1; border-radius:50%;}
#related-product .owl-carousel .owl-dots > .active{background:#1baacc;}

/* brand */
#brand{position:relative; border:1px solid #f1f1f1; border-right:none; box-sizing:border-box;}
#brand .item a{display:block; border-right:1px solid #f1f1f1; overflow:hidden; box-sizing:border-box; transition:all .3s;}
#brand .item a img{display:block; width:100%; height:auto;}
#brand .item a:hover{opacity:.6;}
#brand .owl-nav{opacity:0; transition:all .3s;}
#brand .owl-nav > div{position:absolute; top:50%; width:30px; height:30px; margin-top:-15px; background:url(../images/brand_arrow.png) rgba(0,0,0,.7); border-radius:50%; text-indent:-9999px; transition:all .3s;}
#brand .owl-nav > div:hover{opacity:.6;}
#brand .owl-nav .owl-prev{left:20px; background-position:left top;}
#brand .owl-nav .owl-next{right:20px; background-position:right top;}
#brand:hover .owl-nav{opacity:1;}

/* news */
#news{overflow:hidden;}
#news li{position:relative; width:48%; padding:10px 0 10px 90px; border-bottom:1px solid #f1f1f1; box-sizing:border-box;}
#news li:nth-child(odd){float:left;}
#news li:nth-child(even){float:right;}
#news li span{position:absolute; left:0; top:15px; font-size:13px; color:#999;}
#news li a{display:block; font-family:"微軟正黑體"; font-size:16px; color:#444; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; transition:all .3s;}
#news li a:hover{color:#CCC}

/* editor */
#editor{font-size:18px; color:#333; line-height:30px;}
#editor a{color:#e73828;}
#editor a:hover{color:#333;}
#editor ul{list-style:disc;}
#editor ol{list-style:decimal;}
#editor ul ,
#editor ol{padding-left:30px;}

/* login */
#login{padding-top:30px;}
#login form{max-width:640px; margin:0 auto 50px auto;}
#login form li{position:relative; padding:10px 0 10px 85px;}
#login form li span{position:absolute; left:0; top:10px; display:block; width:75px; font-size:16px; color:#444; line-height:40px; box-sizing:border-box;}
#login form li input{display:block; width:100%; height:40px; padding:0 10px; border:1px solid #333; font-size:14px; color:#444; box-sizing:border-box;}
#login form li .forget{display:inline-block; margin-top:10px; font-size:16px; color:#1baacc;}
#login form li .forget:hover{text-decoration:underline;}
#login form li.verify{padding-right:160px;}
#login form li.verify img{position:absolute; right:50px; top:15px; display:inline-block; vertical-align:middle;}
#login form li.verify .refresh{position:absolute; right:20px; top:22px; display:inline-block; width:22px; height:24px; background:url(../images/refresh.png); text-indent:-9999px; vertical-align:middle;}
#login form .btn{margin-top:30px;}
#login form .btn p{font-size:14px; color:#444; text-align:center;}
#login form .btn button{display:block; width:230px; margin:10px auto 0 auto; background:#1baacc; border:none; font-size:16px; color:#FFF; line-height:50px; text-align:center; transition:all .3s;}
#login form .btn button:hover ,
#login form .btn a:hover{opacity:.6;}

#login .first{max-width:640px; margin:0 auto; padding:20px; background:#f1f1f1; box-sizing:border-box;}
#login .first h2{padding-top:10px; font-size:20px; color:#1baacc; text-align:center;}
#login .first p{padding:10px 0; font-size:14px; color:#444w; text-align:center;}
#login .first a{display:block; width:230px; margin:10px auto; background:#1baacc; border:none; font-size:16px; color:#FFF; line-height:50px; text-align:center; transition:all .3s;}
#login .first a:hover{opacity:.6;}

/* fill-form */
#fill-form{overflow:hidden;}
#fill-form .group{width:48%; margin-top:10px;}
#fill-form #payer{float:left;}
#fill-form #receiver{float:right;}
#fill-form #register{max-width:640px; margin:20px auto 0 auto;}
#fill-form h2{margin-bottom:10px; font-size:18px; color:#444;}
#fill-form li{position:relative; padding:10px 0 10px 140px;}
#fill-form li span{position:absolute; left:0; top:10px; display:block; width:135px; padding-left:20px; font-size:16px; color:#444; line-height:40px; box-sizing:border-box;}
#fill-form li input ,
#fill-form li select{display:block; width:100%; height:40px; padding:0 10px; border:1px solid #333; font-size:14px; color:#444; box-sizing:border-box;}
#fill-form li textarea{display:block; width:100%; height:150px; padding:10px; border:1px solid #333; font-size:14px; color:#444; box-sizing:border-box;}

#fill-form li.required span:before{content:"＊"; position:absolute; left:0; top:4px; color:#1baacc;}

#fill-form li.birth{overflow:hidden;}
#fill-form li.birth select{float:left; width:32.33%;}
#fill-form li.birth select.month{margin:0 1.5%;}

#fill-form li.address{overflow:hidden;}
#fill-form li.address select.city{float:left; width:49%; margin-bottom:10px;}
#fill-form li.address select.section{float:right; width:49%;}

#fill-form li.verify{padding-right:160px;}
#fill-form li.verify img{position:absolute; right:50px; top:10px; display:inline-block; vertical-align:middle;}
#fill-form li.verify .refresh{position:absolute; right:20px; top:18px; display:inline-block; width:22px; height:24px; background:url(../images/refresh.png); text-indent:-9999px; vertical-align:middle;}

#fill-form li.check{padding:30px 0; font-size:15px; color:#666; text-align:center;}
#fill-form li.check input{display:inline-block; width:15px; height:15px; margin-right:5px;}
#fill-form li.check a{color:#1baacc;}
#fill-form li.check a:hover{text-decoration:underline;}

#fill-form li.copy{color:#1baacc; line-height:40px;}
#fill-form li.copy input{display:inline-block; width:15px; height:15px; margin-right:5px; vertical-align:middle;}

#fill-form li.invoice label{display:inline-block; margin:8px 20px 0 0;}
#fill-form li.invoice label input{display:inline-block; width:15px; height:15px; margin-right:10px;}
#fill-form .note{font-size:16px; color:#000; line-height:30px; text-align:center;}
#fill-form .note span{position:relative; top:5px; font-size:30px; vertical-align:middle}

#fill-form .forget{padding-bottom:20px; font-size:18px; color:#333; line-height:30px; text-align:center;}

#fill-form table{width:100%; border:1px solid #CCC;}
#fill-form tr{border-bottom:1px dashed #CCC;}
#fill-form td{padding:15px 20px; box-sizing:border-box;}
#fill-form .label{width:130px; background:#f1f1f1; border-right:1px solid #CCC;}
#fill-form .regtip{margin-bottom:20px; font-size:16px; color:#333; letter-spacing:.5px;}
#fill-form .regtip span{color:#e73828;}

#fill-form .btn{clear:both; padding-top:30px; text-align:center;}
#fill-form .btn button ,
#fill-form .btn a{display:inline-block; width:230px; margin:10px; border:none; font-size:16px; color:#FFF; line-height:50px; text-align:center; transition:all .3s;}
#fill-form .btn button[type="submit"]{background:#1baacc;}
#fill-form .btn button[type="reset"] ,
#fill-form .btn .grey{background:#666;}
#fill-form .btn button:hover ,
#fill-form .btn a:hover{opacity:.6;}

/* cart-step */
#cart-step{margin-bottom:50px; overflow:hidden;}
#cart-step li{float:left; width:20%; padding:20px; background:#f1f1f1; border-right:1px dotted #FFF; font-size:16px; color:#444; box-sizing:border-box;}
#cart-step li b{display:block; font-size:14px;}
#cart-step li span{display:block; font-size:14px; color:#999;}
#cart-step li.active{background:#000; color:#FFF;}
#cart-step li.active span{color:#666;}

/* viewcart */
#viewcart .list{width:100%; font-size:14px; color:#333;}
#viewcart .list tr{border-bottom:1px solid #f1f1f1;}
#viewcart .list td ,
#viewcart .list th{padding:15px 20px; box-sizing:border-box;}
#viewcart .list td span{display:block; color:#d91255;}
#viewcart .list td input{display:inline-block; width:60px; height:30px; padding:0 10px; border:none; border-bottom:1px solid #333; font-size:14px; color:#444; box-sizing:border-box;}
#viewcart .list td .del{display:inline-block; width:17px; height:17px; background:url(../images/del.png) center center no-repeat #000; text-indent:-9999px; transition:all .3s;}
#viewcart .list td .del:hover{background-color:#999;}
#viewcart .list .col-1 a{color:#000;}
#viewcart .list .col-1 a:hover{color:#CCC;}
#viewcart .list .col-2 ,
#viewcart .list .col-3 ,
#viewcart .list .col-4 ,
#viewcart .list .col-5{width:100px; text-align:center;}

#viewcart .list.breakpoint > tbody > tr > td.expand{position:relative; padding-left:30px}
#viewcart .list.breakpoint > tbody > tr > td.expand:before{content:"+"; position:absolute; left:10px; top:11px; font-size:20px; color:#333; cursor:pointer;}
#viewcart .list.breakpoint > tbody > tr.footable-detail-show > td.expand:before{content:""; left:13px; top:23px; display:block; width:10px; height:2px; background:#333;}
#viewcart .list .footable-row-detail-inner div{padding:5px 0;}

#viewcart .offers{width:100%; font-size:16px; color:#333;}
#viewcart .offers thead{background:#ffede4; font-weight:bold;}
#viewcart .offers tr{border-bottom:1px solid #999;}
#viewcart .offers td{padding:15px 20px; border-right:1px solid #CCC; box-sizing:border-box;}
#viewcart .offers td:last-child{border:none;}
#viewcart .offers .col-2{width:100px;}

#viewcart .price{padding:10px 20px; font-size:16px; color:#444; text-align:right;}
#viewcart .price li{padding:5px 0;}
#viewcart .price li.discount{color:#1baacc;}
#viewcart .price li span{display:inline-block; width:150px; vertical-align:top;}
#viewcart .price li span b{}
#viewcart .price li span b:before{content:"NT$";}

#viewcart .payment{margin-bottom:50px;}
#viewcart .payment li{position:relative; font-size:16px; color:#444; line-height:40px;}
#viewcart .payment li span{display:inline-block; margin-right:10px;}
#viewcart .payment li span input{position:relative; top:3px; width:20px; height:20px;}

#viewcart .shipment{position:relative; font-size:16px; color:#444; line-height:40px;}
#viewcart .shipment select{display:block; width:100%; max-width:250px; height:40px; padding:0 10px; border:1px solid #333; font-size:14px; color:#444; box-sizing:border-box;}

#viewcart .pay-info{margin:30px auto; padding:20px; background:#f9f9f9; font-size:14px; color:#444; line-height:40px;}

#viewcart .confirm li{padding:10px 0; border-top:1px solid #999; font-size:16px; color:#444;}
#viewcart .confirm b{color:#000;}
#viewcart .confirm span{display:block; color:#000; font-weight:bold;}
#viewcart .confirm table{width:100%;}
#viewcart .confirm tr{border-bottom:1px solid #f1f1f1;}
#viewcart .confirm td{padding:15px 0; box-sizing:border-box;}
#viewcart .confirm .label{width:110px; color:#000;}

#viewcart .success{padding:50px 0; font-size:16px; color:#444; line-height:30px; text-align:center;}

#viewcart .btn{padding-top:20px; text-align:center;}
#viewcart .btn a ,
#viewcart .btn button{display:inline-block; width:230px; margin:10px; border:none; font-size:16px; color:#FFF; line-height:50px; text-align:center; transition:all .3s;}
#viewcart .btn .red{background:#1baacc;}
#viewcart .btn .grey{background:#666;}
#viewcart .btn a:hover ,
#viewcart .btn button:hover{opacity:.6;}

/* order-list */
#order-list{width:100%; font-size:14px; color:#333;}
#order-list tr{border-bottom:1px solid #f1f1f1;}
#order-list td ,
#order-list th{position:relative; padding:15px 10px; word-break:break-all; box-sizing:border-box;}
#order-list td span{color:#000; font-weight:bold;}
#order-list td a{color:#1baacc; text-decoration:underline; transition:all .3s;}
#order-list td a:hover{color:#333; text-decoration:none;}

#order-list.breakpoint > tbody > tr > td.expand{padding-left:30px;}
#order-list.breakpoint > tbody > tr > td.expand:before{content:"+"; position:absolute; left:10px; top:11px; font-size:20px; color:#333; cursor:pointer;}
#order-list.breakpoint > tbody > tr.footable-detail-show > td.expand:before{content:""; left:13px; top:23px; display:block; width:10px; height:2px; background:#333;}
#order-list .footable-row-detail-inner div{padding:5px 0;}

/* contact */
#contact{overflow:hidden;}

#contact .map{float:left; width:48%; margin-top:10px;}
#contact .map .wrap{position:relative; padding-bottom:100%;}
#contact .map iframe{position:absolute; left:0; top:0; width:100%; height:100%;}

#contact .form{float:right; width:48%;}

#contact li{position:relative; padding:10px 0 10px 110px;}
#contact li span{position:absolute; left:0; top:10px; display:block; width:135px; padding-left:20px; font-size:16px; color:#444; line-height:40px; box-sizing:border-box;}
#contact li input ,
#contact li select{display:block; width:100%; height:40px; padding:0 10px; border:1px solid #333; font-size:14px; color:#444; box-sizing:border-box;}
#contact li textarea{display:block; width:100%; height:150px; padding:10px; border:1px solid #333; font-size:14px; color:#444; box-sizing:border-box;}

#contact li.required span:before{content:"＊"; position:absolute; left:0; top:4px; color:#1baacc;}

#contact li.required.txt:after{display:none;}
#contact li.required.txt span:before{display:inline-block;}

#contact li.verify{padding-right:160px;}
#contact li.verify img{position:absolute; right:50px; top:10px; display:inline-block; vertical-align:middle;}
#contact li.verify .refresh{position:absolute; right:20px; top:18px; display:inline-block; width:22px; height:24px; background:url(../images/refresh.png); text-indent:-9999px; vertical-align:middle;}

#contact .note{margin:10px 0; font-size:15px; color:#333; line-height:25px;}
#contact .note a{color:#e73828;}

#contact .btn{padding-top:30px; text-align:center;}
#contact .btn button ,
#contact .btn a{display:inline-block; width:230px; margin:10px; border:none; font-size:16px; color:#FFF; line-height:50px; text-align:center; transition:all .3s;}
#contact .btn button[type="submit"]{background:#1baacc;}
#contact .btn button[type="reset"] ,
#contact .btn .grey{background:#666;}
#contact .btn button:hover ,
#contact .btn a:hover{opacity:.6;}

/* event */
#event dl{display:table; width:100%; padding:5% 0; border-bottom:1px solid #f1f1f1;}
#event dl:last-child{border:none;}
#event dt{display:table-cell; width:300px; padding-right:50px; vertical-align:middle;}
#event dt img{display:block; width:100%; height:auto;}
#event dd{display:table-cell; padding-right:50px; vertical-align:middle;}
#event dd span{display:block; margin-bottom:5px; font-size:14px; color:#999;}
#event dd h2{margin-bottom:10px; font-size:22px; color:#444; font-weight:normal}
#event dd p{font-size:16px; color:#777; line-height:30px; letter-spacing:.5px;}



/* RWD */
@media screen and (max-width:1100px){
/* product */
#product .feature .img-show{padding:0;}
#product .feature .img-show .full{margin-bottom:1px;}
#product .feature .img-show .shortcut{position:static; width:100%; font-size:0;}
#product .feature .img-show .shortcut li{display:inline-block; max-width:80px; border-right:1px solid #FFF;}
}

@media screen and (max-width:1000px){
/* header */
#header .wrap{padding:10px 0;}
#logo{margin:0;}
#navigation{display:none;}
/* mobile */
#mobi-btn{display:block;}
/* float-product */
#float-product{display:none !important;}
/* product-list */
#product-list dl{width:32.33%; margin:10px 1.5% 10px 0 !important;}
#product-list dl:nth-child(3n){margin-right:0 !important;}
/* login */
#login{padding:0;}
#login .first{position:relative; width:100%; margin-top:20px;}
#login .first a{position:static; margin:20px auto;}
}

@media screen and (max-width:768px){
/* container */
#container{padding:20px 0;}
#container .left .ad{margin-bottom:20px;}
/* product-type */
#product-type{margin-bottom:20px;}
/* product-list */
#product-list dl{width:49%; margin:10px 2% 10px 0 !important;}
#product-list dl:nth-child(3n){margin-right:2% !important;}
#product-list dl:nth-child(2n){margin-right:0 !important;}
#product-list dt:before{display:none;}
#product-list dt .control{top:auto !important; bottom:0; overflow:hidden;}
#product-list dt .control a{float:left; width:50%; height:auto; margin:0; padding:10px 0; background:rgba(0,0,0,.9); border-radius:0; font-size:14px; color:#FFF; text-align:center; text-indent:0; box-sizing:border-box;}
#product-list dt .control a.view{border-right:1px solid #FFF;}
/* product */
#product .feature .img-show ,
#product .feature .detail{float:none; width:100%; padding:0;}
#product .feature .img-show{margin-bottom:50px;}
/* news */
#news li{float:none !important; width:100%;}
/* fill-form */
#fill-form #payer ,
#fill-form #receiver{float:none; width:100%;}
#fill-form #payer{margin-bottom:50px;}
/* contact */
#contact .map ,
#contact .form{float:none; width:100%;}
#contact .map{margin-bottom:50px;}
}

@media screen and (max-width:640px){
/* event */
#event dl{display:block;}
#event dt ,
#event dd{display:block; width:100%; padding:0}
#event dt{margin-bottom:20px;}
}

@media screen and (max-width:480px){
/* search */
#search .wrap .search{width:100%; margin:0;}
#search .wrap .keyword{display:none;}
/* container */
#container .left .ad{display:none;}
/* product-type */
#product-type{display:none;}
/* product-list */
#product-list h2 span{float:none; display:block;}
#product-list dl{float:none; width:100%; margin:10px auto !important;}
/* product */
#product .feature .detail .addcart{width:100%;}
/* login */
#login form li.verify{padding-right:20px;}
#login form li.verify input{margin-bottom:10px;}
#login form li.verify img ,
#login form li.verify .refresh{position:static; margin-right:10px;}
/* fill-form */
#fill-form li{padding:10px 0;}
#fill-form li span{position:relative; top:auto; padding-left:0}
#fill-form li.required span{padding-left:20px;}
#fill-form select{float:none !important; width:100% !important; margin:0 auto 10px auto !important;}
#fill-form li.verify img{top:50px;}
#fill-form li.verify .refresh{top:58px;}
/* cart-step */
#cart-step li{float:none; display:none; width:100%;}
#cart-step li.active{display:block;}
/* order-list */
#order-list td{border:none;}
/* contact */
#contact li{padding:10px 0;}
#contact li span{position:relative; top:auto; padding-left:0}
#contact li.required span{padding-left:20px;}
#contact select{float:none !important; width:100% !important; margin:0 auto 10px auto !important;}
#contact li.verify img{top:50px;}
#contact li.verify .refresh{top:58px;}
}