@charset "utf-8";
/* CSS Document */
body{
	background-color:#fff;
}
.wrap{
    margin: 0 7%;
    overflow:  hidden;
}
/*-------------*/
a:focus {
	outline: none;
	-webkit-box-shadow: 0 0 0 0.2rem #03A9F4;
	box-shadow: 0 0 0 0.2rem #03A9F4
}
.search_box input[type="text"]:focus {
	outline: none;
	-webkit-box-shadow: 0 0 0 0.2rem #03A9F4;
	box-shadow: 0 0 0 0.2rem #03A9F4
}
/*-------------*/
input, button, select, textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}
header{}
header .wrap{
    height: 80px;
    position: relative;
    overflow:  initial;
    margin-top: 3px;
}
header .logo{
    width: 260px;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
}
header .logo a{
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    background: url(../../images/main_logo.svg) no-repeat center/contain;
    text-indent: -9999px;
}
header .link_and_language{
    width: auto;
    height: auto;
    position: absolute;
    top: 50%;
    right: 0px;
    -webkit-transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
    z-index: 999;
}
header .language {
    display: inline-block;
}

/*除無障礙用的*/

.firstGoTo {
    position: absolute;
    opacity: 0;
}

.firstGoTo:focus {
    display: inline-block;
    opacity: 1;
    z-index: 100000;
    background: #fff;
    top: 10px;
    left: 10px;
    padding: 10px;
}
/*header .language:before{
	content:'';
	width:  1px;
	height: 80px;
	background-color: #d8d8d8;
	position: absolute;
	top: 50%;
	-webkit-transform: translate(0%, -50%);
	-ms-transform: translate(0%, -50%);
	transform: translate(0%, -50%);
}
header .language:after{
	content:'';
	width:  1px;
	height: 80px;
	background-color: #d8d8d8;
	position: absolute;
	top: 50%;
	right: 0;
	-webkit-transform: translate(0%, -50%);
	-ms-transform: translate(0%, -50%);
	transform: translate(0%, -50%);
}*/
header .language .lan {
    position: relative;
    width: 150px;
}
header .language .lan a{
    line-height: 80px;
    display:  block;
    text-align:  center;
}
header .language .lan>a:after{
	content:'';
	display: inline-block;
	width:  30px;
	height: 30px;
	vertical-align:  middle;
	background-image: url(../../images/icon/down-small.svg);
	background-size:  20px;
	background-repeat:  no-repeat;
	background-position: 50%;
}
header .language .lan>.selt:after{
	background-image: url(../../images/icon/up-small.svg);
}
header .language .lanBox {
    width: 100%;
    position: absolute;
    background-color: #fff;
    display: none;
    z-index: 1010;
    top: 80px;
    border: 1px solid #52c3e3;
    border-top: none;
}
header .language .lanBox li {
    margin: 0;
    float: none;
}
header .language .lanBox li a{
    display: block;
    line-height: initial;
    transition: .3s all;
}
header .language .lanBox li>a span{
	padding: 10px;
	display:block;
}
header .language .lanBox li>a:hover span{
	background: #45a6c1;
	color: #fff;
	display:block;
}
header .link_and_language .link{
	display: inline-block;
	padding-right: 10px;
}
header .link_and_language .link>a{
    color: #c3c3c3;
    font-size: 0.9rem;
}
header .link_and_language .link>div{
    display:  inline-block;
    line-height: 10px;
    vertical-align: middle;
    position:  relative;
}
header .link_and_language .link>.off{
	display:none;
}
.search_box{
    position:  absolute;
    right:  0;
    top: 0;
    width: max-content;
    opacity:  0;
    transition: 0.3s all;
    z-index: -1;
    /* background-color: #52c3e3; */
    border-radius: 50px;
    padding: 0 0 0 8px;
}
.search_box.open{
	opacity: 1;
	z-index: 1;
}
.search_box.open>span{
    display:  block;
    width: 30px;
    height: 30px;
    position: absolute;
    left: -35px;
    top: 50%;
    background-color: #52c3e3;
    border-radius: 50%;
    color: #fff;
    font-size: 0rem;
    -webkit-transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
    cursor:  pointer;
    background-image: url(../../images/icon/off.svg);
    background-position: 50%;
    background-repeat:  no-repeat;
    background-size: 24px;
}
.search_box label{
    display:  none;
}
.search_box input[type="text"]{
    background-color: #f1f1f1;
    color: #777;
    padding: 0 20px;
    border: none;
    border-radius: 50px;
    font-size: 1rem;
    height:  40px;
    outline: medium;
    margin: 0;
    font-family: Arial,Helvetica,"Microsoft JhengHei",Sans-Serif;
}
.search_box .search-btn{
    width: 50px;
    height: 50px;
    background-image: url(../../images/icon/search_h.svg);
    background-repeat: no-repeat;
    background-color: transparent;
    background-position: center;
    background-size: 30px;
    text-indent: -9999px;
    border: none;
    padding: 0px;
    margin: 0px;
    cursor: pointer;
    vertical-align: bottom;
    border-radius: 50%;
    background-color: #fff;
    /* border: 1px solid #52c3e3; */
    outline: medium;
    transition: .3s all;
}
.search_box .search-btn:hover{
	background-color: #FFEB3B;
}
header .link_and_language .link>div a{
	display: inline-block;
	text-indent: -9999px;
	width: 50px;
	height: 50px;
	background-size: 30px;
	background-repeat:  no-repeat;
	background-position: 50%;
	transition: .3s all;
	overflow: inherit;
	margin: 0;
}
header .search-zone input[type="text"]{
    background-color: #fff;
    margin: 5px;
    padding: 5px;
    border: none;
    border-radius: 5px;
    font-size: 1rem;
}
header .link_and_language .link>.hot a{
	    text-indent: 0;
	    width: auto;
	    display: inline-block;
	    color: #fff;
	    background-color: #187692;
	    margin: 0 5px 0 0;
	    padding: 10px;
	    height: 30px;
	    border-radius: 30px;
}
.search{
    background-image: url(../../images/icon/search.svg);
}
.search:hover{
    background-image: url(../../images/icon/search_h.svg);
}
header .link_and_language .link>div .guide{
    background-image: url(../../images/icon/guide.svg);
}
header .link_and_language .link>div .guide:hover{
    background-image: url(../../images/icon/guide_h.svg);
}
header .link_and_language .link>div .home{
    background-image: url(../../images/icon/home.svg);
}
header .link_and_language .link>div .home:hover{
    background-image: url(../../images/icon/home_h.svg);
}
/*手機板選單的開關按鈕*/
.menuBtn {
    display: none;
    text-indent: -9999px;
}
header nav>ul>li.otherLink {
    display: none;
}
/*Header*/
header {
    width: 100%;
    z-index: 1000;
}
header nav {
    width: 100%;
}
.scroll-to-fixed-fixed{
	box-shadow: 0px 3px 3px rgba(70, 70, 70, 0.35);
}
header nav.fixed {
    -webkit-transition: all .8s;
    transition: all .8s;
    box-shadow: 1px 1px 12px rgba(0, 0, 0, 0.2);
}

