body, html {height: 100%;margin: 0;padding: 0;}
img {
    height: auto;
    max-width: 100%;
    border: none;
    outline: none;
    transition: all 0.2s ease 0s;
    -moz-transition: all 0.2s ease 0s;
    -webkit-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
}
/* 行動版面: 480px 以下。 */
@media only screen and (max-width: 480px) {
.parallax_bg {overflow: hidden;position: relative;height: 41%;}
.parallax {position: relative;margin-top:25px;}
.main-title{position:absolute;z-index:3;width:80%;top:50%; padding-left:10%; padding-right:10%;color:#fff;}
.main-title h3{font-size:32px; margin-bottom:26px; font-family:"Courier New"}
.main-title h4{font-size:16px;line-height:26px; letter-spacing:2px}
}

/* 表格版面: 481px 到 767px。樣式繼承自: 行動版面。 */
@media only screen and (min-width: 481px) {
.parallax_bg {overflow: hidden;position: relative;height: 100%;}
.parallax {position: relative;}
.main-title{position:absolute;z-index:3;width:350px;top:50%; padding-left:15%;padding-right:0;color:#fff;}
.main-title h3{font-size:40px; margin-bottom:26px; font-family:"Courier New"}
.main-title h4{font-size:16px;line-height:28px; letter-spacing:2px}
}

/* 表格版面: 768px 到 980px。樣式繼承自: 行動版面。 */
@media only screen and (min-width: 768px) {
.parallax_bg {overflow: hidden;position: relative;height: 45%;}
.parallax {position: relative;}
.main-title{position:absolute;z-index:3;width:350px;top:50%; padding-left:15%;padding-right:0;color:#fff;}
.main-title h3{font-size:40px; margin-bottom:26px; font-family:"Courier New"}
.main-title h4{font-size:16px;line-height:28px; letter-spacing:2px}
}

/* 表格版面: 981px 到 1280px。樣式繼承自: 行動版面。 */
@media only screen and (min-width: 981px) {
.parallax_bg {overflow: hidden;position: relative;height: 75%;}
.parallax {position: relative;}
.main-title{position:absolute;z-index:3;width:350px;top:50%; padding-left:15%;padding-right:0;color:#fff;}
.main-title h3{font-size:40px; margin-bottom:26px; font-family:"Courier New"}
.main-title h4{font-size:16px;line-height:28px; letter-spacing:2px}
}

/* 桌面版面: 1281px 到最大 1824px。樣式繼承自: 行動版面和表格版面。 */
@media only screen and (min-width: 1281px) {
.parallax_bg {overflow: hidden;position: relative;height: 69%;}
.parallax {position: relative;margin-top:-270px;}
.main-title{position:absolute;z-index:3;width:350px;top:65%; padding-left:15%;padding-right:0;color:#fff;}
.main-title h3{font-size:40px; margin-bottom:26px; font-family:"Courier New"}
.main-title h4{font-size:16px;line-height:28px; letter-spacing:2px}
}

.column-block {float: left;margin-left: 5%; margin-bottom: 0;}
.one-col.column-block {margin-left: 0px;float: none;}
.column-block *:last-child { margin-bottom: 0 !important;}
.be-last-child {margin-bottom: 0 !important;}
.be-row .column-block:first-child{margin-left: 0;}
.be-section .be-row:last-child .column-block {margin-bottom: 0;}
.full-screen-gutter  {margin-right: 5px;}
.full-screen-gutter .element .element-inner{margin-left: 5px;}
.full-screen-gutter .element {margin-bottom: 5px;}
.element img {width: 100%;}
.element-inner {overflow: hidden;}
.element img {-webkit-transition: all 0.8s ease;-moz-transition: all 0.8s ease;-o-transition: all 0.8s ease;transition: all 0.8s ease;}
.element:hover img {-webkit-transform: scale(1.2);-moz-transform: scale(1.2);-ms-transform: scale(1.2);-o-transform: scale(1.2);transform: scale(1.2);}
.portfolio{margin-bottom: 0;overflow: hidden;}
.portfolio-container {width: 100%;overflow: hidden;}
.portfolio-container .element:last-child,
.full-screen.full-screen-gutter .portfolio-container .element {margin-bottom: 5px !important;}
.full-screen .portfolio-container .element {margin-bottom: 0px !important;}
.portfolio-content{ margin-bottom: 20px; }
.element .be-button, .element img {margin-bottom: 0;}
.element .be-row, .portfolio.one-col .element{margin-bottom: 0;}
.thumb-wrap {display: block;}
.thumb-wrap, .thumb-bg{position: relative;}
.thumb-overlay {position: absolute;overflow: hidden;width: 95%;height: 95%;top:2.5%;left:2.5%;display: none;-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;box-sizing: border-box;padding: 0px;}
.thumb-bg {width: 100%;height: 100%;display: table;}
.thumb-title {text-align: center;display: table-cell;vertical-align: middle;font-size: 16px;color: #fff;}
.thumb-titles {font-family:"微軟正黑體","Microsoft JhengHei","Arial", "Helvetica", "sans-serif"; font-size:12px; color: #ffffff; margin-top:30px;}
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: bottom;}

/* 行動版面: 480px 以下。 */
@media only screen and (max-width: 480px) {
.be-section{ background-color:#f7f7f7}
.be-section-pad {padding: 40px 1% 50px 1%;}
.full-screen.five-col .element {width: 100%;}

/* content */
.caseall{width:96%; padding:0 2% 0 2%; margin:0 0 25px 0; text-align:center;}
.caseall ul { margin:0; padding:0; list-style:none;} 
.caseall li {margin:0; padding:0;display: inline;text-align:center} 
.caseall a {padding:2px 10px 2px 10px;font-size:16px;color: #888;text-decoration:none}
.caseall a:hover {color: #22658c;text-decoration: none}
.whitea a {color: #000; margin:0 10px; padding:2px 0;text-decoration:none}
.whitea a:hover {color: #22658c;text-decoration: none}

}

/* 表格版面: 481px 到 767px。樣式繼承自: 行動版面。 */
@media only screen and (min-width: 481px) {
.be-section{ background-color:#f7f7f7}
.be-section-pad {padding: 50px 1% 50px 1%;}
.full-screen.five-col .element {width: 50%;}

/* content */
.caseall{width:90%; padding:0 5%; margin:0 0 40px 0; text-align:center;}
.caseall ul { margin:0; padding:0; list-style:none;} 
.caseall li {margin:0; padding:0;display: inline;text-align:center} 
.caseall a {padding:2px 30px 2px 30px;font-size:18px;color: #888;text-decoration:none}
.caseall a:hover {color: #22658c;text-decoration: none}
.whitea a {color: #000; margin:0 30px; padding:2px 2px; text-decoration:none;}
.whitea a:hover {color: #22658c;text-decoration: none}

}

/* 表格版面: 768px 到 980px。樣式繼承自: 行動版面。 */
@media only screen and (min-width: 768px) {
.be-section{ background-color:#f7f7f7}
.be-section-pad {padding: 70px 0.5% 70px 0.5%;}
.full-screen.five-col .element {width: 33.333%;}

/* content */
.caseall{width:90%; padding:0 5%; margin:0 0 50px 0; text-align:center;}
.caseall ul { margin:0; padding:0; list-style:none;} 
.caseall li {margin:0; padding:0;display: inline;text-align:center} 
.caseall a {padding:2px 30px 2px 30px;font-size:18px;color: #888;text-decoration:none}
.caseall a:hover {color: #22658c;text-decoration: none}
.whitea a {color: #000; margin:0 30px; padding:2px 2px; text-decoration:none;}
.whitea a:hover {color: #22658c;text-decoration: none}

}  

/* 表格版面: 981px 到 1280px。樣式繼承自: 行動版面。 */
@media only screen and (min-width: 981px) {
.be-section{ background-color:#f7f7f7}
.be-section-pad {padding: 100px 1% 100px 1%;}
.full-screen.five-col .element {width: 20%;}  

/* content */
.caseall{width:90%; padding:0 5%; margin:0 0 60px 0; text-align:center;}
.caseall ul { margin:0; padding:0; list-style:none;} 
.caseall li {margin:0; padding:0;display: inline;text-align:center} 
.caseall a {padding:2px 30px 2px 30px;font-size:18px;color: #888;text-decoration:none}
.caseall a:hover {color: #22658c;text-decoration: none}
.whitea a {color: #000; margin:0 30px; padding:2px 2px; text-decoration:none;}
.whitea a:hover {color: #22658c;text-decoration: none}

}

/* 桌面版面: 1281px 到最大 1824px。樣式繼承自: 行動版面和表格版面。 */
@media only screen and (min-width: 1281px) {
.be-section{ background-color:#f7f7f7}
.be-section-pad {padding: 110px 1% 110px 1%;}
.full-screen.five-col .element {width: 20%;} 

/* content */
.caseall{width:90%; padding:0 5%; margin:0 0 60px 0; text-align:center;}
.caseall ul { margin:0; padding:0; list-style:none;} 
.caseall li {margin:0; padding:0;display: inline;text-align:center; } 
.caseall a {padding:2px 30px 2px 30px;font-size:18px;color: #888;text-decoration:none}
.caseall a:hover {color: #22658c;text-decoration: none}
.whitea a {color: #000; margin:0 30px; padding:2px 2px; text-decoration:none;}
.whitea a:hover {color: #22658c;text-decoration: none}

}