@charset "utf-8";
/* CSS Document */


body{
	overflow: auto;
	/*background-repeat: no-repeat;
	background-position: center center ;
	background-attachment: fixed;
	background-size: auto;*/
	/*background-image: url(img_body_bg2.jpg);*/
	/*background-color: #4a89f0;*/
	font-family: "微軟正黑體",Arial, Helvetica, sans-serif !important;
	color: #3c3c3c;
}
.PCR_out{
	font-family: Arial, "微軟正黑體";
	position: relative;
	overflow: hidden;
}
.PCR_bg{
	background-color: #dbdbdb;
    background-image: url(bg.png);
    background-repeat: repeat;
    padding-top:30px;padding-bottom: 30px;
}
.top_banner{ 
	width: 100%;
    max-width: 1500px;
    height: auto;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 0 0;
    font-size: 0;
}
.top_banner::before{
	content: "";
    position: absolute;
    z-index: 20;
    width: 100%;
    height:100%;
    border:8px solid #fff;
    border-radius: 25px 25px 0 0;	
}
.top_banner img{
	width: 100%;
	clear: both;
}
#main{	
	width: 100%;
	max-width: 1500px;
	margin:0 auto;
	background-color: #FFF;
	padding: 40px;
	border-radius: 0 0 25px 25px;
}

#main h3{
	text-indent: -9999px;
	width:50%;
	height: auto;
	margin: 0 auto;
	padding-bottom:8% ;/*---16/100---*/
	background-size: cover;
	background-position: center top;
	margin-bottom: 2em;
}
#main h3.tit_1{background-image: url(tit_02.png);}
#main h3.tit_2{background-image: url(tit_04.png); margin-top: 40px;}

#main h4{
	text-indent: -9999px;
    width: 100%;
    max-width: 1400px;
    height: auto;
    margin: 0 auto;
    padding-bottom: 21.6%;
    background-image: url(tit_03.png);
    background-size: contain;
    background-position: center top;
    font-size: 0;
}
#main table.pcr_list,#main .pcr_list tr,#main .pcr_list td{
	border: 1px solid #adb8b9;
	border-collapse: collapse;
	font-size: 17px;
    font-weight: 500;
}
#main .pcr_list tbody{

}
#main .pcr_list tr{

}
#main .pcr_list td{
	padding: 1em;
    vertical-align: middle;
}
.hr_bg {}
.hr_font{}
#main .pcr_list tr:nth-child(2n-1){
	background-color: #eaeaea;
}
#main .pcr_list tr:nth-child(1){
	background-color: #3c9b9b;
    color: #fff;
    font-size: 18px;
}
#main .pcr_list tr>td:nth-child(1){width: 7%;}
#main .pcr_list tr>td:nth-child(2){width: 8%;}
#main .pcr_list tr>td:nth-child(3){width: 15%;}
#main .pcr_list tr>td:nth-child(4){width: 45%;}
#main .pcr_list tr>td:nth-child(5){width: 25%;}
#main .pcr_list tr td ul{}
#main .pcr_list tr td li{margin-left: 1em;margin-bottom: 1em;}

#main .pcr_list tr .fc_red{ color: #d34747; }
#main .pcr_list tr .fc_ora{ color: #ff9742; }
#main .pcr_list tr .fc_yel{ color: #ffdd42; }
#main .pcr_list tr .fc_gre{ color: #559334; }
#main .pcr_list tr .fc_blu{ color: #348f93; }
#main .pcr_list tr .fc_ind{ color: #0a2854; }
#main .pcr_list tr .fc_pur{ color: #402a64; }
#main .pcr_list tr .fc_sp1{ color: #4e4a54; }
#main .pcr_list tr .fc_sp2{ color: #978153; }
#main .pcr_list tr .fc_sp3{ color: #523819; }
#main .tab_lis_wap>p:nth-child(1){    
	text-align: right;
    font-size: 21px;
    line-height: 2.5em;
    font-weight: 800;
    padding-right: 1em;
    color: #00c1c4;}
.fw_900{font-weight: 900;}
.fw_500{font-weight: 500;}
.fw_300{font-weight: 300;}
.fs_120{font-size: 1.2em;}
.fs_150{font-size: 1.5em;}
.fs_200{font-size: 2em;}
.lih_200{line-height:2em;}
.lih_250{line-height:2.5em;}
.lih_300{line-height:3em;}

#main .more{ width:90%;max-width: 860px;margin: 0 auto;text-align: center; }
#main .more ul{ list-style: none; }
#main .more ul li{margin: 0 1%;display: inline-block;/*--border-right: 4px dotted #000;--*/}
#main .more ul>li:nth-last-child(1){border: none;}
#main li.li_btn1{width: 98%;}
#main li.li_btn2{width: 48%;}
#main li.li_btn3{width: 31%;}
#main li.li_btn4{width: 23%;}
#main .more ul li img{
	width: 50%;
    max-width: 150px;
    display: block;
    border-radius: 50%;
    margin: 0 auto;
}
#main .more ul li p{
    display: inline-block;
    border-radius: 35px;
    padding: 0.5em 3em;
    background-color: #2e2e2e;
    color: #fff;
    margin: 2em auto;
    font-size: 20px;

}
/*---------------------------------------2020/08/11新增項-------------------------------------------------------------*/
#Out_wappter .navigation{}
#Out_wappter .navigation nav{}
#Out_wappter .navigation nav.side-menu{
	position: fixed;
    right: 10px;
    top: 50%;
    transform: translateY(-73px);
    z-index: 99;
}
#Out_wappter .navigation nav.side-menu ul{list-style: none;}
#Out_wappter .navigation nav.side-menu ul li.hidden {display: none;}
#Out_wappter .navigation nav.side-menu ul li {text-align: right;margin: 10px 0; display: block;}

