@charset "UTF-8"

#wrapper {
	width:100%;
}
#m_bg {
	width:100%;
	height:100%;
	background-color:rgba(0,0,0,0.7);
	position:fixed;top:0; left:0; z-index:19;
	display:none;
}

header {
	position:fixed;	top:0;
	z-index:10;
	width:100%;
	padding:2%;
	background-color:#fff;
	color:#222;
	box-shadow:0 0 10px rgba(0,0,0,0.3);
	overflow:hidden;
	}

#header {
	width:95%;
	margin:0 auto;
	position:relative;
	overflow:hidden;
	}
	header #header>* {
		float:left;
		text-align:center;
	}	
	#header h1 img,p img {
		width:70%;
	}
	#header p,h1 {
		width:10%;
	}	
	#header form {
		width:56%;		
		margin:0 2%;	
		position:relative;
	}
	#header form input[type=text] {	
		width:100%;
		padding:2% 0;
		border:1px solid #e0e0e0;
		border-radius:1.25rem;
		box-shadow:inset 2px 2px 3px rgba(0,0,0,0.2);
	}
	#header form button {	
		border:none;	
		background-color:transparent;
		position:absolute;
		right:5%; top:5%;
		height:100%;
	}
	#header form button img {
		height:60%;
	}
	@media only screen and (min-width:768px) and (max-width:1023px) {
		#header form input[type=text] {
			padding:3% 0;
			border-radius:2em;
		}
	}
	@media only screen and (min-width:1024px) {
		#header form input[type=text] {
			padding:3% 0;
			border-radius:2em;
		}
	}

#menu {
	width:70%;
	height:100%;
	background-color:#fff;
	position:fixed; top:0; left:-70%;
	display:none;
	z-index:20;
	box-shadow:0 0 10px rgba(0,0,0,0.3);	
	}

	#menu p:first-of-type {
		position:absolute;
		left:88%; top:1%;

	}
	#menu p:first-of-type img {
		width:60%;
	}

	#menu #lnb {
		overflow:hidden;
		width:90%;
		margin:0 auto;
		margin-top:10%;
	}
	#menu #lnb li {
		float:left;
		background-color:#c78435;
		text-align:center;
		width:30%;
		margin-right:5%;
		padding:0.4% 0;
		border-radius:20px;	
	}
	#menu #lnb a {
		font-size:0.9rem;
		font-family:'Yeon Sung',cursive;
		color:#fff;
	}
	#menu p:nth-of-type(2) {
		width:90%;	
		margin:5% auto;
		border-bottom:0.1rem solid #e84d3b;
	}
	#menu p:nth-of-type(2) a {
		font-size:0.6rem;
		color:#555;
	}
	#menu #sns {
		overflow:hidden;
		width:80%;
		margin:6% auto;
	}
	#menu #sns li {
		float:left;
		width:22%;
		margin:0 2%;
		}
	#menu #sns li:first-child {
		margin-left:0;
	}
	#menu #sns li:last-child {
		margin-right:0;
	}
	#menu #sns li img {
		width:100%;
	}
	#menu #sns dl {
		text-align:center;
			color:#777;	
	}
	#menu #sns dd {
		padding-top:2%;
		font-size:0.6rem;
	}

	#menu #snb {
		position:absolute; bottom:0; left:0;
		width:100%;
		height:75%;
		overflow:hidden;
	}
	#menu #snb>* {
		float:left;
	}
	#menu #snb>ul {
		width:24%;
		height:100%;	
		text-align:center;
	}
	#menu #snb>ul li {
		width:100%;
		height:16.666667%;
		box-shadow:0 10px 6px -10px rgba(0,0,0,0.3);
		padding:40% 0;
		cursor:pointer;
		border-bottom:0.3rem solid transparent;
		overflow:hidden;
	}
	#menu #snb ul img {
		width:50%;
	}

	#menu #snb dd {
		padding-top:5%;
		font-family:'Yeon Sung',cursive;
		font-size:0.8rem;	
	}
	#menu #snb div {
		width:76%;
		height:100%;		
		position:absolute;
		bottom:0; right:0;
		font-size:0.7rem;
		line-height:2.5;
		box-shadow:-6px 0px 10px -5px rgba(0,0,0,0.2);
	}
	#menu #snb div u {
		text-decoration:none;
		float:right;
	}
	#menu #snb div a{
		color:#222;
	}
	#menu #snb div>ul>li {
		width:100%;
		position:relative;
		border-bottom:1px solid #e0e0e0;
		padding:0 4%;
		cursor:pointer;
	}
	#menu #snb div .ss_snb {
		position:absolute;
		left:150%; top:0;
		width:100%;
	}
	#menu #snb div .ss_snb li {
		border-bottom:1px solid #e0e0e0;
	}

	@media only screen and (min-width:768px) and (max-width:1023px) {
		#menu #lnb a {
			font-size:1.5em;
		}
		#menu p:nth-of-type(2) a {
			font-size:1.2em;
		}
		#menu p:nth-of-type(2) {		
			border-bottom:0.2em solid #e84d3b;
		}
		#menu #snb {
			height:70%
		}
		#menu #sns dd {
			font-size:1em;
		}
		#menu #snb dd {
			font-size:1.5em;	
		}
		#menu #snb>ul li {
			padding:17% 0;
			border-bottom:0.4em solid transparent;
		}
		#menu #snb ul img {
			width:35%;
		}
		#menu #snb div {	
			font-size:1.3em;
		}
	}

	@media only screen and (min-width:1024px) {
		#menu #lnb a {
			font-size:2em;
		}
		#menu p:nth-of-type(2) a {
			font-size:1.5em;
		}
		#menu p:nth-of-type(2) {		
			border-bottom:0.3em solid #e84d3b;
		}
		#menu #snb {
			height:70%
		}		
		#menu #sns dd {
			font-size:1.3em;
		}
		#menu #snb dd {
			font-size:2em;	
		}
		#menu #snb>ul li {
			padding:17% 0;
			border-bottom:0.5em solid transparent;
		}
		#menu #snb ul img {
			width:40%;
		}
		#menu #snb div {	
			font-size:1.8em;
		}
	}
	@media only screen and (min-aspect-ratio:9/16) {
		#menu #snb>ul li {
			padding:25% 0;
		}
	}
	@media only screen and (min-aspect-ratio:3/5) {		
		#menu #snb>ul li {
			padding:13% 0;
		}
	}
	@media only screen and (min-aspect-ratio:1/1) {
		#menu {
			width:40%;
			font-size:0.6em;
		}
	}

