#main { background: rgba(255, 255, 255, 0); overflow: hidden; padding-top: 180px; position: relative; }
.fixed#header ~ #main { padding-top: 84px; }

@media all and (max-width:1199px) {
	#main { padding: 60px 0px 0px; }
	.fixed#header + #main { padding-top: 50px; }
}

#visual { position: relative; padding: 50px 0 40px; margin-top:0px; }
#app { background: rgb(244, 245, 248);  padding: 40px 0; margin-top: 0px; position: relative; z-index: 2; }
#app-test { padding: 40px 0; margin-top: 0px; position: relative; z-index: 2; }



/* SECTION TITLE */
.main_title { text-align: center; line-height: 1.3; margin-bottom: 0.0em; -ms-word-break: keep-all; }
.main_title .tit { color: rgb(51, 51, 51); letter-spacing: 0; font-size: 2.5em; font-weight: 600; padding-bottom:5px; }
.main_title .desc { color: rgb(170, 156, 127); font-size: 1em; font-weight: 400; }

@media screen and (max-width:1024px) {
	.main_title { margin-bottom: 0.0em; }
	.main_title .tit { font-size: 2.18em; }
}


/* NOTICE BOX형 */
.notice_wrap { padding: 1.7em 1.7em; border: 1px solid rgb(221, 221, 221); border-image: none; display: block; position: relative; }
.notice_wrap .nodat { height:241px; }

@media screen and (max-width:1024px) {
	.notice_wrap { padding: 1.56em 0.93em; }
}

