.mhpgn { height:60px; }
.nodata { text-align: center; padding:40px 0px; color:#919191; font-size:1.5rem; }
.nodata .emotion { font-size:6rem; padding-bottom:60px; }

.top { height:120px; }
.top .topall { z-index:10; top:0px; }
.top .topall .nav-item a { color:#ffffff; text-decoration: none; cursor: pointer; }
.top .topall .topmenu { height:80px; text-align:left; padding:10px 0px; width:100%; position: relative; }
.top .topall .topmenu .logo { position: absolute; left:0px; height:40px; margin:10px 0px; }
.top .topall .topmenu .menu { padding:18px 0px; float:right; }
.top .topall .topmenu .menu .topbtn { color:#ffffff; position: absolute; top:0px; width:80px; height:80px; border-radius: 0; }
.top .topall .topmenu .menu .btn_menu {  right:0px; }
.top .topall .topmenu .menu .btn_lan { right:80px; }
.top .topall .topmenu .menu .submenu { color:#ffffff; padding-right:28px; font-weight:bold; }
.top .topall .topmenu .menu .lastmenu { padding-right:0px; }
.top .topall .topmenu .menu .lastmenu .line { height:10px; border-left:1px solid #ffffff; display: inline-block; padding-right:28px; }

.catalog { margin:20px auto; }
.catalog .breadcrumb { background-color: transparent; justify-content: flex-end; padding:0px; margin:0px; font-size:0.9rem; }
.catalog .breadcrumb a { color:#00679c; }
.catalog .breadcrumb .active { color:#919191; }
.catalog .breadcrumb .breadcrumb-item::before { color:#c6c6c6; }

.position { display: flex; text-align:left; }
.position .menu { flex:1; padding-right:10px; padding-bottom:40px; }
.position .menu ul { list-style-type:none; padding:0px; margin:0px; margin-right:15px; font-size:1.2rem; }
.position .menu ul a { text-decoration: none; }
.position .menu .title { color:#009ee7; border-bottom:2px solid #009ee7; margin-right:15px; font-size:1.2rem; padding-left:10px; padding-bottom:10px; }
.position .menu .active { color:#919191; }
.position .menu li { border-bottom:1px solid #e2e2e2; margin:10px 0px; padding-left:10px; padding-bottom:10px; color:#1171a3; }
.position .jobdata { flex:3; font-family: "Microsoft JhengHei" }
.position .jobdata .job { border:1px solid #c6c6c6; padding:30px; margin-bottom:40px; }
.position .jobdata .job .title { color:#00679c; font-size:1.5rem; }
.position .jobdata .job .working { display: flex; font-family:"Verdana"; padding:10px 0px;  }
.position .jobdata .job .dw { border-bottom:1px solid #c6c6c6; padding-bottom:40px; }
.position .jobdata .job .working .subt { flex:1; color:#919191; font-size:0.8rem; }
.position .jobdata .job .working .subt2 { color:#474747; font-size:1rem; }

.position .jobdata .job .detail { margin:30px 0px 50px 0px;  }

.position .jobdata .icon { float:left; padding:8px 0px; }
.position .jobdata .icon .pic { width:32px; height:32px; background-color:#474747; color:#ffffff; text-align:center; padding:8px 0px; border-radius: 50px; margin-right:5px; }
.position .jobdata .icon div { height:32px; width:32px; margin-right:5px; display:inline-block; }
.position .jobdata .back { float:right; margin:6px 0px; padding:6px 20px; background-color:#00679c; color:#ffffff; border-radius:5px; width:160px; border:none; }
/* .position .jobdata .back span { float:left; } */
.position .jobdata .back i { font-size:1.5rem; float:left; }

.position .jobdata .job a { text-decoration: none; }
.position .jobdata .job .txt { text-align:center; margin-bottom:50px; }
.position .jobdata .job .des { white-space: wrap; }
.position .jobdata .job form { padding:0px 10px; }
.position .jobdata .job label { color:#009ee7; }
.position .jobdata .job form .import { color:#46c8fa; }
.position .jobdata .job input,
.position .jobdata .job textarea { width:100%; border:none; border-bottom:1px solid #009ee7; margin-bottom:30px; padding:5px 0px; color:#474747; }
.position .jobdata .job textarea { resize:none; height:5rem; }
.position .jobdata .job .security .code { height:100%; margin-bottom:0px; }
.position .jobdata .job .security img { width:100%; }
.position .jobdata .job .security #change { height:100%; border:none; background-color: transparent; color:#009ee7; }
.position .jobdata .job .security .send { margin-top:20px; margin-bottom:0px; background-color: #00679c; color:#ffffff; border-radius: 5px; padding:8px 0px; }
.position .jobdata .job .content { padding:20px 0px; }

.pgn { text-align:center; }
.pgn .con { display: inline; position: relative; }
.pgn .page { display:inline-block; width:32px; height:32px; border-radius:50px; padding:5px 0px; font-family:Helvetica; }
.pgn .page a { color:#474747; }
.pgn .pbtn { width:32px; height:32px; border-radius:50px; padding:9px 0px; background-color:#919191; color:#ffffff; font-size:0.875rem; border:none; }
.pgn .active { background-color:#009ee7; color:#ffffff; font-weight: bold; }
.pgn .pbtn.nopage { background-color: #c6c6c6; }
.pgn .larr { position:relative; left:-60px; } 
.pgn .rarr { position:relative; right:-60px; }
.pgn .pbtn:not(.nopage):hover { background-color: #009ee7; }
.pgn .txt { padding:0px 10px; }

/* .footer { color:#ffffff; font-size:0.9rem; background:url("./images/bg_foot.png") repeat-x; background-size:cover; padding:40px 0px; }  */
/* .footer .pic .logo img { height:40px; margin:4px 0px; } */
/* .footer .pic .icon { margin:8px 0px; } */
/* .footer .pic .icon div { width:32px; height:32px; display:inline-block; margin-left:5px; } */
/* icon & hover */
/* .footer .pic .icon .fb { background:url("./images/img_fb.png") no-repeat center center; background-size:cover; }
.footer .pic .icon .line { background:url("./images/img_line.png") no-repeat center center; background-size:cover; }
.footer .pic .icon .yt { background:url("./images/img_youtube.png") no-repeat center center; background-size:cover; }
.footer .pic .icon .tw { background:url("./images/img_tw.png") no-repeat center center; background-size:cover; }
.footer .pic .icon .wc { background:url("./images/img_weixin.png") no-repeat center center; background-size:cover; }
.footer .pic .icon .fb:hover { background:url("./images/img_fbb.png") no-repeat center center; background-size:cover; cursor: pointer; }
.footer .pic .icon .line:hover { background:url("./images/img_lineb.png") no-repeat center center; background-size:cover; cursor: pointer; }
.footer .pic .icon .yt:hover { background:url("./images/img_youtubeb.png") no-repeat center center; background-size:cover; cursor: pointer; }
.footer .pic .icon .tw:hover { background:url("./images/img_twb.png") no-repeat center center; background-size:cover; cursor: pointer; }
.footer .pic .icon .wc:hover { background:url("./images/img_weixinb.png") no-repeat center center; background-size:cover; cursor: pointer; } */

/* .footer .fcont .point { border-bottom:1px solid #009ee7; }
.footer .fcont .point:hover { color:#009ee7; cursor: pointer; border-bottom: none; }

.footer .fcont .fci { width:15px; margin-right:10px; }
.footer .fcont table td { padding:4px 0px; }
.footer .fcont .notice,.copyright { padding:4px 0px; }
.footer .fcont .notice .tu { margin-left:15px; }
.footer .fcont .fl { margin:0px auto; } */

::-webkit-input-placeholder{ color:#474747; }
/* select 改變按鈕圖示 */
select {
    background: url("./images/arrow.png") no-repeat center center;
    background-position:calc(100% - 20px) 50%;
    -webkit-appearance: none;
    -moz-appearance: none;
}
/* ie remove arrow */
select::-ms-expand {
    display: none;
}

@media (max-width:1200px) {
        /* .position .menu li { font-size:1rem; } */
}

@media (max-width:1199.98px) and (min-width:992px){
    .top .topall .topmenu .logo { height:36px; margin:12px 0px; }
}

@media (min-width:992px) {
    /* .f_br { display:none; } */
    .top .topall { height:120px; background: url("./images/bg_pc_menu.png") repeat-x; }
    /* .top .topall .topmenu .menu .submenu a { padding:32px 0px; } */
    /* .top .topall .topmenu .menu .submenu a:hover { background:url("./images/bg_btn.png") repeat-x center bottom; color:#c7eefd; } */
}

@media (max-width:991.98px) {
    .top { height:80px; }
    .top .topall { top:-40px; padding:0px; background:url("./images/bg_phone_menu.png") repeat-x; }
    .top .topall .topmenu { padding:0px; }
    .top .topall .topmenu .logo { left:40px; top:10px; }
    .top .topall .topmenu .menu { width:100%; padding:0px; position:relative; }
    .top .topall .topmenu .menu .lastmenu .line { display: none; }
    /* .top .topmenu .menu #navbarMenu { top:80px; } */
    .top .topmenu .menu .submenu { display: block; text-transform: uppercase; margin:10px 30px; border-bottom: 1px solid #00679c; }

    .position .jobdata .job .security .send { margin-top:0px; }
    .position .jobdata .job .security div { margin-bottom:20px; }
    .position .jobdata .job .security .conf { margin-bottom:0px; }

    /* .footer { font-size:0.8rem; } */
    /* .footer .container { max-width: 760px; } */
}

@media (min-width:768px){
    /* .footer .pic { height:48px; } */
    /* .footer .fcont { margin-top:20px; } */
    /* .footer .fcont .fr { text-align:right; } */
    .position .menu select { display: none; }

    .pgn .md_top { display: none; }
}

@media (max-width:767.98px){
    .catalog { display:none; }
    .position { display: block; }
    .position .menu { padding:0px; padding:60px 0px; }
    .position .menu ul { display: none; }
    .position .menu select { width:100%; border:1px solid #c6c6c6; font-size:1.2rem; color:#777777; font-weight:bold; padding:10px 0px; padding-left:20px; }
    .position .menu .title { margin-right:0px; font-size:2rem; text-align: center; border-bottom:none; }
    .position .jobdata .job .working { display: block; }

    .position .jobdata .job .icon,
    .position .jobdata .job .back { float:none; text-align: center; width:100%;  }
    .position .jobdata .job .icon { margin-bottom:20px; }
    
    .position .jobdata .job .txt { font-weight: bold; }

    .pgn .larr,.pgn .rarr { position:static; }
    .pgn .con { display:flex; justify-content: space-between; }
    .pgn .pbtn { margin:0px; width:60px; height:60px; font-size:1.5rem; padding:18px 0px; }
    .pgn .active { background-color: transparent; color:#474747; font-weight: bold; width:auto; }
    .pgn .page:not(.active){ display:none; }
}

/* @media (min-width:576px) and (max-width:767.98px){
    .top { height:110px; }
    .top .topall .topmenu .logo { left:30px; top:25px; }
    .top .topall .topmenu { height:110px; background-color:#15293f; }
    .top .topall .topmenu .menu .topbtn { width:110px; height:110px; font-size:2rem; }
    .top .topall .topmenu .menu .btn_lan { right: 110px; }
    .top .topall .topmenu .menu .submenu { font-size:2.2rem; }

    .position .menu .title { font-size:3rem; }
    .position .menu select { font-size:2rem; padding:20px 0px 20px 20px; }
    .position .jobdata .job .title { font-size:2.5rem; }
    .position .jobdata .job .working .subt { font-size:1.5rem; }
    .position .jobdata .job .working .subt2 { font-size:1.75rem; }
    .position .jobdata .job .des { font-size:1.75rem; }
    .position .jobdata .job .detail { font-size:1.75rem; }
    .position .jobdata .job .icon { margin-bottom:40px; }
    .position .jobdata .job .icon span { width:64px; height:64px; font-size:2rem; padding:16px 0px; }
    .position .jobdata .job .back { font-size:2rem; }
    .position .jobdata .job .back i { font-size:3rem; }

    .position .jobdata .job .txt { font-size:2rem; }
    .position .jobdata .job label { font-size:1.5rem; }
    .position .jobdata .job input,
    .position .jobdata .job textarea { font-size:1.5rem; }
    .position .jobdata .job textarea { height:8rem; }
    .position .jobdata .job .security div { margin-bottom:30px; }
    .position .jobdata .private { font-size:1.5rem; }

    .pgn .active { font-size:2rem; }

} */

@media (max-width:767.98px){
    .top .topall .topmenu .menu .topbtn { width:60px; }
    .top .topall .topmenu .menu .btn_lan { right: 60px; }
    .top .topall .topmenu .logo { left:10px; height:28px; margin:16px 0px; }

    .pgn .pbtn { width:32px; height:32px; font-size:0.875rem; padding:9px 0px; }
    .pgn .active { font-size:1rem; height:32px; }
}