@charset "utf-8";

/* CSS Document */
/************************************************************************************
RESET
*************************************************************************************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
body {	
    line-height: 1;	
	-webkit-text-size-adjust: none;/*防止allpe的safari瀏覽器字體變大*/
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}

/* remember to define focus styles! */
:focus {
    outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
    text-decoration: none;
}
del {
    text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
   /* border-collapse: collapse;*/
    border-spacing: 0;
}

a img {
	border: none;
}

.clean { clear:both;}

.clearfix {
  overflow: hidden;
  zoom: 1;
}

img { width:100%;}

/************************************************************************************
STRUCTURE 主要區塊
*************************************************************************************/

body {
	font-family:"微軟正黑體","黑體", Arial, Helvetica, sans-serif;
	background: url("../img/bg01.jpg") top repeat;
}

h1,h2,h3 { display:none; }

#web-outer{	
	clear: both;
	overflow: hidden;	
}
.header{clear:both;overflow: hidden;}
.header{clear:both;overflow: hidden;}

.container2 {width:100%;position:relative; margin-top:0px; }
.container3{width:100%;}
.logo {display: block; max-width: 403px;position: absolute;left: 40%;right: 40%; top:15%; z-index: 200;}

.slide{margin: 0 auto;}
.slide ul li p.ps{position: absolute;right: 20px;bottom: 10px;color: #666;padding: 5px; background-color: #fff; font-size: 13px;border-radius: 10px;}

/*-------------------------------------選單---------------------------------------------*/
#main-nav {
    z-index: 990;
    overflow: hidden;
 } 
