/* 縮小失敗。正在傳回未縮小的內容。
(2881,22): run-time error CSS1062: Expected semicolon or closing curly-brace, found '5'
 */
/*! 
    ***************************************************************************************
    20150930 mod by Haley 此css定義為[設計師專頁]使用 
    
    ***************************************************************************************
*/
.page_view_inner { max-width:1200px;}

.container #wrapper{ font-size: 16px; line-height: 1.8em;}
a{text-decoration: none; cursor: pointer;}
.nav { max-width: 60em; margin: 0 auto; line-height: 45px; height: 45px; }

.kind_bcolor_green { border-left: 3px solid #369a8a; }
.kind_bcolor_blue { border-left: 3px solid #47a0b6; }
.kind_bcolor_yellow { border-left: 3px solid #f2aa44; }
.kind_bgcolor_likeWhite { background-color: #f7f7f7; }
.kind_bgcolor_gray { background-color: #eaeaea; }
.transparent{
  background-color: rgba(255,255,255,0) !important;
  color:#fff !important;
  box-shadow:none !important;
  margin:0 !important;
  padding:10px !important
}

.collapse_box{ width:960px;  margin-top: 65px;}
.collapse strong {
    width: auto;
}

/*-------------- 元件-按鈕-文字外觀設定 ----------------*/
.btn_green{ display:block; width:100%;  height:40px; line-height:40px; text-align: center; color: #fff; background-color: #009688;  margin-top:30px; }
.btn_green:hover , .btn_grey:hover , .btn_project_info_show:hover{background-color: #00796B;}
.btn_green_square{display: block;  text-align: center; color:#48b6a5; border:1px solid #48b6a5;height:40px; line-height: 40px;}
.btn_green_square:hover , .btn_white_square:hover{background-color:#00796B; border: 1px solid #00796B; color: #fff; text-shadow: 0px 0px 0px rgba(33, 33, 33, 0); box-shadow: 0px 0px 0px rgba(33, 33, 33, 0); }
.btn_grey{ clear:both; display: block; text-align: center; background-color:#B6B6B6; color: #fff;height: 40px; line-height: 40px; font-size: 0.9375em; margin-top:20px; }
.btn_white_square{display:block; height:40px; line-height: 40px; width: 250px; text-align: center; color:#fff; border: 1px solid #fff;}
.date{display:block; width:100%;	font-size:10px;	color:#999; line-height:1.5em;}
.scribe{ display: block; width:30px;  text-align: center; margin: 0 auto; border:2px solid #f49e22;}
.video_time{ display: block; font-size: 13px; background-color: rgba(0,0,0,.5); width: 50px; height: 25px; color: #fff; line-height: 25px; text-align: center;}
.episode{ display:block; font-size: 14px; text-align:left; color: #333;  width: 100%;}
.play_video{ opacity:1;display:block; width:97px; height:97px; background-image: url(../images/video/big_play_white.png); background-repeat: no-repeat; margin: 0 auto;}
.play_video:hover{background-image: url(../images/video/big_play_black.png);}
.play_video_small{ opacity:1;display:block; width:69px; height:69px; background-image: url(../images/video/play_white.png); background-repeat: no-repeat; margin: 0 auto;} 
.play_video_small:hover{background-image: url(../images/video/play_black.png);} 
.btn_square_pre { display:inline-block;width:46px; height:46px; background-image: url(../images/index_arrow_pre.png); position:absolute; z-index:1; }
.btn_square_next { display:inline-block;width:46px; height:46px; background-image: url(../images/index_arrow_next.png); position:absolute; z-index:1;}


/*-------------- 封面照片 ----------------*/
.coverborder { display: block; margin:0 auto; max-width: 1200px; min-width: 320px; height: 400px; background-color: #000; height:400px; background-position: 50% 50%; position: relative; background-size: cover;}

/*-------------- 大頭照與資訊 ----------------*/
.profile nav ul li ~ .hideVideoTab{display: none}
.profile .nav ul li ~.hideVideoTab{display: none}
.borderheadline{ max-width: 1200px; height:50px; background-color: #21262a; margin: 0 auto;}
.profile{ max-width:60em; min-width: 320px; margin: 0 auto;position: relative; height:50px;}
.profile a:hover{color:#00796B;}
.headerimg{ display: block; width: 150px; height:150px; border:5px solid #fff; position:absolute; top:-130px; left:10px;  border-radius: 150px; background-color:#fff; }
.headerimg img{ max-width: 150px; height: 150px; border-radius: 100%; }
.profile h2 a , .profile strong a, .profile span a{ display: inline-block;  float:left; color: #fff; position: absolute; top:-110px; left:200px; font-size:1.375em; font-weight: bolder; line-height: 1.4em; text-shadow: 2px 2px 0px rgba(33, 33, 33, 0.5);}
.profile h2 a span {font-size:.8em;}
.profile strong a{ top:-40px;font-size:1em; }
.profile nav,.profile .nav{ 
max-width: 60em;
        margin: 0 auto;
        line-height: 45px;
        height: 45px;
        text-align: center; width:auto; float: left; margin-left:30%;   }
.profile nav ul li,.profile .nav ul li{ display:inline-block; }
.profile nav ul li a,.profile .nav ul li a{ padding: 0 13px; color: #fff; font-size:0.9375em; }

/*-------------- 功能 ----------------*/
.action { font-size:0.875em; width:auto; height: 50px; float:right;}
.action a{ display: inline-block; width:90px; height: 30px; line-height:30px;  margin-top:9px; margin:10px; }
.action a:hover{ background-color:#00796B; border: 1px solid #00796B; color:#fff;}

/*-------------- 關於與聯絡 ----------------*/
.profile_content{ clear: both; max-width:60em; min-width: 320px;  height: auto; margin: 0 auto; padding:20px; box-sizing: border-box; -webkit-box-sizing:border-box;  -moz-box-sizing: border-box; -ms-box-sizing: border-box; }
.aboutme{ display:inline-block; float:left; max-width:600px; min-width:320px; }
.profile_content h3{ display: block; width: 100%; font-size:12px; color: #666;  }
.profile_content h4{  color: #009688; font-weight:bolder; font-size:1.25em; margin: 5px 0; }
.profile_content h4.seo {text-indent: 100%; overflow: hidden; height: 0; white-space: nowrap;  margin: 0; display:none; }
.profile_content p{ font-size:.875em; color:#333; width:600px; }
.aboutme_btn{ display:none;   }

/*-------------- 證照 ----------------*/
.license{ display: block; max-width:600px; min-width:321px;float:left;  height:auto; margin-top: 20px; }
.license ul { display:inline-block;  /*margin-top: 20px;*/}
.license ul li { display: inline-block; width:80px; height:80px; /*margin:0 10px;*/}
.license ul li a:hover { opacity: .7; filter: opacity(70);}
.license ul li a { display: block;width: 80px;height: 80px; background-repeat:no-repeat;}
.btn_ad_pre , .btn_ad_next {display:inline-block;width:10px; height:20px; background-image:url(../images/products/arrow_s_left_07.png);background-repeat: no-repeat;background-position: center;margin:35px 15px;float: left;cursor: pointer;}
.btn_ad_pre { margin-right:20px; }
.btn_ad_pre:hover , .btn_ad_next:hover{opacity: .5; filter: opacity(50);}
.btn_ad_next{ background-image:url(../images/products/arrow_s_right_07.png); float: right;}
.license .bx-next,.license .bx-prev{display:none;}

/*-------------- 社群元件 ----------------*/
/* 20161018 Dylan 改與文章頁的分享元件圖相同 */
.social_link{  margin:0 auto; text-align:center; top: 50%; margin-top:50px;  display: inherit; }
.social_link ul li:hover { opacity: .7; filter: opacity(70);}

/*----屋主見證----*/
/*.prove{ padding:20px; box-sizing: border-box;}
.Prove_container{width:90%;overflow:hidden;position: relative;padding-left:50px;padding-right:50px;}
.Prove_container .swiper-wrapper{overflow:hidden;margin:0 auto;}
.prove h2{color:#009688; padding-bottom: 10px; }
.prove_column{ display: block; }
.prove_column span{font-size: 14px; color:#666;}
.prove_column p{ margin-left:45px;position: relative;}
.prove_column p:before{display: inline-block; content:""; width: 40px; height: 1px; background-color:#666;position:absolute;left:-45px;top:12px;}
.prove_column h3{font-size:.9em;text-align: end;margin-top: 10px;}
.prove_column h3 a{color: #e58222;text-decoration: underline;}
.prove h3 { display: block; font-size:1.375em; font-weight: bold; text-align: center;  line-height:1.8em; padding: 30px 0; color: #333; }
.prove .btn_arrow_pre { display:inline-block;width:46px; height:46px; background-image: url(https://searchome-aws.hmgcdn.com/images/index_arrow_pre.png); position:absolute; z-index:1; top:30px; left:0; }
.prove .btn_arrow_next { display:inline-block;width:46px; height:46px; background-image: url(https://searchome-aws.hmgcdn.com/images/index_arrow_next.png); position:absolute; z-index:1; top:30px; right:0; }*/
.prove{ padding:20px; box-sizing: border-box;}
.prove h3 { display: block; font-size:1.375em; font-weight: bold; text-align: center;  line-height:1.8em; padding: 30px 0; color: #333; }
.give_back{display:flex; max-width:1200px;margin: 0 auto;box-sizing: border-box; padding: 40px 0; justify-content:center;position: relative;}
.give_back .item i{display: block; width: 150px;height: 30px; border-radius: 30px;background-color: #000;color: #fff;text-align: center;line-height: 30px;position: relative;z-index: 1;right:-70px;top: 10px;}
.give_back .item i:after{content:""; border:solid 10px;border-color:#000 transparent transparent transparent;position: absolute;bottom:-20px;right:30px;}
.give_back .item a{display: block; width: 250px; height: 250px; border-radius: 100%;background-color:#f4f4f4;padding:55px 35px;box-sizing: border-box;position: relative;margin: 0 20px;}
.give_back .item a:hover{background-color:#b79e3c; color: #fff;}
.give_back .item a:before{content: ""; display: block; width: 260px; height: 260px;border-radius: 100%; border:1px solid #b79e3c; position: absolute;top:-15px;left:-15px;}
.give_back .slide_left_arrow{position:absolute;top: 50%; left:-20px; z-index:2;}
.give_back .slide_right_arrow{position:absolute;top: 50%; right:0px; z-index:2;}
.give_back.itemNoArrow .slide_left_arrow,.give_back.itemNoArrow .slide_right_arrow{display:none;}

/*-------------- 9/7 熱門影音 ----------------*/
.video_news{ max-width: 100%; min-width: 320px; background-color:#eaeaea; padding-bottom:50px;  }
.video_box{ max-width: 960px;  /*height:306px;*/ margin: 0 auto; overflow: hidden; box-sizing:border-box; background-color: #fff; }
.video_left{ display:inline-block; max-width:500px; height:273px;  position:relative; float: left; margin-right: 20px;     overflow: hidden;}
.video_img img{ display: inline-block; width:100%; /*height:333px;*/}
.video_left .tag_video{ position: absolute; top: 0; left: 0;}
.video_news .video_time{ display: block; position: absolute; right: 0; top: 0; font-size: 13px; background-color: rgba(0,0,0,.7); width: 50px; height: 25px; color: #fff; line-height: 25px; text-align: center;}
.video_left .play_video{  position: absolute; left:40%; top:34%;}
.video_left:hover .play_video{background-image: url(../images/video/big_play_black.png);}
.video_right{ width: 100%; background-color: #fff;}
.video_box h4 a{ display: block;  font-size:1.375em; text-align: left; line-height: 1.5em; color: #333; padding: 0 5px; font-weight:bold;}
.video_box h4 a:hover{ color: #00796B;}
.video_box p { padding:10px; }
.video_box p,.video_box p a { display: block; font-size: 14px; line-height:1.6em;  color: #666; }
.video_box p a:hover{  color: #000;}
.video_box .episode{ margin-top: 10px;}
.video_news h3 { display: block; font-size:1.375em; font-weight: bold; text-align: center;  line-height:1.8em; padding: 30px 0; color: #333; }

/*-------------- 9/7 最新影音列表 ----------------*/
.history_video { max-width: 100%; min-width: 320px; height:auto;  padding-bottom: 40px;position:relative; margin-top: 40px; }
.history_video ul{ display: block; /*max-width:960px; min-width:320px;*/ height: auto;  overflow: hidden; margin: 0 auto;  position:relative;}
.history_video ul li{ display:inline-block; float:left; width:310px;  background-color: #fff;  /*margin-right: 15px;*/ position:relative; }
/*.history_video ul li:nth-child(n+3){ margin-right: 0;}*/
.history_video ul li img{ width:100%;}
.history_video .tag_video{ position: absolute; top:0; left: 0;}
.history_video .video_time{ position:absolute; top:0; right: 0;}
.history_video h4{  text-align: left; line-height: 1.5em; font-weight: bold;}
.history_video h4 a{ color: #333; -webkit-text-size-adjust: 100%;}
.history_video h4 a:hover{ color: #00796B;}
.history_video .play_video_small{ position: absolute; top:50%;left: 40%; margin-top: -70px;  }
.history_video .bx-controls-direction .bx-prev { display:inline-block;width:46px; height:46px; background: url(../images/index_arrow_pre.png); z-index:1; position:absolute; z-index:1;left: 50%; margin-left: -550px; top:50%;}
.history_video .bx-prev:hover  {opacity: .7; filter: opacity(70); margin-left:-560px;}
.history_video .bx-controls-direction .bx-next { display:inline-block;width:46px; height:46px; background: url(../images/index_arrow_next.png); z-index:1; position:absolute; z-index:1;right: 50%; margin-right:-550px; top:50%;}
.history_video .bx-next:hover {opacity: .7; filter: opacity(70); margin-right:-560px;}
.history_video .btn_green{ width: 310px; margin: 0 auto; margin-top: 40px;}
.history_video .bx-wrapper { display:block; }
    .history_video .li_side>a {
        display:block;
        overflow:hidden;
        height:170px;
    }
.history_video h3{ display: block; font-size:1.375em; font-weight: bold; text-align: center;  line-height:1.8em; padding: 30px 0; color: #333; }

/*-------------- 設計師首頁_代表作 作品內頁 ----------------*/
.news{ max-width: 100%;min-width: 320px; background-color:#eaeaea; padding-bottom:50px; margin-top:50px; }
.news .project_box_mask{max-width:960px; min-width: 320px; height: 400px; overflow: hidden; position: relative; margin: 0 auto;}
.news h3 { display: block; font-size:1.375em; font-weight: bold; text-align: center;  line-height:1.8em; padding: 30px 0; color: #333; }
.project_box_mask{display: block; max-width:1200px; min-width: 320px; height: 400px; overflow: hidden; position: relative; margin: 0 auto;}
.project_box_mask span a{ display: block; width: 100%; height: 400px; background-color: rgba(0,0,0,.3); position: absolute; z-index: 5; top: 0; opacity: 0;}
.project_img{  display: block; width: 100%; margin: 0 auto; /*background-image: url(images/visual.jpg);*/ background-size: cover; background-color: #000; height: 400px; background-position: 50% 50%; position:absolute; top: 0; left: 0; }
.project_box_mask:hover > .project_img{      -webkit-transform: scale(1.02, 1.02);
-moz-transform: scale(1.02, 1.02);   -ms-transform: scale(1.02, 1.02);   -o-transform: scale(1.02, 1.02);   transform: scale(1.02, 1.02);-webkit-transition: all 200ms ease-out;    -moz-transition: all 200ms ease-out;    -o-transition: all 200ms ease-out;    -ms-transition: all 200ms ease-out;    transition: all 200ms ease-out;}

.project_caption{ display: block;position:relative; z-index: 9; padding-top:80px; box-sizing: border-box;}
.Layout2024 .project_caption{ padding-top:80px;}
.project_caption h4 {font-size:1.375em;}
.project_caption h4,.project_caption h4 a{ display: block; text-align: center; margin: auto; font-weight:bolder; color: #fff;  line-height: 1.4em; padding: 0 20px; margin:20px 0; }
.project_caption span{ display: block; text-align: center; margin: 0 auto; font:13px; color: #c89863;margin-bottom: 10px;padding: 0 10px;}
.project_caption ul { display: block; width: 100%; margin: auto; text-align: center; margin-top: 15px;padding: 0 20px; box-sizing: border-box; }
.project_caption ul li{ display: inline-block; height: 14px; line-height: 14px;  color: #fff; font-size: .875em; padding: 0 20px; border-right: 1px solid #fff;}
.project_caption ul li:last-child{border-right: 0;}

.project_label { font-size:14px; color:#fff; text-align:center; }

.introduce{ display: block; width: 100%; margin: auto; text-align: center; margin-top:40px; opacity: 0; }
.introduce a{ display: inline-block; padding: 0 20px; margin: 0 10px; width: 50px; }
.introduce a:hover{background-color:#00796B; border: 1px solid #00796B; color:#fff; }
.project_box_mask:hover > span a{opacity: 1; }
.project_box_mask:hover .introduce {opacity:1;}
.project_box_mask:hover > section a {opacity:1;}

.project_box_mask section{display: block;position:relative; z-index: 9; /*padding-top: 80px;*/ box-sizing: border-box;}
.project_box_mask section h4 { font-size:1.375em;}
.project_box_mask section a{max-width:600px; margin: 0 auto; margin-top:20px; opacity: 0;}
.project_box_mask section h4,.project_box_mask section h4 a{ display: inline-block; width:100%;  color:#fff; font-size:22px;  line-height: 1.4em; text-align: center; font-weight: bold; margin-top: 20px; margin-bottom: 20px; padding: 40px 20px 0 20px; box-sizing: border-box; opacity: 1;}

.project_box_mask .play_video{opacity:1;display:block; width:97px; height:97px; background-image: url(../images/video/big_play_white.png); background-repeat: no-repeat; margin: 0 auto;}

.project_box_mask .play_video:hover{background-image: url(../images/video/big_play_black.png);}







.img_right{ right:50%; background-position:50%; width:50%;  float:right;  }
.img_left{ left:50%;background-position:50%; width:50%; float: left;   }
.project_frame{display: block; max-width: 1200px; min-width: 320px; height: 400px; overflow: hidden; position: relative; margin: 0 auto;}
.project_frame .project_caption{ right:50%; background-position:50%; width:50%;  float:right; display: block;  height: inherit; background-color:#1b1b1c; box-sizing: border-box; }
.project_caption:after { content:""; display: block;  border:35px solid;  border-color:  transparent transparent transparent #1b1b1c; position:absolute; right:-70px; top:150px;}
.project_caption:before { content:""; display: block;  border:35px solid;  border-color:  transparent #1b1b1c transparent transparent ; position:absolute; left:-70px; top:180px;}
.project_frame .introduce {opacity:1; }


/*-------------- 設計師關於我們_接案訊息_聯絡我們 ----------------*/
.aboutus{ color: #333; margin-top:55px;}
.aboutus h3{ display: block; font-size:1.375em; font-weight: bold; text-align: center;  line-height:1.8em; padding: 20px 0; color: #333;}
.aboutus h4 , .contactus  h4 a{ display: block; color: #009688; font-weight: bold; font-size:16px; }
.aboutus h3 .scribe { display: block; width:70px;  text-align: center; margin: 0 auto; border:2px solid #f49e22;}
.overviews{ display: block; width: 100%;}
.overviews div , .contactus > div , .teams div{ display: block; max-width: 60em; min-width: 320px; height:auto; margin: 0 auto; overflow:hidden; margin-bottom:30px;}
.overviews  ul li , .contactus > ul li { display: inline-block; width:32%; margin: 0 auto; font-size:.875em; line-height: 1.6em; padding: 0 15px; margin-top:10px;  box-sizing: border-box;}
.overviews ul{ display: block; text-align: center; margin: auto;}
.overviews ul li table , .contactus ul li table{ line-height: 2em; text-align: left;}
.overviews ul li th { width:70px;}
.overviews ul li th.extra{width:100px;}
.contactus { clear:left; display: block;  width: 100%; background-color: #eaeaea; overflow: hidden; }
.overviews ul  h4, .contactus  h4 a { text-align: left; padding-left: 3px; box-sizing: border-box;}
.contactus h4 a:hover,.contactus h4 .afocus{ color: #fff; background-color:#009688;}
.contactus > ul{ display: block; text-align: center; margin: auto;}
.contactus > ul li th{ width:40px;text-align:left;}
.contactus > ul li td a{ color: #333;}
.contactus > ul li td a.phoneText{ color:#009688; }
.contactus > ul li td a i{ display:none;margin-left: 8px;  }
.contactus > ul li td a:hover{ color:#009688; }
.map{ display: block; width:100%; height:300px; /*background-image:url(images/map.jpg);*/ }


/*-------------- 公司陣容 ----------------*/
.teams{ display: block; background-color: #1b1b1c; overflow: hidden; position: relative;}
.teams h3{ color: #fff;  }
.teams ul{ display: block; text-align: center; margin-top:15px;}
.teams ul li{ display:inline-block; margin:10px 30px;  }
.teams ul li a{ display: block; width: 150px; height: 150px;border-radius:50%; margin-bottom:10px;}
.teams ul li a img{border-radius:50%;height: auto;}
.teams .manager li a img{width: 150px; height: 150px;}
.teams .staff li a img{width: 120px; height: 120px;}
    /*.staff a img{width: 120px;}*/
.teams li a:before{content: ""; display: block; width:150px; height:150px;  border-radius:50%; box-shadow: 0 0 0 6px #fff inset;  opacity: .3;  position: absolute; -webkit-transition: -webkit-transform 0.5s, opacity 0.5s;   -moz-transition: -moz-transform 0.5s, opacity 0.5s;  transition: transform 0.5s, opacity 0.5s;}
.teams ul li a:hover:before{opacity:.9; }
.teams strong{ color: #fff;}
.teams .staff  h4  { display: inline-block; font-size: 0.875em; margin: 0 10px;}
.teams .staff strong{ display: inline-block; font-size: 0.875em;}
.teams .staff li a { width: 120px; height:120px;}
.teams .staff li a:before{ width:120px; height:120px; }
.teams .arrow_pre ,  .teams .arrow_next , .award_img .arrow_pre , .award_img .arrow_next{ display: block; width: 30px; height: 60px;  position: absolute; top:50%; }
.teams .arrow_pre , .award_img .arrow_pre { background-image: url(../images/arrow_b_left.png); left:2%;   }
.teams .arrow_next ,  .award_img .arrow_next{ background-image: url(../images/arrow_b_right.png); right:2%;   }
.teams .arrow_pre:hover{ opacity:.3; filter: opacity(30);left:1.5%;}
.teams .arrow_next:hover{ opacity:.3; filter: opacity(30);right:1.5%;}

/*----------------------證照展示--------------------------------*/
.award{ width: 100%;  background-image: url(../images/designerintro/award_bg.jpg);  height: auto; min-height: 200px; background-size: cover; background-color: #009688;  }
.award_bg{ display: block; width: 100%; height:500px;   position: absolute; 
background: -moz-linear-gradient(top,  rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%); 
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.65)), color-stop(100%,rgba(0,0,0,0))); 
background: -webkit-linear-gradient(top,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); 
background: -o-linear-gradient(top,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
background: -ms-linear-gradient(top,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); 
background: linear-gradient(to bottom,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); }

.award h3{color: #fff; position:relative; }
.award_contant { display: block; max-width:960px; min-width:320px; margin: 0 auto; z-index:1; position:relative; overflow: hidden; margin-top: 15px;}

.award_contant ul{ display: inline-block;margin: auto; width:50%; float: left;padding: 20px; box-sizing: border-box; }
.award_contant ul li{list-style-type:disc;list-style-position:outside; margin-left:18px;    color: #fff; padding: 0 10px 0 0 ; }
.award_contant ul li h4{color: #fff; font-size: .875em; font-weight: normal; display: block;  }
.award_contant ul+ul li a{ display: block;  }
.award_img{ position: relative; display: block; max-width:60em; margin: 0 auto; }
.award_img li{ display: inline-block; width:180px; height:auto; margin: 20px 0;  }
.award_img li img{ clear: both; display: block; width: 180px; height: 120px; border: 6px solid rgba(255,255,255,.4); box-sizing: border-box; margin: 0 auto; }
.award_img li h4{ display: block; font-size: .875em; color: #fff; line-height: 1.6em; margin-top: 5px; text-align: center;}
.award_img .arrow_pre {  left:-5%; top:30%;  }
.award_img .arrow_next{  right:-5%; top:30%;  }
.award_img .arrow_pre:hover{ opacity:.3; filter: opacity(30);left:-5.5%;}
.award_img .arrow_next:hover{ opacity:.3; filter: opacity(30);right:-5.5%;}
.award_img .bx-viewport { background-color:transparent;}
.award_img .bx-wrapper { margin-left: 30px !important;}
.caseLink { color:#fff; background-color: #ff8a00; font-size: .7em; margin-left: 5px;}

/*----------------------Q&A--------------------------------*/
.question{ background-color: #eaeaea; overflow:hidden; padding-bottom: 20px;}
.question ul{ display: block;  width: 60em; margin: 0 auto;position: relative; height: 120px; margin-top:20px; }
.question ul li { display:inline-block; width: 192px; height:130px; margin: 0; padding: 0; float: left; background-color: #eaeaea; position: relative;}
.question ul li.focus {  background-color: #009688;   }
.question ul li.focus a h4{ color: #fff;}
.question ul li.focus:before{ content: ""; display: block; position: absolute; width:0; height:0; border:25px solid; border-color: #009688 transparent transparent transparent; bottom:-50px; right:70px; }
.question ul li p{ display: none;}
.question ul li:hover {  background-color: #009688;  }
.question ul li a h4{ color: #333; text-align: center; margin-top: 15px;}
.question ul li a:hover h4{ color: #fff;}
.question ul li span { display: block; width: 50px; height: 50px; border-radius: 50%; color:#009688; background-color: #fff; text-align: center; line-height: 50px; font-weight: bold; margin: 0 auto;margin-top: 20px;}
.question div{ clear: both; max-width:960px; min-width: 320px; margin: 0 auto; height: auto; padding: 60px 100px 40px 100px;  box-sizing:border-box; background-color: #fff; border-bottom: 2px solid #009688; font-size: .875em; line-height: 2em;}

/*----------------------相關書藉--------------------------------*/
.publication{ width: 100%; }
.about_book{ max-width: 60em; min-width: 320px; margin: 0 auto; overflow: hidden;}
.about_book span{ display:inline-block; width:15%;float: left; }
.about_book span img{ width: 100%; }
.book_info{ display:inline-block; max-width:85%; padding:0 10px 0 30px;box-sizing: border-box; margin-bottom: 30px;  }
.book_info ul{ padding-top: 10px;}
.book_info li{ display: inline-block; width: 100%; font-size: 14px; line-height: 1.5em;}
.book_info p{ display: inline-block; width: 100%; line-height: 1.6em; font-size: 14px; padding: 10px 0; }
.book_info a{ display: block; width:300px; height: 40px; line-height: 40px; text-align: center; float: right; background-color:  #009688; color: #fff; margin-top: 20px;}
.book_info a:hover{ background-color:  #00796B;}
.publication .about_book {
    border-bottom: 1px solid #e7e7e7;
}
.publication .about_book+.about_book {
    margin-top: 2em;
    border-bottom:0;
}

/*-------------- 選單下滾時FIX外觀 ----------------*/
.IsDsgOffline .borderheadline_fix { display:none; }
.borderheadline_fix{ width: 100%; height:50px; background-color: #fff; box-shadow:2px 5px 8px  rgba(7%, 7%, 7%, 0.3); position:fixed; /*top:90px;*/ z-index:11; -moz-transform: translate(0, 0);-webkit-transform: translate(0px, 0px);-o-transform: translate(0px, 0px);-ms-transform: translate(0px, 0px);transform: translate(0px, 0px); transition: transform .5s ease; }
.Layout2024{border-top:3px solid;}
.headerimg_fix{ display: block; width:38px; height:38px; border:2px solid #fff; position:absolute; top:4px; left:10px; background-color: #fff;border-radius: 38px; behavior: url(PIE.htc);}
.headerimg_fix img{ max-width: 100%; height: auto;border-radius: 38px; behavior: url(PIE.htc);}
.profile h2 a.title_fix,.profile span a.title_fix{ display: inline-block; height: 50px; width:200px;  float:left; color: #333; position: absolute; top:0; left:70px;  font-size:0.9375em; font-weight: bolder; line-height: 1.4em; text-shadow: none; /*border-right: 1px solid #30373c;*/ padding-right:15px; padding-top: 13px;box-sizing: border-box; -webkit-box-sizing:border-box;  -moz-box-sizing: border-box; -ms-box-sizing: border-box;}
.profile h2 a.title_fix span , .profile strong a.title_fix{ display: none;}
/*.borderheadline_fix .profile nav,.borderheadline_fix .profile .nav{ border-left: 1px solid #30373c;}*/
.IsMobile .borderheadline_fix{ top:51px; z-index:98;}
.borderheadline_fix .nav ul li a{color: #333}

.FBFans {
    margin:60px auto 30px auto;
}

/*-------------- RWD ----------------*/
/*@media screen and (max-width:1200px) {
    .give_back{max-width:100%;}
}*/
@media screen and (max-width:1024px) {
    .Is2021Layout .borderheadline_fix {
        top: 51px;
    }
    .Prove_container {
        width: 600px;
        display: block;
        left: 50%;
        margin-left: -300px;
    }
    .give_back .slide_left_arrow{ left: 50%; margin-left: -330px; }
    .give_back .slide_right_arrow{ left: 50%; margin-left: 300px;  }
}
@media (min-width:320px) and (max-width:1024px) {
/*    .give_back .slide_left_arrow{ left:20px; }
    .give_back .slide_right_arrow{right:20px; }    */

}
@media screen and (min-width:768px) and (max-width:1024px){ 
    .introduce a{ padding: 0 20px; margin: 0 10px;  }
    .action { margin-right: 20px;}
    .collapse_box { width: 100%; }

    /*-------------- 設計師關於我們_接案訊息_聯絡我們 ----------------*/   
    .contactus > ul li td a i{ display:inline-block;margin-left: 8px; color: #009688;  }    
    
    /*----------------------Q&A--------------------------------*/
    .question ul li { width: 153px; }
    .question ul{ display: block;  width:100%;  }
    .question ul li { width: 150px; height:120px; }
    .question ul li.focus:before{ content: ""; display: block; position: absolute; width:0; height:0; border:20px solid; border-color: #009688 transparent transparent transparent; bottom:-35px; right:60px; }
    .question ul li a h4{  margin-top: 5px;  }

    .question ul li span { margin-top:15px;}
    .question div{  padding: 50px; }    

   
     /*----------------------證照展示--------------------------------*/

    .award_contant ul li h4{color: #fff; font-size: .875em; font-weight: normal;}
    .award_img{ position: relative; display: block; width:100%; margin: 0 auto; }
    .award_img{ display: block; text-align: center;}
    .award_img li{ display: inline-block; width:140px; height:auto; margin:20px 0;  }
    .award_img li img{ clear: both; display: block; width: 140px; height:auto; border: 6px solid rgba(255,255,255,.4); box-sizing: border-box; }
    .award_img li h4{ display: block; font-size: .875em; color: #fff; line-height: 1.6em; margin-top: 5px;}
    .award_img .arrow_pre {  left:2%; top:30%;  }
    .award_img .arrow_next{  right:2%; top:30%;  }
    .award_img .arrow_pre:hover{ opacity:.3; filter: opacity(30);left:1%;}
    .award_img .arrow_next:hover{ opacity:.3; filter: opacity(30);right:1%;}
	    
	/*-------------- 9/7 最新影音列表 ----------------*/
	.history_video ul { width:100%;}
	.history_video ul li{ display:inline-block;  float:left; /*width:46%;margin:0 15px;*/ }
	.history_video .bx-controls-direction .bx-prev {  position:absolute; z-index:1;left:0; margin-left:-51px; top:50%; }
	.history_video .bx-controls-direction .bx-next {  position:absolute; z-index:1;right:0; margin-right:-41px; top:50%;}
    .history_video .bx-prev:hover {opacity: 1;}
    .history_video .bx-next:hover {opacity: 1;}
	.history_video .btn_green{ width: 310px; margin: 0 auto; margin-top: 40px;}    
	    
	.introduce a{ display: inline-block; padding: 0 10px; margin: 0 8px;  width: 50px; }   
}

@media screen and (min-width:415px) and (max-width:959px) {
    /*-------------- 關於與聯絡 ----------------*/
    .profile_content p { width:auto;}	
	    
	/*-------------- 9/7 最新影音列表 ----------------*/
	.history_video ul { width:100%;}
	.history_video ul li{ display:inline-block;  float:left; /*width:46%;margin:0 15px;*/ }
	.history_video .bx-controls-direction .bx-prev {  position:absolute; z-index:1;left:0; margin-left:-51px; top:50%; }
	.history_video .bx-controls-direction .bx-next {  position:absolute; z-index:1;right:0; margin-right:-41px; top:50%;}
    .history_video .bx-prev:hover {opacity: 1;}
    .history_video .bx-next:hover {opacity: 1;}
	.history_video .btn_green{ width: 310px; margin: 0 auto; margin-top: 40px;}  

    .FBFans {
        width:98%;
    }
}

@media screen and (min-width:768px) and (max-width:959px) {
 .contactme{display: inline-block; width:100%; font-size: 0.875em; padding-left:0; }
 .introduce{ margin-top:30px; opacity:1; }
 /*.coverborder { margin-top:48px}*/   
 .project_box_mask section h4,.project_box_mask section h4 a{ line-height: 1em; margin: 10px 0; }
 .profile nav,.profile .nav{ margin-left:280px;  }

 .project_box_mask section a{  opacity: 1;  }
 .project_box_mask span a{  opacity: 1;  }

}
@media screen and (max-width:767px) {
    .Prove_container {
        width: 300px;
        display: block;
        left: 50%;
        margin-left: -135px;
    }
    
    .give_back .slide_left_arrow{ margin-left: -160px; }
    .give_back .slide_right_arrow{ margin-left: 140px;  }
}
@media screen and (min-width:640px) and (max-width:767px) {
    .btn_white_square{ height:35px; line-height: 35px; } 
    .coverborder { height:300px; /*margin-top:48px*/}   
    .license{     width: auto; margin: 0;}
    .collapse_box { width: 100%; }
    .collapse strong {width: 100%;}


    /*-------------- 大頭照與資訊 ----------------*/
    .borderheadline{ width: 100%; height:50px; background-color: #21262a;}
    .profile{ max-width:60em; min-width: 320px; margin: 0 auto;position: relative; height:50px;}
    .profile a:hover{color:#45ae9d;}
    .headerimg{ display: block; width: 150px; height:150px; border:5px solid #fff; position:absolute; top:-130px; left:10px;  border-radius: 150px;}
    .headerimg img{ max-width: 100%; height: auto;border-radius: 100%; }
    .profile h2 a , .profile strong a{ font-size:17px; padding-right:10px;}
    .profile h2 a span {font-size:.8em;}
    .profile strong a{ top:-50px;font-size:1em; }
    .profile nav,.profile .nav{ margin: 0 auto; text-align: center; width:auto; float: left; margin-left:195px;   }
    .profile nav ul li,.profile .nav ul li{ display:inline-block; }
    .profile nav ul li a,.profile .nav ul li a{ padding: 0 5px; color: #333;   font-size:0.9375em; }    
    
    /*-------------- 關於與聯絡 ----------------*/
    .profile_content{ clear: both; max-width:60em; min-width: 320px;  height: auto; margin: 0 auto; padding:20px; box-sizing: border-box; -webkit-box-sizing:border-box;  -moz-box-sizing: border-box; -ms-box-sizing: border-box; }
    .aboutme{ display:inline-block; float:none; width:100%;  }
    
     /*-------------- 證照 ----------------*/   
    .btn_ad_pre , .btn_ad_next {display:inline-block;width:10px; height:20px; background-image:url(../images/products/arrow_s_left_07.png);background-repeat: no-repeat;background-position: center;margin:50px 10px;float: left;cursor: pointer;}
    .btn_ad_next{ background-image:url(../images/products/arrow_s_right_07.png); float: right;}      
        
    /*-------------- 9/7 熱門影音 ----------------*/
    .video_box{ height:auto;}
    .video_box h4 a{ font-size: 16px;}
	.video_news{ max-width: 100%; min-width: 320px; background-color:#fff; padding-bottom:50px; margin-top: 20px;  }
	.video_left{ display:inline-block; max-width:400px; height:218px; overflow:hidden;}
    .video_box p { padding:0 10px; }
	
	/*-------------- 9/7 最新影音列表 ----------------*/
	.history_video { padding-bottom:0;margin-top: 0; }
	.history_video ul li{  float:none; width:100%;  background-color: #fff;  }
	.history_video ul li h4{ padding: 0 10px;}
	.history_video ul li .episode{ padding: 0 10px;}
	.history_video .btn_square_pre {  left: 0; margin-left:0; top:50%; }
	.history_video .btn_square_next {  right: 0; margin-right:0; top:50%;}
	.history_video  .btn_square_pre:hover  {margin-left:0;}
	.history_video  .btn_square_next:hover {margin-right:0;}
	.history_video .play_video_small{ display: block; width: 97px; height: 97px; background-image:url(images/big_play_white.png); position: absolute; top:50%;left: 43%; margin-top: -70px;  }
	.history_video ul li:hover > .play_video_small{ background-image:url(images/big_play_black.png);}
	.history_video .btn_green{ width:400px;  margin: 0 auto; margin-top:30px;} 

    .news{ padding-bottom:20px; margin-top:0; background-color: #fff; } 
    .news .project_box_mask{height:400px ; } /*-- 9/7 --*/   
    .project_box_mask{height: 400px; margin-top: 30px;}
    .project_box_mask section {padding-top: 15px;}
    .project_box_mask span a{ height: 400px;  opacity: 1;}
    .project_img{  height: 400px; }
    .project_box_mask:focus > .project_img{      -webkit-transform: scale(1.1, 1.1);
    -moz-transform: scale(1.05, 1.05);   -ms-transform: scale(1.05, 1.05);   -o-transform: scale(1.05, 1.05);   transform: scale(1.05, 1.05);-webkit-transition: all 1000ms ease-out;    -moz-transition: all 1000ms ease-out;    -o-transition: all 1000ms ease-out;    -ms-transition: all 1000ms ease-out;    transition: all 1000ms ease-out;}
    .project_box_mask section h4,.project_box_mask section h4 a{ line-height: 1em; margin: 10px 0; font-size:16px; }

    .project_caption{ display: block;position:relative; z-index: 5; padding-top: 50px; box-sizing: border-box;}
    .project_caption h4 a,  .project_box_mask section h4{  font-size:1em;padding: 0 15px; line-height: 1.6em;  box-sizing: border-box;}
    .project_caption h4{  font-size:1.375em;}
    .project_caption ul { display: none;  }

    .introduce{  margin-top: 30px; opacity: 1; }
    .introduce a{ padding: 0 30px; margin: 0 10px; }
    .introduce a:hover{background-color:#00796B; border: 1px solid #00796B; color:#fff; }
    .project_box_mask section h4 { font-size:1em;}
    .project_box_mask:hover > span a{opacity: 1; }
    .project_box_mask:hover .introduce {opacity:1;}
    .project_box_mask section a{width:90%;  height:auto; margin: 0 auto; margin-top:10px; opacity:1;}
    .project_box_mask section .btn_white_square{ width:400px;} 

    .img_right{ right:0; background-position:50%; width:100%;  float:none;  }
    .img_left{ left:0;background-position:50%; width:100%; float: none;   }
    .project_frame{display: block; width: 100%; height: 750px; overflow: hidden; position: relative;}
    .project_frame .project_caption{ right:0;  width:100%;  float:none;  }
    .project_caption:after { display: none;  }
    .project_caption:before { display: none; }


    /*-------------- 設計師關於我們_接案訊息_聯絡我們 ----------------*/
    .aboutus h3{   padding: 20px 0 0 10px;}
    .aboutus h3 .scribe { width:50px;  }
    .overviews{ width: 100%;}
    /*.overviews  ul li:nth-child(1){ display: none;}*/
    .overviews  ul li , .contactus ul li {  width:70%;float: none;}
    .contactus > ul li { width:80%;float: none; }
    .overviews ul  h4, .contactus  h4 a {  padding-left:0;}
    .map{ display: block; width:100%; height:300px;  }
    .contactus > ul li td a i{ display:inline-block;margin-left: 8px; color: #009688;  }     

    /*-------------- 公司陣容 ----------------*/
    .teams{ display: block; background-color: #1b1b1c; overflow: hidden; position: relative;}
    .teams ul{ display: block; text-align: center; margin-top:15px;}
    .teams ul li{ display:inline-block; margin:10px 15px;  }
    .teams strong{  font-size: .875em;}
    .teams .staff { display: none;}
    .teams .arrow_pre ,  .teams .arrow_next , .award_img .arrow_pre , .award_img .arrow_next{ display:none; }     
    
    /*----------------------證照展示--------------------------------*/
    .award{ width: 100%;  background-image: none; background-color: #009688;  }
    .award_bg{ display:none; }
    .award_contant { display: block; max-width:70%;  margin: 0 auto; z-index:1; position:relative; overflow: hidden;}
    .award_contant ul{ width:100%; float:none; padding: 10px 15px; box-sizing: border-box; }
    .award_contant ul li{list-style-type:disc;list-style-position:outside; margin-left:18px;    color: #fff; padding: 0 10px 0 0 ;  }
    .award_contant ul li h4{color: #fff; font-size: .875em; font-weight: normal;}
    .award_img{ display: none; }
    
    /*----------------------Q&A--------------------------------*/
    .question{ background-color: #eaeaea; overflow:hidden; margin-bottom: 20px;}
    .question ul{ display: block;  width: 100%; margin: 0 auto; position: relative; height:auto; margin-top:20px; }
    .question ul li { display:inline-block; width: 100%; height:80px; margin: 0; padding: 0; float: none; background-color: #eaeaea; position: relative; border-bottom: 1px solid #c7c7c7;}
    .question ul li:before{content: ""; display: block; position: absolute; border:10px solid; border-color: transparent transparent transparent #009688 ; bottom:30px; right:10px;}
    .question ul li.focus {  background-color: #fff;   }
    .question ul li.focus span{ background-color:#009688; color: #fff;}
    .question ul li.focus a h4{ color: #333;}
    .question ul li.focus:before{ content: ""; display: block; position: absolute; width:0; height:0; border:10px solid; border-color: #009688  transparent transparent transparent; top:30px; right:18px; }
    .question ul li.focus p{ display:block; width:100%; height: auto; background-color:#fff; font-size:.875em; padding:15px 20px; box-sizing: border-box; overflow: hidden; }
    .question ul li a h4{ display:inline-block; color: #333; text-align:left; margin-top:0; line-height: 80px; margin-left: 15px;}
    .question ul li span { display:inline-block; float:left;  color:#009688; line-height: 50px; margin-top: 15px; margin-left:10px;}
    .question div{ display: none;}   
    
    /*----------------------相關書藉--------------------------------*/
    .about_book span{ width:100%;float:none; text-align: center; margin: 20px 0;}
    .about_book span img{ width:150px; }
    .book_info{  max-width:100%; padding:0 15px;  }
    .book_info a{ float: none; width:100%;}

    /*-------------- 選單下滾時FIX外觀 ----------------*/
    .borderheadline_fix .profile nav,.borderheadline_fix .profile .nav{ margin-left:280px;}

}

@media (min-width:320px) and (max-width:640px) {
    .give_back .item a{display: block; width: 230px; height: 230px;padding:40px 35px;}
    .give_back .item a:before{width: 235px; height: 235px;top:-10px;left:-10px;}
}

@media screen and (min-width:415px) and (max-width:639px) {
	.btn_green{ width:300px; margin: 0 auto; margin-top: 20px;}
    .coverborder { height:250px; /*margin-top:48px*/}   
    .collapse_box { width: 100%; }
    .collapse strong {width: 100%;}
    
    /*-------------- 大頭照與資訊 ----------------*/
    .borderheadline{  background-color:#fff;}
    .profile{ max-width:60em; min-width: 320px; margin: 0 auto; position: relative;}
    .headerimg{ display: block;position:relative; top:-60px; left:50%; margin-left:-70px;  border-radius: 130px;}
    .headerimg img{ max-width: 100%; height: auto;border-radius: 100%;}
    .profile h2 a , .profile strong a{ width: 100%; height: auto;float:none; color: #333;position:relative; top:-50px; left:0; text-shadow: 0px 0px 0px rgba(33, 33, 33, 0.5); text-align: center;}
    .profile strong a{ top:-40px; }
    .profile nav,.profile .nav{ display: block;  text-align: center; width:95%; float:left; margin:20px 10px 15px 10px; background-color: #21262a;   }
    .profile nav{ visibility: hidden; margin: 0; height: 0;     }
    .borderheadline_fix .nav ul li a{color: #fff}

    /*-------------- 功能 ----------------*/
    .action { font-size:0.875em; /*width:275px;*/width:130px; height:auto; float:none; margin: 0 auto; margin-top:-30px;  }
    .action a{ display: inline-block; width:100px; height:40px; line-height:40px; margin-top:0; margin:15px;}
    .action a:hover{ background-color:#00796B; border: 1px solid #00796B; color:#fff;}    
    
     /*-------------- 關於與聯絡 ----------------*/
    .profile_content{ clear: both; max-width:60em;  height: auto; margin: 0 auto; padding:0; box-sizing: border-box; -webkit-box-sizing:border-box;  -moz-box-sizing: border-box; -ms-box-sizing: border-box; }
    .aboutme{ display:none; float:left; max-width:600px; min-width:320px; padding:15px;box-sizing: border-box; -webkit-box-sizing:border-box;  -moz-box-sizing: border-box; -ms-box-sizing: border-box; }
    .aboutme_btn{ display:block; width:95%; margin: 0 auto;   } 

    /*-------------- 證照 ----------------*/
    .license{ width: 100%; margin:20px auto; box-sizing: border-box; -webkit-box-sizing:border-box;  -moz-box-sizing: border-box; -ms-box-sizing: border-box;}
    .license ul li { display: inline-block; width:80px; height:80px; /*margin:0 6px;*/}

    /*-------------- 9/7 熱門影音 ----------------*/
    .video_news{ max-width: 100%; min-width: 320px; background-color:#fff; padding-bottom:0;  }
    .video_box{ height:auto;}
    .video_left{  height:262px; overflow:hidden;  position:relative; float: none; margin-right:0;}
    .video_img img{ height:auto; }
    .video_box h4 a{ font-size: 16px;}
    .video_box p { padding:0 10px; }
    .video_box .episode{ padding: 0 10px;}  
        
    /*-------------- 9/7 最新影音列表 ----------------*/
    .history_video { padding-bottom:0;margin-top: 0; }
    .history_video ul li{  float:none; width:100%;  background-color: #fff;  }
    .history_video ul li h4{ padding: 0 10px;}
    .history_video ul li .episode{ padding: 0 10px;}
    .history_video .play_video_small{ display: block; width: 97px; height: 97px; background-image:url(../images/video/big_play_white.png); position: absolute; top:50%;left: 43%; margin-top: -70px;  }
    .history_video ul li:hover > .play_video_small{ background-image:url(../images/video/big_play_black.png);}
    .history_video .btn_square_pre {  left: 0%; margin-left:0; top:50%; }
    .history_video .btn_square_next {  right: 0%; margin-right:0; top:50%;}
    .history_video  .btn_square_pre:hover  {margin-left:0;}
    .history_video  .btn_square_next:hover {margin-right:0;}
    .history_video .btn_green{ margin: 0 auto; margin-top:30px;}
    
    /*-------------- 作品內頁 ----------------*/
    .news{ padding-bottom:20px; margin-top:0; background-color: #fff; } 
    .news .project_box_mask{height:250px ; } /*-- 9/7 --*/   
    .project_box_mask{height: 250px; margin-top: 30px;}
    .project_box_mask section {padding-top: 15px;}
    .project_box_mask span a{ height: 250px;  opacity: 1;}
    .project_img{  height: 250px; }
    .project_box_mask:focus > .project_img{      -webkit-transform: scale(1.1, 1.1);
    -moz-transform: scale(1.05, 1.05);   -ms-transform: scale(1.05, 1.05);   -o-transform: scale(1.05, 1.05);   transform: scale(1.05, 1.05);-webkit-transition: all 1000ms ease-out;    -moz-transition: all 1000ms ease-out;    -o-transition: all 1000ms ease-out;    -ms-transition: all 1000ms ease-out;    transition: all 1000ms ease-out;}
    .project_box_mask section h4,.project_box_mask section h4 a{ line-height: 1em; margin: 10px 0; font-size:16px; }

    .project_caption{ display: block;position:relative; z-index: 5; padding-top: 35px; box-sizing: border-box;}
    .project_caption h4 a,  .project_box_mask section h4{  font-size:1em;padding: 0 15px; line-height: 1.6em;  box-sizing: border-box;}
    .project_caption h4{  font-size:1em;}
    .project_caption ul { display: none;  }

    .introduce{  margin-top: 30px; opacity: 1; }
    .introduce a{ padding: 0 30px; margin: 0 10px; }
    .introduce a:hover{background-color:#00796B; border: 1px solid #00796B; color:#fff; }
    .project_box_mask section h4 { font-size:1em;}
    .project_box_mask:hover > span a{opacity: 1; }
    .project_box_mask:hover .introduce {opacity:1;}
    .project_box_mask section a{width:90%;  height:auto; margin: 0 auto; margin-top:10px; opacity:1;}
    .project_box_mask section .btn_white_square{ width:250px;} 

    .img_right{ right:0; background-position:50%; width:100%;  float:none;  }
    .img_left{ left:0;background-position:50%; width:100%; float: none;   }
    .project_frame{display: block; width: 100%; height: 500px; overflow: hidden; position: relative;}
    .project_frame .project_caption{ right:0;  width:100%;  float:none;  }
    .project_caption:after { display: none;  }
    .project_caption:before { display: none; }

    /*-------------- 設計師關於我們_接案訊息_聯絡我們 ----------------*/
    .overviews{ width: 100%;}
    /*.overviews  ul li:nth-child(1){ display: none;}*/
    .overviews  ul li , .contactus > ul li { width:100%;  padding: 0 10px; margin-top:30px;  }
    .overviews ul  h4, .contactus  h4 a {  padding-left:0;}
    .map{ display: none; }
    .contactus > ul li td a i{ display:inline-block;margin-left: 8px; color: #009688;  }   
    
    /*-------------- 公司陣容 ----------------*/
    .teams{ display: block; background-color: #1b1b1c; overflow: hidden; position: relative;}
    .teams ul{ display: block; text-align: center; margin-top:15px;}
    .teams strong{  font-size: .875em;}
    .teams .staff { display: none;}
    .teams .arrow_pre ,  .teams .arrow_next , .award_img .arrow_pre , .award_img .arrow_next{ display:none; }   
    
    /*----------------------證照展示--------------------------------*/
    .award{ width: 100%;  background-image: none; background-color: #009688;  }
    .award_bg{ display:none; }
    .award_contant { display: block; max-width:960px; min-width:320px; margin: 0 auto; z-index:1; position:relative; overflow: hidden;}
    .award_contant ul{ width:100%; float:none; padding: 10px 15px; box-sizing: border-box; }
    .award_contant ul li{list-style-type:disc;list-style-position:outside; margin-left:18px;    color: #fff; padding: 0 10px 0 0 ;  }
    .award_contant ul li h4{color: #fff; font-size: .875em; font-weight: normal;}
    .award_img{ display: none; }
      
    /*----------------------Q&A--------------------------------*/
    .question{ background-color: #eaeaea; overflow:hidden; margin-bottom: 20px;}
    .question ul{ display: block;  width: 100%; margin: 0 auto; position: relative; height:auto; margin-top:20px; }
    .question ul li { display:inline-block; width: 100%; height:80px; margin: 0; padding: 0; float: none; background-color: #eaeaea; position: relative; border-bottom: 1px solid #c7c7c7;}
    .question ul li:before{content: ""; display: block; position: absolute; border:10px solid; border-color: transparent transparent transparent #009688 ; bottom:30px; right:10px;}
    .question ul li.focus {  background-color: #fff;   }
    .question ul li.focus span{ background-color:#009688; color: #fff;}
    .question ul li.focus a h4{ color: #333;}
    .question ul li.focus:before{ content: ""; display: block; position: absolute; width:0; height:0; border:10px solid; border-color: #009688  transparent transparent transparent; top:30px; right:18px; }
    .question ul li.focus p{ display:block; width:100%; height: auto; background-color:#fff; font-size:.875em; padding:15px 20px; box-sizing: border-box; overflow: hidden;}
    .question ul li a h4{ display:inline-block; color: #333; text-align:left; margin-top:0; line-height: 80px; margin-left: 15px;}
    .question ul li span { display:inline-block; float:left;  color:#009688; line-height: 50px; margin-top: 15px; margin-left:10px;}
    .question div{ display: none;}
    
    /*----------------------相關書藉--------------------------------*/
    .about_book span{ width:100%;float:none; text-align: center; margin: 20px 0;}
    .about_book span img{ width:150px; }
    .book_info{  max-width:100%; padding:0 15px;  }
    .book_info a{ float: none; width:100%;}

    /*-------------- 選單下滾時FIX外觀 ----------------*/
    .borderheadline_fix{  background-color:#21262a;}
    .profile h2 a.title_fix,.profile span a.title_fix{ display:none;}
    .borderheadline_fix .action a{ display:none;}
    .borderheadline_fix .profile{ height:45px;}
    .profile nav ul li a,.profile .nav ul li a { border-right: 1px solid #30373c;}
    .profile nav ul li:nth-child(1) a,.profile .nav ul li:nth-child(1) a { border-left: 1px solid #30373c;}
    .borderheadline_fix .action{ margin:0; }
    .borderheadline_fix .profile nav ul li a,.borderheadline_fix .profile .nav ul li a { border: 0;}
    .borderheadline_fix .profile nav,.borderheadline_fix .profile .nav{ margin:0 10px 0 70px; padding-top:4px; width:calc(100% - 70px); min-width:325px; max-width:535px;}
}

@media screen and (max-width: 414px) {
    .btn_green{ width: 250px; margin: 0 auto; margin-top: 20px;}
    .coverborder { height:200px; /*margin-top:48px*/}  
    .collapse_box { width: 100%; }
    .collapse strong {width: 100%;}
    
    /*-------------- 元件-按鈕-文字外觀設定 ----------------*/   
    .video_report .play_video{ display:block; width:69px; height:69px; background-image: url(../images/video/play_white.png); background-repeat: no-repeat; margin: 0 auto;}
    .play_video:hover{ background-image: url(../images/video/play_black.png);}

    /*-------------- 大頭照與資訊 ----------------*/

    .borderheadline{  background-color:#fff;}
    .profile{ max-width:60em; min-width: 320px; margin: 0 auto; position: relative;}
    .headerimg{ display: block; width: 130px; height:130px; border:5px solid #fff; position:relative; top:-60px; left:50%; margin-left:-70px;  border-radius: 130px;}
    .headerimg img{ max-width: 100%; height: auto;border-radius: 100%;}
    .profile h2 a , .profile strong a{ width: 100%; height: auto;float:none; color: #333;position:relative; top:-50px; left:0; text-shadow: 0px 0px 0px rgba(33, 33, 33, 0.5); text-align: center;  padding: 0 10px; box-sizing: border-box;}
    .profile strong a{ top:-40px; }
    .profile nav{ display: block;  text-align: center; width:90%; padding-top:4px; float:left; background-color: #21262a; visibility: hidden; margin: 0; height: 0;   }
    .profile .nav{ display: block;  margin: 0 auto; text-align: center; width:250px; padding-top:4px; float:left; margin:20px 0 0 15px; background-color: #21262a; margin-bottom: 15px;   }
    .borderheadline_fix .nav ul li a{color: #fff}
    /*-------------- 功能 ----------------*/
    .action { font-size:0.875em; /*width:275px;*/width:130px; height:auto; float:none; margin: 0 auto; margin-top:-20px;  }
    .action a{ display: inline-block; width:100px; height:40px; line-height:40px; margin-top:0; margin:15px;}
    .action a:hover{ background-color:#00796B; border: 1px solid #00796B; color:#fff;}
    .borderheadline_fix .action{ margin-top:0; }

    /*-------------- 關於與聯絡 ----------------*/
    .profile_content{ clear: both; max-width:60em;  height: auto; margin: 0 auto; padding:0; box-sizing: border-box; -webkit-box-sizing:border-box;  -moz-box-sizing: border-box; -ms-box-sizing: border-box; }
    .profile_content p { width:auto;}
    .aboutme{ display:none; float:left; max-width:600px; min-width:320px; padding:15px;box-sizing: border-box; -webkit-box-sizing:border-box;  -moz-box-sizing: border-box; -ms-box-sizing: border-box; }
    .aboutme_btn{ display:block; width:90%; margin: 0 auto;}
    
    /*-------------- 證照 ----------------*/
    .license{ margin-top: 20px; width: 90%; margin: 20px 5%; min-width:initial;}
    .license ul li { display: inline-block; width:80px; height:80px; /*margin:0 19px;*/}
    .license .bx-wrapper .bx-viewport { margin-left:19px;}
    /*.license ul li:nth-child(2n+1) { display:none;}*/

	/*-------------- 9/7 熱門影音 ----------------*/
    .video_news{ max-width: 100%; min-width: 320px; background-color:#fff; padding-bottom:0;  }
    .video_box{ height:auto;}
    .video_img img{ height:auto; }
    .video_left{  height:220px;  position:relative; float: none; margin-right:0; overflow:hidden;}
    .video_left .play_video{  width: 69px;  height: 69px; background-image: url(../images/video/play_white.png); left:40%; top:34%;}
    .video_left:hover .play_video{background-image: url(../images/video/play_black.png);}
    .video_box h2 a{ font-size: 16px;}
    .video_box p { padding:0 10px; }
    .video_box .episode{ padding: 0 10px;}
    .video_box h4 a { font-size:16px;}
        
    /*-------------- 9/7 最新影音列表 ----------------*/
    .history_video { padding-bottom:0;margin-top: 0; }
    .history_video ul li{  float:none; width:100%;  background-color: #fff;   }
    .history_video ul li h4{ padding: 0 10px;}
    .history_video ul li .episode{ padding: 0 10px;}
    .history_video .bx-controls-direction .bx-prev {  left:0; margin-left:-5px; top:40%; }
    .history_video .bx-controls-direction .bx-next {  right: 0; margin-right:5px; top:40%;}
    .history_video .bx-prev:hover {opacity: 1;}
    .history_video .bx-next:hover {opacity: 1;}
    .history_video .btn_green{ width: 250px;  margin-top:30px;}  
    
    /*-------------- 代表作 作品內頁 ----------------*/
     .news h3, .video_news h3 , .history_video h3{  font-size:1.125em; padding: 30px 0; } 
	.news{ padding-bottom:20px; margin-top:0; background-color: #fff; }
	.news .project_box_mask{height:250px ; } 
	.project_box_mask{ height: 200px; margin-top: 30px; }
	.project_box_mask span a{  height: 200px;  opacity:1;}
	.project_img{  height: 200px;  }
    .project_box_mask section {padding-top: 40px;}
    .project_caption{ display: block;position:relative; z-index: 5; padding-top:30px; box-sizing: border-box;}
    .project_caption h4 { font-size:1em;  padding:0 10px; line-height: 1.6em;  box-sizing: border-box;  }

    .project_caption ul {display: none;}
    .project_caption ul li{  padding: 0 10px;  }
    .introduce{  margin-top: 20px; opacity:1; }
    .introduce a{ display: inline-block; padding: 0 10px; margin: 0 8px; font-size: .875em; width: 35px; }
    .introduce a:focus{background-color:#00796B; border: 1px solid #00796B; color:#fff; }
    .project_box_mask section h4 { font-size:1em;}
    .project_box_mask:hover > span a{opacity: 1; }
    .project_box_mask:hover .introduce {opacity:1;}
    .img_right{ right:0; background-position:50%; width:100%;  float:none;  }
    .img_left{ left:0;background-position:50%; width:100%; float: none;   }
    .project_frame{display: block; width: 100%; height: 500px; overflow: hidden; position: relative;}
    .project_frame .project_caption{ right:0;  width:100%;  float:none;  }
    .project_caption:after { display: none;  }
    .project_caption:before { display: none; }
    .project_box_mask section h4,.project_box_mask section h4 a{ margin-bottom:10px; padding:0; margin:0 10px 10px auto; font-size:16px; }
	.project_box_mask section a{width:90%;  height:auto; margin: 0 auto; margin-top:10px; opacity:1;}
	.project_box_mask section .btn_white_square{ width:250px;}

    /*-------------- 設計師關於我們_接案訊息_聯絡我們 ----------------*/
    .aboutus h3{  font-size:1.125em;padding: 20px 0 0 10px;}
    .aboutus h3 .scribe { width:50px;  }
    .overviews{ width: 100%;}
    /*.overviews  ul li:nth-child(1){ display: none;}*/
    .overviews  ul li , .contactus > ul li { width:100%;  padding: 0 10px; margin-top:30px;  }
    .overviews ul  h4, .contactus  h4 a {  padding-left:0;}
    .map{ display: block; width:100%; height:300px; }
    .contactus > ul li td a i{ display:inline-block;margin-left: 8px; color: #009688;  } 
    .map{ display: none;  }


    /*-------------- 公司陣容 ----------------*/
    .teams{ display: block; background-color: #1b1b1c; overflow: hidden; position: relative;}
    .teams ul{ display: block; text-align: center; margin-top:15px;}
    .teams ul li{ display:inline-block; margin:10px 15px; /*float:left;*/  }
    .teams ul li a{  width: 130px; height: 130px;}
    .teams .manager li a img{width: 130px;height: 130px;}
    .teams li a:before{width:130px; height:130px; }
    .teams strong{  font-size: .875em;}
    .teams .staff { display: none;}
    .teams .arrow_pre ,  .teams .arrow_next , .award_img .arrow_pre , .award_img .arrow_next{ display:none; }

  
    /*----------------------證照展示--------------------------------*/

    .award{ width: 100%;  background-image: none; background-color: #009688;  }
    .award_bg{ display:none; }
    .award_contant { display: block; max-width:960px; min-width:320px; margin: 0 auto; z-index:1; position:relative; overflow: hidden;}
    .award_contant ul{ width:100%; float:none; padding: 10px 15px; box-sizing: border-box; }
    .award_contant ul li{list-style-type:disc;list-style-position:outside; margin-left:18px;    color: #fff; padding: 0 10px 0 0 ;  }
    .award_contant ul li h4{color: #fff; font-size: .875em; font-weight: normal;}
    .award_img{ display: none; }
  
    
     /*----------------------Q&A--------------------------------*/
    .question{ background-color: #eaeaea; overflow:hidden; margin-bottom: 20px;}
    .question ul{ display: block;  width: 100%; margin: 0 auto; position: relative; height:auto; margin-top:20px; }
    .question ul li { display:inline-block; width: 100%; height:80px; margin: 0; padding: 0; float: left; background-color: #eaeaea; position: relative; border-bottom: 1px solid #c7c7c7;}
    .question ul li:before{content: ""; display: block; position: absolute; border:10px solid; border-color: transparent transparent transparent #009688 ; bottom:30px; right:10px;}
    .question ul li.focus {  background-color: #fff;   }
    .question ul li.focus span{ background-color:#009688; color: #fff;}
    .question ul li.focus a h4{ color: #333;}
    .question ul li.focus:before{ content: ""; display: block; position: absolute; width:0; height:0; border:10px solid; border-color: #009688  transparent transparent transparent; top:30px; right:18px; }
    .question ul li.focus p{ display:block; width:100%; background-color:#fff; font-size:.875em; padding:0 20px; box-sizing: border-box; overflow: hidden; line-height:2em; }
    .question ul li a h4{ display:inline-block; color: #333; text-align:left; margin-top:0; line-height: 80px; margin-left: 15px;}
    .question ul li span { display:inline-block; float:left;  color:#009688; line-height: 50px; margin-top: 15px; margin-left:10px;}
    .question div{ display: none;}

    /*----------------------相關書藉--------------------------------*/
    .about_book span{ width:100%;float:none; text-align: center; margin: 20px 0;}
    .about_book span img{ width:150px; }
    .book_info{  max-width:100%; padding:0 15px;  }
    .book_info a{ float: none; width:100%;}

    /*-------------- 選單下滾時FIX外觀 ----------------*/
    .borderheadline_fix{  background-color:#21262a;}
    .profile h2 a.title_fix,.profile span a.title_fix{ display:none;}
    .borderheadline_fix .action a{ display:none;}
    /*.profile nav ul li:nth-child(3),.profile .nav ul li:nth-child(3) { display:none; }*/
    .profile nav ul li a,.profile .nav ul li a { border-right: 1px solid #30373c;}
    .profile nav ul li:nth-child(1) a,.profile .nav ul li:nth-child(1) a { border-left: 1px solid #30373c;}
    .borderheadline_fix .profile nav,.borderheadline_fix .profile .nav{ width:calc(100% - 70px); margin:0 10px 0 70px;}
    .borderheadline_fix .profile nav ul li a,.borderheadline_fix .profile .nav ul li a { border: 0;}
    .borderheadline_fix .profile nav ul li:nth-child(1) /*, .borderheadline_fix .profile .nav ul li:nth-child(4)*/{display:inline-block;}

    .FBFans {
        width:97%;
    }
}

@media screen and (max-width: 375px) {
    .video_left{  height:206px;  }
}

@media screen and (max-width: 360px) {
    .video_left{  height:197px;  }
}

@media screen and (max-width: 320px) {
    .video_left{  height:175px;  }
}

/*-------------- code begin ----------------*/
/*.bx-next,.bx-prev{display:none;}*/
.bx-wrapper{ z-index:5;}
.bx-wrapper .bx-controls-direction a { z-index:20;}
.bx-wrapper { display:inline-block; }

.container .borderheadline a.DesignerIntro_nowMenu,.container .borderheadline_fix a.DesignerIntro_nowMenu{color:#45ae9d;}
.green { color: #009688;}
.strong { font-weight:bolder;}
#Explanation ul li ul li { 
  line-height: 30px;
  list-style-type: circle;
  font-size:14px;
  padding-left: 5px;
  margin: 5px 10px;
}
#Explanation ul li { 
  line-height: 30px;
  list-style-type: disc;
  font-size:20px;
  padding-left: 5px;
  margin-left: 5px;
}

.special_hide {
opacity: 0;
-moz-transform: translate(0, -50px) !important;
-webkit-transform: translate(0, -50px) !important;
-o-transform: translate(0, -50px) !important;
-ms-transform: translate(0, -50px) !important;
transform: translate(0, -50px) !important;

}
.special_show {
opacity: 1;
-moz-transform: translate(0, 0) !important;
-webkit-transform: translate(0, 0) !important;
-o-transform: translate(0, 0) !important;
-ms-transform: translate(0, 0) !important;
transform: translate(0, 0) !important;

}

.caseSummary {
  font-size: 16px;
  line-height: 2em;
}

/*-------------- code end ----------------*/


/*設計師專頁 - 影音列表  begin*/

/*.history_project{
	background-color:transparent;
	}   
div.product ul {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	overflow: hidden;
	position: relative;
	margin-top: 10px;
	margin-bottom: 50px;
}
#P_list div.product ul {
	margin-top: 30px;
	width: 960px;
	text-align: center;
}
#P_All div.product ul.pAll_icon {
	width: 960px;
	margin-top: 0;
	margin-bottom: 0;
}
#dsg_video div.product ul {
	margin-top: 0px;
	margin-bottom:0;
	width: 960px;
	text-align: center;
}
#dsg_video div.product ul {
	margin-top: 0px;
	margin-bottom:0;
	width: 960px;
	text-align: center;
}
#dsg_video .product li {
    padding: 0;
    margin: 0px 5px;
    margin-bottom: 30px;
	width:300px;
    min-height: 300px;
}
.product li a {
	font-size: 16px;
	color: #009688;
}
.product li a:hover {
	color: #333;
}
#dsg_video a.video_paly_img {
    display: block;
    width: 300px;
    position: relative;
}
#dsg_video .video_paly_img:before {
    content: "";
    position: absolute;
    display: block;
    width: 69px;
    height: 69px;
    z-index: 1;
    background-image: url(../images/video/play_white.png);
    top: 25%;
    left: 40%;
}
#dsg_video .video_paly_img:hover:before {
    background-image: url(../images/video/play_black.png);
}
.li_side .tag_new_B {
	position: relative;
}
.video_time{
	padding:0 8px;
	position:absolute;
	width:auto;
	right:0;
	}
img {
	display: block;
}
.li_side .tag_60sec_tv { position:absolute; top:0; left:0; }

ul li.li_side div.B_hover strong{
	color:#48b6a5;
	margin-bottom: 5px;
	margin-top:5px;
    padding: 0;
	}
ul li.li_side div.B_hover strong:hover{
    color: #00796B;
}

@media (max-width: 960px) {
    div.product ul {
        width: 72%;
    }
    #dsg_video div.product ul{
	width:100%;
	}
}

@media (max-width: 768px) {
    div.product ul {
        width: 550px;
    }

    #P_list div.product ul {
        margin-top: 0;
    }
}

@media (max-width: 660px) {
    div.product ul {
        width: 410px;
    }

    #dsg_video .product li {
        margin: 0;
        width: 100%;
        margin-bottom: 20px;
    }

    #P_All .product li a {
        font-size: 14px;
    }

    #dsg_video a.video_paly_img {
        display: inline-block;
        width: 100%;
    }
}
@media (max-width: 480px) {
    div.product ul {
        width: 218px;
    }
}*/

.li_side .tag_60sec_tv { position:absolute; top:0; left:0; }
#P_list .history_project {
	padding-bottom: 0;
}
#P_All .history_project {
	background-color: transparent;
	padding-bottom: 0;
}
#P_All .history_project ul {
	margin-bottom: 10px;
}
#P_All .history_project ul li div.B_hover {
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
#dsgVideo .history_project ul li strong{
	padding: 0px 0px 13px 0px;
	}
#dsgVideo .history_project{
	background-color:transparent;
	}

#dsgVideo .history_project ul li img,#P_video .history_project ul li img {
    height: 200px;   
}
.li_side .tag_new_B {
	position: relative;
}
ul li.li_side .date{
	padding: 10px 0 0px 0;
	}
ul li.li_side span.date a{
	color:#666;
	font-size:14px;
	}
ul li.li_side .date a:hover{
	color:#000;
	}
ul li.li_side .pinit {
    display: block;
    width: 100%;
    height: 57px;
    background-color: #fff;
}
ul li.li_side .pinit a i {
    display: inline-block;
    width: 30px;
    height: 30px;
    content: "555";
    background-color: #ce2b6b;
    border-radius: 50%;
    color: #fff;
    font-size: 16px;
    line-height: 32px;
    box-sizing: border-box;
    margin-right: 5px;
}
ul li.li_side .pinit a:hover i{
    background-color: #fff;
    color: #ce2b6b;
}
ul li.li_side .pinit a.more{
	display: block;
    width: 90%;
    border: 1px solid #ce2b6b;
    margin: 0 auto;
    color: #ce2b6b;
    text-align: center;
    font-size: 16px;
    line-height: 45px;
	}
ul li.li_side .pinit a.more:hover{
	background-color: #ce2b6b;
    color: #fff;
	}
ul li.li_side div.B_hover strong{
    color: #48b6a5;
    margin-bottom: 5px;
    margin-top: 5px;
    text-align: left;
	}
ul li.li_side div.B_hover strong:hover{
    color: #00796B;
}
#dsgVideo a.video_play_img {
    display: inline-block;
    position: relative;
    width:100%;
}
#dsgVideo .video_play_img:hover:before {
    background-image: url(../images/video/play_black.png);
}
#dsgVideo .video_play_img:before {
    content: "";
    display: block;
    width: 69px;
    height: 69px;
    z-index: 2;
    background-image: url(../images/video/play_white.png);
    position: absolute;
    left: 40%;
    top: 25%;
}
.video_time{
	padding:0 8px;
	position:absolute;
	width:auto;
	right:0;
	}
#dsgVideo li {
     padding: 0;
    margin: 0px 8px;
    margin-bottom: 30px;
    width: 300px;
   vertical-align: text-top;
   float: inherit;
   overflow:hidden;
}
#dsgVideo ul {
    margin-top: 0px;
    margin-bottom: 0;
    width: 960px;
    text-align: left;
}

#P_list .profile_width, #P_video .profile_widt#dsgVideo lih {
    max-width: 960px;
    font-size: 16px;
}

@media (max-width: 960px) {
    #P_All .history_project ul {
        width: 86%;
        margin: 0 auto;
        text-align: center;
    }

        #P_All .history_project ul li {
            float: inherit;
        }

    #dsgVideo .history_project ul li {
        float: inherit;
        height: auto;
        display: inline-table;
        vertical-align: top;
    }

    #dsgVideo ul {
        width: 100%;
        text-align: center;
    }
    #dsgVideo .history_project ul li {
    float: inherit;
    height: auto;
    display: inline-table;
    vertical-align: top;
}
}

@media (max-width: 768px) {
    #P_All .history_project {
        margin-top: 30px;
    }

    #P_list .li_side .tag_new {
        left: 0;
    }

    
}
@media (max-width: 660px) {
    #dsgVideo .history_project .B_hover {
        margin: 0 10px;
    }

    #dsgVideo a.video_play_img {
        display: inline-block;
        width: 100%;
    }
    #dsgVideo li{
	margin:0;
	}
#dsgVideo  li{
	width:100%;
	margin-bottom:20px;
	}
}
@media (max-width: 480px) {
    .borderheadline_fix .profile .nav {
        margin: 0 10px 0 58px;
        width: calc(100% - 70px);
    }
.profile .nav ul li a{
	padding:0 8px;
	}
    a.aboutme_btn { display:none;}
.history_project {background-color: #eaeaea;}
.brandSocial {display:block; position:relative; left:50%; margin-left:-200px; margin-bottom: 2em; width:450px;} /*品牌專頁社群*/
.brand_container { margin-top: 65px;} /*品牌專頁內容頁最上面黑bar的間距*/
#P_video .page_view_inner { margin: 0 auto 30px; }  /*品牌影音分頁距離*/
.container .borderheadline a.BrandIntro_nowMenu,.container .borderheadline_fix a.BrandIntro_nowMenu{color: #009688 !important;}
}

/*設計師專頁 - 影音列表  end*/

/*加入VR頻道後調整 begin*/
@media (max-width: 320px) {
/*    .borderheadline_fix .profile nav,.borderheadline_fix .profile .nav{ width:265px; }*/
    .profile .nav ul li a{ padding:0 5px; }
    .introduce a{ padding: 0 6px; margin: 0 6px; }
}
/*加入VR頻道後調整 end*/
@charset "utf-8";
/* CSS Document */
/*------------居家首頁 大於 960px  -----------------*/
body {
    overflow-x: hidden;
}

.container .wrapper {
    width: 960px;
    margin: 0 auto;
}

.wrapper .kanban {
    position: relative;
    max-height: 500px;
}
/*.kanban .li_side {
   max-width: 900px;
   max-height:500px;
   overflow:hidden;
}*/
.kanban .li_side img {
    margin: 0 auto;
}

.kanban .bx-wrapper .bx-controls-direction a {
    margin-top: -60px;
}

/*-------arrow*/
a.bx_prev, a.bx_next {
    position: absolute;
    width: 46px;
    height: 46px;
    z-index: 1;
}
/*-------arrow end*/
/*-------button*/
.theme_box a.btn_green {
    display: block;
    width: 300px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    color: #009688;
    border: 1px solid #009688;
    margin-top: 40px;
    font-size: 14px;
    margin-left: auto;
    margin-right: auto;
    background-color: #FFF;
}

    .theme_box a.btn_green:hover {
        background-color: #00796B;
        border: 1px solid #00796B;
        color: #fff;
    }
/*-------button end*/
a.bx_prev {
    background: url(../images/index_arrow_pre.png);
    top: 40%;
    left: 0;
}

a.bx_next {
    background: url(../images/index_arrow_next.png);
    top: 40%;
    right: 0;
}

.kanban li .kanban_h2 {
    color: #00eacf;
    font-size: 20px;
    background: #003e3d;
    position: absolute;
    width: 100%;
    /*max-width: 900px;*/
    bottom: 0;
    opacity: 0.9;
    padding: 11px 10px;
    letter-spacing: 1px;
    line-height: 28px;
    font-weight: bolder;
    right: 0;
}

.kanban li .kanban_h2p {
    font-size: 15px;
    color: #FFF;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    margin-top: 7px;
    font-weight: 100;
}

h3.h3_title {
    clear: both;
    display: block;
    font-size: 32px;
    line-height: 1.8em;
    color: #333;
    padding: 30px 0 20px 0;
    text-align: center;
}

.scribe {
    display: block;
    width: 30px;
    text-align: left;
    border: 2px solid #f49e22;
    margin: 0 auto;
}

.sidebar_left, .sidebar_right {
    width: 50%;
    max-width: 50%;
    float: left;
}

small.date {
    display: inline-block;
    font-size: 13px;
    color: #333;
    margin-left: -3px;
    background: #FFF;
    padding-left: 5px;
    padding-right: 10px;
}

.sidebar_left ul li p.hr, p.hr span, p.hr small.date {
    position: relative;
}

    .sidebar_left ul li p.hr:before {
        content: '';
        display: block;
        position: absolute;
        width: 100%;
        height: 1px;
        background-color: #666;
        top: 50%;
        z-index: 0;
    }

.sidebar_left ul li {
    margin-bottom: 20px;
    margin-right: 10px;
}

h4 {
    color: #48b6a5;
    font-size: 16px;
    margin-top: 8px;
    line-height: 18px;
}

    h4:hover {
        color: #00796B;
    }

p.p_content, .recommend p, .theme_sidebar_L p, .theme_sidebar_R p {
    color: #666;
    font-size: 14px;
}

    p.p_content:hover, .recommend p:hover, .theme_sidebar_L p:hover, .theme_sidebar_R p:hover {
        color: #000;
    }

.sidebar_right ul {
    margin-top: 16px;
    display: inline-table;
}

    .sidebar_right ul li {
        display: inline-block;
        margin-left: 8px;
        margin-bottom: 10px;
    }

        .sidebar_right ul li img {
            width: 230px;
            height: 153px;
        }

        .sidebar_right ul li div {
            border: 1px solid #FFF;
            position: absolute;
            width: 180px;
            text-align: left;
            margin: 14px;
            padding: 10px;
            max-height: 105px;
            background: #333;
            opacity: 0.8;
            overflow: hidden;
            line-height: 21px;
        }

            .sidebar_right ul li div.h4n {
                display: none;
            }

            .sidebar_right ul li div.active {
                display: block;
            }

            .sidebar_right ul li div h4 {
                color: #FFF;
                font-size: 16px;
                text-shadow: 2px 2px 2px rgba(0,0,0,0.9);
                margin: 0;
                line-height: 21px;
            }

img {
    display: block;
}

article.background01 {
    background-image: url(../images/background01.png);
    width: 100%;
    height: 380px;
    display: inline-block;
    margin-top: 50px;
    margin-bottom: 20px;
    padding-bottom: 70px;
}

h3.h3_color {
    color: #FFF;
}

ul.unpacking {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
}

.unpacking li {
    display: table-cell;
    padding: 0 6px 0 6px;
}

    .unpacking li img {
        box-shadow: 4px 4px 4px rgba(0,0,0,0.5);
        -moz-box-shadow: 4px 4px 4px rgba(0,0,0,0.5);
        width: 228px;
        height: 152px;
    }

    .unpacking li h4, .unpacking li p {
        max-width: 230px;
        line-height: 23px;
    }

    .unpacking li h4 {
        color: #F39E21;
        font-size: 16px;
    }

        .unpacking li h4:hover, .unpacking li p:hover, .recommend ul div a:hover, .arrow_LR_small ul img:hover, .recommend ul img:hover {
            opacity: 0.7;
        }

    .unpacking li p {
        color: #FFF;
        font-size: 14px;
    }

.arrow_LR_small {
    position: relative;
}

.background01 a.bx_prev, .background01 a.bx_next {
    top: 65%;
}

.background01 a.bx_prev {
    left: -60px;
}

.background01 a.bx_next {
    right: -60px;
}

a.arrow_left_s03, a.arrow_right_s04 {
    position: absolute;
    width: 12px;
    height: 22px;
    z-index: 1;
    background-repeat: no-repeat;
}

.arrow_left_s03 {
    background-image: url(../images/products/arrow_s_left_07.png);
    left: -30px;
    top: 70%;
}

.arrow_right_s04 {
    background-image: url(../images/products/arrow_s_right_07.png);
    right: -30px;
    top: 70%;
}

div.product {
    position: relative;
}

    div.product ul {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        overflow: hidden;
        position: relative;
        margin-top: 10px;
        margin-bottom: 50px;
    }

.product li {
    display: table-cell;
    padding: 0 27px 0 27px;
    text-align: center;
}

    .product li a {
        font-size: 16px;
        color: #009688;
    }

        .product li a:hover {
            color: #333;
        }

li i.icon_product {
    width: 83px;
    padding-top: 100px;
    background-repeat: no-repeat;
    display: block;
}

.icon_p01 {
    background-image: url(../images/icon_product/icon_p01.png);
}

    .icon_p01:hover {
        background-image: url(../images/icon_product/icon_p01_02.png);
    }

.icon_p01_collapse_hover {
    background-image: url(../images/icon_product/icon_p01_02.png);
}

.icon_p02 {
    background-image: url(../images/icon_product/icon_p02.png);
}

    .icon_p02:hover {
        background-image: url(../images/icon_product/icon_p02_02.png);
    }

.icon_p02_collapse_hover {
    background-image: url(../images/icon_product/icon_p02_02.png);
}

.icon_p03 {
    background-image: url(../images/icon_product/icon_p03.png);
}

    .icon_p03:hover {
        background-image: url(../images/icon_product/icon_p03_02.png);
    }

.icon_p03_collapse_hover {
    background-image: url(../images/icon_product/icon_p03_02.png);
}

.icon_p04 {
    background-image: url(../images/icon_product/icon_p04.png);
}

    .icon_p04:hover {
        background-image: url(../images/icon_product/icon_p04_02.png);
    }

.icon_p04_collapse_hover {
    background-image: url(../images/icon_product/icon_p04_02.png);
}

.icon_p05 {
    background-image: url(../images/icon_product/icon_p05.png);
}

    .icon_p05:hover {
        background-image: url(../images/icon_product/icon_p05_02.png);
    }

.icon_p05_collapse_hover {
    background-image: url(../images/icon_product/icon_p05_02.png);
}

.icon_p06 {
    background-image: url(../images/icon_product/icon_p06.png);
}

    .icon_p06:hover {
        background-image: url(../images/icon_product/icon_p06_02.png);
    }

.icon_p06_collapse_hover {
    background-image: url(../images/icon_product/icon_p06_02.png);
}

.icon_p07 {
    background-image: url(../images/icon_product/icon_p07.png);
}

    .icon_p07:hover {
        background-image: url(../images/icon_product/icon_p07_02.png);
    }

.icon_p07_collapse_hover {
    background-image: url(../images/icon_product/icon_p07_02.png);
}

.icon_p08 {
    background-image: url(../images/icon_product/icon_p08.png);
}

    .icon_p08:hover {
        background-image: url(../images/icon_product/icon_p08_02.png);
    }

.icon_p08_collapse_hover {
    background-image: url(../images/icon_product/icon_p08_02.png);
}

.icon_p09 {
    background-image: url(../images/icon_product/icon_p09.png);
}

    .icon_p09:hover {
        background-image: url(../images/icon_product/icon_p09_02.png);
    }

.icon_p09_collapse_hover {
    background-image: url(../images/icon_product/icon_p09_02.png);
}

.icon_p10 {
    background-image: url(../images/icon_product/icon_p10.png);
}

    .icon_p10:hover {
        background-image: url(../images/icon_product/icon_p10_02.png);
    }

.icon_p10_collapse_hover {
    background-image: url(../images/icon_product/icon_p10_02.png);
}

.icon_p11 {
    background-image: url(../images/icon_product/icon_p11.png);
}

    .icon_p11:hover {
        background-image: url(../images/icon_product/icon_p11_02.png);
    }

.icon_p11_collapse_hover {
    background-image: url(../images/icon_product/icon_p11_02.png);
}

.icon_p12 {
    background-image: url(../images/icon_product/icon_p12.png);
}

    .icon_p12:hover {
        background-image: url(../images/icon_product/icon_p12_02.png);
    }

.icon_p12_collapse_hover {
    background-image: url(../images/icon_product/icon_p12_02.png);
}

.recommend h4, .recommend p, .theme_sidebar_L h4, .theme_sidebar_R h4, .theme_sidebar_L p, .theme_sidebar_R p {
    line-height: 20px;
}

article div.recommend ul {
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
    display: inline-table;
    width: 100%;
}

.M_show_660 {
    display: none;
}

article div.recommend ul li {
    width: 310px;
    display: inline-block;
    margin: 0 4px 50px 4px;
}

    article div.recommend ul li img {
        width: 310px;
        height: 207px;
    }

    article div.recommend ul li span img {
        width: 50px;
        height: 50px;
    }

.recommend ul li span {
    position: relative;
    display: inline-block;
    width: 100%;
    margin: 5px 0 10px 0;
    opacity: 1;
}

    .recommend ul li span:hover {
        opacity: 0.8;
    }

    .recommend ul li span p {
        color: #000;
        position: absolute;
        margin: 0;
        top: 30%;
        left: 60px;
    }

.recommend ul div {
    margin: -1px 0;
    position: relative;
}
    /*.recommend ul div:before {
	content: '';
	display: block;
	position: absolute;
	width: 100%;
	height: 1px;
	background-color: #666;
	top: 0%;
	z-index: 0;
}*/
    .recommend ul div a {
        background-color: #003e3d;
        color: #FFF;
        font-size: 14px;
        padding: 5px 20px;
        margin-right: 5px;
        display: inline-block;
    }

article .theme div {
    position: relative;
    display: table;
}

div.theme_box02, div.theme_box01 {
    width: 100%;
    /*max-width: 800px;*/
    margin-left: auto;
    margin-right: auto;
}

div.theme_box01 {
    margin-top: 30px;
    margin-bottom: 20px;
}

div.theme_box02 {
    margin-top: 10px;
    margin-bottom: 60px;
}

    div.theme_box02 a {
        position: relative;
        display: block;
        margin-left: auto;
        margin-right: auto;
        z-index: 1;
    }

    div.theme_box01:before, div.theme_box01:after, div.theme_box02:before, div.theme_box02:after {
        position: absolute;
        content: '';
        display: block;
        width: 50%;
        height: 30px;
        z-index: 0;
    }

div.theme_box01:before, div.theme_box01:after {
    border-top: 1px solid #666;
    bottom: 25px;
}

div.theme_box02:before, div.theme_box02:after {
    border-bottom: 1px solid #666;
    bottom: 25px;
}

div.theme_box01:before, div.theme_box02:before {
    left: 0;
    border-left: 1px solid #666;
}

div.theme_box01:after, div.theme_box02:after {
    right: 0;
    border-right: 1px solid #666;
}

.h3_theme {
    background-color: #FFF;
    width: 160px;
    margin-left: auto;
    margin-right: auto;
    vertical-align: middle;
    position: relative;
    z-index: 1;
}

article .theme_sidebar_L, article .theme_sidebar_R, article .theme_content {
    float: left;
}

article .theme_sidebar_L, article .theme_sidebar_R {
    max-width: 25%;
    width: 220px;
}

    article .theme_sidebar_L li, article .theme_sidebar_R li {
        margin-bottom: 20px;
        width: 220px;
    }

        article .theme_sidebar_L li img, article .theme_sidebar_R li img {
            width: 220px;
            height: 147px;
        }

article .theme_content {
    width: 50%;
    margin: 0 10px;
    position: relative
}

    article .theme_content img {
        width: 500px;
        height: auto;
        /*max-height:333px;*/
    }

    article .theme_content div {
        position: absolute;
        color: #FFF;
        font-size: 20px;
        background: #009688;
        position: absolute;
        width: 75%;
        max-width: 940px;
        bottom: -70px;
        opacity: 0.9;
        padding: 15px 20px;
        letter-spacing: 1px;
        line-height: 30px;
        left: 42px;
        right: 42px;
    }

        article .theme_content div:hover {
            background: #00796B;
        }

article .theme_button_a {
    display: table;
    position: relative;
}

/*暫時註解舊「品牌」上線區塊 start*/
/*div.Brands {
    position: relative;
}

    div.Brands ul {
        width: 100%;
    /*margin-left: auto;
	margin-right: auto;
	overflow: hidden;
	position: relative;
	margin-top: 10px;
	margin-bottom: 70px;/
    }

.Brands li {
    display: table-cell;
    /*padding: 0 21px 0 21px;/
}

    .Brands li img {
        width: 150px;
        height: 150px;
    }*/
/*暫時註解舊「品牌」上線區塊 end*/

/*------------- 我的收藏 ---------------------*/
.li_side .tag_new_B {
    position: relative;
}

ul li.li_side .date {
    padding: 10px 0 0px 0;
}

ul li.li_side span.date a {
    color: #666;
    font-size: 14px;
}

ul li.li_side .date a:hover {
    color: #000;
}

ul li.li_side .pinit {
    display: block;
    width: 100%;
    height: 57px;
    background-color: #fff;
}

    ul li.li_side .pinit a i {
        display: inline-block;
        width: 30px;
        height: 30px;
        content: "555";
        background-color: #ce2b6b;
        border-radius: 50%;
        color: #fff;
        font-size: 16px;
        line-height: 32px;
        box-sizing: border-box;
        margin-right: 5px;
    }

    ul li.li_side .pinit a:hover i {
        background-color: #fff;
        color: #ce2b6b;
    }

    ul li.li_side .pinit a.more {
        display: block;
        width: 90%;
        border: 1px solid #ce2b6b;
        margin: 0 auto;
        color: #ce2b6b;
        text-align: center;
        font-size: 16px;
        line-height: 45px;
    }

        /*div.history_project #lnkNotLogin_big{
	display: block;
    width: 90%;
    border: 0px solid #ce2b6b;
    margin: 0 auto;
    color: #ce2b6b;
    text-align: center;
    font-size: 16px;
    line-height: 30px;
    cursor:pointer;
	}*/
        /*div.history_project	ul li.li_side .pinit {
    display: block;
    width: 100%;
    height: 30px;
    background-color: #fff;
    padding-top:0px;
}*/
        /*div.history_project #lnkNotLogin_big:hover{
	background-color: #ce2b6b;
    color: #fff;
	}*/

        ul li.li_side .pinit a.more:hover {
            background-color: #ce2b6b;
            color: #fff;
        }

ul li.li_side div.B_hover strong {
    color: #48b6a5;
    margin-bottom: 5px;
    margin-top: 5px;
}

    ul li.li_side div.B_hover strong:hover {
        color: #00796B;
    }
/*------------- 我的收藏 end ---------------------*/
.history_project .bx-wrapper .bx-viewport {
    background-color: transparent;
}
/*------------居家首頁 大於 960px end -----------------*/
/*------------居家-產品專區 product_pages.html  <body id="P_pages"> 大於 960px  -----------------*/
/*導覽*/
.pages_color .headerimg, .pages_color .headerimg img {
    border-radius: 0;
}

.pages_color .borderheadline {
    background-color: #003e3d;
}

.pages_color .borderheadline_fix {
    background-color: #eaeaea;
    box-shadow: 2px 5px 8px rgba(7%, 7%, 7%, 0.3);
}
.Layout2024 .pages_color .borderheadline_fix {
    border-top: 0;
    top: 55px;
}

.Layout2024 .brandIndex .borderheadline_fix {
    display: none;
}
.Layout2024.IsMobile .brandIndex .borderheadline_fix {
    display: block;
}

.pages_color .container .borderheadline a.DesignerIntro_nowMenu, .pages_color .btn_green_square, .pages_color .profile a.title_fix, .pages_color .container .borderheadline_fix a.DesignerIntro_nowMenu, #P_list .profile a.title_fix {
    color: #009688;
}
/*.pages_color .profile a:hover, .pages_color .container .borderheadline a.DesignerIntro_nowMenu, .pages_color .btn_green_square, .pages_color .profile a.title_fix, .pages_color .container .borderheadline_fix a.DesignerIntro_nowMenu {
	color: #000;
}*/
.pages_color .profile a:hover {
    color: #009688 !important;
}

.pages_color .action a:hover {
    background-color: #00796B;
    border: 1px solid #009688;
    color: #FFF !important;
}

.pages_color .borderheadline .btn_green_square {
    border: 1px solid #FFF;
    color: #FFF;
}

/*.pages_color .borderheadline_fix .profile .nav {
	border-left: 1px solid #003e3d;
}*/
/*導覽 end*/
/*.pages_color .profile h2 a {
	top: -70px;
}*/
.pages_color .interview .btn_green {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 60px;
}
/*------------居家-產品專區 product_pages.html  <body id="P_pages"> 大於 960px end -----------------*/

/*------------居家-產品列表 product_list.html <body id="P_list"> 大於 960px -----------------*/
/*導覽*/
#P_list .borderheadline, #P_list .borderheadline_fix, #P_video .borderheadline {
    background-color: #003e3d;
}

.Layout2024 #P_list .borderheadline_fix, .Layout2024 #product_b .borderheadline_fix {
    background-color: #eaeaea;
    box-shadow: 2px 5px 8px rgba(7%, 7%, 7%, 0.3);
    border-top: 0;
    top: 55px;
}

#P_list .container .borderheadline a.DesignerIntro_nowMenu, #P_list .profile span a.title_fix, #P_list .container .borderheadline_fix a.DesignerIntro_nowMenu {
    color: #FFF;
}
/*#P_list .profile a:hover, #P_list .container .borderheadline a.DesignerIntro_nowMenu, #P_list .btn_green_square, #P_list .profile span a.title_fix, #P_list .container .borderheadline_fix a.DesignerIntro_nowMenu{
	color: #000;
}*/
#P_list .profile a:hover {
    color: #009688 !important;
}

#P_list .action a:hover {
    background-color: #00796B;
    border: 1px solid #00796B;
    color: #FFF !important;
}
/*#P_list .btn_green_square {
	border: 1px solid #FFF;
}*/
/*#P_list .borderheadline_fix .profile .nav  {
	border-left: 1px solid #003e3d;
}*/
/*導覽 end*/
#P_list .wrapper100 {
    width: 100%;
    margin: 0 auto;
}

#P_list .profile_width, #P_video .profile_width {
    max-width: 960px;
    font-size: 16px;
}

#P_list h3.h3_p_list {
    padding: 70px 0 20px 0;
}

#P_list .collapse_box {
    width: 960px;
    text-align: center;
    margin: 0 auto;
    margin-top: 20px;
    margin-bottom: 40px;
    font-size: 14px !important;
}

#P_list .collapse {
    padding: 0 10px;
    display: inline-table;
}

    #P_list .collapse div a:first-child, #P_All .collapse div a:first-child {
        display: block;
    }

#P_list .product li {
    padding: 0;
    margin: 0px 5px;
    margin-bottom: 30px;
}

#P_list .history_project {
    padding-bottom: 0;
}

#P_list .collapse a, #P_All .collapse a {
    margin: 7px 0;
}

    #P_list .collapse a.active {
        background-color: #f49e22;
        color: #fff;
    }

#P_list div.product ul {
    margin-top: 30px;
    width: 960px;
    text-align: center;
}

#P_list footer, #P_video footer {
    margin-top: 0;
}

#P_list .li_side img {
    max-height: 206px;
    margin: 0 auto;
    max-width: 300px;
}

#P_list .wrapper {
    width: 100%;
    max-width: 960px;
}

#P_list div.theme_box02:before, #P_list div.theme_box02:after {
    border: 0px;
}

.history_project ul li div.B_hover:hover {
    background-color: #fff;
    cursor: inherit;
}

#P_list .product .page_view_inner a {
    display: inline-block;
}

#P_list .page_view_inner { /*background-color: #eaeaea;*/
    margin: 0;
    padding-bottom: 20px;
    max-width: 100%;
}

/*#P_list .product .page_view_inner a { display: inline-block; }
#P_list .page_view_inner { max-width:960px; margin-top: 40px; margin-bottom: 100px; }
/*#P_list div.theme_box02:before, #P_list div.theme_box02:after { border:0px; }
#P_list .li_side img { max-height:206px; }
#P_list .collapse a.active {background-color: #f49e22; color: #fff;}
#P_list .wrapper { width:100%;}*/

/*------------居家-產品列表 product_list.html <body id="P_list"> 大於 960px end -----------------*/

/*------------居家-全站產品列表 product_All.html <body id="P_All"> 大於 960px -----------------*/
#P_All h4 {
    margin: 25px auto;
    letter-spacing: 2px;
    font-size: 20px;
    color: #333;
    border-bottom: 1px solid #ccc;
    display: table;
    padding-bottom: 5px;
}

#P_All h3.h3_title {
    padding: 10px 0 20px 0;
}

#P_All div.product ul.pAll_icon {
    width: 960px;
    margin-top: 0;
    margin-bottom: 0;
}

#P_All .product .pAll_icon li {
    display: inline-block;
    margin-bottom: 20px;
    padding: 0 43px 0 43px;
    width: 74px
}

#P_All .pAll_icon li i.icon_product {
    width: 70px;
    padding-top: 85px;
    background-repeat: no-repeat;
    display: block;
    background-size: contain;
    max-width: 100%;
    margin: 0 auto;
}

#P_All .collapse_box {
    width: 960px;
    margin-top: 0;
    font-size: 14px;
}

#P_All .collapse {
    padding: 0;
}

#P_All .p_keyword {
    padding: 2px 15px;
    margin: 10px 0 0;
    width: 100%;
    float: left;
    display: inline-block;
}

    #P_All .p_keyword p {
        float: inherit;
        vertical-align: middle;
        line-height: 22px;
        color: #888;
        padding-top: 6px;
    }

    #P_All .p_keyword a {
        color: #888;
    }

        #P_All .p_keyword a:hover {
            color: #333;
            background-color: transparent;
        }

#P_All .product li {
    padding: 0 5px 0 5px;
    margin-bottom: 20px;
}

#P_All .history_project {
    background-color: transparent;
    padding-bottom: 0;
}

    #P_All .history_project ul {
        margin-bottom: 10px;
    }

#P_All .submenu ul {
    margin-bottom: 0;
    display: inline;
}

    #P_All .submenu ul li {
        border: 1px solid #F49E22;
        font-size: 14px;
        color: #F49E22;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        padding: 10px 30px;
    }

        #P_All .submenu ul li:hover {
            background-color: #F49E22;
            color: #FFF;
        }

#P_All div.theme_box01 {
    margin-top: 0;
    margin-bottom: 20px;
    position: relative;
    max-width: 100%;
}

#P_All div.theme_box02 {
    position: relative;
}

div.theme_box01:before, div.theme_box01:after, div.theme_box02:before, div.theme_box02:after {
    height: 15px;
}

div.theme_box01:before, div.theme_box02:before {
    border-left: 1px solid #F49E22;
}

div.theme_box01:before, div.theme_box01:after {
    border-top: 1px solid #F49E22;
}

div.theme_box01:after, div.theme_box02:after {
    border-right: 1px solid #F49E22;
}

div.theme_box02:before, div.theme_box02:after {
    border-bottom: 1px solid #F49E22;
    bottom: 55px;
}

#P_All div.theme_box01:before, #P_All div.theme_box01:after {
    bottom: -15px;
}

#P_All .product .page_view_inner a {
    /*font-size: inherit;*/
    /*--color: inherit;--*/
}

    #P_All .product .page_view_inner a:hover {
        color: ivory;
    }

#P_All .page_view_inner {
    max-width: 960px;
    margin-top: 40px;
    margin-bottom: 100px;
}
/*--#P_All div.product .page_view_inner  {
	margin-bottom: 0;
}--*/
#P_All .product .page_view_inner a {
    display: inline-block;
    margin-bottom: 0;
}

    #P_All .product .page_view_inner a.page_view_icon:hover {
        color: #999;
        background-color: transparent;
    }

#P_All .page_view_inner .page_allResult {
    float: inherit;
}

#P_All .history_project ul li div.B_hover {
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}
/*#P_All .history_project ul li div.B_hover:hover {
	border-left: 1px solid #333;
	border-right: 1px solid #333;
}*/
#P_All .li_side img {
    max-height: 206px;
    max-width: 310px;
    margin: 0 auto;
}

/*------------居家-全站產品列表 product_All.html <body id="P_All"> 大於 960px end -----------------*/
/*------------居家-影音 product_video.html <body id="P_video"> 大於 960px -----------------*/
#P_video .wrapper {
    max-width: 960px;
    margin: 0 auto;
}

.video_time {
    padding: 0 8px;
    position: absolute;
    width: auto;
    right: 0;
}

#P_video .event_content {
    margin: 80px 0 30px 0;
}

#P_video .product li {
    padding: 0;
    margin: 0px 5px;
    margin-bottom: 30px;
    width: 300px;
    height: 250px;
    overflow: hidden;
}

#P_video .history_project ul li strong {
    padding: 0px 0px 13px 0px;
}

#P_video .history_project {
    background-color: transparent;
}

    #P_video .history_project ul li, #P_video .history_project ul li .date {
        text-align: left;
    }

#P_video a.video_field_img {
    display: block;
    width: 300px;
    position: relative;
}

.video_field_img:hover:before {
    background-image: url(../images/video/big_play_black.png);
}

.video_field_img:before {
    content: "";
    display: block;
    width: 97px;
    height: 97px;
    z-index: 2;
    background-image: url(../images/video/big_play_white.png);
    position: absolute;
    left: 35%;
    top: 25%;
}

#P_video div.product ul {
    margin-top: 0px;
    margin-bottom: 0;
    width: 960px;
    text-align: center;
}

.design_color .borderheadline_fix .profile .nav {
    border-left: 1px solid #21262a;
}

.design_color .profile .nav ul li a:hover {
    color: #00796B;
}

/*----影音推薦 BEGIN-----*/
/*.products_VideoRecommend{max-width: 1200px; margin: 0 auto;}*/
.product_content .products_VideoRecommend h2 {    display:block;font-size: 1.8em;line-height: 2em;font-weight: 500;text-align: center;}
.homeowner_witness_container{display:flex;box-sizing: border-box;justify-content: space-between;margin-top: 20px;}

.product_content .products_VideoRecommend a { font-weight: 500; }
    .product_content .products_VideoRecommend a:hover {
        color: #009688;
    }

.homeowner_witness_container img{max-width:100%;max-height: 100%; position: absolute;left: 0;top: 0; padding: 0;right: 0;margin: auto;}

.main_witness_desc , .witness_column{display:block;width:48%;}

.main_witness_desc{display: block;    position: relative;display: block;   overflow: hidden; position: relative; }
.main_witness_desc a {display: block;    width: 100%;   overflow: hidden; position: relative; }
.witness_desc_img{display: block;    width: 100%;    height: 0;    padding-bottom: 66.6%;    overflow: hidden; position: relative; }

.witness_desc{display: flex;}


.witness_column .witness_desc  {display:flex;position: relative;justify-content: space-between;flex-wrap:wrap;position: relative;padding-bottom:11px;box-sizing: border-box;border-bottom: 1px solid #000;margin-bottom:11px;}
.witness_column .witness_desc+.witness_column .witness_desc{margin-bottom:0px;}
.witness_column .witness_desc_img{width:45%;height: 0;    padding-bottom:30%;    overflow: hidden;    position: relative;}
.witness_column .witness_title{width:52%;position: relative;}


.witness_column .witness_desc .witness_title{display: block;position: relative; }
.witness_column .witness_desc .witness_title a{display: block; position: relative;}



.main_witness_desc .witness_desc_img:before{display:block;content: ""; width:100%; height:90px;background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.75) 100%);position: absolute;bottom: 0;z-index: 2;}
.main_witness_desc em.play {display: block;width:100px;height:100px;font-size: 30px;line-height:98px;padding-left: 5px;  transition: all .3s;    border-radius: 100%;box-sizing: border-box;background: rgba(0,0,0,.3);border: 2px solid #fff;right: 0;left:0px;top: 0;bottom: 0;margin: auto;position: absolute;z-index:99;color: #fff;text-align: center;}
.main_witness_desc a:hover .play{background-color: #fff;color: #000;}
.main_witness_desc h3{display: block;padding: 10px 20px; color: #fff; font-weight: 500; position: absolute;bottom:0px;z-index: 5;font-size: 1.25em;}

.main_witness_desc em.play {display: block;width:100px;height:100px;font-size: 30px;line-height:98px;padding-left: 5px;  transition: all .3s;    border-radius: 100%;box-sizing: border-box;background: rgba(0,0,0,.3);border: 2px solid #fff;right: 0;left:0px;top: 0;bottom: 0;margin: auto;position: absolute;z-index:99;color: #fff;text-align: center;}
.main_witness_desc a:hover .play{background-color: #fff;color: #000;}

.witness_column .witness_desc em.play {display: block; width: 55px; height: 55px;border: 2px solid #fff;  border-radius: 100%;line-height: 50px;text-align:center;font-size: 20px;padding-left: 5px;  transition: all .3s; box-sizing: border-box; right: 0;right: 0;left: 0px;top: 0;bottom: 0;margin: auto;position: absolute;z-index: 10;background: rgba(0, 0, 0, .3);color: #fff;}

.witness_column .witness_desc a:hover .play {background-color: #fff; color: #000;}


/*----影音推薦 END-----*/

.products_VideoRecommend .shi-play {
    background-size: 40%;
    background-repeat: no-repeat;
/*    background-position: 45% center;*/
    min-height: auto;
    width: 100%;
    height: 100%;
    border: 0;
}
.products_VideoRecommend a:hover .shi-play {
    filter: invert(0);
}

/*------------居家-影音 product_video.html <body id="P_video"> 大於 960px end -----------------*/


@media (max-width: 960px) {
    /*------------居家首頁 小於 960px  -----------------*/

    .container .wrapper {
        width: 100%;
    }

    .wrapper .kanban li img {
        width: 100%;
    }

    .kanban li .kanban_h2p {
        display: none;
    }

    .kanban li .kanban_h2 {
        width: 98%;
        padding: 10px 1%;
    }

    .sidebar_left ul li {
        margin-right: 0;
    }

    .sidebar_left, .sidebar_right {
        width: 100%;
        max-width: 100%;
        float: inherit;
        margin-bottom: 30px;
    }

    .sidebar_right {
        text-align: center;
    }

    .sidebar_left ul {
        margin-left: 50px;
        margin-right: 50px;
    }

    .sidebar_right ul {
        width: 70%;
        margin-top: 0;
    }

        .sidebar_right ul li {
            margin: 15px;
        }

    .arrow_LR_small ul {
        width: 88% !important;
    }

    .unpacking li {
        padding: 0 6px 0 6px;
    }

    .background01 a.bx_prev {
        left: 0px;
    }

    .background01 a.bx_next {
        right: 0px;
    }

    .arrow_left_s03 {
        left: 80px;
    }

    .arrow_right_s04 {
        right: 80px;
    }

    div.product ul {
        width: 72%;
    }

    .M_show_660 {
        display: block;
    }

    article .recommend {
        position: relative;
    }

    article div.recommend ul {
        overflow: hidden;
        position: relative;
        display: block;
        width: 77%;
    }

        article div.recommend ul li {
            display: table-cell;
            padding: 0 20px 0 28px;
        }

    article .theme div {
        margin-left: auto;
        margin-right: auto;
    }

    article .theme_sidebar_L, article .theme_sidebar_R, article .theme_content {
        float: inherit;
    }

        article .theme_sidebar_L li, article .theme_sidebar_R li {
            display: inline-block;
            width: 220px;
            margin: 0 18px 50px 40px;
        }

    article .theme_sidebar_L, article .theme_sidebar_R {
        max-width: 100%;
        width: auto;
    }

        article .theme_sidebar_L ul, article .theme_sidebar_R ul {
            margin-left: auto;
            margin-right: auto;
            display: table;
        }

    article .theme_content {
        margin-bottom: 120px;
    }

    div.theme_box01 {
        margin-top: 60px;
    }

    div.theme_box02, div.theme_box01 {
        width: 71%;
    }

    div.Brands ul {
        width: 580px;
    }

    .arrow_left_s01 {
        left: 10px;
    }

    .arrow_right_s02 {
        right: 10px;
    }

    .arrow_left_s03 {
        left: 10px;
    }

    .arrow_right_s04 {
        right: 10px;
    }

    .recommend ul div a {
        background-color: #003e3d;
        color: #FFF;
        font-size: 14px;
        padding: 5px 15px;
        margin-right: 5px;
        display: inline-block;
    }
    /*------------居家首頁 小於 960px end-----------------*/

    /*------------居家-產品列表 product_list.html <body id="P_list"> 小於 960px -----------------*/
    #P_list .collapse_box, #P_list div.product ul {
        width: 100%;
    }

    #P_list .product li {
        float: initial;
        margin: 0px 10px;
        margin-bottom: 30px;
    }
    /*------------居家-產品列表 product_list.html <body id="P_list"> 小於 960px end -----------------*/

    /*------------居家-全站產品列表 product_All.html <body id="P_All"> 小於 960px  -----------------*/
    #P_All div.product ul.pAll_icon, #P_All .collapse_box, #P_All .submenu ul {
        width: 100%;
        max-width: 100%;
    }

    #P_All div.product ul.pAll_icon {
        text-align: center;
    }

    #P_All .collapse_box {
        margin: 0 0px;
    }

    #P_All .collapse {
        max-height: 100%;
    }

    #P_All div.theme_box02, #P_All div.theme_box01 {
        width: 96%;
        max-width: 96%;
    }

    #P_All .history_project ul {
        width: 86%;
        margin: 0 auto;
        text-align: center;
    }

        #P_All .history_project ul li {
            float: inherit;
        }
    /*------------居家-全站產品列表 product_All.html <body id="P_All"> 小於 960px end -----------------*/

    /*------------居家-影音 product_video.html <body id="P_video"> 小於 960px -----------------*/
    #P_video .history_project ul li {
        float: inherit;
        height: auto;
        display: inline-table;
        vertical-align: top;
    }

    #P_video div.product ul {
        width: 100%;
    }

    /*------------居家-影音 product_video.html <body id="P_video"> 小於 960px end -----------------*/



}



.ad_photo:hover img {5
    transform: scale(1.07);
    transition: all .3s;
}

/*輪播區塊*/
.topic_slideshow {
    display: block;
    width: 100%;
    height: 700px;
    overflow: hidden;
    background-color: #282828;
    position: relative;
}

.topic_box {
    display: block;
    max-width: 100%;
    margin: 0 auto;
    position: relative;
    box-sizing: border-box;
}

.topic_img a {
    display: block;
    width: 100%;
    height: 700px;
    background-image: url(../images/imgsys20200228145915370.jpg);
    background-position: 50% 50%;
    background: no-repeat;
    background-position: center;
}

.topic_subject {
    display: block;
    width: 33%;
    height: 700px;
    position: absolute;
    bottom: 0;
    right: 0;
    background-color: rgba(0,0,0,.6);
    padding: 35px;
    color: #fff;
    box-sizing: border-box;
}

    /*輪播區塊標題*/
    .topic_subject h2 a {
        display: block;
        font-size: 2.25em;
        color: #fff;
        font-weight: 500;
    }

        .topic_subject h2 a:hover {
            color: #009688;
        }

    /*日期*/
    .topic_subject i {
        display: inline-block;
        margin-top: 10px;
        padding-top: 5px;
        border-top: 3px solid #009688;
        font-size: 14px;
    }

/*輪播區塊頁碼*/
.switch_view {
    display: flex;
    justify-content: flex-end;
    position: absolute;
    bottom: 15px;
    right: 40px;
}

    .switch_view a {
        display: inline-block;
        color: #fff;
        width: 30px;
        height: 30px;
        border-radius: 100%;
        margin: 3px;
        text-decoration: underline;
        font-size: 14px;
        line-height: 30px;
        text-align: center;
    }

        .switch_view a:hover, .switch_view_selected {
            background-color: #009788;
            border-radius: 100%;
            text-decoration: none;
        }

/*內容區塊樣式設定*/
#wrapper {
    color: #333;
}

.product_content a {
    color: #333;
}

.product_content h2 {
    display: inline-block;
    font-size: 1.8em;
    line-height: 2em;
    font-weight: 500;
    text-align: center;
}

.product_content section {
    max-width: 1200px;
    margin: 0 auto;
    padding: 50px 0;
}

/*找產品*/
.search_fuction {
    display: flex;
    margin: 0 auto;
    justify-content: center;
    max-width: 1200px;
    position: relative;
    flex-wrap: wrap;
}

    .search_fuction h2 {
        position: absolute;
        left: 0;
    }

/*產品搜尋數量*/
a.count {
    display: block;
    color: #009688;
    text-decoration: underline;
    position: absolute;
    right: 0;
    font-weight: 500;
    font-size: 1.25em;
    margin-top: 10px;
}

/*搜尋商品下拉選單*/
.from_row {
    line-height: 40px;
    margin-bottom: 30px;
    position: relative;
    margin: 5px 10px;
}

    .from_row select {
        display: inline-block;
        width: 250px;
        height: 40px;
        background-color: #fff;
        color: #000;
        border: 0;
        margin: 0 15px;
        font-size: 16px;
        padding: 5px 10px;
        box-sizing: border-box;
        border: 1px solid #333;
        font-weight: 600;
    }

.dropdown {
    display: inline-block;
    position: relative;
    float: left;
}

    .dropdown:before, .dropdown:after {
        content: '';
        position: absolute;
        z-index: 2;
        top: 15px;
        right: 25px;
        width: 0;
        height: 0;
        border: 4px dashed;
        border-color: #333 transparent;
        pointer-events: none;
    }

    .dropdown:before {
        border-bottom-style: solid;
        border-top: none;
    }

    .dropdown:after {
        margin-top: 10px;
        border-top-style: solid;
        border-bottom: none;
    }

    .dropdown select {
        -webkit-appearance: none;
        -moz-appearance: none;
        -o-appearance: none;
        appearance: none;
        -ms-appearance: none;
    }

        .dropdown select::-ms-expand {
            display: none;
        }

    .dropdown option {
        margin: 3px;
        padding: 6px 8px;
        text-shadow: none;
        /*background: #141421;*/
        border-radius: 3px;
        cursor: pointer;
        line-height: 1.5em;
    }

/*搜尋商品結果*/
.results_list {
    display: flex;
    justify-content: space-between;
    flex-direction: row;
    flex-wrap: wrap;
}

    .results_list > div {
        display: block;
        width: 23%;
        margin-top: 30px;
        margin-bottom: 50px;
        position: relative;
    }

        .results_list > div > a {
            display: block;
        }

            .results_list > div > a:hover {
                color: #009688;
            }

.results_photo {
    display: block;
    width: 100%;
    height: 0;
    padding-bottom: 67%;
    overflow: hidden;
}

    .results_photo img {
        width: 100%;
    }

.results_list div a:hover img {
    transform: scale(1.07);
    transition: all .3s;
}

.results_info {
    display: block;
}

    .results_info h3, .items_box h3 {
        font-size: 1.25em;
        font-weight: 500;
        margin-top: 10px;
    }

    .results_info p, {
        padding-bottom: 10px;
        border-bottom: 1px solid #333;
    }

#product_b .media_group {
    float: right;
    font-size: 14px;
    /*position: absolute;*/
    top: 100%;
    right: 0;
    bottom: 0;
}

/*好物推薦*/
.products_recommend {
    display: block;
    background-color: #efefef;
    text-align: center;
}

.recommend_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.post_items {
    display: inline-block;
    width: 30%;
    background-color: #fff;
    box-sizing: border-box;
    margin: 20px 0;
}

    .post_items a:hover .post_img img {
        transform: scale(1.07);
        transition: all .3s;
    }

.post_img {
    height: 0;
    padding-bottom: 67%;
    overflow: hidden;
}

    .post_img img {
        width: 100%;
    }

.post_items a h3 {
    display: block;
    font-size: 1.25em;
    font-weight: 500;
    padding: 10px 15px;
}

.post_items a:hover h3, .items_box a:hover {
    color: #009688;
}

/*好物廠商資訊*/
.post_about {
    display: block;
    width: 92%;
    overflow: hidden;
    border-top: 1px solid #333;
    margin: 0 auto;
    padding: 15px 0;
}

.post_logo a {
    width: 90px;
    height: 90px;
    float: left;
    margin-right: 15px;
}

.post_logo img {
    width: 100%;
}

.post_info h4 a {
    display: block;
    font-weight: 500;
    font-size: 18px;
}

.post_info a.post_more {
    display: inline-block;
    padding: 3px 5px;
    border: 1px solid #999;
    margin: 10px 5px 0 0;
    font-size: 14px;
}

    .post_info a.post_more:hover {
        background-color: #009688;
        color: #fff;
        border-color: #009688;
    }

/*新品上線*/
.products_upload section {
    max-width: 1500px;
    text-align: center;
}

.new_items_list {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.items_box {
    width: 22%;
    margin: 20px 0;
}

    .items_box img {
        width: 100%;
        height: 100%;
    }

    .items_box a:hover img {
        transform: scale(1.07);
        transition: all .3s;
    }

/*品牌上線*/
.brand_upload section {
    position: relative;
    overflow: hidden;
}

.brand_upload h2 {
    display: block;
    text-align: center;
}

.brand_upload ul {
    display: flex;
    justify-content: center;
    width: 90%;
    margin: 0 auto;
}

    .brand_upload ul li a {
        display: block;
        width: 140px;
        height: 140px;
        overflow: hidden;
        margin: 20px 25px;
        box-shadow: 0px 0px 3px #626262;
        overflow: hidden;
    }

        .brand_upload ul li a img {
            width: 100%;
        }

        .brand_upload ul li a:hover img {
            transform: scale(1.07);
        }

.arrow {
    position: absolute;
    padding: 1.8rem;
    box-shadow: 1px -1px 0 1px #333 inset;
    -webkit-box-shadow: 2px -2px #333 inset;
    border: solid transparent;
    border-width: 0 0 2rem 2rem;
    transition: .2s;
    z-index: 5;
}

.arrow-left {
    left: -20px;
    top: 37%;
}

.arrow-right {
    top: 37%;
    right: -20px;
    margin-right: 0;
}

/*------------居家管 改版 end-----------------*/

@media (max-width: 768px) {
    /*------------居家首頁 768px -----------------*/
    h3.h3_title {
        font-size: 26px;
    }

    .arrow_LR_small ul {
        width: 506px !important;
    }

    .unpacking li {
        padding: 0 8px 0 12px;
    }

    div.product ul {
        width: 550px;
    }

    article div.recommend ul {
        width: 310px;
    }

        article div.recommend ul li {
            padding: 0;
        }

    .Brands li {
        /*padding: 0 18px 0 18px;*/
        padding: 0;
    }

    .sidebar_right ul {
        width: 100%;
    }

    article div.recommend .bx-prev {
        background: url(../images/index_arrow_pre.png);
        width: 46px;
        height: 46px;
    }

    article div.recommend .bx-next {
        background: url(../images/index_arrow_next.png);
        width: 46px;
        height: 46px;
    }

    .pages_color .borderheadline_fix .nav ul li a {
        color: #333;
    }

    /*------------居家首頁 768px end -----------------*/
    /*------------居家-產品專區 product_pages.html  <body id="P_pages"> 768px  -----------------*/
    .pages_color .profile nav, .pages_color .profile .nav, #product_b .profile .nav {
        /*background-color: #c17200;*/
        /*background-color: #003e3d;*/
        background-color: transparent;
    }
    /*------------居家-產品專區 product_pages.html  <body id="P_pages"> 768px end -----------------*/

    /*------------居家-產品列表 product_list.html <body id="P_list"> 768px -----------------*/
    #P_list .profile nav, #P_list .profile .nav, #P_video .profile nav {
        background-color: transparent;
    }

    #P_list .product li {
        margin: 0;
        margin-bottom: 30px;
    }

    #P_list .li_side .tag_new {
        left: 0;
    }

    #P_list div.product ul {
        margin-top: 0;
    }

    #P_list .collapse_box {
        margin-top: 0px;
        margin-bottom: 20px;
        width: 80%;
    }

    #P_list .page_view_inner {
        width: 100%
    }

    /*------------居家-產品列表 product_list.html <body id="P_list"> 768px end -----------------*/

    /*------------居家-全站產品列表 product_All.html <body id="P_All"> 768px -----------------*/
    #P_All .submenu ul {
        display: block;
    }

    #P_All .history_project {
        margin-top: 30px;
    }

    #P_All .product li {
        padding: 0;
    }
    /*------------居家-全站產品列表 product_All.html <body id="P_All"> 768px end -----------------*/

    /*------------居家-影音 product_video.html <body id="P_video"> 768px -----------------*/
    #P_video .collapse {
        max-height: 100%;
    }

    /*------------居家-影音 product_video.html <body id="P_video"> 768px end -----------------*/

}

@media (max-width: 660px) {
    /*------------居家首頁 660px -----------------*/
    .M_hide_660 {
        display: none !important;
    }

    .sidebar_left h4, .sidebar_left p.p_content {
        line-height: 25px;
        letter-spacing: 1px;
    }

    .kanban li .kanban_h2p {
        display: none;
    }

    .kanban li .kanban_h2 {
        font-size: 16px;
        line-height: 20px;
    }

    .arrow_LR_small ul {
        width: 315px !important;
    }

    .unpacking li {
        padding: 0 5px 0 0;
    }

        .unpacking li h4, .unpacking li p {
            max-width: 310px;
            margin: 5px 10px 0 10px;
        }

        .unpacking li img {
            width: 310px;
            height: 207px;
        }

    .background01 a.bx_prev, .background01 a.bx_next {
        top: 45%;
    }

    .theme_box a.btn_green {
        width: 90%;
    }

    .sidebar_left ul {
        margin-left: 20px;
        margin-right: 20px;
    }

    .sidebar_right ul {
        width: 100%;
    }

    div.product ul {
        width: 410px;
    }

    div.theme_box02, div.theme_box01 {
        width: 100%;
    }

    div.Brands ul {
        width: 380px;
    }

    div.theme_box01:before, div.theme_box01:after, div.theme_box02:before, div.theme_box02:after {
        display: none;
    }
    /*------------居家首頁 660px end -----------------*/

    /*------------居家-全站產品列表 product_All.html <body id="P_All"> 660px -----------------*/
    #P_All div.theme_box01:before, #P_All div.theme_box01:after, #P_All div.theme_box02:before, #P_All div.theme_box02:after {
        display: block;
    }

    #P_All h4 {
        font-size: 18px;
    }

    #P_All .product li a {
        font-size: 14px;
    }

    #P_All .pAll_icon li i.icon_product {
        width: 50px;
        padding-top: 60px;
    }

    #P_All .product .pAll_icon li {
        padding: 0 13px 0 13px;
    }
    /*------------居家-全站產品列表 product_All.html <body id="P_All"> 660px end -----------------*/
    /*------------居家-影音 product_video.html <body id="P_video"> 660px -----------------*/
    #P_video a.video_field_img {
        display: inline-block;
        width: 100%;
    }

    #P_video .product li {
        margin: 0;
        width: 100%;
        margin-bottom: 20px;
    }

    #P_video .history_project .B_hover {
        margin: 0 10px;
    }
    /*------------居家-影音 product_video.html <body id="P_video"> 660px end -----------------*/

    /*------------居家-產品專區 product_pages.html  <body id="P_pages"> 660px  ---------------*/
    .pages_color .btn_green_square {
        background-color: #FFF;
        border: 1px solid #003e3d;
        color: #003e3d !important;
    }

    .profile nav ul li:nth-child(1) a {
        border-left: 1px solid #ddd;
    }

    .profile nav ul li a {
        border-right: 1px solid #ddd;
    }
    /*------------居家-產品專區 product_pages.html  <body id="P_pages"> 660px end  -----------*/

}

@media (max-width: 480px) {
    /*------------居家首頁 480px -----------------*/
    .deco_ad {
        display: none;
    }

    .kanban li .kanban_h2p {
        display: none;
    }

    .kanban li .kanban_h2 {
        font-size: 14px;
        /*bottom: -50px;*/
    }

    span.AgreeAndRead {
        width: 250px;
    }

    table.MailTo textarea {
        width: 250px;
    }

    .Brands li {
        padding: 0;
    }

    div.product ul {
        width: 218px;
    }

    div.Brands ul {
        width: 150px;
    }

    .sidebar_left {
        /*margin-top: 50px;*/
        width: 93%;
        margin: 0 auto;
    }

    .sidebar_right {
        width: 93%;
        margin: 0 auto;
    }

    .sidebar_left ul {
        margin-left: 10px;
        margin-right: 10px;
    }

    .sidebar_right ul li {
        margin: 0 10px 20px 0px;
        width: 100%;
        height: auto;
    }

        .sidebar_right ul li img {
            width: 100%;
            height: auto;
        }

        .sidebar_right ul li div {
            width: auto;
            height: auto;
        }

    .arrow660_left {
        top: 45%;
    }

    .arrow660_right {
        top: 45%;
    }

    .product li {
        padding: 0 27px 0 8px;
    }

    article div.recommend h4, article div.recommend p, .recommend ul li span, .recommend ul div {
        margin-left: 10px;
        margin-right: 10px;
    }

    article .theme_content {
        width: 100%;
        margin-bottom: 20px;
    }

        article .theme_content img {
            width: 100%;
        }

        article .theme_content div {
            font-size: 14px;
            width: 94%;
            margin: 0 auto;
            max-width: 100%;
            bottom: 0;
            padding: 10px 12px;
            line-height: 20px;
            left: 0;
            right: 0;
        }

    div.theme_box01 {
        margin-top: 50px;
        margin-bottom: 0;
    }

    div.theme_box02 {
        width: 100%;
        margin-top: 0;
        margin-bottom: 50px;
    }

    .theme_box a.btn_green {
        margin-top: 0;
    }
    /*------------居家首頁 480px end-----------------*/

    /*------------居家-全站產品列表 product_All.html <body id="P_All"> 480px -----------------*/
    #P_All div.product .page_view_inner ul {
        width: 100%;
    }

    #P_All .p_keyword {
        padding: 5px;
    }

    /*------------居家-全站產品列表 product_All.html <body id="P_All"> 480px end -----------------*/

    #P_video .wrapper {
        max-width: 100%;
    }

    /*------------找設計師 nav 480px -----------------*/

    .borderheadline_fix .profile .nav {
        margin: 0 10px 0 58px;
    }

    .profile .nav ul li a {
        padding: 0 8px;
        color: #333;
    }
    /*------------找設計師 nav  480px end -----------------*/


}

/* code add begin*/
a.aboutme_btn {
    display: none;
}

.history_project {
    background-color: #fff;
}

.brandSocial {
    display: block;
    position: relative;
    left: 50%;
    margin-left: -200px;
    margin-bottom: 2em;
    width: 450px;
}
/*品牌專頁內容頁最上面黑bar的間距*/
#P_video .page_view_inner {
    margin: 0 auto 30px;
}
/*品牌影音分頁距離*/
.container .borderheadline a.BrandIntro_nowMenu, .container .borderheadline_fix a.BrandIntro_nowMenu {
    color: #009688 !important;
}

@media screen and (max-width: 768px) {
    .brandSocial {
        display: block;
        position: relative;
        left: 0;
        margin-left: 0;
        width: 100%;
    }
}

@media screen and (max-width: 660px) {
    a.aboutme_btn {
        display: block;
    }
}

@media screen and (max-width: 414px) {
    .pages_color .borderheadline {
        background-color: #fff;
    }

    .brandSocial .w_pocket {
        display: none;
    }
}

@media screen and (max-width: 320px) {
    .brandSocial .w_plurk {
        display: none;
    }
}

/* code add end*/


@media (max-width: 960px) {
    #product_b .SPicList {
        width: 90%;
    }

    #product_b .pdimg_B_img {
        width: 100%;
    }

        #product_b .pdimg_B_img li {
            width: 100%;
        }

    #product_b .BigProSlide {
        width: 90%;
    }

        #product_b .BigProSlide .SPicList .frame {
            width: 75%;
        }

        #product_b .BigProSlide .SPicList ul li {
            width: 65px;
        }

            #product_b .BigProSlide .SPicList ul li a {
                width: 65px;
            }

    .BigProSlide .SPicList ul li a {
        overflow: hidden;
    }
}

/*#product_b .background{
	background-image:url(../images/background.png);
}*/

#product_b .wrapper770 {
    width: 770px;
    margin: 0px auto;
    padding: 50px 0;
    line-height: 30px;
}
.Layout2024 #product_b .wrapper770 {
    padding: 60px 0;
}


    #product_b .wrapper770 div #clo {
        width: 35px;
        height: 35px;
        background-color: #AAA;
        /*position: absolute;*/
        right: 0;
        float: right;
        text-align: center;
        font-size: 16px;
        color: #FFF;
        line-height: 35px;
    }

#product_b .BeforeYouBuy {
    margin-bottom: 10px;
}

#product_b .ProductDes {
    padding-top: 7px;
}

#product_b .commentRW {
    width: 100%;
    float: left;
}

#product_b div.message {
    background-color: #eaeaea;
    width: 100%;
}

#product_b div#fbcomment {
    width: 100%;
}

.new_items_photo {
    width: 100%;
    height: 75%;
}

@media (max-width: 768px) {
    #product_b .ProductInfo, #product_b .ProNotice {
        width: 95%
    }

    #product_b .background {
        background-image: none;
    }

    #product_b .ProductDes {
        width: 98%;
    }

    .Layout2024 #product_b .wrapper770 {
        width: 90%;
        padding-top: 60px;
    }

    #product_b .ProductData1, .BigProSlide {
        width: 95%;
        float: none;
        margin: 0 auto;
    }

    #product_b .BeforeYouBuy {
        float: none;
    }

    #product_b .ProductDes img[src*=".jpg"] {
        width: 100% !important;
        height: auto !important;
    }
}

#product_b .BigProSlide {
    padding-left: 3px;
}


/*------------（mobile）居家管 改版 start-----------------*/

@media screen and (min-width:320px) and (max-width:1024px) {
    /*找產品下拉選單隱藏*/
    .products_sub {
        display: none;
    }

    /*輪播*/
    /*.topic_slideshow {
        margin-top: 50px;
    }*/
    /*內容區塊樣式設定*/
    .product_content section {
        padding: 50px 20px;
    }
    /*找產品*/
    .search_fuction h2 {
        left: 20px;
    }

    a.count {
        right: 20px;
    }

    .results_list > div {
        width: 48%;
    }

    .recommend_list {
        justify-content: space-between;
    }
    /*好物推薦*/
    .post_items {
        width: 48%;
    }
    /*品牌上線*/
    .arrow-left {
        left: 0px;
    }

    .arrow-right {
        right: 0px;
    }

    /*.brand_upload ul li a {
        margin: 25px;
    }*/


    /*******************影音推薦*******************/
    .products_VideoRecommend{padding:0px 20px;}
}

@media screen and (min-width:320px) and (max-width:800px) {
    /*輪播*/
    .topic_img a {
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat;
        height: 269px;
    }

    .topic_slideshow {
        height: 430px;
        position: relative;
    }

    .topic_box {
        height: 430px;
    }

    .topic_subject {
        width: 100%;
        height: 161px;
        padding: 20px;
    }

        .topic_subject h2 a {
            font-size: 2em;
        }

        .topic_subject i {
            display: none;
        }
    /*找產品*/
    .from_row select {
        width: 180px;
    }
    /*新品上線*/
    .items_box {
        width: 48%;
    }

    .brand_upload ul li a {
        margin: 20px 28px;
    }

    /*品牌上線*/
    /*.brand_upload section {
            padding-top: 0;
        }

        .brand_upload ul li:nth-child(n+4) {
            display: none;
        }

        .brand_upload ul li a {
            margin: 15px 30px;
        }

        .post_info a.post_more {
            display: none;
        }

        .arrow-left {
            ;
            top: 35%;
        }

        .arrow-right {
            top: 35%;
        }*/

    /*******************影音推薦*******************/
    .homeowner_witness_container, .witness_column .witness_desc {
        display: block;
    }
    .main_witness_desc, .witness_column{width: 100%;}
    .witness_column .witness_desc_img{width: 100%;   padding-bottom:66.6%;margin-bottom: 10px;  }
    .witness_column .witness_title{width: 100%;}
    .witness_column .witness_desc{margin-top:50px;border-bottom: 0;margin-bottom: 0;}
	 .main_witness_desc h3{position: relative;color: #000;margin-top: 10px;padding: 0;}
    .witness_title h3{font-size: 1.25em;font-weight: 500;}
    .witness_column .witness_desc em.play{ width: 100px;height: 100px;font-size: 30px;line-height: 98px;}
}

@media screen and (min-width:320px) and (max-width:640px) {
    /*輪播*/
    .topic_img a {
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat;
        height: 170px;
    }

    .topic_slideshow {
        height: 300px;
        position: relative;
    }

    .topic_box {
        height: 300px;
    }

    .topic_subject {
        width: 100%;
        height: 130px;
        padding: 20px;
    }

        .topic_subject h2 a {
            font-size: 1.25em;
        }

    /*找產品*/
    .search_fuction h2 {
        position: relative;
        display: block;
        width: 100%;
        left: 0;
    }

    a.count {
        position: relative;
        display: block;
        width: 100%;
        margin-top: 10px;
        text-align: center;
        right: 0;
    }

    .from_row select {
        width: 350px;
        margin-bottom: 20px;
    }

    .switch_view {
        right: 15px;
        bottom: 10px;
    }
    /*品牌上線*/
    /*.brand_upload ul li a {
            width: 130px;
            height: 130px;
        }

        .brand_upload ul li a {
            margin: 15px;
        }*/
}

@media screen and (min-width:320px) and (max-width:480px) {
    /*輪播*/
    .topic_slideshow {
        height: 300px;
        position: relative;
    }

    .topic_box {
        height: 300px;
    }

    .topic_subject {
        width: 100%;
        height: 130px;
        padding: 20px;
    }

        .topic_subject i {
            display: none;
        }

        .topic_subject h2 a {
            font-size: 1em;
        }
    /*找產品*/
    .from_row select {
        width: 300px;
    }

    .results_list > div {
        width: 100%;
    }
    /*新品上線*/
    .items_box {
        width: 100%;
    }
    /*好物推薦*/
    .post_items {
        width: 100%;
    }

    .brand_upload ul li a {
        width: 130px;
        height: 130px;
    }

    /*品牌上線*/
    /*.brand_upload ul li a {
            width: 130px;
            height: 130px;
        }

        .brand_upload ul li:nth-child(n+3) {
            display: none;
        }*/
}

@media screen and (min-width:320px) and (max-width:414px) {
    /*找產品*/
    .from_row select {
        width: 250px;
    }

    /*品牌上線*/
    /*.brand_upload ul li a {
            width: 150px;
            height: 150px;
        }

        .brand_upload ul li:nth-child(2n+1) {
            display: none;
        }*/
}

@media screen and (min-width:414px) and (max-width:414px) {
    /*輪播*/
    .topic_slideshow {
        height: 259px;
        position: relative;
    }

    .topic_box {
        height: 260px;
    }

    .topic_img a {
        height: 145px;
    }

    .topic_subject {
        width: 100%;
        height: 115px;
        padding: 20px;
    }
}

@media screen and (min-width:375px) and (max-width:375px) {
    /*輪播*/
    .topic_slideshow {
        height: 259px;
        position: relative;
    }

    .topic_box {
        height: 260px;
    }

    .topic_img a {
        height: 132px;
    }

    .topic_subject {
        width: 100%;
        height: 128px;
        padding: 20px;
    }
}

@media screen and (min-width:360px) and (max-width:360px) {
    /*輪播*/
    .topic_slideshow {
        height: 259px;
        position: relative;
    }

    .topic_box {
        height: 257px;
    }

    .topic_img a {
        height: 126px;
    }

    .topic_subject {
        width: 100%;
        height: 130px;
        padding: 20px;
    }
}

@media screen and (min-width:320px) and (max-width:320px) {
    /*輪播*/
    .topic_slideshow {
        height: 257px;
        position: relative;
    }

    .topic_box {
        height: 257px;
    }

    .topic_img a {
        height: 112px;
    }

    .topic_subject {
        width: 100%;
        height: 145px;
        padding: 20px;
    }
}

/*------------（mobile）居家管 改版 end-----------------*/

