@charset "euc-kr";
@import url('https://fonts.googleapis.com/earlyaccess/notosanskr.css'); 
@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanumpenscript.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(https://fonts.googleapis.com/css?family=Nanum+Gothic:400,700,800|Noto+Sans+KR:100,300,400,500,700,900&subset=korean);
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);

/* =================reset css starts here=================  */

* {
	margin: 0;
	padding: 0;

	font-family: 'NanumSquare','NanumGothic', 'NanumBarunGothic','Noto Sans KR',dotum,'µ¸¿ò',sans-serif;
	word-break: keep-all; /*word-break: break-all;*/

	// Prevent from blinking when clicked
	-webkit-tap-highbase-color-light: $full-transparent;
}



/* --- webfont --- */
@font-face {/* ±¹¹® light */
  font-family: 'Noto Sans KR'; 
  font-weight:300;
  src:local(¡Ø), url(/main/inc/fonts/NotoSansKR-Light.woff) format('woff');
}

@font-face {/* ±¹¹® Regular */
  font-family: 'Noto Sans KR'; 
  font-weight:500;
  src:local(¡Ø), url(/main/inc/fonts/NotoSansKR-Regular.woff) format('woff');
}

@font-face {/* ±¹¹® Medium */
  font-family: 'Noto Sans KR'; 
  font-weight:700;
  src:local(¡Ø), url(/main/inc/fonts/NotoSansKR-Medium.woff) format('woff');
}



@font-face {
  font-family: 'NanumGothic';
  font-style: normal;
  font-weight: 700;
  src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Bold.eot);
  src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Bold.eot?#iefix) format('embedded-opentype'),
       url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Bold.woff2) format('x-woff2'),
       url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Bold.woff) format('woff'),
       url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Bold.ttf) format('truetype');
}
@font-face {
  font-family: 'NanumGothic';
  font-style: normal;
  font-weight: 400;
  src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.eot);
  src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'),
       url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.woff2) format('x-woff2'),
       url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.woff) format('woff'),
       url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.ttf) format('truetype');
}
@font-face {
  font-family: 'NanumGothic';
  font-style: normal;
  font-weight: 800;
  src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-ExtraBold.eot);
  src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-ExtraBold.eot?#iefix) format('embedded-opentype'),
       url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-ExtraBold.woff2) format('x-woff2'),
       url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-ExtraBold.woff) format('woff'),
       url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-ExtraBold.ttf) format('truetype');
}




