:root {
    --pri_color-g: #efeae9;
    --pri_color-b: #03244e;

    --sec_color-g: #7a7a7a;    
    /*--sec_color-w: #fff;
    --sec_color-b: #000;
    --ter_color: #000;
    --comman_gap: 60px;*/
}




/*font*/
@font-face {
font-family: GriffithGothic;
font-weight: 300;
font-style: normal;
font-display: swap;
src:
url("./fonts/GriffithGothic_Regular.woff") format("woff"),
url("./fonts/GriffithGothic_Regular.woff2") format("woff2");
}

@font-face {
font-family: GriffithGothic;
font-weight: 400;
font-style: normal;
font-display: swap;
src:
url("./fonts/GriffithGothic_Regular.woff") format("woff"),
url("./fonts/GriffithGothic_Regular.woff2") format("woff2");
}

@font-face {
font-family: GriffithGothic;
font-weight: 600;
font-style: normal;
font-display: swap;
src:
url("./fonts/Griffith_Gothic_Bold.woff") format("woff"),
url("./fonts/Griffith_Gothic_Bold.woff2") format("woff2");
}


@font-face {
font-family: GriffithGothic;
font-weight: 700;
font-style: normal;
font-display: swap;
src:
url("./fonts/Griffith_Gothic_Bold.woff") format("woff"),
url("./fonts/Griffith_Gothic_Bold.woff2") format("woff2");
}


::selection {
        background: var(--pri_color-g);
        color: #000;
        }
::-moz-selection {
        background: var(--pri_color-g);
        color: #000;
}

:focus {
  outline-color: transparent;
  outline-style: none;
}

::-webkit-input-placeholder {
   color: #000;
}

:-moz-placeholder { /* Firefox 18- */
   color: #000;
}

::-moz-placeholder {  /* Firefox 19+ */
   color: #000;
}

:-ms-input-placeholder {  
   color: #000;
}

*, *::before, *::after {
    box-sizing: border-box;
}

html {
    overflow-x: hidden;
}

body{
    margin: 0;
    /*padding: 20px;*/
    /*padding-bottom: 0;*/
    /*background: #F3EEE7;*/
    line-height: 2em;
    font-weight: 300;
    text-transform: none;
    /*font-family: 'Proxima Nova','Noto Sans TC', sans-serif;*/
    font-family: 'Roboto','Noto Sans TC', sans-serif;

    font-feature-settings: normal;
    font-style: normal;
    letter-spacing: normal;
    line-break: auto;
    /*line-height: 1.5em;*/
    /*overflow-x: hidden;*/
    color: var(--ter_color);
    text-size-adjust: none;
    -webkit-text-size-adjust: none;
    background: var(--pri_color-g);
}

body.open {
    overflow: hidden;
    position: fixed;
    max-width: 100%;
}

body.fixed {
  position: relative;
  /*overflow-x: hidden;*/
}

header.fixed {
  position: absolute;
  /*position: relative;*/

}

b {
  font-weight: 400;
}

.mask {
  background: #000;
  width: 100%;
  /*height: 100%;*/
  height: calc( 100% - 90px );
  position: absolute;
  z-index: 101;
  top: 90px;
  /*top: 90px;*/
  left: 0;
  opacity: 0;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity .5s ease-in-out;
  -moz-transition: opacity .5s ease-in-out;
  -ms-transition: opacity .5s ease-in-out;
  -o-transition: opacity .5s ease-in-out;
  transition: opacity .5s ease-in-out;
}

body.fixed .mask {
  visibility: visible;
  opacity: .8;
  -webkit-transition: opacity .5s ease-in-out;
  -moz-transition: opacity .5s ease-in-out;
  -ms-transition: opacity .5s ease-in-out;
  -o-transition: opacity .5s ease-in-out;
  transition: opacity .5s ease-in-out;

}


h1,h2,h3,h4,h5 {
    margin: 0;
    /*line-height: 2em;*/
    line-height: 1.5em;
    margin-bottom: 20px;
    font-weight: 600;

}


h1 {
  /*font-size: 2em;*/
  font-size: 2.5em;
  font-weight: 400;
  /*font-size: 1.5em;*/
  /*line-height: 1.5em;*/

}

