@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,
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 { max-width:100%;}

.col { padding-left: 0px; padding-right: 0px;}
/************************************************************************************
STRUCTURE 主要區塊
*************************************************************************************/

html, body {
  scroll-behavior: smooth;
}


body {
	font-family:"微軟正黑體","黑體", Arial, Helvetica, sans-serif;
    position: relative;/*為了scrollspy*/
    overflow-y: auto;
    padding-top: 40px; /* padding for fixed navbar */
}

        
#web-outer {
	max-width: 2000px;
	overflow: hidden;
	_overflow: none;
	line-height:1.9em;
	font-size:13px;
    color:#535152;
}

header { background:url(../images/header-pic.jpg)  center top no-repeat; height: 499px; overflow: hidden; z-index: 800;}

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

#mousemove { max-width: 960px; margin: 0 auto; position: relative; }

.logo1 { position: absolute; left:290px;top:0px; }
.logo2 { position: absolute; left:160px;top:215px;  }

nav {   z-index: 999;  }
.nav-list { max-width: 960px; margin: 0 auto;  }
.nav-list li a {  
    height: 100px; width: 96px; font: 200 17px "微軟正黑體" ; display: inline-block; line-height: 22px;
    text-align: center;background: url(../images/nav-bg.png) 0 0 no-repeat; padding-top: 26px; color: #d7d6d5; margin-top: -8px;
}

.nav-list li a:hover {  background: url(../images/nav-bg.png) 0 -200px no-repeat; color: #ffffff;}
.nav-list li a.active {  background: url(../images/nav-bg.png) 0 -100px no-repeat;color: #ffc97f; }

/*.navbar { padding-top:40px;}*/

.pb_navbar {
  position: absolute;
  top: 500px;
  left: 0;
  z-index: 900;
  width: 100%;
  background: url(../images/nav-bg.jpg) center top no-repeat;

  }
  .pb_navbar .nav-link {
    font-size: 17px;
    padding-left: 1rem !important;
    padding-right: 1rem !important; }
   /* @media (max-width: 1199px) {
      .pb_navbar .nav-link {
       padding-top: .5rem;
        padding-bottom: .5rem; } }
    @media (max-width: 991px) {
      .pb_navbar .nav-link {
        padding-left: 0rem !important;
        padding-right: 0rem !important; } }
    @media (max-width: 767px) {
      .pb_navbar .nav-link {
        padding-left: 0 !important;
        padding-right: 0 !important; } }
  @media (max-width: 991px) {
    .pb_navbar .navbar-nav {
      background: rgba(0, 0, 0, 0.8);
      border-radius: 0px;
      padding-left: 1rem !important;
      padding-right: 1rem !important; } }*/
  .pb_navbar.scrolled {
    position: fixed;
    right: 0;
    left: 0;
    top: 0;
    /*margin-top: -130px;*/ }
    
   /* @media (max-width: 991px) {
      .pb_navbar.scrolled .navbar-nav {
        background: none;
        border-radius: 0px;
        padding-left: 0rem !important;
        padding-right: 0rem !important; } 
    }
    
    @media (max-width: 767px) {
      .pb_navbar.scrolled .navbar-nav {
        background: none;
        padding-left: 0 !important;
        padding-right: 0 !important; } 
    }*/
    .pb_navbar.scrolled .navbar-toggler {
      border: none;
      color: rgba(0, 0, 0, 0.5);
      border-color: rgba(0, 0, 0, 0.5);
      cursor: pointer;
      padding-right: 0; }
    .pb_navbar.scrolled .nav-link {
      padding-top: .5rem;
      padding-bottom: .5rem; }
    .pb_navbar.scrolled.awake {
      margin-top: 0px;
      -webkit-transition: .3s all ease-out;
      -o-transition: .3s all ease-out;
      transition: .3s all ease-out; }
    .pb_navbar.scrolled.sleep {
      -webkit-transition: .3s all ease-out;
      -o-transition: .3s all ease-out;
      transition: .3s all ease-out; }
    .pb_navbar.scrolled.pb_scrolled-light {
      background: url(../images/nav-bg.jpg) center top no-repeat;
      padding-top:50px;
      -webkit-box-shadow: 0px 1px 10px -2px rgba(0, 0, 0, 0.15);
      -moz-box-shadow: 0px 1px 10px -2px rgba(0, 0, 0, 0.15);
      box-shadow: 0px 1px 10px -2px rgba(0, 0, 0, 0.15);
      }
    /*  @media (max-width: 991px) {
        .pb_navbar.scrolled.pb_scrolled-light .navbar-nav {
          background: none;
          border-radius: 0px;
          padding-left: 0rem !important;
          padding-right: 0rem !important;   } 
          }*/
      .pb_navbar.scrolled.pb_scrolled-light ul li a {
        /*background: url(../images/nav-bg.png) 0 0 no-repeat; padding-top: 28px;height: 100px; width: 96px; 
        text-align: center; font: 200 17px "微軟正黑體" ; line-height: 22px;*/
        padding-top: 26px;
        color: #d7d6d5 !important; 
        }
        .pb_navbar.scrolled.pb_scrolled-light ul li a:hover, .pb_navbar.scrolled.pb_scrolled-light ul li a:active, .pb_navbar.scrolled.pb_scrolled-light ul li a:focus {
       /* background: url(../images/nav-bg.png) 0 -200px no-repeat;*/
        color: #ffffff !important; 
        }
        .pb_navbar.scrolled.pb_scrolled-light ul li a.active {
        /*background: url(../images/nav-bg.png) 0 -100px no-repeat;*/
        color: #ffc97f !important; 
          }

/*======================
========main========
=======================*/
#czech,#austria,#croatia,#slovenia,#montenegro,#tour { margin-top: 15px;  }

#czech::before { 
    content: '';
    display: block;
    height: 126px;
    margin-top: -126px;
    visibility: hidden;
}

#austria::before,#croatia::before,#slovenia::before,#montenegro::before { 
    content: '';
    display: block;
    height: 126px;
    margin-top: -126px;
    visibility: hidden;
}
#czech { /*padding-top: 110px;*/ }
.czech-in,.austria-in,.slovenia-in,.montenegro-in,.croatia-in { min-height: 557px; /*padding-bottom: 110px; */}
.czech-in { background:url(../images/photo01.jpg) center top no-repeat; }
.austria-in {background:url(../images/photo02.jpg) center top no-repeat; }
.croatia-in {background:url(../images/photo03.jpg) center top no-repeat; }
.slovenia-in {background:url(../images/photo04.jpg) center top no-repeat; }
.montenegro-in {background:url(../images/photo05.jpg) center top no-repeat; }


