*{
    padding:0;
    margin: 0;
}  
header{
    background-color:rgb(50, 130, 205);
    height:100px ;
    width: 100%;
    position:fixed;
}
@keyframes change-color{
    50%{color: red;}
}
.h1{
    color:yellow;
    font-size:22px;
}
.h1-animation {
    animation-name:change-color;
    animation-duration:2s;
    animation-iteration-count:infinite;
}
header p {
    position: absolute;
    right: 5vw;
    top:88px;
    line-height:8px;
    color: white;
    font-size: 8px;
}
header h1{
    position: absolute;
    left: 60px;
    top: 0;
    line-height: 80px;
}
.call-btn1 {
    color: white;          /* 文字顏色 */
    font-size: 15px;       /* 文字大小 */
    background: #dc2626;   /* 背景紅色 */
    padding: 0;
    border-radius: 10px;
    text-decoration: none;
    display: inline-block;
    position: absolute;
    left: 0;
    bottom: 3px;
    padding:4px;
}
.call-btn1:hover {
    background: #b91c1c;
}
header h2{
    position: absolute;
    left: 630px;
    top: 16px;
    line-height: 53x;
    color:yellow;
    font-size: 33px;
}

@keyframes change-color1{
    0.3%{color: red;}
}
.h3-animation {
    animation-name:change-color1;
    animation-duration:15s;
    animation-iteration-count:infinite;
}
.h3 {
    position: absolute;
    right: 5vw;
    top:55px;
    padding:5px;
    color: white;
    font-size: 18px;
}
.h3:hover{
    background-color:yellow;
    color:blue;
    cursor: pointer;
}
.ablist {
    background-color:#bfff9049;
     Display:flex;
     Flex-direction:row;
     align-items: flex-end;
      height: 170px;
}
.ablist p {
    color:red;
    padding: 10px 10px 10px 40px;
    font-size: 30px;
}
.ablist:hover{
    background-color:yellow;
    color:blue;
    cursor: pointer;
}
.ablist p:hover{
    color:blue;
}
.address {
    background-color:#bfff9049;
    padding: 0px 10px 10px 120px;
}
.basicdata{
    color:black;
    background-color:#29ffb60f;
   padding: 0 0 20px 10px;
}
.basicdata h4{
    color:black;
    font-size: 22px;
    padding: 10px 10px 10px 40px;
}
.basicdata p{
    font-size: 20px;
    padding: 5px 10px 5px 0px;
}
.basicdata li{
    font-size: 20px;
    padding: 5px 10px 5px 0px;
}
h5 {
    height: 30px;
    font-size: 17px;
    text-align:center;
}
table,th,td {
border:1px solid black;

}
table {
    border-collapse: collapse;
    width:95%
}
th {
    height: 40px;
    color:white;
    background-color:green
}
td {
    height: 40px;
}
.basicdata1 {
    Display:flex;
    background-color:#29ffb60f;
    align-items: end;
    text-align:center;
    Justify-content:center;
    }  
.basicdata1 div {
    width:450px;
    text-align:center;
    padding:20px 20px 20px;
 }  
   .basicdata1 img {
    width:100%;
  } 

   .prbc div{
      background-color:#f964f22a;
      height: 60px;
      Display:flex;
    Flex-direction:column;
    Justify-content:center;
    Align-items:center;
 }
 
@keyframes change-color{
    50%{color: red;}
}
.prbc {
    color:black;
    font-size:35px;
}
.prbc-animation {
    animation-name:change-color;
    animation-duration:2s;
    animation-iteration-count:infinite;
}

  .otherconnection {
    Display:flex;
    background-color:#f964f22a;
    align-items: end;
    text-align:center;
    Justify-content:center;
    }
  .otherconnection div {
    width:450px;
    text-align:center;
    padding:20px 20px 20px;
    color: blue;
    
 }  
   .otherconnection img {
    width:100%;
  } 



  
.otherconnection1 {
  display: flex;
  background-color: #f964f22a;
  align-items: end;
  text-align: center;
  justify-content: center;
}

.otherconnection1 div {
  width: 450px;
  text-align: center;
  padding: 20px;
  color: blue;
}

.otherconnection1 img {
  width: 100%;
}
 footer {
    background-color:rgb(50, 130, 205);
    height:100px ;
    width: 100%;
    color: white;
    Display:flex;
    Flex-direction:column;
    Justify-content:center;
    Align-items:center;
 }
 footer h5 {
   font-size: 25px;
}
@media screen and (max-width: 900px){
    header h1{
        font-size:36px;
        position: absolute;
        left: 20px;
        top: 16px;
        line-height: 50px;
    }
    header h2{
    position: absolute;
    left: 530px;
    top:20px;
    line-height: 100x;
    color:yellow;
    font-size: 28px;
}
    h3{
        font-size: 16px;
    }
    .ablist p {
    font-size: 25px;
    padding: 10px 0px 10px 17px;
}
}
@media screen and (max-width: 768px){
    header h1{
        font-size:33px;
        position: absolute;
        left: 20px;
        top: 5px;
        line-height: 50px;
    }
    header h2{
    position: absolute;
    left: 330px;
    top:39px;
    line-height: 50x;
    color:yellow;
    font-size: 22px;
}
    h3{
        font-size: 16px;
    }
    .h3 {
    position: absolute;
    right: 5vw;
    top:59px;
    padding:5px;
    color: white;
    font-size: 18px;
}
    .ablist p {
    font-size: 25px;
    padding: 10px 0px 10px 17px;
}
}
@media screen and (max-width: 500px){
    header  p {display: none;}
    header h1{
        font-size: 28px;
        position: absolute;
        left: 20px;
        top: 5px;
        line-height: 50px;
    }
    header h2{
    position: absolute;
    left: 190px;
    top:39px;
    line-height: 50x;
    color:yellow;
    font-size: 22px;
}
    h3{
        font-size: 16px;
    }
    .ablist p {
    font-size: 20px;
    padding: 10px 0px 10px 8px;
}
}
.floating-buttons {
    position: fixed;
    right: 20px;
    bottom: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    z-index: 999;
}

/* 電話 */
.call-btn {
    background: #dc2626;
    color: #fff;
    width: 55px;
    height: 55px;
    border-radius: 50%;
    text-align: center;
    line-height: 55px;
    font-size: 22px;
    text-decoration: none;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* LINE */
.line-btn {
    background: #06c755;
    color: #fff;
    width: 55px;
    height: 55px;
    border-radius: 50%;
    text-align: center;
    line-height: 55px;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}.call-btn:hover {
    background: #b91c1c;
    transform: scale(1.1);
}

.line-btn:hover {
    background: #05a94c;
    transform: scale(1.1);
}
@media (max-width: 768px) {
    .floating-buttons {
        right: 12px;
        bottom: 15px;
    }

    .call-btn, .line-btn {
        width: 60px;
        height: 60px;
        line-height: 60px;
        font-size: 20px;
    }
}