h4 {
  font-size: 1.5em;
  font-weight: 400;
}

a {
    display: block;
    color: initial;
    text-decoration: none;
    font-weight: 300;
    /*line-height: 1.5em;*/
}

.page_content a,
.lmh_page_note a {
  display: initial;
  text-decoration: underline;
  color: var(--pri_color-o);
}


p {
    line-height: 2em;
    margin: 20px 0;
}

.page-sec-content p {
  margin-top: 0;
}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}



section,footer {
    width: 100%;
    /*overflow: hidden;*/
    /*max-width: 1440px;*/
    margin: 0 auto;
    background: var(--pri_color-g);
}


footer {
    font-size: 12px;
    /*color: #fff;*/
    /*background: var(--sec_color-g);*/
    /*box-shadow: 
    inset 0 3px 3px hsl(0deg 0% 0% / 0.1), 
    inset 0 8px 8px hsl(0deg 0% 0% / 0.1), 
    inset 0 16px 16px hsl(0deg 0% 0% / 0.075);*/
}

/*footer a {
    color: #fff;
}*/

header {
    /*position: absolute;*/
    position: relative;
    top: 0;
    width: 100%;
    z-index: 102;

    background-color: transparent;
    transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
    transform: translateY(0px);
}

img {
  width: 100%;
}

input {
  font-family: initial;
}

::placeholder {
  color: #666;
  opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
 color: #666;
}

::-ms-input-placeholder { /* Microsoft Edge */
 color: #666;
}

input[type=text], textarea {
    -webkit-appearance: none;
}

.nav_menu_bg {
  border-bottom: 1px solid #000;
}

.nav_menu {
    display: flex;
    height: 100%;
    align-items: center;
    justify-content: center;
}

.menu_label {
    white-space: nowrap;
    /*display: inline-block;*/
    vertical-align: top;
    width: auto;
    align-self: center;
    text-align: center;
    /*flex-grow: 1;*/
    overflow-x: auto;
    /*line-height: 70px;*/
    margin-top: 1.5em;
    margin-bottom: .5em;

    min-width: 60vw;
    max-width: calc(100% - 40px);
}

#pc_menu {
    /*margin-right: 40px;*/
    overflow-x: auto;
    overflow-y: hidden;
}

#pc_menu li, #pc_menu_bak li {
    display: inline-block;
    /*padding: 0 15px;*/
    padding: 0 35px;
    vertical-align: middle;
}

#pc_menu>li:nth-child(1) {
    padding-left: 0;
}

#pc_menu li a {
    color: initial;
    /*font-size: 16px;*/
    text-decoration: none;
}

#pc_menu .selectTitleT {
    cursor: pointer;
    font-weight: 300;
    margin-bottom: 0;
    /*color: #fff;*/
}

.hlogo {
  text-align: center;
  line-height: 100px;
  /*height: 100px;*/
  /*margin-top: calc(50px - 1.5em);*/
  padding-top: calc(50px - 1.5em);
  vertical-align: middle;
  display: flex;
  align-items: center;
  justify-content: center;
}


.hlogo img {
    height: 24px;
    width: auto;
}

.setLang {
  /*display: flex;*/
  align-items: center;
  position: absolute;
  right: 80px;
  display: none;
}

.search {
  background: transparent;
  border: 0;
  border-bottom: solid 1px #000;
  line-height: 1em;
  height: 1em;
  max-width: 100px;
}

.sec_page {
  /*margin-top: 230px;*/
  padding-top: 230px;
  /*margin-top: 180px;*/
  /*margin-bottom: 60px;*/
  /*width: 80vw;*/
  width: 90vw;
  max-width: calc(100% - 40px);


  margin-left: 0;

}

.sec_page_grab {
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
  max-width: 1920px;
}


.page_like {
  /*width: 80vw;*/
  width: 100%;
  display: flex;
  justify-content: flex-end;
  margin-bottom: 60px;
}

.page_like a {
  line-height: 1;
  border-radius: 9999%;
}

.page_like img{
  /*height: 55px;*/
  height: 40px;
  width: auto;
  /*margin-bottom: 60px;*/
}

