@import url(../fonts/font-awesome/font-awesome.min.css);
@import url(../fonts/flaticon/flaticon.css);
@import url(page_header.css);
@import url(page_footer.css);
@import url(page_banner.css);
/*@import url(page_navsub.css);*/

video::-internal-media-controls-download-button { 
display:none; 
}

video::-webkit-media-controls-enclosure { 
overflow:hidden; 
}

video::-webkit-media-controls-panel { 
width: calc(100% + 30px); 
}

/*========================================================
                      	 h1 設定
=========================================================*/

.h1-title {
	background-color: #fff;
	color: #887248;
	font-size: 24px;
	border-bottom: 5px solid #a97627;
	padding: 15px 0;
	text-align: center;	
}


/*========================================================
                      	 內頁框架
=========================================================*/

.content {
}
.content-box {
	border-top: 1px solid #a3b7c4;
	padding-top: 30px;
	padding-bottom: 30px;
}
.content-box-no {
	border-top: 1px solid #a3b7c4;
	padding-top: 0;
	padding-bottom: 0;
}

/* 麵包屑 */
.breadcrumbs {
	text-align: right;
	color: #000000;
}
.breadcrumbs a {
	display: inline-block;
	color: #6c6c6a;
	padding: 15px 0 15px 0;
}
.breadcrumbs a.home {
	font-weight: bold;
}
.breadcrumbs span {
	margin: 0 2px 0 4px;
	color: #333;
	font-size: 100%;
	font-weight: bold;
}

/* scroll */
.scroll-banner {
    width: 100%;
    position: absolute;
    bottom: 30px;
    z-index: 99;
    cursor: pointer;
/*
	animation:mymove 2s infinite;
	-webkit-animation:mymove 2s infinite;
*/
}
.scroll-banner img {
    display: block;
    margin: 0 auto;
}
/*
@keyframes mmymove {
	from {bottom:30px;}
	to {bottom:10px;}
}
@-webkit-keyframes mymove {
	from {bottom:30px;}
	to {bottom:10px;}
}
*/

/*========================================================
                   		關於我們
=========================================================*/

.about-list {
	border-bottom: 50px solid #dfdfdf;
}
.about-list .container {
	position: relative;
	z-index: 999;
	margin-top: 0;
	padding-bottom: 5%;
	line-height: 32px;
}
.about-list .container h1 {
	font-size: 30px;
	color: #375176;
	margin-bottom: 20px;
	font-weight: bold;
}
.about-list .container p {
	font-size: 18px;
}

/* 尺寸設定 */
@media (min-width: 768px) {
	.about-list .container {
		margin-top: -20px;
		line-height: 40px;
	}
	.about-list .container h1 {
		font-size: 36px;
		margin-bottom: 40px;
	}
	.about-list .container p {
		font-size: 20px;
	}
}
@media (min-width: 992px) {
	.about-list .container p {
		font-size: 22px;
	}
	
}
@media (min-width: 1200px) {
	.about-list .container {
		margin-top: -60px;
	}
	.about-list .container h1 {
		margin-bottom: 60px;
	}
	.about-list .container p {
		font-size: 24px;
	}
}



/*========================================================
                   		服務項目
=========================================================*/

.service-list {
	background-color: #c5d6db;
}
.service-wrap {
	margin-top: 30px;
	
}
.service-wrap h2 {
	display: inline-block;
	background-color: #b23c85;
	color: #fff;
	padding: 10px 20px;
	margin: 0;
	width: 100%;
	text-align: center;
}
.service-wrap:nth-of-type(1) h2 {
	background-color: #b23c85;
}
.service-wrap:nth-of-type(2) h2 {
	background-color: #53a851;
}
.service-wrap:nth-of-type(3) h2 {
	background-color: #99a239;
}
.service-wrap:nth-of-type(4) h2 {
	background-color: #ac5932;
}
.service-wrap:nth-of-type(5) h2 {
	background-color: #6333ac;
}
.service-wrap:nth-of-type(6) h2 {
	background-color: #33ac9c;
}

