@charset "utf-8";
/* 프로그램리스트 모바일 버전 */
.all_m_btn {padding:10px; background:#323337;}
.all_m_btn img {position:absolute; top:28%; left:15px; width:10%; max-width:40px; cursor:pointer;}
.all_m_btn .mutit {text-align:center; font-weight:900; font-size:26px; color:#fff;}
.pro_m_wrap {display:none; font-family:'Nanum Gothic', sans-serif; transition:all 0.3s linear;}
.pro_m_wrap .m_menu {width:200px;}
.pro_m_wrap .bg_black {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.7); z-index:-1;}


/* 모바일 메뉴 */
.pro_m_wrap .subleftmenu {
	list-style:none;
	margin:0;
	padding:0;
}
.pro_m_wrap .subleftmenu li {
	border-bottom:1px solid #515155;
	background:#323337;
}
.pro_m_wrap .subleftmenu a {
	display:block;
	color:#b5b2b2;
	font-size:14px;
	padding:11px 5px 11px 15px;
	font-family:'Noto Sans KR';
}
.sub_title_m{
	font-size:28px !important;
	font-weight:bold;
	color:#fff !important;
	padding:12px 5px 12px 15px !important;
}
.pro_m_wrap .subleftmenu a:hover {
	background:#307dd4;
	color:#fff;
}
.sub_title_m:hover {
	background:#323337 !important;
	cursor:default;
}

@media all and (max-width:999px){
	.pro_m_wrap {display:block; position:absolute; left:-100%; top:0; z-index:999;}
	.pro_m_wrap.view {left:0;}
	.br1000none{display:none;}
}
html.on , body.on{overflow:hidden;}
.inner{width:100%; max-width:1200px; margin:0 auto;}
.delay300{animation-delay: .3s;}
.delay500{animation-delay: .5s;}
.delay700{animation-delay: .7s;}
.delay900{animation-delay: .9s;}
.delay1100{animation-delay: 1.1s;}
.delay1300{animation-delay: 1.3s;}
.delay1500{animation-delay: 1.5s;}
.delay1700{animation-delay: 1.7s;}
.delay1900{animation-delay: 1.9s;}
/* header */
.header{width:100%; height:120px; position:absolute; z-index:100; left:0; top:0; border-bottom:1px solid rgba(255,255,255,0.2)}
.header .logo{position:absolute; top:50%; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -moz-transform:translateY(-50%); }
.header .logo img{max-width:100%}
.header ul.menu{float:right; margin:0; margin-top:30px;}
.header ul.menu:after{clear:both; content:""; display:block; height:0; visibility:hidden}
.header ul.menu li{float:left;}
.header ul.menu li a{display:block; font-size:16px; color:#fff; font-weight:bold; padding:20px 30px;}

/* 모바일 메뉴 */
.m_menu{display:block; opacity:0; width:100%; height:0; background:rgba(15,16,16); z-index:-1; position:fixed; left:0; top:0; transition:all 1s;}
.m_menu.on{opacity:1; z-index:99; transition:all 1s; height:100%; min-height:100vh;}
.m_menu ul{position:absolute; width:100%; left:50%; top:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%)}
.m_menu ul li a{display:block; font-size:36px; padding:10px 0; text-align:center; color:#fff; font-weight:bold;}
/* header ham_btn 버튼 */
.ham_btn{display:none; width:30px; height:21px; position:absolute; right:20px; top:50%; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -moz-transform:translateY(-50%)}
.ham_btn .line{width: 30px; height: 3px; background-color: #fff; display: block; -webkit-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out; }
.ham_btn .line:nth-of-type(1){margin-bottom:6px}
.ham_btn .line:nth-of-type(2){margin-bottom:6px;}
.ham_btn:hover{cursor: pointer;}
.ham_btn.is-active .line:nth-child(2){opacity: 0;}
.is-active .line:nth-child(1){-webkit-transform: translateY(10px) rotate(45deg);-ms-transform: translateY(10px) rotate(45deg); -o-transform: translateY(10px) rotate(45deg); transform: translateY(10px) rotate(45deg);}
.ham_btn.is-active .line:nth-child(3){ -webkit-transform: translateY(-8px) rotate(-45deg); -ms-transform: translateY(-8px) rotate(-45deg); -o-transform: translateY(-8px) rotate(-45deg); transform: translateY(-8px) rotate(-45deg);}

/* sub */
.sub_html{background:#181818;}
.sub{background:#181818;}
.sub .header{background:#181818; position:relative; box-sizing:border-box; border-bottom:1px solid rgba(255,255,255,0.2)}
.sub_tit{padding-top:90px; padding-bottom:75px; text-align:center;}
.sub_tit h2{font-size:40px; letter-spacing:-0.025em; font-weight:bold; color:rgba(255,255,255,0.1)}

@media all and (max-width:1000px){
	.header ul.menu{display:none;}
	.ham_btn{display:block;}
}

@media all and (max-width:640px){
	
	/* header */
	.header{height:18.75vw;}
	.header .logo{width:26.875vw; height:7.65625vw}

	/* 모바일 메뉴 */
	.m_menu ul li a{font-size:5.625vw; padding:1.5625vw 0;}
	/* header ham_btn 버튼 */
	.ham_btn{width:4.6875vw; height:3.28125vw; }
	.ham_btn .line{width: 4.6875vw; height: 0.46875vw;}
	.ham_btn .line:nth-of-type(1){margin-bottom:0.9375vw}
	.ham_btn .line:nth-of-type(2){margin-bottom:0.9375vw;}
	.is-active .line:nth-child(1){-webkit-transform: translateY(1.5625vw) rotate(45deg);-ms-transform: translateY(1.5625vw) rotate(45deg); -o-transform: translateY(1.5625vw) rotate(45deg); transform: translateY(1.5625vw) rotate(45deg);}
	.ham_btn.is-active .line:nth-child(3){ -webkit-transform: translateY(-1.25vw) rotate(-45deg); -ms-transform: translateY(-1.25vw) rotate(-45deg); -o-transform: translateY(-1.25vw) rotate(-45deg); transform: translateY(-1.25vw) rotate(-45deg);}

	/* sub */
	.sub_tit{padding-top:14.0625vw; padding-bottom:11.71875vw; }
	.sub_tit h2{font-size:6.25vw}
}