.page_img {
  width: calc(60% - 40px);
  /*display: flex;
  flex-wrap: wrap;
  gap: 100px;*/
}

.page_img2,
.page_img3 {
  /*width: calc(50% - 50px);*/
  /*width: calc(50% - 25px);*/
  width: 45%;
  height: auto;
  object-fit: contain;
}



.page_img3 {
  margin-top: 20%;
}

.page_img1 {
  flex-grow: 1;
  /*width: 100%;*/
  width: calc(100% - 80px);
  height: auto;
  object-fit: contain;
  margin-left: 80px;
}

.page_img4 {
  width: 80%;
  /*width: calc(100% - 100px);*/
  margin: 0 auto;
}

.page_txt{
  width: calc(40% - 40px);
}

.page_img {
  margin-right: 40px;
}

.page_txt {
  margin-left: 40px;
}

.page_txt h1{
  margin-bottom: calc(60px - 0.75em);
}

.page_txt p{
  margin-bottom: 60px;
}

.page_btn {
  width: 100%;
  height: 36px;
  background: #000;
  color: #fff;
  margin-bottom: 60px;
  /*border: 1px solid #000;*/
  -webkit-transition: color .5s ease-in-out, background.5s ease-in-out;
  -moz-transition: color .5s ease-in-out, background.5s ease-in-out;
  -ms-transition: color .5s ease-in-out, background.5s ease-in-out;
  -o-transition: color .5s ease-in-out, background.5s ease-in-out;
  transition: color .5s ease-in-out, background.5s ease-in-out;
}

.page_btn:hover,
.page_btn:hover a {
  /*background: transparent;*/
  background: #fff;
  color: #000;
  -webkit-transition: color .5s ease-in-out, background.5s ease-in-out;
  -moz-transition: color .5s ease-in-out, background.5s ease-in-out;
  -ms-transition: color .5s ease-in-out, background.5s ease-in-out;
  -o-transition: color .5s ease-in-out, background.5s ease-in-out;
  transition: color .5s ease-in-out, background.5s ease-in-out;
}

.page_btn a{
  line-height: 36px;
  vertical-align: middle;
  color: #fff;
  text-align: center;
}

.page_txt_2 {
  border-top: solid 1px #000;

}

.page_txt_2 p{
  margin-top: 60px;
}

.page_txt_2 img {
  /*height: 55px;*/
  height: 40px;
  width: auto;
}

.page_txt2img a {
  display: inline-block;
}

.page_txt2img img,
.page_txt2img span {
  /*line-height: 55px;*/
  line-height: 40px;
  vertical-align: middle;
}

.page_txt2img span {
  margin-left: 1em;
}
.page_txt2img {
  margin-bottom: 1em;
}

.page_txt_3{
  margin-top: 60px;
  border-top: solid 1px #000;
}

.page_txt_3 p{
  margin-top: 60px;
}

.page_news {
  width: 100%;
  background: #fff;
  max-width: 1920px;
}

.page_news img {
  width: calc(100vw/3);
  /*height: calc(100vw/3);*/
  height: calc(100vw/3*4/5);
  object-fit: cover;
}

.page_news h1 {
  text-align: center;
  /*padding-bottom: calc(60px - 0.75em);
  padding-top: calc(60px - 0.75em);*/
  padding: 1.5em 0;
  margin: 0;
}

.page_l2 {
  margin-top: 100px;
  height: fit-content;
  display: flex;
  /*gap: 100px;*/
  /*gap: 50px;*/
  gap: 10%;
  align-items: flex-start;
  margin-left: 80px;
}    

.page_l3 {
  /*margin-top: 20%;*/
  margin-top: 100px;
  /*margin-bottom: 20%;*/
  margin-bottom: 100px;
  line-height: 1;
  /*margin-top: 50px;*/
  text-align: center;
  margin-left: 80px;
}

.new_txt h4{
  text-align: center;
}

.new_txt {
  padding: 60px;
  /*text-align: center;*/
}

.new_txt a{
  display: inline-block;
}

.new_txt a:hover{
  text-decoration: underline;
}

.logo_f{
  /*height: 30px;*/
  height: 24px;
  width: auto;

  position: absolute;
  top: 0;
}