/* 目錄頁設定 */
.service-minimal {
	position: relative;
	overflow: hidden;
	background: #fff;
	-webkit-box-shadow: 2px 0px 5px 0px rgba(65, 65, 65, 0.12);
	box-shadow: 2px 0px 5px 0px rgba(65, 65, 65, 0.12);
	margin-bottom: 50px;
	text-align: left;
	font-size: 20px;
	line-height: 36px;
}
.service-minimal .service-body {
	padding: 20px;
}




/* 尺寸設定 */
@media (max-width: 767px) {
	.service-minimal {
		display: inline-block;
		width: 100%;
		max-width: 600px;
	}
	.service-minimal .service-image img {
		width: 100%;
		vertical-align: bottom;
	}
}

@media (min-width: 768px) {
	.service-wrap h2 {
		width: 80%;
		text-align: right;
	}
	
	.service-minimal {
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: row;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-flex-wrap: nowrap;
		-ms-flex-wrap: nowrap;
		flex-wrap: nowrap;
		-webkit-align-items: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-justify-content: center;
		-ms-flex-pack: center;
		justify-content: center;
		border-right: 5px solid #b23c85;
	}
	
	.service-wrap:nth-of-type(1) .service-minimal {
		border-color: #b23c85;
	}
	.service-wrap:nth-of-type(2) .service-minimal {
		border-color: #53a851;
	}
	.service-wrap:nth-of-type(3) .service-minimal {
		border-color: #99a239;
	}
	.service-wrap:nth-of-type(4) .service-minimal {
		border-color: #ac5932;
	}
	.service-wrap:nth-of-type(5) .service-minimal {
		border-color: #6333ac;
	}
	.service-wrap:nth-of-type(6) .service-minimal {
		border-color: #33ac9c;
	}
	
	
	.service-minimal .service-left {
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: column;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-align-items: stretch;
		-ms-flex-align: stretch;
		align-items: stretch;
		-webkit-flex-shrink: 0;
		-ms-flex-negative: 0;
		flex-shrink: 0;
		-webkit-align-self: stretch;
		-ms-flex-item-align: stretch;
		align-self: stretch;
		width: 220px;
	}
	.service-minimal .service-image {
		position: relative;
		-webkit-flex-shrink: 0;
		-ms-flex-negative: 0;
		flex-shrink: 0;
		-webkit-align-self: stretch;
		-ms-flex-item-align: stretch;
		-ms-grid-row-align: stretch;
		align-self: stretch;
		-webkit-flex-grow: 1;
		-ms-flex-positive: 1;
		flex-grow: 1;
		overflow: hidden;
	}
	.service-minimal .service-image img {
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		height: auto;
		width: auto;
		min-height: 100%;
		min-width: 100%;
		z-index: 1;
	}
	.service-minimal .service-body {
		padding: 30px 24px 30px 27px;
		-webkit-flex-grow: 1;
		-ms-flex-positive: 1;
		flex-grow: 1;
	}
}
@media (min-width: 992px) {
	.service-wrap h2 {
		width: 60%;
	}
	.service-minimal .service-left {
		width: 320px;
	}
}
@media (min-width: 1200px) {
	.service-wrap h2 {
		width: 50%;
	}
	.service-minimal {
		border-right: 20px solid #b23c85;
	}
	.service-minimal .service-left {
		width: 520px;
	}
	.service-minimal .service-body {
		padding: 60px 26px 60px 50px;
	}
}


/*========================================================
                         優勢能力
=========================================================*/

.ability-1, .ability-2, .ability-3, .ability-4 {
	padding: 40px 20px;
	line-height: 32px;
	background-size: 100% auto;
}
.ability-1 h2, .ability-2 h2, .ability-3 h2, .ability-4 h2 {
	font-size: 26px;
	margin-bottom: 20px;
}

.ability-1 {
	background: url(../images/ability_pic1.jpg) no-repeat center center;
}
.ability-2 {
	background: url(../images/ability_pic2.jpg) no-repeat center center;
}
.ability-3 {
	background: url(../images/ability_pic3.jpg) no-repeat center center;
}
.ability-4 {
	background: url(../images/ability_pic4.jpg) no-repeat center center;
}