header nav>ul {
    margin: 0 5%;
    position: relative;
}

header nav>ul::after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

header nav>ul>li {
    width: 14%;
    float: left;
    transition: 0.3s all;
}
.mobile_language{
	display:none;
}
.mobile_language>a:before{
    display: none !important;
}
header nav>ul>li:hover>a{
	background-color:#45a6c1;
	transition: 0.3s all;
}
header nav>ul>li>a {
    text-decoration: none;
    padding: 1.3rem 1em;
    display: block;
    font-size: 1.3rem;
    text-align: center;
    color: #000;
    font-weight: bold;
}
header nav>ul>li:hover>a {
    color: #fff;
}
header nav>ul>li>a:before{
	content:'';
	display:inline-block;
	background-size: cover;
	width: 35px;
	height: 35px;
	margin-right: 5px;
	vertical-align: bottom;
}
header nav>ul>li:nth-child(1)>a:before{
	background-image: url(../../images/icon/menu-01.svg);
}
header nav>ul>li:nth-child(2)>a:before{
	background-image: url(../../images/icon/menu-02.svg);
}
header nav>ul>li:nth-child(3)>a:before{

	background-image: url(../../images/icon/menu-03.svg);
}
header nav>ul>li:nth-child(4)>a:before{
	background-image: url(../../images/icon/menu-04.svg);
}
header nav>ul>li:nth-child(5)>a:before{
	background-image: url(../../images/icon/menu-05.svg);
}
header nav>ul>li:nth-child(6)>a:before{
	background-image: url(../../images/icon/menu-06.svg);
}
header nav>ul>li:nth-child(7)>a:before{
	background-image: url(../../images/icon/menu-07.svg);
}
header nav>ul>li:nth-child(1):hover>a:before{
	background-image: url(../../images/icon/menu-01h.svg);
}
header nav>ul>li:nth-child(2):hover>a:before{
	background-image: url(../../images/icon/menu-02h.svg);
}
header nav>ul>li:nth-child(3):hover>a:before{
	background-image: url(../../images/icon/menu-03h.svg);
}
header nav>ul>li:nth-child(4):hover>a:before{
	background-image: url(../../images/icon/menu-04h.svg);
}
header nav>ul>li:nth-child(5):hover>a:before{
	background-image: url(../../images/icon/menu-05h.svg);
}
header nav>ul>li:nth-child(6):hover>a:before{
	background-image: url(../../images/icon/menu-06h.svg);
}
header nav>ul>li:nth-child(7):hover>a:before{
	background-image: url(../../images/icon/menu-07h.svg);
}
header nav>ul>li>a span {
    display: table-cell;
    vertical-align: middle;
    color: #fff;
    letter-spacing: 0.2rem;
    border-left: 1px solid rgba(222, 222, 222, 0.5);
    font-size: 120%;
    text-shadow: 1px 1px 3px #000;
}

