@charset "utf-8";

::selection	{background-color:#8E001C;color:#fff}
.container	{position:relative;}
.d_width	{position:relative;width:1400px;margin:0 auto;transition:all 0.3s ease-out;}


@media only screen and (max-width:1480px){ /* 1200 */
	.d_width	{width:1200px;border:1px dotted red}
}
@media only screen and (max-width:1240px){ /* 960 */	
	.d_width	{width:960px;border-color:green}
}
@media only screen and (max-width:1023px){ /* 720 */
	.d_width	{width:720px;border-color:orange}
	.h1,h1{font-size:1.725rem;margin:0 0 1.25rem 0;}
	.h2,h2{font-size:1.5rem;margin:1.75rem 0 1rem 0;}
	.h3,h3{font-size:1.25rem;margin:1.25rem 0 0.75rem 0;}
}
@media only screen and (max-width:767px){ /* auto */	
	.d_width	{width:auto;padding:0 20px;border-color:blue}
}
@media only screen and (max-width:599px){ /* mobile-l */
	.d_width{border-color:black}
	.h1,h1{font-size:1.5rem;margin:0 0 1rem 0;}
	.h2,h2{font-size:1.25rem;margin:1.5rem 0 0.75rem 0;}
	.h3,h3{font-size:1rem;margin:1rem 0 0.5rem 0;}
}
@media only screen and (max-width:415px){ /* mobile-s */
	.d_width	{padding:0 10px;min-width:280px;border-color:yellow}
}
.d_width{border:none !important}/**/

#wrap		{position:relative;padding:0;margin:0;background:#fff}
.topmn		{position:absolute;right:0;top:0;height:90px;line-height:89px;z-index:999;}
.topmn a	{display:inline-block;font-size:13px;margin-left:15px;color:rgba(255,255,255,0.7);vertical-align:top;}
.topmn a:hover	{color:#fff;}
#logo		{position:absolute;left:0;top:32px;padding:0;margin:0;z-index:999}
#logo img	{vertical-align:top;height:26px;}
#logo .n1	{display:none}
#logo .n2	{display:block}

#header					{position:absolute;left:0;top:0;width:100%;height:90px;background:rgba(0,0,0,0.3);z-index:99;transition: all .2s ease-out;}
#header.hbg1			{background:none;}
#header.active			{background:#fff;}
#header.active .topmn a		{color:#ccc;}
#header.active .topmn a.btn-search	{color:#0D0B5D;}
#header.active #logo .n1	{display:block}
#header.active #logo .n2	{display:none}
#header.active #gnb			{border-top-color:rgba(0,0,0,0.05);border-bottom:none;}
#header.active #gnbmn ul.depth1 > li > a	{color:#333;}

#id_gnb_bg		{position:absolute;left:0;top:90px;z-index:3;overflow:hidden;}
.gnb_bg			{width:100%;padding:0;margin:0;background:#F5F7F8;box-shadow:0px 5px 5px rgba(0,0,0,0.1);-moz-box-shadow:0px 5px 5px rgba(0,0,0,0.1);-webkit-box-shadow:0px 5px 5px rgba(0,0,0,0.1);}

#gnb 						{position:absolute;left:0;top:0;width:100%;z-index:99;}
#gnb h2						{display:none;}
#gnbmn:after				{content:"";clear:both;display:block;float:none;}
#gnbmn						{position:relative;}
#gnbmn ul.depth1			{position:relative;width:calc(100% - 280px);margin:0 140px 0 140px;z-index:5;text-align:center;}
#gnbmn ul.depth1 li			{display:inline-block;}
#gnbmn ul.depth1 > li > a	{display:block;color:#fff;line-height:90px;font-size:20px;font-weight:600;padding:0 45px;letter-spacing:-1px;}
#gnbmn ul.depth1 > li.on > a{color:#FF9900 !important;}
#gnbmn ul.depth1 li a:hover	{color:#FF9900 !important;}
#gnbmn .depth2				{display:none;position:absolute;left:-140px;top:90px;width:1400px;padding:30px 0;border:1px dotted rgba(0,0,0,0.04)}
#gnbmn .depth2 .title		{position:absolute;left:-200px;text-align:left;width:260px;padding-top:10px;}
#gnbmn .depth2 .title .tit	{font-size:40px;font-weight:600;color:#000;line-height:1;letter-spacing:-2px;}
#gnbmn .depth2 ul			{margin:0 -10px;}
#gnbmn .depth2 ul li		{float:left;width:20%;padding:0 10px 10px;}
#gnbmn .depth2 ul li:nth-child(6)	{clear:both;}
#gnbmn .depth2 ul li a		{display:block;font-size:18px;background:#5A6378;color:#fff;line-height:50px;border:2px solid #5A6378;padding:0;}
#gnbmn .depth2 ul li a:hover{background:#fff;color:#5A6378;}

#gnbmn ul.depth3			{display:block;padding:5px 0;margin:0;width:100%;}
#gnbmn ul.depth3 li			{display:block;float:none;padding:2px 0;margin:5px 0;width:auto;}
#gnbmn ul.depth3 li a		{display:block;position:relative;line-height:1.2;padding:0 0 0 12px;margin:0;font-size:15px;font-weight:normal;color:#777 !important;border:none;background:none;text-align:left;}
#gnbmn ul.depth3 li a:before	{content:"";position:absolute;left:0;top:0.5em;display:inline-block;width:6px;height:2px;background:#888;vertical-align:middle;}
#gnbmn ul.depth3 li a:hover,
#gnbmn ul.depth3 li a:focus,
#gnbmn > ul.depth3 > li.on > a,
#gnbmn ul.depth3 > li.on > a span	{color:#8e001c !important;border:none;background:none;}


#mobile-navicon	{display:none;position:Absolute;left:0;top:0;line-height:90px;color:#fff;font-size:1.5rem;z-index:99999}

#footer				{position:relative;background:#333;text-align:center;z-index:3;}
#footer .fmn		{padding:15px 0;background:rgba(0,0,0,0.3);}
#footer .fmn a		{display:inline-block;margin:0 20px;font-size:13px;color:#999;}
#footer .fmn a:hover		{color:#fff;}
#footer address		{font-size:12px;color:#777;padding:20px 0;}
#btm_cont				{position:fixed;right:40px;bottom:40px;z-index:99999}
.btn-msg				{position:relative;}
.btn-msg a				{position:relative;display:block;width:50px;height:50px;border-radius:50%;text-align:center;background:#FF9900;line-height:50px;font-size:1rem;color:#fff;}
.btn-msg a i			{position:relative;z-index:2;}
.btn-msg .msg-txt		{position:absolute;right:0;bottom:70px;display:block;width:180px;background:#FF9900;padding:20px;word-break:keep-all;line-height:1.2;border-radius:6px;color:#fff;text-align:right;}
.btn-msg .msg-txt:after	{content:"";position:absolute;right:20px;bottom:-10px;border-left:8px solid transparent;border-right:8px solid transparent;border-top:10px solid #FF9900;}
.btn-msg a:before		{content:"";background:#8E001C;position:absolute;left:50%;top:50%;width:100%;height:100%;border-radius:50%;z-index:1;transform:translate3d(-50%,-50%,0) scale(0);transition:transform .45s cubic-bezier(.6,.01,0,1.38);}
.btn-msg a:hover:before	{transform:translate3d(-50%,-50%,0) scale(1.3);}

@media only screen and (max-width:1480px){ /* 1200 */
	#gnbmn ul.depth1 li a	{padding:0 35px;}
	#gnbmn .depth2{width:1200px;}
}
@media only screen and (max-width:1240px){ /* 960 */	
	#gnbmn ul.depth1 {width:calc(100% - 200px);margin:0 100px 0 100px;}
	#gnbmn ul.depth1 li a	{padding:0 20px;}
	#gnbmn .depth2{width:960px;}
	#gnbmn .depth2 ul li a{font-size:1rem}
}
@media only screen and (max-width:1023px){ /* 720 */
	#header	{height:70px;background:#111}
	.topmn	{right:20px;line-height:70px;height:70px;}
	#logo	{left:50%;top:15px;transform:translateX(-50%);}	
	#gnbmn	{display:none;}	
	#mobile-navicon	{display:block;left:20px;top:0px;line-height:70px;}
	
}
@media only screen and (max-width:767px){ /* auto */	

}
@media only screen and (max-width:599px){ /* mobile-l */
	#header	{height:50px;}
	.topmn	{line-height:50px;height:50px;}
	#mobile-navicon{line-height:50px;}
	#logo img{height:20px;}
	.topmn a:last-child{display:none;}
}
@media only screen and (max-width:415px){ /* mobile-s */

}
.sbg1{background:#f6f6f6}
#sub-visual						{height:260px;position:relative;padding-top:125px;background-repeat:no-repeat;background-position:50% 50%;background-size:cover;background-image:url(../img/svbg1.jpg);}
#sub-visual:after{content:"";clear:both;display:block;float:none;}
#sub-visual.sv-index			{height:420px;margin-bottom:50px;padding-top:90px;}
#sub-visual.sv-index > .d_width	{padding:30px 0}
#sub-visual.svbg1	{background-image:url(../img/svbg1.jpg);}
#sub-visual.svbg2	{background-image:url(../img/svbg2.jpg);}
#sub-visual.svbg3	{background-image:url(../img/svbg3.jpg);}
#sub-visual.svbg6	{background-image:url(../img/svbg6.jpg);}
#sub-visual.svbg7	{background-image:url(../img/svbg7.jpg);}
#sub-visual.svbg9	{background-image:url(../img/svbg9.jpg);}
/* #sub-visual.svbg8	{background-image:url(../img/svbg8.jpg);} */
#sub-visual .sv-tit			{font-size:2.5rem;font-weight:600;letter-spacing:-1px;}
#sub-visual .sv-tit:after	{content:"꿈과 미래를 설계하고 역량을 관리해주는 바른 미래 길잡이, 경일대학교 키우미!";font-size:18px;font-weight:400;margin:-2px 0 0 15px;padding-left:20px;border-left-width:1px;border-left-style:solid;display:inline-block;vertical-align:middle;}
#sub-visual.svbg1 .sv-tit,
#sub-visual.svbg7 .sv-tit	{color:#000;}
#sub-visual.svbg1 .sv-tit:after,
#sub-visual.svbg7 .sv-tit:after{border-left-color:rgba(0,0,0,0.2);}
#sub-visual.svbg2 .sv-tit,
#sub-visual.svbg3 .sv-tit	{color:#fff;}
#sub-visual.svbg2 .sv-tit:after,
#sub-visual.svbg3 .sv-tit:after	{border-left-color:rgba(255,255,255,0.3);}


#sub-visual .txt-wrap	{float:left;width:240px;padding-right:60px;word-break:keep-all;}
#sub-visual .mn-list	{float:left;width:calc(100% - 240px);}

#sub-visual .index-tit	{font-size:2.5rem;font-weight:600;letter-spacing:-2px;margin:0 0 20px 0;display:none;}
#sub-visual .index-txt	{font-size:18px;display:none}
#sub-visual.svbg1 .txt-wrap	{color:#000;}
#sub-visual.svbg2 .txt-wrap,
#sub-visual.svbg3 .txt-wrap,
#sub-visual.svbg6 .txt-wrap,
#sub-visual.svbg9 .txt-wrap	{color:#fff;}

#sub-visual .mn-list>ul	{margin:0 -10px;}
#sub-visual .mn-list li	{float:left;width:20%;padding:0 5px 10px;}
#sub-visual .mn-list>ul>li>a	{display:block;border-width:2px;border-style:solid;font-size:18px;text-align:center;font-weight:600;letter-spacing:-1px;padding:12px 0 10px;background:#fff;}
#sub-visual .mn-list ul ul		{padding-top:10px;}
#sub-visual .mn-list li li		{float:none;width:100%;padding:3px 0;}
#sub-visual .mn-list li li a	{color:#000;}
#sub-visual .mn-list li li a:hover	{padding-left:5px;}
#sub-visual.svbg1 .mn-list>ul>li>a	{border-color:#FF9900;color:#FF9900;}
#sub-visual.svbg1 .mn-list>ul>li>a:hover	{background:#FF9900;color:#fff;}
#sub-visual.svbg2 .mn-list>ul>li>a			{border-color:#70868B;color:#70868B;}
#sub-visual.svbg2 .mn-list>ul>li>a:hover	{background:#70868B;color:#fff;}
#sub-visual.svbg9 .mn-list>ul>li>a			{border-color:#a68d6b;color:#a68d6b;}
#sub-visual.svbg9 .mn-list>ul>li>a:hover	{background:#a68d6b;color:#fff;}

#location	{background:rgba(0,0,0,0.2);line-height:50px;position:absolute;left:0;bottom:0;width:100%;}
#location .d_width > ul:after{content:"";display:block;float:none;clear:both;}
#location .d_width > ul > li	{position:relative;float:left;line-height:50px;font-size:14px;margin:0;padding:0 25px}
#location .d_width > ul > li:after			{content:"";position:absolute;right:0;top:7px;display:block;width:36px;height:36px;border:1px solid rgba(0,0,0,0.1);border-left:none;border-bottom:none;transform:rotate(45deg);}
#location .d_width > ul > li:last-child:after{content:"";display:none;}
#location .d_width > ul > li > a{color:#fff}
#location .d_width ul ul		{display:none;}

#sub-section	{min-height:600px;}
#body_content > h2:first-child{margin-top:0}
#content		{padding:50px 0;min-height:700px}


@media only screen and (max-width:1480px){ /* 1200 */	
	#sub-visual .txt-wrap,
	#sub-visual .mn-list	{float:none;width:auto;padding:0;}
	#sub-visual .index-tit	{font-size:1.5rem;}
	#sub-visual .index-txt	{display:none}


}
@media only screen and (max-width:1240px){ /* 960 */	
	#sub-visual .mn-list>ul>li>a{font-size:1rem}
}
@media only screen and (max-width:1023px){ /* 720 */
	#sub-visual				{height:200px;padding-top:70px;}
	#sub-visual.sv-index	{height:auto;padding-top:70px;margin:0;}
	#sub-visual.sv-index > .d_width	{padding:0;}
	#sub-visual .index-tit	{margin:0;}
	#sub-visual .mn-list	{display:none;}
	#sub-visual .sv-tit		{font-size:1.5rem;padding-top:20px}
	#sub-visual .sv-tit:after{display:none}
	#content{padding:20px 0}
}
@media only screen and (max-width:767px){ /* auto */	
	#sub-visual				{height:auto;padding:70px 0 0 0}
	#sub-visual .mn-list	{display:none;}	
	#sub-visual .sv-tit		{display:none;}
	

	#location					{position:relative;left:auto;bottom:auto;background:#efefef}
	#location .d_width			{padding:0}
	#location .d_width > ul > li:after{display:none}
	#location .d_width > ul > li:first-child{position:Absolute;left:0;top:0;width:50px;padding:0;text-align:Center;}
	#location .d_width > ul > li{float:none;width:100%;}
	#location .d_width > ul > li	{padding:0 20px 0 70px;border-top:1px solid rgba(0,0,0,0.1)}
	#location .d_width > ul > li > a{color:#333}
	#body_content .d_width{padding:0;}
}
@media only screen and (max-width:599px){ /* mobile-l */
	#sub-visual				{padding:50px 0 0 0}
	#sub-visual.sv-index	{padding-top:50px;}
}
@media only screen and (max-width:415px){ /* mobile-s */
	 
}