#main {
	width:90%;
	margin:0 auto;
	position:relative;
	}
	#main #banner {
		position:relative;
		padding-bottom:64%;
		width:100%;	
		margin-top:18%;
		overflow:hidden;
		box-shadow:0 0 10px rgba(0,0,0,0.3);
	}
	#banner li {
		position:absolute;
		width:100%;
	}
	#banner li:nth-child(1) {
		left:0;
	}
	#banner li:nth-child(2) {
		left:100%;
	}
	#banner li:nth-child(3) {
		left:200%;
	}
	#banner li:nth-child(4) {
		left:300%;
	}
	#banner li:nth-child(5) {
		left:400%;
	}
	#banner li img {
		width:100%;
	}
	#main #control {
		position:absolute;
		right:1%; top:30%;	
	}
	#main #control li {
		width:0.7rem;
		height:0.7rem;
		border:0.1rem solid #333;
		border-radius:100%;
		margin-bottom:40%;
	}

	@media only screen and (min-width:768px) and (max-width:1023px) {
		#main #control {		
			top:35%;	
		}
		#main #control li {
			width:1.2em;
			height:1.2em;
			border:0.2em solid #333;
		}
	}
	@media only screen and (min-width:1024px) {
		#main #control {		
			top:34%;	
		}
		#main #control li {
			width:1.8em;
			height:1.8em;
			border:0.2em solid #333;
		}
	}

