@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, figure, mark {
    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;}
img {max-width: 100%;image-rendering: -webkit-optimize-contrast;}
.clean { clear:both;}
a {}
a:hover {}
a:focus{ -moz-outline-style: none;}
.b-box{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
body {
	margin: 0;
	padding: 0;
	font-size:15px;	
}

/*wow*/
.wow:first-child {
visibility: hidden;
visibility:visible \9;
}
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: auto;
}

img { max-width:100%;}

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

body {   
	-webkit-text-size-adjust: none;/*防止allpe的safari瀏覽器字體變大*/
	background-color: #1c1f8c;
}

#back-top {
		z-index: 50;
		right: 2%;
		left: inherit !important;
	}

/*-------------------------------------選單---------------------------------------------*/
#main-nav{
   position: relative;
   z-index: 990;
   margin:0 auto;  
}

#block_menu {
	width: 100%;
    overflow: hidden;
}

.sticky {
    top:30px;	
}

#main-nav ul {background-color: #292483;border-top:2px #e2c3ff solid;border-bottom: 2px #e2c3ff solid;text-align: center; height: 70px;text-align: center;}


#main-nav ul li {  
    display:inline-block; font: 600 15px "微軟正黑體";padding: 0 3px;
}
#main-nav .nav001{background-color: #e2c3ff;width: 55px;border-radius: 0 0 30px 30px;padding-top:5px;padding-bottom: 15px;}
#main-nav ul li a { display:block;text-align: center; text-decoration: none;padding: 10px 3px;border-radius: 5px; color: #ededed;}
#main-nav ul li a:hover,#main-nav ul li a.active { background: #cf73ff;  color:#fff;}
.active {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

#web-outer{	
	clear: both;
	overflow: hidden;
	background: url("img/bg_top.jpg") top no-repeat;
}

header h1 {
    text-indent: 101%;
    overflow: hidden;
    white-space: nowrap;
    position: absolute;
}

.header-content{
	height: 725px;
	background: url("img/header_bg.jpg") top no-repeat;	
}
.header-content .header-title{max-width: 643px;margin: 0 auto;padding-top: 30px;}
.header-content .mobile{display: none;}

.bg-01{background: url("img/bg_01.png") top no-repeat;}
.bg-02{background: url("img/bg_02.png") top no-repeat;}
.bg-03{background: url("img/bg_02.png") top no-repeat;}