header nav>ul>li:first-child>a span {
    border-left: none;
}
header nav>ul>li .subMenu {
    display: none;
    width: 100%;
    background: #fff;
    position: absolute;
    z-index: 9999;
    left: 0;
    margin: 0;
    list-style: none;
    box-sizing: border-box;
    padding: 20px;
    border-top: none;
    border: 1px solid #cccccc;
}
header nav>ul>li .subMenu>li {
    width: 25%;
    float: left;
}
header nav>ul>li .subMenu ul{
    padding: 0 5px;
}
header nav>ul>li .subMenu ul li{}
header nav>ul>li .subMenu ul li a{
    display:  block;
    border: none;
    margin: 0;
    padding: 3px 0;
    color: #444444;
    font-size: 1rem;
}
header nav>ul>li .subMenu ul li a:hover{
	color:#45a6c1;
	transition: 0.3s all;
}
header nav>ul>li .subMenu>li a {
    display: block;
    font-size: 1.1rem;
    transition: 0.3s all;
    font-weight: bold;
    color: #52c3e3;
    padding-bottom: 5px;
    margin: 0 20px 5px 0;
    border-bottom: 1px solid;
}
header nav>ul>li .subMenu>li a:hover{
	color:#45a6c1;
}
header nav>ul>li .normal-sub>li a {
    display: block;
    width: 100%;
    padding: 0.7em 0;
    margin:  0;
    transition: 0.3s all;
    color: #444444;
    font-weight: bold;
    text-align:center;
    border: none;
    font-size: 1.1rem;
}
header nav>ul>li .normal-sub>li a:hover{
	background-color:#45a6c1;
	color: #fff;
}
header nav>ul>li .subMenu>li>ul li a {
    padding: 2px 0;
}
header nav>ul>li .subMenu>li>ul a span {
    display: table-cell;
    vertical-align: middle;
    color: #fff;
    font-size: 1rem;
}
header nav {
    background-color: #ffffff;
    border-top: 1px solid #b7b7b7;
}
header nav>ul>li .normal-sub{
    width: calc((100% / 7 - 4px));
    left:  auto;
    padding: 0;
}
header nav>ul>li .normal-sub li{
    width: 100%;
    padding: 0;
}
/*--tourism--*/
header nav>ul>li .tourism{
    width: 760px;
    left: auto;
    padding: 0;
}
header nav>ul>li .tourism>li{
    width: 100%;
    padding-right: 60%;
}
header nav>ul>li .tourism>.top_ten ul:before{
	content:'推薦景點';
	display:  block;
	text-align:  center;
	background-color: #e90059;
	color: #fff;
	height: 45px;
	line-height: 45px;
	font-weight: bold;
}
header nav>ul>li .tourism>li>ul>li{
    padding: 0;
    width: 50%;
    float: left;
}
header nav>ul>li .tourism>li>ul>li a{
    text-align:  left;
}
header nav>ul>li .tourism>li>ul>li a{
	padding: 8px 15px;
}
header nav>ul>li .tourism>li>ul>li a:hover{
	color: #fff;
}
header nav>ul>li .tourism>li a{
    border-bottom: none;
    color: #444444;
    text-align: center;
    padding: 1rem;
    transition: 0.3s all;
    margin: 0;
}
header nav>ul>li .tourism>li a:hover{
	background: #45a6c1;
	color:#fff;
}
header nav>ul>li .tourism>.open{}
header nav>ul>li .tourism>.open ul{
	display:block;
}
header nav>ul>li .tourism>li>ul{
    width: 60%;
    position:  absolute;
    right:  0;
    top: 0;
    padding: 0;
    background-color: #fff;
    height: 100%;
    border-left: 1px solid #e0e0e0;
}
header nav>ul>li .tourism>li>a:before{
	content:'';
	display:  inline-block;
	width: 60px;
	height: 60px;
	background-size:  contain;
	vertical-align: middle;
	margin: 0 15px 0 -15px;
	background-size:  85%;
	background-repeat:  no-repeat;
	background-position: 50%;
	transition: 0.3s all;
}
header nav>ul>li .tourism>li:nth-child(1)>a:before{
    background-image: url(../../images/icon/tourism-1.svg);
}
header nav>ul>li .tourism>li:nth-child(2)>a:before{
    background-image: url(../../images/icon/tourism-2.svg);
}
header nav>ul>li .tourism>li:nth-child(3)>a:before{
    background-image: url(../../images/icon/tourism-3.svg);
}
.tourism>li:nth-child(1)>a:hover:before{
    background-image: url(../../images/icon/tourism-1h.svg);
}
header nav>ul>li .tourism>li:nth-child(2)>a:hover:before{
    background-image: url(../../images/icon/tourism-2h.svg);
}
header nav>ul>li .tourism>li:nth-child(3)>a:hover:before{
    background-image: url(../../images/icon/tourism-3h.svg);
}

