@charset "utf-8";

body {
  letter-spacing: 1px;
  font-family: "Microsoft JhengHei";
}

body img {
  max-width: 100%;
}

body a {
  transition: all 200ms ease-out 0s;
}

body a:focus,
body [type=button]:focus,
body [type="submit"]:focus,
body select:focus {
  outline: 3px #f44336 dotted !important;
  outline-offset: -3px;
  opacity: 1;
}

body input:focus,
body select:focus,
body textarea:focus {
  background-color: #ffeb3b !important;
  color: #000 !important;
  outline: 3px #f44336 dotted !important;
}

.into {
  position: absolute;
}

.into a {
  opacity: 0;
}
h2 {
    font-size: 100%;
}
.title p {
  position: relative;
  margin: 0;
  letter-spacing: 0;
  line-height: 110%;
}

.title p.note {
  padding: 10px 0;
  line-height: 150%;
}

.title p.en {
  color: #D23113;
  font-size: 80%;
  padding: 0 4px;
  text-transform: uppercase;
}

.title p.ch {
  color: #951C06;
  font-weight: bolder;
  font-size: 170%;
}

/*上方區塊*/
header {
  position: relative;
  width: 100%;
  z-index: 1;
}

header .box {
  max-width: 1440px;
  margin: auto;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-align-items: center;
  align-items: center;
  padding: 0 25px;
  position: relative;
}

h1 {
  width: 100%;
  margin: 0;
  text-align: center;
}

h1 a {
  display: block;
}

.toplink {
  position: absolute;
  top: 0;
}


@media screen and (min-width: 1490px) {


  .toplink {
    right: 0;
  }

}


@media (min-width:992px) {

  header .box {
    height: 110px;
  }

  header .ill {
    right: 145px;
    top: 0;
  }

  header.smaller {
    padding: 0;
    max-width: 100%;
    z-index: 9999;
  }

  header.smaller .box {
    max-width: inherit;
    padding: 0;
  }

}

@media (max-width:992px) {
  header .box {
    top: 0;
    max-width: 100%;
    height: 90px;
    display: flex;
    align-content: flex-start;
    align-items: center;
    padding: 0 15px;
  }

  header.smaller {
    box-shadow: rgb(0 0 0 / 30%) 0 5px 5px;
    background-color: #fdf2e6;
    position: fixed;
    z-index: 99;
  }

  header .ill {
    display: none;
  }


}



@media screen and (max-width: 768px) {
  h1 .pc {
    display: none;
  }

  header h1.logo {
    padding: 0 10px 0 35px;
  }

  h1 .phone img {
    max-height: 65px;
    margin: auto;
  }
}

@media screen and (min-width: 768px) {

  h1 {
    max-width: 320px;
    margin: auto;
  }

  h1 .phone {
    display: none;
  }
}

/*登入*/
.login a {
  background-color: #FAAB54;
  display: block;
  border-radius: 50px;
  padding: 8px 15px 8px 40px;
  text-decoration: none;
  color: #000;
  font-weight: bold;
  font-size: 105%;
  background-image: url("../images/all/ic_login.svg");
  background-repeat: no-repeat;
  background-size: 20px;
  background-position: 12px 7px;
  white-space: nowrap;
}

.login a:hover {
  background-color: #ffc928;
}

.mgotop {
  position: fixed;
  right: 21px;
  bottom: 4%;
}

.mgotop a {
  display: block;
  background-color: #000;
  border-radius: 50px;
  width: 35px;
  height: 35px;
  position: relative;
  opacity: 0.2;
}

.mgotop a:hover {
  opacity: 1;
}

.mgotop svg {
  width: 15px;
  height: 15px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.mgotop svg .d {
  fill: #fff;
}

/*footer*/
footer {
  background-color: #F5F5F5;
}

footer .logo {
  width: 170px;
}

footer .privacy ul {
  padding: 0;
  margin: 0;
}





footer .copyright p {
  margin: 0;
  padding: 3px 0;
}

footer .privacy ul li {
  padding: 6px 0;
  list-style-type: none;
  position: relative;
}

footer .privacy ul li a {
  padding: 0 0 0 15px;
  text-decoration: none;
  color: #000;
  white-space: nowrap;
}

footer .privacy ul li a:hover {
  text-decoration: underline;
}

footer .privacy ul li a:before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-top: solid 5px transparent;
  border-right: solid 5px transparent;
  border-bottom: solid 5px transparent;
  border-left: solid 7px #000000;
  left: 0;
  top: 50%;
  transform: translate(0, -50%);
}

footer .acc_box ul {
  padding: 0;
  margin: 0;
}

footer .acc_box ul li {
  list-style-type: none;
  width: 250px;
  /* display: flex; */
  /* align-items: center; */
  padding: 5px;
}

@media screen and (min-width: 992px) {
  footer .container {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
  }

  footer .privacy {
    padding: 20px 25px;
    border-left: 1px #bfbfbf solid;
    border-right: 1px #bfbfbf solid;
  }
}

@media screen and (max-width: 992px) {

  footer .logo {
    margin: auto;
  }

  footer .finfo {
    padding: 10px;
    border-top: 1px #bfbfbf solid;
    border-bottom: 1px #bfbfbf solid;
    margin: 20px 0;
  }
    footer .acc_box ul {
    display:flex;
    align-items:center;
      justify-content:center;
}
}

@media screen and (min-width: 768px) {
  footer .finfo {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
  }

  footer .copyright {
    padding: 0 25px;
  }
}

@media screen and (max-width: 768px) {

  footer .privacy,
  footer .copyright {
    padding: 0 15px;
  }
}