.box-green { 
    background: #c5e8db;
    opacity: 0.95;
    max-width: 45%;
    min-height: 557px;
}

.box-yellow { 
    background: #e5e0c5;
    opacity: 0.95;
    max-width: 45%;
    min-height: 557px;
    margin-left: 55%;
}

.box-left { 
    margin-left: 55%;
    margin-right: 8%;
    padding-top: 100px;
}

.box-right { 
    margin-right: 55%;
    margin-left: 8%;
    padding-top: 100px;
}

.content { 
    font: 500 16px "微軟正黑體"; color: #666; line-height: 26px;
}

.spot { padding: 25px 0; }

.spot-title-green { 
    font: 600 15px "微軟正黑體";  color:#424242; 
    background: url(../images/spot-bg.png) 0 0 no-repeat; 
    width:150px;  padding:0 0 0 43px;
    line-height: 29px;
    margin-bottom: 10px;
}
.spot-green { 
    font: 500 15px "微軟正黑體"; color:#009966; line-height: 26px;
    padding:0 38px;
}

.spot-title-yellow { 
    font: 600 15px "微軟正黑體";  color:#424242; 
    background: url(../images/spot-bg.png) -166px 0 no-repeat; 
    width:150px;  padding:0 0 0 43px;
    line-height: 29px;
    margin-bottom: 10px;
}
.spot-yellow  { 
    font: 500 15px "微軟正黑體"; color:#7c7340; line-height: 26px;
    padding:0 38px;
}



/*======================
===========tour=========
=======================*/

