@charset "utf-8";
/* CSS Document */

/*list*/
.blssbj>div{ display: flex; align-items: center; }
.lsbj { display: inline-block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; }
.lname { display: inline-block; max-width: calc(100%); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; }

#multisys { padding: 7px 13px; border-bottom: 1px solid rgb(204, 204, 204); display: none; }
#multisys>button{ margin-left: 2px;}

#wrapSearch { border-top: 1px solid #ddd; }

#bbsSearch{ display: inline-block; }

.bbsadm { 
	vertical-align:-3px;line-height:0px; border:1px solid #b1b1b1;border-radius:3px; cursor: pointer; 
	display:inline-block; padding:5px;color:#636363; background:#f1f1f1 linear-gradient(#ffffff, #e6e6e6); 
}
.bbsntc{padding:3px 5px; border-radius:3px; border-width: 1px; border-style: solid; }
.catew{display: inline-block; background: #505A73; color:#fff; width:50px; line-height: 100%; padding:3px 5px; border-radius:3px; text-align: center; box-sizing: border-box; }
.rplico{ display: inline-block;}
.red{ color:crimson; }

.bbstopbox { margin-bottom: 20px; letter-spacing: -0.03em; }

#bbsList table th{ font-size: 100%; color:white; }

/*admlogin*/
#admlogin{ text-align: center;}
#admlogin>div:first-of-type { text-align:left; padding:15px;border-bottom:1px solid #ddd}
#admlogin>div:nth-of-type(2) { display: inline-block; margin:20px auto; }
#admlogin>div:nth-of-type(2)>h1 { text-align:left; padding:5px;border-bottom:1px dotted #ddd;margin-bottom:5px;color:#000; font-family: "Noto Sans KR"; font-size: 125%; font-weight: 500; }
#admlogin>div:nth-of-type(2)>h1>span { font-size:80%; color:#aaa; }
#admlogin>div:last-of-type { text-align:left; padding:15px;border-top:1px solid #ddd}
#admlogin>div>form {overflow:auto;}
#admlogin>div>form ul {float:left; margin-right:5px; }
#admlogin>div>form ul>li{ padding: 1px 0px; }
#admlogin>div>form button { float:left; margin-top:0px; padding:20px 25px; margin-left:1px; border: 1px solid; border-radius: 5px; font-family: "Noto Sans KR"; font-size: 120%; font-weight: 400; }

/*view*/
.bbsView { border-bottom:1px solid #ccc; margin-bottom: 20px; }
.bbsView > h1 {color:#000;padding:10px 0px;border-bottom:1px solid #ccc; font-family: "Noto Sans KR"; line-height:initial; font-weight: 500; }
.bbsView > div:nth-of-type(1){background:#f9f9f9; border-bottom:1px dotted #ccc; overflow:auto; padding:5px 10px; letter-spacing: -0.03em;  }
#bbsfilezn { float:left; }
#bbsfilezn>img { vertical-align: middle; }
#bbswinfo { float:right; }
#bbswinfo2 { background:#f9f9f9; border-bottom:1px dotted #ccc; padding:5px 10px; text-align:right }
.bbsimg{ max-width: 100%; max-height: 100%; }

#bbsConts {margin:20px 0px;}
#bbsConts ol{list-style:decimal;padding-left:10px}
#bbsConts ul{list-style:disc;padding-left:10px}
#bbsConts li{margin-left:20px;}
#bbsConts blockquote {margin-left:40px}
#bbsConts a{text-decoration:underline;color:#00F}
#bbsConts table{border:1px solid #ccc;}
#bbsConts td{padding:3px 5px;border:1px solid #ccc}

#viewbn{ text-align: right; padding: 20px 0px; }

#bbsBmask{ position:fixed; z-index: 201; height: 100%; width: 100%; top:0px; left:0px; background: #000; opacity: 0; }
#popupimage{ 
    position: fixed; z-index: 202; background: #fff; box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3); opacity: 0;
    transform: scale(0.5); animation: popupopen ease-in-out 0.3s; animation-fill-mode:forwards; 
}
@keyframes popupopen{ 100%{ transform: scale(1); } }
#popupimage>img{ display: block; max-width: calc(100vw - 40px); max-height: calc(100vh - 40px); border:10px solid #fff; }

/*comment*/
#bodCmt{ margin-bottom: 20px; letter-spacing: -0.03em;}
#cmtCtl{ display: flex; align-items: center; padding: 10px 0px; }
#cmtvbn{ font-size: 80%; }
#cmtList { border:1px solid #ccc; padding:15px; }
#cmtList>dl{ margin: 0px; padding: 0px; }
#cmtList>dl:not(:last-child){ border-bottom: 1px solid #ccc; }
#cmtList>dl>dt{ display: flex; align-items: center; border-bottom: 1px dotted #ddd; padding: 10px 0px; }
#cmtList>dl>dt>label:first-child{ flex:1 1 100%; font-family: "Noto Sans KR"; font-weight: 500; }
#cmtList>dl>dt>label:first-child>span{ font-size: 80%; font-family: "Malgun Gothic"; }
#cmtList>dl>dt>a{ width: 10px; height: 10px; background: url(/images/icoXbn.svg); flex: 0 0 10px; }
#cmtList>dl>dd{ margin:0px; padding: 10px 0px; }

#multicmtsys { padding: 7px 13px; }

#DO_CONTENT{ width: 100%;  border-radius: 0; margin:0px; height:0px; padding:0px; border:0px; }

#cmtWrite { border:1px solid #ccc; padding:4px; margin-top:5px; background:#f7f7f7; }
#cmtWset{ display: flex; flex-wrap: wrap; align-items: center; padding: 5px 0px 2px 0px; }
#cmtWset>*{ margin:0px 2px 2px 0px}
#cmtWset>input, #cmtWset>select{ background: #fff; flex: 0 1 0%; max-width: 30%; }
#editcmtWrap { border:1px solid #ccc; position: relative; z-index: 0; background: #fff; }

/*replay*/
.rpbox{ padding:20px; margin-bottom:10px; border:1px solid #ccc; background: #f7f7f7; }
.rpSbj { font-size:110%; font-weight:bold; border-bottom: 1px dotted #ddd; margin-bottom:10px; padding: 5px 0px; }
.rphr { display: block; height: 1px;  border: 0px; border-top: 1px solid #ccc;  margin: 10px 0px; padding: 0px; }

/*write*/
#bbsWrite { display: block; }
.bbsagree { border:1px solid #ddd; background: #f7f7f7; overflow-y: auto; }
.bbsagree+label{ height: 32px; line-height: 32px; border-bottom: 1px dotted #ddd; padding:5px 0px; display: block; width: auto; }

#bbsWrite>ul{ list-style:none; margin-bottom:5px;}
label{ display:inline-block; width:15%; padding-left: 0px; text-indent: 10px; }
label.init{ width: auto; text-indent: unset;}
#DD_CATEGORY{display: inline-block; margin-right:10px; }
#DD_CONTENT{ width: 100%;  border-radius: 0; margin:0px; height:0px; padding:0px; border:0px; }

#if_upload { border:0px; width: 100%; height: 43px; }
.bbsinimg, .bbsinimgorg { max-width: 100%; }

/*공통*/
#pwbox { display: none; position:absolute; z-index:500; top:0px; left:0px; }
#pwbox > span { position:relative; z-index:501; display: block; height: 0px; }
#pwbox > span > img { position:absolute; z-index:502; top:-7px; }
#pwbox>div:first-of-type { border:1px solid #ccc; border-radius:5px; padding:15px; color:#636363; background:#fff; line-height: 230%;box-shadow: 3px 3px 3px rgba(0,0,0,0.2); }
#boxtitle { border-bottom:1px solid #ccc; padding-bottom:8px; color:#000; line-height: normal; font-family: "Noto Sans KR"; font-size: 120%; font-weight: 500;  }
#inputpass{ width: 130px;}

#filebox{ position:absolute; z-index:auto; top:0px; left:0px; }
#filebox > span { position:relative; z-index:auto; display: block; height: 0px; }
#filebox > span > img { position:absolute; z-index:auto; top:-7px; left:15px; }
#filelist {border:1px solid #ccc; border-radius:5px; padding:15px; color:#636363; background:#fff; line-height: 230%; list-style: none; box-shadow: 3px 3px 3px rgba(0,0,0,0.2); }
#filelist>li{ line-height:250%; padding: 0px 10px;}
#filelist>li:not(:last-child){ border-bottom:1px dotted #ddd; }
#filelist>li>img{vertical-align:middle;}
.datupfile>span{ font-size: 85%; color:#999; }
.viewfile, .prevclick{ cursor: pointer; }

/*PC 관련*/
@media screen and (min-width: 501px) {
    /*list*/ 
    #bbsSearch input{ line-height: 20px;}
    #keyword{ width: 180px;}
    #wrapSearch {text-align: right; padding: 15px 0px; }

    /*admlogin*/
    #admlogin>div>form label {display:inline-block; width: 95px; text-align:left; }

    /*view*/
    .bbsView > h1 { font-size: 160%; }

    /*write*/
    .bbsagree { padding:30px; height: 200px; }
    #bbsWrite>ul>li { border-top:1px dotted #ccc; padding: 5px 0px; line-height: 32px; }
    #bbsWrite>ul>li:first-child { border-top:0px }
    #bbsWrite input[type="text"] { width: 85%; }
    #bbsWrite input.halfinput{ width:calc(35%); }
    label+div { width: 85%; display: inline-block; }    
    #passul{ border-bottom: 1px dotted #ccc;}
}
/*탭 이하 관련*/
@media screen and (max-width: 1024px) {
    /*admlogin*/
    #fbbslogin input[type="text"],#bbsWrite input[type="password"] {font-size: 100%; }

    /*write*/
    .bbsagree {  padding:15px; height: 100px; }
    #bbsWrite>ul>li{ line-height: 250%; border-top:0px; padding: 0px; }
    #bbsWrite input[type="text"],#bbsWrite input[type="password"] { width: 100%; margin:3px 0px; font-size: 100%; }
    #passul{ border-bottom: none;}
}
/*모바일 이하 관련*/
@media screen and (max-width: 500px) {
    /*list*/
    #bbsList { font-size: 100%;}
    #keyword{ width: 110px;}
    #wrapSearch {background: #f7f7f7; border-bottom: 1px solid #ddd; text-align: left; padding: 10px; }
    #wrapSearch input{ background: #fff;}

    /*view*/
    .bbsView > h1 { font-size: 130%; }
}