@charset "utf-8";
/* 기본프로그램 사용자모듈 메뉴 - PC */
.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;}


/* 기본프로그램 사용자모듈 메뉴 - MOBILE */
.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;}
}





/* ==========================================================================
	공통
========================================================================== */
#wrap{overflow:hidden;}
.inner{width:100%; max-width:1400px; margin:0 auto;}

@media all and (max-width:1400px){
	.inner{width:93.75%;}
}

.poppins{font-family:'Poppins', sans-serif;}
.lora{font-family:'Lora', serif;}
.nanummyeongjo{font-family:'Nanum Myeongjo', serif;}


/* ==========================================================================
	header
========================================================================== */
#header{position:relative; text-align:center; box-shadow:0 0 10px rgba(0, 0, 0, 0.1);}
#header *{transition:all 0.3s; -webkit-transition:all 0.3s; -o-transition:all 0.3s; -ms-transition:all 0.3s; -moz-transition:all 0.3s;}
#header .logo{position:absolute; top:50%; left:100px; margin:0; transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -ms-transform:translateY(-50%); -moz-transform:translateY(-50%);}
#header .logo a{display:block;}
#header .gnb{padding:32px 0 0;}
#header .gnb > ul{font-size:0; letter-spacing:-4px;}
#header .gnb > ul > li{display:inline-block; vertical-align:top; margin:0 50px;}
#header .gnb > ul > li > a{display:block; font-size:18px; color:#392d2a; letter-spacing:0.025em; font-weight:400; line-height:1.5; padding-bottom:31px;}
#header .right_box{position:absolute; align-items: center; display: flex; top:50%; right:100px; transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -ms-transform:translateY(-50%); -moz-transform:translateY(-50%);}
#header .right_box > a{display:inline-block; vertical-align:middle; font-size:16px; color:#fff; letter-spacing:0.025em; font-weight:500; line-height:1.2; padding:14px 30px; border-radius:4px; border-top-left-radius:21.5px; border-bottom-right-radius:21.5px; background:#222222;}
#header .right_box .m_btn{display:none; vertical-align:middle;}
#header .right_box .m_btn a{display:block; width:36px; margin-left:20px;}
#header .right_box .m_btn a i{display:block; width:100%; height:2px; margin:9px 0; background:#222222;}
#header .right_box .m_btn a i:nth-of-type(2){width:66%;}
#header .right_box .m_btn a i:nth-of-type(3){width:83%;}

#header .gnb > ul > li:hover > a{color:#68bbdc; font-weight:500;}
#header .right_box > a:hover{background:#2dafd5;}

#header .multi_box{display: inline-block; margin-left: 20px; vertical-align: middle;}
#header .multi_box a{display: inline-block; position: relative; padding: 0 10px; font-size: 16px; letter-spacing: -0.025em; font-weight: 200; color: #888888;}
#header .multi_box a:first-child:before{content: ''; position: absolute; top: 50%; right: -1.5px; transform: translateY(-50%); display: inline-block; width: 3px; height: 3px; border-radius: 50%; background: #888888;}
#header .multi_box a.active{color: #000;}

.main #header{box-shadow:none;}

@media all and (max-width:1400px){
	#header .logo{left:40px;}
	#header .gnb > ul > li{margin:0 30px;}
	#header .right_box{right:40px;}
}
@media all and (max-width:1000px){
	#header{height:90px;}
	#header .logo{left:20px;}
	#header .gnb{display:none;}
	#header .right_box{right:20px;}
	#header .right_box .m_btn{display:inline-block;}
}

