@charset "utf-8";
/* CSS Document */
#mynav{ 
	background:rgba(181,217,232,.8); position:relative; z-index:99; color:#fff; width:100%; padding:10px 5px 10px 0;
	-webkit-box-shadow:0 3px 5px rgba(0,0,0,.6);
	-moz-box-shadow:0 3px 5px rgba(0,0,0,.6);
	-o-box-shadow:0 3px 5px rgba(0,0,0,.6);
	box-shadow:0 3px 5px rgba(0,0,0,.6);
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
/*-------------------- store  商城 -------*/
#store{
	font-size:0.8em;
	color:#666666;
	overflow:hidden;
	width:96%;
	border-bottom:1px #CCCCCC solid;
	padding:10px 2%;
	line-height:20px;
}
#store a{
	color:#666666;
}
#store a:hover{
	color:#333333;
}
#store h6{
	font-size:1.2em;
	color:#0f4f77;
}
.phone{
	float:left;
	width:20%;
}
.phone img{
	width:100%;
	max-width:60px;
	height:auto;
}
.store{
	float:right;
	width:80%;
}
/*-------------------- store  商城 22222222222222 -------*/
#store_2{
	font-size:1.1em;
	color:#333333;
	line-height:1.2em;
	text-align:justify;
}
#store_2 li{
	display:block;
	border-bottom:1px #CCCCCC solid;
	padding:15px 20px;
	overflow:hidden;
	min-height:40px;
	text-align:left;
}
#store_2 li:last-child {
	border:none;
}
#store_2 li img{
	position:absolute;
	top:auto;
}
#store_2 li a, #store_2 li span{
	display:inline-block;
	padding:0 0 0 60px;
}
#store_2 li a.tel{
	line-height:36px;
}
.btn{
	font-size:1.3em;
	clear:both;
	text-align:center;
	width:100%;
	padding:15px 0 0 0;
}
.btn a{
	border-radius:5px;
	background:#ebb2ba;
	height:40px;
	line-height:40px;
	width:85%;
	display:block;
	margin:auto;
	border:1px #75484e solid;
	box-shadow:0 2px 2px rgba(0,0,0,.5);
	text-shadow:0 2px 2px #fff;
}
.map{
	clear:both;
	padding:0 0 50px 0;
	overflow:hidden;
	height:50%;
}

