@charset "UTF-8";
/*內容區塊定義範例 可自行調整
-------------------------------------------------- */
/* ------------------

主內容區塊 START
------------------- */

.site-main-wrapper {
  /*主內容100%背景設定*/
  background: #1d1d1d ;
}

.site-main-wrapper img {
  vertical-align: bottom;
}

.site-main-wrapper .main-pic {
  width: 100%;
}

.site-main-wrapper .main-pic-m {
  width: 100%;
  display: none;
}


.r_box{
  background: none !important;
}

.w_word_st{
  color: #fff !important;
}

.bg-sty{
  width: 100%;
  min-height: 252px;
  background-size: cover;
}

.banner-box-l{
  background: #1d1d1d url( ../images/events/banner-l.jpg) top center no-repeat;
  width: 100%;
  background-size: auto 100%,auto;
}

.banner-box-l img{
  width: 100%;
  height: auto;
}

.map-bn-box{
  width: 100%;
  max-width: 1170px;
  margin: 0 auto;
  padding: 0px;
  display: block;
}


.bn-siz img{
  width: 90%;
  height: auto;
}

.mob-a-box{
  width: 90%;
  height: auto;
  margin-top: 40px;
  margin-bottom: 40px;
  padding: 0px;
  text-align: center;
}

.b-sty-box{
  margin-left: 20px;
  line-height: 30px;
}

.b-sty-box a{
  display: block;
  color: #fff;
  width: 100%;
  padding: 10px;
  border-radius: 10px;
  background: #a60000;
}

.tab-box td{
  vertical-align:middle !important;
}

a.a-sty{
  color: #fff;
  padding: 10px 30px 10px 30px;
  border-radius: 10px;
  background: #ff0000;
}

a:hover.a-sty{
  color: #fff;
  background: #ac0101;
} 

a.b-sty{
  color: #fff;
  padding: 10px 30px 10px 30px;
  border-radius: 10px;
  background: #ff0000;
  width: 80%;
  display: block;
  margin: 0 auto;
}

a:hover.b-sty{
  color: #fff;
  background: #ac0101;
} 

a.pik{
  color: #ee7aad;
  font-weight: bold;
}

a:hover.pik{
  color: #a64670;
}

.tg-st{
  text-align: center !important;
  margin: 0 auto !important;
}

.pb20{
  padding-bottom: 20px !important;
}

.mb20{
  margin-bottom: 20px !important;
}

.mb30{
  margin-bottom: 30px !important;
}

.mt5{ margin-top: 5px;}

.mt30{
  margin-top: 30px !important;
}

.mt20{
  margin-top: 20px !important;
}

.ml20{
  margin-left: 20px !important;
}