@media (min-width: 768px) {
	.ability-1, .ability-2, .ability-3, .ability-4 {
		padding: 60px;
	}
}
@media (min-width: 992px) {
	.ability-1, .ability-2, .ability-3, .ability-4 {
		padding: 80px 60px;
	}
}

@media (min-width: 1600px) {
	.ability-1, .ability-2, .ability-3, .ability-4 {
		padding: 100px 60px;
	}
}

/*========================================================
                   訊息公告 & 知識新聞
=========================================================*/

.news-list {
	background-color: #dbd0c5;
}
.news-post {
	text-align: center;
}
.news-post h1 {
	color: #9c6d4b;
	font-weight: bold;
	margin-bottom: 30px;
}
.news-post .post-minimal:nth-of-type(2n+1) .post-body h2 a {
	background-color: #821c77;
}
.news-post .post-minimal:nth-of-type(2n+2) .post-body h2 a {
	background-color: #22609b;;
}



.know-list {
	background-color: #c5d4db;
}
.know-post {
	text-align: center;
}
.know-post h1 {
	color: #164875;
	font-weight: bold;
	margin-bottom: 30px;
}
.know-post .post-minimal:nth-of-type(2n+1) .post-body h2 a {
	background-color: #4c8619;
}
.know-post .post-minimal:nth-of-type(2n+2) .post-body h2 a {
	background-color: #22609b;;
}



/* 目錄頁設定 */
.post-minimal {
	position: relative;
	border-radius: 4px;
	overflow: hidden;
	background: #fff;
	-webkit-box-shadow: 2px 0px 5px 0px rgba(65, 65, 65, 0.12);
	box-shadow: 2px 0px 5px 0px rgba(65, 65, 65, 0.12);
	margin-bottom: 30px;
	text-align: left;
}
.post-minimal .post-body {
	padding: 20px;
}
.post-minimal * + .post-text {
	margin-top: 8px;
}
.post-minimal * + .post-meta {
	margin-top: 5px;
}
.post-minimal * + .post-meta i {
	color: #6bcad2;
}
.post-minimal .post-body h2 {
	margin: 0 0 14px 0;
}
.post-minimal .post-body h2 a {
	display: inline-block;
	font-size: 20px;
	padding: 5px 10px;
	color: #fff;
}



/* 尺寸設定 */
@media (max-width: 639px) {
	.post-minimal {
		display: inline-block;
		width: 100%;
		max-width: 500px;
	}
	.post-minimal .post-image img {
		width: 100%;
		vertical-align: bottom;
	}
}

@media (min-width: 640px) {
	.post-minimal {
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: row;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-flex-wrap: nowrap;
		-ms-flex-wrap: nowrap;
		flex-wrap: nowrap;
		-webkit-align-items: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-justify-content: center;
		-ms-flex-pack: center;
		justify-content: center;
	}
	.post-minimal .post-left {
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: column;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-align-items: stretch;
		-ms-flex-align: stretch;
		align-items: stretch;
		-webkit-flex-shrink: 0;
		-ms-flex-negative: 0;
		flex-shrink: 0;
		-webkit-align-self: stretch;
		-ms-flex-item-align: stretch;
		align-self: stretch;
		width: 320px;
	}
	.post-minimal .post-image {
		position: relative;
		-webkit-flex-shrink: 0;
		-ms-flex-negative: 0;
		flex-shrink: 0;
		-webkit-align-self: stretch;
		-ms-flex-item-align: stretch;
		-ms-grid-row-align: stretch;
		align-self: stretch;
		-webkit-flex-grow: 1;
		-ms-flex-positive: 1;
		flex-grow: 1;
		overflow: hidden;
	}
	.post-minimal .post-image img {
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		height: auto;
		width: auto;
		min-height: 100%;
		min-width: 100%;
		z-index: 1;
	}
	.post-minimal .post-body {
		padding: 30px 24px 30px 27px;
		-webkit-flex-grow: 1;
		-ms-flex-positive: 1;
		flex-grow: 1;
	}
}