footer {
  width: 80vw;
  max-width: calc(100% - 40px);
}

.footer {
  margin: 100px auto;
  max-width: 1920px;
  display: flex;
  flex-wrap: nowrap;
}

.logo_f {
  margin-bottom: 100px;
}

.s_icon a {
  display: inline-block;
  /*margin-right: 40px;*/
  margin-right: 30px;
  /*height: 55px;
  line-height: 55px;*/
  height: 40px;
  line-height: 40px;
}

.s_icon img {
  height: 20px;
  width: auto;
}

.footer_l {
  width: calc(60% + 40px);
  /*border-right: 1px solid #000;*/

  align-items: flex-end;
  display: flex;
  flex-direction: row;
  justify-content: left;
  position: relative;
}

.footer_l > div {
  margin-right: 80px;
}

.footer_l li {
  /*line-height: 1.5em;*/
}

.footer_r {
  width: calc(40% - 40px);
  flex-grow: 1;

}

.footer_r > div {
  padding-left: 80px;
  border-left: 1px solid #000;
}

.sub_f_menu li{
  display: inline-block;
  margin-right: 20px;

}

.f_menu {
  font-weight: 600;
}

.f_menu_li {
  margin-bottom: 60px;
}

.hlogo .search_icon {
  height: 16px;
  width: auto;
}

.page_txt2img span {
  font-weight: 400;
}

.copyRight,
.new_txt a,
.footer_l li,
.footer_r li li a{
  color: var(--sec_color-g);
}

.copyRight {
  margin-bottom: 0;
}

.f_menu_li:last-child {
  margin-bottom: 0;
}

.page_img_m {
  display: none;
}

