@charset "utf-8";
body{margin:0; font-family:'微軟正黑體';}


body.probg{ background:url(../images/others/ap.jpg);}


.clean{ clear:both;}
.content{margin:auto; width:1600px; height:auto; display:block;}
.content img{ display:block; width:100%; height:auto;}

.company{ position:absolute; right:10px; top:40px; width:161px;  }
.company .logo_02{ display:block; width:auto; margin:10px 0px 0px 0px; text-align:center;}
.company .item{ display:block;  border-radius:50em; border:2px solid #0068d2;}
.company a.link_01{ display:inline-block; color:#fff; cursor:pointer; background:#0068d2; height:28px; line-height:28px; border-radius:50em 1px 1px 50em;text-align:center; vertical-align:top; font-size:16px; width:calc(100%/2); }
.company a:hover.link_01{background:#284356; transition:0.4s;}

.company a.link_02{ display:inline-block; width:calc(100%/2 - 4px); height:28px; line-height:28px; border-radius:1px 50em  50em 1px ; background:#fff; vertical-align:top; }
.company a.link_02 img{ display:block; margin:5px auto auto auto; text-align:center; vertical-align:middle;}

/*新連結*/
.link{ position:absolute; right:0; top:10px;}
.link li{ display:inline-block; background:url(../images/others/icon_24.jpg) left 50% no-repeat; padding:0 15px; text-align:center;}
.link li a{ color:#626262; font-size:15px; }
.link li.aon a{ color:#2887ed;}
.link li a.search{ padding-right:22px; background:url(../images/others/icon_23.jpg) right 50% no-repeat;} 
.link li a:hover{ color:#2887ed; text-decoration:underline;}



footer{ display:block; background:#152e44;}
.foot{ display:block; width:1400px; margin:auto; padding:25px 0;}
.foot span.btm_logo{ display:inline-block; width:700px; vertical-align:top; margin:0px 0 20px 0; }
.foot span.btm_logo img{ display:inline-block; margin-right:60px;}
.foot span.btm_logo img:nth-child(3){ margin-right:0;}

.foot ul{ display:inline-block; }
.foot li{ display:inline-block; font-size:18px; padding-right:25px; background:url(../images/idx/icon_01.jpg) right 50% no-repeat; font-family:'Lato'; margin-left:25px;}
.foot li:last-child{ background:none; padding-right:0;}
.foot li:first-child{ margin-left:0;}
.foot li a{ color:#fff;}
.foot li a:hover{ text-decoration:underline;}
.foot b{ display:block; font-size:20px; color:#fff; }
.foot p{ display: inline-block; padding-right:25px; font-size:15px; color:#fff;}


/*麵包屑*/
ul.tag{ display:block; text-align:right; font-family:Helvetica; color:#fff; margin:110px 0 20px 0;  }
ul.tag li{ display:inline; font-family:'微軟正黑體'; }
ul.tag li a{color:#fff; font-size:16px;text-decoration:none;  padding:0 5px;}
ul.tag li a:hover{color: #fff; text-decoration:underline;}

ul.tag li::before {
        content: "/";
    }

    ul.tag li:first-child::before {
        content: "";
    }

/*showpage*/
.quotes {margin:60px 0 0 0; height:60px; text-align:center; width:100%; font-size:20px;  line-height:60px;  font-family:'Lato'; display:block;}
.quotes A {COLOR: #fff; margin-right:7px;  display:inline-block; vertical-align:middle; width:60px; height:60px; line-height:60px; margin-right:3px; background:#aaa; }
.quotes EM{ float: right; width:60px; padding-left:25px; height:50px;color:#79AC00;font-weight:bold; text-align:leftl }
.quotes EM a,.quotes EM a:hover{ color:#79AC00; font-size:18px; text-decoration:none; background:none;  }
.quotes A:hover {COLOR: #fff; background:#737373; margin-right:3px;  width:60px; height:60px; line-height:60px; text-align:center;}
.quotes A:active { COLOR:#EA6C00; margin-right:3px; width:60px; height:60px; line-height:60px; text-align:center; border:1px solid #cccccc;}
.quotes SPAN.current {FONT-WEIGHT: bold; COLOR:#ffffff; background:#737373; margin-right:3px; width:60px; height:60px; line-height:60px; display:inline-block; vertical-align:middle;}

/*手機版選單*/
.mobile-side-menu { display:none;

  width: 240px;
  background-color: #1b1b1b;
  bottom: 0px;
  z-index: 30;
  overflow-x: hidden;
  /* has to be scroll, not auto */
  -webkit-overflow-scrolling: touch;
}

.mobile-side-menu ul {
  float: none; 
  display: inline-block;
  margin: auto;
  width: 100%; 
  height:100%;
  background-color: #1b1b1b;
  border-radius: 5px;
  list-style: none;
}

.mobile-side-menu ul > li {
  text-align: left;
  padding-left: 8px;
  border-top: solid 1px #3f3f3f;
  border-bottom: solid 1px #000;
}

.mobile-side-menu ul > li > a {
  text-transform: capitalize;
  text-decoration: none;
  line-height: 20px;
  position: relative;
  display: block;
  font-size: 14px;
  color: white;
  padding: 15px 5px 15px 10px;
}

.noscroll {
  position: fixed;
  right: 0;
  top: 0;
  overflow: hidden;
}

.overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  height:100%;
  width: 100%;
  z-index: 30;
  background-color: rgba(0, 0, 0, 0.7);
}

.navbar {
  background-color: #fff;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  box-shadow: 0 5px 8px rgba(0, 0, 0, 0.4);
}
button { border:0; padding:5px;}
button a { color:#fff; text-decoration:none;}
.navbar .toggleMenu { float:right; margin: 20px 10px 15px 10px; border:0; background-color:#000; border-radius:4px; color:#fff; padding:10px; }

.mobil_logo{ float:left; margin:25px 20px 10px 10px;  width:161px; height:auto;}
.mobil_logo img{ width:100%; height:auto;}

.mobil_logo_02{ float:left; margin-right:10px; margin-top:25px;}





@media only screen and (max-width:1599px)
{
.content{width:100%;}

.footer{width:100%;}

    .mobil_logo_02 {
        float: left;
        margin-left: 10px;
        margin-top: 20px;
        width: 180px;
    }
	}

@media only screen and (max-width:1450px)
{
.foot{ display:block; width:calc(100% - 40px); margin:auto; padding:20px;}
}

@media only screen and (max-width:1300px)
{
body.probg{ background:none;}	

	}

@media only screen and (max-width:1100px)
{
.mobile-side-menu {
  height:calc(100% - 91.3px) !important;
}
.mobile-side-menu ul li:last-child{ display:block; padding:15px 0;}
}

@media only screen and (max-width:768px)
{
.foot span.btm_logo{ display:inline-block; width:100%; vertical-align:top; margin:0px 0 20px 0; }
.foot b{ margin-top:20px;}
.foot li{ padding:0 20px 0 20px; width: auto; margin:0; text-align:center; background: url(../images/idx/icon_01.jpg) left 50% no-repeat;}

body.probg{ background:none;}

	}
	
@media only screen and (max-width:1024px)
{	
.mobil_logo{ width:150px;}

.mobile-side-menu { 
top:65.8px !important;
  height:calc(100% - 65.8px) !important;
}


    .mobil_logo_02 {
        float: left;
        margin-left: 10px;
        margin-top: 20px;
        width: 180px;
    }

}
@media only screen and (max-width:1024px) {
    .navbar .toggleMenu {
        margin-top: 20px;
    }

    .mobil_logo {
        width: 150px;
        margin-top: 20px;
    }

    .mobil_logo_02 {
        float: left;
        margin-left: 10px;
        margin-top: 20px;
        width: 180px;
    }
}