@charset "utf-8";
@import url("common_ver2.css");
/* NHN INS Webstandard dev team dog 100804 */

/** 메인비주얼 **/
#visual {position:relative; width:100%; max-width:640px; clear:both; overflow:hidden; margin:0 auto; }

	.jssorb05 {position: absolute; bottom:22px; left:50%; z-index:999;}
	.jssorb05 div, 
	.jssorb05 div:hover, 
	.jssorb05 .av {position: absolute; width: 15px; height: 15px; border-radius:100px;
	background:#fff; overflow: hidden; cursor: pointer; padding:0; opacity:.4; filter: alpha(opacity=100); }
	.jssorb05 div {  }
	.jssorb05 div:hover, .jssorb05 .av:hover {}
	.jssorb05 .av, .jssorb05 .av:hover {background-color: #9cae10; opacity: 1; filter: alpha(opacity=100);}
	.jssorb05 .dn, .jssorb05 .dn:hover {background-color: #9cae10; opacity: 1; filter: alpha(opacity=100);} 


.cont01 {position:relative; padding:30px 15px;}
.cont01 .cont01_top{overflow:hidden;}
.cont01 .cont01_top p { float:left; width:49.5%; margin-bottom:1%;}
.cont01 .cont01_top p:nth-child(2n){margin-left:1%;}
.cont01 .cont01_top p.one{background:url('/m/img/cont01_banner01.gif') 90% 50% no-repeat; background-size:60px}
.cont01 .cont01_top p.two{background:url('/m/img/cont01_banner02.gif') 90% 50% no-repeat; background-size:60px}
.cont01 .cont01_top p.three{background:url('/m/img/cont01_banner03.gif') 90% 50% no-repeat; background-size:60px}
.cont01 .cont01_top p.four{background:url('/m/img/cont01_banner04.gif') 90% 50% no-repeat; background-size:60px}
.cont01 .cont01_top p a{display:block; box-sizing:border-box; border:1px solid #ddd; font-size:19px; letter-spacing:-0.5pt; font-family:NotoKR-Bold; color:#444; padding:15px;}
.cont01 .cont01_top p a span{display:block; width:34px; height:34px; background:url('/img/btn_more2.gif') no-repeat; background-size:100%; margin-top:10px}

.cont01 .cont01_bottom {position:relative; overflow:hidden;}
.cont01_bottom .notice {padding:20px 0}
	.cont01_bottom .notice .title {border-bottom:3px solid #444; overflow:hidden; box-sizing:border-box; }
	.cont01_bottom .notice .title h3 {float:left;}
	.cont01_bottom .notice .title h3 a{display:inline-block; font-size:19px; font-weight:400; color:#999; line-height:100%; cursor:pointer}
	.cont01_bottom .notice .title h3 a:first-child{background:url('/m/img/notice_line.gif') right 5px no-repeat; padding-right:12px; margin-right:12px; letter-spacing:-0.5pt;}
	.cont01_bottom .notice .title h3 a.title_on{font-size:19px; font-family:NotoKR-Bold; font-weight:400; color:#444; line-height:100%;}
	.cont01_bottom .notice .title a.more { display:block; float:right; padding-bottom:8px;}
	.cont01_bottom .notice ul li {position:relative; border-bottom:1px dashed #d4d4d4; padding:10px 0 8px 0; overflow:hidden;}
	.cont01_bottom .notice ul li:first-child { padding-top:15px; }
	.cont01_bottom .notice ul li:last-child { border:none; } 
	.cont01_bottom .notice ul li a {display:inline-block; width:100%; max-width:calc(100% - 80px); font-size:14px; line-height:120%; color:#666; letter-spacing:-0.4pt;}
	.cont01_bottom .notice ul li span {float:right; width:75px; text-align:right; font-size:13px; color:#888;}

	.cont01_bottom .video {position:relative;  width:100%; height:340px; }
	.cont01_bottom .video ul { overflow:hidden; }
	.cont01_bottom .video ul li {float:left; width:640px; max-width:640px; height:340px;}
	.cont01_bottom .video iframe {width:100%; max-width:640px;}
	.cont01_bottom .video .arrow_prev { position:absolute; top:50%; margin-top:-33px; left:0; z-index:9999; cursor:pointer;}
	.cont01_bottom .video .arrow_next { position:absolute; top:50%; margin-top:-33px; right:0; z-index:9999;  cursor:pointer;}

.cont02 { background:#f0f0f0; padding:40px 15px; }
.cont02 .cont_title { background:url(/m/img/cont02_title.gif) no-repeat center center; font-size:30px; font-weight:800; color:#333; font-family: 'Montserrat', sans-serif; line-height:100%; text-align:center; margin-bottom:30px;}

.cont02 .sns_in { overflow:hidden;}
.cont02 .sns_in .facebook { width:100%; margin-bottom:10px}
.cont02 .sns_in .facebook h3 { font-size:0; background:#3b5998; width:100%; line-height:55px; padding:0 0 0 14px;}
.cont02 .sns_in .facebook .inside { width:100%; height:350px; background:#fff; text-align:center}

.cont02 .sns_in .instagram { width:100%; margin-bottom:10px}
.cont02 .sns_in .instagram h3 { font-size:0; background:url('/m/img/title_instagram_bg.gif') repeat-x; width:100%; line-height:55px; padding:0 0 0 14px; box-sizing:border-box;}
.cont02 .sns_in .instagram h3 span { font-size:13px; float:right; margin-right:15px; color:#fff; font-family: 'Montserrat', sans-serif; line-height:55px; }
.cont02 .sns_in .instagram .inside { width:100%; background:#fff; }
.cont02 .sns_in .instagram .inside ul { padding:14px 11px; overflow:hidden; }
.cont02 .sns_in .instagram .inside ul li { width:33%; height:auto; float:left; margin:0 0.5% 0.5% 0;}
.cont02 .sns_in .instagram .inside ul li img{width:100%;}
.cont02 .sns_in .instagram .inside ul li:nth-child(3n) { margin-right:0; }

.cont02 .sns_in .blog {width:100%; }
.cont02 .sns_in .blog h3 { font-size:0; background:#34bc1d; width:100%; line-height:55px; padding:0 0 0 14px;}
.cont02 .sns_in .blog .inside { width:100%; background:#fff; }
.cont02 .sns_in .blog .inside ul { padding:20px 15px 10px 15px; width:100%; box-sizing:border-box; }
.cont02 .sns_in .blog .inside ul li {padding-bottom:10px; overflow:hidden; width:100%;}
.cont02 .sns_in .blog .inside ul li .img { width:100px; margin-right:15px; float:left;}
.cont02 .sns_in .blog .inside ul li .txt {width:calc(100% - 115px); float:right; padding-top:2px;}
.cont02 .sns_in .blog .inside ul li .txt h4 {font-weight:100; font-size:15px; padding-top:2px; letter-spacing:-0.5pt; color:#444; width:100%; text-overflow: ellipsis;-o-text-overflow: ellipsis;white-space:nowrap;overflow:hidden;word-wrap:normal;}
.cont02 .sns_in .blog .inside ul li .txt p { font-size:12px; line-height:18px; letter-spacing:-0.5pt; color:#666; padding:5px 0 10px 0; }
.cont02 .sns_in .blog .inside ul li .txt span.more {display:none}


.cont03 { padding:40px 15px; }
.cont03 .cont_title { background:url('/m/img/cont03_title.gif') no-repeat center center; font-size:28px; font-family:NotoKR-Bold; font-weight:400; line-height:100%; text-align:center; margin-bottom:20px; color:#333; letter-spacing:-0.5pt;}
.cont03 .cont03_list { overflow:hidden; }
	.cont03_list li {position:relative; float:left; width:32%; margin:0 0.5% 0.5% 0;}
	/*.cont03_list li:nth-child(3n+4) { margin-right:0; }*/
	.cont03_list li .img {position:relative; box-sizing:border-box; border:1px solid #ddd;}
	.cont03_list li .img p { position:absolute; top:5px; left:5px; width:70px; background-size:contain; background-position:left top; background-repeat:no-repeat;}
	.cont03_list li .img p img {max-width:70px; max-height:35px;}
	.cont03_list li .img img { width:100%; }
	.cont03_list li .txt {width:100%; box-sizing:border-box; border-left:1px solid #ddd; border-right:1px solid #ddd; border-bottom:1px solid #ddd; padding:15px 12px; height:56px; position:relative;}
	.cont03_list li .txt .txt_inner {vertical-align:middle; display:block;  }
	.cont03_list li .txt h4 {font-weight:100; font-size:14px; letter-spacing:-0.75pt; color:#333; width:100%; max-width:calc(100% - 25px);}
	.cont03_list li .txt h4 a {letter-spacing:-0.75pt; color:#333;}
	.cont03_list li .txt span {display:none}
	.cont03_list li .txt p.more {position:absolute; right:12px; top:12px;}
	.cont03_list li .txt p.more img{width:25px}

/* 공지체크 게시물 - 6개 까지는 크게 */
.cont03_list .thum {width:100%; overflow:hidden;}
.cont03_list .thum li {float:left; width:49% !important; margin:0 0.5% 0.5% 0;}
.cont03_list .thum li .img p {width:175px;}
.cont03_list .thum li .img p img {max-width:175px; max-height:87px;}
.cont03_list .thum li .txt h4 { font-size:17px;}
.cont03_list .thum li .txt p.more { position:absolute; right:12px; top:12px; }


/* 4개 까지는 크게 */

/*.cont03_list li:nth-child(2) { width:49.75%; margin:0 0 0.5% 0;}
.cont03_list li:nth-child(2) .img p {width:80px;}
.cont03_list li:nth-child(2) .txt h4 { font-size:17px;}
.cont03_list li:nth-child(2) .txt p.more { position:absolute; right:12px; top:12px; }

.cont03_list li:nth-child(3) { width:49.75%; margin:0 0.5% 3% 0;}
.cont03_list li:nth-child(3) .img p {width:80px;}
.cont03_list li:nth-child(3) .txt h4 { font-size:17px;  }
.cont03_list li:nth-child(3) .txt p.more { position:absolute; right:12px; top:12px; }

.cont03_list li:nth-child(4) { width:49.75%; margin:0 0 3% 0;}
.cont03_list li:nth-child(4) .img p {width:80px;}
.cont03_list li:nth-child(4) .txt h4 { font-size:17px;}
.cont03_list li:nth-child(4) .txt p.more { position:absolute; right:12px; top:12px; }*/





/*******************************************************************************
	@media 320px~ 480px
*******************************************************************************/
@media all and (max-width:480px) {

.cont01 {padding:20px 10px;}
.cont01 .cont01_top p.one{background:url('/m/img/cont01_banner01.gif') 92% 73% no-repeat; background-size:45px}
.cont01 .cont01_top p.two{background:url('/m/img/cont01_banner02.gif') 92% 73% no-repeat; background-size:45px}
.cont01 .cont01_top p.three{background:url('/m/img/cont01_banner03.gif') 92% 73% no-repeat; background-size:45px}
.cont01 .cont01_top p.four{background:url('/m/img/cont01_banner04.gif') 92% 73% no-repeat; background-size:45px}
.cont01 .cont01_top p a{font-size:14px; letter-spacing:-0.5pt; padding:15px 10px;}
.cont01 .cont01_top p a span{width:26px; height:26px; margin-top:8px}

.cont01_bottom .notice .title h3 a{font-size:15px;}
.cont01_bottom .notice .title h3 a:first-child{background:url('/m/img/notice_line.gif') right 4px no-repeat;}
.cont01_bottom .notice .title h3 a.title_on{font-size:15px;}
.cont01_bottom .notice .title a.more {padding-bottom:5px;}
.cont01_bottom .notice ul li{padding:8px 0; }
.cont01_bottom .notice ul li:first-child { padding-top:11px; }
.cont01_bottom .notice ul li a { font-size:13px; }
.cont01_bottom .notice ul li span { font-size:12px;}

.cont01_bottom .video {height:325px; }
.cont01_bottom .video ul li {width:440px; max-width:440px; height:325px;}
.cont01_bottom .video iframe {width:100%; max-width:440px;}

.cont02 {padding:30px 10px; }
.cont02 .cont_title {font-size:25px; margin-bottom:22px;}

.cont02 .sns_in .facebook h3 {line-height:48px; padding:0 0 0 12px;}
.cont02 .sns_in .facebook .inside { width:100%; height:350px; background:#fff; text-align:center}

.cont02 .sns_in .instagram h3 {line-height:48px; padding:0 0 0 12px;}
.cont02 .sns_in .instagram h3 span { font-size:12px; margin-right:12px; line-height:48px; }
.cont02 .sns_in .instagram .inside ul { padding:12px 11px;}

.cont02 .sns_in .blog h3 {line-height:48px; padding:0 0 0 12px;}
.cont02 .sns_in .blog .inside ul { padding:16px 12px 8px 12px;}
.cont02 .sns_in .blog .inside ul li .img {margin-right:12px;}
.cont02 .sns_in .blog .inside ul li .txt {width:calc(100% - 112px);}
.cont02 .sns_in .blog .inside ul li .txt h4 { font-size:13px;}
.cont02 .sns_in .blog .inside ul li .txt p { font-size:12px;}


.cont03 { padding:30px 10px; }
.cont03 .cont_title {font-size:23px;}
	.cont03_list li .img p {width:50px;}
	.cont03_list li .img p img {max-width:50px; max-height:25px;}
	.cont03_list li .txt {padding:8px 10px 6px 10px; height:33px;}
	.cont03_list li .txt h4 {max-width:100%;}

	.cont03_list li .txt h4 a {font-size:12px; height:15px; line-height:15px;}
	.cont03_list li .txt p.more {display:none}

.cont03_list .thum li .img p {width:88px;}
.cont03_list .thum li .img p {max-width:88px; max-height:44px;}
.cont03_list .thum li .txt h4 { font-size:14px;}

/* 4개 까지는 크게 */
/*.cont03_list li:nth-child(1) .img p {width:65px;}
.cont03_list li:nth-child(1) .txt h4 { font-size:14px;}

.cont03_list li:nth-child(2) .img p {width:65px;}
.cont03_list li:nth-child(2) .txt h4 { font-size:14px;}

.cont03_list li:nth-child(3) .img p {width:65px;}
.cont03_list li:nth-child(3) .txt h4 { font-size:14px;  }

.cont03_list li:nth-child(4) .img p {width:65px;}
.cont03_list li:nth-child(4) .txt h4 { font-size:14px;}*/


}

/*******************************************************************************
	@media 414px
*******************************************************************************/
@media all and (max-width:414px) {

.cont01_bottom .video ul li {width:400px; max-width:400px;}
.cont01_bottom .video iframe {max-width:400px;}

}


/*******************************************************************************
	@media 375px
*******************************************************************************/
@media all and (max-width:375px) {

.cont01_bottom .video ul li {width:360px; max-width:360px;}
.cont01_bottom .video iframe {max-width:360px;}

}


/*******************************************************************************
	@media 360px
*******************************************************************************/
@media all and (max-width:360px) {

.cont01_bottom .video ul li {width:340px; max-width:340px;}
.cont01_bottom .video iframe {max-width:340px;}

}