/*.owl-prev, .owl-next {*/
.owl-nav {
  position: absolute;
  /*top: 50%;*/
  /*top: calc(50% - 42px);*/
  top: calc(50% - 42px);
  /*-webkit-transform: translateY(calc(-50% - 42px));
  -ms-transform: translateY(calc(-50% - 42px));
  transform: translateY(calc(-50% - 42px));*/
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
.owl-next {
  position: absolute;
  right: 0px;
}

.owl-prev {
  position: absolute;
  left: 0px;
}

.owl-theme .owl-nav {
  margin-top: 0;
  width: 100%;
}

.logo_f.mo {
  display: none;
}

.page_new_owl {
  width: 100%;
  overflow-x: auto;
}
  
.sec_page_grab.newst .page_txt_3 {
  margin-top: 100px;
}

.txt_img_mo {
  display: none;
}

.sec_page_grab.newst .page_img {
  margin-bottom: 60px;
}

/*=====*/
.royal_pre {
    width: 60px;
    height: 60px;
}

.arrow {
    cursor: pointer;
    height: 13px;
    position: relative;
    top: 1px;
    transition: width .1s;
    width: 8px;
}

.arrow, .arrow.owl {
    transform: translateX(-50%) translateY(-50%);
}

.arrow.owl {
    height: 60px;
    top: 50%;
    width: 15px;
    left: calc(50% + 5px);
}

.arrow.owl.owl_pre {
    /*left: calc(50% - 10px);*/
    left: 0;
    position: absolute;
}

.arrow-bottom, .arrow-top {
    background-color: transparent;
    height: 1px;
    left: -5px;
    position: absolute;
    top: 50%;
    width: 100%;
}

.arrow-top {
    transform: rotate(45deg);
    transform-origin: bottom right;
}

.owl_pre .arrow-top {
    transform: rotate(135deg);
    transform-origin: top right;
}

.arrow.owl .arrow-bottom, .arrow.owl .arrow-top {
    background-color: #000;
}

.arrow-bottom:after, .arrow-top:after {
    background-color: #fcfcfc;
    content: "";
    height: 100%;
    position: absolute;
    top: 0;
    transition: .1s;
}

.arrow-top:after {
    left: 100%;
    right: 0;
    transition-delay: 0s;
}

.owl_pre .arrow-bottom {
    transform: rotate(-135deg);
    transform-origin: top right;
}

.arrow-bottom {
    transform: rotate(-45deg);
    transform-origin: top right;
}

.arrow-bottom:after {
    left: 0;
    right: 100%;
    transition-delay: 0.15s;
}


.header--alt {
    background-color: var(--color-c);
    border-bottom-color: transparent;
}

.header.has-transform {
    transform: translateY(-101%);
}

/*.sec_banner,*/
.page_banner {
  height: calc(100vh - 115.77px);
  width: 100vw;
  position: relative;
  z-index: 1;
}

.video-container {
    padding-bottom: 56.25%;
    /*background: #000;*/
    position: relative;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    overflow: hidden;
}

.video-container iframe {
    /*width: 140vw;*/
    min-height: 100vh;
    min-width: 177.77vh;
    position: absolute;

    width: 140vw;
    height: 100vh;
    top: -20vw;
    left: -20vw;
}

.subtitle {
    color: var(--sec_color-g);
}

.page_txt2img span:hover {
  text-decoration: underline;
}

@media screen and (max-width: 1024px) {
  .setLang {
    display: none;
  }
}

@media screen and (max-width: 800px) {
  .page_txt {
      margin-left: 0;
      width: 100%;
      order: 1;
  }

  .page_img {
      margin-right: 0;
      width: 100%;
      order: 2;
  }

  .page_l2 {
    display: block;
  }

  .page_img2,
  .page_img3,
  .page_img4 {
    width: 100%;
  }

  .footer {
    flex-wrap: wrap;
  }

  .footer_l > div,
  .footer_r > div {
    margin: 0;
  }

  .footer_l,
  .footer_r {
    width: 100%;
  }

  .footer_l {
    border-right: 0;
    position: relative;
  }

  .logo_f {
    position: relative;
  }
  

  .page_news img {
    width: 100vw;
    height: 100vw;
  }

  /*.footer_r ul li:last-child {
    margin: 0;
  }*/

  .sec_page,
  footer {
    width: 100%;
  }

  .sec_page {
    margin-left: auto;
    padding-top: 100px;
  }

  .page_img1,
  .page_l2,
  .page_l3 {
    margin-left: 0;
  }

  .footer_r > div {
    padding-left: 0;
    border-left: 0;
  }

  .page_img_m {
    display: block;
  }

  .sec_page_grab {
    display: block;
  }

  .page_img {
    display: none;
  }

  .page_txt_1 {
    text-align: center;
  }

  .page_txt h1 {
    margin-top: calc(60px - 0.75em);
  }

  #page_news {
    width: 130%;
    /*margin-left: 25%;*/
  }

  .footer_r {
    order: 1;
  }

  .footer_l {
    order: 2;
  }

  .f_menu_li {
    text-align: center;
  }

  .f_menu_li:last-child {
    margin-bottom: 60px;
  } 

  .logo_f {
    display: none;
  }

  .s_icon {
    text-align: center;
    border-bottom: 1px solid var(--sec_color-g);
    margin-bottom: 60px;
  }
  
  .s_icon a{
    margin-bottom: 20px;
  }

  .logo_f.mo {
    display: block;
    margin: 0 auto;
    margin-bottom: 60px;
  }

  .txt_img_mo .page_img2,
  .txt_img_mo .page_img3 {
    width: 70%;
  }

  .txt_img_mo .page_img3 {
    margin-top: 60px;
  }

  .txt_img_mo {
    display: block;
  }

  .txt_img_mo div {
    line-height: 0;
  }

  .pimg3_mo {
    display: flex;
    justify-content: right;
  }

  .sec_page_grab.newst .page_txt_3 {
    margin-bottom: 100px;
  }

  .page_new_owl {
    width: calc( 100% - 20px);
    margin-left: 20px;
  }

  .nav_menu_bg {
    display: none;
  }

  .new_txt {
    padding: 0;
  }

  .new_txt p {
    margin-bottom: 60px;
  }

  .owl-carousel .owl-item img {
    height: auto;
    object-fit: contain;
  }

  .s_icon a:last-child {
    margin-right: 0;
  }

  .owl-theme .owl-dots {
    margin-top: 20px;
  }
  /*.new_txt {
    padding: 0;
  }*/

}

/*@media screen and (max-width: 600px) {
  .page_news img {
    width: 100vw;
    height: 100vw;
  }
}*/