#button {
	width:90%;
	margin:5% auto;
	font-family:'Yeon Sung',cursive;
	font-size:0.86rem;
	}
	#button p {
		width:26%;
		padding:3% 0;
		border-radius:2rem;
		text-align:center;
		display:inline-block;
		background-color:#fff;
		box-shadow:3px 3px 5px rgba(0,0,0,0.3);
		margin-right:4%;
	}
	@media only screen and (min-width:768px) and (max-width:1023px) {
		#button {
			font-size:1.8rem;
		}
		#button p {
			border-radius:3em;
		}
	}
	@media only screen and (min-width:1024px) {
		#button {
			font-size:2.4rem;
		}
		#button p {
			border-radius:3em;
		}
	}

#m-card {
	position:absolute;
	top:36%; left:10%;
	z-index:21;
	width:80%;
	padding:3% 5%;
	background-color:#fff;
	border-radius:0.5rem;
	line-height:1;
	}
	#m-card p:nth-of-type(1){
		font:normal 0.8rem 'Yeon Sung';
		margin-bottom:-2.5%;
	}
	#m-card h2 {
		color:#c78435;
		font:normal 1rem 'KPBatang';
	}
	#m-card p:nth-of-type(2) {
		line-height:1;
		font-size:0.5rem;
		margin-top:-2%;
		margin-bottom:3%;
	}
	#m-card p:nth-of-type(2) img {
		width:4%;
	}
	#m-card dl {
		overflow:hidden;
		font-size:0.6rem;
		color:#999;	
		line-height:1.5;
		margin-left:4%;
	}
	#m-card dl>* {
		float:left;
		margin-right:2%;
	}
	#m-card h3 {
		margin-top:3%;
		width:100%;
	}
	#m-card h3 img {
		width:100%;
	}
	#m-card p:nth-of-type(3) {
		font-size:0.5rem;
		text-align:center;
		margin-top:2%;
	}
	#m-card p:nth-of-type(3) span {
		padding:0 3%;
	}
	@media only screen and (min-width:768px) and (max-width:1023px) {
		#m-card p:nth-of-type(1){
			font-size:1.3em;
			margin-bottom:0;
		}
		#m-card h2 {
			font-size:2em;			
		}
		#m-card p:nth-of-type(2) {
			line-height:1.5;
			font-size:1em;
			margin-top:-1.5%;
			margin-bottom:3%;
		}
		#m-card dl {			
			font-size:1em;
			color:#999;	
			line-height:1.5;
			margin-left:4%;
		}
		#m-card p:nth-of-type(3) {
			font-size:1em;
			margin-top:3%;			
		}
	}
	@media only screen and (min-width:1024px) {
		#m-card p:nth-of-type(1){
			font-size:1.7em;
			margin-bottom:0;
		}
		#m-card h2 {
			font-size:2.2em;			
		}
		#m-card p:nth-of-type(2) {
			line-height:1.5;
			font-size:1.3em;
			margin-top:0;
			margin-bottom:3%;
		}
		#m-card dl {			
			font-size:1.5em;
			color:#999;	
			line-height:1.5;
			margin-left:4%;
		}
		#m-card p:nth-of-type(3) {
			font-size:1.5em;
			margin-top:3%;			
		}
	}

