/***************************************

reset no.1

@license moida

****************************************/



/***************************************
 폰트설정
****************************************/
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900&display=swap&subset=korean');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@200;300;400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css?family=Nanum+Myeongjo:400,700,800&display=swap');
@import url('https://fonts.googleapis.com/css?family=Lato:100,300,400,700,900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Playfair+Display:400,400i,700,700i,900,900i&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Pinyon+Script&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;400;500;600;700&display=swap');
@font-face {
    font-family: 'Cafe24Dangdanghae';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.2/Cafe24Dangdanghae.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/***************************************
 기본설정
****************************************/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video
 {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;   
    vertical-align:baseline;
    background:transparent;
}
html, body {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 17px;
    color: #333;
    letter-spacing: 0px;
    font-weight: 300;
    line-height: 28px;
    word-break: keep-all;
}

@media (max-width: 480px) { 
html, body {
    font-size: 16px;
    letter-spacing: -0.3px;
    line-height: 24px;
	}
}


article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
    display:block;
}
nav ul {
    list-style:none;
}
blockquote, q {
    quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}
a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
    text-decoration:none;
    transition: all 0.1s;
    color: inherit;
    outline: 0;
    outline: none; select-dummy: expression(this.hideFocus=true);
}


a:hover, a:link, a:active, a:visited {
    color: inherit;
    text-decoration:none; 
    outline: none; select-dummy: expression(this.hideFocus=true);
}

ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none; 
}

li {
    list-style-type: none;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}

img {
    vertical-align:top;
}


button {
    border: 0; 
    outline: 0;
    padding: 0;
    background-color: transparent;
    
}

.row {
    margin-right: 0;
    margin-left: 0;
}

.container {
    margin: 0;
    padding-right: 0;
    padding-left: 0;
    margin: 0 auto;
}
@media (max-width: 1200px) {
    .container { margin: auto 20px;}
}  
.container-fluid {
    padding-right: 0;
    padding-left: 0;
}
.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    padding-right: 0;
    padding-left: 0;
}


/* 공동사항 */

.fp-tableCell {
    vertical-align: top;
}

.img_100 {
    width: 100%;
}

* {
    box-sizing: border-box;
}

.container {
    max-width: 1200px;
    padding: 100px 0;
}

.row:after {
    content: "";
    display: table;
    clear: both;
    width: 100%;
}

.col1 {
    float: left;
    width: 100%;
}

.col2 {
    float: left;
    width: 50%;
}

.col3 {
    float: left;
    width: 33.33%;
}

.col4 {
    float: left;
    width: 25%;
}

.col5 {
    float: left;
    width: 20%;
}

.col6 {
    float: left;
    width: 16.66%;
}

@media (max-width: 900px) {
    .container {
        padding: 80px 0;
    }

    .col1,
    .col2,
    .col3,
    .col4,
    .col5,
    .col6 {
        width: 100%;
    }
}

.en1 {
    font-family: 'Playfair Display', serif;
}

.en2 {
    font-family: 'Pinyon Script', cursive;
    text-transform: lowercase;
    /*lowercase 소문자*/
}

.en3 {
    font-family: Roboto, sans-serif;
    text-transform: uppercase;
    /*lowercase 소문자*/
}

.ko1 {
    font-family: 'Noto Serif KR', serif;
}

@media (max-width: 740px) {
    .br_m {
        display: block;
    }
}




