@import url("font.css");

.container-fluid{width:100%;padding-bottom:0px;margin:0 auto;font-family: sans-serif;}
.stick_nav{width:100%;}

/* base - 브라우저 초기화 */
*{ margin: 0; padding: 0; -webkit-text-size-adjust:none;}
ul, ol, dl, li, dd, dt{ list-style: none; }
a{ text-decoration: none; } 
img{ border: none;max-width:100%;height:auto;vertical-align:middle;}
table{ border-collapse: collapse; border-spacing: 0px; }
button{outline: none;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;margin:0;padding:0;vertical-align:middle;border:none;cursor: pointer;}

/* 컨텐츠 공통 */
#wrap{position: relative;width:100%;min-width:1200px;margin:0 auto;}
.blink{text-indent:-1000em;}



/* sticky*/
.sticky {position: fixed;top: 0;transition: all 0.5s;}
.sticky + .content {padding-top: 60px;}

#navbar {overflow: hidden;background-color: rgba(17,17,17,0.9);width:100%;height:120px;z-index: 99;  position: relative; margin-top: 0px;}
#navbar div {width:1200px;height:120px;margin:0 auto;/*background:url("../images/tt01_full.png") no-repeat;*/position: relative;display:flex;justify-content:center;align-items:center;}
#navbar div button{background:url("../images/btn01.png") no-repeat;width:362px;height:62px;position: absolute; top: 50%; right:0;margin: 0; transform: translate(0, -50%);}
#navbar div button:hover{background:url("../images/btn01_on.png") no-repeat;}

