@charset "utf-8";
@import url(main.css);
/*  global  */
	body{ font-family: "Microsoft JhengHei", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, "メイリオ", "맑은 고딕", sans-serif; overflow-x: hidden; }
	.wrap{ width: 100%; }
	.container{ max-width: 1200px; }
	.img-rwd { width:100%;}
	.imgbox { overflow:hidden;}
	a{ color:#32312f; text-decoration:none;}
	a:focus, a:hover { text-decoration:none; }
	h1,h2,h3,h4,h5,h6 { margin:0; padding:0; font-weight:normal; font-size: initial;}
	ul, section, div, h3 { position: relative;}
	* {
	  -webkit-box-sizing: border-box;
	     -moz-box-sizing: border-box;
	          box-sizing: border-box;
		}
	ul:after, section:after, div:after, li:after { content: ""; display: block; clear: both;}
	ul{ list-style:none; margin:0; padding:0; }
	body,div,p { margin: 0;padding: 0;}

	:root {
		--black:#000000;
	}

	.bg-white { background-color:var(--white); }
	.bg-grayblue { background-color: #a8c3de; }
	.bg-linegray {
		background: rgb(246,246,246); /* Old browsers */
		background: -moz-linear-gradient(top,  rgba(246,246,246,1) 0%, rgba(170,171,173,1) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  rgba(246,246,246,1) 0%,rgba(170,171,173,1) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  rgba(246,246,246,1) 0%,rgba(170,171,173,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f6f6', endColorstr='#aaabad',GradientType=0 ); /* IE6-9 */
	}
	.bg-grayimg {background: url('/assets/img/index/bg_13.png') no-repeat center; background-size: cover; }
	.font-12 { font-size: 1.2rem; }
	.font-14 { font-size: 1.4rem; }

	.border-dashed-white { border: 1px dashed var(--white); }

	.text-dark,.text-dark a,a.text-dark { color:var(--dark); }
	.text-red,.text-red a,a.text-red { color:var(--red); }
/*	.text-green,.text-green a,a.text-green { color:var(--green); }
	.text-white,.text-white a,a.text-white { color:var(--white); }
	.text-blue,.text-blue a,a.text-blue { color:var(--blue); }
	.text-gray,.text-gray a,a.text-gray { color:var(--gray); }
	.text-dark,.text-dark a,a.text-dark { color:var(--dark); }
	.text-secondary,.text-secondary a,a.text-secondary { color:var(--secondary); }
	.text-dkblue,.text-dkblue a,a.text-dkblue { color:var(--primary); }
	.text-orange,.text-orange a,a.text-orange { color:var(--orange); }*/

/*	* { touch-action: none; }*/
/*	==========================================	*/
	/*  icon  */
/*	.footericon { padding-left:25px; }*/

/*	.icon-date { background:url(/assets/img/index/icon_03.png) no-repeat left; min-height: 23px; line-height: 23px; padding-left: 28px; }
	.icon-datedark { background:url(/assets/img/index/icon_03_dark.png) no-repeat left; min-height: 23px; line-height: 23px; padding-left: 28px; }
	.icon-loc { background:url(/assets/img/index/icon_04.png) no-repeat left; min-height: 19px; line-height: 19px; }
	.icon-tel { background:url(/assets/img/index/icon_05.png) no-repeat left; min-height: 19px; line-height: 19px; }
	.icon-fax { background:url(/assets/img/index/icon_06.png) no-repeat left; min-height: 19px; line-height: 19px; }
	.icon-mail { background:url(/assets/img/index/icon_07.png) no-repeat left; min-height: 19px; line-height: 19px; }
	.icon-link { background:url(/assets/img/index/icon_08.png) no-repeat left; min-height: 19px; line-height: 19px; }
	.icon-wechat { background:url(/assets/img/index/wechat_02.png) no-repeat left; min-height: 19px; line-height: 19px; background-size: contain; }
*/


/*  onscrolling  */
	/*.wrap.onscrolling header.headerbox { background-color:rgba(0,0,0,0.8); padding-top:0;  }*/

	/*  header  */
	.logobox { float: left; width: 289px; }
	.menubox { float: left; width: calc(100% - 289px); }



	/*  rwd menu  */
	.navbar-toggle { border:0; background-color: transparent; position: absolute; right: 0; top: calc((100% - 16px)/2); }
	.navbar-toggle .icon-bar { background-color: var(--blue); display: block; width: 22px; height: 2px; border-radius: 1px; transition: all 500ms ease-in-out; }
	.navbar-toggle .icon-bar+.icon-bar {margin-top: 4px;}

	.rwdmenu-main { position: absolute; top: 44px; left:0; right: 0; bottom:0;}
	.rwdmenu li {padding-bottom: 1px;}
	.rwdmenu li a { background-color:var(--blue); color: var(--white); display: block; font-weight: bolder; padding: 10px; }
	.rwddropmenumenu .li a { font-weight: normal; display: block; padding: 10px; padding-left: 26px; background-color: var(--white); color: var(--dark); }
	.rwddropmenumenu .li { border-bottom: 1px solid var(--gray) }
	.rwddropmenumenu .li:last-child {border-bottom: 0;}

	.rwdmenu li a.rwddropmenubtn { padding-right: 25px; }
	.rwddropmenubtn { position: relative; }
	.rwddropmenubtn.collapsed:before {content: ""; position: absolute; right: 15px; top:15px;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 5px 10px 5px 0;
		border-color: transparent #ffffff transparent transparent;
		-webkit-transition: all 0.52s ease;
		 	 -moz-transition: all 0.52s ease;
						transition: all 0.52s ease;
	}
	.rwddropmenubtn:not(.collapsed):before {content: ""; position: absolute; right: 15px; top:15px;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 5px 10px 5px 0;
		border-color: transparent #ffffff transparent transparent;
		-moz-transform:rotate(-90deg);
		-webkit-transform:rotate(-90deg);
		-o-transform:rotate(-90deg);
		-ms-transform:rotate(-90deg);
		transform:rotate(-90deg);
		-webkit-transition: all 0.52s ease;
		 	 -moz-transition: all 0.52s ease;
						transition: all 0.52s ease;
	}

	.rwdmenubox { position:fixed; top:0; left:0; width:250px; height:100%; z-index:999; opacity:0; background-color: var(--white); border-right: 1px solid var(--gray);
		-moz-transform:translateX(-100%);
		-webkit-transform:translateX(-100%);
		-o-transform:translateX(-100%);
		-ms-transform:translateX(-100%);
		transform:translateX(-100%);
		-webkit-transition: all 0.52s ease;
		 	 -moz-transition: all 0.52s ease;
						transition: all 0.52s ease;
	}
	.rwdmenubox.active { opacity:1;
		-moz-transform:translateX(0);
		-webkit-transform:translateX(0);
		-o-transform:translateX(0);
		-ms-transform:translateX(0);
		transform:translateX(0);
		-webkit-transition: all 0.52s ease;
		 	 -moz-transition: all 0.52s ease;
						transition: all 0.52s ease;
	}
	.rwdmenumask { display:none; position:fixed; top:0; left:0; height:100%; width:100%; background-color:rgba(0,0,0,0.6); z-index:9;
									-webkit-transition: all 0.52s ease;
									 	 -moz-transition: all 0.52s ease;
													transition: all 0.52s ease;
	}
	.rwdmenumask.active { display:block; }


	/*	footer	*/
	.footerbox { background-color: var(--black); padding:15px 0; }
	.foot-right { display: inline-block; width: 328px; }
	.foot-left { display: inline-block; width: calc(100% - 332px); }
	.copyright { font-size: 0.9rem; }
	.foot-left .note { letter-spacing: 10px; font-size: 1.2rem; font-weight: bolder; }


	/* welcome */
	.welcome-top {  overflow-y:auto; background: url('/assets/img/welcome/bg_01.png') no-repeat top center; height:100vh; background-size: 100% 100%; }
	.welcome-bot { position: fixed; bottom: 0; left:0; width: 100%; height: 100px; line-height: 100px; background-color: var(--black); font-size:3rem; font-weight: bolder; letter-spacing: 20px; }
	.welcome-formbox {	position: absolute; top:200px; bottom: 0; left:0; right: 0; text-align: center; z-index: 1;  }
	.welcome-form { padding: 50px 30px; margin: 0 auto;max-width: 860px; border-radius: 15px; background-color: rgba(0,0,0,.7); }
	.welcome-form form { max-width: 600px; margin: 0 auto; }
	.welcome-spray { position: absolute; top:100px; right: -70px; z-index: 2; }
	.welcome-sub { font-size: 3rem; letter-spacing: 6px; }
	.welcome-sub2 { font-size: 1.2rem; letter-spacing: 2px; }
	.welcome-btn {
		background: rgb(185,40,50); /* Old browsers */
		background: -moz-linear-gradient(top,  rgba(185,40,50,1) 0%, rgba(183,152,154,1) 32%, rgba(216,140,143,1) 68%, rgba(216,140,143,1) 68%, rgba(217,39,46,1) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  rgba(185,40,50,1) 0%,rgba(183,152,154,1) 32%,rgba(216,140,143,1) 68%,rgba(216,140,143,1) 68%,rgba(217,39,46,1) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  rgba(185,40,50,1) 0%,rgba(183,152,154,1) 32%,rgba(216,140,143,1) 68%,rgba(216,140,143,1) 68%,rgba(217,39,46,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b92832', endColorstr='#d9272e',GradientType=0 ); /* IE6-9 */
	}

	.welcome-form[data-aos] .animatebefore {
	 opacity: 0;
	}
	.welcome-form[data-aos].aos-animate .animatebefore {
	  opacity: 1;
		-webkit-transition: all 3.5s ease;
		 	 -moz-transition: all 3.5s ease;
						transition: all 3.5s ease;
	}

	/*  index  */
	.index-bot { background: url('/assets/img/index/bg_07.png') no-repeat bottom center; height: 100vh; z-index: 1; margin-top: -350px;background-size: contain; }

	.index-sun { z-index: 1; background: url('/assets/img/index/bg_02.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain; }
	.index-wave { z-index: 2; background: url('/assets/img/index/bg_06.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain;  }
	.index-wine { z-index: 3; background: url('/assets/img/index/bg_03.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain;  }
	.index-spray { z-index: 4; background: url('/assets/img/index/bg_05.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain;  }
	.index-sea { z-index: 5; background: url('/assets/img/index/bg_04.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain;  }

	.index-main { padding:calc(100% - 600px) 0 0 0; z-index: 6; }

	.index-leftbird{ left: 100px; }
	.index-leftbird2{ left:50px;  top:calc(100% - 380px); }
	.index-leftbird3{ left:380px;  bottom:-100px; }
	.index-botbird{ bottom: -200px; left:0; right: 0; text-align: center; }
	.index-rgihtbird{ right: 15px; }
	.index-rgihtbird2 { right: 250px; top:calc(100% - 332px); }

	/* content */
	.content-bot { background: url('/assets/img/index/bg_07.png') no-repeat bottom center; height: 100vh; z-index: 1; margin-top: -350px; background-size: contain;}

	.content-sun { z-index: 1; background: url('/assets/img/index/bg_08.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain; }
	.content-wave { z-index: 2; background: url('/assets/img/index/bg_12.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain;  }
	.content-wine { z-index: 3; background: url('/assets/img/index/bg_10.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain;   }
	.content-spray { z-index: 4; background: url('/assets/img/index/bg_11.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain;   }
	.content-sea { z-index: 5;  background: url('/assets/img/index/bg_09.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain;  }

	/*.content-sun { z-index: 1; }
	.content-wave { z-index: 2;  }
	.content-wine { z-index: 3;  }
	.content-spray { z-index: 4;  }
	.content-sea { z-index: 5;  }
*/
	.content-main { padding:calc(100% - 1190px) 0 0 0; z-index: 6; }

	.content-rightbird{ right: 50px; }
	.content-rightbird2{ right: 40px; bottom: 30%; }
	.content-rightbird3{ right: 200px; bottom: 10%; }
	.content-leftbird{ left: 50px; top:40%; }
	.content-leftbird2{ left: 200px; bottom: 25%; }
	.content-botbird {  bottom: -7%; left:0; right: 0; text-align: center; }

/*
	.content-leftbird{ left: 100px; }
	.content-leftbird2{ left:50px;  top:calc(100% - 380px); }
	.content-leftbird3{ left:380px;  bottom:-100px; }
	.content-botbird{ bottom: -200px; left:0; right: 0; text-align: center; }
	.content-rgihtbird{ right: 15px; }
	.content-rgihtbird2 { right: 250px; top:calc(100% - 332px); }
*/
	.contnav.nav { display: block; }
	.contnav { text-align: center; }
	.contnav li { display: inline-block; margin-right: 20px; }
	.contnav li a { letter-spacing: 3px; display: block; background-color: #ff8e2b; border:2px solid #000; border-radius: 4px; padding: 5px 15px; font-weight: bolder; font-size: 1.6rem; color:var(--black); }
	.contnav li:last-child{ margin-right: 0; }
	.contnav li a.active { color:var(--white); background-color: #f9db49; }

	.opennav.nav { display: block; }
	.opennav { text-align: center; }
	.opennav li { display: inline-block; margin-right: 10px; width: calc(100%/4 - 11px); }
	.opennav li a { display: block; background-color: var(--white); border-radius: 4px; padding: 5px 15px; color:var(--black); }
	.opennav li:last-child{ margin-right: 0; }
	.opennav li a.active { color:var(--white); background-color:var(--black); }

	.opentable thead tr { border-bottom: 1px dashed var(--white); }
	.opentable th,.opentable td { padding: 0.5rem; word-break: break-word; }
	.opentable tbody tr:nth-child(odd) { background-color: var(--white); }

	.loginform .col-form-label { text-align: right; }

	.custom-file-label { padding-left: 93px; height: 60px; word-break: break-word;  background-color: transparent; border: 0; overflow: hidden;  }
	.custom-file-label::after { content: "選擇檔案"; left:0; right: initial; background-color: #f9db49; border: 2px solid var(--dark); color: var(--dark); display: block; }

	.item { background-color: var(--white); border: 2px solid var(--black); border-radius: 50%; display: inline-block; height: 40px; width: 40px; line-height: 36px; font-size: 1.3rem; text-align: center; font-weight: bolder; }

	.addbtn { border: 2px solid var(--black); background-color: #ff8e2b; font-weight: bolder; padding: 5px 20px; color: var(--black) }
	.removebtn{ border: 2px solid var(--black); background-color: #ff8e2b; font-weight: bolder; padding: 5px 20px; color: var(--black) }

	.checkbox-control ~ .custom-control-label:before { background-color: var(--white); }

	.submitbtn { margin:0 10px; font-size: 1.2rem; background-color: #f9db49; border:2px solid #000; border-radius: 4px; padding: 5px 20px; color:var(--black); font-weight: bolder; }
	.resetbtn {margin:0 10px; font-size: 1.2rem; background-color: #ff8e2b; border:2px solid #000; border-radius: 4px; padding: 5px 20px; color:var(--black); font-weight: bolder;  }
	.gobtn {margin:0 10px; font-size: 1.2rem; color: var(--white); background-color: #2fa3dc; border:2px solid #000; border-radius: 4px; padding: 5px 20px; font-weight: bolder;  }


	/* gastromomicjoirney */
	.areanav.nav { display: block; }
	.areanav { text-align: center; }
	.areanav li { display: inline-block; margin-right: 15px; width: calc(100%/3 - 13px); position: relative; }
	.areanav li:before { content: ""; position: absolute; top:58px; left: -15px; background: url('/assets/img/index/line_02.png') no-repeat center; width: 9px; height: 80px; }
	.areanav li:first-child:before { display: none; }
	.areanav li:nth-child(1) a { display: block; background: url('/assets/img/index/btn_08.png') no-repeat center; height: 146px; background-size: contain; }
	.areanav li:nth-child(2) a { display: block; background: url('/assets/img/index/btn_09.png') no-repeat center; height: 146px; background-size: contain; }
	.areanav li:nth-child(3) a { display: block; background: url('/assets/img/index/btn_10.png') no-repeat center; height: 146px; background-size: contain; }
	.areanav li:last-child{ margin-right: 0; }
	.areanav li:nth-child(1) a.active { background: url('/assets/img/index/btn_11.png') no-repeat center; height: 146px; background-size: contain; }
	.areanav li:nth-child(2) a.active { background: url('/assets/img/index/btn_12.png') no-repeat center; height: 146px; background-size: contain; }
	.areanav li:nth-child(3) a.active { background: url('/assets/img/index/btn_13.png') no-repeat center; height: 146px; background-size: contain; }

	.area-tab-content { overflow-y: scroll; overflow-x: hidden; max-height: 570px; }


		/* hack  */
		::-webkit-scrollbar {
		    height: 5px;
		    width: 5px;
		    background-color: transparent;
		}
		::-webkit-scrollbar-thumb {
		    border-radius: 10px;
		    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
		    background-color: #928692;
		}
		.form-control.is-valid, .was-validated .form-control:valid { background-color: #fff;}
		.form-control.is-invalid, .was-validated .form-control:invalid { background-color: #fff;}


		.articlebox { word-break: break-word; }
		.articlebox iframe { max-width: 100%;}
		.articlebox img { max-width:100%; }

		.mCSB_inside>.mCSB_container { margin-right: 0; }

		.modal-backdrop { background-color: rgba(255,255,255,0.6);}
		.modal-backdrop.fade.in { opacity: 1; }

		.custom-control-label::before { background-color: var(--gray); border:1px solid var(--gary); }
		.custom-control-input:checked~.custom-control-label::before { background-color: var(--blue); border:1px solid var(--blue); }
		.custom-radio .custom-control-input:checked~.custom-control-label::after { background-image: none; }

		.modal-body { overflow: auto; }

		/* loading */
		.loadingbox { display: none; position: fixed; top:0; left:0; width: 100%; height: 100%; background-color: rgba(255,255,255,0.6); z-index: 9999; display: table; }
		.loading-spinner {
		  display:table-cell; vertical-align: middle; background-position:center;
		  background: url(/simg_thumbs/loader.gif) no-repeat center;
		  width: 100%;
		  height: 100%;
		  margin-right: 6px;
		}
		.loading-spinner.pull-right {
		  margin-right: 12px;
		  margin-top: 12px;
		}

		/* ANIMATED X */
		.navbar-toggle .icon-bar:nth-of-type(1) {
			-webkit-transform: rotate(45deg);
			-ms-transform: rotate(45deg);
			transform: rotate(45deg);
			-webkit-transform-origin: 10% 10%;
			-ms-transform-origin: 10% 10%;
			transform-origin: 10% 10%;
		}

		.navbar-toggle .icon-bar:nth-of-type(2) {
			opacity: 0;
			filter: alpha(opacity=0);
		}

		.navbar-toggle .icon-bar:nth-of-type(3) {
			-webkit-transform: rotate(-45deg);
			-ms-transform: rotate(-45deg);
			transform: rotate(-45deg);
			-webkit-transform-origin: 10% 90%;
			-ms-transform-origin: 10% 90%;
			transform-origin: 10% 90%;
		}

		/* ANIMATED X COLLAPSED */
		.navbar-toggle.closed .icon-bar:nth-of-type(1) {
			-webkit-transform: rotate(0);
			-ms-transform: rotate(0);
			transform: rotate(0);
		}

		.navbar-toggle.closed .icon-bar:nth-of-type(2) {
			opacity: 1;
			filter: alpha(opacity=100);
		}

		.navbar-toggle.closed .icon-bar:nth-of-type(3) {
			-webkit-transform: rotate(0);
			-ms-transform: rotate(0);
			transform: rotate(0);
		}
		/* END ANIMATED X */

		 .shakes.active{
			animation: shake 0.82s cubic-bezier(.36, .07, .19, .97);
			transform: translate3d(0, 0, 0);
		}
		@keyframes shake {
			10%,90% {
				transform: translate3d(-1px, 0, 0);
			}
			20%,80% {
				transform: translate3d(2px, 0, 0);
			}
			30%,50%,70% {
				transform: translate3d(-4px, 0, 0);
			}
			40%,60% {
				transform: translate3d(4px, 0, 0);
			}
			100% {
				transform: translate3d(0, 0, 0);
			}
		}

		.shakes2.active{
			animation: shake2 3s cubic-bezier(.36, .07, .19, .97);
			transform: rotate(0);
		}
		@keyframes shake2 {
			10%,90% {
				transform: rotate(-1deg);
			}
			20%,80% {
				transform: rotate(1deg);
			}
			30%,50%,70% {
				transform: rotate(-1deg);
			}
			40%,60% {
				transform: rotate(1deg);
			}
			100% {
				transform: rotate(0);
			}
		}
@media screen and (min-width: 2560px){

	/* index */
	.index-main {padding: calc(100% - 830px) 0 0 0;}

	/* content */
	.content-main {padding: calc(100% - 1630px) 0 0 0;}
}

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

	/* welcome */
	.welcome-formbox { top:30px; }
	.welcome-spray { display: none; }

	/* index */
	.index-main {padding: calc(100% - 470px) 0 0 0;}

	/* content */
	.content-main {padding: calc(100% - 870px) 0 0 0;}

}
@media screen and (max-width: 1440px){

	/* welcome */

	/* content */
	.content-bot { margin-top: -47px; }
	.content-rightbird,.content-rightbird2,.content-rightbird3,.content-leftbird,.content-leftbird2,.content-botbird { display: none; }

}




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

	/* welcome */
	.welcome-top { overflow-y: auto; padding: 15px; padding-bottom: 100px; }
	.welcome-bot { z-index: 1; font-size: 1.2rem;  letter-spacing: 10px; line-height: initial; height: initial; padding: 15px 0; }
	.welcome-bot .img-fluid { max-width: auto; width: 40px; }
	.welcome-sub { font-size: 1.9rem; }
	.welcome-form { padding: 15px; }
	.welcome-formbox { position: initial; }
	.welcome-form .copyright { margin-top: 15px!important; }


	/* index */
	.index-main {padding: calc(100% - 326px) 0 0 0; z-index: 6;}
	.index-rgihtbird { top:30%; }
	.index-leftbird { top: 35%; }
	.index-leftbird2 { top: 85%; }
	.index-rgihtbird2 { right: 15px; top:63%; }

	/* conter */
	.content-main {  padding: calc(100% - 623px) 0 0 0; }
	.content-rightbird,.content-rightbird2,.content-rightbird3,.content-leftbird,.content-leftbird2,.content-botbird { display: none; }


	/* gastromomicjoirney */
	.area-tab-content { max-height: 484px; }
}

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

	.container { max-width: 100%; }

	/* index */
	.index-sun { z-index: 1; background: url('/assets/img/index/mobindex_banner_01.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain; }
	.index-wave { z-index: 2; background: url('/assets/img/index/mobindex_banner_03.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain;  }
	.index-wine { z-index: 3; background: url('/assets/img/index/mobindex_banner_05.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain;  }
	.index-spray { z-index: 4; background: url('/assets/img/index/mobindex_banner_04.png') no-repeat top center; height: 100%;width:100%; top: 0; background-size: contain;  }
	.index-sea { z-index: 5; background: url('/assets/img/index/mobindex_banner_06.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain;  }

	.index-leftbird,.index-leftbird2,.index-leftbird3,.index-botbird,.index-rgihtbird,.index-rgihtbird2 { display: none; }
	.index-rwdbird { z-index: 1; background: url('/assets/img/index/mobindex_banner_02.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain; display: block!important; }

	.index-main {padding: calc(100% - 326px) 0 0 0; z-index: 6;}
	.index-bot { margin-top: 50px; }

	.index-main .left { padding-bottom: 30px; }

	/* content */
	.content-sun { z-index: 1; background: url('/assets/img/index/mobindex_banner_02_01.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain; }
	.content-wave { z-index: 2; background: url('/assets/img/index/mobindex_banner_02_02.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain;  }
	.content-wine { z-index: 3; background: url('/assets/img/index/mobindex_banner_02_03.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain;  }
	.content-spray { z-index: 4; background: url('/assets/img/index/mobindex_banner_02_05.png') no-repeat top center; height: 100%;width:100%; top: 0; background-size: contain;  }
	.content-sea { z-index: 5; background: url('/assets/img/index/mobindex_banner_02_04.png') no-repeat top center; height: 100%;width: 100%; top: 0; background-size: contain;  }

	/* hack*/


}

@media screen and (max-width: 812px){
	/* index */
	.index-main {padding: calc(100% - -468px) 0 0 0; z-index: 6;}

}

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



	/* gastromomicjoirney */
	.area-tab-content { max-height: 588px; }

	/* index */
	.index-main { padding: calc(100% - -472px) 0 0 0; }
	.index-bot { margin-top: -248px; }

	/* content */
	.content-main { padding: calc(100% - 123px) 0 0 0; }
	.content-bot { margin-top: -248px; }
	.loginform .col-form-label { text-align: left; }

	/*hack */
	.animated {
		animation: none !important;
	}
}

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

	/* footer */
	.foot-left,.foot-right { display: block; width: 100%; }
	.foot-left { padding-bottom: 15px; }

	/* index */
	.index-main { padding: calc(100% - -276px) 0 0 0; }
	.index-bot { margin-top: -547px; }


	/*conter */
	.contnav li a { font-size: 1rem; letter-spacing: 0; padding:5px 13px; }
	.contnav li { margin-right: 0; }

	.submitbtn,.resetbtn,.gobtn { font-size: 1rem; letter-spacing: 0; padding: 5px 13px; margin: 6px }
	.content-main { padding: calc(100% - 27px) 0 0 0; }
	.opentable tbody { font-size: 0.7rem; }
	.opennav li a { font-size: 0.7rem; padding: 5px; }


	/* gastromomicjoirney */
	.areanav li:before { top:36px; }

}

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

	/* index */
	.index-main { padding: calc(100% - -324px) 0 0 0; }
	.index-bot { margin-top: -555px; }

	.opennav li { margin-right: 0;  width: calc(100%/2 - 2px);  margin-bottom: 5px; }

}

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

	/* content*/
	.content-bot { margin-top: -548px;}

}

@media screen and (max-width: 375px){
	/* content*/
	.content-bot { margin-top: -460px;}
}

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

	/* index */
	.index-bot { margin-top: -442px; }


}