#plate {
	width:90%;
	margin:0 auto;	
	position:relative;
	padding-bottom:180%;
}
#plate #tab {
	overflow:hidden;
	font:normal 0.8rem 'Yeon Sung';	
	width:100%;
	position:absolute; z-index:1;
	padding:2% 0;
}
#plate #tab li {
	float:left;
	width:16%;
	padding-bottom:10%;	
	line-height:2;
	background-color:#fff;
	border-radius:0.5rem 0.5rem 0 0;
	margin-right:1.5%;
	text-align:center;
	box-shadow:2px 2px 7px rgba(0,0,0,0.3);
}
#plate section {	
	background-color:#fff;
	border-radius:0 4rem 0 0;
	box-shadow:2px 6px 7px rgba(0,0,0,0.2);
	width:100%;			
	margin:8% auto;
	padding-bottom:5%;
	position:absolute; z-index:2;
	overflow:hidden;	
}
#plate section .row {
	padding-top:15%;
	width:90%;
	margin:0 auto;	
}
#plate section h3 {
	width:40%;
	font:bold 0.84rem 'KPBatang';
	display:inline-block;
}
#plate section h4 {
	width:40%;
	font:bold 0.8rem 'KPBatang';
	display:inline-block;
	color:#e84d3b;
	margin-top:10%;
}
#plate section b {
	display:inline-block;
	width:60%;
	float:right;
	text-align:right;
	font-size:0.7rem;
	color:#777;
	margin-top:1.5%;
}
#plate section b:before {
	content:'■';
	color:#e84d3b;
	display:inline;
}
#plate section p img {
	width:100%;
}
#plate section table {
	width:100%;
	font-size:0.5rem;
	border-collapse:collapse;
	text-align:left;
	line-height:1.8;
}
#plate section p {
	font-size:0.5rem;
	line-height:1.5;
}
#plate section dl {
	width:33%;
	float:left;
	margin-top:8%;
	text-align:center;
	font:bold 0.7rem 'Yeon Sung';
}
#plate section dl dt img {
	width:60%;
}
#plate section dl a {	
	color:#222;
}
#plate section dl dd:first-of-type {
	border-bottom:0.2rem solid #c78435;
	width:40%;
	display:inline-block;
	margin-top:-10%;
	margin-bottom:4%;
}
@media only screen and (max-width:320px) {
	#plate {
		padding-bottom:205%;
	}

}
@media only screen and (min-width:768px) and (max-width:1023px) {
	#plate #tab {
		font-size:1.5em;
	}
	#plate #tab li {		
		border-radius:0.7em 0.7em 0 0;
	}
	#plate section b {
		font-size:1.3em;
		margin-top:2.5%;
	}
	#plate section h3 {
		font-size:1.8em;
	}
	#plate section h4 {
		font-size:1.6em;
	}
	#plate section table {
		font-size:1em;
	}
	#plate section p {
		font-size:1em;
	}
	#plate section dl {
		font-size:1.4em;
	}
	#plate section dl dd:first-of-type {
		border-bottom:0.3em solid #c78435;
	}
}
@media only screen and (min-width:1024px) {
	#plate #tab {
		font-size:2em;
	}
	#plate #tab li {		
		border-radius:0.7em 0.7em 0 0;
	}
	#plate section b {
		font-size:1.6em;
		margin-top:2%;
	}
	#plate section h3 {
		font-size:2.2em;
	}
	#plate section h4 {
		font-size:2em;
	}
	#plate section table {
		font-size:1.5em;
	}
	#plate section p {
		font-size:1.5em;
	}
	#plate section dl {
		font-size:1.8em;
	}
	#plate section dl dd:first-of-type {
		border-bottom:0.3em solid #c78435;
	}
}

footer {
	width:100%;
	padding:2% 0;	
	background-color:#222;
	color:#e0e0e0;
	overflow:hidden;
	font-size:0.6em;
	}
	footer a {
		color:#e0e0e0;		
	}	
	footer .row-0 {
		width:90%;		
		margin:0 auto;
	}
	footer .row-5 {
		overflow:hidden;
	}
	footer .fnb li {
		float:left;
		width:30%;
		text-align:center;
		line-height:3;
		margin:3% 1.5%;
		background-color:#404040;	
	}
	footer .fav ul {
		overflow:hidden;
		margin:3% 0;
	}
	footer .fav li {
		float:left;
		width:40%;
		border:1px solid #e0e0e0;
		text-align:center;
		line-height:2;
		margin:0 5%;
	}
	footer .address>* {
		float:left;		
	}
	footer .address h3 {
		display:inline-block;	
		width:40%;
	}
	footer .address h3 img {
		width:100%;
	}
	footer .address address {
		width:55%;
		margin-left:5%;
		font-style: normal;
		line-height:1.8;
	}	
	@media only screen and (min-width:768px) and (max-width:1023px) {
		footer {			
			font-size:1em;			
		}
	}
	@media only screen and (min-width:1024px) {
		footer {
			font-size:1.4em;
		}
	}

.bottom-fixed {
	width:100%;	
}
.bottom-fixed #undo {
	position:fixed;
	z-index:9;
	left:5%; bottom:0;
}
.bottom-fixed #top {
	position:fixed;
	z-index:9;
	right:5%; bottom:0;
}
.bottom-fixed img {
	width:15%;
}
@media only screen and (min-width:768px) {
	.bottom-fixed img {
		width:10%;
	}
}