@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%;
	}
	#header ul {
		overflow:hidden;
		width:98%;
		font:normal 0.8rem 'Yeon Sung';
	}
	#header ul>li {
		padding:1% 0;
		margin:2% 0 0 0;
		float:left;
		width:20%;
		margin-right:6.66667%;
		background-color:#fff;
		border-radius:1rem;
		text-align:center;
	}	
	#header ul>li:last-child {
		margin-right:0;
	}
	#header ul li a {
		color:#222;
	}
	@media only screen and (min-width:768px) and (max-width:1023px) {
		#header form input[type=text] {
			padding:3% 0;
			border-radius:2em;
		}
		#header ul {
			font-size:1.5em;
		}
		#header ul>li {
			padding:1.5% 0;
			border-radius:2em;
		}
	}
	@media only screen and (min-width:1024px) {
		#header form input[type=text] {
			padding:3% 0;
			border-radius:2em;
		}
		#header ul {
			font-size:2em;
		}
		#header ul>li {
			padding:1.5% 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;
		}
	}

.plate {
	width:90%;
	margin:0 auto;	
	position:relative;
	margin-top:25%;
	padding-bottom:250%;
	}
	.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:20%;
		padding-bottom:10%;	
		line-height:1.5;
		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 .more {
		width:98%;
		margin:0 auto;
	}	
	.plate section .more img {
		width:100%;
		padding:5% 35%;
	}
	.plate section {	
		background-color:#fff;
		border-radius:0 4rem 0 0;
		box-shadow:2px 0 7px rgba(0,0,0,0.2);
		width:98%;			
		margin:8% auto;
		padding-bottom:5%;
		position:absolute; z-index:3;
		overflow:hidden;		
	}
	section dl {
		width:100%;
		overflow:hidden;
		padding:5%;
		border-bottom:0.01rem solid #e0e0e0;
	}
	section dl a {
		color:#222;
	}
	section dl dt {
		width:30%;
		float:left;
	}
	section dl dt img {
		width:100%;
	} 
	section dl dd {
		margin-left:35%;
		font-size:0.5rem;	
		line-height:1.5;	
		color:#777;
	}
	section dl dd:first-of-type {
		font:bold 0.8rem 'KPBatang';	
		padding-top:5%;
		padding-bottom:1%;
	}
	section dl dd:last-of-type {
		color:#e84d3b;
	}

	.plate #special dl {
		width:100%;
	}
	.plate #special dl>* {
		float:none;
		width:100%;
	}
	.plate #special dt {
		font:normal 0.8rem 'KPBatang';
		background:url(../images/dot.png) no-repeat left;
		padding-left:5%;
	}	
	.plate #special dd {
		font:normal 0.6rem '나눔바른고딕';
		width:100%;	
		margin:0;	
		color:#777;
		line-height:1.5;
	}
	.plate #special dd table {
		width:100%;
		font-size:0.6rem;
		color:#555;
		border-collapse:collapse;	
	}
	.plate #special dd table th,td {
		width:16.66667%;
		text-align:center;
		padding:2% 0;
		border:1px solid #e0e0e0;
		letter-spacing:-1;
	}
	.plate #special dd table th {
		background-color:#f0f0f0;
	}
	
	@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;
			line-height:1.8;
		}	
		.plate section {
			border-radius:0 9rem 0 0;
			box-shadow:2px 0 15px rgba(0,0,0,0.2);
		}
		section dl dd:first-of-type {
			font-size:1.5em;
		}	
		section dl dd {
			font-size:1em;
			line-height:1.8;
		}
		.plate #special dt {
			padding-left:2%;
			font-size:1.5em;
		}
		.plate #special dd {
			font-size:1em;
		}
		.plate #special dd table {
			font-size:1em;			
		}
		.plate #special dd table th,td {
			letter-spacing:1;
		}
	}
	@media only screen and (min-width:1024px) {
		.plate #tab {
			font-size:2em;
		}
		.plate #tab li {		
			border-radius:0.7em 0.7em 0 0;
			line-height:1.8;
		}	
		.plate section {
			border-radius:0 11rem 0 0;
			box-shadow:2px 0 15px rgba(0,0,0,0.2);
		}
		section dl dd:first-of-type {
			font-size:2em;
		}	
		section dl dd {
			font-size:1.4em;
			line-height:1.8;
		}	
		.plate #special dt {
			padding-left:3%;
			font-size:2em;
		}
		.plate #special dd {
			font-size:1.5em;
		}
		.plate #special dd table {
			font-size:1em;			
		}
		.plate #special dd table th,td {
			letter-spacing:1;
		}
	}

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%;
		}
	}