@charset "utf-8";

#wrap {	position:relative; width:100%; min-width:320px;height:100%; font-size:16px; }
#headerwrap { position:relative; width:100%; height:140px; z-index:999999; }
.container {	width:100%;	position:relative; 	margin:0 auto;	}
.inner {	width:1600px;	position:relative;	margin-left:auto;	margin-right:auto;}
.s-inner {	width:1600px;	position:relative;	margin-left:auto;	margin-right:auto;}
.m-inner {	width:1600px;	position:relative;	margin-left:auto;	margin-right:auto;}
.int-inner {	width:1360px;	position:relative;	margin-left:auto;	margin-right:auto;}


/* 타블렛 가로 */
@media all and (max-width:1599px) {
    .m-inner{width: 100%;}
    .inner {width:94%;}
    .s-inner {width:94%;}
    .int-inner{width: 94%;}
}
@media all and (max-width:1359px){
    .int-innter{width: 96%;}
}

/* 폰트사이즈 반응형 */
@media all and (max-width:976px) {
	#wrap { font-size: 15px; }
}

/* 타블렛 가로 미만 ~ 모바일 */
@media all and (max-width:767px) {
	#wrap { font-size: 14px; }
}

@media screen and (max-width:640px) {
	#wrap { font-size: 0.75rem; }
}


/*header*/
#hd_wrap{position:fixed;  width: 100%;  height:90px; line-height:90px;z-index:100; background:transparent; transition: .2s ease-in-out; }

#hd_wrap .sns{position: absolute; left: 205px; top: 50%; transform: translateY(-50%); z-index: 9; height: auto; line-height: 16px;}
#hd_wrap .sns a:first-child{margin-right: 15px;}

#hd_wrap .hd_logo {position:absolute; top:0; left: 40px; z-index:9; background:url(/images/common/logo.png) no-repeat center center; width: 140px; height: 100%; background-size: 140px auto;}
#hd_wrap .hd_logo a { display: block; width: 100%; height: 100%; }
#hd_wrap .haccp { position: absolute; right: 40px; top: 50%; transform:translateY(-50%); z-index: 2; }
#hd_wrap .haccp img,
#hd_wrap .haccp dl { display: inline-block; vertical-align: middle; }
#hd_wrap .haccp img { width: 45px; }
#hd_wrap .haccp dl { margin-left: 0.4em; font-family: 'Elice Digital Baeum'; color:#212121; line-height: 1.2em; letter-spacing: -0.02em; }
#hd_wrap .haccp dl dt { font-size: 0.93em; font-weight: 600; }
#hd_wrap .haccp dl dd { font-size: 0.875em; }
#hd_wrap.menu_on .hd_logo a{background: url(/images/common/logo_w.png) no-repeat center center;}
#hd_wrap.on .hd_logo a{background: url(/images/common/logo_w.png) no-repeat center center;}
#hd_wrap .hd_mbx {display:none;}

#hd_wrap.menu_on dl,
#hd_wrap.on dl { color:#fff; }

#gnb_pc {position:relative; overflow:hidden; width:100%; background-color: #fff; box-sizing:border-box; text-align:center;  transition: .2s ease-in-out;}

#gnb_pc .gnb_dp1{display:inline-block; vertical-align:top; text-align:center; letter-spacing:-0.08em;}
#gnb_pc .gnb_dp1>div {width:125px; height:90px; line-height:90px; font-size:1.125em; box-sizing:border-box; cursor:pointer; font-weight: 400; }
#gnb_pc .gnb_dp1>div>span a{display:inline-block; position:relative; font-weight: 500;}
.menu_on #gnb_pc .gnb_dp1>div>span a{color: #fff;}
/*.scroll #gnb_pc .gnb_dp1>div>span a{color: #212121;}*/
#gnb_pc .gnb_dp1 .smenu { display:none; padding:30px 0; }
#gnb_pc .gnb_dp1 .smenu li{ line-height: 1.0em; margin-bottom: 20px; }
#gnb_pc .gnb_dp1 .smenu li a {font-size:0.9375em; font-weight:500; color:#fff; }
#gnb_pc .gnb_dp1 .smenu li:hover a {border-bottom: 1px solid #fff; color:#FFF;}

#gnb_pc li.gnb_dp1:hover span a{color:#fdb813 !important;}
#hd_wrap.menu_on #gnb_pc {  background:#112528;}
#hd_wrap.menu_on #gnb_pc:before{content:""; width:100%; height:90px; background:#112528; position:absolute; top:0; left:0; border-bottom: 1px solid rgba(255,255,255,0.1); }
#gnb_pc li.gnb_dp1 .smenu{ height: 300px;}
#gnb_pc li.gnb_dp1:hover .smenu{background-color: #f16521;}

