@charset "utf-8";

/* initial setting */
*{margin:0; padding:0; box-sizing:border-box; font-family:"微軟正黑體", 新細明體, Verdana, sans-serif; text-decoration:none; color:#000; line-height:150%;}

html{font-size:62.5%;}
body{font-size:14px; font-size:1.4rem; height:100%;}

ul, ol, li{list-style:none;}
a{text-decoration:none; color:#000;}
img{max-width:100%; height:auto;}
table {border-collapse:collapse; border-spacing:0;}



/* shared css */
.clear{clear:both}
.oh{overflow:hidden;}
.po-a{position:absolute;}
.po-r{position:relative;}
.mar-au{margin:0 auto;}
.mar-b30{margin-bottom:30px;}
.mar-t1{margin:158px auto 150px auto;}



.blk-100{width:100%;}
.blk-1200{width:100%; max-width:1200px;}
.blk-1680{width:100%; max-width:1680px;}
.blk-1920{width:100%; max-width:1920px;}



/* video in chrome show no download button  */
video::-internal-media-controls-download-button{display:none;}
video::-webkit-media-controls-enclosure{overflow:hidden;}
video::-webkit-media-controls-panel{width:calc(100% + 30px);}



/* main css */
#container{margin:0 auto;}

/* header */
.top-content{margin:0 auto; width:100%; z-index:100;}

	.tM-blk{position:fixed; top:0; left:0; right:0; margin:auto; padding:10px 20px; height:158px; line-height:158px; background-color:rgba(255,255,255,0.7); font-size:0; z-index:10; text-align:right; z-index:110;}
		
		.logo-blk{position:absolute; top:0; bottom:0; margin-top:auto; margin-bottom:auto; height:124px; z-index:120;}
			.logo{display:block; width:180px;}
			.logo img{display:block; width:100%;}
		
		.tMenu{display:inline-block; vertical-align:middle; margin-top:-10px;}

			
			.t-n-blk{position:relative; display:inline-block; margin:10px auto; width:100%; vertical-align:middle; overflow:hidden; font-size:0;}

				.t-time{display:inline-block; width:100%; padding:2px 20px; text-align:right;}
				.t-time > p{display:inline-block; color:#000; letter-spacing:1px; font-size:15px; vertical-align:middle; font-weight:normal;}
			
				.t-search{display:inline-block; width:50%; padding:2px 20px; text-align:center;}
					.input-box{display:inline-block; width:100%; padding:4px 12px; vertical-align:middle; font-size:0; background:#ededed; border:#ccc 1px solid; border-radius:30px;}
					.input-area{display:inline-block; width:calc(100% - 20px); font-size:14px; line-height:20px; border:none; outline:none; background:transparent; color:#999; vertical-align:middle;}
					.input-btn{display:inline-block; width:20px; height:20px; font-size:14px; color:#999; border:none; outline:none; background:url(../img/icon_search.png); background-repeat:no-repeat; background-position:center center; background-size:contain; vertical-align:middle; cursor:pointer;}
	
				.t-info{display:inline-block; width:50%; padding:2px 20px; text-align:right;}
				.t-info > img{display:inline-block; width:30px; vertical-align:middle; margin-right:6px;}
				.t-info > span{display:inline-block; color:#bf0d23; letter-spacing:1px; font-size:18px; vertical-align:middle;}



			
			
			
			.t-menu{display:block; font-size:0; padding:0 40px; background:#bf0d23; border-radius:30px;}
			.t-menu > li{display:inline-block; margin:0 4px 0 0; font-size:16px; font-weight:bold;}
			.t-menu > li > a{display:block; padding:2px 14px; line-height:36px; color:#fff;}
			.t-menu > li:hover, .t-menu > li.onit{background:#000;}
		
		.m-menu{display:none; vertical-align:middle;}
			.m-menu-pic{display:block; width:36px;}
			.m-menu-pic img{width:100%;}
			
			.m-menu-pic-s{display:none;}
			.m-menu-pic-s{width:100%; text-align:center; background:#bf0d23; line-height:40px;}
			.m-menu-pic-s > p{display:inline-block; vertical-align:middle; color:#fff; font-size:18px; letter-spacing:1px; font-weight:bold;}
			.m-menu-pic-s > .mmps {display:inline-block; vertical-align:middle; width:28px; margin-left:4px;}



/* iNtro */
.iNtro{padding:20px 10px; width:100%; font-size:0; display:flex; flex-wrap:wrap;}

	.iTxt{display:block; margin:10px auto 50px auto; width:76%; text-align:center;}
	.iTxt > h2{padding:8px 0; font-size:32px; color:#bf0d23; letter-spacing:2px; font-family:"Arial", sans-serif, 微軟正黑體; font-weight:bold;}
	.iTxt > h3{padding:8px 0; font-size:20px; color:#000; letter-spacing:1px; font-weight:normal;}
	
	.iPic{position:relative; display:inline-block; margin:10px 1%; padding:10px 0; padding-bottom:100px; width:23%; border:#ccc 1px solid; text-align:center; border-radius:10px; box-shadow:#ccc 2px 2px 5px; z-index:1;}
	.iPic:hover{box-shadow:#999 2px 2px 5px; background:#ededed;}
	.iPic > h2{padding:6px 0 4px 0; font-size:24px; color:#000; letter-spacing:1px; font-weight:bold;}
	.iPic > h3{padding:2px 0; font-size:13px; color:#bf0d23; letter-spacing:1px; font-weight:bold;}
	.iPic > .ipic-pic-blk{position:relative; height:0; padding-bottom:56%; overflow:hidden;}	
	.iPic > .ipic-pic-blk > img{position:absolute; top:0; left:0; right:0; bottom:0; margin:auto; height:100%;}
	.iPic > p{padding:2px 4%; font-size:16px; color:#999; text-align:left; line-height:180%;}

	.iPic .more-blk{position:absolute; bottom:0; left:0; right:0; margin:auto; padding:10px; display:block; text-align:center; z-index:2;}
	.iPic .more-blk .more-btn{display:inline-block; margin-bottom:10px; padding:2px 20px; font-size:16px; font-weight:bold; color:#fff; background:#bf0d23; border-radius:16px;}
	.iPic:hover .more-blk .more-btn{background:#000;}

.iNews{padding:20px 10px; width:100%; font-size:0; display:flex; flex-wrap:wrap;}
	.headPic{display:inline-block; margin:10px 0; width:50%; text-align:center;}
	.headPic .img-blk{position:relative; height:0; padding-bottom:56.25%; overflow:hidden;}
	.headPic .img-blk img{position:absolute; top:0; right:0; bottom:0; left:0; margin:auto; height:100%;}
	
	.headList{display:inline-block; margin:10px 0; width:50%; padding:0 2%; text-align:center;}
	.headList > h3{text-align:left; padding-bottom:20px; color:#bf0d23; font-size:26px; font-weight:bold; letter-spacing:1px;}
	.headList ul{display:block; width:100%;}
	.headList ul li{display:block; width:100%; margin-bottom:16px; text-align:left;}
	.headList ul li a{display:block; padding:10px 2%; width:100%; color:#000; font-size:16px; border:#ccc 1px solid; border-radius:8px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
	.headList ul li a span{margin-right:10px; color:#bf0d23; font-weight:bold; letter-spacing:1px;}


	.headList ul li:hover a{background:#ededed;}
	.headList .more-blk{margin:auto; padding:10px; display:block; text-align:center;}
	.headList .more-blk .more-btn{display:inline-block; margin-bottom:10px; padding:2px 20px; font-size:16px; font-weight:bold; color:#fff; background:#bf0d23; border-radius:16px;}
	.headList .more-blk .more-btn:hover{background:#000;}


.iPromo{padding:20px 10px 72px 10px; width:100%; font-size:0; display:flex; flex-wrap:wrap;}
	
	.iPPic{position:relative; display:inline-block; margin:10px 1%; padding:0; padding-bottom:30px; width:23%; text-align:center; border:#ccc 1px solid; border-radius:10px; box-shadow:#ccc 2px 2px 5px; z-index:1; overflow:hidden;}
	.iPPic:hover{box-shadow:#999 2px 2px 5px;}
	.iPPic > h2{padding:8px 0 6px 0; font-size:22px; color:#fff; letter-spacing:1px; font-weight:bold; background:#bf0d23;}
	
	.iPPic > .ippic-img-blk{position:relative; margin-bottom:20px; height:0; padding-bottom:56%; overflow:hidden;}
	
	.iPPic > .ippic-img-blk > img{position:absolute; top:0; left:0; right:0; bottom:0; margin:auto; /*margin:0 auto 20px auto;*/ height:100%;}
	
	.iPPic > h3{padding:2px 4%; font-size:20px; color:#3a5897; line-height:150%; font-weight:bold; text-align:center;}
	.iPPic > h3 span{font-size:28px; color:#000; /*color:#bf0d23;*/}
	.iPPic > p{padding:2px 4%; line-height:150%; font-size:16px; font-weight:bold; color:#000; /*color:#bf0d23;*/}



.wrapper-sitemap{position:relative; margin:0 auto; width:100%; max-width:1920px; padding:0 0 0 0; background:#000; overflow:hidden;}

	/* SiteMap 內容 */
	.sitemap-area{position:relative; margin:0 auto; padding:16px 1% 60px 1%; width:100%; background:url(../img/footer-bg.jpg) no-repeat top left; overflow:hidden; font-size:0;}
		.map-column{position:relative; display:inline-block; color:#000; font-size:15px; vertical-align:top; overflow:hidden;}
		.map-column:nth-child(1){width:25%;}
		.map-column:nth-child(2){width:25%;}
		.map-column:nth-child(3){width:25%;}
		.map-column:nth-child(4){width:25%;}
		
		.map-column .m-cols{width:100%; padding:5% 10% 5% 10%;}
		.map-column .m-cols > h3{margin:0 auto; padding:10px 4px; font-size:20px; font-weight:bold; text-align:left; color:#fff;}
		.map-column .m-cols .c-info{margin:0 auto; padding:4px; font-size:15px; text-align:left; color:#fff;}
		.map-column .m-cols .c-info a{color:#fff;}

			.pic-txt-blk{display:block; margin-top:10px; padding:4px; width:100%; font-size:0; overflow:hidden;}
			.pic-txt-blk .ptb-pic{float:left; display:inline-block; padding:10px; width:120px; overflow:hidden; vertical-align:middle;}
			.pic-txt-blk .ptb-pic img{display:inline-block; width:100%; vertical-align:middle;}
			/*
			.pic-txt-blk .ptb-txt{display:inline-block; padding:4px; width:calc(100% - 134px); overflow:hidden; font-size:15px; color:#fff; vertical-align:top;}
			.pic-txt-blk .ptb-txt > h4{margin:0 auto; padding:8px 4px; font-size:20px; font-weight:bold; text-align:left; color:#fff;}
			.pic-txt-blk .ptb-txt > p{margin:0 auto; padding:4px; font-size:15px; text-align:left; color:#fff;}
			*/





		.link-container{position:relative; height:0; padding-bottom:80%; overflow:hidden;}
		.link-container iframe,
		.link-container object,
		.link-container embed{position:absolute; top:0; left:0; width:100%; height:100%;}



footer{position:relative; margin:0 auto; padding:10px 10px; width:100%; max-width:1920px; overflow:hidden; text-align:center; background:#bf0d23;}
footer p{font-size:14px; color:#fff;}

#back-to-top {position:fixed; display:block; bottom:50px; right:1%; width:48px; height:48px; line-height:48px; color:#fff; font-size:0; text-decoration:none; text-align:center; background: url(../img/BackToTop-Btn.svg) center center no-repeat #999; z-index:9999; cursor:pointer; transition:opacity 0.2s ease-out; opacity:0; border-radius:50%;}

#back-to-top.show {opacity:0.9;}




/* facebook iframe */

    /*#fb-root {display: none;}*/

    .fb_iframe_widget, .fb_iframe_widget span, .fb_iframe_widget span iframe[style] {
        width: 100% !important;
	}



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

	.iPic{margin:10px 1%; width:31.3%;}
	.iPPic{margin:10px 1%; width:31.3%;}
}

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

	.tM-blk{position:relative; padding:10px 10px; text-align:right; background:rgba(255,255,255,1);}
 
 		.logo-blk{position:absolute; top:0; bottom:0; margin-top:auto; margin-bottom:auto; height:109px;}
			.logo{display:block; width:168px;}
		
		.tMenu{margin-top:0;}


		.t-search{display:block; width:100%; margin:5px 10px 5px auto; padding:2px 12px; text-align:right;}
		.t-info{display:block; width:100%; margin:5px 10px 5px auto; padding:2px 12px; text-align:right;}
		.t-time{display:block; width:100%; margin:5px 10px 5px auto; padding:2px 12px; text-align:right;}




			.t-menu{display:none;}
		
		.m-menu{display:inline-block; vertical-align:middle;}


	.iPic{margin:10px 1%; width:48%;}

	.iPPic{margin:10px 1%; width:48%;}
	
	.sitemap-area{padding-top:10px; height:auto;}

		.map-column{font-size:16px;}
		.map-column:nth-child(1){width:50%;}
		.map-column:nth-child(2){width:50%;}
		.map-column:nth-child(3){width:50%;}
		.map-column:nth-child(4){width:50%;}
		.map-column:nth-child(5){width:50%;}
	
}

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

	.tM-blk{position:relative; padding:10px 0 0 0; background-color:rgba(255,255,255,1); font-size:0; z-index:10; text-align:center; height:auto; line-height:0;}
		
 		.logo-blk{position:relative; display:block; top:0; bottom:0; margin-top:auto; margin-bottom:auto; padding:8px 0; width:100%; height:auto;}
			.logo{display:inline-block; margin:0 auto;}





		.tMenu{display:block; padding:8px 0;}



		.t-search{display:block; width:100%; margin:5px auto; padding:2px 12px; text-align:center;}
		.t-info{display:block; width:100%; margin:5px auto; padding:2px 12px; text-align:center;}
		.t-time{display:block; width:100%; margin:5px auto; padding:2px 12px; text-align:center;}




		
		.m-menu{display:block; padding:8px 0 0 0;}
			.m-menu-pic{display:none;}
			.m-menu-pic-s{display:block;}


	.iTxt{padding:10px; width:90%;}
	.iTxt > h2{text-align:center;}
	.iTxt > h3{text-align:left;}

	.headPic > img{display:inline-block;}

	.headPic{display:block; width:100%; background:none;}
	.headList{display:block; width:100%;}


.iNtro{padding:0 10px 20px 10px;}

	.iTxt > h2{line-height:100%;}

	.iPic{margin:10px 1%; width:98%;}
	.iPic{}
	.iPic > h2{text-align:center; padding:4px 0;}

	.iPPic{margin:10px 1%; width:98%;}

.iInfo .info-blk .info-list li{font-size:13px; line-height:20px; height:36px;}
	.iInfo .info-blk{margin:10px 2%;  width:98%;}
		.map-column{font-size:14px;}
		.map-column:nth-child(1){width:100%;}
		.map-column:nth-child(2){width:100%;}
		.map-column:nth-child(3){width:100%;}
		.map-column:nth-child(4){width:100%;}
		.map-column:nth-child(5){width:100%;}

}

@media screen and (max-width:480px){
	
			.t-time{padding:2px 6px;}
			.t-time > p{letter-spacing:0; font-size:15px;}

			.t-info{padding:2px 6px;}
			.t-info > img{width:24px; margin-right:4px;}
			.t-info > span{letter-spacing:0; font-size:16px;}

}