@import url('../page_style.css');
@import url('../bbs_style.css');

/* @import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap'); */
/* @import url('https://fonts.googleapis.com/css2?family=Nanum+Myeongjo:wght@400;700;800&display=swap'); */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap');
/*@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');*/
@import url('https://fonts.googleapis.com/earlyaccess/nanumpenscript.css');
@font-face {
    font-family: 'yg-jalnan';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.yg-jalnan,
.yg-jalnan * {
  font-family: 'yg-jalnan';
 }


.nanumpenscript,
.nanumpenscript * {
  font-family: 'Nanum Pen Script', cursive;
 }

/* Reset */
html,body{width:100%;height:100%;}
html>/**/body { /*overflow-y:auto;*/}

body,div,table,th,td,h1,h2,h3,h4,h5,form,fieldset,p,button,legend,pre,code,blockquote,input,textarea,button,select,ul,li,ol,dd,dl,dt
{margin:0;padding:0; font-family: 'Noto Sans KR','굴림',Gulim,'맑은 고딕','돋움',Dotum,tahoma,NanumGothic,Helvetica,'Apple SD Gothic Neo',Sans-serif; font-size:12px; color:#333;letter-spacing:-0.5px; }
img,fieldset,iframe,input,button{border:0 none;}
input,select,textarea,button{vertical-align:middle;}
dl,ul,ol,menu,li{list-style:none}
button {border:0 none;background-color:transparent;cursor:pointer}
body{background:#fff}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section{display:block}
legend{*width:0; position:absolute; width:1px; height:1px; font-size:0; line-height:0; overflow:hidden;}
caption {padding:0; height:0; font-size:0; line-height:0; overflow:hidden;}
hr{display:none}
address,caption,cite,code,dfn,var {font-style:normal;font-weight:normal}
iframe{vertical-align:top}
/* a{color:#6c6c6c;text-decoration:none;cursor:pointer;} */
/* a:hover{color:#6c6c6c;text-decoration:none;} */
em{font-style:normal;}

input[type="text"],input[type="password"],input[type="email"],input[type="search"],input[type="image"],input[type="tel"],
textarea{-webkit-appearance:none;-webkit-border-radius:0;}

/* Reset */

/* Common */
.gnb{width:960px;margin:0 auto;}
.mb0{margin-bottom:0 !important;}
.mt10{margin-top:10px !important;}
.mt15{margin-top:15px !important;}
.mt20{margin-top:20px !important;}
.mt30{margin-top:30px !important;}
.mt50{margin-top:50px !important;}

.blind,legend{display:block;overflow:hidden;position:absolute;top:-1000em;left:0}
.clear{clear:both}
.f_l{float:left}
.f_r{float:right}
.ir_pm {display:block;overflow:hidden;font-size:0px;line-height:0;text-indent:-9999px} /* 사용된 이미지내 의미있는 텍스트의 대체텍스트를 제공할때 */
.ir_wa {display:block;overflow:hidden;position:relative;z-index:-10;width:100%;height:100%} /* 중요한 이미지 대체텍스트로 이미지off시에도 대체 텍스트를 보여주고자 할때 */
.show{display:block}
.hide{display:none}
.tbl, .tbl table {border-collapse:collapse; border-spacing:0} /* 테이블 초기화 */
/* Font-style */
.font_10 { font-size:10px;}
.font_11 { font-size:11px;}
.font_13 { font-size:13px;}
.font_14 { font-size:14px;}
.font_15 { font-size:15px;}
.font_16 { font-size:16px;}
.font_17 { font-size:17px;}
.font_18 { font-size:18px;}
.font_19 { font-size:19px;}
.font_20 { font-size:20px;}
.font_21 { font-size:21px;}
.font_22 { font-size:22px;}
.font_23 { font-size:23px;}
.font_24 { font-size:24px;}
.font_25 { font-size:25px;}
.font_26 { font-size:26px;}
.font_28 { font-size:28px;}
.font_30 { font-size:30px;}
.font_40 { font-size:40px;}
.font_48 { font-size:48px;}

.font_dotum{font-family:'돋움',Dotum,'맑은 고딕','굴림',Gulim,tahoma,NanumGothic,Helvetica,'Apple SD Gothic Neo',Sans-serif;}
.font_tahoma{font-family:Tahoma,'돋움',Dotum,'맑은 고딕','굴림',Gulim,NanumGothic,Helvetica,'Apple SD Gothic Neo',Sans-serif;}
.font_gulim{font-family:'굴림',Gulim,'돋움',Dotum,'맑은 고딕',tahoma,NanumGothic,Helvetica,'Apple SD Gothic Neo',Sans-serif;}
.font_malgun{font-family:'맑은 고딕','돋움',Dotum,'굴림',Gulim,tahoma,NanumGothic,Helvetica,'Apple SD Gothic Neo',Sans-serif !important;}

.noto100 {font-family: 'Noto Sans KR' !important; font-weight:100 !important;}
.noto100 a{font-family: 'Noto Sans KR' !important; font-weight:100 !important;}
.noto100 a:hover{font-family: 'Noto Sans KR' !important; font-weight:100 !important;}

.noto400 {font-family: 'Noto Sans KR' !important; font-weight:400 !important;}
.noto400 a{font-family: 'Noto Sans KR' !important; font-weight:400 !important;}
.noto400 a:hover{font-family: 'Noto Sans KR' !important; font-weight:400 !important;}

.noto500{font-family: 'Noto Sans KR' !important; font-weight:500 !important;}
.noto500 a{font-family: 'Noto Sans KR' !important; font-weight:500 !important;}
.noto500 a:hover{font-family: 'Noto Sans KR' !important; font-weight:500 !important;}
/* Font-style */

.ellip{overflow:hidden; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis;}
.ellipsis_line1 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; /* number of lines to show */ -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.ellipsis_line2 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; /* number of lines to show */ -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.ellipsis_line3 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; /* number of lines to show */ -webkit-line-clamp: 3; -webkit-box-orient: vertical;}
/* span 등 display속성이 inline값을 가진 속성일때 ellipsis1,2 를 사용하여 글자자름 줄을 설정 */

/* Wys2 reset */
#ct{word-break: break-all; word-break: break-word; word-wrap: break-word; text-align:justify; line-height:normal}
#ct table{border-collapse: separate}
#ct table[align="center"]{margin:auto;}
#ct ul{padding-left:20px; display:block}
#ct ul li{display:list-item; list-style:disc}
#ct ol{padding-left:20px; display:block}
#ct ol li{list-style:decimal;  display:list-item}
#ct hr{display:block}
#ct img{max-width:100%; height:auto !important}
#ct p, #ct div{font-size:inherit}
#ct blockquote{line-height:normal; position: relative;}
#ct blockquote:before {position: relative; top: 11px; content: "\201C"; color:#bcbcbc; font-family:Georgia;  font-size:40px; display:block; text-align:center;}
#ct blockquote:after {position: relative; top:11px; content: "\201D"; color:#bcbcbc; font-family:Georgia; font-size:40px; display:block; text-align:center;}
#ct blockquote > p, #ct blockquote > div{text-align:center;}
#ct sup {vertical-align: super; font-size: smaller; top:0;}
#ct sub{vertical-align: sub; font-size: smaller; bottom:0;}

.ct{word-break: break-all; word-break: break-word; word-wrap: break-word; text-align:justify; line-height:normal}
.ct table{border-collapse: separate}
.ct table[align="center"]{margin:auto;}
.ct ul{padding-left:20px; display:block}
.ct ul li{display:list-item; list-style:disc}
.ct ol{padding-left:20px; display:block}
.ct ol li{list-style:decimal;  display:list-item}
.ct hr{display:block}
.ct img{max-width:100%; height:auto !important}
.ct p, .ct div{font-size:inherit}
.ct blockquote{line-height:normal; position: relative;}
.ct blockquote:before {position: relative; top: 11px; content: "\201C"; color:#bcbcbc; font-family:Georgia;  font-size:40px; display:block; text-align:center;}
.ct blockquote:after {position: relative; top:11px; content: "\201D"; color:#bcbcbc; font-family:Georgia; font-size:40px; display:block; text-align:center;}
.ct blockquote > p, .ct blockquote > div{text-align:center;}
.ct sup {vertical-align: super; font-size: smaller; top:0;}
.ct sub{vertical-align: sub; font-size: smaller; bottom:0;}



/* basic layout */
#wrap {width:100%;/* min-width:1200px;*/ /*overflow:hidden;*/}
#top {width:100%;}
#header {width:100%;}
#container {width:100%; clear: both;}


.top_c {width:1200px; margin:0 auto;}
.header_c {width:1200px; margin:0 auto;}
.container_c {width:1200px; margin:0 auto;}
.footer_c {width:1200px; margin:0 auto;}
/* basic layout */


/* basic_sub layout */
#container_s_side {width:200px; float:left;}
#container_s_center {width:780px; float:right;}
/* basic_sub layout */


.ellipsis_line1 {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.ellipsis_line_1 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; /* number of lines to show */ -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.ellipsis_line_2 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; /* number of lines to show */ -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.ellipsis_line_3 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; /* number of lines to show */ -webkit-line-clamp: 3; -webkit-box-orient: vertical;}
.ellipsis_line_4 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; /* number of lines to show */ -webkit-line-clamp: 4; -webkit-box-orient: vertical;}
.ellipsis_line_5 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; /* number of lines to show */ -webkit-line-clamp: 5; -webkit-box-orient: vertical;}

.cursor-alias { cursor: alias !important; }
.cursor-all-scroll { cursor: all-scroll !important; }
.cursor-auto { cursor: auto !important; }
.cursor-cell { cursor: cell !important; }
.cursor-context-menu { cursor: context-menu !important; }
.cursor-col-resize { cursor: col-resize !important; }
.cursor-copy { cursor: copy !important; }
.cursor-crosshair { cursor: crosshair !important; }
.cursor-default { cursor: default !important; }
.cursor-e-resize { cursor: e-resize !important; }
.cursor-ew-resize { cursor: ew-resize !important; }
.cursor-grab { cursor: grab !important; }
.cursor-grabbing { cursor: grabbing !important; }
.cursor-help { cursor: help !important; }
.cursor-move { cursor: move !important; }
.cursor-n-resize { cursor: n-resize !important; }
.cursor-ne-resize { cursor: ne-resize !important; }
.cursor-nesw-resize { cursor: nesw-resize !important; }
.cursor-ns-resize { cursor: ns-resize !important; }
.cursor-nw-resize { cursor: nw-resize !important; }
.cursor-nwse-resize { cursor: nwse-resize !important; }
.cursor-no-drop { cursor: no-drop !important; }
.cursor-none { cursor: none !important; }
.cursor-not-allowed { cursor: not-allowed !important; }
.cursor-pointer { cursor: pointer !important; }
.cursor-progress { cursor: progress !important; }
.cursor-row-resize { cursor: row-resize !important; }
.cursor-s-resize { cursor: s-resize !important; }
.cursor-se-resize { cursor: se-resize !important; }
.cursor-sw-resize { cursor: sw-resize !important; }
.cursor-text { cursor: text !important; }
.cursor-w-resize { cursor: w-resize !important; }
.cursor-wait { cursor: wait !important; }
.cursor-zoom-in { cursor: zoom-in !important; }
.cursor-zoom-out { cursor: zoom-out !important; }

.filebox .upload-name {
    display: inline-block;
    width: 160px;
    padding: 0 10px;
    height: 25px;
    line-height: 25px;
    vertical-align: middle;
    background-color: #F5F5F5;
    border: 0;
    border-radius: .1em;
    color: #000;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-size: 0.7rem;
}
.filebox label {
    display: inline-block;
    padding: 0 10px;
    height: 25px;
    line-height: 25px;
    color: #999;
    vertical-align: middle;
    background-color: #F5F5F5;
    cursor: pointer;
    border: 0;
    border-radius: .1em;
    font-size: 0.7rem;
}
.filebox input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
}