@font-face {
  font-family: 'NanumBarunGothic';
  font-style: normal;
  font-weight: 400;
  src: url(./NanumBarunGothic.eot);
  src: local('NanumBarunGothic'),
       local('NanumBarunGothic'),
       url(/main/inc/fonts/NanumBarunGothic.eot?#iefix) format('embedded-opentype'),
       url(/main/inc/fonts/NanumBarunGothic.woff2) format('woff2'),
       url(/main/inc/fonts/NanumBarunGothic.woff) format('woff'),
       url(/main/inc/fonts/NanumBarunGothic.ttf) format('truetype');
}
@font-face {
  font-family: 'NanumBarunGothic';
  font-style: normal;
  font-weight: 500;
  src: url(./NanumBarunGothic.eot);
  src: local('NanumBarunGothic'),
       local('NanumBarunGothic'),
       url(/main/inc/fonts/NanumBarunGothic.eot?#iefix) format('embedded-opentype'),
       url(/main/inc/fonts/NanumBarunGothic.woff2) format('woff2'),
       url(/main/inc/fonts/NanumBarunGothic.woff) format('woff'),
       url(/main/inc/fonts/NanumBarunGothic.ttf) format('truetype');
}


@font-face {
  font-family: 'NanumBarunGothicBold';
  font-style: bold;
  font-weight: 600;
  src: url(./NanumBarunGothicBold.eot);
  src: local('NanumBarunGothicBold'),
       local('NanumBarunGothicBold'),
       url(/main/inc/fonts/NanumBarunGothicBold.eot?#iefix) format('embedded-opentype'),
       url( /main/inc/fonts/NanumBarunGothicBold.woff2) format('woff2'),
       url(/main/inc/fonts/NanumBarunGothicBold.woff) format('woff'),
       url(/main/inc/fonts/NanumBarunGothicBold.ttf) format('truetype');
}
@font-face {
  font-family: 'NanumBarunGothicBold';
  font-style: bold;
  font-weight: 700;
  src: url(./NanumBarunGothicBold.eot);
  src: local('NanumBarunGothicBold'),
       local('NanumBarunGothicBold'),
       url(/main/inc/fonts/NanumBarunGothicBold.eot?#iefix) format('embedded-opentype'),
       url( /main/inc/fonts/NanumBarunGothicBold.woff2) format('woff2'),
       url(/main/inc/fonts/NanumBarunGothicBold.woff) format('woff'),
       url(/main/inc/fonts/NanumBarunGothicBold.ttf) format('truetype');
}


@font-face {
 font-family: 'NanumSquare';
 font-weight: 300;
 src: url(/main/inc/fonts/NanumSquareL.eot);
 src: url(/main/inc/fonts/NanumSquareL.eot?#iefix) format('embedded-opentype'),
      url(/main/inc/fonts/NanumSquareL.woff) format('woff'),
      url(/main/inc/fonts/NanumSquareL.ttf) format('truetype');
}

@font-face {
 font-family: 'NanumSquare';
 font-weight: 500;
 src: url(/main/inc/fonts/NanumSquareR.eot);
 src: url(/main/inc/fonts/NanumSquareR.eot?#iefix) format('embedded-opentype'),
      url(/main/inc/fonts/NanumSquareR.woff) format('woff'),
      url(/main/inc/fonts/NanumSquareR.ttf) format('truetype');
}
@font-face {
 font-family: 'NanumSquare';
 font-weight: 700;
 src: url(/main/inc/fonts/NanumSquareB.eot);
 src: url(/main/inc/fonts/NanumSquareB.eot?#iefix) format('embedded-opentype'),
      url(/main/inc/fonts/NanumSquareB.woff) format('woff'),
      url(/main/inc/fonts/NanumSquareB.ttf) format('truetype');
}
@font-face {
 font-family: 'NanumSquare';
 font-weight: 800;
 src: url(/main/inc/fonts/NanumSquareEB.eot);
 src: url(/main/inc/fonts/NanumSquareEB.eot?#iefix) format('embedded-opentype'),
      url(/main/inc/fonts/NanumSquareEB.woff) format('woff'),
      url(/main/inc/fonts/NanumSquareEB.ttf) format('truetype');
}


@font-face {
	font-family: 'Nanum Gothic';
	src: url(/main/inc/fonts/NanumGothic.eot);
	src: url(/main/inc/fonts/NanumGothic.eot?#iefix) format('embedded-opentype'),
		 url(/main/inc/fonts/NanumGothic.woff) format('woff'),
	  	 url(/main/inc/fonts/NanumGothic.ttf) format('truetype');
}


@media only screen and (min-width: 480px) {
  
   .visible-mobile { display:none;}
   .hidden-mobile {visibility: visible; opacity: 1; } 
  
  }

@media only screen and (max-width: 479px) {
  
   .visible-mobile { visibility: visible; opacity: 1;}
   .hidden-mobile { display:none;} 
  
  }



/* =================reset css ends here================= */


/* =================core css starts here================= */

/*body {
	padding:0;
	margin:0;
	top:0;
    font-size: 15px;
    line-height: 140%;
    font-weight: 300;
    font-family: 'NanumSquare','Nanum Gothic';
    color: #333;
    background: #fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}*/


/* ÃʱâÈ­ */
html {width:100%; overflow-y:scroll; overflow-x:hidden; height:100%;min-width:320px}
body {width:100%; margin:0;padding:0;font-size:15px;;height:100%; line-height:140%;  font-family: 'NanumSquare','NanumGothic', 'NanumBarunGothic','Noto Sans KR',dotum,'µ¸¿ò',sans-serif; letter-spacing: -0.5px; font-weight:500}
div,td,th,tr,ul,li,select,input,button {margin:0;padding:0;list-style:none; font-family: 'NanumSquare','NanumGothic', 'NanumBarunGothic','Noto Sans KR',dotum,'µ¸¿ò',sans-serif;box-sizing:border-box; font-weight:500; line-height:140%;}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
legend {position:absolute;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
input, button {margin:0;padding:0;font-size:1em; font-family: 'NanumSquare','NanumGothic', 'NanumBarunGothic','Noto Sans KR',dotum,'µ¸¿ò',sans-serif; border:none; outline:0;}
button {cursor:pointer}
input[type=text], input[type=password], input[type=submit], input[type=image], button {font-size:1em;-webkit-appearance:none}
textarea, select,button {font-size:1em; font-family: 'NanumSquare','NanumGothic', 'NanumBarunGothic','Noto Sans KR',dotum,'µ¸¿ò',sans-serif;}
textarea {border-radius:0;-webkit-appearance:none}
select {margin:0;background:none}
p {margin:0;padding:0;word-break:break-all; font-weight:500; line-height:140%; font-family:inherit;}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em}
a { color:#000; text-decoration:none !important;  border: 0; outline: 0;}
ul,li,dl,dt,dd{padding:0;margin:0}
ul{list-style:none;}
table.sl__board_table tr td, table.sl__board_table tr td a { font-family:  'NanumBarunGothic','Noto Sans KR',dotum,'µ¸¿ò',sans-serif !important; font-weight:normal; font-size:16px}
@media (max-width: 480px){
	table.sl__board_table tr td, table.sl__board_table tr td a{font-size:14px}
}

*, :after, :before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
img {
    border: 0;
}
.img-fluid{max-width:100%;height:auto}

.clear {
    clear: both;
    width: auto !important
}
.img-fluid{max-width:100%;height:auto}

.os-animation {
    opacity: 0;
}

.os-animation.animated {
    opacity: 1;
}

/* =================core css ends here================= */


/* =================btn css start here================= */

/* =================btn css end here================= */



/* »ó´Ü ·¹À̾ƿô */
#hd{text-align:center; width:100%;/*background:#fff;*/background:transparent;
position:fixed;z-index:99; /*height:110px; padding: 35px 0;*/min-height:140px;}
#hd:after {display:block;visibility:hidden;clear:both;content:""}
#hd:before{content:'';position:absolute;bottom:0;left:0;background:#fff;}
#hd_h1 {position:absolute;font-size:0;text-indent:-9999em;line-height:0;overflow:hidden}
#hd_wrapper{margin:0 auto;width:100%;max-width:1200px; position:relative}



#hd.header-scrolled {
  background: #fff;
  width:100%;
  height: 103px;
  transition: all 0.5s;
}
@media (max-width: 970px){
	#hd {min-height:80px;}
	#hd.header-scrolled {height:86px;}
}
/*@media (max-width: 768px){
	#hd {min-height:82px;}
}*/


@media (min-width: 970px){
	#hd_btn, #hd_btn2 { display:none; }
	#hd_btn .hd_menu_btn, #hd_btn2 .hd_menu_btn { display:none; }
}
/*·Î±×ÀÎ*/

#tnb_bg {width:100%; position:relative; display:block; background:#01c864; height:38px}
#tnb_bg .tnb {float:right; text-align:left; }
#tnb_bg .tnb a {display:inline-block; line-height:38px; padding: 0 7px; color:#fff; font-weight:500;}
#tnb_bg .tnb span { font-size:9px; color:#fff; padding: 0 8px; vertical-align:middle }

@media (max-width: 970px){
	#tnb_bg { display:none; }
}

/*·Î°í*/
#logo h1 { float:left; padding: 27px 10px;/*line-height:93px; height:93px*/ } 
#logo h1 a { text-indent:-9000px; font-size:0; width:200px; height:52px; 
			background-image:url(/main/img/logo.png); background-position:0 0; display:inline-block; vertical-align:middle; overflow:hidden; background-size:100%; transition:none  }
#hd.header-scrolled #logo h1 a { background-image:url(/main/img/logo_bk.png);}

/*·Î°í ¼­ºê*/
#logo h2 { float:left; padding: 27px 10px;}
#logo h2 a { text-indent:-9000px; font-size:0;width:200px; height:52px;
			background-image:url(/main/img/logo_bk.png); background-position:0 0; display:inline-block; vertical-align:middle; overflow:hidden; background-size:100%; transition:none  }
#hd.header-scrolled #logo h2 a { background-image:url(/main/img/logo_bk.png); }


@media (max-width: 970px){
	#logo h1, #logo h2 {padding:20px 10px; }
	#logo h1 a, #logo h2 a { width:180px; height:46px;}
	#hd.header-scrolled #logo h1, #hd.header-scrolled #logo h2 {padding:20px 10px; }
	#hd.header-scrolled #logo h1 a, #hd.header-scrolled #logo h2 a { width:180px; height:46px;}
}
@media (max-width: 768px){
	/*#logo img{ width:160px; height:auto; padding-top:-4px; }*/

}

@media (min-width: 970px){
	#hd_btn { display:none; }
	#hd_btn .hd_menu_btn { display:none; }
}

#gnb_empty {padding:20px 0;color:#fff;text-align:center;line-height:2em}
#gnb_empty a {display:inline;text-decoration:none}

#hd.fixed{position:fixed;top:0;left:0; }


#gnb {display:inline-block; vertical-align:top; float:right; /*padding-right:100px;*/ }
#gnb:after {display:block;visibility:hidden;clear:both;content:""}
.gnb_wr{max-width:1200px; /*padding-right:200px;*/margin:0 auto;position:relative;}
#gnb a {display:block; text-decoration:none}

.gnb_1dli{position:relative;float:left;line-height:40px; padding:0 40px; }
.gnb_1dli:after {display:block;visibility:hidden;clear:both;content:""}
/*¼­ºêÆäÀÌÁö*/
.gnb_1dli_{position:relative;float:left;line-height:40px; padding:0 40px; }
.gnb_1dli_:after {display:block;visibility:hidden;clear:both;content:""}



@media (max-width: 1150px){
	.gnb_1dli { padding:0 35px}
	.gnb_1da { padding:0;}
	/*¼­ºêÆäÀÌÁö*/
	.gnb_1dli_ { padding:0 35px}
}

@media (max-width: 970px){
	#gnb, .gnb_1dli, .gnb_1dli_ {display:none;}
}


.gnb_1dli button{float:left;border:0;width:20px;height:110px;overflow:hidden;border:0;/*background:url(../img/mobile/gnb_bg2.png) no-repeat 50% 50%;*/ background-size:10px ;text-indent:-9999px}
.gnb_1da {position:relative;float:left;line-height:107px; /*margin:34px 0 17px 0;*/
			font-size:23px; color:#fff; letter-spacing:-0.5px; font-weight:700; font-family: inherit; }

#hd.header-scrolled .gnb_1da {color:#666}


/*¼­ºêÆäÀÌÁö*/
.gnb_1dli_ button{float:left;border:0;width:20px;height:110px;overflow:hidden;border:0; background-size:10px ;text-indent:-9999px}
.gnb_1dli_ .gnb_1da {position:relative;float:left;line-height:107px;
			font-size:23px; color:#555; letter-spacing:-0.5px; font-weight:700; font-family: inherit; }
#hd.header-scrolled .gnb_1dli_ button{float:left;border:0;width:20px;height:110px;overflow:hidden;border:0;background-size:10px ;text-indent:-9999px}
#hd.header-scrolled .gnb_1dli_ .gnb_1da {color:#666}


.gnb_2dul {display:none;position:absolute;top:102px;left:0; z-index:99; text-align:left;
		width: 145px; margin-left:35px; white-space: nowrap;border-radius: 0px;background: #fff;
-webkit-box-shadow: 0 6px 12px rgba(0,0,0,0.175);
box-shadow: 0 6px 12px rgba(0,0,0,0.175);
transition: 0.3s all ease-in-out;
-webkit-transition: 0.3s all ease-in-out;
-moz-transition: 0.3s all ease-in-out;
-o-transition: 0.3s all ease-in-out;
-ms-transition: 0.3s all ease-in-out;}

.gnb_1dli:hover .gnb_2dul {display:block}
.gnb_1dli:hover .gnb_1da{ color:#fff;}
.gnb_1dli:hover .gnb_1da:before{background:#2677df;}
/*¼­ºêÆäÀÌÁö*/
.gnb_1dli_:hover .gnb_2dul {display:block}
.gnb_1dli_:hover .gnb_1da{ color:#666;}
.gnb_1dli_:hover .gnb_1da:before{background:#2677df;}


.gnb_2da {width:100%; padding:8px 15px;font-size: 16px;color: #666;display:block;float: left;
		position: relative;font-weight:500;white-space: nowrap; letter-spacing:0px;
		border-top: 1px solid rgba(0,0,0,0.03);
transition: 0.3s all ease-in-out;
-webkit-transition: 0.3s all ease-in-out;
-moz-transition: 0.3s all ease-in-out;
-o-transition: 0.3s all ease-in-out;
-ms-transition: 0.3s all ease-in-out}
.gnb_2da:hover{color: #3986b4; background: #fafafa;}
.gnb_2da:active { background: #eaecf7;color:#3986b4}


#hd_btn {position:absolute;top:0;right:0;text-align:center; padding-top:25px;}
#hd_btn button{;width:42px;border:0;background:transparent; /*height:110px;*/float:left}
/*¼­ºêÆäÀÌÁö ºÎºÐ*/
#hd_btn2 {position:absolute;top:0;right:0;text-align:center; padding-top:25px;}
#hd_btn2 button{;width:42px;border:0;background:transparent; /*height:110px;*/float:left}



/*** ¿ÜºÎ·Î±×ÀÎÇÔ - sbÀ϶§ ÁÖ¼® ÇØÁ¦ ÇØ¾ß ÇÔ **/
.ol{float:left;padding:0px 20px; z-index:9999}
#hd_btn .prf_btn {width:auto;;height:33px;line-height:33px}
.prf_btn a {vertical-align:middle;width:30px;height:30px; font-size:0;
		background-image:url(/main/img/login_in.png); background-position:0 0; display:inline-block; vertical-align:middle; overflow:hidden; background-size:100%; transition:none}
#hd.header-scrolled .prf_btn a { background-image:url(/main/img/login_in2.png); }

/*¼­ºêÆäÀÌÁö ºÎºÐ*/
#hd_btn2 .prf_btn {width:auto;;height:33px;line-height:33px}
#hd_btn2 .prf_btn a {vertical-align:middle;width:30px;height:30px; font-size:0;
		background-image:url(/main/img/login_in2.png); background-position:0 0; display:inline-block; vertical-align:middle; overflow:hidden; background-size:100%; transition:none}
#hd.header-scrolled #hd_btn2 .prf_btn a { background-image:url(/main/img/login_in2.png); }


#ol_after_private{display:none;position:absolute;top:110px;right:0;background:#fff;border-radius:3px;z-index:79;width:80px;text-align:left;
-webkit-box-shadow: 0 2px 7px rgba(0,0,0,0.2) ;
-moz-box-shadow: 0 2px 7px rgba(0,0,0,0.2);
box-shadow: 0 2px 7px rgba(0,0,0,0.2);}
#ol_after_private li{line-height:30px;display:block;float:none}
#ol_after_private li a{width:100%;display:block;padding:0 15px;line-height:40px;font-size: 13px;color: #a8a6b0;float: left;position: relative;font-weight:normal;white-space: nowrap; border-top: 1px solid rgba(0,0,0,0.03);
transition: 0.3s all ease-in-out;
-webkit-transition: 0.3s all ease-in-out;
-moz-transition: 0.3s all ease-in-out;
-o-transition: 0.3s all ease-in-out;
-ms-transition: 0.3s all ease-in-out}
#ol_after_private li a:after {display:block;visibility:hidden;clear:both;content:""}
#ol_after_private li a:hover{color: #3986b4; background: #fafafa;}
#ol_after_private li a:active { background: #eaecf7;color:#3986b4}

#ol_after_private li strong{display:inline-block;background:#4ad1d4;color:#fff;;float:right;line-height:20px;border-radius:30px;padding:0 7px;font-size:0.92em;margin-top:9px;font-weight:300}
#ol_after_private li .admin{color:#ff0000 !important}

@media (max-width: 969px){
     .ol{padding: 5px 15px;}
    #hd_btn .btn_b02, #hd_btn2 .btn_b02 {padding:0 15px}
    #ol_after_private{top:85px}
}

/*Àüü¸Þ´º*/
#al_menu{display:none;position:fixed;top:0;left:0;width:100%;height:100%;text-align:left}
#al_menu .bg{background: rgba(0,0,0,0.5);width:100%;height:100%}  
#al_menu .menu_wr{position:absolute;top:0;left:0;background:#fff;width:100%; }
#al_menu .btn_close{position:absolute;top:0;right:0;background:none;border:0;width:100px;height:100px;font-size:20px;outline:0;color:#aaa}
#al_menu .btn_close:hover{color:#000}

@media (min-width: 970px){
    .btn_menu_op{display:none}
    #menu{max-width: 1200px; margin: 0 auto; padding: 110px 40px;}
    #menu:after {display:block;visibility:hidden;clear:both;content:""}
    #menu .menu_li h2 {padding-bottom: 26px;font-weight: 500; font-size: 1.5em;color: #555;text-align: left;border-bottom: 1px solid #ddd;}
	#menu .menu_li h2 a { color:#555; }
    #menu .menu_li{float:left;width:25%;padding:20px}    
    #menu .menu_li:nth-child(4n+1){clear:both}
    #menu .sub_menu {margin:15px 0}
    #menu .sub_menu li a{color:#555; font-weight: 400;padding-left:10px;line-height:20px;margin:5px 0;display:block;position:relative;}
    #menu .sub_menu li a:before{content:'';width:3px;height:3px;background:#3986b4;position:absolute;top:50%;left:0;margin-top:-1px}
 }


@media (max-width: 969px){
    
    #hd_btn button, #hd_btn2 button{width:38px; height: 55px;/*height:38px; background:#fff; opacity:0.8*/}
    #al_menu .menu_wr{position:absolute;top:0;left:0;height:100%;width:300px;max-height:100%;overflow-y:auto}
    #al_menu .btn_close{width:100%;background:#f3f3f3;height:55px;padding-right:20px;text-align:right}
    #menu{padding:65px 25px 30px 30px}
    #menu .menu_li{margin:15px 0;position:relative;} 
    #menu .menu_li h2{font-weight: 500; font-size: 1.25em;line-height:30px;color: #555; text-align: left}
	#menu .menu_li h2 a { font-size:19px; color:#333; }
    #menu .btn_menu_op{position:absolute;top:0;right:0;width:20px;height:30px;border:0;background:transparent;}
    #menu .sub_menu{display:none; margin-top:10px;}
    #menu .sub_menu li a{font-size:16px; font-weight:500; color:#666; position:relative;display:block;line-height:30px; /*margin:10px 0;*/padding-left:15px; }
    #menu .sub_menu li a:before{content:'';width:3px;height:3px;background:#3986b4;position:absolute;top:50%;left:5px;margin-top:-1px}
    #hd_sch .btn_close{width:55px;height:55px}


}

/*¾ÆÀÌÄÜ*/

.menu-icon{display:inline-block;width:30px;height:3px;background:#000;position:relative;vertical-align:middle}
.menu-icon:before{position:absolute;top:-7px;left:0;width:100%;background:#000;height:3px;content:'';}
.menu-icon:after{position:absolute;bottom:-7px;left:0;width:100%;background:#000;height:3px;content:'';}

#hd.header-scrolled .menu-icon {background:#000;}
#hd.header-scrolled .menu-icon:before {background:#000;}
#hd.header-scrolled .menu-icon:after {background:#000;}

/*¼­ºêÆäÀÌÁö ºÎºÐ*/
.menu-icon2{display:inline-block;;width:30px;height:3px;background:#000;position:relative;margin-top:-14px !important;}
.menu-icon2:before{position:absolute;top:-10px;left:0;width:100%;background:#000;height:3px;content:'';}
.menu-icon2:after{position:absolute;bottom:-10px;left:0;width:100%;background:#000;height:3px;content:'';}

#hd.header-scrolled .menu-icon2 {background:#000; margin-top:-14px !important;}
#hd.header-scrolled .menu-icon2:before {background:#000;}
#hd.header-scrolled .menu-icon2:after {background:#000;}


 @media (max-width: 969px){
    
    .menu-icon{display:inline-block;width:30px;height:3px; margin-top:-9px; background:#fff;position:relative;vertical-align:middle}
    .menu-icon:before{position:absolute;top:-9px;left:0;width:100%;background:#fff;height:3px;content:'';}
    .menu-icon:after{position:absolute;bottom:-9px;left:0;width:100%;background:#fff;height:3px;content:'';}
	/*¼­ºêÆäÀÌÁö ºÎºÐ*/
	.menu-icon2{display:inline-block;width:30px;height:3px; margin-top:-9px; background:#000;position:relative;vertical-align:middle}
    .menu-icon2:before{position:absolute;top:-9px;left:0;width:100%;background:#000;height:3px;content:'';}
    .menu-icon2:after{position:absolute;bottom:-9px;left:0;width:100%;background:#000;height:3px;content:'';

	}
 }


/* È­¸é³¶µ¶±â »ç¿ëÀÚ¿ë */
#hd_login_msg {position:absolute;top:0;left:0;width:0;height:0;overflow:hidden}
.msg_sound_only, .sound_only {display:inline-block;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;width:1px !important;height:1px !important;font-size:0 !important;line-height:0 !important;overflow:hidden}






/* Áß°£ ·¹À̾ƿô */
#wrapper { width:100%;}
#wrapper:after {display:block;visibility:hidden;clear:both;content:""}
.container {position:relative; width:100%; max-width:1200px; margin:0 auto; padding:0;  }
.container:after {display:block;visibility:hidden;clear:both;content:""} 

#wrapper .container { /*padding:50px 0;*/  }

@media (max-width: 1200px){
	.container {width:100%;  }
	#wrapper .container { /*padding:25px 0;*/ }
}

@media (max-width: 480px){
	#wrapper .container { padding:0; }
}

#container_title {position:relative;font-weight:bold;background:#fff;color:#333; text-align:center;				
					z-index:9;line-height:300px;color:#fff;font-size:2.5em;
					background:url(/main/inc/img/subP.jpg) no-repeat ;}

#container>p{display:none;}



/*¼³±³¿µ¿ª*/
.container .sermon {position:relative; display:block; width:100%; height:430px; padding:0;margin:0;}
.container .sermon .m_worship {position:relative; display:block; height:430px; padding:80px 30px 60px 50px; 
				background: #d9d9d9 url(/main/img/m_worship_bg2.jpg) no-repeat ; 
				background-position: center right;
				background-size: cover;}
.container .sermon .m_worship a {display:block; }
.container .sermon .m_worship a:hover {color:#6bdc8f}
.container .sermon .m_worship p {letter-spacing:-1px; line-height:50px;}
.container .sermon .m_worship p span {display:block; font-size:43px;  font-weight:bold;letter-spacing:-1px;}

.msermon_info { position:relative; width:125px; height:45px; border:3px solid #fff; text-align:center; margin-bottom:0px;}
.msermon_info:hover {/*background:#fff;*/ border:3px solid #6bdc8f;  /*transition: background-color .15s ease-in-out*/-webkit-transition:all .35s ease-in-out;-moz-transition:all .35s ease-in-out;-o-transition:all .35s ease-in-out;-ms-transition:all .35s ease-in-out;transition:all .35s ease-in-out}
.msermon_info:hover a {color:#6bdc8f; }
.msermon_info a {font-size:18px;letter-spacing:-0.5px;  line-height:37px; background: transparent; color:#fff;font-weight:bold;text-align:center; }

@media only screen and (max-width: 768px) {
	.container .sermon { height:auto; min-height:250px; z-index:10;}
	.container .sermon .m_worship { height:auto; padding:30px 30px; }
	.container .sermon .m_worship p {line-height:35px;}
	.container .sermon .m_worship p span {font-size:30px;}
	.msermon_info { position:relative; width:120px; height:40px; border:2px solid #fff;}
	.msermon_info a {font-size:16px;line-height:35px; color:#fff; }
}


/*¼³±³¿µ¿ª ÇÏ´Ü ¿¹¹è¾È³»/¿À½Ã´Â±æ
.container .sermon .m_time {background:#4bb99b; width:100%; height:80px;}
.container .sermon .m_time p {line-height:80px;}
.container .sermon .m_map {background:#d9844c; width:100%; height:80px }
.container .sermon .m_map p {line-height:80px;}
.container .sermon .m_time a, .container .sermon .m_map a {display:block;}
.container .sermon .m_time img, .container .sermon .m_map img {padding-right:15px;}

@media only screen and (max-width: 768px) {
	.container .sermon .m_time img, .container .sermon .m_map img {padding-right:5px;}
}

*/
/*¹è³Ê ¿µ¿ª*/
.container .m_bnr {position:relative; display:block;  width:100%; height:430px; padding:0; margin:0;}
.container .m_bnr a {display:block; padding:0; width:100%; height:100%;}
.container .m_bnr a div {width:100%; height:100%;}
.m_bnr p {line-height:15px;}
.m_bnr figure {padding:0;}

.container .m_bnr .m_bnr1 {position:relative; display:block;background:#6bdc8f; width:100%; height:215px; padding:40px 0 33px 0;}
.container .m_bnr .m_bnr2 {position:relative; display:block;background:#49708d; width:100%; height:215px; padding:40px 0 33px 0;}
.container .m_bnr .m_bnr3 {position:relative; display:block;background:#3d416a; width:100%; height:215px; padding:40px 0 33px 0;}
.container .m_bnr .m_bnr4 {position:relative; display:block;background:#f0d342; width:100%; height:215px; padding:40px 0 33px 0;}

@media only screen and (max-width: 768px) {
	.container .m_bnr {height:auto;}
	.container .m_bnr .m_bnr1, .container .m_bnr .m_bnr2,.container .m_bnr .m_bnr3,.container .m_bnr .m_bnr4
	{ height:auto;padding:20px 0; }
	.m_bnr p {line-height:10px;}
	.m_bnr img { width:50px; height:auto;}
}


/*¾Ù¹ü¿µ¿ª*/
.malbum {position:relative; display:block;  width:100%; height:450px; padding:0; margin:0;
		background: #d7f0d8; 
		
		}

.malbum .container .m_ab1 { padding:65px 0;}



.malbum .container ul {list-style:none; padding:0; margin-top:40px}
.malbum .container ul li {float:left; display:inline-block; width:25%; padding:0 3px;  overflow:hidden}
.malbum .container ul li a {display:block; text-align:center; }
.malbum .container ul li div {margin-bottom:20px; }
.malbum .container ul li   {}
.malbum .container ul li div img {width:260px; height:173px; margin:0 auto; border: 8px solid #fff;}
.malbum .container ul li p {  line-height:10px;}

@media (max-width: 1200px){
	.malbum {height:auto}
	.malbum .container ul li div img { width:230px; height:153px;}
}
@media (max-width: 992px){
	
	.malbum .container .m_ab1{ padding:50px 0}
	.malbum .container ul {list-style:none; padding:0; margin-top:25px}
	.malbum .container ul li {width:50%;margin-bottom:20px;}
	.malbum .container ul li div img { width:230px; height:153px;}
}
@media (max-width: 510px){
	.malbum {padding-bottom:10px;}
	.malbum .container .m_ab1 { padding:30px 5px 0px 5px}

	.malbum .container a { line-height:34px;}

	.malbum .container ul li div {margin-bottom:10px; }
	.malbum .container ul li div img { width:80%; height:auto; max-height:200px; min-height:100px;}
}




/* ================= footer start ================= */

/* ÇÏ´Ü ·¹À̾ƿô */
#ft {background:#3c3c3c;text-align:center;line-height:20px; border-top:1px solid #eee;}
.ft_wr{margin:0 auto;max-width:1200px;padding:30px 15px}
.ft_wr:after {display:block;visibility:hidden;clear:both;content:""}
#ft h1 {width:0;height:0;font-size:0;line-height:0;overflow:hidden}
#ft h4 {font-size:17px; font-weight:700;}
#ft p{margin:0;padding:10px 0;font-size:15px; font-weight:500; letter-spacing:0.5px;}
#ft p span {padding-right:10px;}

/*¿Â¶óÀÎÇå±Ý*/
#ft_online {float:right; padding-top:20px;}
#ft_online a {display:inline-block;padding:0 10px;color:#fff;font-weight:300;font-size:13px; font-family:inherit; }

/*ÇÏ´Ü ÁÖ¼Ò*/
#ft_copy {float:left;color:#fff; font-weight:300; font-size:13px; text-align:left; font-family:inherit; }
#ft_copy b {color:inherit}
#ft_copy a {color:inherit; text-decoration:none}

#top_btn {position:fixed;bottom:10px;right:10px;width:40px;height:40px;background:#000;opacity:0.3;border-radius:30px;color:#fff;text-align:center;font-size:15px;z-index:99;border:0}
#top_btn:hover{opacity:1}
#device_change {display:block;line-height:40px;border:1px solid #3a3a3a;border-radius:2em;color:#777;font-size:1em;text-decoration:none;text-align:center}

 @media (max-width: 969px){
    .ft_wr{padding:30px 20px 20px}
    #ft_copy{width:100%; text-align:center;}
	#ft h4 {text-align:center; font-size:17px;}
	#ft p span {padding:0 10px;}
	 #ft span {display:block;}
     #ft_online {width:100%; padding:20px 0;}
	 #ft_online a { text-align:center;}

}
 @media (max-width: 480px){
	#ft p{ font-size:14px; letter-spacing:0px;}
 }
/* ================= Search start ================== */



/* ================= Search end ================= */
.hero-outer, .hero-container{height: 100vh;}
.hero-container{
	/*margin-top:120px;*/
    overflow: hidden;
    display: table;
    width: 100%;
    position: relative;
    color: #fff;
    background-color: #333;
    font-size: 20px;
    line-height: 1.6;
	font-weight:800;
    background-size: cover;
    background-position: center center;
	
	}

.hero-container:before {
    content: '';
    width: 80%;
    height: 100%;
    float: left;
    position: absolute;
	background-position: center center;
    left: 0;
    top: 0;
}

.hero-container:after {
    content: '';
    width: 100%;
    height: 100px;
    float: left;
    position: absolute;
	background-position: center center;
    left: 0;
    top: 0;
  }

.middle-container {
    display: table-cell;
    vertical-align: middle;
    position: relative;
    z-index: 9;
    padding: 100px 0 30px 0;
    background: rgba(0, 0, 0, 0);
}

@media handheld,
only screen and (max-width: 767px) {
	
   .middle-container {
		text-align:center;
       }
}


.hero-container h3 span {font-size: 60px; font-family: inherit; font-weight:800;}
.hero-container h3 {font-size: 50px;letter-spacing: -0.5px; line-height: 150%;font-weight: 800; }
.hero-container h4 {font-size: 50px;line-height:150%;font-weight:800;}
.hero-container h5 {font-size: 20px;font-weight:800;line-height: 150%;}

.carousel_info { position:relative; margin:40px auto; width:200px; height:56px; border:2px solid #fff; }
.carousel_info:hover {background:#fff; transition: /*color .15s ease-in-out ,*/ background-color .15s ease-in-out}
.carousel_info:hover a {color:#000;}
.carousel_info a {font-size:26px;letter-spacing:-1px; font-weight: 800;  line-height:52px;	
			color:#fff;font-weight:bold;text-align:center; }




@media only screen and (max-width: 1048px) {
	
	.hero-container h3 span {font-size: 40px;}
	.hero-container h3 { font-size: 35px;}
	.hero-container h4 {font-size: 35px;}
	.hero-container h5 {font-size: 19px;}

	.carousel_info { width:200px; height:50px;  }
	.carousel_info:hover { }
	.carousel_info:hover a {}
	.carousel_info a {font-size:22px;line-height:44px;	 }
}

@media handheld,
only screen and (max-width: 767px) {
	
	.hero-outer,
    .hero-container {
        height: auto;
        min-height: 65vh;
    }
    .hero-container {
        /*background-position-x: 90%;*/
		background-position: center center;
    }
	 .hero-container:before {
        display: none;
    }

    .hero-container h3 span {font-size: 35px;}
	.hero-container h3 { font-size: 29px;}
	.hero-container h4 {font-size: 29px;}
	.hero-container h5 {font-size: 18px;}

	.carousel_info {  margin:25px auto; width:170px; height:50px;  }
	.carousel_info:hover { }
	.carousel_info:hover a {}
	.carousel_info a {font-size:20px;line-height:44px;} 
    
}





.hero-slider .owl-prev {
    position: absolute;
    left: 13%;
    top: 45%;
}
.hero-slider .owl-next {
    position: absolute;
    right: 13%;
    top: 45%;
}
.hero-slider .owl-dots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 30px;
}
.hero-slider.owl-theme .owl-dots .owl-dot span {
    background-color: rgba(255, 255, 255, 0.5);
}
.hero-slider.owl-theme .owl-dots .owl-dot.active span,
.hero-slider.owl-theme .owl-dots .owl-dot:hover span {
    background: #fff;
}

@media only screen and (max-width: 1200px) {
	.hero-slider .owl-prev {
		position: absolute;
		left: 5%;
		top: 45%;
	}
	.hero-slider .owl-next {
		position: absolute;
		right: 5%;
		top: 45%;
	}
}

@media only screen and (max-width: 767px) {
	.owl-nav {
        display: none !important;
    }
}





/*¼­ºêÆäÀÌÁö */
.subcontent-container {
    padding-top: 40px ;
	min-height:400px;
    overflow: hidden;
    position: relative;
}

@media only screen and (max-width: 1048px) {
	
	.subcontent-container {
    padding-top: 30px;
	}

}

@media handheld,
only screen and (max-width: 767px) {
	
	.subcontent-container {
    padding-top: 10px;
	}
}


@media only screen and (max-width: 479px) {
	.subcontent-container {
    padding-top: 10px;
	}
}




.case-slider .owl-nav {
    position: absolute;
    top: 50px;
    right: 40px;
    text-align: right;
    margin: 0;
}

.owl-theme.case-slider .owl-nav [class*='owl-'] {
    font-weight: 700;
    background-color: transparent;
    color: #333;
    font-size: 18px;
}

.owl-theme.case-slider .owl-nav [class*='owl-']:hover {
    background-color: transparent;
    color: #0069a0;
}




/* ================= Header end ================= */







.inner-banner {
    padding: 90px 30px;
	/*height:140px !important;*/
    position: relative;
	display:block;
    background-color: #fff;
    /*color: #fff;
	text-align:center;*/
    background-size: cover;
    background-position: center center;	
	margin-bottom:50px;
}


.inner-banner h5 {
    margin: 0;
	text-align:center;
	font-size:35px;
	color:#fff;
	font-weight:800;
}

.inner-banner h6 {
    margin: 0;
	text-align:right;
	font-family: 'Nanum Gothic', 'NanumSquare';
	font-size:16px;
	color:#7a7979;
	font-weight:400;
}

@media only screen and (max-width: 970px) {
	.inner-banner {padding: 50px 30px; margin-bottom:30px;}
	.inner-banner h5 {font-size:28px;}
}
/* ============SERVICE PAGE START================= */


/* ============SERVICE PAGE END================= */


/* ============CASE PAGE START================= */


/* ============CASE PAGE END================= */


/* ============BLOG PAGE START================= */



/* ============BLOG PAGE END================= */


/* ============FAQS PAGE START================= */



/* ============FAQS PAGE END================= */


/* ============CONTACT PAGE START================= */


/* ============CONTACT PAGE END================= */


/* ============================= 
! Screen size below 1201px
 ============================= */

@media only screen and (min-width: 1200px) {

	
	
}



/* ============================= 
! Layout for ipad lanscape 
 ============================= */

@media only screen and (max-width: 1048px) {
	
	

}



/*============================= 
! Layout for ipad portrait  
============================= */

@media only screen and (max-width: 991px) {
  
}



/* =============================  
 ! Layout for mobile(lanscape) version  
 ============================= */

@media handheld,
only screen and (max-width: 767px) {
	

   
    .breadcrumb {
        display: none;
    }
     
    .pagination>li>a,
    .pagination>li>span {
        font-size: 15px;
        padding: 8px;
    }
}


/* ============================= 
 ! Layout for mobile(portrait) version  
 ============================= */

@media only screen and (max-width: 479px) {

  
}