.mm-listview>li>a:before{
	content:'';
	display:inline-block;
	background-size: cover;
	width: 35px;
	height: 35px;
	margin-right: 10px;
	vertical-align: middle;
}
.mm-listview>li:nth-child(1)>a:before{
	background-image: url(../../images/icon/menu-01.svg);
}
.mm-listview>li:nth-child(2)>a:before{
	background-image: url(../../images/icon/menu-02.svg);
}
.mm-listview>li:nth-child(3)>a:before{
	background-image: url(../../images/icon/menu-03.svg);
}
.mm-listview>li:nth-child(4)>a:before{
	background-image: url(../../images/icon/menu-04.svg);
}
.mm-listview>li:nth-child(5)>a:before{
	background-image: url(../../images/icon/menu-05.svg);
}
.mm-listview>li:nth-child(6)>a:before{
	background-image: url(../../images/icon/menu-06.svg);
}
.mm-listview>li:nth-child(7)>a:before{
	background-image: url(../../images/icon/menu-07.svg);
}
.subMenu>li>a:before{
	display:none;
}
/*--------------------*/
.webpath_and_control{
    padding: 20px 0;
    background-color: #f3f3f3;
}
.webpath_and_control .wrap{
    position:  relative;
    overflow:  inherit;
}
.webpath{}
.webpath>a{
	float: left;
	display: block;
	margin: 0 3px 0 0;
}
.webpath .accesskeytype{
    color: #c3c3c3;
    font-size: 0.9rem;
}
.webpath ul{}
.webpath ul li{
    display:  inline-block;
}
.webpath ul li a{

line-height: 2rem;

display:  block;

color: #000;

padding: 0 0 0 20px;

background-image: url(../../images/icon/webpath_next.svg);

background-size: 14px;

background-repeat:  no-repeat;

background-position: 0 8px;

transition: 0.3s all;
}
.webpath ul li:last-child a{
    font-weight: bold;
}
.webpath ul li a:hover{
	color: #e90059;
}
.webpath ul .home a{
    background-image: url(../../images/icon/p_home.svg);
    text-indent: -9999px;
    background-size: 80%;
    background-repeat:  no-repeat;
    background-position: 50% 0;
    width: 2rem;
    height: 2rem;
}
.webpath ul .home a:hover{
    background-image: url(../../images/icon/p_home_h.svg);
}
.control{
	position:  absolute;
	right: 0;
	top: 0;
}
.control ul{}
.control ul li{
    display:  inline-block;
    margin: 0 5px;
    position: relative;
}
.control ul li.level-2{
	display:none;
}
.control ul .share ul{
    position: absolute;
    left: 50%;
    width: 2.5rem;
    -webkit-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%);
    z-index: 9;
}
.control ul .share ul li{
    display:  block;
    margin: 5px 0;
}
.control ul .share ul li a{
    border-radius: 50%;
    background-size: 100%;
    width: 2.5rem;
    height: 2.5rem;
}
.control ul li a{
    width: 2rem;
    height: 2rem;
    display:  block;
    text-indent: -9999px;
    background-size: 80%;
    background-position:  50%;
    background-repeat:  no-repeat;
    transition: 0.3s all;
}
.control ul li a.selt{
	background-image: url(../../images/icon/share_h.svg);
}
.control ul .printer>a{
    background-image: url(../../images/icon/printer.svg);
}
.control ul .share>a{
    background-image: url(../../images/icon/share.svg);
}
.shareIcon_FB {
    background-color: #3b5998;
    background-image: url(../../images/icon/facebook.svg);
}

