@charset "utf-8";
/* CSS Document */
.banner {line-height: 0; font-size: 0;}
.title_a {color: #215eab; letter-spacing: 5px; font-weight: 500;}
.title_a span {font-weight: 100; letter-spacing: 2px;}
.title_b {color: #fff; letter-spacing: 5px; font-weight: 500;}

.ind_A {max-width: 1525px; padding: 85px 20px; margin: auto; display: flex; flex-wrap: wrap;}
.ind_A > div:nth-child(1) {width: 56.55%; line-height: 0; font-size: 0; position: relative;}
.ind_A > div:nth-child(1) ul, .ind_A > div:nth-child(1) ul li {list-style-type:none; margin: 0; padding: 0;}
.ind_A > div:nth-child(1) ul {display: flex; flex-wrap: wrap;}
.ind_A > div:nth-child(1) ul li {width: 50%; padding: 0 6px 0px 0; margin-bottom: 12px; position: relative; line-height: 0; font-size: 0;}
.ind_A > div:nth-child(1) ul li:nth-child(2n+2) {width: 50%; padding: 0 0 0px 6px; margin-bottom: 12px;}
.ind_A > div:nth-child(1) ul li:nth-child(5), .ind_A > div:nth-child(1) ul li:nth-child(6) {margin-bottom: 0px!important;}
.ind_A > div:nth-child(1) ul li span {position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; text-align: center; font-family: 'Noto Sans TC', sans-serif; color: #fff; font-weight: 400; letter-spacing: 4px;}
@media only screen and (min-width:577px){
  .ind_A > div:nth-child(1) ul li:nth-of-type(odd) span {margin-left: 30px;justify-content: flex-start;}
  .ind_A > div:nth-child(1) ul li:nth-of-type(even) span {justify-content: flex-end;margin-right: 30px;}
}
.ind_A > div:nth-child(1) div {position: absolute; top: 50%; left: 50%; width: 36.202%; margin: -18.1% 0 0 -18.1%;}
.ind_A > div:nth-child(2) {width: 43.45%; padding: 0 0 0 90px; position: relative;}
.ind_A > div:nth-child(2) > div:nth-child(2) {position: absolute; bottom: 0px; left: 90px; right: 0px; top: 65px; overflow-y: auto;}
.ind_news {display: flex; flex-wrap: wrap; align-items: center; background: url("../images/line_01a.png") repeat-x scroll left bottom; padding: 0 0 9px 0; margin: 0 0 10px 0; position: relative;}
.ind_news > div:nth-child(1) {width: 61px;}
.ind_newsD {background-color: #215eab; width: 61px; height: 57px; position: relative; color: #fff; font-weight: 100; letter-spacing: 2px; transition: all 0.5s ease 0s;}
.ind_newsD::before {content: ''; position: absolute; top: 2px; left: 27px; height: 58px; width: 1px; background-color: #fff; -moz-transform:rotate(42deg); -webkit-transform:rotate(42deg); -o-transform:rotate(42deg); -ms-transform:rotate(42deg); transform:rotate(42deg); transition: all 0.5s ease 0s;}
.ind_newsD span:nth-child(1) {position: absolute; top: 3px; left: 5px; width: 25px; text-align: center; transition: all 0.5s ease 0s;}
.ind_newsD span:nth-child(2) {position: absolute; bottom: 4px; right: 5px; width: 25px; text-align: center; transition: all 0.5s ease 0s;}
.ind_newsY {color: #333333; background-color: #fff; font-weight: 400; letter-spacing: 3px; text-align: center; transition: all 0.5s ease 0s;}
.ind_news > h3 {width: calc(100% - 61px); padding: 0 98px 0 15px; color: #333333;}
.ind_news > a {display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; font-size: 0;}
.ind_news:hover .ind_newsD {background-color: #fff; width: 61px; height: 57px; position: relative; color: #215eab; font-weight: 100; letter-spacing: 2px; transition: all 0.5s ease 0s;}
.ind_news:hover .ind_newsD::before {content: ''; position: absolute; top: 2px; left: 29px; height: 58px; width: 1px; background-color: #215eab; -moz-transform:rotate(90deg); -webkit-transform:rotate(90deg); -o-transform:rotate(90deg); -ms-transform:rotate(90deg); transform:rotate(90deg); transition: all 0.5s ease 0s;}
.ind_news:hover .ind_newsD span:nth-child(1) {position: absolute; top: 2px; left: 50%; margin-left: -15px; width: 30px; text-align: center; font-weight: bold; transition: all 0.5s ease 0s;}
.ind_news:hover .ind_newsD span:nth-child(2) {position: absolute; bottom: 1px; right: 50%; margin-right: -15px; width: 30px; text-align: center; font-weight: bold; transition: all 0.5s ease 0s;}
.ind_news:hover .ind_newsY {color: #fff; background-color: #215eab; font-weight: 400; letter-spacing: 3px; text-align: center; transition: all 0.5s ease 0s;}
.ind_news:hover > h3 {color: #215eab; transition: all 0.5s ease 0s;}


.ind_B {background: url(../images/bg_01a.jpg) no-repeat center; min-height: 432px; text-align: center; padding: 58px 20px 30px 20px;}
.ind_B > div {display: flex; flex-wrap: wrap; justify-content: center;}
.ind_B > div > div {position: relative; width: 166px; height: 178px; background-color: #205ca8; border: 2px solid #fff; color: #fff; margin: 60px 28px;}
.ind_B > div > div h3 {font-weight: 100!important; position: relative; top: -25px; }
.ind_B > div > div > div {line-height: 0; font-size: 0;}