﻿body {margin:0; padding:0;font-family: 'Noto Sans KR', sans-serif;font-size:12px; font-weight:300;}
header {height: 25vh; width:100%;background-image: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
  display: flex;justify-content: space-between;flex-direction: row; padding:0; align-items:center;}

.logo {font-size: 2.1rem; color: #666;margin:3rem 1rem 2rem 3rem;}
.logo h1 {color: #2d2d44;margin: 0;padding: 0; font-family:'Fira Sans', sans-serif;font-weight:600;letter-spacing: -1px;font-size: 2.5rem;margin-top: 3rem;}
.logo h3, .content h3 {font-size: 1.5rem;font-weight: 500;flex: 1;color: #595962;padding: 0;margin: 0;}

.products-in {
	display:flex;
}
.content {display:flex; flex-direction:row; justify-content: space-around;align-items: flex-start; padding: 2rem 3rem;}
.content h3 {padding:0; margin:0;font-size: 1.45rem;padding-top: 1rem;}
.content h3 a {text-decoration: none;color: #ca9a4f;padding: 0.5rem;clear: both; background-image: linear-gradient(120deg, #fdfbfb 0%, #ebedee 100%);text-transform: uppercase;font-size: 1.15rem;}
 p{padding-right: 2.5rem;font-size: 1.1rem;flex: 1;line-height: 1.65; color: #2d2d44;}

footer {/*background-image: linear-gradient(-20deg, #2b5876 0%, #4e4376 100%);background-image: linear-gradient(-10deg, #616161 0%, #9bc5c3 100%);
  color:#93b7b5/*#eee;*/background-image: linear-gradient(-10deg, #e1ba6b 0%, #5a504e 100%);
color: #f4f5b4;height:8vh; padding: 0.5rem 2rem 1rem 2rem;
  display:flex; flex-direction:row; justify-content:space-between;align-items:flex-end;}
footer a {color: #fef6b4;/*#ddd*/; margin:0 5px;text-decoration:none; text-transform:uppercase;}
footer a:hover {color:#2d2d44;}

nav {padding: 2rem;padding-left:0; padding-bottom:0;font-size: 0.8rem;background-image: linear-gradient(10deg, #f5f7fa 0%, #c3cfe2 100%);}
nav span{background-image: linear-gradient(180deg, #806B4C 0%, #E6BE6C 30%, #2D2D44 100%);
padding: 0.6rem 2rem 0.6rem 1.5rem;
border-radius: 0 30px 30px 0;}
nav a {text-decoration:none;color: #fff7b4; text-transform:uppercase;padding:0.65rem 1rem;/*text-shadow:1px 1px #bfbfdb;*/
  /*background-image: linear-gradient(90deg, #806B4C 0%, #E6BE6C 30%, #FDE199 100%);*/font-weight: 400;border-radius: 0 30px 30px 0;   }
.products, .prdlist {flex: 1;}
.products {flex:2;}
.products img {width: 49%;}
.prdlist {font-size: 0.85rem;line-height: 2rem;}
.permit {padding: 1rem;text-align: right;color: #666;text-transform: uppercase;font-size: smaller;letter-spacing: 1.5px;}

@media only screen and (max-width: 768px) {
  .products, .prdlist, .content, footer, .products-in {flex-direction:column;}
  .products p , .prdlist p {
	padding-right:0;
}
.products img {
    width: 100%;
}
.logo h1{
	font-size: 1.75rem;margin-top: 1rem;}
	.logo h3{
	font-size:1.1rem;
}
nav {
    padding: 1.2rem 0;font-size: 0.7rem;
}
nav a{
	padding: 0.65rem 0.25rem;
}
nav span{
	padding: 0.7rem;
}
 }