.shareIcon_TW {
    background-color: #00aced;
    background-image: url(../../images/icon/twitter.svg);
}

.shareIcon_PK {
    background-color: #c6602b;
    background-image: url(../../images/icon/plurk.svg);
}

.shareIcon_GL {
    background-color: #d64136;
    background-image: url(../../images/icon/google.svg);
}

.shareIcon_LN {
    background-color: #2cbf13;
    background-image: url(../../images/icon/line.svg);
}
.control ul .printer>a:hover{
    background-image: url(../../images/icon/printer_h.svg);
}
.control ul .share>a:hover{
    background-image: url(../../images/icon/share_h.svg);
}
.control ul .level-1>a{
    background-image: url(../../images/icon/level-1.svg);
}
.control ul .level-2>a{
	background-image: url(../../images/icon/level-2.svg);
}
.control ul .level-3>a{
	background-image: url(../../images/icon/level-3.svg);
}
.control ul .foucs.level-1>a{
	background-image: url(../../images/icon/level-1_h.svg);
}
.control ul .foucs.level-2>a{
	/* background-image: url(../../images/icon/level-2_h.svg); */
}
.control ul .foucs.level-3>a{
	background-image: url(../../images/icon/level-3_h.svg);
}
.control ul .level-1>a:hover{
	background-image: url(../../images/icon/level-1_h.svg);
}
.control ul .level-2>a:hover{
	/* background-image: url(../../images/icon/level-2_h.svg); */
}
.control ul .level-3>a:hover{
	background-image: url(../../images/icon/level-3_h.svg);
}
.control ul .level-1>a:hover{
	background-image: url(../../images/icon/level-1_h.svg);
}
.control ul .level-2>a:hover{
	/* background-image: url(../../images/icon/level-2_h.svg); */
}
.control ul .level-3>a:hover{
	background-image: url(../../images/icon/level-3_h.svg);
}
.control ul .level-1>a:focus{
	background-image: url(../../images/icon/level-1_h.svg);
}
.control ul .level-2>a:focus{
	/* background-image: url(../../images/icon/level-2_h.svg); */
}
.control ul .level-3>a:focus{
	background-image: url(../../images/icon/level-3_h.svg);
}
.locate{
    position: absolute;
    width: 100%;
    z-index: 99;
    background-color: inherit;
}
.locate .webpath ul li a{
    color: #fff;
    background-image: url(../../images/icon/L_webpath_next.svg);
}
.locate .webpath ul .home a{
    background-image: url(../../images/icon/L_p_home.svg);
}
.locate .control ul li a.selt{
	background-image: url(../../images/icon/L_share_h.svg);
}
.locate .control ul .printer>a{

    background-image: url(../../images/icon/L_printer.svg);
}
.locate .control ul .share>a{
    background-image: url(../../images/icon/L_share.svg);
}
.locate .control ul .level-1>a{
    background-image: url(../../images/icon/L_level-1.svg);
}
.locate .control ul .level-2>a{
	background-image: url(../../images/icon/L_level-2.svg);
}
.locate .control ul .level-3>a{
	background-image: url(../../images/icon/L_level-3.svg);
}
.control ul .foucs.level-1>a{
	background-image: url(../../images/icon/L_level-1_h.svg);
}
.control ul .foucs.level-2>a{
	/* background-image: url(../../images/icon/L_level-2_h.svg); */
}
.control ul .foucs.level-3>a{
	background-image: url(../../images/icon/L_level-3_h.svg);
}
/*--------------------*/