.notice_wrap .txt_bx .cat-tit-1, .notice_wrap .txt_bx .cat-tit-2, .notice_wrap .txt_bx .cat-tit-3, .notice_wrap .txt_bx .cat-tit-4, .notice_wrap .txt_bx .cat-tit-5, .notice_wrap .txt_bx .cat-tit-6 { margin-bottom: 1.0em; }
.notice_wrap .txt_bx .cat-tit-1 span { background:#a90056; padding:3px 8px 4px; color: rgb(255, 255, 255); line-height: 1.0em; font-size: 14px; font-weight: 600; }
.notice_wrap .txt_bx .cat-tit-2 span { background:#b1a387; padding:3px 8px 4px; color: rgb(255, 255, 255); line-height: 1.0em; font-size: 14px; font-weight: 600; }
.notice_wrap .txt_bx .cat-tit-3 span { background:#f69910; padding:3px 8px 4px; color: rgb(255, 255, 255); line-height: 1.0em; font-size: 14px; font-weight: 600; }
.notice_wrap .txt_bx .cat-tit-4 span { background:#25aae1; padding:3px 8px 4px; color: rgb(255, 255, 255); line-height: 1.0em; font-size: 14px; font-weight: 600; }
.notice_wrap .txt_bx .cat-tit-5 span { background:#333333; padding:3px 8px 4px; color: rgb(255, 255, 255); line-height: 1.0em; font-size: 14px; font-weight: 600; }
.notice_wrap .txt_bx .cat-tit-6 span { background:#852aff; padding:3px 8px 4px; color: rgb(255, 255, 255); line-height: 1.0em; font-size: 14px; font-weight: 600; }
.notice_wrap .txt_bx .news-tit { height:1.5em; color: rgb(55, 55, 55); line-height: 1.3em; overflow: hidden !important; font-size: 1.12em; font-weight: 600; margin-bottom: 0.5em; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.notice_wrap .txt_bx .des { height: 4.3em; color: rgb(55, 55, 55); line-height: 1.4em; overflow: hidden; text-overflow: ellipsis; opacity: 0.6; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.notice_wrap .txt_bx .sub_tit { color: rgb(119, 119, 119); margin-top: 1.2em; }
.notice_wrap .line::after { transition:0.3s ease-out; display: block; position: absolute; content: ""; box-sizing: border-box; background-color: rgb(1, 40, 105); }
.notice_wrap .line::before { transition:0.3s ease-out; display: block; position: absolute; content: ""; box-sizing: border-box; background-color: rgb(1, 40, 105); }
.notice_wrap::after { transition:0.3s ease-out; display: block; position: absolute; content: ""; box-sizing: border-box; background-color: rgb(1, 40, 105); }
.notice_wrap::before { transition:0.3s ease-out; display: block; position: absolute; content: ""; box-sizing: border-box; background-color: rgb(1, 40, 105); }
.notice_wrap::before { left: 0px; top: 0px; width: 0px; height: 1px; }
.notice_wrap::after { width: 1px; height: 0px; right: 0px; bottom: 0px; }
.notice_wrap .line::before { width: 0px; height: 1px; right: 0px; bottom: 0px; }
.notice_wrap .line::after { left: 0px; top: 0px; width: 1px; height: 0px; }
.notice_wrap:hover .line::after { height: 100%; }
.notice_wrap:hover::after { height: 100%; }
.notice_wrap:hover .line::before { width: 100%; }
.notice_wrap:hover::before { width: 100%; }

.schgo-box a { width:100%; height:140px; padding:20px; margin:0px; background:#9172b1; display: block; }
.schgo-box a:hover { width:100%; height:140px; padding:20px; margin:0px; background:#ee6761; display: block; }
.schgo-box h3 { color:#fff; }
.schgo-box p { color:#fff; padding-top:5px; }
.schgo-box .per-buttons { width:100% !important; text-align:right !important; margin-top:5px; }


/* 알림판 */
#notify { margin:0; padding: 0px; position: relative; z-index: 10; }
#notify .slick { border-radius: 0px; width: 100%; box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.0); }
#notify .slick .slick-list { border-radius: 0px; -webkit-mask-image: -webkit-radial-gradient(white, black); }

#notify .control { left: 30px; bottom: 30px; position: absolute; z-index: 3; }
#notify .control a:after { content:''; display:block; clear:both; }
#notify .control a span { display:block; margin:0 auto; width:15px; height:36px; text-indent:-9999px; background-repeat:no-repeat; background-position:center; background-size:100%; }
#notify .control a { display:inline-block; margin-right:10px; text-align:center; color:#fff; font-size:24px; font-weight:400; font-family:"Rajdhani"; cursor:pointer; width:40px !important; height:40px !important; border:2px solid #eee; border-radius:50%; }
#notify .control a[role='button'] { transition:0.1s; width: 15px; height: 24px; text-indent: -9999px; overflow: hidden; margin-top: 0px; vertical-align: middle; display: inline-block; position: relative; }
#notify .control a[role='button'] + a[role='button'] { margin-left: 0px; }
#notify .control a.play { display: none; }
#notify .control a.prev span { background-image:url(../images/main/ico_slide_left01.png); }
#notify .control a.next span { background-image:url(../images/main/ico_slide_right01.png); }
#notify .control a.pause span { background-image:url(../images/main/ico_slide_pauset02.png); }
#notify .control a.play span { background-image:url(../images/main/ico_slide_stop02.png); }
#notify .control a.prev span:hover { background-image:url(../images/main/ico_slide_left01_on.png); }
#notify .control a.next span:hover { background-image:url(../images/main/ico_slide_right01_on.png); }
#notify .control a.pause span:hover { background-image:url(../images/main/ico_slide_pauset02_on.png); }
#notify .control a.play span:hover { background-image:url(../images/main/ico_slide_stop02_on.png); }
#notify .control a[role='button']:active { transform: scale(0.9); }
#notify .count { margin: 10px 5px 0px -5px; color: rgb(255, 255, 255); line-height: 1; font-size: 18px; font-weight: 400; vertical-align: top; display: inline-block; }
#notify .count em { font-size: 18px; font-style:normal; font-weight: 500; color:#ffff00; }


/* NOTICE LIST형  */
.top-notice { position: relative; width:100%; height:100%; padding:24px 20px 15px; margin:0px; border:1px solid #e1e1e1;}
.top-notice h3 { color: rgb(0, 0, 0); font-size: 20px; padding-bottom:5px; font-weight: 600; }
.top-notice .more { background: url("/images/main/more_ico_k_20.png") no-repeat; top: 22px; width: 20px; height: 20px; right: 20px; font-size: 0px; display: block; position: absolute; }

.top-notice dl { padding:0; margin-top:5px; border-top: 1px solid rgb(34, 34, 34); }
.top-notice dl dt { FLOAT:left; font-size:15px; padding: 12px 0; font-weight:400; margin-top:0px; color: rgb(51, 51, 51); overflow: hidden; border-top-color: rgb(238, 238, 238); border-top-width: 1px; border-top-style: dashed; }
.top-notice dl dd { FLOAT:left; font-size:15px; padding: 12px 0; font-weight:300; margin-top:0px; color: rgb(133, 133, 133); text-align:right; border-top-color: rgb(238, 238, 238); border-top-width: 1px; border-top-style: dashed; }

.top-notice dl dt:first-child { width:100%; padding: 0; margin-top:0px; border-top-width: 0px; }
.top-notice dl dt:first-child a {display:block; width:100%; height:100%; }
.top-notice dl dt:first-child a:after {content:''; display:block; clear:both; }
.top-notice dl dt:first-child p { display:-webkit-box; font-size:20px; padding: 20px 0 10px; font-weight:500; margin-top:0px; height:80px; max-height:80px; overflow:hidden; white-space: normal; word-wrap:break-word; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.top-notice dl dd:nth-child(2) { width:100%; border-top-width: 0px; font-size:15px; padding: 10px 0 20px; font-weight:400; margin-top:0px; }

.top-notice dl dt a { color: rgb(51, 51, 51); overflow: hidden; white-space: nowrap; word-break: break-all; text-overflow: ellipsis; }
.top-notice dl dt a:hover { text-decoration: none; color: rgb(49, 80, 169); }
.top-notice dl dt a:focus, .top-notice dl dt a:active { text-decoration: underline; }

@media all and (min-width:1400px) {
	.top-notice dl dt { width:75%; }
	.top-notice dl dd { width:25%; }
}

@media all and (max-width:1399px) {
	.top-notice dl dt { width:75%; }
	.top-notice dl dd { width:25%; }
}

@media all and (max-width:1199px) {
	#notify { top: 0px; }
	#notify .slick { width: 100%; }

	.top-notice dl dt { width:75%; }
	.top-notice dl dd { width:25%; }
}

@media all and (max-width:991px) {
	#notify { margin: 0px; width: 100%; right: auto; position: relative; max-width: 100%; }
	#notify .slick { max-width: 100%; box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.0); }
	#notify .control a[role='button'] { background-position-y: -145px !important; }

	.top-notice dl dt { width:75%; }
	.top-notice dl dd { width:25%; }
}

@media all and (max-width:767px) {
	#notify .control { left: 15px; bottom: 15px; min-width:100px; }
	#notify .control a:after { content:''; display:block; clear:both; }
	#notify .control a span { display:block; margin:0 auto; width:8px; height:19px; text-indent:-9999px; background-repeat:no-repeat; background-position:center; background-size:100%; }
	#notify .control a { display:inline-block; margin-right:5px; text-align:center; color:#fff; font-size:12px; font-weight:400; font-family:"Rajdhani"; cursor:pointer; width:24px !important; height:24px !important; border:2px solid #eee; border-radius:50%; }
	#notify .control a[role='button'] { transition:0.1s; width: 8px; height: 13px; text-indent: -9999px; overflow: hidden; margin-top: 0px; vertical-align: middle; display: inline-block; position: relative; }
	#notify .control a.play { display: none; }
	#notify .count { margin: 5px 5px 0px 0px; font-size: 15px; }
	#notify .count em { font-size: 16px; }

	.top-notice dl dt { width:100%; }
	.top-notice dl dd { display:none; }
	.top-notice dl dt:first-child { font-size:18px; height:75px; max-height:75px; }
	.top-notice dl dd:nth-child(2) { display:block; }
}










#news { margin-top: 20px; position: relative; }

.qubtnbox a { border:1px solid #e5e5e5; background: rgb(255, 255, 255); border-radius: 50px; width: 100%; height: 100px; text-align: center; color: rgb(18, 11, 42); line-height: 100px; font-size: 16px; font-weight: 500; display: block; box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.0); }
.qubtnbox a::before { background: url("../images/common/sp_new.png") no-repeat -21px -180px / 720px 400px; transition:0.2s; width: 38px; height: 40px; margin-right: 10px; vertical-align: -12px; display: inline-block; content: ""; image-rendering: -webkit-optimize-contrast; }
.pdrl5 { padding:0 5px !important; }
.qubtnbox  a.i02::before { background-position: -102px -180px; }
.qubtnbox  a.i03::before { background-position: -182px -180px; }
.qubtnbox  a.i04::before { background-position: -262px -180px; }
.qubtnbox  a.i05::before { background-position: -341px -180px; }
.qubtnbox  a.i06::before { background-position: -422px -180px; }
.qubtnbox  a:hover::before { transform: scale(1.1); }

/* 4번째 줄바꿈
#news .scutbx a { background: rgb(255, 255, 255); border-radius: 50px; width: 200px; height: 100px; text-align: center; color: rgb(18, 11, 42); line-height: 100px; font-size: 16px; font-weight: 500; margin-right: calc((100% - 600.2px) /2); float: left; display: block; box-shadow: 0px 0px 23px 0px rgba(0,0,0,0.05); }
#news .scutbx a:nth-of-type(3n) { margin-right: 0px; }
#news .scutbx a:nth-of-type(n+4) { margin-top: 20px; }
#news .scutbx a::before { background: url("../images/common/sp_new.png") no-repeat -21px -180px / 720px 400px; transition:0.2s; width: 38px; height: 40px; margin-right: 10px; vertical-align: -12px; display: inline-block; content: ""; image-rendering: -webkit-optimize-contrast; }
*/

#news .scutbx a.i02::before { background-position: -102px -180px; }
#news .scutbx a.i03::before { background-position: -182px -180px; }
#news .scutbx a.i04::before { background-position: -262px -180px; }
#news .scutbx a.i05::before { background-position: -341px -180px; }
#news .scutbx a.i06::before { background-position: -422px -180px; }
#news .scutbx a:hover::before { transform: scale(1.1); }

#news .newsbx { width: 50%; padding-left: 20px; float: left; position: relative; }
#news .newsbx h2 { color: rgb(18, 11, 42); line-height: 1.2; font-size: 30px; font-weight: 700; }
#news .newsbx h2 strong { color: rgb(47, 71, 236); }
#news .newsbx ul { padding-top: 9px; }
#news .newsbx ul a { padding: 0px 120px 0px 13px; height: 35px; line-height: 35px; display: block; position: relative; }
#news .newsbx ul a p { color: rgb(18, 11, 42); overflow: hidden; font-size: 18px; font-weight: 400; white-space: nowrap; -ms-text-overflow: ellipsis; }
#news .newsbx ul a span { top: 50%; right: 0px; color: rgb(133, 132, 137); font-size: 18px; font-weight: 300; display: block; position: absolute; transform: translateY(-50%); }
#news .newsbx ul a::after { background: rgb(47, 71, 236); border-radius: 50%; left: 0px; top: 50%; width: 3px; height: 3px; margin-top: -2.5px; display: block; position: absolute; content: ""; }
#news .newsbx ul a:hover p { text-decoration: underline; }
#news .newsbx ul a:hover span { text-decoration: underline; }
#news .newsbx .more { background: url("../images/common/sp_foundation.png") no-repeat -508px -108px / 720px 480px; transition:0.1s; top: 6px; width: 24px; height: 24px; right: 0px; text-indent: -9999px; overflow: hidden; display: block; position: absolute; }
#news .newsbx .more:hover { transform: rotate(180deg); }

@media all and (max-width:1199px) {
	#news { margin-top: 45px; }
	#news .scutbx { padding-right: 15px; }
	#news .scutbx a { width: calc((100% - 30.2px) /3); height: 80px; line-height: 80px; font-size: 16px; margin-right: 15px; }
	#news .scutbx a:nth-of-type(3n) { margin-right: 0px; }
	#news .scutbx a:nth-of-type(n+4) { margin-top: 20px; }
	#news .scutbx a::before { margin-right: 13px; transform: scale(0.9); }
	#news .newsbx { padding-left: 15px; }
	#news .newsbx h2 { font-size: 26px; }
	#news .newsbx ul { padding-top: 9px; }
	#news .newsbx ul a { padding: 0px 100px 0px 13px; height: 29px; line-height: 28px; }
	#news .newsbx ul a p { font-size: 16px; }
	#news .newsbx ul a span { font-size: 16px; }
	#news .newsbx .more { top: 0px; transform: scale(0.9); }
	#news .newsbx .more:hover { transform: rotate(180deg) scale(0.9); }
}

@media all and (max-width:991px) {
	#news .scutbx { width: 100%; padding-right: 0px; float: none; }
	#news .scutbx a { height: 60px; line-height: 60px; font-size: 15px; }
	#news .scutbx a:nth-of-type(n+4) { margin-top: 15px; }
	#news .scutbx a::before { margin-right: 13px; transform: scale(0.9); }
	#news .newsbx { width: 100%; padding-left: 0px; margin-top: 45px; float: none; }
	#news .newsbx h2 { font-size: 24px; }
	#news .newsbx ul { padding-top: 9px; }
	#news .newsbx ul a { padding: 0px 100px 0px 13px; height: 28px; line-height: 28px; }
	#news .newsbx ul a p { font-size: 15px; }
	#news .newsbx ul a span { font-size: 15px; }
}

@media all and (max-width:767px) {
	#news .scutbx a { width: calc((100% - 15.2px) /2); height: 54px; line-height: 55px; font-size: 15px; }
	#news .scutbx a:nth-of-type(3n) { margin-right: 15px; }
	#news .scutbx a:nth-of-type(2n) { margin-right: 0px; }
	#news .scutbx a:nth-of-type(n+3) { margin-top: 15px; }
	#news .scutbx a::before { margin-right: 10px; vertical-align: -14px; transform: scale(0.85); }
	#news .newsbx h2 { font-size: 22px; }
	#news .newsbx ul { padding-top: 8px; }
	#news .newsbx ul a { padding: 0px 80px 0px 13px; height: 28px; line-height: 28px; }
	#news .newsbx ul a p { font-size: 15px; }
	#news .newsbx ul a span { font-size: 15px; }
	#news .newsbx .more { top: 0px; transform: scale(0.8); }
	#news .newsbx .more:hover { transform: rotate(180deg) scale(0.8); }
}

#info { margin-top: 80px; position: relative; }
#info .diagnosis { padding: 15px 200px 15px 0px; width: 40%; height: 478px; float: left; position: relative; z-index: 2; }
#info .diagnosis::before { background: rgb(223, 232, 255); border-radius: 0px 75px 75px 0px; top: 0px; width: 820px; right: 0px; bottom: 0px; display: block; position: absolute; z-index: -1; content: ""; }
#info .menu { top: 50%; width: 180px; right: 0px; position: absolute; transform: translateY(-50%); }
#info .menu a { transition:0.2s; height: 62px; color: rgb(18, 11, 42); line-height: 62px; padding-left: 20px; font-size: 20px; font-weight: 500; display: block; white-space: nowrap; position: relative; }
#info .menu a::after { background: url("../images/common/sp_new.png") no-repeat -30px -272px / 720px 400px; transition:0.1s; left: 30px; top: 50%; width: 21px; height: 16px; margin-top: -8px; display: block; position: absolute; content: ""; opacity: 0; }
#info .menu a + a { border-top-color: rgb(176, 181, 206); border-top-width: 1px; border-top-style: dashed; }
#info .menu a.active { background: rgb(255, 255, 255); margin: 0px -10px; border-radius: 31px; padding-left: 68px; font-weight: 700; border-top-color: currentColor; border-top-width: 0px; border-top-style: none; box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.05); }
#info .menu a.active + a { border-top-color: currentColor; border-top-width: 0px; border-top-style: none; }
#info .menu a.active::after { opacity: 1; }
#info .menu a:hover { font-weight: 700; }
#info .diagnosis .bx a { display: none; }
#info .diagnosis .bx a img { margin: 0px auto; width: 100%; display: block; max-width: 320px; }
#info .diagnosis .bx h2 { text-align: center; color: rgb(47, 71, 236); line-height: 1.2; font-size: 34px; font-weight: 700; margin-top: 9px; }
#info .diagnosis .bx p { text-align: center; color: rgb(0, 0, 0); line-height: 1.4; font-size: 18px; font-weight: 400; margin-top: 7px; -ms-word-break: keep-all; }
#info .edu { padding: 36px 0px 15px 80px; width: 60%; height: 478px; float: left; position: relative; z-index: 2; }
#info .edu::before { background: rgb(208, 229, 255); border-radius: 75px 0px 0px 75px; left: 40px; top: 0px; width: 1060px; bottom: 0px; display: block; position: absolute; z-index: -1; content: ""; }
#info .edu .video { width: 47%; padding-top: 20px; float: left; }
#info .edu .video h2 { text-align: center; color: rgb(18, 11, 42); line-height: 1.2; font-size: 34px; font-weight: 700; }
#info .edu .video a { margin-top: 17px; display: block; }
#info .edu .video a img { width: 100%; display: block; }
#info .edu .video p { color: rgb(18, 11, 42); line-height: 1.2; overflow: hidden; font-size: 18px; font-weight: 400; margin-top: 17px; white-space: nowrap; -ms-text-overflow: ellipsis; }
#info .lnk { width: 53%; padding-top: 0px; padding-left: 40px; float: left; position: relative; }
#info .lnk img { width: 100%; display: block; max-width: 360px; }
#info .lnk > div { padding-top: 13px; position: relative; }
#info .lnk > div a { padding: 0px 35px 0px 15px; transition:0.2s; width: calc((100% - 30.2px) /3); height: 51px; color: rgb(18, 11, 42); line-height: 51px; font-size: 16px; font-weight: 500; margin-top: 10px; margin-right: 15px; border-bottom-color: rgb(133, 178, 224); border-bottom-width: 2px; border-bottom-style: solid; float: left; white-space: nowrap; position: relative; }
#info .lnk > div a::after { background: url("../images/common/sp_new.png") no-repeat -110px -272px / 720px 400px; top: 50%; width: 21px; height: 16px; right: 15px; margin-top: -8px; display: block; position: absolute; content: ""; }
#info .lnk > div a:nth-of-type(3n) { margin-right: 0px; }
#info .lnk > div a:hover { background: rgb(255, 255, 255); border-color: transparent; border-radius: 26px; }

@media all and (max-width:1199px) {
	#info { margin-top: 48px; }
	#info .diagnosis { padding: 15px 180px 15px 0px; width: 42%; height: 370px; }
	#info .menu { width: 140px; }
	#info .menu a { height: 52px; line-height: 54px; padding-left: 15px; font-size: 16px; }
	#info .menu a::after { transform-origin: 0% 50%; left: 20px; transform: scale(0.8); }
	#info .menu a.active { padding-left: 48px; }
	#info .diagnosis .bx h2 { font-size: 26px; margin-top: 7px; }
	#info .diagnosis .bx p { font-size: 14px; margin-top: 6px; }
	#info .diagnosis .bx p br { display: none; }
	#info .edu { padding: 45px 0px 15px 60px; width: 58%; height: 370px; }
	#info .edu::before { left: 30px; }
	#info .edu .video { padding-top: 15px; }
	#info .edu .video h2 { font-size: 26px; }
	#info .edu .video a { margin-top: 15px; }
	#info .edu .video p { font-size: 16px; margin-top: 15px; }
	#info .lnk { padding-left: 30px; }
	#info .lnk > div { padding-top: 7px; }
	#info .lnk > div a { padding: 0px; width: calc((100% - 20.2px) /3); height: 41px; text-align: center; line-height: 41px; font-size: 15px; margin-top: 6px; margin-right: 10px; border-bottom-color: rgb(133, 178, 224); border-bottom-width: 1px; border-bottom-style: solid; }
	#info .lnk > div a::after { display: none; }
}

@media all and (max-width:991px) {
	#info .diagnosis { padding: 10px 180px 15px 60px; width: 90%; height: 340px; float: none; }
	#info .menu { width: 140px; }
	#info .menu a { height: 46px; line-height: 48px; font-size: 15px; }
	#info .diagnosis .bx h2 { font-size: 24px; margin-top: 8px; }
	#info .diagnosis .bx p { margin-top: 5px; }
	#info .diagnosis .bx p br { display: block; }
	#info .diagnosis .bx a img { margin: 0px auto; max-width: 235px; }
	#info .edu { padding: 15px 0px 15px 60px; width: 90%; height: 340px; margin-top: 25px; float: right; }
	#info .edu::before { left: 0px; }
	#info .edu .video h2 { font-size: 24px; }
	#info .edu .video p { font-size: 15px; }
	#info .lnk > div { padding-top: 8px; }
	#info .lnk > div a { font-size: 14px; }
}

@media all and (max-width:767px) {
	#info { margin-top: 41px; }
	#info .diagnosis { padding: 10px 150px 15px 0px; width: 100%; height: auto; float: none; }
	#info .menu { width: 130px; }
	#info .diagnosis .bx p br { display: none; }
	#info .diagnosis .bx a img { max-width: 190px; }
	#info .diagnosis .bx h2 { font-size: 22px; margin-top: 8px; }
	#info .diagnosis .bx p { font-size: 12px; }
	#info .edu { padding: 0px 0px 15px 30px; width: 100%; height: auto; margin-top: 25px; float: right; }
	#info .edu::before { left: 0px; }
	#info .edu .video h2 { font-size: 22px; }
	#info .edu .video p { font-size: 14px; }
	#info .lnk > div { padding-top: 8px; }
	#info .lnk > div a { font-size: 14px; }
	#info .diagnosis::before { border-radius: 0px 30px 30px 0px; }
	#info .edu::before { border-radius: 30px 0px 0px 30px; }
}

@media all and (max-width:500px) {
	#info .edu .video { width: 100%; float: none; }
	#info .lnk { width: 100%; padding-left: 0px; margin-top: 25px; float: none; }
	#info .edu .video a { margin: 15px auto 0px; max-width: 260px; }
	#info .lnk img { margin: 0px auto; max-width: 220px; }
	#info .lnk > div { padding-top: 5px; }
	#info .lnk > div::before { background: rgb(0, 0, 0); left: 0px; top: -2px; height: 2px; right: 0px; display: block; position: absolute; content: ""; }
	#info .lnk > div a { padding: 0px 30px 0px 15px; height: 38px; text-align: left; line-height: 38px; margin-top: 5px; }
	#info .lnk > div a::after { transform-origin: 100% 50%; display: block; transform: scale(0.8); }
}

#support { margin-top: 30px; position: relative; }
#support h2 { margin: 0px auto; text-align: center; color: rgb(18, 11, 42); line-height: 1.2; font-size: 25px; font-weight: 600; padding-bottom: 10px; position: relative; max-width: 1400px; }
#support h2 span { background: rgb(245, 247, 252); padding: 0px 25px; display: inline-block; position: relative; }
#support h2 strong { color: rgb(146, 67, 150); }


@media all and (max-width:1199px) {
	#support { margin-top: 30px; }
	#support h2 { font-size: 25px; }
	#support h2 span { padding: 0px 20px; }
}

@media all and (max-width:991px) {
	#support h2 { font-size: 20px; }
	#support h2 span { padding: 0px 15px; }
}

@media all and (max-width:767px) {
	#support h2 { font-size: 20px; }
	#support h2::before { left: 15px; right: 15px; }
}





#app::before { left: 0px; height: 560px; right: 0px; bottom: 0px; display: block; position: absolute; z-index: -1; content: ""; }
#app h2 { margin: 10px auto 0; text-align: center; color: rgb(18, 11, 42); line-height: 1.2; font-size: 30px; font-weight: 600; position: relative; max-width: 1400px; }
#app h2 span { background: rgb(245, 247, 252); padding: 0px 25px; display: inline-block; position: relative; }
#app h2 strong { color: rgb(47, 71, 236); }
#app h2::before { background: rgb(199, 206, 226); left: 0px; top: 50%; height: 1px; right: 0px; display: block; position: absolute; content: ""; }
#app .slick { overflow: hidden; margin-top: 5px; position: relative; }
#app .slick .slick-list { margin: 0px -20px; padding: 20px 0px 40px; }

#app .slide { margin: 0px 20px; border-radius: 20px; transition:0.3s; overflow: hidden; box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.03); }
#app .slide .ibx { position: relative; }
#app .slide .ibx img { width: 100%; display: block; }

#app .slide .ibx-1 { position: relative; width: 100%; display: block; font-weight: 500; background:#377d3c; text-align: center; color: #fff; padding:10px 0; } /* 유치부  */
#app .slide .ibx-2 { position: relative; width: 100%; display: block; font-weight: 500; background:#924396; text-align: center; color: #fff; padding:10px 0; } /* 초등 저학년 */
#app .slide .ibx-3 { position: relative; width: 100%; display: block; font-weight: 500; background:#e86457; text-align: center; color: #fff; padding:10px 0; } /* 초등 고학년 */
#app .slide .ibx-4 { position: relative; width: 100%; display: block; font-weight: 500; background:#60aadd; text-align: center; color: #fff; padding:10px 0; } /* 청소년 */
#app .slide .ibx-5 { position: relative; width: 100%; display: block; font-weight: 500; background:#495672; text-align: center; color: #fff; padding:10px 0; } /* 기타 */

#app .slide .pro-info { background: rgb(255, 255, 255); padding: 15px 20px; border-top:1px solid #f9f9f9; position: relative; }
#app .slide .pro-info dl { margin-bottom: 8px; font-size: 16px; display: flex; }
#app .slide .pro-info dl:last-of-type { margin-bottom: 0px; }
#app .slide .pro-info dt { flex:0 0 auto; width: 60px; font-weight: 300; font-size: 13px; color: rgb(102, 102, 102); }
#app .slide .pro-info dd { width: calc(100% - 60px); font-size: 13px; color: rgb(102, 102, 102); }

#app .slide .items-btn { background: rgb(12, 117, 222); height: 55px; text-align: center; color: rgb(255, 255, 255); line-height: 50px; font-size: 16px; font-weight: 500; display: block; z-index: 1; }
#app .slide .items-btn:hover { background: rgb(49, 80, 167); } 
#app .slide .items-btn.closed { background: rgb(153, 153, 153); }
#app .slide .items-btn.wait { background: rgb(255, 255, 255); border-color: rgb(10, 158, 76); color: rgb(10, 158, 76); }

#app .slide p { background: rgb(255, 255, 255); padding: 15px 20px; position: relative; }
#app .slide p strong { color: rgb(42, 42, 42); line-height: 1.2; font-size: 18px; font-weight: 500; margin-top: 0px; display: block;  }

#app .slide:hover { text-decoration: none; box-shadow: 0px 0px 25px 0px rgba(0,0,0,0.15); transform: translateY(10px); }
#app .slide:hover .ibx::after { opacity: 0; }
#app .slide:hover p { text-decoration: none; }

#app .arrow { background: url("../images/common/sp_new.png") no-repeat -264px -249px / 720px 400px; left: -60px; top: 50%; width: 33px; height: 63px; text-indent: -9999px; overflow: hidden; margin-top: -25px; display: block; position: absolute; }
#app .arrow.next { left: auto; right: -70px; background-position-x: -344px; }
#app .arrow:active { transform: scale(0.9); }

@media all and (max-width:1199px) {
	#app { padding-bottom: 30px; margin-top: 48px; }
	#app::before { height: 443px; }
	#app h2 { font-size: 28px; }
	#app h2 span { padding: 0px 20px; }
	#app h2::before { left: 20px; right: 20px; }
	#app .slick { margin-top: 0px; margin-right: -140px; }
	#app .slick .slick-list { margin: 0px -10px; padding: 35px 0px 30px; }
	#app .slide { margin: 0px 10px; box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.03); }
	.arrow#app { display: none; }
	#app .slide .pro-info { padding: 15px 10px; }
	#app .slide p { padding: 18px 10px; }
	#app .slide p strong { font-size: 20px; margin-top: 11px; }
	#app .slide.ing p::after { transform-origin: 100% 0%; top: 15px; right: 15px; transform: scale(0.85); }
	#app .slide:hover { box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.15); transform: translateY(0px); }
	#app .slide.slick-current .ibx::after { opacity: 0; }
}

@media all and (max-width:991px) {
	#app::before { height: 380px; }
	#app h2 { font-size: 24px; }
	#app h2 span { padding: 0px 15px; }
	#app .slick { margin-right: -90px; }
	#app .slide .pro-info { padding: 15px 10px; }
	#app .slide p { padding: 15px 10px; }
	#app .slide p strong { font-size: 16px; margin-top: 10px; }
	#app .slide.ing p::after { top: 15px; right: 15px; transform: scale(0.8); }
}

@media all and (max-width:767px) {
	#app::before { height: 446px; }
	#app h2 { font-size: 22px; }
	#app .slick { margin-right: -220px; }
	#app .slick .slick-list { margin: 0px -8px; padding: 30px 0px 25px; }
	#app .slide .pro-info { padding: 13px 10px; }
	#app .slide { margin: 0px 8px; }
	#app .slide p { padding: 13px 10px 13px 15px; }
	#app .slide p strong { margin-top: 9px; }
	#app .slide.ing p::after { top: 10px; right: 10px; transform: scale(0.7); }
}

/* KOPACK 기술지원 */
.three_con .wrapper::after { clear: both; display: block; content: ""; }
.three_con .wrapper > div { float: left; }
.three_con .wrapper > div > div { float: left; }
.three_con .tit::before { background: url("../images/main/ico_tit_deco.png") no-repeat left top / 100%; left: 0px; top: 0px; width: 120px; height: 122px; position: absolute; content: ""; }
.three_con .tit { padding: 40px 0px 0px 40px; width: 250px; position: relative; }
.three_con .tit p.tit_t1 { font-size: 30px; font-weight: 600; color: rgb(43, 44, 54); line-height: 1.1em;  margin-bottom: 2px;  }
.three_con .tit p.tit_t1 span { color:#345cad; }
.three_con .tit p.tit_t3 { font-size: 16px; color: rgb(121, 121, 121); line-height: 1.3; margin-top: 14px; display: block; }
.three_con .three_link::after { clear: both; display: block; content: ""; }
.three_con .three_link { width: calc(100% - 300px); margin-left: 50px; }
.three_con .three_link > div { width: 31.8%; height: 180px; margin-left: 2.0%; float: left; position: relative; }
.three_con .three_link > div:hover a::after, .three_con .three_link > div.on a::after { left: 0px; top: 0px; width: 100%; height: 100%; position: absolute; z-index: 55; content: ""; }
.three_con .three_link > div:first-child { margin-left: 0% !important; }
.three_con .three_link > div a { padding: 25px 20px 0px 20px; width: 100%; height: 100%; color: rgb(255, 255, 255); display: block; position: relative; word-break: keep-all; }
.three_con .three_link > div strong { font-size: 22px; }
.three_con .three_link > div p { line-height: 1.5; font-size: 14px; margin-top: 10px; }
.three_con .three_link > div .more { background: url("../images/main/ico_go.png") no-repeat center / 100%; bottom: 30px; width: 66px; height: 14px; right: 20px; text-indent: -9999px; position: absolute; }
.three_con .three_link .link01 { background-color: rgb(38, 53, 95); }
.three_con .three_link .link02 { background-color: rgb(52, 92, 173); }
.three_con .three_link .link03 { background-color: rgb(58, 145, 201); }
.three_con .three_link .link04 { background-color: rgb(74, 158, 163); }
.three_con .three_link .link01:hover { background-color: rgb(0, 0, 0); }
.three_con .three_link .link02:hover { background-color: rgb(0, 0, 0); }
.three_con .three_link .link03:hover { background-color: rgb(0, 0, 0); }
.three_con .three_link .link04:hover { background-color: rgb(0, 0, 0); }
 
@media all and (max-width:1399px) {
	.three_con .tit p.tit_t1 { font-size: 27px; }
	.three_con .tit p.tit_t3 { font-size: 14px; }
	.three_con .three_link { width: calc(100% - 270px); margin-left: 20px; }
	.three_con .three_link > div a { padding: 25px 20px 0px 20px; }
	.three_con .three_link > div strong { font-size: 22px; }
	.three_con .three_link > div p { font-size: 13px; }
}

@media all and (max-width:1199px){
	.three_con .tit {width:100%; padding:35px 0 0 40px; margin-bottom:20px;}
	.three_con .tit p br {display:none;}
	.three_con .tit p.tit_t3 {  margin-top: 5px; }
	.three_con .three_link {width:100%; margin-top:15px; margin-left:0;}
	.three_con .three_link > div:first-child { margin-left: 0% !important; }
	.three_con .three_link > div strong {font-size:20px;}
	.three_con .three_link > div .more {top:137px; width:45px;}
}

@media all and (max-width:991px){
	.three_con .tit p br, .three_con .three_link > div p br {display:none;}
	.three_con .three_link {width:100%; margin-top:15px; margin-left:0;}
}

@media all and (max-width:767px){
	.three_con .tit:before {width:100px; height:102px;}
	.three_con .tit {padding:30px 0 0 30px; font-size:20px; }
	.three_con .tit p br  {display:none;}
	
	.three_con .three_link {width:100%; margin-top:5px; margin-left:0;}
	.three_con .three_link > div { width: 100%; height: 130px; margin-left: 0%; margin-bottom:2px; position: relative; }
	.three_con .three_link > div p {margin-top:10px;}
	.three_con .three_link > div .more {top:inherit; bottom:20px;}
}



@media all and (max-width:991px) {
	.mobile_height_auto { height: auto !important; }
	.mobile_height_auto .fp-tableCell { padding: 45px 0px !important; height: auto !important; }
	.mtitle {
		font-size: 25px; font-weight: 700;
	}
}


/* Family Site */
.brand_roll { min-height:100px; padding:0px; }
.brand_roll:after {content:''; display:block; clear:both;}

.brand_roll .ctrl { float:left; width:170px; padding-top:29px; height:82px; }
.brand_roll .ctrl ul{ display:flex; }
.brand_roll .ctrl ul li{ width: 42px; height: 42px; border: #dedee3 solid 1px; background-color: #fff; text-align: center; margin-right: 2px; line-height: 42px; }
.brand_roll .ctrl ul li a { background-position:center 5px; background-size:16px 30px; }
.brand_roll .ctrl a {display:inline-block; width:20px; height:35px; text-indent:-9999px; background-repeat:no-repeat; background-size:100%;}
.brand_roll .ctrl .ctrl01 {background-image:url(../images/main/ico_slide_left02.png);}
.brand_roll .ctrl .ctrl02 {background-image:url(../images/main/ico_slide_pause.png);}
.brand_roll .ctrl .ctrl05 {background-image:url(../images/main/ico_slide_stop.png);}
.brand_roll .ctrl .ctrl03 {background-image:url(../images/main/ico_slide_right02.png);}
.brand_roll .ctrl .ctrl04 {background-image:url(../images/main/ico_plus05.png);}
.brand_roll .inner{display:flex;align-items:center;}
.brand_roll ul li:hover {border:1px solid #494949;}

.brand_roll .scroll { float:left; width:100%; padding:0px; margin-top:18px; height:50px; border-left:0px solid #ff0000; }
.brand_roll .scroll .bxslider { border-left:0px solid #eee; padding:0px; margin:0; }
.brand_roll .scroll .bxslider li { display:inline-block; width:180px !important; margin-right:10px; border:1px solid #eee; }
.brand_roll .scroll .bxslider li img { width:178px !important; height:48px !important; }
.bx-controls-direction { display:none; }

@media all and (max-width:1399px){
	.brand_roll .scroll { width:100%; }
	.brand_roll .scroll ul {width:100%; padding-left:25px;}
	.brand_roll .scroll ul li {display:inline-block; float:none; overflow:hidden;}
	.brand_roll .scroll {width:calc(100% - 125px); overflow:hidden; overflow-x:auto; overflow-y:hidden; white-space:nowrap;}

	.brand_roll .ctrl{ width:200px;margin-right:10px; }
	.brand_roll .scroll { width:100%; }

	.bxslider li{margin-right:12px;}
}

@media all and (max-width:991px){
	.brand_roll .scroll {width:90%;}
}

@media all and (max-width:767px){
	.brand_roll .ctrl{width:170px;}
	.brand_roll .scroll {width:100%;}
}