/* m_menu */
.m_menu_bg{position:fixed; top:0; left:0; right:0; display:none; width:100%; height:100%; background:rgba(0, 0, 0, 0.7); z-index:99; cursor:pointer;}
.m_menu{position:fixed; top:0; right:-1000px; display:block; width:80%; max-width:420px; height:100%; background:#fff; z-index:100; overflow-y:auto; transition:all 0.3s; -webkit-transition:all 0.3s; -o-transition:all 0.3s; -ms-transition:all 0.3s; -moz-transition:all 0.3s;}
.m_menu.on{right:0;}
.m_menu .x_btn{padding:30px 25px; text-align:right;}
.m_menu .x_btn a{display:inline-block; font-size:18px; color:#aaaaaa; letter-spacing:0.025em; font-weight:400;}
.m_menu .x_btn a span{display:inline-block; vertical-align:middle; width:36px; margin-left:20px;}
.m_menu .x_btn a span i{display:block; width:100%; height:2px; background:#888888;}
.m_menu .x_btn a span i:nth-of-type(1){margin:14px 0 -2px; transform:rotate(45deg); -webkit-transform:rotate(45deg); -o-transform:rotate(45deg); -ms-transform:rotate(45deg); -moz-transform:rotate(45deg);}
.m_menu .x_btn a span i:nth-of-type(2){margin:0 0 14px; transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -o-transform:rotate(-45deg); -ms-transform:rotate(-45deg); -moz-transform:rotate(-45deg);}
.m_menu .gnb{padding:80px 20px 180px;}
.m_menu .gnb > ul > li{border-bottom:1px solid #dddddd;}
.m_menu .gnb > ul > li:last-of-type{border-bottom:0;}
.m_menu .gnb > ul > li > a{position:relative; display:block; font-size:28px; color:#392d2a; letter-spacing:0.025em; font-weight:500; padding:40px 20px;}
.m_menu .gnb > ul > li > a:before{content:''; position:absolute; top:50%; right:20px; display:block; width:10px; height:16px; background:url('/img/m_menu_arrow.png') no-repeat center center / contain; transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -ms-transform:translateY(-50%); -moz-transform:translateY(-50%);}
.m_menu ul.sns{position:relative; bottom:80px; left:50%; width:100%; padding:0 20px; text-align:center; box-sizing:border-box; transform:translateX(-50%); -webkit-transform:translateX(-50%); -o-transform:translateX(-50%); -ms-transform:translateX(-50%); -moz-transform:translateX(-50%);}
.m_menu ul.sns li{display:inline-block; vertical-align:middle; margin:0 10px;}
.m_menu ul.sns li:last-of-type{margin-right:0;}
.m_menu ul.sns li a{display:block;}
.m_menu ul.sns li a i{display:block; background-repeat:no-repeat; background-position:center; background-size:contain; transition:all 0.3s; -webkit-transition:all 0.3s; -o-transition:all 0.3s; -ms-transition:all 0.3s; -moz-transition:all 0.3s;}
.m_menu ul.sns li a i.icon01{width:26px; height:24px; background-image:url('/img/footer_sns01.png');}
.m_menu ul.sns li a i.icon02{width:27px; height:22px; background-image:url('/img/footer_sns02.png');}
.m_menu ul.sns li a i.icon03{width:22px; height:22px; background-image:url('/img/footer_sns03.png');}
.m_menu ul.sns li a i.icon04{width:12px; height:22px; background-image:url('/img/footer_sns04.png');}
.m_menu ul.sns li a i.icon05{width:25px; height:21px; background-image:url('/img/footer_sns05.png');}
.m_menu ul.sns li a i.icon06{width:23px; height:16px; background-image:url('/img/footer_sns06.png');}
.m_menu ul.sns li:hover a i.icon01{background-image:url('/img/footer_sns01_on.png');}
.m_menu ul.sns li:hover a i.icon02{background-image:url('/img/footer_sns02_on.png');}
.m_menu ul.sns li:hover a i.icon03{background-image:url('/img/footer_sns03_on.png');}
.m_menu ul.sns li:hover a i.icon04{background-image:url('/img/footer_sns04_on.png');}
.m_menu ul.sns li:hover a i.icon05{background-image:url('/img/footer_sns05_on.png');}
.m_menu ul.sns li:hover a i.icon06{background-image:url('/img/footer_sns06_on.png');}


/* ==========================================================================
	footer
========================================================================== */
#footer{position:relative; font-size:0; letter-spacing:-4px; padding:60px 0 80px; border-top:1px solid #dddddd; background:#fff; box-sizing:border-box;}
#footer .top_btn{position:absolute; top:-40px; right:100px; display:block; width:80px; text-align:center; padding:24px 0; border-radius:4px; border-top-left-radius:40px; border-bottom-right-radius:40px; background:#accd4a; z-index:10;}
#footer .logo{display:inline-block; vertical-align:top; width:270px; margin:0;}
#footer .logo a{display:inline-block;}
#footer .txt_box{position:relative; display:inline-block; vertical-align:top; width:calc(100% - 270px);}
#footer .txt_box ul.link li{position:relative; display:inline-block; vertical-align:top; margin-right:30px;}
#footer .txt_box ul.link li:last-of-type{margin-right:0;}
#footer .txt_box ul.link li:before{content:''; position:absolute; top:10px; right:-17px; display:block; width:3px; height:3px; border-radius:50%; background:#dddddd;}
#footer .txt_box ul.link li:last-of-type:before{display:none;}
#footer .txt_box ul.link li a{display:block; font-size:16px; color:#444444; letter-spacing:-0.025em; font-weight:400;}
#footer .txt_box ul.text{margin-top:40px; }
#footer .txt_box ul.text br.pc_br{display:block;}
#footer .txt_box ul.text br.m_br{display:none;}
#footer .txt_box ul.text li{position:relative; display:inline-block; vertical-align:top; margin:2px 0; margin-right:20px; font-size:16px; color:#666666; letter-spacing:-0.025em; font-weight:300; line-height:1.4; word-break:keep-all;}
#footer .txt_box ul.text li:nth-of-type(4){margin-right:0;}
#footer .txt_box ul.text li:last-of-type{margin-right:0;}
#footer .txt_box ul.text li:before{content:''; position:absolute; top:8px; right:-10px; display:block; width:1px; height:10px; background:#dddddd;}
#footer .txt_box ul.text li:nth-of-type(4):before{display:none;}
#footer .txt_box ul.text li:last-of-type:before{display:none;}
#footer .txt_box ul.text li b{display:inline-block; color:#444444; font-weight:500; margin-right:6px;}
#footer .txt_box ul.sns{position:absolute; bottom:0; right:0; }
#footer .txt_box ul.sns li{display:inline-block; vertical-align:middle; margin-right:20px;}
#footer .txt_box ul.sns li:last-of-type{margin-right:0;}
#footer .txt_box ul.sns li a{display:block;}
#footer .txt_box ul.sns li a i{display:block; background-repeat:no-repeat; background-position:center; background-size:contain; transition:all 0.3s; -webkit-transition:all 0.3s; -o-transition:all 0.3s; -ms-transition:all 0.3s; -moz-transition:all 0.3s;}
#footer .txt_box ul.sns li a i.icon01{width:26px; height:24px; background-image:url('/img/footer_sns01.png');}
#footer .txt_box ul.sns li a i.icon02{width:27px; height:22px; background-image:url('/img/footer_sns02.png');}
#footer .txt_box ul.sns li a i.icon03{width:22px; height:22px; background-image:url('/img/footer_sns03.png');}
#footer .txt_box ul.sns li a i.icon04{width:12px; height:22px; background-image:url('/img/footer_sns04.png');}
#footer .txt_box ul.sns li a i.icon05{width:25px; height:21px; background-image:url('/img/footer_sns05.png');}
#footer .txt_box ul.sns li a i.icon06{width:23px; height:16px; background-image:url('/img/footer_sns06.png');}
#footer .txt_box ul.sns li:hover a i.icon01{background-image:url('/img/footer_sns01_on.png');}
#footer .txt_box ul.sns li:hover a i.icon02{background-image:url('/img/footer_sns02_on.png');}
#footer .txt_box ul.sns li:hover a i.icon03{background-image:url('/img/footer_sns03_on.png');}
#footer .txt_box ul.sns li:hover a i.icon04{background-image:url('/img/footer_sns04_on.png');}
#footer .txt_box ul.sns li:hover a i.icon05{background-image:url('/img/footer_sns05_on.png');}
#footer .txt_box ul.sns li:hover a i.icon06{background-image:url('/img/footer_sns06_on.png');}
#footer .txt_box p{font-size:14px; color:#aaaaaa; letter-spacing:0.025em; font-weight:400; margin-top:20px;}

@media all and (max-width:1400px){
	#footer .top_btn{right:40px;}
}
@media all and (max-width:1000px){
	#footer{text-align:center;}
	#footer .top_btn{top:-30px; right:20px; width:60px; padding:16px 0; border-top-left-radius:30px; border-bottom-right-radius:30px;}
	#footer .top_btn img{height:28px;}
	#footer .logo{width:100%; margin-bottom:40px;}
	#footer .txt_box{width:100%;}
	#footer .txt_box ul.text{margin-top:30px;}
	#footer .txt_box ul.text li:nth-of-type(3){margin-right:0;}
	#footer .txt_box ul.text li:nth-of-type(4){margin-right:20px;}
	#footer .txt_box ul.text li:nth-of-type(5){margin-right:0;}
	#footer .txt_box ul.text li:nth-of-type(3):before{display:none;}
	#footer .txt_box ul.text li:nth-of-type(4):before{display:block;}
	#footer .txt_box ul.text li:nth-of-type(5):before{display:none;}
	#footer .txt_box ul.text br.pc_br{display:none;}
	#footer .txt_box ul.text br.m_br{display:block;}
	#footer .txt_box ul.sns{position:static; display:none; margin-top:40px;}
}