#tour { max-width: 100%; margin-top: 80px; background:#ded7d5; }
.tour-in { max-width: 960px; margin: 0 auto; padding: 20px 20px 50px 20px ; } 
.title { margin-top: 20px;}
.tour-title { 
    background: url(../images/tour-title-bg.png) center top no-repeat; height:29px; width: 193px;
    font: 600 16px "微軟正黑體"; color:#ececec; text-align: center; margin: 20px 0; padding-top: 4px;
}
.ct-spancer {
    background:#fff url(../images/spancer.png) 0 0 repeat-x; height: 13px; margin: 10px 0;  text-indent: -5000px;
}
.tour-list { border-bottom: 2px dotted #907a59; margin-left: 60px; padding-bottom: 10px;  }
.tour-list li { font: normal 16px "微軟正黑體"; color:#7b6a4f; line-height: 30px; }
.tour-list li a { color:#7b6a4f; outline: none; text-decoration: none; overflow: hidden; }
.tour-list li:hover { background: #eeedec; }
.tour-list li a em { font: bold 13px "微軟正黑體"; color:#d5880a; margin-left: 6px; }
.tour-list li a span.price { text-align: right; color:#d6001c; font: 600 15px "微軟正黑體"; }
.tour-list li a span.price i { font: 600 16px "微軟正黑體"; }
.name_l::before {
    content: url("../images/icon01.png");
    width:16px ;
    padding: 0px 4px 0 6px ; 
} 
.name_l {
    padding-left: 26px;
    text-indent: -26px;
 }

.name_l { width:85%; display: inline-block; vertical-align: top; }
.price { width:15%; display: inline-block; }

.other{text-align: right;font-size: 15px;margin: 10px 0 0 0;}
.other a {color: #424242;}
.other a:hover {text-decoration:none;color: #7a664a;}

.promo-outer { margin-left: 60px; }
.promo-box { display: flex; flex-wrap: nowrap; align-items: stretch; justify-content: stretch; margin:0 auto;  margin-bottom: 20px;  }
.promo-info { background: #f9f2f0; padding:20px; margin:10px;  }
.promo-info p { font: 600 20px "微軟正黑體"; color:#6d5635; margin-bottom: 12px; }
.promo-info p.promo-title { font: 600 24px "微軟正黑體"; color:#424242;  border:1px solid #7b6a4f; text-align: center; margin-bottom: 12px; }
.promo-info ol li::before { 
    content: "◆";
    margin-right: 6px;
    font-size: 15px;
    color:#8f6a37;
    display: inline-block;     
}
.promo-info li { 
    color:#1c1b1b;
    font-size: 15px;
    font-weight: 500;
    text-indent: -8px;
    padding-left: 15px;
    line-height: 1.8em;
 }
/*======================
===========blog=========
=======================*/

#blog { background: url(../images/nav-bg.jpg) center top repeat-y; }
.blog-in { max-width: 1500px; margin: 0 auto; padding: 30px 0; text-align: center;}
.blog-box { max-width: 313px; position: relative; height: 135px; /*float: left;*/ display:inline-block; }
.blog-box a { /*display: block;*/ width: 100%; height: 100%; }
.blog-box p { 
    position: absolute; right:0; top:0;
    font: 600 13px "微軟正黑體"; background: #c7ab55; opacity: 0.9; color:#fff;  line-height: 26px;  padding:0 10px; 
}
.preword { 
    position: absolute; left:0; bottom:0; text-align: left;
     background: #000000; opacity: 0.7; color:#fffdf5; font: 600 15px "微軟正黑體"; line-height: 26px; width: 100%; padding:0 10px;
}
.blog-box { margin:10px; }
/*.blog-box:last-child { margin-right: 0; }*/


#back-top { z-index: 9999;}

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

@media only screen and (max-width:1350px) {

    .blog-in { max-width: 700px;}
}

@media only screen and (max-width:1200px) {

    .box-left { margin-left: 18%; }
    .box-right { margin-right: 18%; }

}

@media only screen and (max-width:960px) {
    .blog-box { max-width: 650px; float:none; height: auto; }
    .blog-box { margin-right: 0px; margin-bottom: 10px; }
    .blog-in { padding: 0 6%;}
    .preword { bottom:8px; font-size: 16px;}
    .blog-box p { font: 600 15px "微軟正黑體"; }

}

@media only screen and (max-width:768px) {

    #czech,#austria,#croatia,#slovenia,#montenegro,#tour { margin-top: 40px;  }
    #czech::before { height: 0px;  margin-top: 0px; }
    #austria::before,#croatia::before,#slovenia::before,#montenegro::before { height: 0px;  margin-top: 0px; }   
    .logo1 { left:25%; }
    .logo2 { left:5%;}
    .pb_navbar { display: none;}
    #czech { padding-top:20px;}
    .box-left { margin-left: 8%; }
    .box-right { margin-right: 8%; }
    /*.tour-in { padding:0 20px;}*/
    .tour-list { margin-left: 20px;}
    .price { width: 100%; float:none; }    
    .name_l { width:100%; float:none; }
    .tour-list li  {  border-bottom: 2px dotted #907a59; padding-bottom: 6px; margin-top: 6px;}
    .tour-list { border-bottom:none;  }
    .promo-outer { margin-left: 0px; }
    .promo-box { display: block; flex-wrap: wrap;  }
    .promo-box figure { text-align: center;}

}


/*---手機版-----*/
@media only screen and (max-width:480px) {
    
    header { height: 399px;}
    .logo1 { left:15%; }
    .logo2 { left:2%;}
    .czech-in,.austria-in,.slovenia-in,.montenegro-in,.croatia-in { padding-top: 350px; }
    .box-green,.box-yellow { max-width: 100%; min-height: auto; opacity: 1; }
    .box-yellow { margin-left: 0;}
    .box-left,.box-right { padding-top: 20px; }
    .tour-list li a span.price { display: block;float: none;}
    .tour-list li a span.price i { font: 700 18px "微軟正黑體"; }



}