@charset "utf-8";
*{ transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; }

body{ font-family:Arial, "微軟正黑體", "新細明體"; }

.color-gray{ color:#615f61; }
.color-red{ color:#de072a; }
.size-20{ font-size:20px !important; }
.fa{ vertical-align:middle; }
.mar_lr_5{ margin:0 5px; }
.mar_t_78{ margin-top:78px; }
.mar_b_20{ margin-bottom:20px; }
.mar_b_35{ margin-bottom:35px; }
.mar_b_0_mob{ margin-bottom:0 !important; }
.mar_b_35_mob{ margin-bottom:35px; }
.mar_0{ margin:0 !important; }
.pad_lr_0_mob{ padding:0; }
.block_mob{ display:none; }
.text-left{ text-align:left !important; }
	

.header{ width:100%; height:78px; border-bottom:1px solid #ccc; padding:14px 0; position:fixed; top:0; left:0; z-index:100; background:#fff; }
.header .logo{ display:block; width:158px; height:50px; background-image:url(../images/layout/logo.jpg); background-repeat:no-repeat; transition:none; -webkit-transition:none; -moz-transition:none; }
.nav{ margin-left:25px; }
.navbar-brand, .navbar-nav>li>a{ color:#444; font-size:18px; }

.header .right-nav{ position:absolute; top:6px; right:0; width:240px; }
.header .right-nav .grids{ display:inline-block; vertical-align:middle; padding:0 20px; }
.header .right-nav .grids a{ display:inline-block; vertical-align:middle; }
.header .right-nav .grids a:hover{ opacity:0.5; text-decoration:none; }
.header .right-nav .grids a:focus{ text-decoration:none; }
.header .right-nav .grids .txts{ display:inline-block; vertical-align:middle; font-size:15px; color:#444; }
.header .right-nav .grids .icons{ display:inline-block; vertical-align:middle; width:20px; }
.header .right-nav .grids .icons img{ width:100%; }
.header .right-nav .divider{ height:64px; display:inline-block; vertical-align:middle; width:1px; background:#eee; }


.header .right-login{ position:absolute; top:6px; right:0; z-index:1; width:134px; }
.header .right-login .grids{ position:absolute; left:0; right:0; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); padding:0 20px; }
.header .right-login .grids a{ display:inline-block; vertical-align:middle; }
.header .right-login .grids a:hover{ opacity:0.5; text-decoration:none; }
.header .right-login .grids a:focus{ text-decoration:none; }
.header .right-login .grids .txts{ display:inline-block; vertical-align:middle; font-size:15px; color:#444; }
.header .right-login .grids .icons{ display:inline-block; vertical-align:middle; width:20px; font-size:0; }
.header .right-login .grids .icons img{ width:100%; }
.header .right-login .divider{ height:64px; display:inline-block; vertical-align:middle; width:1px; background:#eee; }
.header .right-login .grids .logout{ display:block; text-align: center; }
.header .right-login .grids .logout a{ text-decoration: none; color: #666; font-size: 12px; background: #eee; padding: 2px 10px; border-radius: 3px; }
.header .right-login .grids .txtBox{ font-size:14px; margin: 0 0 5px 0; text-align: center; }

.footer{ background:#de072a; padding:50px 0; margin-top:100px; }
.footer.actleft{ margin-left:25%; }
.footer .centers{ text-align:center; }
.footer .flogo{ display:inline-block; width:126px; height:40px; background-image: url(../images/layout/flogo.jpg); background-repeat:no-repeat; transition:none; -webkit-transition:none; -moz-transition:none; }
.footer .ltext{ padding:44px 0 0 0; }
.footer .ltext .grids{ display:inline-block; vertical-align:middle; padding:0 10px; font-size:18px; color:#fff; }
.footer .copytxt{ padding:30px 0 0 0; color:#f4c0bd; font-size:12px; }
.footer .copytxt.pads{ padding:0; }

@media (max-width: 991px){
.mar_t_20_mob{ margin-top:20px; }
.mar_t_50_mob{ margin-top:50px; }
.mar_t_0_mob{ margin-top:0px !important; }
.mar_lr_0_mob{ margin-left:0; margin-right:0; }
.color_pink_m{ color: #ffafb0; }
.block_pc{ display:none; }
.block_mob{ display:inline-block; }
	
.navbar-header{ width:100%; margin:auto !important; }
.header{ height:50px; padding: 9px 0; }
.header .logo{ width:88px; height:28px; margin: 0 0 0 40px; background-image:url(../images/layout/logo_m.jpg); background-size:100%; -webkit-background-size:100%; -moz-background-size:100%; }
.navbar-collapse.collapse { display:none !important; }
.collapse.in { display: block !important; }
.header .navbar-toggle { position: absolute; z-index: 9; padding:0; margin:auto; height: auto; left:10px; top: 0; bottom: 0; z-index: 102; }
.navbar-toggle { display:block; }
.navbar-toggle .icon-bar{ background-color:#fff; }
.navbar-toggle .icon-bar:nth-child(2){transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform-origin: 22% 100%; -webkit-transform-origin: 22% 100%; -moz-transform-origin: 22% 100%; }
.navbar-toggle .icon-bar:nth-child(3){display:none;}
.navbar-toggle .icon-bar:nth-child(4){transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform-origin: 38% 90%; -webkit-transform-origin: 38% 90%; -moz-transform-origin: 38% 90%; }
.navbar-toggle.collapsed .icon-bar{ background-color:#e10133; }
.navbar-toggle.collapsed .icon-bar:nth-child(2){transform:none; -webkit-transform:none; -moz-transform:none;}
.navbar-toggle.collapsed .icon-bar:nth-child(3){display:block;}
.navbar-toggle.collapsed .icon-bar:nth-child(4){transform:none; -webkit-transform:none; -moz-transform:none;}

.header .right-login{ top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); width:auto; }
.header .right-login .grids{ padding:0 10px; position:relative; transform:none; -webkit-transform:none; -moz-transform:none; border-left:1px solid #e8e8e8; }
.header .right-login .divider{ display:none; }
.header .right-login .grids .txtBox{ margin:0 0 2px 0; font-size:12px; }
.header .right-login .grids .logout{ text-align:right; }
.header .right-login .grids .logout a{ font-size:12px; padding: 2px 10px; }

.footer{ padding:15px 0; margin-top: 50px; }
.footer.actleft{ margin:50px 0 0 0; }
.footer .flogo{ width:63px; height:20px; background-size:100%; }
.footer .ltext{ padding:15px 0 0 0; font-size:0; }
.footer .ltext .grids{ font-size:12px; width: 50%; margin: 5px 0; }
.footer .ltext .grids:nth-child(even){ border-left:1px solid #ff7373; }
.footer .copytxt{ padding:15px 5px 0 5px; }

#top-navbar{ position:fixed; top:0; left:0; right:0; bottom:0; z-index:101; background-color: rgba(210,29,29,.95);  }
.nav{ margin:0 auto; float:none; padding:40px 0 0 0; }
.navbar-nav>li{ float:none; text-align:center; }
.navbar-nav>li>a{ display: inline-block; color:#fff; font-size:14px; }
.nav>li>a:focus, .nav>li>a:hover { text-decoration: none; background:none; }
.header .right-nav{ position:static; margin:0 auto; }
.header .right-nav .grids{ display:block; text-align:center; padding:15px 0 0 0; }
.header .right-nav .grids.login{ padding:10px; margin-top:20px; border-top: 1px solid #ff6668; }
.header .right-nav .grids .txts{ color:#fff; }
.header .right-nav .divider{ display:none; }

}


/*頁碼*/
.page_number{ position:relative;}
.page_number,
.page_number *{ box-sizing:border-box; }
.page_number .btn{ display: inline-flex; align-items: center; justify-content: center; min-width:30px; padding:0 10px; background-color: #fff; line-height:30px; height:30px; font-size:14px; color:#555; border:1px solid #ccc; vertical-align:top; margin:0 2px; text-align:center;}
.page_number .btn.focus{ border:1px solid #0889ca; background-color:#0889ca; color:#fff; font-weight:bold;}
.page_number .btn .fa{ line-height:28px;}
.page_number .btn.looking{ color:#ccc; border-color:#ddd; cursor:not-allowed;}
.page_number .quantity{ font-size:12px; color:#555; /*position:absolute; */top:0; right:6px; line-height:30px;}
.page_number .quantity .fa{ padding-right:5px;}

/*頁碼-Theme-SKM*/
.page_number.Theme-SKM .btn{ color: #999; border: 1px solid #999; border-radius: unset; }
.page_number.Theme-SKM .btn.focus{ color: #fff; background-color: #de072a; border-color: #de072a; outline: #de072a; }
.page_number.Theme-SKM .btn.prev{ border-top-left-radius: 4px; border-bottom-left-radius: 4px; }
.page_number.Theme-SKM .btn.next{ border-top-right-radius: 4px; border-bottom-right-radius: 4px; }


@media screen and ( max-width: 1200px) {
    /*頁碼*/
    .page_number{ text-align:center; padding-bottom:30px; position:relative; font-size:0; }
    .page_number .quantity{ text-align:center; top:auto; bottom:0; left:0; right:0; margin:auto; }
    .page_number .btn{ height:30px; line-height:30px; }
    .page_number .btn .fa{ line-height:24px; }

    /*頁碼-Theme-SKM*/
    .page_number.pageStyle{ padding: 35px 0 30px 0; }
}