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




/****活動用****/
.blackbarnew{
    top:0;
	left:0;
	width:100%;
	height:30px;
    padding:0 10px;
	background-color:#000;
	position: fixed;
	z-index:999;
	overflow: hidden;}

.yeslogo{font-size: 12px; color: #fff; line-height: 30px; letter-spacing: 2px; float: left;}

.yeslogo i{margin-right: 8px; float: left;}

.yeslogo i img{width: 10px; margin-top: 10px;}

.yesgogo{font-size: 12px; color: #fff; line-height: 30px; letter-spacing: 2px; float: right;}

.yesyes{font-size: 15px; color: #fff; font-weight: bold; line-height: 30px; letter-spacing: 1px; margin-right: 4px;}






/****GOGOGOGO****/




body{background-color: #fffccf; background-image: url("../img/bbi.png"); background-size: 500px;}




.foctop_731{width: 100%; margin-top: 30px; 
  background-image: url("../img/ad_big.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size:cover;
    overflow: hidden;
    position: relative;
}


.bf{max-width: 950px; margin: 0 auto -3px;}








.searchbox_731{width: 100%; background-color: #ae1f1f; padding: 16px 0 16px; position: relative; z-index: 88;}

.searchbox_731 > ul{overflow: hidden; margin: 0 auto; max-width: 950px; margin-bottom: 0px;}


.searchbox_731 > ul > li{float: left; padding-right: 12px;}


.searchbox_731 > ul > li:nth-child(1){width: 40%; }
.searchbox_731 > ul > li:nth-child(2){width: 24%; }
.searchbox_731 > ul > li:nth-child(3){width: 24%; }
.searchbox_731 > ul > li:nth-child(4){width: 12%; padding-right: 0px;}




.searchbox_731_1{width: 100%; height: 44px; padding: 0 40px 0 10px; border-radius: 4px; border:0; font-size: 20px; font-family: Arial, "文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "LiHei Pro", "微軟正黑體", "Microsoft JhengHei", "新細明體", PMingLiU, sans-serif; outline: none;
 color: #000; transition: all .3s; background-image: url(../img/close.png); background-size: auto 40%;background-position: 98% center; background-repeat: no-repeat; }


.searchbox_731_1:focus{background-color: #fffacc}


.searchbox_731_2{width: 100%; height: 44px; padding: 0 30px 0 10px; border-radius: 4px; border:0; font-size: 20px; font-family: Arial, "文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "LiHei Pro", "微軟正黑體", "Microsoft JhengHei", "新細明體", PMingLiU, sans-serif; outline: none;
 background-image: url(../img/icon_dropdown.png); background-position: center right; background-repeat: no-repeat; cursor: pointer;
color: #000; appearance:none;
-moz-appearance:none;
-webkit-appearance:none;}



.searchbox_731_go{width: 100%; height: 44px; line-height: 44px; border-radius: 4px; font-size: 20px; text-align: center; 
    background-color: #ffeb50; cursor: pointer; transition: all .3s; color: #000;}


.searchbox_731_go:hover{background-color: #fff6a4;}




@media screen and (max-width: 980px) {
    
    .searchbox_731 > ul{padding: 0 16px;}
    
}


@media screen and (max-width: 736px) {
    
    .searchbox_731 > ul{padding: 0 14px;}
    .searchbox_731{padding: 14px 0;}  
    
.searchbox_731 > ul > li:nth-child(1){width: 100%; padding-right: 0; margin-bottom: 10px;}
.searchbox_731 > ul > li:nth-child(2){width: 35%;  }
.searchbox_731 > ul > li:nth-child(3){width: 35%;  }
.searchbox_731 > ul > li:nth-child(4){width: 30%; padding-right: 0px;}
    
    
    .searchbox_731_1,.searchbox_731_2,.searchbox_731_go{height: 40px; line-height: 40px;}
	
}


.oktag{ text-decoration: none!important; background-color: #fff686!important; padding: 8px!important; color: #d50011!important;}


.hottag{ margin: 0 auto; max-width: 950px;  position: relative; z-index: 88;  margin-bottom: 16px; padding: 8px 16px 8px;}

.hottag > ul{overflow: hidden; margin: 0 auto; max-width: 950px;}

.hottag > ul > li{float: left; margin-right: 20px; font-size: 18px; color: #ae1f1f; line-height: 1.6;}

.hottag > ul > li:nth-child(1){margin-right: 8px; }

.hottag > ul > li a{color: #ed6100; text-decoration: underline; transition: all .3s;}


.hottag > ul > li a:hover{text-decoration: none;}


.opentag{position: absolute; right: 0; top:0; width: 60px; height: 27px; line-height: 27px; color: #eee; text-align: right;  
    font-size: 18px; background-color: #ae1f1f; z-index: 88; cursor: pointer; display: none;}

.hopen{height: auto!important;}

@media screen and (max-width: 980px) {
    
    .hottag > ul{padding: 0 0px; /*height: 27px;*/}
    /*.opentag{right: 16px; display: block;}*/
    
    .hottag{padding:0px 0;}
    
}


@media screen and (max-width: 736px) {
    
    /*.hottag > ul > li{display: none;}
    .hottag > ul > li:nth-child(1){display: block;}
    .hottag > ul > li:nth-child(2){display: block;}*/
    
    
    
    .hottag > ul > li{font-size: 16px; margin-right: 14px; line-height: 1.8;}

    
}











.page{width: 100%; padding: 16px 16px 60px; position: relative; z-index: 8;}


@media screen and (max-width: 980px) {
    
.page{padding: 16px 16px 40px;}
    
}


@media screen and (max-width: 736px) {
    
.page{padding: 16px 16px 40px;}
	
}











.work_list_731{max-width: 950px; margin: 0 auto; background-color: #fff; border-radius: 8px 8px 0 0; overflow: hidden; /*margin-bottom: 20px; */
    border: 0px solid #f0dfc7; transition: all .3s;}


.work_list_731 ul{overflow: hidden; width: 100%; transition: all .3s;}


.work_list_731 > ul > li{width: 100%; border-bottom: 1px solid #f0dfc7; transition: all .3s;}


/*.work_list_731 > ul > li:last-child{border-bottom: 0px solid #f0dfc7;}*/


.work_list_731 > ul > li:hover{background-color: #fff3f8; border-bottom: 2px solid #ffc5de;}




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

    
}


@media screen and (max-width: 736px) {
    
    .work_list_731{background-color: transparent;}
    
    .work_list_731 > ul > li:first-child{display: none;}
 
    .work_list_731 > ul > li{padding: 12px 8px 12px; margin-bottom: 0px; background-color: #fff;}
	
}








.list_name{background-color: #fff2a9; width: 100%;}

.list_name ul{overflow: hidden; }

.list_name li{height: 42px; font-size: 16px; padding: 0 10px; color: #6a3a07; float: left; line-height: 46px; overflow: hidden;  text-overflow : ellipsis;  white-space : nowrap;}

.list_name li:nth-child(1){width: 8%;  text-align: center;}
.list_name li:nth-child(2){width: 25%; padding-left: 20px;}
.list_name li:nth-child(3){width: 22%;}
.list_name li:nth-child(4){width: 15%; text-align: center;}
.list_name li:nth-child(5){width: 20%; text-align: center;}
.list_name li:nth-child(6){width: 10%; text-align: center;}



@media screen and (max-width: 980px) {
    
    
.list_name li:nth-child(1){width: 10%;}    
.list_name li:nth-child(4){width: 20%;}
.list_name li:nth-child(5){width: 23%;}
.list_name li:nth-child(6){display: none;}
    
}


@media screen and (max-width: 736px) {
    
    .list_name{display: none;}
	
}












.list_name2{width: 100%;}

.list_name2 ul{overflow: hidden; }

.list_name2 li{height: 68px; padding: 0 10px; font-size: 16px; line-height: 68px; float: left; overflow: hidden;  text-overflow : ellipsis;  white-space : nowrap; color: #333;}

.list_name2 li:nth-child(1){width: 8%; text-align: center; color: #999;}
.list_name2 li:nth-child(2){width: 25%; padding-left: 20px; color: #ae1f1f;}
.list_name2 li:nth-child(3){width: 22%;}
.list_name2 li:nth-child(4){width: 15%; text-align: center;}
.list_name2 li:nth-child(5){display: none;}
.list_name2 li:nth-child(6){width: 20%; padding-left: 20px; color: #ed6100;}
.list_name2 li:nth-child(7){width: 10%; text-align: center;}


.ago{width: 100%; height: 38px;  color: #333; line-height: 38px; text-align: center; border-radius: 6px; margin-top: 15px; 
    font-size: 16px; transition: all .3s; border:1px solid #d2d2d2; box-shadow: 0 4px #d2d2d2; transform: translateY(-2px);}

.work_list_731 > ul > li:hover .ago{background-color:#ffeb50; border:1px solid #e5a73f; box-shadow: 0 2px #e5a73f; transform: translateY(0px);}

@media screen and (max-width: 980px) {
    
.list_name2 li:nth-child(1){width: 10%;}
.list_name2 li:nth-child(4){width: 20%;}
.list_name2 li:nth-child(6){width: 23%;}
.list_name2 li:nth-child(7){display: none;}
    
}


@media screen and (max-width: 736px) {
 
.list_name2 li{height: auto;line-height: 2; }   
.list_name2 li:nth-child(1){display: none;}    
.list_name2 li:nth-child(2){width: 100%; padding: 0 10px; font-size: 20px;}
.list_name2 li:nth-child(3){width: 100%;}
.list_name2 li:nth-child(4){width: 40%; text-align: left;}
.list_name2 li:nth-child(5){display: block; width: 60%; text-align: left; font-size: 15px; color: #999;}    
.list_name2 li:nth-child(6){width: 100%; padding: 0 10px; text-align: left; font-size: 18px;}
.list_name2 li:nth-child(7){ display: none;}

    
    .ago{width: 30%; margin-top: 10px; background-color:#ffeb50; border:0px solid #e5a73f; transform: translateY(0px); 
        box-shadow: 0 0px #e5a73f; float: right;}
	
}











.list_box{max-width: 950px; padding: 8px 0; text-align: center; font-size: 16px; margin: 0 auto 40px; line-height: 30px;
    background-color: #fff2a9; border-radius:0 0 8px 8px; overflow: hidden;}

.list_box a{color: #000; transition:all .3s;}

.list_box a:hover{color: #ae1f1f;}

.list_box select{ padding: 4px 10px; margin: 0 4px; vertical-align: middle; outline: none; font-size: 14px; border: 0px solid #f0dfc7;}

.list_box td{vertical-align: middle;}


.web0812{display: block;}
.mob0812{display: none;}

@media screen and (max-width: 980px) {
    
.list_box{margin: 0 auto 20px;}
    
}


@media screen and (max-width: 736px) {
    
/* .web0812{display: none;} */
.mob0812{display: block;}
	
}












.icon_3{width: 100%; margin-bottom: 20px;}

.icon_3 > ul{max-width: 950px; margin: 0 auto; overflow: hidden;}

.icon_3 > ul > li{width: calc(33.33% - 14px); margin-right: 21px; float: left; border-radius: 6px; overflow: hidden;}

.icon_3 > ul > li:nth-child(3n+3){margin-right: 0}


.iconbox{width: 100%;}

.iconbox ul{overflow: hidden;}

.iconbox li{float: left; height: 80px; overflow: hidden; }

.iconbox li:nth-child(1){width: 80px; }

.iconbox li:nth-child(2){width: calc(100% - 80px); background-color: #fff; padding: 18px 16px 0px 24px;}

.icong{transition: all .3s;}

.iconbox:hover .icong{ transform: scale(1.1);}

.iconbox li h1{font-size: 18px; color: #ae1f1f; margin-bottom: 12px;}

.iconbox li p{font-size: 16px; color: #666; }



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

    .iconbox li:nth-child(1){display: none;}
    .iconbox li:nth-child(2){width: calc(100%);}

}


@media screen and (max-width: 736px) {
    
    .iconbox li:nth-child(1){display: block;}
    .iconbox li:nth-child(2){width: calc(100% - 80px);}
    .icon_3 > ul > li{width: 100%; margin-right: 0; margin-bottom: 16px;}
    .icon_3 > ul > li:last-child{margin-bottom: 0;}
	
}







.candle-smoke {
    position: absolute;
    left: 50%; bottom: 60px;
    transform-origin: bottom center;
    transform: scale(8,2);
    filter: blur(3px);
    opacity: 0.9;
    z-index: 99;
    
}
.out .candle-smoke {
    animation: smokeOut 30s both;
}

@keyframes smokeOut {
    10% { opacity: 1; }
    0%,100% { opacity: 0; }
}


.candle-smoke span { 
    position: absolute;
    bottom: -9px; left: -9px;
    width: 18px; height: 18px;
    background-image: radial-gradient(closest-side circle, rgba(255,255,255,.75), rgba(255,255,255,.6), rgba(255,255,255,.4), rgba(255,255,255,0));
    border-radius: 18px;
    opacity: 0;
}
.candle:not(.out) .candle-smoke span {
    animation: none;
}


@keyframes smokeL {
    0%   { opacity: 0; transform: scale(1) translate(0, 0); }
    10%  { opacity: .8; transform: scale(1) translate(0, -7px); }
    100% { opacity: 0; transform: scale(5) translate(-4px, -26px); }
}

@keyframes smokeR {
    0%   { opacity: 0; transform: scale(1) translate(0, 0); }
    10%  { opacity: .8; transform: scale(1) translate(0, -7px); }
    100% { opacity: 0; transform: scale(5) translate(4px, -26px); }
}

.candle-smoke .s0 { animation: smokeL 10s 0s infinite; }
.candle-smoke .s1 { animation: smokeR 10s 1s infinite; }
.candle-smoke .s2 { animation: smokeL 10s 2s infinite; }
.candle-smoke .s3 { animation: smokeR 10s 3s infinite; }
.candle-smoke .s4 { animation: smokeL 10s 4s infinite; }
.candle-smoke .s5 { animation: smokeR 10s 5s infinite; }
.candle-smoke .s6 { animation: smokeL 10s 6s infinite; }
.candle-smoke .s7 { animation: smokeR 10s 7s infinite; }
.candle-smoke .s8 { animation: smokeL 10s 8s infinite; }
.candle-smoke .s9 { animation: smokeR 10s 9s infinite; }


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

    .candle-smoke{display: none;}

}




/*--------------------頁碼--------------------*/
.job_list_nex0812 {
  padding: 0px 0;
  text-align: center;
  font-size:13px;
  }
.job_list_nex0812 span {
  border: 1px solid #666;
  margin: 0 1px;
  padding: 5px 9px;
  text-decoration: none;
  vertical-align: middle;
  color: #ffffff;
  background-color:#666;
  }
.job_list_nex0812 a {
  border: 1px solid #666;
  color: #666;
  margin: 0 1px;
  padding: 5px 9px;
  text-decoration: none;
  vertical-align: middle;
  }
.job_list_nex0812 a:hover {
  border: 1px solid #666;
  color: #ffffff;
  background-color:#666;
  }
.topset {
  background-color:#666;
  } 

.job_list_nex0812 input[type="text"]{width: 80px; height: 27px; border:1px solid #666; outline: 0; margin: 0 8px; padding: 0 4px;}


.job_list_nex0812 input[type="button"]{width: 60px; height: 27px; outline: 0; background-color: #ae1f1f; color: #fff; border:0; margin-left: 8px; border-radius: 4px;}