/* reset */	
	@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");
	@import url('https://fonts.googleapis.com/css?family=Titillium+Web');
	html, body, div, span, object, iframe, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, strong, sub, sup, legend, caption, table, tbody, thead, tfoot, tr, th, td, summary, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, b, i, small, menu, nav, section, time, mark, audio, video, dl, dt, dd, ul, li, ol, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote{margin:0;padding:0;}
	dl,ul,ol,menu,li {list-style:none}
	article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section{display:block;}
	input,select,textarea,button{vertical-align:middle; background:none; border:none; font-family:inherit; color:inherit; font-size:inherit;}
	img{border:0; max-width:100%}
	img, li{vertical-align:middle;}
	table{border-collapse:collapse; table-layout: fixed;} address{font-style:normal}
	h1,h2,h3,h4,h5,h6{font-size:100%;}
	a{text-decoration:none; color:inherit;}
	body{color:#333; font-size:12px; font-family:"Pretendard","Titillium Web",dotum,sans-serif; background:#fff}

/* basic main-color:#95001a */ 
.titillium {font-family:"Titillium Web";}

/*header*/
.wrap{
	position:relative;
	width:100%;
	height: 100%;
	background-color:#fff;
}
header{
	color:#fff;
	width:100%;
	border-bottom:1px solid #999;
}
header.fixed {
	position: fixed !important;
	height: 108px;
	box-shadow: 1px 2px 10px -4px #333;
	box-shadow: 1px 2px 10px -4px rgba(0,0,0,0.55);
	z-index: 100;
	transition: .5s all ease;
}
header:after{content:""; display:block; clear:both;}
header h1{
	float:left;
	width:253px;
	font-size:2.5em;
	cursor:pointer;
	padding: 23px;
	margin-left:3%;
}
.menu{
	float:right;
	color:#333;
	font-family:"Titillium Web";
	margin-top:40px;
	margin-right:4%;
	z-index:10
}
.menu:after{content:""; display:block; clear:both;}
.menu li{
	float:left;
	font-size:1.5em;
	text-align:center;
	padding-left:10px;
	padding-right:10px;
	transition:all 1s ease-out;
	cursor: pointer;
}
.menu li:hover{text-decoration:underline;}
.btn_menu{
	display:none;
	position:absolute;	right:4%; top:16px;
	width:30px;
	height:30px;
	cursor:pointer;
}
.btn_menu img{height:100%;}
.deny_style1 {
	color: #fff;
	font-size: 15px;
	font-weight: bold;
	padding: 9px 23px;
	border-radius: 8px;
	background-color: #ff3333;
	cursor: pointer;
	}
	.deny_style2 {
	color: #fff;
	font-size: 15px;
	font-weight: bold;
	padding: 9px 23px;
	border-radius: 8px;
	background-color: #999;
	cursor: pointer;
	}
	.input_middle {
		width: 300px;
		height: 20px;
		border: 1px solid #899;
		padding: 3px 3px 3px 5px;
	}

/* section */
section:after {content:""; display:block; clear:both;} 

#mainImg, #subImg1, #subImg2 {
	position:relative;
	float:left; 
	text-align: center;
	vertical-align:middle;
	overflow:hidden;
}
#mainImg span, #subImg1 span, #subImg2 span {
	display:block;
	position:absolute; top:0; left:0; right:0; bottom:0;
	width:100%; height:100%;
	transition:all 2s ease-out;
}
#mainImg figure, #subImg1 figure, #subImg2 figure {
	position:relative;
	display: inline-block;
	width:50%;
	font-size: 29px;
	color:#fff;
	border:4px solid #fff;
	cursor:pointer;
	background-color: rgba(24,24,24, 0.7);
	z-index: 10;
}
#mainImg figure {
	padding:5%;
	margin-top: 10%;
}
#subImg1 figure, #subImg2 figure {
	padding: 4%;
	margin-top: 15%;
}

#mainImg p, #subImg1 p, #subImg2 p {
	font-size:0.5em;
	margin-top:10px;
	line-height:1.5em;
}

#mainImg {	width:66.6667%;}
#mainImg:hover span {	transform:scale(1.1);}
#mainImg span {background:url('../images/mainImg.jpg') no-repeat center; 	background-size:cover;}