.main_content{}
.main_content .content h1 span{
    display: inline-block;
    color: #777;
    font-size: 1.2rem;
    font-weight: bold;
    margin: 0 5px 0 0;
}
.main_content .content{
    overflow:  hidden;
    margin: 30px 0;
    position:  relative;
}
.main_content .content .page_h1box{
    width: calc((100% - 300px));
}
.main_content .content article{
    width: 100%;
}
.main_content .content .on_sidenav{
    width: calc((100% - 320px));
    float: left;
    text-align: left;
}
.main_content .content aside{
    width: 280px;
    position: absolute;
    right: 0;
    top: 0;
}
.main_content .content aside .storageMenu{
    overflow:  hidden;
}
.main_content .content aside .storageMenu .title{
    display:  block;
    font-weight:  bold;
    background-color: #187692;
    color: #fff;
    font-size: 1.6rem;
    line-height:  initial;
    padding: 15px;
}
.main_content .content aside .storageMenu .title span{
    font-size: 1.4rem;
    color: #fff;
    font-weight: bold;
    margin: 0 10px;
}
.main_content .content aside .storageMenu ul{
    background-color: #f3f3f3;
}
.main_content .content aside .storageMenu ul li{
    border-bottom: 1px solid #fff;
}
.main_content .content aside .storageMenu ul li:last-child{
    border-bottom: none;
}
.main_content .content aside .storageMenu ul li a{
    display:  block;
    padding: 15px 18px;
    line-height:  initial;
    font-size: 1.1rem;
    transition: 0.3s all;
}
.main_content .content aside .storageMenu ul li a:hover{
	background-color: #d9d9d9;
}
.page_content{
    margin: 20px 0;
}
.page_content sup.button{
	display: block;
	text-align: center;
}
.page_content sup.button:after{
	content:'進階搜尋';
	cursor: pointer;
	display: inline-block;
}
/*---搜尋---*/
.page_search{}
.page_search ul{
    text-align:  center;
}
.page_search ul li{
    display:  inline-block;
    vertical-align: sub;
}
.page_search ul li label{
    margin: 0 10px;
}
.page_search ul li label.caption{
}
.page_search ul li select{
    height: 50px;
    font-size: 1rem;
    letter-spacing: 2px;
    border: none;
    outline: 0;
    padding: 7px 40px 7px 7px;
    background-color: #f3f3f3;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url(../../images/icon/d-small.svg);
    background-size:  26px;
    background-position: calc((100% - 8px)) 50%;
    background-repeat:  no-repeat;
}
option{appearance: none;-moz-appearance:none;-webkit-appearance:none;}
.page_search ul li input[type=text] {
    height: 50px;
    line-height: 50px;
    font-size: 1rem;
    letter-spacing: 2px;
    border: none;
    outline: 0;
    padding: 7px;
    background-color: #f3f3f3;
}
.page_search ul li input[type=submit] {
    width: 50px;
    height: 50px;
    border: none;
    text-indent: -9999px;
    cursor: pointer;
    outline: 0;
    background: #e90059 url(../../images/icon/search_p.svg) no-repeat center/55%;
    border-radius: 5px;
    transition: 0.3s all;
    vertical-align: bottom;
}
.page_search ul li input[type=submit]:hover {
    background: #ffa5c8 url(../../images/icon/search_p.svg) no-repeat center/55%;
}
/*---頁次---*/
.page_select{}
.page_select ul{
    text-align: center;
    font-size: 0rem;
}
.page_select ul li{
    display:  inline-block;
    position: relative;
}
.page_select ul .current a{
    background-color: #e90059;
}
.page_select ul .current a span{
	color: #fff;
}
.page_select ul li a{
    display:  block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    background-color: #f3f3f3;
    color: #777;
    background-size: 50%;
    background-position:  50%;
    background-repeat:  no-repeat;
    transition: 0.3s all;
    margin: 0 0.5px;
}
.page_select ul li a:hover:after{
	content:'';
	width: calc((100% - 1px));
	height: 3px;
	position:  absolute;
	left:  0;
	bottom: 0;
	background-color: #e90059;
}
.page_select ul li a:hover{
	
}
.page_select ul li.this a{
    background-color: #e90059;
    color:#fff;
}
.page_select ul .prev a{
	text-indent: -9999px;
	background-image: url(../../images/icon/select_prev.svg);
}
.page_select ul .next a{
	text-indent: -9999px;
	background-image: url(../../images/icon/select_next.svg);
}
.page_select ul .last a,
.page_select ul .first a{
	width:  auto;
	padding: 0 20px;
}
/*---相關照片---*/
.att_photos{}
.att_photos h3{
    margin: 10px 0 20px 0;
    color: #1aa4a0;
}
.att_photos h3:before{
	content:'';
	display: inline-block;
	width: 35px;
	height: 35px;
	background-image: url(../../images/icon/att_photos.svg);
	background-size:  cover;
	vertical-align: sub;
	margin: 0 10px 0 0;
}
.demo-gallery{}
.demo-gallery .LightBox{}
.demo-gallery .LightBox .lightgallery{
    overflow: hidden;
    margin: 0 -10px;
}
.demo-gallery .LightBox .lightgallery a{
    display: block;
    width: calc((100% / 3));
    float: left;
    padding: 0 10px 10px 10px;
    cursor: zoom-in;
}
.demo-gallery .LightBox .lightgallery a span{
    padding-bottom: 65%;
    display: block;
}
.demo-gallery .LightBox .lightgallery a p{
    margin: 5px 0 0 0;
}
/*---table---*/

