@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,figure,article
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: auto;
}

img { max-width:100%;}

.left { float: left;}
.right { float: right;}

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

#backtop { z-index: 9999; position: relative;}

body {
  font-family: "LXGW WenKai TC", cursive;
  font-weight: 300;
  font-style: normal;
}

#web-outer {
	max-width: 2000px;
	overflow: hidden;
  background: url("../images/bg01.webp") center top repeat-y;  
}


/*======================
====Main CSS=====
=======================*/

.first { padding-top:120px; margin-top: -120px;}
.second { padding-top:100px; margin-top: -100px; }
.third { padding-top:20px; margin-top: -20px; }

.mainpic {  margin:0 auto;  }
.pic-outer {  position: relative; z-index: 300; padding-bottom: 20px;  background: url("../images/bg-slider.webp") center top no-repeat;  }
.main-title { position: absolute; top:80px;  padding-left: 55%; margin-right: 15px; z-index: 900; /*text-align: right; */ }
.main-title figure img { max-width: 100%; }  
.spic01 { padding-top: 40px;}
.spic02 { text-align: right; }

.main-title-xs { 
  display: none;
  position: absolute; top:140px;  z-index: 900; padding-left: 56%; margin-right: 15px;
}
.mainpic-xs { display: none; }

header h1 {
    text-indent: 101%;
    overflow: hidden;
    white-space: nowrap;
    position: absolute;
}
/*======================
==== Slider CSS=====
=======================*/

#demo-1 {
    position: relative; /* can either be relative, absolute or fixed. If position is not set (i.e. static), it would be set to "relative" by script */
    overflow: hidden; /* to bound the empty top space created by inner element's top margin */
    max-width: 2000px;
    min-height: 780px;
}

/*======================
====nav CSS=====
=======================*/

#main-nav {
    z-index: 990;
    position: relative;
}

.block_menu {
	width: 100%;
	text-align: center;
  height: 94px;
  background: url("../images/bg-menu.webp") center top no-repeat;
  padding-bottom: 30px;
}

.sticky {
    top: 40px;
}
#main-nav ul {  margin:0 auto; text-align: center; padding-top: 28px; }
#main-nav ul li {  
    display:inline-block; font-weight: 500; 
    height: 39px; width: 146px; line-height: 36px;
}
#main-nav ul li a { 
    display:block; width:100%; height:100%; text-decoration: none; 
    color:#94563b; font-size: 24px; 
}
#main-nav ul li a:hover, #main-nav ul li a.active {  
  background: url("../images/bg-nav.webp") center top no-repeat;  
  color:#411c01;
}

.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);
}

/*-----背景-------*/

