.content{font-family:  'Noto Sans TC',"微軟正黑體";}




/*----------------------- p1 ----------------------*/

section.p1 h2.title{ font-size:36px;  margin-bottom: 20px; color: #333; display: block; font-weight: bold; line-height: 42px;}

section.p1{width:100%;background: url(../../images/product/attendance/bg-p1.jpg) no-repeat top center;height: 566px;overflow: hidden;}

section.p1 .container{width:100%;max-width:1300px;padding:0 15px ;margin: 0 auto; position: relative;height: 100%;}

section.p1  .text{position: relative;z-index: 9;margin-top: 60px;margin-bottom: 60px;text-align: left;padding-left: 10%;}
section.p1  .text p{ font-size: 16px;width: 100%;max-width: 500px;margin-bottom: 30px;padding-left: 6px;}

section.p1  .text .btn-group{text-align: left;}
section.p1  .text .btn-group .btn{border-radius: 30px;font-weight: normal;padding:10px ; width: 40%;max-width: 200px; }
.btnColor-green2{background: #5b9c16;border: 2px #5b9c16 solid;box-shadow: none;}
.btnColor-green2:hover{background: #48800c;border:2px #48800c solid;}
.btnColor-greenB2Border{border: 2px #5b9c16 solid;background: transparent;}


section.p1 .char{position: absolute;right:10%;bottom: 0;z-index: 2;text-align: right;}
section.p1 .char img{ display: inline-block;vertical-align: bottom;}

section.p1 .map{position: absolute;left: 14%;bottom: 0;z-index: 1;}



@media (max-width:1200px) {
    section.p1 .char{right: 1%;}
}


@media (max-width: 768px) {
    
    section.p1 h2.title{ font-size: 28px; }
    
section.p1{width:100%;background: url(../../images/product/attendance/bg-p1-phone.jpg)no-repeat bottom center;height: auto;}

    section.p1  .text{padding-left: 0;}
    section.p1 .char{position: relative;z-index: 2;right:-6%;}
    
section.p1 .map{display: none;}

}





/*----------------------- p2 ----------------------*/


section.p2{width:100%;background: #f0ebe6;}

section.p2 .container{width:100%;max-width:1300px;padding:0 15px ;margin: 0 auto ; position: relative;padding-top: 80px;padding-bottom: 60px;}

section.p2 .advantage{}
section.p2 .advantage .item {width: 33%;}
section.p2 .advantage .item:not(:last-child) {margin-bottom: 60px;}
section.p2 .advantage .item .text{text-align: left;width: 100%;max-width: 340px;margin-bottom: 20px;}
section.p2 .advantage .item h3{font-size: 28px;font-weight: bold;position: relative;margin-bottom: 10px;}
section.p2 .advantage .item h3 span{background: #ff5656; color: #fff;font-size: 50%;padding: 2px 10px;position: absolute;bottom: 90%;left: 0;border-radius:10px ;}
section.p2 .advantage .item p{font-size: 15px;}

section.p2 .advantage .item .pic{}

.advantage .item1 .pic{margin-top: 50px;}
.advantage .item2 .pic{margin-top: 60px;}
.advantage .item3 .pic{margin-top: 40px;}

@media (max-width: 768px) {
    
    section.p2 .advantage .item:first-child {margin-bottom: 60px;}
    
    section.p2 .container{padding-top: 60px;padding-bottom: 60px;}
    
    .advantage .item1 .pic{margin-top: 30px;}
    .advantage .item2 .pic{margin-top: 30px;}
    .advantage .item3 .pic{margin-top: 30px;}
    
}






/*----------------------- p3 ----------------------*/


section.p3{width:100%;background: url(../../images/product/attendance/bg-p3.jpg) no-repeat bottom center;height: 652px;overflow: hidden;}

section.p3 .container{width:100%;max-width:1300px;padding:0 15px ;margin: 0 auto; position: relative;padding-top: 90px;}


section.p3  .text{text-align: center;width: 100%;max-width: 600px;margin-bottom: 60px;}
section.p3  .text h3{font-size: 38px;font-weight: bold;position: relative;margin-bottom: 10px;;line-height: 1.2;}
section.p3  .text p{font-size: 16px;}

section.p3  .pic {}




@media (max-width: 768px) {
    
    section.p3{height:auto;padding-bottom: 60px;}
    
    section.p3  .text h3{font-size: 30px;}
    
}











/*----------------------- p4 ----------------------*/

section.p4{width:100%;background: url(../../images/product/attendance/bg-p4.gif) no-repeat bottom center;padding-bottom: 150px;}

section.p4 .container{width:100%;max-width:1300px;padding:0 10px ;margin: 0 auto; position: relative;margin-top: 80px;}

section.p4 .feature{text-align: center;}

section.p4 .feature .item{padding:50px 25px ;width: 33%;}

section.p4 .feature .icon{width: 130px;}
section.p4 .feature .icon img{max-width: 100%;}

section.p4 .feature .text{text-align: left;width: calc(100% - 136px);padding-left: 10px;}
section.p4 .feature .text h3{font-weight: bold;font-size: 28px;margin-bottom: 6px;}
section.p4 .feature .text p{font-size: 14px;}



@media (max-width: 1200px) {
    
    section.p4 .feature{text-align: left;}
    
    section.p4 .feature .item{width: 50%;padding: 20px 15px;}

  
    
}

@media (max-width: 768px) {
    

    section.p4 .feature .icon{width: 100px;}
    
    section.p4 .feature .text{width: calc(100% - 106px);}
    
}








/*----------------------- p5 ----------------------*/

section.p5{width:100%;background: url(../../images/product/attendance/bg-p5.gif) no-repeat top center  #e7e7e7; background-size: auto 100%; min-height: 672px;}

section.p5 .container{width:100%;max-width:1300px;padding:0 15px ;margin: 0 auto; position: relative;padding: 80px 10px;}


section.p5 .pic{}





@media (max-width: 768px) {
    
  section.p5{min-height: 0;background: #e7e7e7;}
}









/*▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃ 價目表 ▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃*/	

.price-list-wrap{background: #f8f8f8;font-family:  'Noto Sans TC',"微軟正黑體";}
.price-list-wrap .container{  width: 100%;max-width: 1100px;margin-left: auto;margin-right: auto;padding:60px 10px 30px;}

.price-list-wrap .advantage{font-size: 20px;font-weight: 500;text-align: center;color: #585858;margin-bottom: 30px;}
.price-list-wrap .advantage p{margin: 10px;}
.price-list-wrap .advantage p i{ margin-right: 5px;}




.price-list{text-align: center; }

.price-list .icon{}
.price-list .icon img{margin-left: auto;margin-right: auto;margin-bottom:12px;}

.price-list .list{text-align: center;width: 50%;max-width:502px; margin:0 1.5% 30px ;
    background: #fff;padding:36px 8px;box-shadow: 0 0 20px 5px rgba(0,0,0,.2);border-radius:5px ;
}
.price-list .list h3{font-size: 28px;font-weight: bold;line-height: 1.2;margin-bottom: 8px;color: #30b736;}
.price-list .list h3 p{font-size: 80%;font-weight: 400;margin: 0;}
.price-list .list h3 p i{font-size: 110%;position: relative;line-height: 1;vertical-align: sub;}
.price-list .list .price{font-size: 40px;font-weight: bold;margin-bottom: 10px;line-height: 1; color: #30b736;}
.price-list .list .price span{font-size: 80%;position: relative;top: -4px;}
.price-list .list .people{font-size: 100%;color: #ff7336;margin-bottom: 20px;font-weight: bold;}

.price-list .list .note{font-size: 14px;background: #e6e6e6; padding: 2px 10px;border-radius:10px ;display:inline-block;margin-left: auto;margin-right: auto;}

.price-list .list ol{list-style: none;}
.price-list .list ol li{font-size: 14px;padding: 5px;letter-spacing: 0;}

.price-list .list .btn-more{margin-top: 30px;max-width: 200px;margin-left: auto;margin-right: auto;padding:8px ;font-size: 16px;box-shadow: none;
    background: #30b736; border: 1px solid #149b1a;border-radius: 60px;color: #fff;margin-bottom: 10px;
    
}

.price-list .list .btn-more:hover{ background: #179d1d;}

.price-list .list .btn-more2{background: #dfffd0; border: 1px solid #30b736; color: #137f18;margin-top: 20px;}
.price-list .list .btn-more2:hover{ background: #179d1d; color: #fff;}

.price-list .list .text-link{font-size: 15px;font-weight: 500;color: #0c8f12; text-decoration: underline;}

.price-list-part2 .list{width: 30%;max-width:380px;}

.price-list-part2 .list p{margin-top: 14px;}

.price-list-part2 .hour{background: #dddddd; padding: 2px 8px;border-radius: 30px;font-size: 13px;margin-left: 10px; display: inline-block}

@media screen and (max-width:800px) {
    .price-list .list{max-width: none; margin:0 auto 30px ;}
}










/*----------------------- p6 ----------------------*/


section.p6{width:100%;background: url(../../images/product/attendance/bg-p6.jpg) no-repeat bottom center #1472ad;min-height: 480px;position: relative;padding-bottom: 16px;}

section.p6 .container{width:100%;max-width:1300px;padding:0 15px ;margin: 0 auto; position: relative;padding-top: 100px;}


section.p6 h3{color: #fff; text-align: center;font-weight: bold;font-size: 36px;margin-bottom:40px;}

 .btn-try{display: block;background: #fff; border-radius: 60px; color: #0f659e; padding: 10px 30px ;width: 90%;max-width: 280px;text-align: center;
    margin-bottom: 80px;font-size: 18px;overflow: hidden;transition:all .3s; -webkit-transition:all .3s;
}

section.p6 .announce{font-size: 16px;color: #fff;margin-top:60px;text-align: center; margin-left: auto;margin-right: auto;
max-width: 700px; display: block;background: rgba(0,0,0,.3);padding: 5px 10px;}

.btn-try:hover{color: #fff;}

.hvr-shutter-out-horizontal:before {background: #ff7a21; }


.note{padding-left: 60px; color: #fff;text-align: center;position: relative;width:100%;max-width:650px;margin-left: auto;margin-right: auto;}

.note p {position: absolute;left: 0;top: 0px;font-size: 18px;}

.note ol{list-style: decimal;text-align: left;}



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