.bggray{ background-color: #f7f7f7;}

.pc{
  display: block;
}

.big-focus{color: red;
    font-weight: bold;
    font-size: 23px;}
.focus{color: #5401de;}

.mobile{
  display: none;
}

.mini-mobile{
  display: none;
  width: 50%;
}

.mini-mobile-but{
  display: none;
  width: 50%;
}

.con-img-st{
  width: 100%;
  text-align: center;
  margin: 0 auto;
  padding: 0px;
}

.con-img-st img{
  width: 100%;
  height: auto;
}

.con-img-st-mb{
  width: 100%;
  text-align: center;
  margin: 0 auto;
  padding: 0px;
}

.con-img-st-mb img{
  width: 80%;
  height: auto;
}

img.image-st{
  width: 100%;
  height: auto;
  position:relative;
  margin-bottom: -18px;
}

hr{
  border-top: 2px dashed #cbc0a7;
}

.bn_st img{
  width: 100%;
  height: auto;
  margin: 0 auto;
  padding: 0px;
}

.tb {
    margin-left: 30px;
    margin-top: 20px;
    font-size: 20px;
}

.tb th, .tb tr {
    border-top: #000 1px solid;
    border-bottom: #000 1px solid;

}

.tb th{font-weight: bold; color:#444; vertical-align: middle; line-height: 1.3;}

.tb td {
    color: #000;
    vertical-align: middle;
    line-height: 1.3;
	  text-align: center;
}
.tb td, .tb th {
    border-left: #000 1px solid;
    border-right: #000 1px solid;
    padding: 5px 30px;
}

.tb .sp {color: #FF0004;}

@media only screen and (min-width: 769px){
  .banner-box-l{
    height: 380px;
   }
   .bg-sty{
     padding-top: 62px !important;
     padding-bottom: 62px !important;
   }
}


@media only screen and (min-width: 940px){
   .banner-box-l{
    height: 450px;
   }

   .bg-sty{
     padding-top: 52px !important;
     padding-bottom: 52px !important;
   }
}

@media only screen and (min-width: 1170px){
   .banner-box-l{
    height: 600px;
   }

   .bg-sty{
     padding-top: 42px !important;
     padding-bottom: 42px !important;
   }
}

@media (max-width: 480px){
   .bg-sty{
     background: #fff3d4 url( ../images/events/bg-m.jpg) top center no-repeat;
     min-height: 368px;
   }
}
@media (max-width: 1170px) {
  .tb {
    font-size: 17px;
  }
  }
@media (max-width: 768px) {
  .tb {
    font-size: 15px;
    width: calc(100% - 60px);
  }
  .site-main-wrapper .main-pic {
    display: none;
  }
  .site-main-wrapper .main-pic-m {
    display: block;
  }
  .con-box-in{
    padding: 0px;
    border-radius: 0px;
  }
  .bg-sty{
     padding-top: 68px !important;
     padding-bottom: 68px !important;
     background-size: cover;
     width: 100%;
     min-height: 368px;
   }
}
@media (max-width: 568px) {
  .tb {
    width: 100%;
    margin-left: 0px;
  }
}

/*-- 內容區塊模組2 (不需要可移除)--*/
.sm-content2 {
  background: #046c7c;
}

.sm-content2 {
  zoom: 1;
}

.sm-content2:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  overflow: hidden;
  visibility: hidden;
}

.sm-content2 .smc-row {
  display: flex;
  align-items: center;
}

.sm-content2 .page-title2 {
  width: 34.1%;
  float: left;
  display: block;
  padding: 0 20px;
  font-weight: bold;
  text-align: center;
  color: white;
  line-height: 1.3;
}

.sm-content2 .page-title2 h1 {
  font-size: 30px;
  margin-bottom: 10px;
}

.sm-content2 .page-title2 h2 {
  font-size: 22px;
}

.sm-content2 .site-main-pic {
  width: 66%;
  float: right;
}

@media (max-width: 768px) {


  .sm-content2 .smc-row {
    display: block;
  }
  .sm-content2 .page-title2 {
    width: 100%;
    float: none;
    padding: 65px 15px 30px;
  }
  .sm-content2 .site-main-pic {
    width: 100%;
    float: none;
  }
  .pc{
     display: none;
   }

    .mobile{
     display: block;
   }

   .mini-mobile{
    display: table-cell;
    width: 50%;
   }

   .mini-mobile-but{
    display: table-cell;
    width: 50%;
    }

   .map-bn-box{
    display: none;
   }
}

@media (max-width: 568px) {
   .mini-mobile{
    display: none;
   }

   .mini-mobile-but{
    width: 90%;
    }

}

/*-- 內容區塊模組2 END --*/
/*--主內容區塊 END

-------------------------------------------------- */
/* ------------------

頁面導覽 START (不需要可移除)

------------------- */
.main-nav {
  background: #555;
  /*頁面導覽100%背景*/
}

.main-nav .container {
  background: #333;
  /*頁面導覽最寬1170px背景*/
}

.main-nav .main-nav-pc li, .main-nav .main-nav-pc li a {
  color: white;
  /*頁面導覽 文字顏色*/
}

.main-nav .main-nav-pc li a.on-touch, .main-nav .main-nav-pc li a.active {
  background: #111;
  /*頁面導覽 hover和觸控顏色、運行中顏色*/
}

/*--頁面導覽 END

-------------------------------------------------- */
/* ------------------

詳細內容區塊 START

------------------- */
.site-content-wrapper {
  padding-bottom: 5px;
}

.site-content-wrapper .content-title {
  line-height: 56px;
  font-size: 25px;
  color: #fff;
  margin: 20px 0px 15px;
}

.content-title{
  letter-spacing :3px;
  padding-left: 65px;
}

.b {background: url(../images/events/icon.png) no-repeat left center;height: 52px;}

.s {background: url(../images/events/icon-s.png) no-repeat left center;height: 52px;}

.mii-title{
  font-size: 22px;
  color: #fff;
  background: #585858;
  display: inline-block;
  padding: 5px 10px;
  margin-top: 20px;
  margin-left: 30px;
 }

.bbX_st{
  border-top: #999 3px dotted;
  padding: 20px 10px 10px;;
  margin-left: 30px;
  margin-top: -15px;
 }

@media (max-width: 1170px) {
  .site-content-wrapper {
    padding: 5px 20px;
  }
  .content-title{
    padding: -1px 6.5%;
  }
}

@media (max-width: 992px){
  .content-title{
    padding: 0 60px;
  }
}

@media (max-width: 769px){
  .content-title{
    padding: 0px;
    padding-left: 65px;
  }
}

.site-content-wrapper .content-des {
  font-size: 20px;
  color: #000;
  line-height: 1.7;
  padding: 5px 20px;
}

.site-content-wrapper .content-date {
  font-size: 25px;
  color: #555;
  padding: 5px 20px;
}

@media (max-width: 1170px) {
  .site-content-wrapper .content-des {
    padding: 0 15px;
	 font-size: 17px;
  }
}

.site-content-wrapper .content-list {
  font-size: 20px;
  color: #000;
  line-height: 1.5;
  padding-left: 38px;
  list-style-type: disc;
  list-style-position: outside;
}

.site-content-wrapper .content-list-2 {
  font-size: 20px;
  color: #000;
  line-height: 1.5;
  padding-left: 20px;
  padding-top: 10px;
  padding-bottom: 5px;
  list-style-type: none;
  list-style-position: outside;
}

.site-content-wrapper .content-list-3 {
  font-size: 20px;
  color: #000;
  line-height: 1.5;
  padding-left: 38px;
  padding-top: 10px;
  padding-bottom: 5px;
  list-style: decimal;
  list-style-position: outside;
}

.li_first{
  list-style-type: none;
  color: #ff0000;
}

.ol_first{
  list-style-type: none;
  color: #ff0000;
}

.site-content-wrapper .content-list li {
  margin-bottom: 10px;
  margin-left: 14px;
}

.site-content-wrapper .content-list li {
  margin-bottom: 5px;
}

.site-content-wrapper .content-list-3 li {
  margin-bottom: 5px;
  margin-left: 14px;
}

.site-content-wrapper .content-list-3 ol {
  list-style-type: disc;
  padding-left: 10px;
}

.site-content-wrapper .content-list ol {
  list-style-type: decimal;
  padding-left: 22px;
}

.stp_img_st{
  width: 100%;
  height: auto;
  padding: 0px;
  margin: 0 auto;
}

.but_st{
  color: #fff;
  border-radius: 20px;
  padding: 10px;
  display: block;
  width: 250px;
  text-align: center;
  background: #b98e29;
  font-size: 22px;
  line-height: 1.2;
  margin-left: 40px;
  transition: 0.4s;
}

.but_st:hover{
  background: #e39f01;
  transition: 0.4s;
}

@media (max-width: 1170px) {
  .site-content-wrapper .content-list, .site-content-wrapper .content-list-2, .site-content-wrapper .content-list-3 {
    padding: 0 15px;
	  font-size: 17px;
  }
}

@media (max-width: 768px) {
  .but_st{
    width: 80%;
  }
  .bbX_st{
    margin:-15px auto 0px;
    width: 90%;
  }
  .big-focus{
    font-size: 20px;}
	.site-content-wrapper .content-date{ font-size: 22px;}
	.site-content-wrapper .content-list-2 {
     padding: 0 2.5% 0 3.5%;
     font-size: 17px;
  }

  .site-content-wrapper .content-list-3 {
    padding: 0 2.5% 0 3.5%;
	  font-size: 17px;
  }
	.tb{font-size: 17px;}
	.tb td, .tb th{padding: 5px 5px;}
  .site-content-wrapper .social-share {
    display: none;
  }
}
@media (max-width: 568px) {
  .site-content-wrapper .content-list {
    padding: 0 5px;
  }
  .tb{font-size: 15px;}
  .mii-title{
    margin-left: 0px;
  }
  .bbX_st{
    width: 100%;
    padding: 20px 0 10px;
  }
  .bbX_st .content-des {
    padding: 0;
  }
  .bbX_st .content-list-2 {
    padding: 10px 0;
  }
}

.site-content-wrapper .social-share {
  position: absolute;
  z-index: 5;
  top: 10px;
  right: 15px;
}

.site-content-wrapper .social-share li {
  display: inline-block;
  margin-left: 10px;
  vertical-align: top;
}
/*--詳細內容區塊 END

-------------------------------------------------- */
/* ------------------

註冊步驟 START (不需要可移除)

------------------- */
.step-content {
  width: 100%;
  max-width: 1170px;
  height: auto;
  margin: 2% auto;
  position: relative;
}

.step-content {
  zoom: 1;
}

.step-content:after {
  content: ".";
  display: block; 
  clear: both;
  height: 0;
  overflow: hidden;
  visibility: hidden;
}

.step-content .step-wrap {
  width: 25%;
  float: left;
  margin: 0px auto 20px;
}

.step-content .ic-arrow-r {
  width: 5%;
  float: left;
  display: inline-block;
  text-align: center;
  padding-top: 150px;
}

.step-content .ic-arrow-r.icon-arrow_r {
  font-size: 40px;
  /*--箭頭尺寸--*/
  color: #AAA;
  /*--箭頭顏色--*/
}

.step-content .step-header {
  text-align: center;
  margin-bottom: 5px;
  color: #333;
  height: 100px;
}

.step-content .step-header p {
  line-height: 1.5;
  font-weight: bold;
}

.step-content .step-num {
  font-size: 36px;
  color: #036eb8;
  font-weight: bold;
  margin-bottom: 5px;
}

.step-content .step-num sub {
  margin-right: 5px;
  position: relative;
  top: -8px;
  border-bottom: 1px solid #036eb8;
  font-size: 18px;
  font-weight: bold;
}

.step-content .step-img {
  margin: 0 auto;
  text-align: center;
}

.step-content .step-img img {
  max-width: 96%;
  border: 1px solid #bbb;
}

.step-content .step-first {
  background-position: 0 7px;
}

.step-content .step-second {
  background-position: 0 -190px;
}

.step-content .step-third {
  background-position: 0 -388px;
}

.step-content .step-forth {
  background-position: 0 -587px;
}

.step-content .step-fixth {
  background-position: 0 -784px;
}

.step-content .step-sixth {
  background-position: 0 -982px;
}

@media (max-width: 768px) {
  .step-content .step-wrap {
    float: none;
    width: 100%;
    text-align: center;
  }
  .step-content .ic-arrow-r {
    display: none;
  }
  .step-content .step-img {
    width: 100%;
    margin: 0 auto;
}
}

/*--註冊步驟 END

-------------------------------------------------- */
/* ------------------

詳細內容區塊 多圖排列  START (不需要可移除)

------------------- */
.content-twoimg {
  width: 100%;
}

.content-twoimg {
  zoom: 1;
}

.content-twoimg:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  overflow: hidden;
  visibility: hidden;
}

.content-twoimg li {
  float: left;
  width: 49%;
  margin-right: 2%;
  text-align: center;
}

.content-twoimg li:last-child {
  margin-right: 0;
}

.content-twoimg img {
  width: 100%;
  vertical-align: bottom;
}

@media (max-width: 1170px) {
  .content-twoimg {
    padding: 0 2.5%;
  }
}

@media (max-width: 568px) {
  .content-twoimg li {
    float: none;
    width: 100%;
    margin-right: 0;
    margin-bottom: 15px;
  }
}

.content-threeimg {
  width: 100%;
}

.content-threeimg {
  zoom: 1;
}

.content-threeimg:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  overflow: hidden;
  visibility: hidden;
}

.content-threeimg li {
  float: left;
  width: 32%;
  margin-right: 2%;
  text-align: center;
}

.content-threeimg li:last-child {
  margin-right: 0;
}

.content-threeimg img {
  width: 100%;
  vertical-align: bottom;
}

.card_tex{
  width: 95%;
  margin: 0 auto;
  padding: 0px;
  border: #585858 1px dashed;
  margin-top: 20px;
  text-align: center
}

.card_tex .card_tex_l{
  width: 200px;
  margin: 0px;
  padding: 10px;
  display: inline-block;
  text-align: center;
}

.card_tex .card_tex_l p{
  font-size: 45px;
  color: #555;
  line-height: 55px;
}

.card_tex .card_tex_r{
  width: 70%;
  margin: 0px;
  padding: 10px;
  display: inline-block;
  vertical-align: top;
  text-align: left;
}

.card_tex .card_tex_r p{
  font-size: 16px;
  color: #555;
  line-height: 37px;
}

.card_tex .card_tex_r a{
  color: #045b87;
  font-weight: bold;
}

.card_tex .card_tex_r a:hover{
  color: #0986C5;
}

@media (max-width: 767px) {
  .card_tex{
    width: 100%;
  }

  .card_tex .card_tex_l,.card_tex .card_tex_r{
    width: 100%;
    display: block
  }

  .card_tex .card_tex_l{
    padding: 10px 10px 0px 10px;
  }

  .card_tex .card_tex_l p{
    font-size: 8.5vw;
    color: #555;
    line-height: 36px;
  }

  .card_tex .card_tex_r p{
    line-height: 23px;
    font-size: 3.5vw;
    text-align: center;
  }
}

@media (max-width: 1170px) {
  .content-threeimg {
    padding: 0 2.5%;
  }
}

@media (max-width: 568px) {
  .content-threeimg li {
    float: none;
    width: 100%;
    margin-right: 0;
    margin-bottom: 15px;
  }
  .content-threeimg img {
    width: auto;
    max-width: 100%;
  }
}

/*--詳細內容區塊 多圖排列 END

-------------------------------------------------- */


@media (max-width: 768px) {
  content: '';
  /*樣式可移除*/
}

@media (max-width: 568px) {
  content: '';
  /*樣式可移除*/
}

@media (max-width: 320px) {
  content: '';
  /*樣式可移除*/
}

.tb_st table{
  width: 100%;
}



.red{
  color: #ff0000;
}


.bg_a{
  background: #fff url('../images/events/bg_a.jpg') top center no-repeat;
  padding-top: 75px;
}

a.biu{
  color: blue;
}

a.biu:hover{
  color: #0986C5;
}

@media only screen and (min-width: 769px){
  .bg_a{
    background-size: 1332px,auto;
  }
}


@media only screen and (min-width: 940px){
  .bg_a{
    background-size: 1576px,auto;
  }
}

@media only screen and (min-width: 1170px) {
  .bg_a{
    background-size: 1920px,auto;
  }
}


@media (max-width: 769px){
  .bg_a{
    display: none;
  }
}