.bg-tour { background: url("../images/bg-tour.webp") center bottom no-repeat; padding-bottom: 150px; }
.bg-egypt-top { background: url("../images/bg-map-top.webp") center top no-repeat; padding-top: 122px; }
.bg-egypt { background: url("../images/bg-map.webp") center top repeat-y; }
.bg-pharaoh { background: url("../images/bg02.webp") center top repeat-y; }
.bg-pharaoh-bom { background: url("../images/spic04.webp") right bottom no-repeat; padding-bottom: 200px; }
.bg-temple-top { background: url("../images/bg-temple-top.webp") center top no-repeat; padding-top: 82px; }
.bg-temple { background: #823715; padding-bottom: 150px;}
.bg-experience {  background:#ecc486 url("../images/bg03.webp") left bottom no-repeat; padding-bottom: 580px; }

.subtitle { 
  padding:50px 0; font-weight: 500;
  background: url("../images/bg-subtitle.webp") center center no-repeat;
  line-height: 69px; height: 69px; text-align: center; 
  font-size: 36px; color: #f7e3d2;
}

.map-outer { max-width: 1400px; margin:0 auto; padding:10px 20px 100px 20px; display: flex; overflow: hidden; justify-content: space-between; }
.map-ct {width:45%;}
.pic-spic { max-width:525px; margin:0 auto; margin-top: 20px;  }
.pic-map { width:55%; padding-right: 15px; }
.map-in { 
  font-size: 22px;  color: #512403; line-height: 1.8em; margin-top: 30px; 
  background: #fff8ef; border-radius: 15px 15px; padding:15px 20px; 
}
.map-in p { padding:20px 20px;}

.flex-box { max-width: 1500px; margin:0 auto; padding:10px 20px 40px 20px; display: flex; overflow: hidden; justify-content: space-between; align-items: center; }
.flex-box figure { width:57%;  }
.flex-box figure img { border-radius: 35px 0px; box-shadow: rgba(222, 177, 79, 1) 0px 3px 0px, rgba(255, 255, 255, 0.25) 0px 1px 0px inset; }
.pharaoh-ct { width:37%; margin:0 3%;}
.pharaoh-ct h3 { 
  font-size: 40px;  color: #411c01; line-height: 1.8em; padding: 70px 0 15px 0; letter-spacing: 1px;
  background: url("../images/line.webp") center top no-repeat; text-align: center; font-weight: 500;
}
.pharaoh-ct p { 
  font-size: 19px;  color: #512403; line-height: 1.8em; padding:20px 40px;
  background: #fbe9d4; border-left: 2px solid #deb14f; font-weight: 400;
}
.pharaoh-ct h4 { 
  font-size: 36px;  color: #512403; line-height: 1.8em; padding-top: 6px; letter-spacing: 1px;
  text-align: center; font-family: "Cookie", cursive; font-weight: 400;
}

.tabs-container { margin: 0 auto; }

.tab-content-outer { }
.tabs-box { margin:15px; text-align: center;}
.tabs-box li { display: inline-block; text-align: center; margin: 10px ; }
.tabs-box li a { 
    width: 100%; height: 100%; display: block; 
    background: #c07350; border-radius: 15px 0; padding:12px 8px; 
    color:#67270a;  font-size: 24px; text-decoration: none; font-weight: 500;
}

.tabs-box li a:hover, .tabs-box li a.active { background: #f4dcd1; color:#411c01;}


.temple-box { max-width: 1500px; margin:0 auto; min-height: 723px;  background: url("../images/bg-frame.webp") center center no-repeat;  }
.temple-flex-box { max-width: 1320px; margin:0 auto; padding:60px 30px; display: flex; overflow: hidden; justify-content: center; align-items:start; /*align-content: flex-start; */ }
.temple-flex-box figure { width:64%;  }
.temple-flex-box figure img { border-radius: 30px; }
.temple-ct { width:33%; margin:0 3% 0 0;}

.temple-ct h3 { 
  font-size: 38px; color: #f2f2f2; line-height: 1.8em; padding: 45px 0 0px 0; letter-spacing: 1px;
  text-align: left; font-weight: 500;
}
.temple-ct h4 { 
  font-size: 22px; color: #ff9354; line-height: 1.8em; letter-spacing: 1px;
  text-align: left; font-family:Arial, Helvetica, sans-serif; font-weight: 400;
}
.temple-ct p { 
  font-size: 22px;  color: #ffd5b7; line-height: 1.8em; padding:15px 0;
  font-weight: 400;
}


.experience-ct { max-width: 1500px; margin:0 auto; padding:10px 20px 0px 20px; display: flex; overflow: hidden; justify-content: center; align-items: flex-start;  }
.experience-ct article { width:33%; margin:0 1%;}
.experience-ct h3 { 
  font-size: 33px;  color: #914005; line-height: 1.8em; letter-spacing: 1px; margin: 8px 0;
  background: url("../images/title-experience.webp") center center no-repeat; text-align: center; font-weight: 400;
}
.experience-ct p { 
  font-size: 18px;  color: #3f3e3d; line-height: 1.8em; letter-spacing: 1px; 
  margin: 8px 0; font-weight: 500; padding:0 10px; 
}
/*----tour-box----*/

.tour-box { max-width: 1200px; margin:0 auto; padding:30px 20px; border-radius: 30px; background: #f3d9bc; }

.tour-title { margin:0 auto; margin:20px 0 30px 0; text-align: center; }
.tour-title span { 
  font-size: 26px;  color: #fdeddb;   
  background: #d26c09; border-radius: 10px 10px 25px 25px; padding:10px 30px;
}

.tour-list { margin-bottom: 50px; }
.tour-list li  { 
    font-size: 20px;  color: #5d1d00; 
    line-height: 1.8em;
    border-bottom: 1px solid #ad7a63;
    margin:8px 15px 8px 0px;
    padding:6px 0px;
}

.tour-list li a { 
     color: #5d1d00; text-decoration:none; width: 100%; height:100%; display:flex; /*overflow:hidden; */font-weight: 400;
}
.name_l { width:80%;  }
.price_r { width:20%;  text-align: right; color: #5d1d00; font: 600 13px "微軟正黑體"; }
.price_r span { font: 600 24px "微軟正黑體"; color:#e04400;  padding:0 2px; font-family: 'Barlow', sans-serif; }


.tour-list li a h3.name_l::before {
	content: url('../images/icon01.webp');
	padding-right:6px;
 
}
.tour-list li a h3.name_l { padding-left: 23px; text-indent: -23px;}
.tour-list li a h3.name_l span { font-style: normal; font: 600 16px "微軟正黑體";  color:#af6300; text-decoration: none; padding-left:6px; }
.tour-list li a h3 span:empty { display:none;}

.btn-more a {  text-decoration: none; border-radius: 20px; margin: 20px 15px 0 0; }
.btn-more a span { font: 600 18px "微軟正黑體";  color: #5d1d00; display: block; text-align: right; }
.btn-more a:hover span { color: #c94305; }

/*------media query----------*/

@media only screen and ( max-width:1800px) 
{
  .main-title { padding-left: 55%; }
}

@media only screen and ( max-width:1510px) 
{
  .temple-box {  margin-left: 15px; margin-right:15px; min-height: auto; background: none; border-radius: 36px; border: 3px solid #e69f5d;  }
  .temple-flex-box { padding:30px;  }
  .bg-experience {  padding-bottom: 450px; }


}
@media only screen and ( max-width:1400px) 
{
  #demo-1 { min-height: 630px;} 
  .main-title { top:80px; }
  .main-title figure.spic02 img { max-width: 30%;  }

}
@media only screen and ( max-width:1290px) 
{
 .tour-box {  margin-left: 15px; margin-right:15px; }

}

@media only screen and ( max-width:1150px) 
{
  #demo-1 { min-height: 560px;} 
  .map-in p { padding:10px 10px;}
  .flex-box figure { width:50%;  }
  .pharaoh-ct { width:44%; }
  .map-outer {align-items: center;}
  .temple-flex-box figure { width:60%;  }
  .temple-ct { width:37%; }
  .experience-ct { flex-wrap: wrap;} 
  .experience-ct article { width:48%; }
}

@media only screen and ( max-width:1024px) 
{
  #demo-1 { min-height: 500px;}  
  .main-title figure.spic02 img { max-width: 24%;  }
  .flex-box { padding:10px 20px 20px 20px; }
  .flex-box figure { width:54%;  }
  .pharaoh-ct { width:40%; }
  .temple-ct p { font-size: 18px;}
  .temple-ct h3 { padding:0; font-size: 32px;}

}
@media only screen and ( max-width:900px) 
{
  .main-title { top:160px; }
  #demo-1 { min-height: 450px;}
  .main-title figure.spic02 { display: none;}
  .map-outer { flex-direction: column; align-items: center;}
  .map-ct {width:98%; }
  .pic-map { width:98%; padding-right: 15px; text-align: center; }
  .flex-box { flex-direction: column; padding-bottom: 100px; }
  .flex-box figure { width:98%; align-items: center; order: 1; padding-bottom: 30px; }
  .pharaoh-ct { width:98%; }
  .tabs-box li a { font-size: 20px; }

}

@media only screen and ( max-width:812px)
{ 
  #demo-1 { min-height: 400px;}
  .main-title { top:140px; }
  .temple-flex-box { flex-direction: column; }
  .temple-flex-box figure { width:98%; align-items: center;   }
  .temple-ct {width:98%;  }
  .temple-ct h3,.temple-ct h4 { text-align: center;}
  .temple-flex-box { padding:20px; }
    
}
/*---平板-----*/

@media only screen and ( max-width:768px) 
{ 
  .main-title { display: none;}
  .main-title-xs { display: block;}
  #demo-1 { min-height: 360px;}

  #main-nav { display: none; }
  .first,.second,.third  { padding-top:0px; margin-top: 0px;}
  .bg-tour .subtitle { padding:30px 0;}
  .experience-ct article { width:98%; text-align: center;}
  .experience-ct article p { padding-bottom: 60px; }
  .tour-list li a { flex-direction: column;}
  .name_l { width: 100%;}
  .price_r { width: 100%; padding-top:10px; text-align: right;}
  .bg-experience {  background:#ecc486 url("../images/bg03.webp") -200px bottom no-repeat; }
}

@media only screen and (max-width:600px) 
{
  .main-title-xs { top:120px; }
  #demo-1 { min-height: 300px;}
}
@media only screen and (max-width:480px) 
{
  .main-title-xs {display: none; }
  .pic-outer {  display: none; }
  .mainpic-xs { display: block; }
  #demo-1 { max-width: 400px; min-height: 270px;}
  .tour-box { padding:10px 20px; } 
}