﻿@charset "UTF-8";
/*-------------------------------------------------------------------------------*\
     $base
\*-------------------------------------------------------------------------------*/
html, body {
  height: 100%;
  box-sizing: border-box;
}

body {
  font-family: "Microsoft Jhenghei", "微軟正黑體", "Trebuchet MS", Arial, Helvetica, sans-serif;
}

img {
  vertical-align: middle;
  display: inline-block;
}
.doit_description_list li:before,.doit_description_list li:after,.doit_description_list li a:before,.doit_description_list li a:after,
.exhibition_search_l:before,.exhibition_search_l:after,.exhi_databox:before,.exhi_databox:after,.exhi_data_detail:before,.exhi_data_detail:after
,.exhi_description:before,.exhi_description:after,.exhi_mustseebox li:before,.exhi_mustseebox li:after{
  content: "";
  display: table;
}
.doit_description_list li:after,.doit_description_list li a:after,.exhibition_search_l:after,.exhi_databox:after,.exhi_data_detail:after,
.exhi_description:after,.exhi_mustseebox li:after{
  clear: both;
}
.exhi_word a:hover, .exhi_word a:focus{
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
/*科教動手做客製頁開始*/
.doit_description_list{
      width: 100%;
    padding: 0em 2.5%;
    font-family: "Microsoft Jhenghei", "微軟正黑體", "Trebuchet MS", Arial, Helvetica, sans-serif;
}
.doit_description{
  border-bottom: 1px #ebebeb solid;
}
.doit_description ul{
padding: 1rem 2rem;
margin: 1.5em 2.5%;
box-shadow: 0px 0px 20px rgba(0, 160, 216, 0.3); 
-webkit-box-shadow: 0px 0px 20px rgba(0, 160, 216, 0.3); 
-moz-box-shadow: 0px 0px 20px rgba(0, 160, 216, 0.3); 
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
.doit_description_img{
text-align: center;
}
.doit_description ul i{
display: block;
line-height: 1.5;
color: #0069eb;
font-weight: bolder;
margin-bottom: .625rem;
}
.doit_description li{
  line-height:1.8;
  color: #303030;
}
.doit_description li a{
  color: #6800c7;
  word-wrap: break-word;
  word-break: break-all;
}
.doit_description li a:hover,.doit_description li a:focus{
  text-decoration:underline;
}
.doit_description li:last-of-type{
  margin-top: 1rem;
  font-size: .875rem;
  color: #555555;
}
.doit_description_list li{
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  box-shadow: 0px 0px 20px rgba(153, 153, 153, 0.3); 
  -webkit-box-shadow: 0px 0px 20px rgba(153, 153, 153, 0.3); 
  -moz-box-shadow:0px 0px 20px rgba(153, 153, 153, 0.3);
  margin: 2rem 0;
  padding: 1rem 2rem 1rem 1rem;
}

/*.doit_description_list li:last-of-type{
  margin:1rem 0 0;
}*/
.doit_des_img{
  float: left;
  height: 200px;
  overflow: hidden;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}
.doit_des_img img{
  width: 300px;
  max-width: inherit;
}
.doit_des_data{
  float: left;
  width: calc(100% - 300px);
  padding-left: 1rem;
}
.doit_description_list li a{
  display: block;
}
.doit_description_list li a:hover>.doit_des_data span,.doit_description_list li a:focus>.doit_des_data span{
color:  #0069eb;
}
.doit_des_data h4{
  position: relative;
  padding-left: 1.25rem;
  font-size: 1.125rem;
  color: #0069eb;
  padding-bottom: .5rem;
  border-bottom: 1px #ebebeb solid;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.doit_des_data h4:before{
  content: "";
  position: absolute;
  width: 16px;
  height: 22px;
  left: 0px;
  bottom: 6px;
  background:url(../../images/doit_icon01.svg) no-repeat;
}
.doit_des_data span{
  display: inline-block;
  color: #303030;
  padding-top: .5rem;
  line-height: 1.5;
  word-wrap: break-word;
  word-break: break-all;
}
.doit_description_list .kf_search_col {
  width: 100%;
  float: inherit;
  padding: 2.5rem 1rem 0;
}
.doit_det_center.kf_det_center{

    padding: 0em 2.5%;
}
@media screen and (max-width:641px) {
.doit_des_data{
  width: 100%;
  padding-left: 0;
  margin-top: 1rem;
}
}
@media screen and (max-width:480px) {
.doit_des_img{
  width: 100%;
}
}
/*科教動手做客製頁結束*/

/*遺失物查詢客製頁開始*/
/*.lost_ma_fombar .kf-search-date_tit{
  display: inline-block;
  vertical-align: super;
}
.lost_ma_fombar .lost-fom-mb01{
  display: inline-block;
  width: calc(100% - 90px);
}
.lost_ma_fombar .lost-fom-mb02{
  width: calc(50% - 2px);
  margin-right: 1.5%;
}
.lost_ma_fombar .kf-search-date{
  padding: 1rem 0;
}
.lost_ma_fombar  .kf-search-date span{
  vertical-align: super;
}
.kf-listtable .lost-number{
  width: 10%;
}
 .kf-listtable.lost-listtable .lost-tit{
  width: 50%;
  text-align: left;
}
.kf-listtable .lost-date{
  width: 12%;
}
.kf-listtable .lost-location{
  width: 28%;
}*/

/*new*/
.lost_ma_fombar{
    width: 100%;
    padding: 1.5em 2.5%;
    margin: 0;
    border: 0;
}
.lost_ma_fombar .kf_fm-l{
  display: inline-block;
  width: 100px;
  background: url(../../images/icon-list_disc.png) no-repeat left;
  text-align: right;
  padding: .725rem;
}
.lost_ma_fombar span.kf_fm-l{
   margin-top: 1rem;
}
.lost_ma_fombar .kf_fm-r{
  width: calc(100% - 100px);
}
.lost-fom-mb01{
  display: inline-block;
  width: calc(100% - 100px);
  margin-top: 1rem;
}
.lost-fom-mb01 .kf_fm_control{
  width: calc((100% - 20px) / 2);
}
.lost_ma_fombar .kf_search_select{
  padding: .5rem .5rem .5rem 0rem;
}
.lost_ma_fombar .kf_search_inner{
  padding: .5rem 0rem .5rem 0rem;
}
.lost_ma_fombar .kf_search_wrap{
  padding: .5rem 0 .5rem 0;
}
.lost_ma_fombar .kf_search_inner{
  width: 70%;
}
.lost-number{
  width: 10%;
}
.kf_div_td.lost-tit{
  width: 40%;
  text-align: left;
}
.lost-date{
  width: 22%;
}
.lost-location{
  width: 28%;
}

@media only screen and (max-width: 761px){
.lost_ma_fombar .kf_search_select{
  width: 100%;
  padding: .5rem 0rem .5rem 0rem;
}
.lost_ma_fombar .kf_search_inner{
  width: 100%;
}
}
@media only screen and (max-width: 576px){
.lost_ma_fombar{
  background-color: #f1f3f5;
}
}
@media only screen and (max-width: 576px){
.lost-number:before, .lost-tit:before, .lost-date:before, .lost-location:before {
    content: attr(data-title);
    color: #fff;
    background-color: #6800c7;
    position: absolute;
    left: 6px;
    width: 25%;
    line-height: 150%;
    white-space: nowrap;
    text-align: center;
    font-weight: bold;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}
.kf_div_table.lost-listtable .kf_div_td {
    text-align: left;
    border: none;
    border-bottom: 1px solid #eee;
    position: relative;
    width: 100%;
    white-space: normal;
    text-align: left;
    padding: 1rem 0 1rem 35%;
}
.kf_div_table.lost-listtable .kf_div_td:last-child{
  border-bottom: none;
}
}
/*遺失物查詢客製頁結束*/
/*展覽資訊_列表客製頁開始*/
.exhibition_fombar{
  background-color: #f8f8f8;
  width: 100%;
  padding: 1.5em 2.5%;
  margin: 0;
  border: 0;
}
.exhi_types01,.exhi_types02,.exhi_types03{
  float: left;
  width: 40%;
}
.exhi_types02{
   width: 60%;
}
.calendar_forbar .exhi_types03{
  width:100%;
}
/*.exhi_types_layout ul li > [type="checkbox"]:not(:checked), .res_domicile ul li > [type="checkbox"]:checked*/
.exhi_types_layout {
  margin: .625rem 0;
}
.exhi_types_layout ul li{
  position: relative;
  display: inline-block;
}
.exhibition_fombar h4{
  color: #555555;
  font-size: 1rem;
  /*padding-left: 1rem;
  background: url(../../images/icon-list_disc_02.png) no-repeat left;*/
}
.calendar_forbar .exhi_types03 h4{
    color: #555555;
    font-size: 1rem;
    display: inline-block;
    vertical-align: top;
    line-height: 50px;
}
.exhi_types_layout span {
  display: inline-block;
}
.exhi_types_layout ul li > [type="checkbox"]:not(:checked),.exhi_types_layout ul li > [type="checkbox"]:checked,
.exhi_types_layout span > [type="radio"]:not(:checked),.exhi_types_layout span > [type="radio"]:checked
{
  position: absolute;
  left: -9999px;
}

.exhi_types_layout  input[type="checkbox"] + label{
  cursor: pointer;
  display: block;
  color: #fff;
  background-color: #c60032;
  padding: .5rem 1rem;
  font-weight: bold;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid rgba(255, 255, 255, 0);
  margin: .5rem 0;
}
.exhi_borrowing a{
display: inline-block;
color: #fff;
background-color: #c60032;
padding: .5rem 1rem;
font-weight: bold;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
border: 1px solid rgba(255, 255, 255, 0);
margin: .5rem 0;
}
.exhi_types_layout  input[type="checkbox"]+ label:hover,.exhi_borrowing a:hover,.exhi_borrowing a:focus{
  background-color: rgba(230, 85, 109, 0.85);
}
.exhi_types_layout  input[type="checkbox"]:checked+ label{
  background-color:#6800c7;
}
.exhi_types_layout  input[type="checkbox"]:focus ~ label{
    text-decoration:underline;
}
.exhi_types_layout  input[type="radio"]:focus + label{
    text-decoration:underline;
}
.exhi_types_layout  input[type="radio"] + label{
  float: left;
  cursor: pointer;
  display: block;
  color: #6800c7;
  font-weight: bold;
  border: 1px #c0c0c0 solid;
  padding: .5rem 1.5rem;
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  border-radius: 25px;
  margin: .5rem .5rem .5rem 0;
}
.exhi_types_layout  input[type="radio"]:checked+ label{
  color: #ffffff;
  background-color: #6800c7;
  border: 1px #6800c7 solid;
}
.exhi_types_layout  input[type="radio"]+ label:hover{
  border: 1px #6800c7 solid;
}
.exhi_types_layout  input[type="checkbox"]:focus ~ label{
    text-decoration:underline;
}
.exhi_types_layout  input[type="radio"]:focus + label{
   text-decoration:underline;
}
.exhi_keyword {
    width: 100%;
    float: left;
}
.exhibition_fombar .ex-search-date_tit{
  color: #555555;
  font-family: "Microsoft Jhenghei", "微軟正黑體", "Trebuchet MS", Arial, Helvetica, sans-serif;
  text-align: left;
  display: block;
  padding: .5em 0;
}
.exhibition_fombar  .ex-search-date{
  width: 100%;
}
.exhibition_fombar  .exhi-fom-md{
  width: 100%;
}
.exhibition_fombar .ex-search-date{
  padding-bottom: .625rem;
}
.ex-search-date input[type="text"] {
    width: calc((100% - 28px) / 2);
}
.calendar_forbar .ex-search-date:nth-child(1) input[type="text"]{
 width: calc((100% - 28px) / 2);
}
.calendar_forbar .ex-search-date:nth-child(2) input[type="text"]{
 width: calc((100% - 21px) / 2);
}
.ex-fom-txt{
height: 2.375em;
    box-sizing: border-box;
    padding-left: 0.625em;
    font-size: 0.9375em;
    font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
    font-weight: normal;
    vertical-align: bottom !important;
    color: #9f9f9f;
    border: 1px solid silver;
    outline: none;
    background: #fff;
    -webkit-appearance: none;
    border-radius: 4px;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
}
.exhibition_data{
display: inline-block;
width:60%;
}
.calendar_forbar .exhibition_data{
  width:100%;
}
.exhi_keyword span{
display: inline-block;
margin-top: 1rem;
color: #555555;
}
.exhi_keyword a{
  display: inline-block;
  color: #6800c7;
  margin-bottom: .5rem;
}
.exhi_keyword a:hover,.exhi_keyword a:focus{
  color: #3301b9;
}
.exhibition_fombar .ex-btn__md1{
  display: inline-block;
  width: 120px;
  height: 2.25em;
  margin: 0 auto;
  margin: 1rem auto 0;
  line-height: 2.25em;
  text-align: center;
  vertical-align: middle;
  color: #fff;
  background:#0069eb;
  border-radius: 20px;
  border: none;
  border-radius: 20px;
}
.exhibition_fombar .ex-btn__md1:hover,.exhibition_fombar .ex-btn__md1:focus{
background: #388ef1;
    transition: all 0.3s ease;}
.exhibition_fombar .kf-btn__md1:hover,.exhibition_fombar .kf-btn__md1:focus{
 background:#009ae3;
}
.exhi_data_list{
  width:50%;
  float: left;
  padding-right: .625rem;
/*  display: -webkit-flex;
  display: flex;*/
  margin: 1.25rem 0;
}
.exhi_data_list:nth-child(even) {
   padding-left: .625rem;
   padding-right: 0;
}
.exhi_data_list figure{
  overflow: hidden;
  position: relative;
/*  -webkit-flex: 1;
          flex: 1;*/
  float: left;
 height: 288px;
  display: -webkit-flex;
  display:         flex;
  -webkit-align-items: center;
          align-items: center;
  -webkit-justify-content: center;
          justify-content: center;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  box-shadow: 0px 5px 21px #949494; 
  -webkit-box-shadow: 0px 5px 21px #949494; 
  -moz-box-shadow: 0px 5px 21px #949494; 
  z-index: 2;
}
.exhi_data_list figure img{
  width: 204px;
  height: 288px;
  max-width: inherit;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}
.exhi_word{
  float: left;
  width: calc(100% - 204px);
  height: 265px;
  color: #ffffff;
  text-align: center;
  background-color: #6800c7;
  -webkit-border-top-right-radius: 10px;
  -webkit-border-bottom-right-radius: 10px;
  -moz-border-radius-topright: 10px;
  -moz-border-radius-bottomright: 10px;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  margin: .625rem 0;
  padding: .625rem;
  overflow: hidden;
   box-shadow: 0px 5px 21px #b3b3b3; 
  -webkit-box-shadow: 0px 5px 21px #b3b3b3; 
  -moz-box-shadow: 0px 5px 21px #b3b3b3;
 background: linear-gradient(286deg, #6800c7 0%, #3301b9 100%); 
background: -moz-linear-gradient(286deg, #6800c7 0%, #3301b9 100%); 
background: -webkit-linear-gradient(286deg, #6800c7 0%, #3301b9 100%); 
background: -o-linear-gradient(286deg, #6800c7 0%, #3301b9 100%); 
}
.exhi_data_list:nth-child(4n+2) .exhi_word{
background: linear-gradient(286deg, #c60032 0%, #c60032 100%); 
background: -moz-linear-gradient(286deg, #c60032 0%, #c60032 100%); 
background: -webkit-linear-gradient(286deg, #c60032 0%, #c60032 100%); 
background: -o-linear-gradient(286deg, #c60032 0%, #c60032 100%); 
}
.exhi_data_list:nth-child(4n+3) .exhi_word{
background: linear-gradient(286deg, #b32ddb 0%, #8304a9 100%); 
background: -moz-linear-gradient(286deg, #b32ddb 0%, #8304a9 100%); 
background: -webkit-linear-gradient(286deg, #b32ddb 0%, #8304a9 100%); 
background: -o-linear-gradient(286deg, #b32ddb 0%, #8304a9 100%); 
}
.exhi_data_list:nth-child(4n+4) .exhi_word{
background: linear-gradient(286deg, #0069eb 0%, #0030ab 100%); 
background: -moz-linear-gradient(286deg, #0069eb 0%, #0030ab 100%); 
background: -webkit-linear-gradient(286deg, #0069eb 0%, #0030ab 100%); 
background: -o-linear-gradient(286deg, #0069eb 0%, #0030ab 100%); 
}
.exhi_word-tit,
.exhi_word h4{
  font-size: 1.3125rem;
  margin: .625rem 0;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.exhi_word p{
  text-align: left;
  line-height: 1.4;
  height: 5.6rem;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  margin: 1.5rem 0;
}
.exhi_word span{
  position: relative;
  display:inline-block;
  font-size: .875rem;
  margin-bottom: 1rem;
}
.exhi_word span:before{
  content: "";
  position: absolute;
  left: 0;
  width: 16px;
  height: 15px;
  left: -20px;
  background:url(../../images/exhibition_icon01.svg) no-repeat ;
}
.exhi_alink{
  display: block;
  text-align: center;
}
.exhi_word a{
display: inline-block;
color: #ffffff;
font-size: .813rem;
border: 2px #ffffff solid;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
padding: .375rem 1rem;
}
.exhi_word a:hover,.exhi_word a:focus{
  box-shadow: 0px 5px 21px #463276; 
  -webkit-box-shadow: 0px 5px 21px #463276; 
  -moz-box-shadow: 0px 5px 21px #463276; 
}
.exhi_data_list:nth-child(4n+2) .exhi_word a:hover,.exhi_data_list:nth-child(4n+2) .exhi_word a:focus{
  box-shadow: 0px 5px 21px #b82d44; 
  -webkit-box-shadow: 0px 5px 21px #b82d44; 
  -moz-box-shadow: 0px 5px 21px #b82d44; 
}
.exhi_data_list:nth-child(4n+3) .exhi_word a:hover,.exhi_data_list:nth-child(4n+2) .exhi_word a:focus{
  box-shadow: 0px 5px 21px #c58400; 
  -webkit-box-shadow: 0px 5px 21px #c58400; 
  -moz-box-shadow: 0px 5px 21px #c58400; 
}
.exhi_data_list:nth-child(4n+4) .exhi_word a:hover,.exhi_data_list:nth-child(4n+2) .exhi_word a:focus{
  box-shadow: 0px 5px 21px #0e7aae; 
  -webkit-box-shadow: 0px 5px 21px #0e7aae; 
  -moz-box-shadow: 0px 5px 21px #0e7aae; 
}
/*展覽歷史回顧開始*/
.ex_review.ex-search-date,.ex_review.exhi_keyword{
  width: 50%;
  float: left;
}
.ex_review.ex-search-date{
  padding-right: .625rem;
}
.ex_review.ex-search-date_tit{
  display: inline-block;
}
.ex_review .ex-fom-txt{
      height: calc(2.25rem + 3px);
}
/*展覽歷史回顧結束*/
@media (max-width: 1081px){
.exhi_types01, .exhi_types02, .exhi_types03{
  width: 100%;
}
.exhibition_data{
  width: 100%;
}
}
@media (max-width: 62em){
.exhi_data_list{
  width: 100%;
  padding-right:0;
 }
 .exhi_data_list figure{
  width: initial;
 }
 .exhi_word{
  width: calc(100% - 204px);
 }
}
@media (max-width: 480px){
  .kf-fombar.exhibition_fombar{
    text-align: left;
  }
  .exhi_word{
    position: relative;
  width: 100%;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  margin: -1rem 0 0;
  padding: 1rem .625rem .625rem;
  z-index: 3;
  }
  .exhi_word h4{
    font-size: 1.125rem;
    margin: 1.5rem 0 0;
  }
  .exhi_word p{
    margin: 1rem 0;
  }
  .exhi_data_list figure{
    float: initial;
  }
  .exhi_data_list figure img{
    width: inherit;
    height: auto;
    max-width: 100%;
  }
  .ex_review.ex-search-date,.ex_review.exhi_keyword{
    width: 100%;
  }
  .ex_review.ex-search-date{
    padding-right: 0;
  }
}

/*展覽資訊列表於 2020-03-23 自訂日期、關鍵字查詢、熱門關鍵字---改為進階搜尋方式*/
.search_unit{
  display: none;
  width: 100%;
  overflow: hidden;
}
.unit-open{
  display: block;
}
.search_unit_btn{
  display: block;
  width: 100%;;
  margin-top: 1rem;
  padding-top: 1rem;
  text-align: center;
  overflow: hidden;
}
.search_unit_more{
  background: rgba(2, 36, 77, 1) !important;
}
.search_unit_more:hover,.search_unit_more:focus{
  background: black !important;
}
.search_unit_more:focus{
  outline: 2px dotted black;
  outline-offset: 2px;
}
/*展覽資訊列表於 2020-03-23 自訂日期、關鍵字查詢、熱門關鍵字---改為進階搜尋方式 結束*/


/*展覽資訊_列表客製頁結束*/

/*展覽資訊內頁開始*/
.exhi_databox {
  width: 100%;
  padding: 1.5em 2.5%;
  margin: 0;
  border: 0;
}
.exhi_data_detail figure{
  overflow: hidden;
  float: left;
  height: calc(288px *1.8);
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  box-shadow: 0px 5px 21px #949494;
  -webkit-box-shadow: 0px 5px 21px #949494;
  -moz-box-shadow: 0px 5px 21px #949494;
}
.exhi_data_detail figure img{
  width: calc(204px * 1.8);
  height: calc(288px * 1.8);
  max-width: inherit;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}
.exhi_word_detail{
  float: left;
  padding-left: 2rem;
  width: calc(100% - 368px);
}
.exhi_word_detail h3{
  font-size: 1.5rem;
  font-weight: bold;
  line-height: 1.3;
  margin-bottom: .625rem;
   letter-spacing:.5px;
}
.exhi_word_detail li {
  font-size: 1.125rem;
  color: #666666;
  margin: 2rem 0;
}
.exhi_word_detail li i{
  display: inline-block;
  color: #000000;
  position: relative;
  padding-left: 2rem;
  padding-right: .625rem;
  margin-bottom: .5rem;
}
.exhi_word_detail li i:before{
  content: "";
  display: inline-block;
  position: absolute;
  left: 0;
  bottom: -10px;
  width: 32px;
  height: 30px;
}
.exhi_date i:before{
  background: url(../../images/exhi_detail_icon01.svg) no-repeat;
  background-size: 70%;
}
.exhi_location i:before{
   background: url(../../images/exhi_detail_icon02.svg) no-repeat;
   background-size: 70%;
}
.exhi_web i:before{
   background: url(../../images/exhi_detail_icon03.svg) no-repeat;
   background-size: 70%;
}
.exhi_tag i:before{
   background: url(../../images/exhi_detail_icon04.svg) no-repeat;
   background-size: 70%;
}
.exhi_web a{
  display: inline-block;
  color: #6800c7;
  word-wrap: break-word;
word-break: break-all;
}
.exhi_web a:hover,.exhi_web a:focus{
 text-decoration:underline;
}
.exhi_tag a{
  display: inline-block;
  font-size: .875rem;
  padding-bottom: .625rem;
  padding: .5rem;
  margin-bottom: .625rem;
  color: #ffffff;
  background-color: #c60032;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
.exhi_tag a:hover,.exhi_tag a:focus{
  background-color: rgba(230, 85, 109, 0.85);
}
.exhi_description{
  width: calc(100% - 368px);
  float: left;
  padding-left: 2rem;
}
.exhi_tit_list{
width: 100%;
float: left;
}
.exhi_description h5{
position: relative;
display: block;
font-size: 1.5rem;
color: #000000;
font-weight: bolder;
padding: 1.25rem;
border-bottom: 1px solid #c5c9cc;
}
.exhi_description h5:before{
    position: absolute;
    left: 0;
    content: "";
    display: block;
    width: 2px;
    height: 1.5rem;
    background: #ff4f81;
}
.exhi_tit_list>h4{
  position: relative;
  display:block;
  border-bottom: 1px solid rgba(228, 40, 88, 0.5);
}
.exhi_tit_list>h4 i{
  font-size:1.25rem;
  color: #fff;
  display: inline-block;
  padding: .625rem 3rem .625rem 2.5rem;
background: linear-gradient(-135deg, rgba(87, 127, 188, 0) 30px, #c30032 0) bottom right;
}
.exhi_tit_list>h4:before{
    content: "";
    position: absolute;
    width: 24px;
    height: 21px;
    left: 10px;
    top: 10px;
    background: url(../../images/wcm_nstm_tit02.svg) no-repeat left top;
}
.exhi_description .k_edit_wrap ol li,.exhi_description .k_edit_wrap ul li{
  padding:.625rem 0;
}
.exhi_mustsee_img{
    float: left;
    width: 200px;
    height: 120px;
    margin-right: 1rem;
    overflow: hidden;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}
.exhi_mustseebox li{
    /*webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    box-shadow: 0px 0px 20px rgba(153, 153, 153, 0.1);
    -webkit-box-shadow: 0px 0px 20px rgba(153, 153, 153, 0.1);
    -moz-box-shadow: 0px 0px 20px rgba(153, 153, 153, 0.1);*/
    margin: 2rem 0;
    padding: 1rem 2rem 1rem 1rem;
    background: linear-gradient(-45deg, transparent 35px, #f8f8f8 0) bottom right;
}
.exhi_mustseebox li a{
  display: inline-block;
  margin:1.5rem 0;
}
.exhi_mustseebox li a:hover .exhi_mustsee_img_data span,.exhi_mustseebox li a:focus .exhi_mustsee_img_data span{
color: #0069eb;
}
.exhi_mustsee_img_data h4 span{
  position: relative;
    padding-left: 1.25rem;
    font-size: 1.125rem;
    color: #0069eb;
    padding-bottom: .5rem;
    background: url(../../images/doit_icon01.svg) no-repeat left 10px;
}
.exhi_mustsee_img_data span{
  display: block;
    color: #303030;
    padding-top: .5rem;
    line-height: 1.5;
    word-wrap: break-word;
    text-align: justify;
  }
.k_spacing_pv-m{
    padding: 1rem 0;
    line-height: 1.5;
}
.k_spacing_mt-m{
  margin: 1rem 0;
}
.k_spacing_pv-m li a{
  display: inline-block;
  color: #6800c7;
  margin-bottom: 1rem;
}
.k_spacing_pv-m li a:hover,.k_spacing_pv-m li a:focus{
text-decoration: underline;
}
/*.k_spacing_mt-m{
  margin-top: 1rem;
}*/
.exhi_keytag .kf_row-mid{
position: relative;
margin: 0;
}
.exhi_keytag .kf_row-mid:after{
    content: "";
    width: 100%;
    position: absolute;
    top: 40px;
    border-bottom: 1px #c30032 solid;
}
.exhi_keytag .kf_extend_tit {
  position: relative;
  font-size: 1.25rem;
    color: #fff;
    display: inline-block;
    padding: .625rem 3rem .625rem 2.5rem;
    background: linear-gradient(-135deg, rgba(87, 127, 188, 0) 30px, #c30032 0) bottom right;
}
.exhi_keytag .kf_extend_tit:before{
  content: "";
  position: absolute;
  width: 24px;
  height: 21px;
  left: 10px;
  top: 10px;
  background: url(../../images/wcm_nstm_tit02.svg) no-repeat left top;
}
.exhi_keytag .kf_same_tag{
  display: block;
  padding: 0;
}
.exhi_keytag .kf_same_tag a{
  position: relative;
  display: block;
  background-color: inherit;
  border-bottom: 1px #ddd dashed;
  padding: .5rem .5rem .5rem 1.5rem;
}
.exhi_keytag .kf_same_tag a:before{
    content: '';
    display: block;
    position: absolute;
    left: 5px;
    top: 8px;
    background: url(../../images/exhi_tit_icon01.png) no-repeat;
    width: 2.5rem;
    height: 1rem;
}
.exhi_keytag .kf_same_tag a:hover,.exhi_keytag .kf_same_tag a:focus{
  color: #c30032;
}
.kf_extend_inner{
  margin: 1rem 0;
}
@media (max-width: 801px){
.exhi_data_detail figure{
    height: calc(288px *1.3);
}
.exhi_data_detail figure img{
    width: calc(204px * 1.3);
    height: calc(288px * 1.3);
}
.exhi_word_detail{
      width: calc(100% - 266px);
}
.exhi_description{
  width: 100%;
  padding-left:0;
}
}
@media (max-width: 641px){
  .exhi_word_detail{
    width: 100%;
    padding-left:0;
    margin-top: 1rem;
  }
  .exhi_word_detail li{
    margin: 1rem 0;
  }
}
@media (max-width: 480px){
.exhi_data_detail figure{
  float: inherit;
  box-shadow: inherit; 
  -webkit-box-shadow: inherit; 
  -moz-box-shadow: inherit;
  overflow: inherit;
 }
 .exhi_data_detail figure img{
  box-shadow: 0px 5px 21px #949494;
    -webkit-box-shadow: 0px 5px 21px #949494;
    -moz-box-shadow: 0px 5px 21px #949494;
 }
 .exhi_mustsee_img_data h4,.exhi_mustsee_img_data span{
  float: left;
  width: 100%;
 }
}
/*展覽資訊內頁結束*/

/*-------------------------------------------------------------------------------*/
/*    $蒐藏與研究                                                                          */
/*-------------------------------------------------------------------------------*/
@media (max-width: 575px) {
  .kf_div_tit-research::before {
    content: attr(data-label);
    display: inline-block;
    color: #6800c7; } }

@media (min-width: 576px) {
  .kf_div_tit-research {
    text-align: center; } }

.kf_person::after {
  content: "";
  display: table;
  clear: both; }

.kf_person_imag {
  width: 114px;
  height: 150px;
  margin: 0 auto 1rem auto;
  padding: .25rem;
  border: 1px solid #e9ecef;
  border-right: 2px solid #e9ecef;
  border-bottom: 2px solid #e9ecef;
  background-color: white;
  background-size: 150%;
  overflow: hidden; }
  .kf_person_imag img {
    width: 100%;
    height: 100%; }

.kf_list_tit1 {
  font-weight: bold;
 }
  .kf_list_tit1 + .kf_list_tit2 {
    margin-top: .5rem; }

.kf_list_tit2 {
  padding-left: 1rem;
  background-repeat: no-repeat;
  background-position: left .25rem; }
  .kf_list_tit2 + .kf_person_edit {
    margin: 1rem 0;
    padding: .5rem 1rem;
    border: 1px solid #e9ecef; }

.kf_list_tit3 {
  margin-bottom: 1rem;
  padding-left: .5rem;
  color:#6800c7;
  font-size: 1.25rem;
  border-left: 0.25rem solid #6800c7; }

.kf_person_book .kf_list_tit1 {
  padding: .5rem 0; }

.kf_person_ul::after {
  content: "";
  display: table;
  clear: both; }

.kf_person_ul li {
  padding: .5rem 0;
  color: rgba(0, 0, 0, 0.85);
  line-height: 1.2;
  border-bottom: 1px dashed #ced4da; }

.kf_person_ul span {
  display: inline-block; }
  .kf_person_ul span:first-child {
    margin-bottom: .25rem; }
  .kf_person_ul span > a {
    word-wrap: break-word;
    word-break: normal; }

.kf_person_book .kf_person_ul li:last-child, .kf_det_info .kf_person_ul li:last-child {
  border-bottom: none; }

.kf_det_info .kf_person_ul li {
  line-height: 1.5; }

.collection_slide .owl-item {
  width: 480px;
  height: 240px;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  vertical-align: middle; }
  .collection_slide .owl-item img {
    width: auto !important;
    height: 100%; }

.collection_slide .owl-dots {
  padding: .5rem;
  text-align: center; }
  .collection_slide .owl-dots .owl-dot {
    display: inline-block; }
    .collection_slide .owl-dots .owl-dot span {
      display: block;
      width: .625rem;
      height: .625rem;
      margin: 5px 7px;
      background: #adb5bd;
      border-radius: 50%; }
  .collection_slide .owl-dots .active span {
    background: #6800c7; }

@media (min-width: 576px) {
  .kf_person .kf_person_imag,
  .kf_person .kf_person-right {
    float: left; }
  .kf_person .kf_person_imag {
    margin-right: 1rem; }
  .kf_person .kf_person-right {
    width: calc(100% - (114px + 1rem)); }
  .kf_person_ul span {
    display: block; }
    .kf_person_ul span:first-child {
      float: left;
      width: 9rem;
      margin-bottom: auto; }
    .kf_person_ul span:last-child {
      margin-left: 9rem; }
  .kf_det_info .kf_person_ul span:first-child {
    width: 6rem; }
  .kf_det_info .kf_person_ul span:last-child {
    margin-left: 6rem; }
  .collection_slide .owl-item {
    width: 80%;
    height: 360px; } }

@media print {
  .kf_div_tit-research {
    text-align: center; }
  .kf_person .kf_person_imag,
  .kf_person .kf_person-right {
    float: left; }
  .kf_person .kf_person_imag {
    margin-right: 1rem; }
  .kf_person .kf_person-right {
    width: calc(100% - (114px + 1rem)); }
  .kf_person_ul span {
    display: block; }
    .kf_person_ul span:first-child {
      float: left;
      width: 9rem;
      margin-bottom: auto; }
    .kf_person_ul span:last-child {
      margin-left: 9rem; }
  .kf_det_info .kf_person_ul span:first-child {
    width: 6rem; }
  .kf_det_info .kf_person_ul span:last-child {
    margin-left: 6rem; }
  .owl-stage {
    left: -25%; } }

/*-------------------------------------------------------------------------------*/
/*    $蒐藏與研究    end                                                                      */
/*-------------------------------------------------------------------------------*/

/*學習單 開始*/

.learn-list {
  display: table;
  width:100%;
  border-collapse: collapse;
}
.thead,.tbody {display: table-header-group;}
.tr {display: table-row;}
.th,.td {display: table-cell;padding: 1em 1%;}
.learn-list .thead {
  border-top: 1px solid #6800c7;
  border-bottom: 1px solid #6800c7;
  text-align: center;
  color: #6800c7;
}
.learn-list .td {text-align: center;vertical-align: middle;}
.learn-list .tbody .tr {border-bottom: 1px dashed silver;}
.file-doc,.file-pdf,.file-xlsx,.file-odf,.file-xls,.file-txt {
    width: 25px;
    height: 25px;
    margin: .15rem;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background-size: 100%;
    display: inline-block;
    vertical-align: middle;
}
.file-doc {background-image: url(../../images/download_doc.svg);}
.file-doc:hover {background-image: url(../../images/download_doc-hover.svg);}
.file-pdf {background-image: url(../../images/download_pdf.svg);}
.file-pdf:hover {background-image: url(../../images/download_pdf-hover.svg);}
.file-xlsx {background-image: url(../../images/download_xlsx.svg);}
.file-xlsx:hover {background-image: url(../../images/download_xlsx-hover.svg);}
.file-xls {background-image: url(../../images/download_xlsx.svg);}
.file-xls:hover {background-image: url(../../images/download_xlsx-hover.svg);}
.file-txt {background-image: url(../../images/download_txt.svg);}
.file-txt:hover {background-image: url(../../images/download_txt-hover.svg);}
.learn-list .td:nth-child(2) {max-width: 18em;}

@media (max-width: 767px) {
  .learn-list .thead {display: none;}
  .learn-list .td {display: block;text-align: left;position: relative;}
  .learn-list .td:before {
    display: inline-block;
    vertical-align: middle;
  }
  .learn-list .td:nth-child(1):before {content: '展示廳：';}
  .learn-list .td:nth-child(2):before {
    content: '';
    margin-right: 5px;
    display: inline-block;
    width:13px;
    height:13px;
    background-image:url(../../images/icon-title01.svg);
    background-size: 100%;
  }
  .learn-list .td:nth-child(3):before {content: '國小低年級：';}
  .learn-list .td:nth-child(4):before {content: '國小中、高：';}
  .learn-list .td:nth-child(5):before {content: '國中：';}
  .learn-list .td:nth-child(6):before {content: '高中：';}
  .learn-list .td:nth-child(1) {
    background-color: #6800c7;
    text-align: center;
    color: white;
  }
  .learn-list .td:nth-child(2) {
    max-width: inherit;
    color: #6800c7;
    padding-top: 2em;
    margin-left: 1.2em;
    text-indent: -1.1em;
  }
  .learn-list .td:nth-child(6) {padding-bottom: 2em;}
  .file-doc,.file-pdf,.file-xlsx,.file-odf,.file-xls,.file-txt {
    width: 40px;
    height:40px;
    vertical-align: middle;
  }
}

/*學習單 結束*/

/*教具列表 開始*/

.teaching-list {overflow: hidden;}
.teaching-list ul li {float:left;width:33.33333333333333%;}
.teaching {
  margin:15px;
  overflow: hidden;
  border-radius: 20px;
}
.teaching-list li:nth-child(5n+1) .teaching {background-color: #a5d239;}
.teaching-list li:nth-child(5n+2) .teaching {background-color: #ffc31c;}
.teaching-list li:nth-child(5n+3) .teaching {background-color: #ff8975;}
.teaching-list li:nth-child(5n+4) .teaching {background-color: #aa9bff;}
.teaching-list li:nth-child(5n+5) .teaching {background-color: #7dc2ff;}
.teaching figure {
  margin: 10px 10px 0 10px;
  display: block;
  overflow: hidden;
  height:160px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  background-color: white;
  line-height : 160px;
  background-color: #ededed;
    display: -webkit-flex;
  display:         flex;
  -webkit-align-items: center;
          align-items: center;
  -webkit-justify-content: center;
          justify-content: center;
}
.teaching img {
  width:100%;
  vertical-align: middle;
  transform: scale(1);
}
.teaching-list li:hover .teaching img {transform: scale(1.1);}
.teaching-inner {padding: 20px;line-height: 1.5;}
.teaching-inner h4 {
  font-size: 1.4em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.teaching-text {padding: 15px 0;height:80px;}
.teaching-more {text-align: center;}
.teaching-more a {
  min-width: 106px;
  display: inline-block;
  padding: 10px 20px;
  width:50%;
  background:white;
  color: #181818;
  border-radius: 10px;
  margin: 10px 0 10px 0;
}
.teaching-more a:hover,.teaching-more a:focus {
  background-color: rgba(0,0,0,.75);
  color: #ffc31c;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.5);
}
@media (max-width: 1281px) {
  /*.teaching-list ul li {float:left;width:50%;}*/
  .teaching figure {
  height:140px;
  line-height : 140px;
}
}
@media screen and (min-width: 769px) and (max-width: 900px) {
 .teaching-list ul li {width: 100%;}
  .teaching figure {
    float: left;
    max-width:200px;
    height:200px;
    line-height: 200px;
    border-radius: 10px;
    margin: 10px;
  }
  .teaching-inner {
    float: left;
    width:calc(100% - 220px);
  }
  .teaching-inner h4 {
    font-size: 1.2em;
  }
  .teaching-more a {width:75%;}
  .teaching-text {height:auto;}
}
@media (max-width: 680px) {
  .teaching-list ul li {width: 100%;}
  .teaching figure {
    float: left;
    max-width:200px;
    height:200px;
    line-height: 200px;
    border-radius: 10px;
    margin: 10px;
  }
  .teaching-inner {
    float: left;
    width:calc(100% - 220px);
  }
  .teaching-inner h4 {
    font-size: 1.2em;
  }
  .teaching-more a {width:75%;}
  .teaching-text {height:auto;}
}
@media (max-width: 650px) {
  .teaching-more a {margin: 0;}
}
@media (max-width: 550px) {
  .teaching-list ul li {width: 100%;}
  .teaching figure {
    width:calc(100% - 20px);
    max-width: inherit;
    margin: 10px;
    height:280px;
    line-height: 280px;
  }
  .teaching-inner {width: 100%;}
  .teaching-more a {margin: 10px 0 20px 0;}
}
@media (max-width: 480px) {.teaching figure {height:240px;line-height: 240px;}}
@media (max-width: 380px) {
  .teaching figure {height:200px;line-height: 200px;}
}

/*教具列表 結束*/

/*教具內容 開始*/

.teaching-detail {
  overflow: hidden;
  padding: 1.5em;
  background: #f3f3f3;
  border-radius: 20px;
}
.teaching-detail figure {
  float:right;width: 50%;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
}
.teaching-detail figure img {width:100%;transform: scale(1);}
.teaching-detail figure:hover img {transform: scale(1.1);}
.teaching-detail-wrap {
  float: left;
  width: 50%;
  padding-right: 1em;
  line-height: 1.5;
}
.teaching-detail-wrap h4 {
  font-size: 1.5em;
  color: #6800c7;
}
.teaching-detail-wrap h4:first-letter {
  font-size: 1.8em;
}
.teaching-detail-wrap span {
  color: #585858;
  display: block;
  padding: 1em 0 2em 0;
  line-height: 2;
}
.teaching-table {
  display: table;
  border-collapse: collapse;
  width:100%;
}
.thead,.tbody {display: table-header-group;}
.tr {display: table-row;}
.th,.td {display: table-cell;}
.teaching-table .th,.teaching-table .td {
  position: relative;
}
.teaching-table .td {padding-left: 5px;}
.teaching-table .th:before,.teaching-table .td:before {
  content: '';
  display: block;
  border-top:1px solid #dfdfdf;
  position: absolute;
  top:0;
  left:0;
  width:100%;
}
.teaching-table .th:before {
  border-color: #6800c7;
  width:80%;
}
.teaching-table .th {
  width:7em;
  text-align: right;
  padding-right: 30px;
  color:#6800c7;
}
@media(max-width: 767px) {
  .teaching-detail {padding: 10px;}
  .teaching-detail-wrap {width:100%;padding-right: 0;}
  .teaching-detail figure {
    width:100%;
    margin-bottom: 25px;
  }
}

/*共用animate 開始*/

.teaching figure,.teaching-more a,.teaching-more a:hover,.teaching-more a:focus,
.teaching-list li:hover .teaching img,.teaching img,.teaching-detail figure:hover img,
.teaching-detail figure img,.epaper-group input[type="radio"]:checked + label,
.epaper-group label,.epaper-group input[type="radio"]:checked + label:before
{transition: all .3s ease;}

/*共用animate 結束*/

/*教具內容 結束*/

/*電子報列表 header 開始*/

.epaper-header-wrap {padding: 0 1rem;}
.epaper-header-wrap input[type="text"],
.epaper-header-wrap input[type="submit"]
{
    box-sizing: border-box;
    padding: .5rem 1.75rem .5rem .75rem;
    font-size: 0.9375em;
    font-weight: normal;
    border: 1px solid silver;
    outline: none;
    background: #fff;
    appearance: none;
    border-radius: 5px;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
    vertical-align: middle;
}
.epaper-header-wrap input[type="text"]:focus {border-color: #0069eb;}
.epaper-header-wrap input[type="submit"] {
  padding: .5rem .75rem;
  background-color: #0069eb;
  color: white;
  border: 0;
  min-width: 98px;
  box-shadow: none;
}
.epaper-header-wrap input[type="submit"]:hover {
  background-color: #2e89f1;
}
.epaper-group {padding: .25em 0;}
.epaper-group label {cursor: pointer;margin: 5px 10px 5px 5px;}
.epaper-group:first-child label:before {
    content: '';
    display: inline-block;
    width: 10px;
    height: 10px;
    background-color: #cbcbcb;
    border: 3px solid #f1f3f5;
    -moz-border-radius: 50%;
    border-radius: 50%;
    margin-right: 10px;
    vertical-align: bottom;
}
.epaper-group input[type="radio"]:checked + label {color:#c30032;}
.epaper-group input[type="radio"]:checked + label:before {
  background-color: #c30032;
  border: 3px solid #f1f3f5;
}
.epaper-group input[type="radio"]{width:0;}

@media (max-width: 800px) {
  .epaper-header-wrap input[type="text"] {width:calc(50% - 53px);}
}
@media (max-width: 576px) {
  .epaper-group:nth-child(1){padding: .75em 0;}
  .epaper-group:nth-child(1) label:before,
  .epaper-group input[type="radio"]:checked + label:before {border: 3px solid #ffffff;}
  .epaper-header-wrap {
    padding: .5rem;
    background-color: #f1f3f5;
  }
  .epaper-group:nth-child(2) input[type="text"]:first-child {
    width:100%;
    margin-bottom: 8px;
  }
  .epaper-group:nth-child(2) input[type="text"]:nth-child(2),
  .epaper-group:nth-child(3) input[type="text"]
   {width:calc(100% - 102px);}
}
/*電子報列表 header 結束*/
/*會員卡申請 開始*/

/*pade01*/
.membercard-wrap {
  padding: 1rem 1rem 2rem 1rem;
  overflow: hidden;
}
.membercard-title {
  text-align: center;
  padding: 1em 0;
}
.membercard-nav {
  text-align: center;
}
.membercard-nav a {
  position: relative;
  vertical-align: top;
  display: inline-block;
  background: #f1f1f1;
  width:calc(33.3% - 22px);
  margin: 9px;
  border-radius: 10px;
  text-align: center;
  line-height: 1.5;
  outline: 0;
  transition: all .3s ease;
}
.membercard-nav a:hover,.membercard-nav a:focus {
  background: #ffffff;
  box-shadow: 0px 5px 50px rgba(0,0,0,.3);
  transition: all .3s ease;
}
.membercard-top {padding: 1.5rem 1.5rem 0 1.5rem;}
.membercard-kind {
   position: absolute;
   font-size: 1.4em;
   left:1rem;
   text-align: center;
   line-height: 60px;
}
.membercard-bg {
  margin-top: 1.5rem;
  display: inline-block;
  width:159px;
  height:159px;
  font-size: 0;
}
.membercard-mark {padding: .5em;height: 64px;line-height: 45px;}
.membercard-text {
  text-align: left;
  background: silver;
  padding: 1.5rem;
  min-height: 120px;
  color: white;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.membercard-nav a:nth-child(1) .membercard-kind {
  width:116px;
  height:68px;
  background: url(../../images/membercard-kind-bg01.svg)no-repeat left top;
  color: #c60032;
}
.membercard-nav a:nth-child(1) .membercard-bg {
  background: url(../../images/membercard01.svg)no-repeat center center;
}
.membercard-nav a:nth-child(1) .membercard-mark {color:#c60032;line-height: 1.5;}
.membercard-nav a:nth-child(1) .membercard-text {background: #d6204e;}
.membercard-nav a:nth-child(2) .membercard-kind {
  width:163px;
  height:63px;
  background: url(../../images/membercard-kind-bg02.svg)no-repeat left top;
  color: #007d66;
}
.membercard-nav a:nth-child(2) .membercard-bg {
  background: url(../../images/membercard02.svg)no-repeat center center;
}
.membercard-nav a:nth-child(2) .membercard-mark {color:#007d66; }
.membercard-nav a:nth-child(2) .membercard-text {background: #007d66;}

.membercard-nav a:nth-child(3) .membercard-kind {
  width:184px;
  height:63px;
  background: url(../../images/membercard-kind-bg03.svg)no-repeat left top;
  color: #7762a8;
}
.membercard-nav a:nth-child(3) .membercard-bg {
  background: url(../../images/membercard03.svg)no-repeat center center;
}
.membercard-nav a:nth-child(3) .membercard-mark {color:#342558; }
.membercard-nav a:nth-child(3) .membercard-text {background: #342558;}

@media (max-width: 1050px) {
  .membercard-top {padding: .5rem .5rem 0 .5rem;}
}
@media (min-width: 900px) and (max-width: 1002px) {
  .membercard-top {padding: 0;}
  .membercard-kind {
    left:0;
    width:100% !important;
    font-size: 1.2em;
    background-image: none !important;
  }
  .membercard-bg {margin-top: 3rem;}
}
@media (min-width: 768px) and (max-width: 900px) {
  .membercard-nav a {
    width:50%;
    margin:9px 25%;
  }
}
@media (min-width: 720px) and (max-width: 768px) {
  .membercard-top {padding: 0;}
  .membercard-kind {
    left:0;
    width:100% !important;
    font-size: 1.2em;
    background-image: none !important;
  }
  .membercard-bg {margin-top: 3rem;}
}
@media (max-width: 720px) {
  .membercard-nav a {
    width:50%;
    margin:9px 25%;
  }
}
@media (max-width: 500px) {
  .membercard-nav a {
    width:70%;
    margin:9px 15%;
  }
}
@media (max-width: 400px) {
  .membercard-nav a {
    width:90%;
    margin:9px 5%;
  }
}
/*pade01 end*/

/*pade02*/
/*備註：page07及page08共用page02之css*/
.membercard-choose {
  font-size: 1.2em;
  margin: 1rem 0;
  text-align: center;
}
.membercard-choose i {
  font-size: 1.5em;
  color: #6800c7;
}
.membercard-agree {
  border: 10px solid #f1f1f1;
  padding: 1.5em;
  line-height: 1.5;
}
.membercard-apply {color: #585858;}
.membercard-apply h5 {
  font-size: 1.2em;
  text-align: center;
  padding: 1rem 0;
  color: #6800c7;
}
.membercard-apply p {
    padding-left: 1em;
    text-indent: -0.85em;
}
.membercard-apply i {color: #6800c7;}
.membercard-apply input {width:0;height:0;opacity: 0;position: absolute;}
.membercard-apply label {position:relative;cursor: pointer;padding-left: 25px;vertical-align: middle;}
.membercard-apply label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 1px;
    width: 18px;
    height: 18px;
    border: 1px solid #cfcfcf;
    background: #fff;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
    border-radius: 3px;
}
.membercard-apply input:focus ~ label:before {/* border: 1px solid #0069eb; */ outline:1px dotted #0069eb;}
.membercard-apply input ~ label:after{
    content: '■';
    position: absolute;
    top: 0px;
    left: 6px;
    font-size: 0.9375em;
    color: #0069eb;
    opacity: 0;
    transform: scale(0.5);
    transition: all 0.2s ease;
}
.membercard-apply input:checked ~ label:after {
    top: -3px;
    opacity: 1;
    transform: scale(1.1);
    transition: all 0.2s ease;
}
.membercard-apply-checkbox {margin-top: 1rem;}

.membercard-button {
  padding: 1.5em 0;
  text-align: center;
}

.membercard-button input[type="submit"],
.membercard-include-btn input[type="submit"],
.membercard-delete-btn input[type="submit"]
{
    box-sizing: border-box;
    padding: .5rem 1.75rem;
    font-size: 0.9375em;
    font-weight: normal;
    outline: 0;
    border: 0;
    color: white;
    background: #6800c7;
    appearance: none;
    border-radius: 5px;
    vertical-align: middle;
    min-width: 116px;
}
.membercard-button input[type="submit"]:hover,
.membercard-button input[type="submit"]:focus
{
  background-color: #3301b9;
}
.membercard-button input[type="submit"]:focus{
    text-decoration:underline;
}
@media(max-width: 480px) {
  .membercard-agree {padding: 1em;}
  .membercard-apply i {display: block;padding: .5em 0;}
}
/*pade02 end*/

/*page03*/
/*備註：page04及page05共用page03之css*/
.membercard-form {
  border: 10px solid #f1f1f1;
  padding: 2.5em;
}
.membercard-form-text .marks {
  display: block;
  padding-bottom: .5em;
  color: #c30032;
}
.membercard-form-text h4 {
  display: block;
  font-size: 1.5em;
  padding: .5em 0;
}
.membercard-add {
  background-color: #f1f1f1;
  padding: 2em;
  margin: 2em 0;
  border-top: 1px solid #eaeaea;
  border-bottom: 1px solid #e1e1e1;
}
.membercard-form-group .required abbr {
  color: #c30032;
  padding-left: .25rem;
  border-bottom: 0px;
  text-decoration: none;
}
fieldset.membercard-form-group{
  border: 0px solid silver;
  padding: 0;
}
.membercard-form-group {margin:.5em 0;}
.membercard-form-group:after {    
    content: "";
    display: block;
    clear: both;
}
.membercard-form-group > .required {
  float: left;
  padding: .725rem;
  vertical-align: baseline;
  width: 200px;
  text-align: right;
}
.membercard-form-inner {
  float: left;
  color: #585858;
  width:calc(100% - 200px);
}
.membercard-form-inner span {
  float: left;
  padding: .725rem .725rem .725rem 0;
}
.membercard-form-inner label {padding:0 .725rem 0 .25rem;}
.membercard-form-inner input[type="text"].kf_input-md {margin-bottom: 10px !important;}
.membercard-form-inner input[type="text"],
.membercard-form-inner input[type="file"],
.membercard-form-inner select 
{
    width: 100%;
    padding: .5rem 1.75rem .5rem .75rem;
    font-size: 1rem;
    font-weight: normal;
    color: #868e96;
    border: 1px solid #afb4ba;
    outline: none;
    background: white;
    border-radius: .25rem;
    box-shadow: inset 0 1px 0.25rem rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
}
.membercard-form-inner input[type="file"] {
  padding: .35rem;
  cursor: pointer;
}
.membercard-form-inner input[type="file"]::-webkit-file-upload-button {
    padding: .25rem .5rem;
    color: rgba(255, 255, 255, 0.85);
    font-family: "Microsoft Jhenghei", "微軟正黑體", "Trebuchet MS", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 0.875rem;
    border: 0;
    border-radius: .25rem;
    background-color: #6800c7; 
  }
.membercard-form-inner input[type="text"]:hover,
.membercard-form-inner input[type="text"]:focus,
.membercard-form-inner select:hover,
.membercard-form-inner select:focus
{border: 1px solid #6800c7;}
.membercard-form-inner select {
  width:50%;
  margin-bottom: .5em;
  background: url(../../images/module/kf_select_arrow.png) center right 10px no-repeat white;
  background-size: .5rem .4rem;
  -webkit-appearance: none;
}
.membercard-form-group > .large {width:calc(100% - 200px);}
.membercard-form-explain {
  padding: .5em 0;
  word-wrap:break-word;
  word-break:normal;
}
.membercard-form-group input[type="image"] {
  /*height: 39px;*/vertical-align: top;
 margin-right:.625rem;
  margin-bottom:.625rem;
  display: block;
  }
.membercard-code-input {width:45% !important;margin-bottom: .5em;}
a.membercard-code-btn {
    display: inline-block;
    padding: .375rem 1rem;
    line-height: 1.5;
    font-size: 1rem;
    line-height: 1.5;
    text-align: center;
    white-space: nowrap;
    vertical-align: top;
    cursor: pointer;
    border: none;
    border: .0625rem solid transparent;
    border-radius: .25rem;
    background-color:#6800c7;
    color: white;
}
a.membercard-code-btn i {margin-right: 5px;}
a.membercard-code-btn:hover,a.membercard-code-btn:focus {background-color: #3301b9;}
a.membercard-code-btn:focus{
  text-decoration:underline;
}
.membercard-include-btn,.membercard-delete-btn {text-align: center;padding: 1em 0;}
.membercard-include-btn input[type="submit"] {
    background: #007d66;
}
.membercard-include-btn input[type="submit"]:focus,
.membercard-include-btn input[type="submit"]:hover {
    background: #005d4c;
}
.membercard-include-btn input[type="submit"]:focus{
  text-decoration:underline;
}
.membercard-delete-btn input[type="submit"] {
    background:#c30032;
}
.membercard-delete-btn input[type="submit"]:focus,
.membercard-delete-btn input[type="submit"]:hover {
    background:#d6232d;
}
.membercard-delete-btn input[type="submit"]:focus{
   text-decoration:underline;
}
@media (max-width: 900px) {
  .membercard-form {padding: 1.5em;}
  .membercard-form-group > .required {
    width:100%;
    text-align: left;
  }
  .membercard-form-inner,.membercard-form-group > .large {width:100%;}
}
@media (max-width:480px) {
  .membercard-form-inner select,.membercard-code-input {width:100% !important;}
  .membercard-form-group .kf_btn{
 margin-bottom: .625rem;
  }
}
@media (max-width:420px) {
  .membercard-form {padding: 1.5em 1em;}
  .membercard-add {padding: 1em;}
  .membercard-button input[type="submit"],
  .membercard-include-btn input[type="submit"],
  .membercard-delete-btn input[type="submit"]
  { padding: .5rem;}
}
@media (max-width: 360px) {
  .membercard-form-group input[type="image"] {
    height: 60px;
  }
}
@media (max-width:350px) {
  .membercard-form {padding: 1em .5em;}
}
/*pade03 end*/

/*page06*/

.membercard-check {
  border: 10px solid #f1f1f1;
  padding: 2.5em;
}
.membercard-check .marks{
  display: block;
  padding-bottom: .5em;
  color: #d6204e;
}
.check-data {
  display: table;
  border-collapse: collapse;
  width:100%;
}
.check-data .th {
  width:10em;
  text-align: right;
  border-bottom: 1px solid white;
  background: #f4f4f4;
  padding-right: 15px;
}
.check-data .td {padding-left: 15px;}
.check-data span.required abbr {
  color: #c30032;
  padding-left: .25rem;
  border-bottom: 0px;
  text-decoration: none;
}
.add-member {
  padding: 2em 0;
  font-size: 1.2em;
  text-align: center;
  color: #6800c7;
}
.check-data .uploadimg{
    max-width: 594px;
}
@media(max-width: 600px) {
  .membercard-check {padding: 1em;}
  .check-data .th,.check-data .td {
    float:left; width:100%; text-align: left;padding-left: 10px;}
  .check-data .td {padding-left: 21px;}
  .check-data .uploadimg {padding-left: 0;padding-right: 0;}
}

/*pade06 end*/

.error-msg {
    overflow: hidden;
    width: calc(100% - 10em);
    padding: .5em 0;
    color: #6800c7;
    float: right;
}
@media (max-width: 900px) {
  .error-msg {
    width:100%;
    float: left;
  }
}

/*會員卡申請 結束*/

/*大銀幕電影 開始*/

.movie-wrap {
    padding: 1rem 1rem 2rem 1rem;
    overflow: hidden; 
}
.movie-content {line-height: 1.5;}
.movie-content h3 {
  font-size: 1.5em;
  margin-bottom: 1em;
}
.latest h3 {color: #d6204e;}
.movie {overflow: hidden;margin-bottom: 2em;}
.movie-img {
  float: left;
  width:100%;
  max-width: 220px;
}
.movie figure {
  float: left;
  width:100%;
  max-width: 220px;
  max-height: 325px;
  overflow: hidden;
  margin-bottom: 20px;
}
.movie-text {float: left; width: calc(100% - 250px); margin-left: 30px;}
.movie-text ul {margin-bottom: 1em; overflow: hidden;}
.movie-text li {padding: .5em 0;}
.movie-text li i {margin-right: 1em;}
.latest li:nth-child(2) {color: #d6204e;}
.movie-content h4 {font-size: 1.25em;}
.movie-content h4:before,.opening-hours h3:before {
  content: '';
  width:10px;
  height:10px;
  background: #d6204e;
  display: inline-block;
  margin-right: 10px;
  margin-bottom: 2px;
  vertical-align: baseline;
}
.movie-btn {padding: 1em 0;}
/*.movie-btn:before {
  content: '';
  display: table;
  clear:both;
}*/
.movie-btn a {
  display: inline-block;
  background: #d6204e;
  color: white;
  padding: .5em 1.2em;
  margin-right: .5em;
}
.movie-btn a:hover,.movie-btn a:focus {
  background: #d24c57;
}
.movie-btn a:focus{
    text-decoration:underline;
}
.commingsoon h3,.commingsoon li:nth-child(2) {color: #0069eb;}
.commingsoon h4:before,.commingsoon .movie-btn a {background:#0069eb;}
.commingsoon .movie-btn a:hover,.commingsoon .movie-btn a:focus {background:#4585c7;}
.opening-hours {
  background: #f4f4f4;
  padding: 2em;
  line-height: 1.5;
}
.opening-hours h3 {
  color: #d6204e;
  display: block;
  padding: .5em 0;
}
.opening-hours p {margin-bottom: 1em;}
.opening-hours span {display: block;padding-bottom: .25em;}
.opening-hours span i {color: #6800c7;}

/*影片*/
.movie-video{
    float: left;
    position: relative;
    width: 100%;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
    overflow: hidden;
}
.movie-video iframe {
    position: absolute;
    width: 100%;
    height: 100%;
}
/*影片*/

@media (min-width: 768px) and (max-width: 900px) {
  .movie-img {max-width: 150px;}
  .movie figure {
    max-width: 150px;
    max-height: 220px;
  }
  .movie-text {width: calc(100% - 180px);}
}
@media (max-width: 650px){
  .movie-img {max-width: 150px;}
  .movie figure {
    max-width: 150px;
    max-height: 220px;
  }
  .movie-text {width: calc(100% - 180px);}
}
@media (max-width: 544px) {
  .movie-img {
    display: inline-block; 
    max-width: 300px;
    margin-left:calc(50% - 150px);
  }
  .movie-content h3 {font-size: 1.25em;}
  .movie-content h4 {font-size: 1em;}
  .movie figure {
    display: inline-block;
    max-width: 300px;
    max-height: 440px;
  }
  .movie figure img {width:100%;}
  .movie-text {width:100%;margin:0; padding: 1.5em;}
  .movie-btn {text-align: center;padding: 1em 0;}
  .movie-text li i {margin-right: 0;}
}
@media (max-width: 412px) {
  .movie-text {padding: 1.5em 1em;}
}
@media (max-width: 350px) {
  .movie-wrap {padding: .5em;}
  .movie-text {padding: 1em .5em;}
}

/*大銀幕電影 結束*/

/*放映場次 開始*/

.screen-list {
  display: table;
  width:100%;
  border-collapse: collapse;
}
.screen-list .thead {
  border-top: 1px solid #6800c7;
  border-bottom: 1px solid #6800c7;
  text-align: center;
  color: #6800c7;
}
.screen-list .td {text-align: center;vertical-align: middle;line-height: 1.5;}
.screen-list .tbody .tr {border-bottom: 1px dashed silver;}
.screen-list .td span {display: block;}
.screen-list .td span:last-child {color: #999999;}
.screen-list .td:nth-child(2) {
  width: 75%;
}

@media (max-width: 544px) {
  .screen-list .thead {display: none;}
  .screen-list .td {display: block; text-align: left;}
  .screen-list .td:first-child span {display: inline-block;color: white;}
  .screen-list .td:first-child {background: #6800c7;text-align: center;}
  .screen-list .td:nth-child(2):before {content: '電影名稱：';color: #6800c7;}
  .screen-list .td:nth-child(3):before {content: '進場人數：';color: #6800c7;}
  .screen-list .tbody .tr {border: 0;}
}

/*放映場次 結束*/

/*即時進館人數 開始*/

.immediate-wrap {
  overflow: hidden;
  padding: 1rem;
}
.immediate-item {
  text-align: center;
  padding:4rem 2rem;
  width:calc((100% - 60px)/3);
  margin: 10px;
  float: left;
  border:10px solid #ececec;
  background: #6800c7;
  color: white;
}
.immediate-item i {
  /*border:1px solid #6800c7;*/
  font-size: 3em;
}
.immediate-item h3 {
  font-size: 1.5em;
  padding: 1em 0;
}
.immediate-item p {
  font-size: 3em;
  font-family: "arial semi";
  display: inline-block;
  width:140px;
  height:140px;
  background: #6800c7;
  color: white;
  line-height: 130px;
  border-radius: 70px;
  border: 5px solid #fff;
  box-shadow: 5px 10px 10px rgba(0,0,0,.2);
  box-shadow: inset 0px 8px 20px rgba(0,0,0,.3);
}
.immediate-item:nth-child(1),.immediate-item:nth-child(1) p {background: #7884db;}
.immediate-item:nth-child(2),.immediate-item:nth-child(2) p {background: #6800c7;}
.immediate-item:nth-child(3),.immediate-item:nth-child(3) p {background: #e06970;}
.immediate-mark {
  padding:1em 1.75em;
  color: #d6204e;
}

@media(min-width: 1002px) and (max-width: 1120px) {
  .immediate-item h3 {font-size: 1.2em;}
  .immediate-item p {
    font-size: 2em;
    width:100px;
    height:100px;
    line-height: 90px;
    border-radius: 50px;
  }
}
@media (max-width: 1002px) {
  .immediate-item {width:100%;margin: 1em 0;}
}

/*即時進館人數 結束*/

/*開放資料專區 開始*/
.opendata_category,.opendata_data{
width: 15%;
}
.opendata_table .opendata_tit{
width: 35%;
text-align: left;
}
.opendata_table .opendata_tit a{
color: #6800c7;
}
.opendata_format{
width: 10%;
}
.opendata_number,.opendata_click_on{
width: 10%
}
.opendata_table .opendata_format a{
  display: block;
  text-align: center;
  color: #fff;
  padding: 5px 15px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  margin: .5rem 0;
}
.opendata_table .opendata_format .opendata_txt{
 background-color: #b32ddb;
}
.opendata_table .opendata_format .opendata_xml{
 background-color: #375e0b;
}
.opendata_table .opendata_format .opendata_json{
 background-color: #005d4c;
}
.opendata_table .opendata_format .opendata_url{
  background-color:#c30032;
}
.opendata_table .opendata_format .opendata_csv{
  background-color:#0069eb;
}
.opendata_table .opendata_format .opendata_rdf{
  background-color:#d6204e;
}
.opendata_table .opendata_format a:hover,.opendata_table .opendata_format a:focus{
  opacity: 0.8;
 
}
.opendata_table .opendata_format a:focus{
   text-decoration:underline;
}
@media only screen and (max-width: 576px){
.opendata_table .kf_list{
  margin-bottom: 1rem;
}
.opendata_category:before, .opendata_data:before, .opendata_tit:before, .opendata_format:before,.opendata_click_on:before,.opendata_number:before {
    content: attr(data-title);
    color: #fff;
    background-color: #6800c7;
    position: absolute;
    left: 6px;
   
    line-height: 150%;
    width: 25%;
    white-space: nowrap;
    text-align: center;
    font-weight: bold;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}
.kf_div_table.opendata_table .kf_div_td {
    text-align: left;
    border: none;
    border-bottom: 1px solid #eee;
    position: relative;
    width: 100%;
    white-space: normal;
    text-align: left;
    padding: 1rem 0 1rem 35%;
}
.opendata_table .opendata_format a:first-child{
  margin-top: 0;
}
.kf_div_table.opendata_table .kf_div_td:last-child{
  border-bottom: none;
}
}
/*開放資料專區 結束*/

/*樓層介紹列表 開始*/
.floor_warp{
  padding: 3rem;
}
.floor_data li{
  margin:4rem 0;
}
.floor_data li:nth-of-type(1){
  margin: 0 0 4rem;

}
.floor_data li a.floor_dataimg{
  display: inline-block;
  transition-duration: 0.3s;
  transition-property: transform;
  -webkit-tap-highlight-color: transparent;
  transform: translateZ(0);
  box-shadow: 0 0 1px transparent;
  text-align: center;
}
.floor_data li a.floor_dataimg:hover ,.floor_data li a.floor_dataimg:focus{
  transform: translateY(-5px);
}
.floor_data li h4{
  display: inline-block;
  padding-right: 1rem;
  font-size: 5rem;
  /*font-style:oblique;*/
  font-weight: bold;
  font-family:  Arial, Helvetica, sans-serif;
  vertical-align: middle;
}
.floor_data li:nth-of-type(1) a h4{
  color: #0030ab;
}
.floor_data li:nth-of-type(2) a h4{
  color: #0069eb;
}
.floor_data li:nth-of-type(3) a h4{
  color: #dfd382;
}
.floor_data li:nth-of-type(4) a h4{
  color: #bfa8fa;
}
.floor_data li:nth-of-type(5) a h4{
  color: #eaafbc;
}
.floor_data li:nth-of-type(6) a h4{
  color: #91bd99;
}
.floor_data li:nth-of-type(7) a h4{
  color:#cfe074 ;
}
.floor_data li:nth-of-type(8) a h4{
  color:#99c06f ;
}
.floor_explain h5{
  color: #c30032;
  font-size: 1.25rem;
  font-weight: bold;
}
.floor_explain ul span{
  font-size: 1.125rem;
  color: #6800c7;
  display: inline-block;
  padding: 1rem 0 .25rem;
}
.floor_explain ul li{
  list-style-type:circle;
  line-height: 1.5;
  color: #333333;
  margin-left: 1.25rem;
}
.floor_data .floor_dataname li{
margin: 0;
}
.floor_data .floor_dataname{
  margin:1rem 0;
}
.floor_dataname a{
  position: relative;
  display: block;
  color: #333333;
  font-size: 1.125rem;
  line-height: 1.3;
  padding: .625rem 0;
  padding-left: 1.625rem;
}
.floor_data li:nth-child(1) .floor_dataname a:hover,.floor_data li:nth-child(1) .floor_dataname a:focus{
  color: #0030ab;
}
.floor_data li:nth-child(2) .floor_dataname a:hover,.floor_data li:nth-child(2) .floor_dataname a:focus{
  color: #0069eb;
}
.floor_data li:nth-child(3) .floor_dataname a:hover,.floor_data li:nth-child(3) .floor_dataname a:focus{
  color: #6800c7;
}
.floor_data li:nth-child(4) .floor_dataname a:hover,.floor_data li:nth-child(4) .floor_dataname a:focus{
  color: #9935f4;
}
.floor_data li:nth-child(5) .floor_dataname a:hover,.floor_data li:nth-child(5) .floor_dataname a:focus{
  color: #c60032;
}
.floor_data li:nth-child(6) .floor_dataname a:hover,.floor_data li:nth-child(6) .floor_dataname a:focus{
  color: #007d66;
}
.floor_data li:nth-child(7) .floor_dataname a:hover,.floor_data li:nth-child(7) .floor_dataname a:focus{
  color:#375e0b ;
}
.floor_data li:nth-child(8) .floor_dataname a:hover,.floor_data li:nth-child(8) .floor_dataname a:focus{
  color:#497d0e ;
}
.floor_dataname a:before{
  content: "";
  display: inline-block;
  position: absolute;
  width: 21px;
  height: 21px;
  left: 0;
  -webkit-border-radius: 21px;
-moz-border-radius: 21px;
border-radius: 21px;
  
}
.floor_data li:nth-child(1) .floor_dataname a:before{
background: #71bcf1 url(../../images/de_floor_dataname_icon.svg) no-repeat left top;
}
.floor_data li:nth-child(2) .floor_dataname a:before{
background: #f1ad71 url(../../images/de_floor_dataname_icon.svg) no-repeat left top;
}
.floor_data li:nth-child(3) .floor_dataname a:before{
background: #dfd382 url(../../images/de_floor_dataname_icon.svg) no-repeat left top;
}
.floor_data li:nth-child(4) .floor_dataname a:before{
background: #bfa8fa url(../../images/de_floor_dataname_icon.svg) no-repeat left top;
}
.floor_data li:nth-child(5) .floor_dataname a:before{
background: #eaafbc url(../../images/de_floor_dataname_icon.svg) no-repeat left top;
}
.floor_data li:nth-child(6) .floor_dataname a:before{
background: #91bd99 url(../../images/de_floor_dataname_icon.svg) no-repeat left top;
}
.floor_data li:nth-child(7) .floor_dataname a:before{
background: #cfe074 url(../../images/de_floor_dataname_icon.svg) no-repeat left top;
}
.floor_data li:nth-child(8) .floor_dataname a:before{
background:#99c06f url(../../images/de_floor_dataname_icon.svg) no-repeat left top;
}
.floor_numbe{
width: 20px;
height: 20px;
font-size: .9375rem;
font-weight: bold;
font-family: Arial, Helvetica, sans-serif;
vertical-align: middle;
display: inline-block;
text-align: center;
background-color: #fff;
box-shadow: 0px 2px 10px #808080; 
-webkit-box-shadow: 0px 2px 10px #808080; 
-moz-box-shadow: 0px 2px 10px #808080; 
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
margin: -5px .5rem 0 .5rem;
}
 .floor_blue{
color: #0069eb;
}
.floor_purple{
color: #6800c7;
}
.floor_pink{
color: #d6204e;
}
@media only screen and (max-width: 576px){
  .floor_warp{
  padding: 2rem;
}
.floor_data li{
  margin: 2rem 0;
}
}
/*樓層介紹列表 結束*/
/*樓層介紹內頁 開始*/
.de_floor_warp{
  position: relative;
  margin: 4rem 0 0;
}
.de_floor_warp>h5,
.de_floor_warp h4 {
  position: absolute;
    display: inline-block;
    padding-right: 1rem;
    font-size: 5rem;
    /* font-style: oblique; */
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
    vertical-align: middle;
    z-index: 3;
}
.de_floor_num6 {
    color: #0030ab;
}
.de_floor_num5 {
    color: #0069eb;
}
.de_floor_num4 {
    color: #6800c7;
}
.de_floor_num3 {
    color: #9935f4;
}
.de_floor_num2 {
    color: #c60032;
}
.de_floor_num1 {
    color:#007d66;
}
.de_floor_numb1 {
    color: #375e0b;
}
.de_floor_numb3 {
    color: #497d0e;
}
/*6f*/
.de_floor_6f{
position: relative;
background: url(../../images/de_floor_6f.svg) no-repeat right;
background-size: contain;
height: 300px;
width: 100%;
}
.de_floor_6f li{
position: absolute;
z-index: 2;
height:300px;
width:100%;
background-size: contain;
z-index: 2;
}
.de_floor_6f01{
  background: url(../../images/de_floor_6f_01.svg) no-repeat right;
}
.de_floor_6f02{
  background: url(../../images/de_floor_6f_02.svg) no-repeat right;
}
.de_floor_6f03{
  background: url(../../images/de_floor_6f_03.svg) no-repeat right;
}
.de_floor_6f04{
  background: url(../../images/de_floor_6f_04.svg) no-repeat right;
}
.de_floor_6f05{
  background: url(../../images/de_floor_6f_05.svg) no-repeat right;
}
.de_floor_6f06{
  background: url(../../images/de_floor_6f_06.svg) no-repeat right;
}
/*5f*/
.de_floor_5f{
position: relative;
background: url(../../images/de_floor_5f.svg) no-repeat right;
background-size: contain;
height: 210px;
width: 100%;
}
.de_floor_5f li{
position: absolute;
z-index: 2;
height:203px;
width:100%;
background-size: contain;
z-index: 2;
}

/*4f*/
.de_floor_4f{
position: relative;
background: url(../../images/de_floor_4f.svg) no-repeat right;
background-size: contain;
height: 440px;
width: 100%;
}
.de_floor_4f li{
position: absolute;
z-index: 2;
height:440px;
width:100%;
background-size: contain;
z-index: 2;
}
.de_floor_4f01{
  background: url(../../images/de_floor_4f_01.svg) no-repeat right;
}
.de_floor_4f02{
  background: url(../../images/de_floor_4f_02.svg) no-repeat right;
}
.de_floor_4f03{
  background: url(../../images/de_floor_4f_03.svg) no-repeat right;
}
.de_floor_4f04{
  background: url(../../images/de_floor_4f_04.svg) no-repeat right;
}
.de_floor_4f05{
  background: url(../../images/de_floor_4f_05.svg) no-repeat right;
}
.de_floor_4f06{
  background: url(../../images/de_floor_4f_06.svg) no-repeat right;
}
.de_floor_4f07{
  background: url(../../images/de_floor_4f_07.svg) no-repeat right;
}
.de_floor_4f08{
  background: url(../../images/de_floor_4f_08.svg) no-repeat right;
}
.de_floor_4f09 {
  background: url(../../images/de_floor_4f_09.svg) no-repeat right;
}
/*3f*/
.de_floor_3f{
position: relative;
background: url(../../images/de_floor_3f.svg) no-repeat right;
background-size: contain;
height: 220px;
width: 100%;
}
.de_floor_3f li{
position: absolute;
z-index: 2;
height:220px;
width:100%;
background-size: contain;
z-index: 2;
}

/*2f*/
.de_floor_2f{
position: relative;
background: url(../../images/de_floor_2f.svg) no-repeat right;
background-size: contain;
height: 310px;
width: 100%;
}
.de_floor_2f li{
position: absolute;
z-index: 2;
height:310px;
width:100%;
background-size: contain;
z-index: 2;
}
.de_floor_2f01{
  background: url(../../images/de_floor_2f_01.svg) no-repeat right;
}
.de_floor_2f02{
  background: url(../../images/de_floor_2f_02.svg) no-repeat right;
}
.de_floor_2f03{
  background: url(../../images/de_floor_2f_03.svg) no-repeat right;
}
.de_floor_2f04{
  background: url(../../images/de_floor_2f_04.svg) no-repeat right;
}
.de_floor_2f05{
  background: url(../../images/de_floor_2f_05.svg) no-repeat right;
}
.de_floor_2f06{
  background: url(../../images/de_floor_2f_06.svg) no-repeat right;
}
.de_floor_2f07{
  background: url(../../images/de_floor_2f_07.svg) no-repeat right;
}
.de_floor_2f08{
  background: url(../../images/de_floor_2f_08.svg) no-repeat right;
}
/*1f*/
.de_floor_1f{
position: relative;
background: url(../../images/de_floor_1f.svg) no-repeat right;
background-size: contain;
height: 340px;
width: 100%;
}
.de_floor_1f li{
position: absolute;
z-index: 2;
height:340px;
width:100%;
background-size: contain;
z-index: 2;
}
.de_floor_1f01{
  background: url(../../images/de_floor_1f_01.svg) no-repeat right;
}
.de_floor_1f02{
  background: url(../../images/de_floor_1f_02.svg) no-repeat right;
}
.de_floor_1f03{
  background: url(../../images/de_floor_1f_03.svg) no-repeat right;
}
.de_floor_1f04 {
  background: url(../../images/de_floor_1f_04.svg) no-repeat right;
}
/*B1*/
.de_floor_b1{
position: relative;
background: url(../../images/de_floor_b1.svg) no-repeat right;
background-size: contain;
height: 334px;
width: 100%;
}
.de_floor_b1 li{
position: absolute;
z-index: 2;
height:334px;
width:100%;
background-size: contain;
z-index: 2;
}
.de_floor_b101{
  background: url(../../images/de_floor_b1_01.svg) no-repeat right;
}
.de_floor_b102{
  background: url(../../images/de_floor_b1_02.svg) no-repeat right;
}
.de_floor_b103{
  background: url(../../images/de_floor_b1_03.svg) no-repeat right;
}
.de_floor_b104{
  background: url(../../images/de_floor_b1_04.svg) no-repeat right;
}
.de_floor_b105{
  background: url(../../images/de_floor_b1_05.svg) no-repeat right;
}
.de_floor_b106{
  background: url(../../images/de_floor_b1_06.svg) no-repeat right;
}
.de_floor_b107{
  background: url(../../images/de_floor_b1_07.svg) no-repeat right;
}
.de_floor_b108 {
  background: url(../../images/de_floor_b1_08.svg) no-repeat right;
}

.de_floor_b109 {
  background: url(../../images/de_floor_b1_09.svg) no-repeat right;
}

.de_floor_b110 {
  background: url(../../images/de_floor_b1_10.svg) no-repeat right;
}

.de_floor_b111 {
  background: url(../../images/de_floor_b1_11.svg) no-repeat right;
}

.de_floor_b112 {
  background: url(../../images/de_floor_b1_12.svg) no-repeat right;
}

.de_floor_b113 {
  background: url(../../images/de_floor_b1_13.svg) no-repeat right;
}
.de_floor_b114{
  background: url(../../images/de_floor_b1_14.svg) no-repeat right;
}

/*B3*/
.de_floor_b3{
position: relative;
background: url(../../images/de_floor_b3.svg) no-repeat right;
background-size: contain;
height: 286px;
width: 100%;
}
.de_floor_b3 li{
position: absolute;
z-index: 2;
height:286px;
width:100%;
background-size: contain;
z-index: 2;
}
@media only screen and (max-width:801px){
.de_floor_warp{
  margin: 2rem 0 0;
}
.de_floor_6f,.de_floor_6f li{
    height: 200px;
}
.de_floor_4f,.de_floor_4f li{
  height: 340px;
}
.de_floor_2f,.de_floor_2f li{
  height: 250px;
}
.de_floor_1f,.de_floor_1f li{
  height: 240px;
}
.de_floor_b1,.de_floor_b1 li{
  height: 250px;
}
.de_floor_b1,.de_floor_b1 li{
  height: 250px;
}
}
@media only screen and (max-width:641px){
.de_floor_4f,.de_floor_4f li{
  height: 280px;
}
}
@media only screen and (max-width:480px){
.de_floor_6f ,.de_floor_6f li,.de_floor_2f ,.de_floor_2f li,.de_floor_1f ,.de_floor_1f li
,.de_floor_b1 ,.de_floor_b1 li,.de_floor_b3 ,.de_floor_b3 li{
  height: 150px;
}
.de_floor_5f ,.de_floor_5f li,.de_floor_3f ,.de_floor_3f li{
  height: 100px;
}
.de_floor_4f ,.de_floor_4f li{
height: 200px;
}
.de_floor_warp h4{
  position: inherit;
  display: block;
  text-align: center;
  font-size: 3rem;
}
}
/*樓層介紹內頁 結束*/
/*熱門搜尋開始*/
.google_hot_search{
  padding:0 1rem 1rem;
}
.google_hot_search span{
  color:  #666666;
}
.google_hot_search a{
  display: inline-block;
  color: #000;
  background-color: #ffb520;
  border-radius: 1rem;
  padding: .5rem 1rem;
  margin: .25rem 0;
}
.google_hot_search a:hover,.google_hot_search a:focus{
background-color: #ff9400;
}
/*熱門搜尋結束*/