@charset "UTF-8";
/* CSS Document */
@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css);
@font-face {
  font-family: 'ResHat-B';
  src: url('RedHatDisplay-Black.ttf');
}
@font-face {
  font-family: 'ResHat-M';
  src: url('RedHatDisplay-Medium.ttf');
}

* {font-family: 'Noto Sans TC', "微軟正黑體", "Microsoft JhengHei"; transition:0.2s;}
body{font-size:10px; line-height: 10px; width:100%; overflow-x: hidden !important; margin:0; padding:0; color:#222222;}
h2{font-size:32px !important; line-height: 40px !important; font-weight:900 !important; color:#be0000 !important; text-align: center !important;}
ul{padding:0; margin:0;}
ul li{list-style:none;}
p{font-size:1.8em; line-height:2.2em; margin:20px auto;}
a{text-decoration: none;}
.clear{clear:both;}
.rh-b{font-family:'ResHat-B';}
.rh{font-family:'ResHat-M';}
.mo{display:none;}

.contain-m{width:1100px; margin:0 auto;}
.contain-l{width:1390px; padding:0 50px; margin:0 auto;}

@media (max-width:1490px){
	.contain-l{width:80%; margin:auto; padding:0 10%;}
}
@media (max-width:1100px){
	.contain-m{width:calc(100% - 40px); margin:auto; padding:0 20px;}
	body{font-size:9px; line-height: 9px;}
	h2{font-size:28px !important; line-height: 32px !important;}
}
@media (max-width:768px){
	body{font-size:8.5px; line-height: 8.5px;}
	h2{font-size:24px !important; line-height: 36px !important;}
	p{margin:10px auto;}
	.mo{display:block; height: 0;}
}



/*banner*/
.banner img{width:100%;}
.banner-m{display: none;}

@media (max-width:768px){
	.banner{display: none;}
	.banner-m{display: block;}
	.banner-m img{width:100%;}
}


/*section-01*/
.section-01{margin:50px auto;}


/*section-02*/
.section-02{margin:80px auto;}

.section-02 ul{text-align: center;}
.section-02 ul li{display:inline-block; text-align: center; width:calc(20% - 40px); padding-right:47px; vertical-align: top;}
	.section-02 ul li:last-child{padding-right:0;}
.section-02 ul li img{width:100%;}
.section-02 ul li h3{font-size:2.4em;}
.section-02 ul li p{font-size:1.8em; line-height:1.8em;}

@media (max-width:1490px){
	.section-02 ul li h3{font-size:2em;}
	.section-02 ul li{width:calc(20% - 34px); padding-right:40px;}
}
@media (max-width:1110px){
	.section-02 ul li{width:calc(33% - 34px); padding-right:40px;}
	.section-02 ul li:nth-child(3n+3){padding-right:0;}
}
@media (max-width:600px){
	.section-02 ul li{width:100%; padding-right:0; margin: 10px 0;}
	.section-02 ul li img{width:150px;}
	.section-02 ul li h3{font-size: 2.2em;}
	.section-02 ul li p{font-size: 1.9em;}
}


/*section-03*/
.section-03{margin:50px auto; padding:50px 0; background:#fff1f1;}
.section-03 h2{text-align:left !important;}


/*section-04*/
.section-04{margin-top:50px;}
.section-04 h2{font-size:40px !important;}
.section-04 a{background: url("../img/btn.png"); background-repeat: no-repeat; background-size:contain; display:block; width:360px; height:91px; padding:25px 0; margin:0 auto; text-align: center; color:#fff; font-size:2.8em; font-weight:900;}

@media (max-width:500px){
	.section-04 h2{font-size:26px !important;}
}
@media (max-width:400px){
	.section-04 a{width:100%;}
}


/*footer*/
.footer{}
.footer ul{text-align: center; margin:50px auto;}
.footer li{display:inline-block; font-size:1.8em; font-weight:bold; vertical-align: middle; margin-right:20px;}

.footer-bg img{width:100%;}
.footer-bg-m{display: none;}

@media (max-width:768px){
	.footer-bg{display: none;}
	.footer-bg-m{display: block;}
	.footer-bg-m img{width:100%;}
	
	.footer li{font-size:11px; margin-right:10px;}
	.footer li img{height:35px;}
	
	.footer .contain-m{padding:0;}
}