@media (min-width: 1200px) {
	.post-minimal .post-body {
		padding: 40px 26px 40px 50px;
	}
}



/* 最新消息內頁 */	

.news-box {
	margin-bottom: 30px;
	text-align: left;
}
.news-header h3 {
	display: block;
	color: #745b11;
	-webkit-transition: 0.3s;
	transition: 0.3s;
	padding-bottom: 20px;
	margin-top: 0;
	margin-bottom: 20px;
	border-bottom: 1px solid #dedede;
}
.news-header time {
	display: block;
	position: relative;
	color: #C00;
	margin-top: 0;
	margin-bottom: 0;
	font-weight: normal;
	font-size: 15px;
}
.news-content {
	}
.news-content img {
	max-width: 100%;
	vertical-align: bottom;
	display: block;
	margin: 0 auto 20px;
	}

/*回目錄頁*/
.news-post .back, .know-post .back {
	text-align: right;
	padding-top: 30px;
}
.news-post .back a, .know-post .back a {
	background-color: #396ecb;
	padding: 5px 20px 7px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	color: #fff;
	font-size: 15px;
}
.news-post .back a:hover, .know-post .back a:hover {
	-moz-transition: -moz-transform 0.3s;
	-o-transition: -o-transform 0.3s;
	-webkit-transition: -webkit-transform 0.3s;
	transition: transform 0.3s;
	background-color: #136396;
	color: #fff;
	text-decoration: none;
}


.news-post .back {
	border-top: 2px dashed #b1947e;
}
.know-post .back {
	border-top: 2px dashed #396ecb;
}
.news-post .back a {
	background-color: #b1947e;
}
.know-post .back a {
	background-color: #396ecb;
}


/*========================================================
                         實績作品
=========================================================*/

.work-1 h1, .work-2 h1, .work-3 h1 {
	color: #2b6b9a;
	font-weight: bold;
	margin-bottom: 30px;
	text-align: center;
}

.work-1 h2 {
	background-color: #077ac7;
	color: #fff;
	padding: 10px 15px;
	font-size: 24px;
}
.work-1 ul [class *= col-] {
	margin-bottom: 10px;
	padding-left: 0;
	padding-right: 0;
}
.work-1 ul {
	max-width: 1600px;
	list-style: none;
	margin: 50px 0;
	padding: 0;
}
.work-1 li {
	display: -moz-inline-stack;
	display: inline-block;
	*display: inline;
	zoom: 1;
	vertical-align: top;
	width: 100%;
	margin: 0 0 30px 0;
}
.work-1 li a {
	outline: none;
	border: none;
	display: block;
	color: #333;
}
.work-1 li time {
	font-size: 13px;
	color: #999993;
}
.work-1 li a .pic {
	position: relative;
}
.work-1 li a .pic img {
	width: 100%;
	vertical-align: bottom;
}
.work-1 li a .pic:hover:before {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}
.work-1 li a .pic:before {
    position: absolute;
    top: 6px;
    bottom: 6px;
    left: 6px;
    right: 6px;
    content: '';
    display: inline-block;
	background: url(../images/link-symbol.png) no-repeat center center;
	background-color: rgba(38,129,184,0.1);
    opacity: 0;
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    transition: .3s;
}
.work-1 li a .pic:after {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 5;
	content: "";
	width: 100%;
	height: 100%;
	border: 3px solid #fff;
}
.work-1 li p {
	margin: 5px 0 0 0;
    text-align: left;
}
.work-1 li p a {

}
.work-1 li p.link {
	font-size: 13px;
	color: #999993;
}


