@charset "UTF-8";

input[type="text"],
input[type="password"] { font-size: 18px; }
::-webkit-input-placeholder { color: #263348; }
::-moz-placeholder { color: #263348; }
:-ms-input-placeholder { color: #263348; }
:-moz-placeholder { color: #263348; }


/*title*/
.areaTitle { font-size: 32px; line-height: 36px; font-weight: 700; color: #263348; }


/*btn*/
.btn {  }


/*登入*/
.loginArea { position: relative; margin-bottom: 30px; padding: 15px 0; /*background: url(../images/bg_index_login_01.jpg) center top;*/  }
/*登入_背景*/
.loginArea_bg { overflow: hidden; }
.loginArea_bg.slick-slider,
.loginArea_bg .slick-list,
.loginArea_bg .slick-track { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.loginArea_banner { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover;}
.loginArea_banner a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.loginArea_bg .slick-dots { position: absolute; }
.loginArea_bg_dot { position: absolute; bottom: 20px; right: 50%; transform: translateX(50%); width: 100vw; max-width: 1240px; height: 12px; padding: 0 20px; text-align: right; z-index: 2; }
.loginArea_bg_dot li { display: inline-block; margin-left: 15px;  }
.loginArea_bg_dot button { display: block; opacity: 0.7; width: 12px; height: 12px; color: transparent; background: #fff; border-radius: 6px; cursor: pointer; }
.loginArea_bg_dot li.slick-active button { opacity: 1; background: #009e96; }

/*沒有登入_純背景*/
.loginArea.loginArea_02 { height: 450px; padding: 0; }
/* .loginArea.loginArea_02 .loginArea_banner { background-position: center top; background-size: cover; } */
.loginArea.loginArea_02 .loginArea_banner { background-size: cover; }
.loginArea.loginArea_02 .loginArea_banner .linkCover { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.login_box { position: relative; z-index: 3; max-width: 400px; }
/*登入_選單*/
.login_nav { display: flex; }
.login_nav a { flex: 1 1 auto; display: block; line-height: 40px; font-size: 21px; text-align: center; color: #707070; background: #dcdcdc; border-top: solid 2px #dcdcdc; }
.login_nav a.on { font-weight: bold; color: #e61b64; background: #fff; border-top: solid 2px #f19ec2; }
/*登入_表單*/
.login_inner { padding: 15px 30px; font-size: 18px; color: #263348; background: #fff; border-bottom: solid 6px #ffa200; }
.login_title { margin-bottom: 15px; font-size: 21px; font-weight: 700; }
.login_input { padding-left: 30px; margin-bottom: 10px; border-bottom: solid 1px #d2d2d2; }
.login_input_company { background: url(../images/icon_input_login_01.png) left center no-repeat; background-size: 30px; }
.login_input_id { background: url(../images/icon_input_login_02.png) left center no-repeat; background-size: 30px; }
.login_input_pw { background: url(../images/icon_input_login_03.png) left center no-repeat; background-size: 30px; }
.input_password { position: relative; }
.input_password input { padding-right: 40px; }
.input_password_see { position: absolute; top: 0; right: 0; display: block; width: 40px; height: 40px; background: #fff url(../images/icon_show_password_03.png) center no-repeat; background-size: auto 24px; }
.input_password_see.show { background: #fff url(../images/icon_show_password_01.png) center no-repeat; background-size: auto 24px; }
.input_verify { display: flex; align-items: center; margin: 0 0 10px; }
.input_verify input { flex: 1 1 auto; padding-left: 0; }
.input_verify img { flex: 0 0 auto; display: block; height: 34px; }
.input_verify .input_verify_reflash { flex: 0 0 auto; display: block; width: 40px; height: 40px; background: url(../images/icon_reflash_01.png) center no-repeat; background-size: 22px; }
.login_input.input_verify { padding: 0; }
/*登入_按鈕*/
.btn_login {  }
.btn_login a { display: block; margin-bottom: 10px; padding: 0; line-height: 48px; font-size: 20px; text-align: center; color: #fff; background: #e61b64; }
.btn_login .btn_color_pink { background: #f19ec2; }
.login_noticeLink { display: flex; justify-content: center; }
.login_noticeLink a { display: inline-block; font-size: 16px; color: #ffa200; line-height: 1em; }
.login_noticeLink a::after { content: ""; display: inline-block; width: 1px; height: 16px; margin-right: 15px; padding-right: 15px; vertical-align: middle; border-right: solid 1px; }
.login_noticeLink a:nth-last-child(1)::after { content: none; }

/*登入頁面*/
.loginPage {  }
.loginPage .login_box { max-width: 480px; display: flex; flex-direction: column; margin: 20px auto; box-shadow: 0 0 5px 0 rgba(0,0,0,0.2); }	
.loginPage .login_inner { flex: 1 1 auto; }

/*popup_忘記密碼*/
.btn_PwForget { display: flex; }
.btn_PwForget a { flex: 1 1 50%; display: block; margin-right: 20px; padding: 105px 0 20px; text-align: center; font-size: 20px; border: solid 2px #62c4c0; border-radius: 10px; }
.btn_PwForget a:nth-last-child(1) { margin: 0; }
.btn_PwForget a .title { display: block; margin-bottom: 10px; font-size: 30px; color: #009e96; }
.btn_PwForget_icon01 { background: url(../images/btn_PwForget_icon_01.png) center 20px no-repeat; background-size: auto 64px; }
.btn_PwForget_icon02 { background: url(../images/btn_PwForget_icon_02.png) center 20px no-repeat; background-size: auto 64px; }


/*資訊*/
.infoArea { display: flex; align-items: stretch; margin-bottom: 25px; }
/*資訊_新聞*/
.headlineArea { flex: 0 0 calc(50% + 60px); width: calc(50% + 60px); margin-right: 30px; padding: 30px; background: #fff; box-shadow: 0 0 8px 0 rgba(6,35,90,0.35); }
.headlineArea .areaTitle { margin-bottom: 20px; }
.headlineArea_nav { display: flex; justify-content: space-between; margin-bottom: 20px; border-top: solid 1px #e5e5e5; border-bottom: solid 1px #e5e5e5; }
.headlineArea_nav li { flex: 1 1 auto; position: relative; }
.headlineArea_nav a { display: block; line-height: 48px; text-align: center; font-size: 18px; }
.headlineArea_nav li::after { content: ""; display: block; position: absolute; top: 15px; right: 0; width: 1px; height: 18px; background: #e5e5e5; }
.headlineArea_nav li:nth-last-child(1)::after { content: none; }
.headlineArea_nav a.on { color: #e61b64; }
.headline a { display: block; }
.headline_title { margin-bottom: 15px; padding-left: 10px; border-left: solid 4px #e61b64; }
.headline_title_time { margin-bottom: 5px; font-weight: 700; color: #f19ec2; }
.headline_title_text {
  font-size: 24px;
  line-height: 1.25em;
  font-weight: 700;
  color: #263348;
}
.headline_article {
  max-height: 8em;
  overflow: hidden;
  line-height: 2em;
  text-align: justify;
  color: #626262;
}
/*資訊_報告*/
.reportArea { flex: 1 1 calc(50% - 90px); width: calc(50% - 90px); max-width: calc(50% - 90px); padding-top: 30px; }
.report_title { min-height: 36px; clear: both; /*display: flex; justify-content: space-between;*/ margin-bottom: 20px; }
.report_title .areaTitle { float: left; }
.report_title .btn { float: right; }
.report_title .btn a { display: inline-block; padding: 0 30px; line-height: 36px; color: #fff; background: #009e96; }
/*資訊_報告_清單*/
.report_list {  }
.report_list li { border-bottom: solid 1px #e5e5e5; }
.report_list a { display: block; line-height: 54px; font-size: 18px; font-weight: bold; overflow: hidden; text-overflow : ellipsis; white-space : nowrap;}
.report_list_time { display: inline-block; width: 6.5em; font-size: 16px; font-weight: 700; color: #f19ec2; }
.report_list_text { display: inline; }

/*連結*/
.linkArea { margin-bottom: 30px; font-family: "Noto Sans TC"; }
.linkList { display: flex; margin-right: -10px; }
.linkList li { flex: 1 1 25%; margin-right: 10px; }
.linkList a {
  display: block;
  position: relative;
  transition: 0.2s;
}
.linkList a::before {
  content: "";
  display: block;
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.7) 100%); */
  opacity: 0;
  transition: 0.3s;
  transform:scale(1.04,1.04);
}
.linkList a:hover::before {
  opacity: 1;
 }
.linkList a img { display: block; width: 100%; transform:scale(1,1);transition: all 0.3s ease-out; border: 1px #fff solid;}
.linkList a:hover img {transform:scale(1.02,1.02); box-shadow: 0px 0px 10px gray;}

.linkList p {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 3;
  padding: 20px;
  font-size: 21px;
  line-height: 130%;
  color: #fff;
  text-shadow: 2px 0 2px rgba(64, 64, 64, 0.5);
}



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

	/*資訊_新聞*/
	.headlineArea { flex: 0 0 calc(50% + 30px); width: calc(50% + 30px); }	
	.reportArea { flex: 1 1 calc(50% - 60px); width: calc(50% - 60px); max-width: calc(50% - 60px); }

	/*資訊_報告*/
	.report_title .btn a { padding: 0 20px; }
	/*資訊_報告_清單*/
	.report_list_time { display: none; }
}


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

	/*title*/
	.areaTitle { font-size: 20px; line-height: 30px; }
	
	/*登入*/
	.loginArea { display: none; }
	/*登入_背景*/
	.bannerArea { margin-bottom: 10px; }
	.bannerArea .slick-slide {
	  margin-bottom: -5px;	  
  }
  .bannerArea .slick-slide a {
    position: relative;
    padding-top: 40%;
    background-size: cover;
    background-position: center center;
  }
	.loginArea_bg_dot  { bottom: 15px; text-align: center; }
	.loginArea_bg_dot li { margin: 0 6px; }
	/*登入_表單*/
	.login_inner { padding: 20px 30px; font-size: 16px; }
	.login_inner select { font-size: 18px; }
	.login_nav a { line-height: 44px; font-size: 22px; }
	.login_nav a.on { border-top: none; }
	.login_input { margin-bottom: 10px; }
	.btn_login a { margin-bottom: 15px; padding: 0; font-size: 18px; }

	/*登入頁面*/
	.loginPage {  }
	.loginPage .login_box { max-width: 100%; margin: 0; }
	
	/*popup_忘記密碼*/
	.btn_PwForget { display: block; }
	.btn_PwForget a { margin: 0 0 10px; padding-top: 60px; padding-bottom: 10px; font-size: 16px; background-size: auto 35px; background-position: center 15px; }
	.btn_PwForget a .title { font-size: 24px; }
	.btn_PwForget_icon01,
	.btn_PwForget_icon02 { background-size: auto 40px; }



	/*資訊*/
	.infoArea { display: block; }
	.headlineArea,
	.reportArea { width: 100%; max-width: 100%; padding-top: 20px; }
	/*資訊_新聞*/
	.headlineArea { padding: 0; box-shadow: none; padding-bottom: 20px; border-bottom: solid 1px #e5e5e5; }
	.headlineArea .areaTitle { margin-bottom: 10px; }
	.headlineArea_nav { margin-bottom: 15px; }
	.headlineArea_nav a { font-size: 16px; line-height: 38px; }
	.headlineArea_nav li::after { height: 16px; top: 11px; }
	.headline_title_time { font-size: 15px; }
	.headline_title_text { font-size: 18px; }
	.headline_article { max-height: 12em; font-size: 15px; line-height: 150%; }
	/*資訊_報告*/
	.report_title { margin: 0; }
	.report_title .btn a { line-height: 30px; }	
	.report_list a { padding: 10px 0; font-size: 16px; line-height: 130%; }
	.report_list_time { display: block; margin-bottom: 5px; }

	/*連結*/
	.linkArea { margin-bottom: 5px; }
	.linkList { overflow: auto; display: block; margin-right: -10px; }
	.linkList li { float: left; width: calc(50% - 10px); margin: 0 10px 10px 0; }
	.linkList p { padding: 12px; font-size: 13px; }

}