.att_download{}
.att_download b{
    margin: 10px 0 20px 0;
    color: #1aa4a0;
	font-size: 1.8rem;
    line-height: initial;
    font-weight: bold;
	display:block;
}
.att_download b:before{
	content:'';
	display: inline-block;
	width: 35px;
	height: 35px;
	background-image: url(../../images/icon/att_download.svg);
	background-size:  cover;
	vertical-align: sub;
	margin: 0 10px 0 0;
}
.att_download table{
    width: 100%;
    border: 1px solid #ccc;
}

.att_download table tr{
    background-color: #f3f3f3;
}
.att_download table tr:nth-child(odd){
    background-color: #ffffff;
}
.att_download table tr th{
    text-align:  left;
    background-color: #0E8293;
    color: #fff;
    padding: 10px;
}
.att_download table tr th:first-child{
    width: 60%;
}
.att_download table tr td{
    padding: 10px;
}
.att_download table tr td .bt-content img{
    display:  block;
    width: 50px;
    border-radius: 50%;
}
/*--------------------*/
.news_select{
    margin-top: 15px;
}
.news_select a{
    display: table;
    margin: 10px 0;
    padding: 0 15px 0 0;
}
.news_select a span{
    background: #e90059;

    color: #fff;
    padding: 3px 15px;
    transition: 0.3s all;
    border-radius: 8px;
    display:  inline-block;
    margin: 0 10px 0 0;
}
.news_select a:hover span{
    background: #ffa5c8;
}
.news_select .back{
    text-align:  center;
}
.news_select .back a{
    display: inline-block;
    padding: 3px 20px;
    margin:  0;
    background-color: #e90059;
    color: #fff;
    border-radius: 8px;
    transition: 0.3s all;
}
.news_select .back a:hover{
	background: #ffa5c8;
}
/*--------------------*/
.webbug_and_updated{}
.webbug_and_updated .wrap{
	padding: 10px 0 0 0;
}
.webbug{
    /* float:  left; */
}
.webbug a{
    /* color: #52c3e3; */
    font-weight:  bold;
}
.updated{
    float: right;

}
.updated span{
	color: #e90059;
}
.under_box{
    text-align:  center;
    position:  relative;
    margin: 20px 0;
}
.under_box:before{
	content:'';
	width:  100%;
	height: 1px;
	display:  block;
	background-color: #ccc;
	position:  absolute;
	top: 50%;
	z-index: -1;
}
.under_box a{
    display:  inline-block;
    padding: 0 10px 0 20px;
    line-height: 40px;
    border: 1px solid #ccc;
    border-radius: 999px;
    background-color: #fff;
}
.under_box a:after{
	content:'';
	display: inline-block;
	width: 30px;
	height: 30px;
	vertical-align: middle;
	background-image: url(../../images/icon/down-small.svg);
	background-size: 20px;
	background-repeat: no-repeat;
	background-position: 50%;
	transition: 0.3s all;
	margin: -5px 0 0 0;
}
.under_box .selt:after{
	content:'';
	background-image: url(../../images/icon/up-small.svg);
}
/*------------------------------*/
.top_and_back{
    position:  fixed;
    bottom: 1%;
    right: 1%;
    display: none;
    z-index: 999;
}
.top_and_back a{

    width:  50px;
    height:  50px;
    display:  block;
    background-color: rgba(252, 96, 155, 0.7);
    position: relative;
    background-size:  cover;
    margin: 0 0 1px 0;
    transition: 0.5s all;
    border-radius: 10px 10px 10px 10px;
    overflow:  hidden;
}
.top_and_back a:hover{
	background-color: rgba(252, 96, 155, 1);
	border-radius: 0px 10px 10px 0px;
	overflow: initial;
}
.top_and_back .top{
	background-image: url(../../images/icon/top.svg);
}
.top_and_back .back{
	background-image: url(../../images/icon/back.svg);
}
.top_and_back a span{
    position:  absolute;
    width:  max-content;
    right: 0%;
    line-height: 50px;
    color: #fff;
    background-color: rgba(252, 96, 155, 0.7);
    transition: 0.5s all;
    padding: 0 10px;
    opacity:0;
    z-index:-1;
    border-radius: 10px 0px 0px 10px;
}
.top_and_back a:hover span{
    right: calc((100% - 1px));
    background-color: rgba(252, 96, 155, 1);
    opacity:1;
}
/*------------------------------*/
.fatfooter_index{}
.fatfooter{
	padding: 20px 0 40px 0;
}