#Out_wappter .navigation nav.side-menu ul li a {
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}
#Out_wappter .side-menu ul li a span {
    display: inline-block;
}
#Out_wappter .side-menu ul li a span.menu-title {
    color: #fff;
    position: relative;
    margin-right:5px;
    text-transform: uppercase;
    font-size: 15px;
    background-color:#20a19e;
    padding: 3px 10px;
    font-weight: 600;
    border-radius: 3px;
    -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
    -moz-transition: -moz-transform 0.2s, opacity 0.2s;
    transition: transform 0.2s, opacity 0.2s;
    -webkit-transform-origin: 100% 50%;
    -moz-transform-origin: 100% 50%;
    -ms-transform-origin: 100% 50%;
    -o-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 0;
}

#Out_wappter .side-menu ul li a span.dot {
    position: relative;
    background-color: #a0e4c8;
    border: 1px solid #1da09e;
    border-radius: 2em;
    height: 10px;
    width: 10px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}
#Out_wappter .side-menu ul li a:hover span.menu-title { opacity: 1;}
#Out_wappter .side-menu ul li a:hover span.dot {transform: scale(1.8);}
/*----------------------------------------------------------------------------------------------------*/


@-moz-keyframes PooPoo {
  0% { transform: translateX(10px); }
  100% {  transform: translateX(-20px);}
}
@-webkit-keyframes PooPoo {
  0% { transform: translateX(10px); }
  100% {  transform: translateX(-20px);}
}
@-o-keyframes PooPoo {
  0% { transform: translateX(10px); }
  100% {  transform: translateX(-20px);}
}

@keyframes PooPoo {
  0% { transform: translateX(10px); }
  100% {  transform: translateX(-20px);}
}



@-moz-keyframes move {
  0% { transform: translateY(-10px); }
  100% {  transform: translateY(5px);}
}
@-webkit-keyframes move {
  0% {   transform: translateY(-10px); }
  100% { transform: translateY(5px); }
}
@-o-keyframes move {
  0% {  transform: translateY(-10px);}
  100% { transform: translateY(5px);  }
}

@keyframes move {
  0% { transform: translateY(-10px);}
  100% { transform: translateY(5px);  }
}

footer {
    clear: both;
    width: 100%;
    height: 50px;
    color: #fff;
    background-color:#073d54;
    text-align: center;
    line-height: 50px;
    font-size: 16px;
}


@media screen and (max-width: 1500px) {
#main { background-size: auto;}

}

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

}

@media screen and (max-width: 900px) {
#main {padding:15px;}
#main table~p {margin-bottom:1em;}
.PCR_bg {
    padding-top:1em;
    padding-bottom: 1em;
}
}

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

}
	
@media screen and (max-width: 700px) {
#main .more{ width:98%;max-width: 860px;margin: 0 auto;text-align: center; padding-top: 2em;}
#main .more ul li{margin: 0 1%;display: inline-block;/*--border-right: 4px dotted #000;--*/}
#main li.li_btn1{width: 98%;}
#main li.li_btn2{width: 98%;}
#main li.li_btn3{width: 30%;}
#main li.li_btn4{width: 30%;}
#main .more ul li img{
	width: 50%;
    max-width: 150px;
    display: block;
    border-radius: 20px;
    margin: 0 auto;
}
#main .more ul li p{
    display: inline-block;
    border-radius: 20px;
    padding: 0.5em 1.5em;
    margin: 1em auto;
    font-size: 17px;

}

#main .pcr_list tr>td:nth-child(1){display: none;}
#main .pcr_list tr>td:nth-child(2){width: 10%;}
#main .pcr_list tr>td:nth-child(3){width: 15%;}
#main .pcr_list tr>td:nth-child(4){width: 45%;}
#main .pcr_list tr>td:nth-child(5){width: 30%;}
footer {
	font-size: 12px;
    height: auto;
    line-height: 1.5em;
    padding-top: 10px;
    padding-bottom: 10px;
}	
}
@media (max-width: 580px) {
#main h3{
	text-indent: -9999px;
	width:90%;
	height: auto;
	margin: 0 auto;
	padding-bottom:14.4% ;/*---16/100---*/
	background-image: url(tit_02.png);
	background-size: cover;
	background-position: center top;
}
}

@media (max-width: 500px){
	#main h3{display: none;}
}


@media (max-width: 450px) {
#main li.li_btn1{width: 98%;}
#main li.li_btn2{width: 45%;}
#main li.li_btn3{width: 45%;}
#main li.li_btn4{width: 45%;}
	}
@media (max-width: 400px) {
}




@media (max-width: 360px) {
#main .pcr_list tr>td:nth-child(2) {
    width: 10%;
    display: none;
}
}