/***************************************
팝업레이어
****************************************/
#hd_pop {z-index:2000000;position:relative;margin:0 auto;height:0}
#hd_pop h2 {position:absolute; font-size:0;line-height:0;overflow:hidden}
.popup_list {position:absolute; background:#fff;}
.hd_pops_all {position:relative;  display: inline-block;  float: left; }
.hd_pops_list {}
.hd_pops {position:relative;border:1px solid #e9e9e9;background:#fff; display: inline-block;  float: left;}
.hd_pops img{max-width:100%}
.hd_pops_con {}
.hd_pops_footer {padding: 0;background:#000;color:#fff;text-align:left;position:relative;}
.hd_pops_footer:after {display:block;visibility:hidden;clear:both;content:""}
.hd_pops_footer button {padding: 10px;border:0;color:#fff; font-size:12px;}
.hd_pops_footer .hd_pops_reject{background:#000;text-align:left; font-size:12px;}
.hd_pops_footer .hd_pops_close{background:#393939;position:absolute;top:0;right:0}



/***************************************
gnb 
****************************************/
.nav_menu.nav_fix {
	background: #2b2b2b;
}
.nav_fix .header_wrap .logo {
	top: 20px;
    width: 130px;
}
.nav_fix .header {
	height: 80px;
}
.nav_fix .gnb_menu {
	padding-top: 20px;
}
.nav_fix .gnb_menu .menu_b {
	padding: 0 45px 30px 45px;  /*pc메뉴서브가로*/
}
.nav_fix .gnb_menu .sub_menu {
	top: 70px;
}
.nav_fix .gnb_menu li:hover .sub_menu{
	top: 60px;
}

/***************************************
header 
****************************************/
.nav_menu {
	-webkit-transition: all 300ms ease-in;
    transition: all 300ms ease-in;
    position: fixed; top: 0;
    width: 100%;
	z-index:99999;
	transition: background 0.3s;
	<!-- background: #2b2b2b; -->
}

.header_wrap {
	position: relative;
	width: 100%;
	font-size: 0;
	z-index: 999999;
}
.header_wrap .logo {
	position: absolute;
	left: 40px; top:40px; 
	margin: auto;
	display: inline-block;
	width: 198px; height: 52px;
	z-index: 999999;
}
.header_wrap .logo a {
	display: inline-block;
	width: 100%; height: 100%;
	vertical-align:middle;
}
.header_wrap .logo img {
	position: absolute;
	top: 0; left: 0;
}
.header_wrap .logo img#pc_logo {
	max-width: 100%; 
    margin-left: -10px;
	transition: max-width 0.3s;
}
.header_wrap .logo #mobile_logo {
	display:none;
}

.nav_open {
	display: none;
}

.header {
	position:relative;
	width:100%; height: 140px;
	transition: height 0.3s;
}

.gnb_menu {
	display: block;
	height: 35px;
	padding-top: 50px;
	margin: auto;
	text-align: right;
	transition: padding-top 0.3s;
}
.gnb_menu li {
	position: relative;
	display: inline-block;
	text-align: center;
	vertical-align: top;
	transition: margin 0.5s;
   
}

.gnb_menu .menu_b.menu_reser img {vertical-align: text-bottom; margin-right: 8px;}
.gnb_menu .menu_b.menu_reser {
    font-size: 16px;
}
.gnb_menu .menu_b {
	position: relative;
	display: block;
	padding: 0 45px 30px 45px;  /*pc메뉴서브가로*/
	font-size: 16px;
    font-weight: 400;
    line-height: 35px;
	color: #fff;
	text-shadow: 0 1px 2px rgba(0,0,0,0.3);
	text-transform: uppercase;
	transition: color 0.3s;
}
.gnb_menu .sub_menu {
	position: absolute;
	display: block;
	top: 64px; right: 0; left: 0;
	margin: auto;
	padding: 20px 0 12px;
	background: #2b2b2b;
	visibility: hidden; opacity: 0;
	text-transform: uppercase;
	transition: top 0.3s linear, opacity 0.2s, visibility 0.2s;
}
.gnb_menu li:hover .sub_menu{
	top: 64px;
	visibility:visible; opacity:1;
	transition: opacity 0.2s, visibility 0.2s;
}
/* pc서브메뉴 위에 흰색라인
.gnb_menu .sub_menu::before {
	content: '';
	position: absolute;
	top: 0; right: 0; left: 0;
	margin: auto;
	width: 100%; height: 12px;
	background: #fff;
}
*/
.gnb_menu li .sub_menu dt {
	display: inline-block;
	width: 100%;
	text-align: center;
}
/*pc서브메뉴*/
.gnb_menu li .sub_menu dt a { 
	display: block;
	margin-bottom: 8px;
	font-size: 14px;
	font-weight :300;
	line-height: 20px;
	color: #f5f3ee;
	transition: color 0.3s;
}
.gnb_menu li .sub_menu dt a:hover {
	color: #fff;
}
.gnb_menu li .sub_menu dt a span {
	position: relative;
	display: inline-block;
}
.gnb_menu li .sub_menu dt a span::after {
	content: '';
	position: absolute;
	right: 0; bottom: 0; left: 0;
	margin: auto;
	width: 0; height: 1px;
	background: #f5f3ee;
	transition: width 0.3s;
}
.gnb_menu li .sub_menu dt a:hover span::after {
	width: 100%;
}

.gnb_menu li.none {
	width: 170px;
	height: 0px;
}
.gnb_menu li.noneLogo:hover, 
.gnb_menu li.none:hover {
	background: transparent;
}


.gnb_mobile_inner {
	display: none;
}


@media screen and (max-width: 1540px) { 
	.gnb_menu .menu_b {
		padding: 0 20px;
	}
	.nav_fix .gnb_menu .menu_b {
		padding: 0 20px 35px 20px;
	}
	.gnb_menu li.none {
		width: 26px;
	}

}

@media screen and (max-width: 1240px) { 
	.header_wrap .logo { 
		left: 60px;
        top: 60px;
	}
	.header_wrap .logo img#pc_logo {
    max-width: 80%; 
	}
	li.pc_r { display: none;}
}

@media screen and (max-width: 1024px) {
	.nav_menu.mobile_bg {
		background: #eee;
	}
	.nav_menu.nav_fix {
		background: #2b2b2b;
	}
	.nav_fix .header {
		height: 60px;
	}
	.nav_fix .gnb_menu {
		display: none;
	}

	.header_wrap .logo, .nav_fix .header_wrap .logo {
		position: relative;
		display:table;
		top: 1px; right: inherit; bottom: 0; left: 10px;
	    margin: inherit; 
		width: 70px; height: 100%; 
	}
	.nav_fix .header_wrap .logo, .nav_fix .header_wrap .logo {
		width: 40px;
		transition: width 0.3s; 
	}
	.header_wrap .logo a {
		display: table-cell; 
		height: 100%;
	}
	.header_wrap .logo img#pc_logo {
		display: none;
	}
	.header_wrap .logo #mobile_logo {
		display: block;
		position: relative;
		top: auto; left: auto;
        width: 150px;
		height: 40px;
		background-image: url(../img/etc/logo.png);
		background-repeat: no-repeat;
		background-size: 100%;
		transition: height 0.3s, background-image 0.3s;
	}
	.nav_fix .header_wrap .logo #mobile_logo {
        width: 150px;
		background-image: url(./img/etc/logo.png));
		background-size: 100% 100%;
	}

	.header, .header:hover {
		height: 60px;
		background: transparent;
	}
	.nav_fix .header, .nav_fix .header:hover {
		height: 60px;
	}


	#nav_open {
		position:absolute;
		display:block;
		top:0; right:0;
		width:60px; height:60px;
		text-align:center;
		transition: height 0.3s;
	}
	.nav_fix #nav_open {
		height: 60px;
	}
	#nav_open .menu_mobile_icon {
		position:absolute;
		top:0; right:0; bottom:0; left:0;
		margin:auto;
		width:22px; height:22px;
	}
	#nav_open .line {
		width:22px; height:2px;
		background: #fff;
		display:block;
		margin:4px auto;
		box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
		-webkit-transition: all 0.3s ease-in-out;
			 -o-transition: all 0.3s ease-in-out;
				transition: all 0.3s ease-in-out;
	}
	.nav_fix #nav_open .line {
		background: #fff;
	}
	#nav_open.is-active .line:nth-child(1) {
		-webkit-transform: translateY(6px) rotate(45deg);
			-ms-transform: translateY(6px) rotate(45deg);
			 -o-transform: translateY(6px) rotate(45deg);
				transform: translateY(6px) rotate(45deg);
	}
	#nav_open.is-active .line:nth-child(2) {
		opacity: 0;
	}
	#nav_open.is-active .line:nth-child(3) {
		-webkit-transform: translateY(-6px) rotate(-45deg);
			-ms-transform: translateY(-6px) rotate(-45deg);
			 -o-transform: translateY(-6px) rotate(-45deg);
				transform: translateY(-6px) rotate(-45deg);
	}

	.gnb_menu {
		display:none;
	}

	.gnb_mobile_inner {
		display: block;
		position: fixed;
		top: 60px; right: 0;
		width: 100%;
		height: 100%;
		overflow:hidden;
		-webkit-transform: translateX(100%);
		   -moz-transform: translateX(100%);
			-ms-transform: translateX(100%);
			 -o-transform: translateX(100%);
				transform: translateX(100%);

		-webkit-transition: all 0.3s;
		   -moz-transition: all 0.3s;
			 -ms-transform: all 0.3s;
			  -o-transform: all 0.3s;
				transition: all 0.3s;
	}
	.nav_fix .gnb_mobile_inner {
		top: 50px;
	}
	.gnb_mobile_inner.OPEN {
		-webkit-transform: translateX(0);
		   -moz-transform: translateX(0);
			-ms-transform: translateX(0);
			 -o-transform: translateX(0);
				transform: translateX(0);
	}

	
	.mobile_sub_menu {
		position: relative;
		display: inline-block;
		width: 100%;
		height: 100%;
		margin-top: -1px;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		background: #2b2b2b;
		padding: 20px 25px 150px 15px;
		vertical-align: top;      
	}
	.mobile_sub_menu > li {
		position:relative;
		display: block;
		text-align: left;
		width: 100%;
	}
	.mobile_sub_menu > li > a {		
		position: relative;
		display: inline-block;
		color: #fff;
		width: 100%; height: 55px;
		line-height: 55px;
		font-family: 'Roboto';
		font-size: 16px;
		text-indent:20px;
		text-transform: uppercase;
		font-weight :500;
        border-bottom: 1px solid #3d3d3d;
		text-align: center;
	}

	.mobile_sub_menu > li > ul {
		position: relative;
		display:none;
		width: 100%;
		height: auto;
		padding: 20px 0;
		
	}

	.mobile_sub_menu > li > ul li {	 
		display: inline-block;
		width: 100%; height: 30px;
		vertical-align: top;text-indent:8px;
	}
	.mobile_sub_menu > li > ul li a {
		display:inline-block;
		color: #f5f3ee;
		width: 100%;
		font-size: 15px;
		padding: 0 ;
		line-height: 30px;
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
		transition: color 0.2s;
		text-transform: capitalize;
		transform: color 0.3s;
		text-align: center;
	}
	.mobile_sub_menu > li > ul li a:hover {
		color: #fff;
        text-decoration: underline;
	}

    
	/* 메뉴오픈시 상단바 */
	.nav_menu.mobile_bg {
		background: #2b2b2b;
	}
	.nav_menu.mobile_bg .header_wrap .logo #mobile_logo {
		background-image: url(../img/etc/logo.png);
	}
	.nav_menu.mobile_bg #nav_open .line {
		background: #fff;
	}
}