.fatfooter ul{
    overflow:  hidden;
    padding: 0 2%;
}
.fatfooter ul li{
    width: calc((100% / 6));
    float:  left;
}
.fatfooter ul li>a{
    font-size:  1.2rem;
    font-weight:  bold;
    transition: 0.3s all;
}

.fatfooter ul li>a:hover{
	color:#52c3e3;
}
.fatfooter ul li ul{

    border-left: 1px solid #52c3e3;
    padding: 0 0 0 10px;
    margin: 5px 0 5px 5px;
}
.fatfooter ul li ul li{

    width: 100%;
    float: initial;
}
.fatfooter ul li ul li a{
    font-size: 0.95rem;
}
/*------------------------------*/
footer{

    padding: 20px 0;
}
footer .info{
    background-image: url(../../images/footer_logo.svg);
    background-position:  0 50%;
    background-size: 260px;
    background-repeat:  no-repeat;
    padding: 20px 20px 20px 260px;
    width: calc((100% - 240px));
    float:  left;
    border-right: 1px solid #ccc;
    position: relative;
}

footer .info>a{
    color: #c3c3c3;
    font-size: 0.9rem;
    position: absolute;
    left: 0;
}
footer .info p{
    margin: 0;
    font-size: 0.95rem;
}
footer .info p span{
	display:  inline-block;
	font-size: 0.95rem;
	border: 1px solid #e90059;
	margin:  0 5px 0 0;
	padding: 0 5px;
}
footer .info p span:after{
	content:'';
	display:  inline-block;
	background-size: cover;
	width: 25px;
	height: 25px;
	vertical-align: middle;
}
footer .info p .ADD:after{
	background-image: url(../../images/icon/placeholder.svg);
}
footer .info p .TEL:after{
	background-image: url(../../images/icon/phone.svg);
}
footer .info p.hotline{
    font-size: 1.2rem;
    font-weight: bold;
}
footer .info p b{
    font-size: 1.2rem;
    color: #e90059;
}
footer .menu{
    width: 240px;
    float:  right;
    text-align: right;
}
footer .menu a{
    display:  block; 
    font-size: 0.95rem;
    transition: 0.3s all;
}
footer .menu a:hover{
	color:#52c3e3;
}
footer .menu p span{
    color: #e90059;
}
/*錯誤頁*/
.error{
    margin: 0;
    width: 100%;
    height: 100%;
    position: fixed;
}
.error .content{
    width: 100%;
    max-width: 1000px;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    padding: 100px 20px;
}
.error .content div{
    float: left;
}
.error .content .photo{
    width: 300px;
}
.error .content .photo img{
    display: block;
    width: 100%;
}
.error .content .message{
    padding: 10px 20px;
    width: calc((100% - 300px));
}
.error .content .message p{
	margin:5px 0;
}
.error .content .message h1{
    font-size: 2.4rem;
    line-height: 2.4rem;
}
.error .content .message h1 span{
    color: #52c3e3;
    display: block;
    font-size: 1.5rem;
}
.error .content .message a{
    display: block;
    padding: 5px 15px;
    background-color: #fc5d98;
    color: #fff;
    border-radius: 999px;
    border: 5px solid #fc5d98;
    transition: 0.3s all;
    width: 160px;
    margin: 0 auto;
}
.error .content .message a:hover{
	border: 5px solid #FFC107;
}
/*festival_banner*/
.main{
	position:relative;
}
.festival_banner{
	position: absolute;
	z-index: 99;
	display: block;
	width: 370px;
	height: 370px;
	bottom: 0;
}
.festival_banner a{
	display: block;
	width: 40px;
	height: 40px;
	position: absolute;
	top: 0;right: 0;
	background-color: #52c3e3;
	border-radius: 50%;
	color: #fff;
	font-size: 0rem;
	cursor: pointer;
	background-image: url(../../images/icon/off.svg);
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: 24px;
}
.festival_banner iframe{
    width: 370px;
    height: 370px;
}
.festival_banner body{}