/*----------------------------------  =======  下拉分類動畫  -----*/
.toggle .lines{
  position: absolute;
  top: 35px;
  left:20px;

  display: inline-block;
  width: 25px;
  height: 2px;
  background: #fff;
  border-radius: 1px;

  transition: all 200ms;
}
.toggle .lines::before{
  position: absolute;
  top: -6px;
  left:0;
  content: '';
  display: inline-block;
  width: 25px;
  height: 2px;
  background: #fff;
  border-radius: 1px;
  transform-origin: 50% 50%;
  transition: all 200ms;
}
.toggle .lines::after{
  position: absolute;
  top: 6px;
  left:0;
  content: '';
  display: inline-block;
  width: 25px;
  height: 2px;
  background: #fff;
  border-radius: 1px;

  transform-origin: 50% 50%;
  transition: all 200ms;
}
/* when open lines positions */
.toggle.open .lines{
  background: transparent;
}
.toggle.open .lines::before{
  top: 0px;
  transform: rotate3d(0, 0, 1, 45deg);
  -webkit-transform: rotate3d(0, 0, 1, 45deg);
}
.toggle.open .lines::after{
  top: 0px;
  transform: rotate3d(0, 0, 1, -45deg);
  -webkit-transform: rotate3d(0, 0, 1, -45deg);
}
/* animation for the menu */
@-webkit-keyframes openPullDown {
  0% {
    opacity: 0;
    -webkit-transform: scale(.7);
    transform: scale(.7);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes openPullDown {
  0% {
    opacity: 0;
    -webkit-transform: scale(.7);
    -ms-transform: scale(.7);
    transform: scale(.7);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
}
/*-----------------------------------*/
#sort{ clear:both; overflow:hidden; padding:0 0 .2em;}
.toggle { display: none; padding:10px 0;}
.nav { font-size:.9em; display: block; width: 100%; text-align:center;}
.nav ul{ margin: 0; padding: 0;}
.nav li{ display:inline-block; color: #000; list-style: none; background:rgba(255,255,255,.7); border-radius:5px; }
.nav li a { display: block; padding: 10px 50px; color: #000; text-decoration: none; }
.nav li:hover { background:rgba(255,255,255,1);}
@media (max-width: 640px) {
.toggle { 
	font-size:.9em; display: block; clear:both; padding: 7px 0; color: #FFF; text-align:center; cursor:pointer; box-shadow:0 1 px 1px rgba(0,0,0,.5); border:1px #999999 solid;
	/* border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; */
	background: #828282 url(/images/line.png) right center no-repeat;
	background: #828282 -moz-linear-gradient(top, #828282 0%, #5d5b5b 100%); /* FF3.6+ */
	background: #828282 -webkit-gradient(linear, left top, left bottom, color-stop(0%,#828282), color-stop(100%,#5d5b5b)); /* Chrome,Safari4+ */
	background: #828282 -webkit-linear-gradient(top, #828282 0%, #5d5b5b 100%); /* Chrome10+,Safari5.1+ */
	background: #828282 -o-linear-gradient(top, #828282 0%, #5d5b5b 100%); /* Opera11.10+ */
	background: #828282 -ms-linear-gradient(top, #828282 0%, #5d5b5b 100%); /* IE10+ */
	background: #828282 linear-gradient(top, #828282 0%, #5d5b5b 100%); /* W3C */
}
.nav { display: none;}
.nav li{ float: none; display:block; border-radius:0; background:#FFFFFF;}
.nav li a{ padding: 10px 15px;border-bottom:1px #CCCCCC solid;}
}   
/*--------------------- 展開收合 --------*/
#col{width:100%;clear:both;}
/* Homepage Style */
.sliderbox{width:; /* height:600px; */ overflow:hidden; /* box-shadow:1px 2px 2px rgba(0,0,0,.6); */ }
.sliderbox a{color:#000;}
.sliderbox a:hover{color:#000;text-decoration:none;}
.sliderbox dt{ clear:both; padding:10px 30px 10px 20px; line-height:20px; cursor:pointer; background:rgba(255,255,255,.9) url(/images/icon_arrow.png) 97% center no-repeat; border:1px #CCCCCC solid;border-radius:5px; margin:0 0 2px 0;}
.sliderbox dt a{ display:inline-block; width:100%;}
.sliderbox .open{ background:url(/images/icon_arrow2.png) 97% center no-repeat; color:#0f537b; cursor:default;}
.sliderbox .title{ font-size:0.9em; color:#000; display:block; padding:0 0 0 30px;}
.sliderbox .title img{ position:absolute; left:20px; height:28px; margin:-4px 0 0 5px;}
.sliderbox dt:hover span{color:#0f537b;}
.sliderbox .open:hover span{color:#000;}
.sliderbox dd{ font-size:0.9em; padding:0; margin:0; background:rgba(0,0,0,.1); position:relative; overflow:hidden;}
.sliderbox .text{ font-size:0.9em; color:#000; padding:10px;}

/*------------------------  video  影音  ------*/
.video-container {
    position: relative;
    z-index: 1;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    border: 7px solid #fff;
    background-color: #fff;
}
.video-container iframe, .video-container object, .video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

/*-------------------------------   share  優惠分享  -------*/
#offer{
	text-align:center;
}
#offer li{
	background:#FFFFFF;
	border-radius:10px;
	box-shadow:0 2px 3px rgba(0,0,0,.5);
	margin:5px 0 20px 0;
	display:block;
	width:100%;
}
#offer li a img{
	width:100%;
	height:auto;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}
#offer li a span{
	font-size:1.3em;
	color:#0f4f76;
	display:block;
	padding:10px 0 5px;
}
#offer em{
	font-size:1.3rem;
	display:block;
}
@media screen and (min-width: 1200px){
	#offer li{
	float:left;
	display:block;
	width:;
	margin:0 2% 20px 0;
	}
}
/*---------------------------*/
.offer_img img{
	width:100%;
}
.offer{
	font-size:.9em;
	line-height:1.3em;
	clear:both;
	padding:15px;
	text-align:left;
}
.btn_s{
	font-size:.9em;
	clear:both;
	text-align:center;
	width:100%;
	padding:15px 0;
}
.btn_s li{
	display:inline-block;
	width:47%;
	padding:5px 0;
	margin:0 1%;
	border-radius:5px;
	box-shadow:0 1px 2px rgba(0,0,0,.5);
}
.btn_s li a{
	display:block;
}
.btn_s .o1{
	background:#cdcdcd;
	text-shadow:0 1px 1px #fff;
	border:1px #666666 solid;
}
.btn_s .o2{
	background:#2ca4d5;
	border:1px #666666 solid;
}
.btn_s .o2 a{
	color:#FFFFFF;
	text-shadow:0 1px 1px #333;
}