#subImg1 {	width:33.3334%;}
#subImg1:hover span {transform:scale(1.1);}
#subImg1 span {background:url('../images/subImg1.jpg') no-repeat center; 	background-size:cover;}

#subImg2 {	width:33.3334%;}
#subImg2:hover span {transform:scale(1.1);}
#subImg2 span {background:url('../images/subImg2.jpg') no-repeat center; 	background-size:cover;}



/*article*/
#container, #container2 {
	width:1304px;
	margin:80px auto 100px;	
}
.gallery {
	width:300px; height:200px;
	border:1px solid #ccc;
	margin-left:13px;
	margin-right:13px;
	margin-bottom:20px;
	overflow:hidden;
	box-sizing:border-box;
}
.gallery:hover .txt a {
	-moz-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	transform: rotate(0deg);
	transition:.5s all ease;
}
.gallery span {
	position:absolute; top:0; left:0;
	height:100%;
	margin-top:200px;
	
}
.gallery .txt {
	width:95%;
	text-align:center;
	font-size:1.2em;
	color:#fff;
	z-index:1;
	padding-top:75px;
}
.gallery .txt b {font-size:1.3em;}
.gallery .txt a {
	display:block;
	font-weight:bold; 
	color:#acc8ff;
	-moz-transform: rotate(-720deg);
	-webkit-transform: rotate(-720deg);
	-o-transform: rotate(-720deg);
	-ms-transform: rotate(-720deg);
	transform: rotate(-720deg);
}
.gallery .txt a:hover{
	text-decoration:underline;
}
.gallery .bg{
	width:100%;
	background-color:#999;
	background:rgba(0,0,0,0.5);
}
.introWrap {
	width:100%;
	margin:0 auto;
	text-align:center;
}
.booking {text-align: center;margin-bottom: 1rem;}
.booking a{
	display: inline-block;
	font-size: 1.2em;
	color: #fff;
	font-weight: bold;
	border-radius: 10px;
	padding: 10px 40px;
	background: #44d21c;
}
.booking a.metabus {background-color: #bf0000;}


/* footer */
footer{
	width: 100%;
	padding: 20px 0;
	text-align: center;
	color: #fff;
	background:#333;
}
.footerWrap {width:80%; margin:0 auto;}
.footerWrap:after {content:""; display:block; clear:both;}
.copyRight {float:left;}
.copyRight ul {padding-top:10px;}
.copyRight ul:after {content:""; display:block; clear:both;}
.copyRight ul li {
	float: left;
	font-size: 0.9em;
	margin-right: 10px;
}
.bg_footer {
	float:right;
	width: 200px;
	height: 40px;
	margin-top:20px;
	background-image: url("../images/logo_d.png");
	background-size: 100% 100%;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/copyright.jpg',sizingMethod='scale');
	-ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/copyright.jpg', sizingMethod='scale');
}
.bg_footer #family {
	margin-left: -400px;
	margin-top: 10px;
}
.bg_footer #family option {color:#000}

@media screen and (min-width: 978px) and (max-width: 1304px) {
	#container, #container2 {width:978px;}
}

@media screen and (min-width: 652px) and (max-width: 978px) {
	#container, #container2 {	width:652px;}
	section h2 {font-size:66%;}
	.bg_footer {display:none;}
}

@media screen and (max-width: 652px) {
	/*모바일 스마트폰 */	
	header {height:60px;	}
	header h1 {
		width:150px;
		padding:0;
		margin-top:8px;
	}
	.menu{
		display:none;
		position: absolute;
		right: 0;
		top: 0;
		width:100%;
		margin-top: 61px;
		margin-right:0;
		z-index:12;
	}
	.menu li{
		float:none; 
		color:#fff;
		padding: 15px 20px 20px;
		background-color:#999;
		background:rgba(0,0,0,0.95);
	}
	.btn_menu{
		display:block;
	}
	#container {
		width:326px;
		margin-top:12%;
	}
	#container2 {
		width:90%;
		margin-top:8%;
	}
	#mainImg, #subImg1, #subImg2 {width:100%; min-height:400px;}
	.footerWrap {width:90%;}
	.copyRight {float:none;}
	.copyRight ul li{float:none;}
	.bg_footer {display:none;}
}

