/* CSS Document */
a.tel, a.tel:hover { pointer-events: none; text-decoration:none !important; }
@media print, screen and (max-width: 999px){
a.tel, a.tel:hover { pointer-events: initial; }
}

#gotop { display: none; position: fixed; right:5px; bottom:100px; cursor: pointer;  z-index:20; text-align: center;}
#gotop a { display:inline-block; width:50px; height:50px; border-radius: 100%; line-height: 50px; color:#929292; opacity:0.5;  background:#f5f5f5; font-size: 12px; box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.2);}
#gotop a:before { content: ""; display: block; width: 0;height: 0;border-style: solid;border-width: 0 7px 9px 7px;border-color: transparent transparent #929292 transparent; margin: 10px auto -10px auto; line-height: 100%;}
#gotop a:hover { opacity:1;  }


footer { background: #d5d5d5;}
.footer-top { background: url(../images/footer-top-bg.jpg) no-repeat top center; background-size: cover; height: 48px;}
.footer-main { padding: 30px 20px;}
.footer-main-content { padding-left: 100px; display: flex; flex-direction: row; flex-wrap: wrap; max-width: 1300px;}
.footer-main-content > div:nth-of-type(1) { width: 20%;}
.footer-main-content > div:nth-of-type(3) { width: 10%;}
.footer-main-content > div:nth-of-type(2) { width: 70%; padding: 0 55px;}
.footer-title { min-height: 98px; position: relative; border-bottom: 1px solid #484848; margin-bottom: 18px;}
.footer-title:after { content: ""; position: absolute; width: 4px; height: 4px; border-radius: 100%; background: #484848; right: 0; bottom: -2px;}
.footer-title-1 { line-height: 0; }
.footer-title-1 img { position: relative; margin-left: -90px; max-width: 300px;}
.footer-title-2 { padding-top: 55px; font-size: 14px ;color: #484848; font-weight: bold;}

.footer-info { display: flex; flex-direction: row; flex-wrap: wrap;}
.footer-info > div {margin-bottom: 8px;}
.footer-info > div:nth-child(odd) { width: 35px;}
.footer-info > div:nth-child(odd) img { width: 28px;}
.footer-info > div:nth-child(even) { width: calc(100% - 35px); font-size: 15px; color: #484848; border-left: 1px solid #484848; padding-left: 8px;}
.footer-info > div:nth-child(even) a { color: #484848;}

.footer-link { display: flex; flex-direction: row; flex-wrap: wrap; font-size: 15px; justify-content: space-around; letter-spacing: 0; line-height: 190%;}
.footer-link > div { padding-right: 7px; width: 25%;}
.footer-link > div > a { display: block; font-weight: bold; color: #000; margin-bottom: 6px;}
.footer-link > div > a:hover { opacity: 0.5;}
.footer-link2 > a { display: block; color: #484848;}
.footer-link2 > a:hover { opacity: 0.5;}
.footer-link > div:nth-child(1) { order: 1;}
.footer-link > div:nth-child(2) { order: 2;}
.footer-link > div:nth-child(3) { order: 5;}
.footer-link > div:nth-child(4) { order: 3;}
.footer-link > div:nth-child(5) { order: 6;}
.footer-link > div:nth-child(6) { order: 7;}
.footer-link > div:nth-child(7) { order: 4;}
.footer-link > div:nth-child(8) { order: 8;}

.social-link { display: flex; flex-direction: row; flex-wrap: wrap; }
.social-link > a { display: inline-block; margin-right: 18px; margin-bottom: 5px;}
.social-link > a:hover { opacity: 0.5;}
.social-link > a img { height: 27px;}

.copyright { background: #484848; padding: 10px 20px; color: #fff;  font-size: 14px; text-align: center;}
.copyright a { color: #fff;}
.copyright > div { display: inline-block;}
.copyright > div:nth-of-type(1) { padding-right: 25px;}

/* 線上展 */

.online_exh{
  position: fixed;
  right: 5px;
  border: 1px solid #fff;
  box-shadow: 0 2px 15px rgba(0,0,0,0.5);
  padding: 5px 10px;
  border-radius: 2px;
  bottom: 40%;
  text-align: center;
  background-color: #0D76C9;
  padding: 5px 0px 5px 2px;
  transition: all .3s;
  z-index: 99;
  display: flex;
}
.online_exh.off{
  right: -74px;
  transition: all .3s;
}
.online_exh_open{
  color: #fff;
  display: flex;
  align-items: center;
  border-right: 1px solid #fff;
  padding: 0 6px 0 5px;
  cursor: pointer;
  width: 23px;
}
.online_exh.off .online_exh_open{
  transform: scale(-1);
  border: 0;
  padding: 0 5px 0 8px;
}
.online_exh_txt:link, .online_exh_txt:visited{
  color: #fff;
  font-size: 16px;
  display: block;
  width: 74px;
  line-height: 150%;
  padding:4px 8px;
}

@media only screen and (max-width:  1200px) {
    .footer-link { font-size: 15px; letter-spacing: 0; flex-wrap: wrap; justify-content:flex-start; }
    .footer-link > div { padding-right: 30px; padding-bottom: 15px;width: auto;}
    .footer-main-content { padding-left: 0;}
    .footer-title-1 img { margin-left: 0px; }
    .footer-main-content > div:nth-of-type(1), .footer-main-content > div:nth-of-type(3) { width: 100%;}
    .footer-main-content > div:nth-of-type(2) { width: 100%; padding: 0;}
    .footer-title { min-height: inherit;}
    .footer-title-2 { padding-top: 30px; padding-bottom: 10px}
    
    .copyright > div { display: block;}
    .copyright > div:nth-of-type(1) { padding-right: 0px;}
}

@media only screen and (min-width:1201px){
 .footer-link > div:nth-of-type(7) a{width: 74px;}
 .footer-link > div:nth-of-type(8) a{width: 88px;}
 .footer-main-content > div:nth-of-type(2) { padding: 0 30px;}
}