#hd_wrap #gnb_pc:before{content: '';  transition: .2s ease-in-out;}


#menuToggle {display: none; position:absolute; left:3%; top:36px; width:30px; height:22px; cursor:pointer; z-index:101; z-index:30}
#menuToggle span {display:block; position:absolute; left:0; height:2px; background:#232323; transition:0.5s all; -webkit-transition:0.5s all;}
#menuToggle span.t {top:0; width:75%}
#menuToggle span.m {top:50%; margin-top:-1px; width:100%}
#menuToggle span.b {bottom:0; width:50%;}

#Mnav {width:800px; height:100%; position:fixed; top:0; left:-800px; background:#122224; z-index:15; box-sizing:border-box; padding:120px 60px 0; transition:all 0.5s}
#Mnav .n_logo {border-bottom:2px solid #f16521; padding-bottom:15px;}
#Mnav > ul > li {box-sizing:border-box; border-bottom:1px solid rgba(255,255,255,0.3); padding:25px 15px;}
#Mnav > ul > li > div span  a {font-size:1.5em; font-weight:500; color:#fff;}
#Mnav > ul > li > ul {overflow:hidden; margin-top:10px;}
#Mnav > ul > li > ul > li {width:33.33%; float:left; margin:3px 0;}
#Mnav > ul > li > ul > li > a {font-size:1.375em; color:rgba(255,255,255,0.6);}
#Mnav > ul > li > ul > li > a:hover {color:#f16521}

#hd_wrap.menu #Mnav {left:0;}
#hd_wrap.menu .lang {color:#000 !important;}
#hd_wrap.menu #menuToggle span {background:#fff;}
#hd_wrap.menu #menuToggle span.t {width:100%; transform:translateY(10px) rotate(45deg);}
#hd_wrap.menu #menuToggle span.m {width:0;}
#hd_wrap.menu #menuToggle span.b {width:100%; transform:translateY(-10px) rotate(-45deg)}

@media all and (max-width:1599px) {
    #hd_wrap .hd_logo{left: 3%;}
	#hd_wrap .sns{left: 15%;}
    #hd_wrap .haccp{right: 3%;}

}
@media all and (max-width:1199px){
    #gnb_pc .gnb_dp1>div{width: 100px;}
	#hd_wrap .sns{display: none;}
}
@media all and (max-width:999px){
    #menuToggle{display: block;}
    #hd_wrap{background-color: #fff; line-height: 2em; height: 70px;}
    #hd_wrap .hd_logo {background-size: 110px; width: 110px; height: 56px; left: 52%; transform: translateX(-50%);}
    #menuToggle{top: 26px}
    #gnb_pc .gnb_dp1_wrap{display: none;}
	#Mnav .sns{display: block; position: static; transform: translateY(0); margin-top: 25px; margin-left: 15px;}
    #hd_wrap .haccp img { width: 40px; }

}

@media screen and (max-width:800px){

	#Mnav {width:100%; left:-100%; padding:60px 6%;}
	#Mnav > ul > li {padding:5% 3%}

  #hd_wrap .haccp { font-size: 0.9em; }
  #hd_wrap .haccp img { width: 34px; }

}

@media screen and (max-width:568px){
  #hd_wrap .haccp dl { display: none; }
	#Mnav > ul > li > ul > li > a{font-size: 1.25em;}
}

/* footer */
#footer {justify-content: flex-start;  width:100%;	clear:both;	position:relative;	margin:0 auto;	background:#122224;	height: 250px;  padding: 40px 0; }
#footer .inner{display: flex;}
#footer .f_logo{width: 145px; height: 68px; background: url(/images/common/f_logo.png) no-repeat center center; margin-right: 60px;}
#footer .info{margin-top: 20px;}
#footer .info span{display: inline-block; word-break: keep-all;  color: #fff; font-size: 15px; line-height: 1.7em; font-weight: 500; opacity: 0.6; margin-right: 10px;}
#footer .info span.copy{display: block; font-size: 12px; opacity: 0.4; margin-top: 30px;}

@media all and (max-width:999px){
    #footer{height: auto;}
    #footer .inner{flex-direction: column; align-items: center;}
    #footer .f_logo{margin-right: 0; background-size: 100px; width: 100px; height: 48px;}
    #footer .info{text-align: center;}
    #footer .info span{margin-right: 0; margin: 0 5px;}
    #footer .info br{display: none;}
}
@media all and (max-width:599px){
    #footer{padding: 6vh 3%;}
    #footer .info span{font-size: 13px;}
    #footer .info span.copy{margin-top: 10px;}
}