@charset "utf-8";
/* CSS Document */
footer {background: #3ca5ee; color: #fff; padding: 39px 0 0 0; margin: 0 -17px 0 0;}
.footer {display: flex; flex-flow: wrap; position: relative; z-index: 1; padding: 0 0 clamp(30px, 2.56vw, 49px) 0; margin: 0;}
.footer::after {content: ''; height: 1px; background: #7ccdf6; position: absolute; bottom: 0; left: 8px; right: -7px; z-index: -1;}
.bg_slide a:link, .bg_slide a:visited {text-decoration:none; color:#fff; display: block; position: relative; z-index: 1; transition: all 0.5s ease 0s;}
.bg_slide a:active, .bg_slide a:hover {text-decoration:none; color:#d1892d; cursor:pointer; transition: all 0.5s ease 0s;}
.bg_slide a::after {content: ''; background: #fff; width: 0; position: absolute; top: -4px; right: -6px; bottom: -2px; z-index: -1; opacity: 0; transition: all 0.5s ease 0s;}
.bg_slide a:hover::after {left: -6px; width: calc(100% + 12px); opacity: 1;}
.footer > .logoF {width: 19.028%; line-height: 0; font-size: 0; display: flex; flex-flow: wrap; justify-content: center; padding: 0 1.39% 0 1.737%;}
.footer > .mai {width: calc(100% - 19.028% - 17.5%); display: flex; flex-flow: wrap; align-items: flex-start; padding: 5px 0 0 clamp(20px, 2.82vw, 54px);}
.footer h5.tit {color: #ffcc00; font-weight: 500; line-height: 1.25; letter-spacing: 1.78px; padding: 0; margin: 0 0 18px 1px;}
.footer ul li {font-family: "Roboto", 'Noto Sans TC', sans-serif; font-weight: 500; line-height: 1.556; letter-spacing: 0.4px;}
.footer > .not {width: 38.334%; padding: 7px 20px 0 clamp(20px, 2.82vw, 54px);}
.footer > .not > ul li {padding: 3px 0; display: flex; flex-flow: row; width: 100%;}
.footer > .not > ul li > .img {width: 100%; max-width: 35.5px; line-height: 0; font-size: 0;}
.footer > .not > ul li:hover > .img {-webkit-animation-name: hvr-buzz-out; animation-name: hvr-buzz-out; -webkit-animation-duration: 0.75s; animation-duration: 0.75s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: 1; animation-iteration-count: 1;}
.footer > .not > ul li > .tit {width: 100%; max-width: 92.5px;}
.footer > .not > ul li > .txt {width: 100%; max-width: calc(100% - 35.5px - 92.5px);}
.footer > .men {width: 25.14%; padding: 7px 20px 0 0;}
.footer > .men > ul {display: flex; flex-flow: wrap; padding: 6px 14.621% 0 0;}
.footer > .men > ul > li {letter-spacing: 1.4px; position: relative; z-index: 1; padding: 0 17px 8px 20px;}
.footer > .men > ul > li::before {content: ''; background: #ffcc00; width: 3px; height: 4px; border-radius: 50%; position: absolute; top: 11px; left: 8px;}
.footer > .men > ul > li:hover::before {-webkit-animation-name: hvr-buzz-out; animation-name: hvr-buzz-out; -webkit-animation-duration: 0.75s; animation-duration: 0.75s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: 1; animation-iteration-count: 1;}
.footer > .she {width: 17.498%; padding: 7px 0 0 0;}
.footer > .she > .lis {display: flex; flex-flow: wrap; padding: 5px 0 0 0; margin: 0 0 0 -1px;}
.footer > .she > .lis > a {width: 57px; height: 57px; border-radius: 50%; border: 4px solid #103984; background: #fff; display: flex; flex-flow: wrap; justify-content: center; align-items: center; margin: 0 21px 10px 0;}
.footer > .she > .lis > a:last-child {margin: 0 0 10px 0;}

.copyright {font-family: "Roboto", 'Noto Sans TC', sans-serif; font-weight: 400; line-height: 1.2222222; letter-spacing: 0.87px; text-align: center; padding: 30px 0; margin: 0; position: relative; z-index: 10;}