h2.int{display:inline-block;font-size: 1.875em;color:#fff;text-align:left;width:100%;font-weight: 700;letter-spacing:-0.3px;line-height:1;font-family: 'GmarketSansLight';}
h2.int > span{display:inline-block;}
h2.int > span > span.tte{display:inline-block;background:url('../images/tti.png') repeat-x left 90%;font-family: 'GmarketSansBold';padding:0 3px;}


.content_mo{clear:both;position: relative;width:100%;margin:0 auto;}
.content_mo span img{text-align:center;width:100%;height:auto;vertical-align:top;}

article{float: left; transition: all 0.5s;}
.tx01{width: 340px; height: 173px; background: url("../images/vi01.png") no-repeat top left;position:absolute;top:230px;left:355px;animation-delay:.5s;opacity:0}
.tx02{width: 100%; height: 27px; background: url("../images/vi0102.png") no-repeat 50% top;position:absolute;top:78px;left:0px;opacity:0}
.tx03{width: 100%; height: 20px; background: url("../images/vi0103.png") no-repeat 50% top;position:absolute;top:102px;left:0px;animation-delay:.3s;opacity:0}
.tx04{width: 671px; height: 663px; background: url("../images/vi0104.png") no-repeat top left;position:absolute;bottom:0;right:0px;}

.content{clear:both;position: relative;width:100%;margin:0 auto;}
section.con{width:100%;}
section.con > article{width:100%;display:block;transition: all 0.5s; text-align:center;}
section.con > article:nth-child(1){background: #1c88fc;background-size: cover;}
section.con > article:nth-child(2){background: #ffffff;}
section.con > article:nth-child(3){background: #d7e8ef url("../images/visual_0104_bg.jpg") no-repeat center center;background-size: 1900px 601px;}
section.con > article:nth-child(3) > img{opacity:0;}
section.con > article:nth-child(4){background: #ebf4f9 url("../images/visual_0105_bg.jpg") no-repeat center center;background-size: cover;}
section.con > article:nth-child(5){background: #181834 url("../images/visual_0106_bg.jpg") no-repeat center center;background-size: cover;}
section.con > article img{text-align:center;width:1200px;}

/* 하단버튼 추가*/
div.btnarea{/*background:#1a1a3e;*/width:100%;padding-bottom:120px;padding-top:80px;display:block;text-align:center;}
div.btnarea > button{width:420px;height:100px;line-height:102px;display:inline-block;background-color:#2f5dcb;border-radius:5px;text-align:center;font-size:37px;color:#fff;font-family: 'GmarketSansMedium';letter-spacing:0;}
div.btnarea > button:hover{background-color:#ae29f4 ;}
div.btnarea > button.btn_su{margin-left:10px;}

/*.content_mo div.btnarea > button.btn_join{background:url("../images/btnm_join.png") no-repeat;}
.content_mo div.btnarea > button.btn_join:hover{background:url("../images/btnm_join_on.png") no-repeat;}
.content_mo div.btnarea > button.btn_su{background:url("../images/btnm_su.png") no-repeat;margin-left:14px;}
.content_mo div.btnarea > button.btn_su:hover{background:url("../images/btnm_su_on.png") no-repeat;}*/

/* 과정소개*/
div.lecc{
	background:#3d4963;
	background-size: cover;
	width:100%;height:auto;
	padding-bottom:90px;
}
p.lecc_tt{width:90%;padding:8em 0 62px;margin:0 auto;text-align:center;}
p.lecc_tt img{width:100%; height: auto;}

ul.leccw{width:92%;margin:0px auto;display:flex;justify-content:space-between;border:0px solid red;}
ul.leccw li{transition:all .3s;box-shadow:2px 2px 2px rgba(0,0,0,0.2);border:0px solid red;width:100%;}
ul.leccw li a{width:100%; height:100%; display:inline-block;}
ul.leccw li a img{width:100%;height:auto;}
ul.leccw + ul.leccw{margin-top:1.25em;}
ul.leccw li + li{margin-left:1.25em;}

ul.leccw_sm{display:none;}
.content_640{display:none;}

@media all and (max-width:1024px) {
	#wrap{position: relative;width:100%;min-width:780px;margin:0 auto;}
	

	/* sticky*/
	#navbar {height:70px;z-index: 99;text-align:center;}
	#navbar div {width:95%;height:70px;margin:0 auto;background-size: 70%;}
	#navbar div button{
		width:200px;height:60px;
		background:url("../images/business_pro/btn01_m.png") no-repeat 50% 50%;background-size: contain;
		border-radius:10px;
		}
	#navbar div button:hover{
		width:200px;height:60px;
		background:url("../images/business_pro/btn01_m_on.png") no-repeat 50% 50%;background-size: contain;
		border-radius:10px;
		}

	h2.int{display:inline-block;font-size: 1.875em;}
	h2.int > span{display:inline-block;}

	
	section.con > article img{text-align:center;width:95%;margin:0 auto;}
	section.con > article:nth-child(3){background-size: cover;}


	div.btnarea{padding-bottom:5em;padding-top:4em;display:flex;justify-content:center;text-align:center;}
	div.btnarea > button{width:45%;height:100px;line-height:102px;display:inline-block;font-size:30px;}
	
	/*.content_mo div.btnarea > button.btn_join{background:url("../images/btnm_join.png") no-repeat;}
	.content_mo div.btnarea > button.btn_join:hover{background:url("../images/btnm_join_on.png") no-repeat;}
	.content_mo div.btnarea > button.btn_su{background:url("../images/btnm_su.png") no-repeat;margin-left:14px;}
	.content_mo div.btnarea > button.btn_su:hover{background:url("../images/btnm_su_on.png") no-repeat;}*/

	/* 과정소개*/
	div.lecc{height:auto;padding-bottom:4em}
	p.lecc_tt{width:85%;padding:5em 0 3.5em;margin:0 auto;text-align:center;}
		
}/* (min-width:780px) */



@media all and (max-width:780px) {
	#wrap{position: relative;width:100%;min-width:640px;margin:0px auto 0;padding:0;}
	

	/* sticky*/
	#navbar {height:70px;z-index: 99;text-align:center;}
	#navbar div {width:98%;height:70px;margin:0 auto;background-size: 100%;}
	#navbar div button{
		width:200px;height:56px;
		background:url("../images/business_pro/btn01_m.png") no-repeat 50% 50%;background-size: contain;position: absolute; top: 50%; right:0;margin: 0; transform: translate(0, -50%);
		border-radius:8px;
		margin-right:3%

		}
	#navbar div button:hover{
		width:200px;height:56px;
		background:url("../images/business_pro/btn01_m_on.png") no-repeat 50% 50%;background-size: contain;
		border-radius:8px;
		margin-right:3%
	}

	h2.int{display:inline-block;font-size: 1.35em;}
	h2.int > span{display:inline-block;font-family: 'GmarketSansMedium';}

	/* 하단버튼 추가*/
	div.btnarea{padding-bottom:5em;padding-top:3.2em;display:flex;justify-content:center;text-align:center;}
	div.btnarea > button{width:45%;height:75px;line-height:77px;display:inline-block;font-size:28px;}

	/* 과정소개*/
	div.lecc{height:auto;min-height:480px;padding-bottom:3em}
	p.lecc_tt{width:85%;padding:4em 0 2em;margin:0 auto;text-align:center;}

	ul.leccw + ul.leccw{margin-top:1.3em;}
	ul.leccw li + li{margin-left:1.25em;}
	ul.leccw:first-child{padding-top:12em;}


}/* (min-width:640px) */


@media all and (max-width:640px) {
	#wrap{position: relative;width:100%;min-width:480px;margin:0;padding:0;}


	/* sticky*/
	#navbar {height:70px;z-index: 99;text-align:center;}
	#navbar div {width:95%;height:68px;margin:0 auto;background-size: 48%;}
	#navbar div button{
		width:190px;height:50px;margin:0 auto;
		background:url("../images/business_pro/btn01_m.png") no-repeat 50% 50%;background-size: contain;position: absolute; top: 50%; right:0;margin: 0; transform: translate(0, -50%);
		border-radius:6px;
		}
	#navbar div button:hover{
		width:190px;height:50px;margin:0 auto;
		background:url("../images/business_pro/btn01_m_on.png") no-repeat 50% 50%;background-size: contain;
		border-radius:6px;
		}

	h2.int{display:block;font-size: 1.1em;}
	h2.int > span{display:block;padding-top:5px;font-family: 'GmarketSansMedium';}

	div.btnarea{position: relative; margin:0 auto;padding-bottom:70px;padding-top:45px;display:flex;justify-content:center;text-align:center;}
	div.btnarea > button{width:45%;height:60px;line-height:62px;display:inline-block;border-radius:4px;font-size:1.375em;}

	/* 과정소개*/
	

	.content_640{display:block;}
	.content_640 > span.last_img{background-color:#00b8d1;margin-top:-1px;}
	.content_640 > span.last_img img{margin:0; padding:0}
	.content_mo{display:none;}

	div.lecc{height:auto;min-height:300px;padding-bottom:2.5em}
	p.lecc_tt{width:85%;padding:3.5em 0 1.8em;margin:0 auto;text-align:center;}

	ul.leccw + ul.leccw{margin-top:1em;}
	ul.leccw li + li{margin-left:1em;}
	ul.leccw:first-child{padding-top:8em;}
		
}/* (min-width:480px) */


@media all and (max-width:480px) {
	#wrap{min-width:300px;margin:0;padding:0;}
	

	/* sticky*/
	#navbar {height:60px;z-index: 99;text-align:center;}
	#navbar div {width:92%;height:60px;margin:0 auto;background-size: 48%;}
	#navbar div button{
		width:132px;height:26px;margin:0 auto;
		background:url("../images/business_pro/btn01_m.png") no-repeat 50% 50%;background-size: contain;position: absolute; top: 50%; right:0;margin: 0; transform: translate(0, -50%);
		border-radius:4px;
		}
	#navbar div button:hover{
		width:132px;height:26px;margin:0 auto;
		background:url("../images/business_pro/btn01_m_on.png") no-repeat 50% 50%;background-size: contain;
		border-radius:4px;
		}

	h2.int{display:block;font-size: 0.95em;}
	h2.int > span{display:block;padding-top:4px;font-family: 'GmarketSansMedium';}

	div.btnarea{position: relative; margin:0 auto;padding-bottom:60px;padding-top:30px;display:flex;justify-content:center;text-align:center;}
	div.btnarea > button{width:45%;height:55px;line-height:57px;display:inline-block;background-size: cover;background-position:-50% -50%;border-radius:3px;font-size:1.125em;}

	/* 과정소개*/
	div.lecc{height:auto;min-height:290px;padding-bottom:2.5em;}
	p.lecc_tt{width:90%;padding:3em 0 1.4em;margin:0 auto;text-align:center;}

	
		
}/* (max-width:360px) */

@media all and (max-width:360px) {
	
	/* 과정소개*/
	div.lecc{height:auto;min-height:420px;padding-bottom:2.5em;}
	p.lecc_tt{width:85%;padding:3em 0 1.5em;margin:0 auto;text-align:center;}

	
	
		
}/* (max-width:300px) */