@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;
}
.OutInb_out{
	font-family: Arial, "微軟正黑體";
	position: relative;
	overflow: hidden;
}
.OutInb_bg{
	background-color: #dbdbdb;
    background-image: url(bg.png);
    background-repeat: repeat;
    padding-top:80px;
}
.OutInb_bg h2,.OutInb_bg h3,.OutInb_bg h4,.OutInb_bg h5,.OutInb_bg h6{font-weight: bold;}
.fw_bol{font-weight: bold;}
.fw_800{font-weight: 800;}
.fw_500{font-weight: 500;}
.fw_300{font-weight: 300;}
.fs_200{font-size: 2em;}.fs_150{font-size: 1.5em;}.fs_120{font-size: 1.2em;}
.lih_300{line-height:3em;}.lih_250{line-height:2.5em;}.lih_200{line-height:2em;}

.alink{
    cursor: pointer;
    display: inline-block;
    border-bottom: 1px solid #123;
    margin: 0 0.3em;
    line-height: initial;
}
.bc_r{background-color:#b71d16;}
.bc_o{background-color:#ff9742 ;}
.bc_y{background-color:#ffdd42 ;}
.bc_g{background-color:#559334 ;}
.bc_b{background-color:#348f93 ;}
.bc_i{background-color:#0a2854;}
.bc_p{background-color:#402a64 ;}
.bc_wi{background-color:#fff;}
.bc_bk{background-color:#000000c2;}
.fc_red{ color: #d34747; border-color:#d34747 ;}
.fc_ora{ color: #ef5800; border-color:#ef5800 ;}
.fc_yel{ color: #ffdd42; border-color:#ffdd42 ;}
.fc_gre{ color: #559334; border-color:#559334 ;}
.fc_blu{ color: #00383a; border-color:#00383a ;}
.fc_ind{ color: #04a7cf; border-color:#04a7cf ;}
.fc_pur{ color: #402a64; border-color:#402a64;}
.fc_sp1{ color: #4e4a54; border-color:#4e4a54;}
.fc_sp2{ color: #978153; border-color:#978153 ;}
.fc_sp3{ color: #523819; border-color:#523819 ;}

.top_banner{ 
	width: 100%;
    max-width: 1200px;
    height: auto;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    border-radius: 25px 25px 0 0;
    font-size: 0;
}
.top_banner::before,.main_sid::before{
	content: "";
    position: absolute;
    z-index: 20;
    width: 100%;
    height:100%;
    border:8px solid #fff;
    border-radius: 25px 25px 0 0;
    top: 0;left: 0;
    pointer-events: none;	
}
.main_sid::before{
    border-radius:0 0 25px 25px;
}
.top_banner img{
	width: 100%;
	clear: both;
}
.main_sid{	
	width: 100%;
	max-width: 1200px;
	margin:0 auto;
	background-color: #FFF;
	border-radius: 0 0 25px 25px;
    overflow:hidden;
    position: relative;
    z-index: 0;
    padding: 10px 2em 50px 2em;
    margin-bottom: 30px;
}
p.note{
    font-size: 20px;
    position: absolute;
    top: 10px;
    right: 1em;
    color: #f06866;
    font-weight: 600;
    width: 30%;
    min-width: 150px;
    text-align: right;
}
a.bnt_slt,.bnt_slt{
    border: 1px solid #9ea7b1;
    padding: 0.5em 2em;
    border-radius: 1.2em;
    color: #111
}
a.bnt_slt:hover,.bnt_slt:hover{
    background-color:#525252;
    color: #fff;
}
.main_sid h3{
	font-size: 2em;
    display: inline-block;
    padding: 0 2em;
    border-radius: 2em;
    margin-left: -2em;
    background-color:#705b56;
    color: #fff;
}
.focus,.focus2{position: relative;}
.dis_blo{display:block;}.dis_inb{display:inline-block;}.dis_inl{isplay: inherit}
.focus::before,.focus2::before{
    content: "";
    position: absolute;
    z-index: -1;
    width: 80%;
    height: 30%;
    background-color:#d6fffa87;
    bottom: 0.5em;
    left:2em;
}
.focus2::before{
    width: 100%;
    height:70%;
    bottom: 0;
    left:0em;
    background-color: #fff531cc;
}
.main_sid h4{
    font-size: 1.2em;
    line-height: 3em;
    width: fit-content;
    display: block;
    padding: 0 2em;
    border-radius: 0.2em;
    margin-left: em;
}
.box_lin{
    border-bottom: 1px solid #e5e5e5;
    border-top: 1px solid #e5e5e5;
    padding-left: 2em;
}
/*.main_sid ol,.main_sid ul{ margin-left: 2em;}*/
/*.main_sid li{ padding:0.5em ;}*/
.main_sid ol li:nth-child(1),.main_sid ul li:nth-child(1){padding-top: 0.5em;}
.main_sid ol li:nth-last-child(1),.main_sid ul li:nth-last-child(1){padding-bottom: 0.5em;}


.main_sid table.pcr_list,#main .pcr_list tr,#main .pcr_list td{
	border: 1px solid #D0D0D0;
    border-collapse: collapse;
    font-size: 17px;
    font-weight: 500;
    width: 98%;
    max-width: 960px;
    margin: 0 auto;
}
.main_sid .pcr_list tbody{

}
.main_sid tr{

}
.main_sid td{
	padding: 1em;
    vertical-align: middle;
}
.hr_bg {}
.hr_font{}
.main_sid tr:nth-child(2n-1){
	background-color: #f0f0f0;
    border-top: 1px solid #D0D0D0 ;
    border-bottom: 1px solid #D0D0D0 ;
}
/*
.main_sid tr:nth-child(1){
	background-color: #564c4a;
    color: #fff;
    font-size: 18px;
    font-weight: 900;
}
.main_sid td.tab_tit{
    width: 20%;border-right: 1px solid #adb8b9;
}
*/
.main_sid li.li_btn1{width: 98%;}
.main_sid li.li_btn2{width: 48%;}
.main_sid li.li_btn3{width: 31%;}
.main_sid li.li_btn4{width: 23%;}
.main_sid .more ul li img{
	width: 50%;
    max-width: 150px;
    display: block;
    border-radius: 50%;
    margin: 0 auto;
}

/*---------------------------------------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:#757676;
    text-align: center;
    line-height: 50px;
    font-size: 16px;
}

@media screen and (min-width: 1500px) {
}

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

@media screen and (max-width: 900px) {
.main_sid {padding:50px 20px;}
.main_sid table~p {margin-bottom:1em;}
.OutInb_bg {
    padding-top:1em;
    padding-bottom: 1em;
}
}

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



    .top_banner{ 
        
        margin: 50px auto 0 auto;
        
    }

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

footer {
	font-size: 12px;
    height: auto;
    line-height: 1.5em;
    padding-top: 10px;
    padding-bottom: 10px;
}	
}
@media (max-width: 580px) {}

@media (max-width: 500px){
.OutInb_bg {
    padding-top: 0;
    padding-bottom: 0;
}
.top_banner,.main_sid {
    border-radius: 0;
}
.top_banner::before, .main_sid::before {;
    display:none;
}
    .main_sid {
    padding: 10px 20px;
}
p.note {
    font-size: 14px;
}
.main_sid h3 {
    font-size:1.5em;;
    padding: 0 2em;
    border-radius: 1em;
    margin-left: -2em;
}
.main_sid h3.tit_1{
    margin-top: 1em;
}
.box_lin{ 
    padding-top: 1em;
    text-align: center;
    padding-left: 0;
}
a.bnt_slt,.bnt_slt,li.dis_inb{
    display: block;
}
a.bnt_slt:nth-child(1){margin: 1em;}
p.dis_inb{
    width: 100%;
    max-width:300px;
    margin: 0 auto;
    display: block;
    text-align: center;
}
}

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

@media (max-width: 400px) {
}

@media (max-width: 360px) {
}