#about{}
.about-wrap{max-width: 540px;margin: 0 auto;padding: 5% 10px 3% 10px;text-align: center;}
.about-wrap h2{font: 600 50px "微軟正黑體";line-height: 1.5em; color: #ffe0ff;letter-spacing:3px;border-bottom: 1px #ffe0ff solid;margin-bottom: 10px;}
.about-wrap h2 p{display:block;font: 600 20px "微軟正黑體";line-height: 1.5em;color: #fff;text-align: center;letter-spacing:5px;padding: 10px 0 20px 0;}
.about-wrap ul{margin-bottom: 10px;text-align: left;}
.about-wrap ul li{list-style:circle;font: 600 20px "微軟正黑體";color: #fff;line-height: 2em;margin: 5px 5px 0 20px;}
.about-wrap ul li strong{color: #ffe0ff;}

.about-wrap p{}

.section-down {
	position: relative;
  padding-top: 30px;
}
.section-down span {
  position: absolute;
  top: 0;
  left: 50%;
  width: 24px;
  height: 24px;
  margin-left: -12px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-animation: sdb05 1.5s infinite;
  animation: sdb05 1.5s infinite;
  box-sizing: border-box;
}
@-webkit-keyframes sdb05 {
  0% {
    -webkit-transform: rotate(-45deg) translate(0, 0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-45deg) translate(-20px, 20px);
    opacity: 0;
  }
}
@keyframes sdb05 {
  0% {
    transform: rotate(-45deg) translate(0, 0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    transform: rotate(-45deg) translate(-20px, 20px);
    opacity: 0;
  }
}


.tour-content{padding: 3% 0 5% 0;width: 100%; max-width: 1100px;margin: 0 auto;clear: both;overflow: hidden;}
.tour-content h2{
	max-width: 264px;
	height: 156px;		
	margin: 10px auto;
	padding: 28px 0 0 0;	
	font: 600 28px "微軟正黑體";	
	line-height: 1.5em;	
	color: #fff;
	text-align: center;	
}

.tour-content h2 span{color: #ffcdff;font: 500 13px "微軟正黑體";border-bottom: 1px #ffcdff solid;padding: 5px;}
.tour-content h2 strong{display: block;}
.title-bg01{background: url("img/big_title.png") center 0  no-repeat;}
.title-bg02{background: url("img/big_title02.png") center 0  no-repeat;}
.title-bg03{background: url("img/big_title03.png") center 0  no-repeat;}
.title-bg04{background: url("img/big_title04.png") center 0  no-repeat;}

.tour-wrap{width: 100%; margin: 0 auto;position: relative; margin-bottom: 30px;clear: both;overflow: hidden;}
.tour-pic{width: 65%; max-width: 750px;}
.tour-pic img{border-radius: 15px;}
.tour-text{width: 45%; position: absolute;background-color: #1c1f8c;border-radius: 15px;border:2px #ffecff solid;top:5%;right: 1%;padding-bottom: 10px;}
.tour-text .area{display: inline-block;font: 600 15px "微軟正黑體";color: #fff; background-color: #f061f3;border-radius: 0 0 10px 10px;padding: 5px; margin-left: 25px;}
.tour-text h3{font: 600 18px "微軟正黑體";color: #ffc1ff;line-height: 1.8em;	margin: 1% 3%;}

.tour-text ul{margin: 0 15px 0 20px;}
.tour-text ul li{list-style-image: url("img/list_icon.png");font: 600 15px "微軟正黑體";color: #fff;line-height: 1.8em;margin: 5px 5px 0 15px;}

.tour-text .price{
	display: block;
	font: 600 15px "微軟正黑體";	
	color:#fff;
	line-height:1.8em;
	text-align: right;
	margin: 10px 10px 10px 0;
}
.tour-text .price strong{	
	color:#f061f3;
	font: 600 20px "Anton", sans-serif;
	letter-spacing:1px;
	margin: 0 2px;
}

.tour-text p.tour-link{display: block;padding: 5px 8px;font: 600 15px "微軟正黑體";text-align: right;}
.tour-text p.tour-link a{display: inline-block;border-radius: 10px;padding: 5px;margin-left: 8px;text-decoration: none;min-width: 50px;text-align: center;background-color: #7b49eb;color: #fff;box-shadow:2px 2px 0px #8c69de;}
.tour-text p.tour-link a:hover{color: #2b2c82; background-color: #e2c3ff;box-shadow:2px 2px 0px #d674d6;}


.product-list {
	width: 100%;margin: 0 auto;
	border-bottom: 1px solid #6f71b2;	
	padding: 8px 0 5px 0;
	clear: both;
	overflow: hidden;
}

.product-line {
	color:#fff;	
	display:flex;
	justify-content:space-between;
	align-items:flex-start;	
	overflow:hidden;
}

.product-line h3{
	font: 600 18px "微軟正黑體";
	line-height: 1.8em;
	flex:0 0 85%;
	color: #fff;	
}
.product-line h3 em { font-style:normal;font: 600 15px "微軟正黑體";color:#e2c3ff;background-color: #2b2c82;border-radius: 10px;border:1px #e2c3ff solid; border-radius: 5px; padding: 3px;margin-right: 5px;}
.product-line h3 strong { font-style:normal;font: 600 15px "微軟正黑體"; color:#fdcaff;padding: 3px;margin-left: 3px;}

.product-line .price-r{flex:0 0 15%;font: 600 15px "微軟正黑體";color:#fff;line-height:1.8em;text-align: right;}
.product-line .price-r strong{	
	color:#f061f3;
	font: 600 20px "Anton", sans-serif;	
	letter-spacing:1px;
	margin: 0 2px;
}

.product-list p.link{display: block;padding: 5px 8px;font: 600 15px "微軟正黑體";text-align: right;}
.product-list p.link a{display: inline-block;border-radius: 10px;padding: 5px;margin-left: 8px;text-decoration: none;min-width: 50px;text-align: center;background-color: #7b49eb;color: #fff;box-shadow:2px 2px 0px #8c69de;}

.product-list p.link a:hover{color: #2b2c82; background-color: #e2c3ff;box-shadow:2px 2px 0px #d674d6;}


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

/*------media query----------*/
@media only screen and ( max-width:1200px) {	
	.tour-content{width: 95%;padding: 3% 0 80px 0;}
	#back-top {		
		right: -20%;
		left: inherit !important;
	}	
}

@media only screen and ( max-width:1100px) {
	
}
@media only screen and ( max-width:959px) {
	
.header-content{
	height: inherit;
	background: inherit;	
}	
.header-content .header-title{display: none;}	
.header-content .mobile{display: block;}
.tour-text{top:2%;}
.product-list .price-r{display: block;padding: 1% 0;}
.left { float: inherit;}
.right { float: inherit;}
	
}

@media only screen and ( max-width:950px) 
{
#main-nav ul {height: 60px;}	
#main-nav ul li {font: 600 11px "微軟正黑體";}
#main-nav .nav001{width: 40px;}	
.tour-wrap{width: 80%; background-color: #1c1f8c;border: 2px #ffecff solid;border-radius: 10px;}
.tour-pic{width: 98%;margin:0 auto;padding-top: 1%;}
.tour-pic img{border-radius: 10px 10px 0 0;}	
.tour-text{width: 100%;background-color: inherit; position: inherit;border: none;margin:0 auto;padding: 1% 0;}
.tour-text .area{border-radius: 5px;margin-left: 15px;}		
}
@media only screen and ( max-width:880px) 
{

	
.product-line h3{flex:0 0 80%;}	
.product-line .price-r{flex:0 0 20%;}	
	
}
/*---平板-----*/
@media only screen and ( max-width:768px) 
{
	#main-nav{display: none;}
	.about-wrap{padding: 30px 0 80px 0;}
	.tour-wrap{width: 90%;}
	
	
/*錨點*/
.block-first{padding-top:initial ;margin-top: initial;}	
}

@media only screen and ( max-width:600px) {
	
#about{}
.about-wrap{max-width: inherit;width: 90%;}
.about-wrap h2{font: 600 35px "微軟正黑體";line-height: 1.8em;}
.about-wrap h2 p{font: 600 18px "微軟正黑體";line-height: 1.8em;}
	
	
.product-line {	display:inherit;}	
.product-line h3{flex:initial;width: 100%; display: block;}	
.product-line .price-r{flex:initial;width: 100%; display: block;}
}	
/*---手機版-----*/
@media only screen and (max-width:480px) 
{
.about-wrap h2{font: 600 25px "微軟正黑體";}
.about-wrap h2 p{font: 600 15px "微軟正黑體";letter-spacing:2px;}
.tour-wrap{width: 95%;}
}