@charset "utf-8";

.container { width: 100%; max-width: 1280px; margin: 0px auto; }
.pc_only { display:block; }
.mo_only { display:none; }

#header { position: fixed; left: 0px; right: 0px; top: 0px; background-color: rgba(0, 0, 0, 0.8); padding: 20px 0px; height: 80px; z-index: 100; }
#header .container { position:relative; }
#header .logo { position:absolute; left:10px; top: 0px; }
#header .logo img { width: auto; height:40px; }
#header .nav {  }
#header .nav > ul { font-size:0px; text-align:center; }
#header .nav > ul >li { position: relative; display: inline-block; margin-right: 70px; }
#header .nav > ul > li:last-child { margin-right: 0px; }
#header .nav > ul > li > a { display: block; font-family: 'Barlow', sans-serif; font-size: 20px; font-weight:700; color:#ffffff; line-height:40px; height:40px; }
#header .sub { display: none; position:absolute; left: 0px; top: 40px; background-color:#ffffff; z-index:10; }
#header .sub > li  { width:125px; text-align:left; }
#header .sub > li > a { display: block; font-family: 'NanumSquare', sans-serif; font-size: 14px; color:#000;  padding: 5px 10px; line-height: 46px;}
#header .sub > li > a:hover { background-color: #468cc1; color:#ffffff; }
#header .webzin_name { position:absolute; right:10px; top: 0px; }
#header .webzin_name span { font-family: 'Noto Sans KR', sans-serif; font-size: 20px; font-weight: 900; color:#ffffff; line-height:40px; }

#footer { background-color:#6ebcb4; padding: 40px 0px; }
#footer .container:after { display:block; content:''; clear:both; }
#footer .quick_link { margin-bottom:30px; }
#footer .quick_link ul { text-align:center; }
#footer .quick_link li { display:inline-block; margin-right:50px; }
#footer .quick_link li a { position: relative; display: block; background-repeat: no-repeat; background-position: left center; font-size:12px; color:#fff; padding-left:20px; }
#footer .quick_link li:nth-child(1) a { background-image:url('../image/common/footer_quick_icon_1.png'); }
#footer .quick_link li:nth-child(2) a { background-image:url('../image/common/footer_quick_icon_2.png'); }
#footer .quick_link li:nth-child(3) a { background-image:url('../image/common/footer_quick_icon_4.png'); }
#footer .quick_link li:nth-child(4) a { background-image:url('../image/common/footer_quick_icon_3.png'); }
#footer .copyright { float:left; width:80%; }
#footer .copyright .logo { margin-bottom:15px; }
#footer .copyright .webzine_name { margin-bottom:10px; }
#footer .copyright .webzine_name span { font-family: 'Montserrat', sans-serif; font-size:24px; font-weight:700; color:#ffffff; }
#footer .copyright .info { font-size:14px; line-height:30px; color:#ffffff; letter-spacing:-0.5px; }
#footer .copyright .info span { }
#footer .policy { float:left; width:30%; }
#footer .policy li { margin-bottom: 10px; }
#footer .policy li:last-child { margin-bottom: 0px; }
#footer .policy li a { font-size:20px;color:#fff; }
#footer .sns_list { float:left; width:10%; }
#footer .sns_list ul:after { display:block; content:''; clear:both; }
#footer .sns_list li { float:left; margin-right: 25px;}
#footer .sns_list li:last-child { margin-right:0px; }

@media all and (max-width: 1280px) {
	.container { padding-left: 15px; padding-right: 15px; }
	#header .webzin_name { display:none; }
	
	#footer .quick_link li { margin-right:30px; }
}
@media all and (max-width: 1024px) {
	#footer .quick_link li { margin-right:20px; }

}
@media all and (max-width: 768px) { 
	.pc_only { display:none; }
	.mo_only { display:block; }
	#header .nav { display:none; }
	#header .nav.onmenu { position: relative; top: 60px; display:block; background-color: rgba(0, 0, 0, 0.8); margin: 0px -15px; z-index: 100;}
	#header .nav.onmenu li { float: initial; width: 100%; }
	#header .nav.onmenu li .sub { position: initial; }
	#header .nav.onmenu li .sub > li > a { text-align:center; }
	.navTog { position: absolute; display: block; right: 10px; top: 11px; z-index: 10; }
	.navTog.active span:nth-of-type(2){background:#000}
  	.navTog.active span:nth-of-type(1){transform: translateY(8px)rotate( 45deg );transition: all ease 1s;}
  	.navTog.active span:nth-of-type(3){transform: translateY(-8px) rotate( -45deg );transition: all ease 1s;}
	.navTog span{    width: 30px;height: 3px;background: #fff;display: block; margin-bottom: 5px}

	#footer .quick_link li { margin-right:10px; }
	#footer .copyright { float:initial; width:100%; margin-bottom: 15px; }
	#footer .policy { float:initial; width:100%; margin-bottom:15px; }
	#footer .policy ul:after { display:block; content:''; clear:both; }
	#footer .policy li { float:left; margin-right: 15px; }
	#footer .policy li:last-child { margin-right:0px; }
	#footer .policy li a { font-size: 16px; }
	#footer .sns_list { float:initial; width:100%; }
}
@media all and (max-width: 460px) { 

}