/* 手機選單 */
.navsub-mobile-btn {
	list-style: none;
	margin: 0;
	padding: 0;
}
.navsub-mobile-btn li {
	display: -moz-inline-stack;
	display: inline-block;
	*display: inline;
	zoom: 1;
	vertical-align: top;
	text-align: center;
	width: 100%;
}
.navsub-mobile-btn li a {
	display: block;
	background-color: rgba(85,85,85, 0.65);
	color: #fff;
	margin-bottom: 10px;
	padding: 5px 20px;
}
.navsub-mobile-btn li a:hover {
	background-color: rgba(43,171,167, 1);
}


/* 品牌商品-內頁 */

.work-detail {
}
.work-detail h2 {
    background-color: #077ac7;
    text-align: center;
    color: #fff;
    padding: 10px 0;
    margin: 20px 15px 40px 15px;
}
.work-detail img {
	width: 100%;
	vertical-align: bottom;
	border: 1px solid #bdbdbd;
	margin-bottom: 30px;
}
.work-detail ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.work-detail ul li b {
	display: block;
	background-color: #CAE9FF;
	background-image: -webkit-gradient(linear, 0 0, 100% 100%,color-stop(.25, #E7F8FC), color-stop(.25, transparent),color-stop(.5, transparent), color-stop(.5, #E7F8FC),color-stop(.75, #E7F8FC), color-stop(.75, transparent),to(transparent));
	-webkit-background-size: 7px 7px;
	padding: 5px 10px;
	margin: 20px 0 10px 0;
}
.work-detail ul li:first-of-type b {
	margin: 0 0 10px 0;
}
.work-detail ul li span {
	display: inline-block;
	border: 1px dashed #adadad;
	margin: 0 5px;
	padding: 3px 10px;
}

.work-info {
    clear: both;
    text-align: left;
    border: 2px dashed #81b8df;
    padding: 20px 30px;
	background-color: #fff;
	background-image: -webkit-gradient(linear, 0 0, 100% 100%,color-stop(.25, #e1f1fc), color-stop(.25, transparent),color-stop(.5, transparent), color-stop(.5, #e1f1fc),color-stop(.75, #e1f1fc), color-stop(.75, transparent),to(transparent));
	-webkit-background-size: 14px 14px;
    margin-top: 20px;
	margin-bottom: 30px;
}


/*-----分頁-------*/

.video_block {
    background: url(../../images/video-text.png) no-repeat center bottom;
    background-size: 100% auto;
	width: 100%;
	height: auto;
	text-align: left;
	margin: 0;
	padding: 0;
	display: none;
	color: #fff;
	padding-top: 7%;
	position: relative;
}
.video_block h1 {
	font-size: 36px;
	margin-bottom: 3%;
}
.video_block p {
	background-color: rgba(0,0,0,0.2);
	margin-bottom: 7%;
	line-height: 24px;
	padding: 20px 30px;
	color: #fff;
}

.video_block p a {
	color: #fff;
	text-decoration: underline;
}
.video_block p a:hover {
	text-decoration: none;
}
.video_bottom {
	text-align: center;
/*
	position: absolute;
	right: 5%;
	top: 500px;
	z-index: 999;
*/
}
.video_view {
	margin: 0 4px 10px;
	display: inline-block;
	-webkit-transition: opacity 0.3s;
	transition: opacity 0.3s;
}
.video_view a {
	display: inline-block;
	background-color: rgba(12,26,43,0.73);
	border: 1px solid #fff;
	padding: 10px 20px;
	color: #fff;
}

.video_view a:hover {
	background-color: rgba(12,26,43,1);
}
.video_view_unactive {
	opacity: 0.4
}
.video_view_unactive:hover {
	opacity: 1
}
.video_bottom .video_view a.active {
	background-color: rgba(12,26,43,1);
	text-decoration: none;

}
/* 手機用圖 */
.mobile-block {
	margin-top: -120px;
	margin-bottom: 40px;
}
.mobile-block h1 {
	color: #696969;
	border-bottom: 1px solid #979797;
	font-size: 36px;
	text-align: left;
	padding-bottom: 10px;
	position: relative;
}
.mobile-block h2 {
	color: #696969;
	font-size: 24px;
	text-align: right;
	margin-bottom: 20px;
}
.mobile-block img {
	width: 100%;
	vertical-align: bottom;
}

@media (min-width:768px) {
	.video_block {
		height: 720px;
		display: block;
	}
	.video_block h1 {
		font-size: 48px;
	}
	.video_block p {
		font-size: 20px;
		line-height: 32px;
	}
	.video_bottom {
		top: 620px;
	}
	.mobile-block {
		display: none;
	}
}
@media (min-width: 1600px) {
	.video_block h1 {
		font-size: 60px;
	}
}



/* ======== 平面設計 ======== */

.work-2 ul [class *= col-] {
	margin-bottom: 10px;
	padding-right: 15px;
    padding-left: 15px;
}
.work-2 ul {
	max-width: 1600px;
	list-style: none;
	margin: 30px auto;
	padding: 0;
}
.work-2 li.shown,
.no-js .work-2 li,
.no-cssanimations .work-2 li {
	opacity: 1;
}
.work-2 li a {
	outline: none;
	border: none;
	display: block;
}
.work-2 li img {
	width: 100%;
	vertical-align: bottom;
	border: 1px solid #cdcdcd;
}
.work-2 li .pic {
	position: relative;
}
.work-2 li .pic:hover:before {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}
.work-2 li .pic:before {
    position: absolute;
    top: 6px;
    bottom: 6px;
    left: 6px;
    right: 6px;
    content: '';
    display: inline-block;
	background: url(../images/magnifier.png) no-repeat center center;
	background-color: rgba(255,255,255,0.1);
    opacity: 0;
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    transition: .3s;
}
.work-2 li .pic:after {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 5;
	content: "";
	width: 100%;
	height: 100%;
	border: 3px solid #fff;
}
.work-2 li p {
    text-align: center;
	margin-top: 10px;
	margin-bottom: 20px;
}
.work-2 li p a {
    color: #333;
}



/* ======== VR/AR數位設計 ======== */

.work-3 {
}
.work-3 dl {
	position: relative;
	margin-bottom: 20px;
}

.work-3 dl dt {
}
.work-3 dl dt span {
	display: inline-block;
	margin-bottom: 10px;
}
.work-3 dl dt img {
	width: 100%;
	vertical-align: bottom;
}

.work-3 dl dt .pic {
}
.work-3 dl dt .pic a {
	position: relative;
	display: block;
}
.work-3 dl dt .pic a:hover:before {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}
.work-3 dl dt .pic a:before {
    position: absolute;
    top: 6px;
    bottom: 6px;
    left: 6px;
    right: 6px;
    content: '';
    display: inline-block;
	background: url(../images/youtube.png) no-repeat center center;
	background-color: rgba(255,255,255,0.1);
    opacity: 0;
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    transition: .3s;
}
.work-3 dl dd {
	overflow: hidden;
	line-height: 28px;
}
.work-3 dl dd p {
	color: #333;
}
.work-3 dl dd time {
	position: absolute;
	left: 15px;
	top: 0;
	z-index: 9;
	color: #fff;
	font-size: 15px;
	padding: 14px 10px 10px;
	background-color: #6f94be;
	text-align: center;
}
.work-3 dl dd time span {
	font-size: 36px;
	font-weight: bold;
	display: block;
}



/* ========尺寸設定======== */

@media (min-width: 480px) {	
	.work-1 li {
		width: 47%;
		margin: 0 1% 30px 1%;
	}
}

@media (min-width: 640px) {	
	.navsub-mobile-btn li {
		width: 47%;
		margin-right: 1%;
	}

}

@media (min-width: 768px) {
	.navsub-mobile-btn {
		display: none;
	}
	.work-1 li {
		width: 30.8%;
		margin: 0 1% 30px 1%;
	}
}

@media (min-width: 992px) {

}

@media (min-width: 1200px) {
	.work-1 li {
		width: 22.5%;
		margin: 0 1% 30px 1%;
	}		
}



/*========================================================
                         聯絡我們
=========================================================*/

.contact-list h1 {
	color: #2b6b9a;
	font-weight: bold;
	margin-bottom: 30px;
	text-align: center;
}


.map iframe {
	border: 1px solid #d8d8d8;
	padding: 9px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}
.map address {
	margin: 10px 0 40px 0;
}
.map address ul {
	list-style: none;
	margin: 0;
	padding: 0 1%;
}
.map address ul li {
	padding: 0.7% 0;
}


/*========================================================
                         意見表單
=========================================================*/


.form-horizontal {
	margin-bottom: 40px;
}
.form-horizontal .control-label {
	color: #333;
}
.form-horizontal .form-control {
	border-radius: 5px;
	padding: 5px 20px 5px 50px;
	border: 1px solid #c4c4c4;
	background-color: #fff;
}

.form-info {
	margin-bottom: 20px;
	}

.contact-form {
	margin-bottom: 20px;
}
.contact-form [class *= col-] {
	position: relative;
	padding-left: 15px;
	margin-bottom: 10px;
}
.contact-form [class *= col-] i {
    display: block;
    font-size: 16px;
    color: #c4c4c4;
    width: 40px;
    line-height: 32px;
    text-align: center;
    border: 1px solid #c4c4c4;
    background-color: #fff;
    position: absolute;
    left: 15px;
    top: 0px;
    border-radius: 5px;
    transition: all 0.4s ease;
}


.form_out {
}
.form_out  [class *= col-] {
	padding: 0;
}
.form_out .col-md-2 {
	text-align: left;
	font-weight: bold;
}
.form-group {
	padding: 10px 15px;
	margin-bottom: 0;
}
.form-group:nth-of-type(2n+2) {
	background-color: #f9f9f9;
}
/*.form-group:nth-of-type(2n+1) {
	background-color: #e8e8e8;
}*/
.form-group b {
	display: block;
	font-size: 15px;
}
.input {
	text-decoration: none;
	border: 1px solid #c7c7c7;
	width: 100%;
	height: 28px;
	padding: 5px 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.form-info span{
	color: #CF0B0E;
}
.red_from{
	color: #CF0B0E!important;
}

.ohno {
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
	height: 0;
	width: 0;
	z-index: -1;
}


/*========================================================
                           表格
=========================================================*/

.table1 {
	border-collapse: collapse;
	text-align: center;	
	margin: 0 0 20px 0;
}
.table1 caption {
	color: #333;
	font-weight: bold;
}

.table1 th {
	background: #a97627;
	color: #fff;
	font-weight: bold;
	padding: 10px 5px;
	text-align: center;	
}
.table1 td {
	padding: 0 5px;
}

.table1 td:last-child{
	border-right: none;
}
.table1 a.file {
	display: inline-block;
	margin-top: 4px;
	width: 24px;
	height: 24px;
	background: url(../images/file_pdf.png) no-repeat center center;
	text-indent: -9999px;
	}
.table1 td.img img {
	width: 80px;
	}
	

/*========================================================
                         圖片效果
=========================================================*/

.cover-pic {
	background: transparent;
	position: absolute;
	top: 7px;
	right: 7px;
	bottom: 7px;
	left: 7px;
	z-index: 20;
	cursor: pointer;
}
.cover-pic:hover {
	background-color: rgba(237,200,41,0.3);
	color: #fff;
	opacity: 1;
}
.cover-pic:hover:before {
	display: inline-block;
	content: '\f10f';
	font-family: "Flaticon";
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 99;
	font-size: 2.5em;
	-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
			transform: translate(-50%, -50%); 
}
.cover-youtube:hover:before {
	content: '\f11d';
}
.cover-zoom:hover:before {
	content: '\f10d';
}	

a.figure {
	display: block;
	position: relative;
	}

a.figure:hover:before {
    opacity: 0.3;
    -webkit-transform: scale(1);
    transform: scale(1);
}
a.figure:before {
    position: absolute;
    top: 6px;
    bottom: 6px;
    left: 6px;
    right: 6px;
    content: '';
    display: inline-block;
    background-color: #fff;
    opacity: 0;
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    transition: .3s;
}