.block-menu{width: 100%;height: 60px;background-color: #e7e7e7; z-index: 300;overflow: hidden;}
.sticky { top: 30px;overflow: hidden;}

.class-nav { background: #e7e7e7;height:60px;}
.nav-top {max-width: 520px;margin: 0 auto;padding: 10px 0 0 0;}
.nav-top li {margin-right: 10px;  }
.nav-top li a {}
.menu a,.menu02 a,.menu03 a,.menu04 a,.menu05 a,.menu06 a{float: left;width: 65px; border-radius: 50px;border:2px #8d8d8d solid;font-size: 20px;line-height: 1.8em;color: #515151;text-align: center; margin-right: 10px;text-decoration:none;}
.menu a:hover,.menu a.on{background-color: #1575ac;color: #fff;border:2px #1575ac solid;}
.menu02 a:hover,.menu02 a.on{background-color: #e16fa7;color: #fff;border:2px #e16fa7 solid;}
.menu03 a:hover,.menu03 a.on{background-color: #d49fdd;color: #fff;border:2px #d49fdd solid;}
.menu04 a:hover,.menu04 a.on{background-color: #22ba65;color: #fff;border:2px #22ba65 solid;}
.menu05 a:hover,.menu05 a.on{background-color: #ffa675;color: #fff;border:2px #ffa675 solid;}
.menu06 a:hover,.menu06 a.on{background-color: #68a6d7;color: #fff;border:2px #68a6d7 solid;}


/*線條*/
.line-bg{background: url("../img/line.png") center no-repeat;height: 24px;}

/*節慶選單*/
.festivals-menu {width: 100%; margin-top: 10px; background: #faf7e5; padding-bottom: 30px; clear: both;overflow: hidden;}
.grid-intro { max-width: 960px; margin: 0 auto; padding-top: 30px;padding-bottom: 40px; clear: both;overflow: hidden;text-align: center;z-index: 50;}
.ct33 {width:30%; display: inline-block;vertical-align: top;position: relative;margin: 10px 10px 20px 10px;}
.ct50 {width:47%; display: inline-block;vertical-align: top;position: relative;margin-right: 10px;margin-left: 10px; margin-top: 15px;}
.ct50 a{text-decoration: none;}

.country { width: 90px; height: 115px;position: absolute;}
.country-cn { 
    color:#fff; font:36px "黑體","微軟正黑體"; 
    -webkit-writing-mode: vertical-rl; writing-mode: vertical-rl;
    float: right; padding-top: 6px; letter-spacing: 2px;
}

.festivals { margin-top:30px;margin-left: 30px; padding:10px 5px 10px 20px; background: #fff; z-index: 90; width: 80%;min-height: 130px;}

.festivals-list { margin-left:40px;position: relative; clear: both;overflow: hidden;}
.festivals-list > p { display: inline-block; vertical-align: top; max-width: 100%;}

.month { 
    line-height: 26px;  text-align: right;
    font:15px "黑體","微軟正黑體",Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
    padding-right: 5px; font-weight: bold;
    width: 36px;
	position: absolute;
	left: 0;
		
}

.link { line-height: 26px;margin-left: 40px;padding-left: 5px; float:left;width: 80%;text-align: left;}

.link a { 
    color:#707070; font:15px "黑體","微軟正黑體"; 
    font-weight: 500; text-decoration: none; 
    display: inline-block; padding-right: 16px;
}

.link a:hover {color:#000; text-decoration: underline;}


.north-box { background: #eba8c9; }
.north-w { color:#eba8c9;}
.north-line { border-left: 1px solid #eba8c9;}
.north-line a:hover{color:#e16fa7;}

.central-box { background: #d49fdd; }
.central-w { color:#d49fdd;}
.central-line { border-left: 1px solid #d49fdd;}
.central-line a:hover{color:#d49fdd;}

.south-box { background: #22ba65; }
.south-w { color:#22ba65;}
.south-line { border-left: 1px solid #22ba65;}
.south-line a:hover{color:#22ba65;}

.east-box { background: #ffa675; }
.east-w { color:#ffa675;}
.east-line { border-left: 1px solid #ffa675;}
.east-line a:hover{color:#ffa675;}

.island-box { background: #68a6d7; }
.island-w { color:#68a6d7;}
.island-line { border-left: 1px solid #68a6d7;}
.island-line a:hover{color:#68a6d7;}

.festivals-title{max-width: 320px;margin:10px auto 20px auto;}

.north-fest{
	margin: 30px auto; padding: 0 0 0 20px;background:url("../img/fest-bg01.png") 0 0 no-repeat;max-width: 909px;}
.north-fest span {
	background: url("../img/cam01.png") 0 0 no-repeat;
	color: #e32a75;
    font:25px "黑體","微軟正黑體";
    font-weight: 600;
    padding-left: 48px;
	margin-bottom: 5px;
}
.north-fest span strong {
    font:30px "黑體","微軟正黑體";
    font-weight: 600;
}

.central-fest{
	margin: 30px auto; padding: 0 0 0 20px; background:url("../img/fest-bg02.png") 0 0 no-repeat;max-width: 909px;}
.central-fest span {
	background: url("../img/cam02.png") 0 0 no-repeat;
	color: #ad0cb8;
    font:25px "黑體","微軟正黑體";
    font-weight: 600;
    padding-left: 48px;
	margin-bottom: 5px;
}
.central-fest span strong {
    font:30px "黑體","微軟正黑體";
    font-weight: 600;
}

.south-fest{
	margin: 30px auto; padding: 0 0 0 20px; background:url("../img/fest-bg03.png") 0 0 no-repeat;max-width: 909px;}
.south-fest span {
	background: url("../img/cam03.png") 0 0 no-repeat;
	color: #008e5a;
    font:25px "黑體","微軟正黑體";
    font-weight: 600;
    padding-left: 48px;
	margin-bottom: 5px;
}
.south-fest span strong {
    font:30px "黑體","微軟正黑體";
    font-weight: 600;
}

.east-fest{
	margin: 30px auto; padding: 0 0 0 20px; background:url("../img/fest-bg04.png") 0 0 no-repeat;max-width: 909px;}
.east-fest span {
	background: url("../img/cam04.png") 0 0 no-repeat;
	color: #dc3109;
    font:25px "黑體","微軟正黑體";
    font-weight: 600;
    padding-left: 48px;
	margin-bottom: 5px;
}
.east-fest span strong {
    font:30px "黑體","微軟正黑體";
    font-weight: 600;
}

.island-fest{
	margin: 30px auto; padding: 0 0 0 20px; background:url("../img/fest-bg05.png") 0 0 no-repeat;max-width: 909px;}
.island-fest span {
	background: url("../img/cam05.png") 0 0 no-repeat;
	color: #0054aa;
    font:25px "黑體","微軟正黑體";
    font-weight: 600;
    padding-left: 48px;
	margin-bottom: 5px;
}
.island-fest span strong {
    font:30px "黑體","微軟正黑體";
    font-weight: 600;
}


/*全部節慶介紹*/
.all-box{border-radius: 15px;border: #60a2df 2px solid;background-color: #fff;padding: 10px;min-height: 440px;}
.intro-title-all {width: 100%;position: relative;margin-top: 10px;}
.all-month { 
	color: #404040;
    font:15px "黑體","微軟正黑體"; 
	background: url("../img/icon07.png") 0 0 no-repeat;
    padding-left: 8px;
    font-weight: 600;
	margin-top: 5px;
    text-align: right;
	min-width: 65px;
	position: absolute;
	right: 0;
}
.all-title {
    font:24px "黑體","微軟正黑體";
	color: #1575ac;
    background: url("../img/icon01.png") 0 0 no-repeat;
    font-weight: 600;
    padding-left: 30px;	
    width: 90%; 
    margin-left: 10px;
	text-align: left;
}
.all-intro {    
    padding:10px 20px;    
}
.all-txt {
    font:15px "黑體","微軟正黑體";
    color: #404040;
    line-height: 1.8em;
	text-align: left;
}

.festivals-main{clear: both;overflow:hidden;}

/*節慶介紹*/
.box{ 
    max-width: 940px; margin: 0 auto; 
    display: block;
	position: relative;   
    padding:36px 10px 40px 10px;
	margin-bottom: 30px;
	padding-top: 110px;margin-top: -80px;
	clear: both;
	overflow: hidden;	
}
.bbox{background-color: #fff4f9;clear: both;overflow: hidden;}
.n-box{border-bottom:5px dotted #ffebf4;}
.c-box{border-bottom:5px dotted #f8e8f9;}
.s-box{border-bottom:5px dotted #c0f8d8;}
.e-box{border-bottom:5px dotted #ffd6c1;}
.i-box{border-bottom:5px dotted #a9d3f4;}

.box50-1,.box50-2 {float: left; width:50%; overflow: hidden;}
.pic{position: relative;}
.pic span{font:10px "黑體","微軟正黑體";color: #fff;background-color: #4a4a4a;padding: 5px;border-radius: 10px; position: absolute;right: 5px;bottom: 10px;}

.intro-title-grid {width: 100%;position: relative;margin-top: 0;background-color: #fff;padding: 12px 0 10px 0;}

.fes-month { 
	color: #404040;
    font:15px "黑體","微軟正黑體";    
    padding-left: 20px;
    font-weight: 600;
	margin-top: 5px;
    text-align: left;
	min-width: 20px;
	position: absolute;
	right: 0;
}

.month-north{background: url("../img/icon02.png") 0 0 no-repeat;}
.month-central{background: url("../img/icon03.png") 0 0 no-repeat;}
.month-south{background: url("../img/icon04.png") 0 0 no-repeat;}
.month-east{background: url("../img/icon05.png") 0 0 no-repeat;}
.month-island{background: url("../img/icon06.png") 0 0 no-repeat;}

.fes-title {
    font:24px "黑體","微軟正黑體";
    background: url("../img/icon01.png") 0 0 no-repeat;
    font-weight: 600;
    padding-left: 30px;	
    width: 65%; 
    margin-left: 20px;	
}

.title-north{color:#e16fa7;}
.title-central{color:#d49fdd;}
.title-south{color:#22ba65;}
.title-east{color:#ffa675;}
.title-island{color:#68a6d7;}

.fes-intro {       
    min-height: 200px;
    padding:10px;
    position: relative;		
}
.intro-north{background: #fff4f9;}
.intro-central{background: #fcf6fd;}
.intro-south{background: #f0fff7;}
.intro-east{background: #fff3ed;}
.intro-island{background: #eef8ff;}

.intro-txt {
    font:15px "黑體","微軟正黑體";
    color: #404040;
    line-height: 1.6em;    
}

.intro-link {width: 100%;margin: 10px 0 10px 0;color: #1065a7;}
.intro-link span{font-weight: bold;}

.intro-link a {
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-block;
    padding: 3px 10px;
    border-radius: 20px;	
    background: #2b88d0;   
    color: #fff;
   font: 600 16px "微軟正黑體";
    font-weight: bold;
    letter-spacing: 1px;
    margin: 4px;
    box-shadow: 0px 4px 0px #1065a7;
	text-decoration:none;
}

.intro-link a:hover {
	background:#3198e7;
}

.tour-box{width: 98%;margin: 5px auto;border-radius: 10px;border:1px solid;clear: both;overflow: hidden;}
.tour-box .tour-title{display: block;padding: 5px;border-radius: 10px 10px 0 0;color: #fff;font-size: 15px;}
.tour-box ul{padding: 5px;}
.tour-box ul li a{color: #333;font-size: 18px;line-height: 1.2em; font-weight: bold;text-decoration: none;}
.tour-box ul li a:hover{color: #5d5d5d;/*border-bottom: 1px #333 solid;*/}
.tour-box .more a{display: inline-block;color: #6c6c6c;font-size: 15px;padding: 5px 8px;border-radius: 15px;float: right;background-color:#e5e5e5;text-decoration: none;margin: 5px; }
.tour-box .more a:hover{background-color: #999;color: #fff;}

.b-north{border-color: #e72a75;}
.b-central{border-color: #ac47b3;}
.b-south{border-color: #008e5a;}
.b-east{border-color: #ff7428;}
.b-island{border-color: #097ad3;}

.t-north{background-color: #e72a75;}
.t-central{background-color: #ac47b3;}
.t-south{background-color: #008e5a;}
.t-east{background-color: #ff7428;}
.t-island{background-color: #097ad3;}


/*錨點*/
.block-first{overflow: hidden;padding-top: 110px;margin-top: -80px;}
.block-first02{overflow: hidden;padding-top: 100px;margin-top: -100px;}

.remarks{max-width: 960px;margin: 0 auto;padding: 0 10px 10px 10px; font-family:"微軟正黑體";font-size: 15px;line-height: 1.5em; color: #000;text-align: center;}


@media screen and (min-width: 960px) and (max-width: 1540px) {
.logo {left: 30%;right: 20%; top:15%;}
	
}

@media screen and (max-width:959px)  {
.logo {left: 20%;right: 20%; top:10%;}	
.grid-intro { max-width: inherit;width: 98%;}
.box50-1,.box50-2 {float: inherit; width:90%;margin: 0 auto;}
.fes-title { margin-left: 5px; margin-right: 5px;}
.box{margin-top: inherit;margin-bottom: inherit;padding:36px 10px 40px 10px;}	
.fes-intro { min-height: 80px;}		
}

/*---平板-----*/
@media screen and (max-width:768px)  {
.logo {max-width: inherit; width: 45%; left: 20%;right: 10%; top:3%;}
.block-menu{display: none;}
.ct50{width: 98%;float:inherit;margin: 15px auto 0 auto;}
	
.box50-1,.box50-2 {float: inherit; width:98%;}	
.box{margin-top: inherit;margin-bottom: inherit;padding:36px 10px 40px 10px;}
.fes-title { margin-left: 5px; margin-right: 5px;}	
.fes-intro { min-height: 80px;}	
	
.all-box{min-height: inherit;}	
	
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.logo {max-width: inherit; width: 50%; left: 20%;right: 10%; top:3%;}
	.ct33 {width:98%;float:inherit;}
	.ct50{width: 98%;float:inherit;margin: 15px auto 0 auto;}	
	.grid-intro{width: 80%;}	
	.festivals{min-height: 80px;}			
}

/*---手機版-----*/
@media screen and (max-width:479px)  {
	.logo {max-width: inherit; width: 60%; left: 20%;right: 10%; top:5%;}
	.ct33 {width:98%;}
	.ct50{width: 98%;float:inherit;margin: 15px auto 0 auto;}
	.intro-link span{display: block;margin-bottom: 5px;padding-left: 5px;}
	.festivals{min-height:inherit;}	
}

/*---手機版-----*/
@media screen and (max-width:320px)  {
	
	}