/* @import url('https://www.3ds.com/statics/3ds-navigation/fonts/3ds/fonts.css?display=swap'); */
@charset "utf-8";
@import url(../fonts/style.css);
/*
  danny 201803
  1. $Reset
  2. $font
  3. $body,html
  4. $共用
  5. $Mobile
  6. $Pad
  7. $橫的版型
  8. $Pc
  9. $1025~1279
*/

/* $Reset
--------------------------------------------------------------------------------------*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote{margin:0; padding:0; } fieldset, img {border:0; } address, caption, cite, code, dfn, em, var {font-style:normal; font-weight:normal; } ol, ul {list-style:none; } q:before, q:after {content:''; } abbr, acronym {border:0; }





/* $font
--------------------------------------------------------------------------------------*/
@font-face {
  font-family: "3ds";
  src: url("https://www.3ds.com/statics/3ds-navigation/fonts/3ds-Regular-v2.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}




/* @import url(//fonts.googleapis.com/earlyaccess/notosanstc.css); */

/* cwTeXYen (Chinese Traditional) http://www.google.com/fonts/earlyaccess */
@font-face {
  font-family: 'cwTeXHei';
  font-style: normal;
  font-weight: 500;
  src: url(//fonts.gstatic.com/ea/cwtexhei/v3/cwTeXHei-zhonly.eot);
  src: url(//fonts.gstatic.com/ea/cwtexhei/v3/cwTeXHei-zhonly.eot?#iefix) format('embedded-opentype'),
       url(//fonts.gstatic.com/ea/cwtexhei/v3/cwTeXHei-zhonly.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/cwtexhei/v3/cwTeXHei-zhonly.woff) format('woff'),
       url(//fonts.gstatic.com/ea/cwtexhei/v3/cwTeXHei-zhonly.ttf) format('truetype');
}

/* @import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css); */
/*
* Noto Sans TC (Chinese_traditional) http://www.google.com/fonts/earlyaccess
 */
@font-face {
  font-family: 'Noto Sans TC';
  font-style: normal;
  font-weight: 100;
  src: url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Thin.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Thin.woff) format('woff'),
       url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Thin.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans TC';
  font-style: normal;
  font-weight: 300;
  src: url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Light.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Light.woff) format('woff'),
       url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Light.otf) format('opentype');
}
@font-face {
   font-family: 'Noto Sans TC';
   font-style: normal;
   font-weight: 400;
   src: url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Regular.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Regular.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Regular.otf) format('opentype');
 }
@font-face {
   font-family: 'Noto Sans TC';
   font-style: normal;
   font-weight: 500;
   src: url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Medium.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Medium.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Medium.otf) format('opentype');
 }
@font-face {
   font-family: 'Noto Sans TC';
   font-style: normal;
   font-weight: 700;
   src: url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Bold.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Bold.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Bold.otf) format('opentype');
 }
@font-face {
   font-family: 'Noto Sans TC';
   font-style: normal;
   font-weight: 900;
   src: url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Black.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Black.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Black.otf) format('opentype');
 }


/* :before ,:after{ font-family:'FontAwesome','Linearicons-Free',"微軟正黑體";} */

:before ,:after{ font-family:'icomoon','Linearicons-Free','3ds','Microsoft JhengHei','Apple LiGothic Medium';}



/* $body,html
--------------------------------------------------------------------------------------*/
html,body{ width: 100%; height: 100%; font-family:'3ds',"微軟正黑體","新細明體","蘋果儷黑體", Arial, Helvetica, sans-serif; font-size: 10px;}





/* $共用
--------------------------------------------------------------------------------------*/
/*----清除浮動技巧----*/
.clearfix:before,.clearfix:after {content: " ";display: table;}
.clearfix:after {clear: both;}
.clearfix {*zoom: 1;}
/*----清除浮動技巧----*/

/* IMAGE REPLACE */
.imageReplace{ text-indent: 100%; white-space: nowrap; overflow: hidden;}

/* float */
.floatL{ float: left;}
.floatR{ float: right;}

/* button reset */
button{ font-family:'3ds',"微軟正黑體","新細明體","蘋果儷黑體", Arial, Helvetica, sans-serif; border: none; }

/* input reset */
input{ font-family:'3ds',"微軟正黑體","新細明體","蘋果儷黑體", Arial, Helvetica, sans-serif; border: none; }

