@charset "utf-8";
/* CSS Document */
footer {background: url("../images/bg_03.jpg") no-repeat bottom left; background-size: cover; padding: 70px 0 45px 0;}
footer > div > ul {width: 100%; display: flex; flex-wrap: wrap;}
footer > div > ul > li:nth-child(1) {width: 11.2%; padding: 0 0 15px 0!important; line-height: 0; border-right: 1px solid #595b59; position: relative;}
footer > div > ul > li:nth-child(1) a:nth-child(1) {display: block;}
footer > div > ul > li:nth-child(1) a:nth-child(1)::after {content: attr(data-title); max-width: 110px; font-size: 18px; line-height: 21px; color: #fff; font-family: 'Noto Sans TC', sans-serif; display: block; margin: 13px 0 0 0px;}
footer > div > ul > li:nth-child(1) a:nth-child(2) {display: block; width: 40px; margin-top: 30px;}
footer > div > ul > li:nth-child(2) {width: 64.27%; padding: 0 30px 15px 40px!important; display: flex; flex-wrap: wrap; color: rgba(255, 255, 255, 0.8);}
footer > div > ul > li:nth-child(2) > div:nth-child(1) {width: 50%; padding: 0 0px 0 0;}
footer > div > ul > li:nth-child(2) > div:nth-child(2) {width: 50%; padding: 0 0 0 30px;}
footer > div > ul > li:nth-child(2) > div > .tit, footer > div > ul > li:nth-child(2) > div h5 {margin: 0 0 25px 0;}
footer > div > ul > li:nth-child(2) > div > ul {width: 100%;}
footer > div > ul > li:nth-child(2) > div > ul li {display: flex; flex-wrap: nowrap; align-items: center; padding: 5px 0 6px 5px!important; line-height: 1.3; font-size: 100%;}
footer > div > ul > li:nth-child(2) > div > ul li a:link, footer > div > ul > li:nth-child(2) > div > ul li a:visited {text-decoration:none; overflow: hidden; z-index: 10; color: rgba(255, 255, 255, 0.8); transition: all 1s ease 0s;}
footer > div > ul > li:nth-child(2) > div > ul li a:active, footer > div > ul > li:nth-child(2) > div > ul li a:hover {text-decoration:none; color: rgba(255, 255, 255, 1); padding: 0 10px; border-radius: 120px; cursor:pointer; transition: all 1s ease 0s;}
footer > div > ul > li:nth-child(2) > div > ul li::before {content: ''; background-size: cover; width: 19px; height: 19px; margin-right: 10px; display: inline-block;}
footer > div > ul > li:nth-child(2) > div > ul li:nth-child(1)::before {background: url("../images/icon_06a.png") no-repeat center;}
footer > div > ul > li:nth-child(2) > div > ul li:nth-child(2)::before {background: url("../images/icon_06b.png") no-repeat center;}
footer > div > ul > li:nth-child(2) > div > ul li:nth-child(3)::before {background: url("../images/icon_06c.png") no-repeat center;}
footer > div > ul > li:nth-child(2) > div > ul li:nth-child(4)::before {background: url("../images/icon_06d.png") no-repeat center;}
footer > div > ul > li:nth-child(3) {width: 24.53%; padding: 0 0 15px 40px!important; border-left: 1px solid #595b59;}
footer > div > ul > li:nth-child(3) > a {display: block;}
footer > div > ul > li:nth-child(3) > a::after {content: attr(data-title); font-size: 18px; line-height: 21px; color: #fff; display: block; margin: 10px 0 0 0px;}
footer > div > ul > li:nth-child(3) > ul {width: 100%; padding: 20px 0 0 0!important;}
footer > div > ul > li:nth-child(3) > ul li {display: flex; flex-wrap: nowrap; align-items: center; padding: 5px 0 6px 5px!important; line-height: 1.3; font-size: 100%;}
footer > div > ul > li:nth-child(3) > ul li a:link, footer > div > ul > li:nth-child(3) > ul li a:visited {text-decoration:none; overflow: hidden; z-index: 10; color: rgba(255, 255, 255, 0.8); transition: all 1s ease 0s;}
footer > div > ul > li:nth-child(3) > ul li a:active, footer > div > ul > li:nth-child(3) > ul li a:hover {text-decoration:none; color: rgba(255, 255, 255, 1); padding: 0 10px; border-radius: 120px; cursor:pointer; transition: all 1s ease 0s;}
footer > div > ul > li:nth-child(3) > ul li::before {content: ''; background-size: cover; width: 19px; height: 19px; margin-right: 10px; display: inline-block;}
footer > div > ul > li:nth-child(3) > ul li:nth-child(1)::before {background: url("../images/icon_06a.png") no-repeat center;}
footer > div > ul > li:nth-child(3) > ul li:nth-child(2)::before {background: url("../images/icon_06c.png") no-repeat center;}
footer > div > ul > li:nth-child(3) > ul li:nth-child(3)::before {background: url("../images/icon_06d.png") no-repeat center;}
footer > div > ul > li:nth-child(4) {width: 100%; padding: 55px 0 0 0; color: rgba(255, 255, 255, 0.3); text-align: center; line-height: 20px;}

.two_icon{display: flex;justify-content: space-between;align-items: center;    margin-top: 30px;max-width: 104px;}
.two_icon a:nth-child(2){margin: 0px !important;}
.two_icon a:nth-child(1)::after{margin: 0px !important;}

@media only screen and (max-width: 992px){ 
  .two_icon a:nth-child(1)::after{margin: 0 0 0px 10px !important;}
  footer > div > ul > li:nth-child(1) { width: 100%; border-right: 0; }
  footer > div > ul > li:nth-child(2) { width: 100%; padding: 0 0 20px 0!important; }
  footer > div > ul > li:nth-child(3) { width: 100%; display: block; padding: 0 0 15px 10px !important; }
  footer > div > ul > li:nth-child(3) a { text-align: left; padding-left: 10px; }
}
@media only screen and (max-width: 576px){
  footer > div > ul > li:nth-child(2) > div:nth-child(1) { width: 100%; padding: 0 0 30px 0; }
  footer > div > ul > li:nth-child(2) > div:nth-child(2) { width: 100%; padding: 0px; }
}
@media only screen and (max-width: 430px){ 
  .two_icon a:nth-child(2){position: unset !important;}
  .two_icon a:nth-child(1)::after{display: inline-block !important;}
  
}