/* select reset */
select{ font-family:'3ds',"微軟正黑體","新細明體","蘋果儷黑體", Arial, Helvetica, sans-serif; }


.font--bold{ font-weight: bold; }



/* $Mobile
--------------------------------------------------------------------------------------*/
html,body{ width: 100%; font-size: 10px; -webkit-text-size-adjust:none; background: #ededed; }

/* logo */
.logo{ width: 80px; position: fixed; top: 13px; left: 10px; z-index: 999; }
.logo img{ width: 100%; height: auto;}

header{ width: 100%; height: 50px; background: #fff; position: fixed; z-index: 999;
box-shadow:0px 3px 5px 1px rgba(0,0,0,0.1); }
header.active{ height: 100%; }
header .gotoidx{ height: 60px; display: flex; justify-content: center; align-items: center; color: #fff; background: #004982; padding: 0 50px 0 50px; margin: 40px 0 0 0; }
/* 主選單 */
.mainmenu{ box-sizing: border-box; padding: 90px 0 0 0; display: none; }
.mainmenu>li{ height: 60px; line-height: 60px; font-size: 1.8rem; border-right: 1px solid #deddde; text-align: center; white-space: nowrap; }
.mainmenu>li:last-child{ border-right: 0;  }
.mainmenu>li>a{ text-decoration: none; color: #004982; position: relative; }
.mainmenu>li>a:after{ content: ''; display: block; width: 0%; height: 1px; background: #004982; position: absolute; left: 50%; top: 130%; transform: translate( -50%,0); transition:all 0.4s cubic-bezier(.23,1,.32,1); }
.mainmenu>li>a:hover:after{ width: 100%; }
.hamburger-box{ width: 16px; height: 18px; position: fixed; right: 10px; top: 20px; z-index: 9999; }
.hamburger__x, .hamburger__y, .hamburger__z{ width: 16px; height: 2px; background: #004982; transition: all .2s ease-out; position: absolute;  top: 7px;  }
.hamburger__x{ transform: matrix(1,0,0,1,0,-7); }
.hamburger__y{  }
.hamburger__z{ transform: matrix(1,0,0,1,0,7); }
.hamburger-box.active .hamburger__x{ transform: matrix(.7071,.7071,-.7071,.7071,0,0) }
.hamburger-box.active .hamburger__y{ display: none;  }
.hamburger-box.active .hamburger__z{ transform: matrix(-.7071,.7071,-.7071,-.7071,0,0) }

/* footer */
footer{ width: 100%;  height: auto; background: #fff; }
.footer-container{ width: 100%; box-sizing: border-box; font-size: 1.4rem; color: #1e1e1e; box-sizing: border-box; padding: 30px 5%; }
.footer-container a{ text-decoration: none; color: #004982; }
.organizer{ display: flex; flex-direction: column; font-size: 1.4rem; }
.organizer li{ display: flex; flex-direction: column; align-items: center; margin: 0 0 0 0; }
.organizer li a{ display: flex; align-items: center; color: #1e1e1e; text-decoration: none; }
.organizer li a+a{ margin: 0 4px 0 4px; }
.organizer li a>img{ margin-left: 5px; height: 20px; }
.txt--bold{ font-weight: bold; }
.logo-box{ display: flex; }

/* .tit{ display: flex; align-items: center; font-size: 1.25rem; color: #004982; line-height: 1.5rem; margin-bottom: 20px; }
.tit:before{ content: ''; width: 3px; height: 20px; background: #004982; margin-right: 10px; } */
.tit{ display:flex; align-items:center; font-size: 2.4rem; font-weight: bold; color: #004982;  justify-content: center; margin: 0 0 20px 0;  }
.tit:before{ content:''; display: block; width: 40px; height: 1px; border-bottom:2px solid #004982; transform:rotate(-50deg) }
.tit:after{ content:''; display: block; width: 40px; height: 1px; border-bottom:2px solid #004982; transform:rotate(-50deg); margin: 0 0 0 10px; }

.subtit{ font-size: 1.8rem; font-weight: bold;  line-height: 1.6; white-space:nowrap; }

.slash{ font-size: 1rem; }
.txt--bold{ font-weight: 600; }
.regip{width: 90%;margin: auto;}

.dot-list{ list-style: disc; line-height: 1.68; margin: 0 0 0 20px; }
.font-bold{ font-weight: bold; }



/* $Pad
--------------------------------------------------------------------------------------*/
@media screen and (min-width:600px) and (max-width:1024px){
/* footer */
.footer-container{ width: 100%; box-sizing: border-box; font-size: 0.75rem; color: #1e1e1e; box-sizing: border-box; padding: 30px 5%; text-align: center; }
.regip{width: 61%;margin: auto;}
}





/* $橫的版型 */
@media screen and (orientation:landscape){ 


}





/* $Pc
--------------------------------------------------------------------------------------*/
/* @media screen and (min-width: 768px){ */
@media screen and (min-width: 1025px){
html,body{ min-width: 100%; font-size: 10px; }

/* logo */
.logo{ position: fixed; top: 24px; left: 20px; width: auto;  }

header{ display: flex; flex-direction: row-reverse; width: 100%; height: 80px; background: #fff; position: fixed;
box-shadow:0px 3px 5px 1px rgba(0,0,0,0.1); }
header .gotoidx{ height: 100%; display: flex; justify-content: center; align-items: center; color: #fff; background: #004982; padding: 0 50px 0 50px; margin: 0 0 0 0; }
header .gotoidx a{color: #fff;text-decoration: none;}
/* 主選單 */
.mainmenu{ display: flex; align-items: center; padding: 0; }
.mainmenu>li{ height: 60px; line-height: 60px; box-sizing: border-box; /* padding: 0 55px; */ padding: 0 3vw; font-size: 1.8rem; border-right: 1px solid #deddde;  }
.mainmenu>li:last-child{ border-right: 0;  }
.mainmenu>li>a{ text-decoration: none; color: #004982; position: relative; transition:all 0.4s cubic-bezier(.23,1,.32,1); }
.mainmenu>li>a:after{ content: ''; display: block; width: 0%; height: 1px; background: #004982; position: absolute; left: 50%; top: 130%; transform: translate( -50%,0); transition:all 0.4s cubic-bezier(.23,1,.32,1); }
.mainmenu>li>a:hover:after{ width: 100%; }
.mainmenu>li.btn>a:hover:after{ width: 0; }
.mainmenu>li.btn>a:hover{ background: #ff8d00; }
.mainmenu>li.btn>a{ height: 30px; background: #ff5300; color: #fff; box-sizing: border-box; padding: 10px 20px 10px 20px; border-radius: 5px; }
.hamburger-box{ display: none; }
.mainmenu>li.btn>a:before{ content: '\e95d'; margin: 0 5px 0 0; }

/* footer */
footer{ width: 100%;  height: 140px; background: #fff; }
.footer-container{ display: flex; flex-direction: column; justify-content: space-between; align-items: center; width: 100%; max-width: 1208px; height: 100%; margin: 0 auto; box-sizing: border-box; font-size: 1.4rem; color: #1e1e1e; }
.footer-container a{ text-decoration: none; color: #004982; }
.footer-container a:hover{ text-decoration: underline; }
.organizer{ display: flex; flex-direction: row; justify-content: center; }
/* .organizer li{ display: flex; flex-direction: row; align-items: center; margin: 0 30px 0 0; } */
.organizer li{ display: flex; flex-direction: row; align-items: center; }
/* .organizer li+li{ margin: 0 30px 0 0; } */
.organizer li a{ display: flex; align-items: center; color: #1e1e1e; text-decoration: none; }
.organizer li a+a{ margin: 0 5px 0 5px; }
.organizer li a>img{ margin-left: 5px; height: 27px; }

/* .tit{ display: flex; align-items: center; font-size: 1.875rem; color: #004982; line-height: 80px; }
.tit:before{ content: ''; width: 3px; height: 27px; background: #004982; margin-right: 20px; } */
.tit{ display:flex; align-items:center; font-size: 3.2rem; font-weight: bold; color: #004982; line-height: 80px; justify-content: center;  }
.tit:before{ content:''; display: block; width: 40px; height: 1px; border-bottom:2px solid #004982; transform:rotate(-50deg) }
.tit:after{ content:''; display: block; width: 40px; height: 1px; border-bottom:2px solid #004982; transform:rotate(-50deg); margin: 0 0 0 10px; }

.subtit{ font-size: 2rem; font-weight: bold;  line-height: 1.6;  }

.slash{ font-size: 1rem; }
.regip{width: 700px;margin: auto;}

}





/* $1025~1279
--------------------------------------------------------------------------------------*/
@media screen and (min-width:1025px) and (max-width:1279px){


}