section{ width:100%; margin:auto; margin-top:230px; margin-bottom:100px; display:flex; flex-wrap:wrap; justify-content:center;}

section > div > div > .path{ display:none;}
.bbsmain1 > div > .path
,.bbsmain2 > div > .path
,.bbsmain3 > div > .path{ display:none;}

.bbsmain1> hr{ display:none;}
section > div > div > .sub{ width:100%; display:block; max-width:1300px; margin:auto;}


.bbsmain1 > div > h3
,.bbsmain2 > div > h3
,.bbsmain3 > div > h3{
  font-family: NotoSansKR;
  font-size: 22px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.86;
  letter-spacing: normal;
  text-align: left;
  color: #000;
  display:inline-block;
  width:100%; 
  margin-bottom:25px;
  text-transform:uppercase;
}


form#listsearch{ display:flex;justify-content: space-between; align-items: center; }
form#listsearch input[type=text]{
    width: 300px;
    height: 28px;
    background-color: #f3f3f3;
    border:0;  font-size:16px; padding:8px; float:left;
	padding-right:45px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 2.06;
    letter-spacing: normal;
    text-align: left;
    color: #000;}
form#listsearch .searchbtn{ 
    width:40px;
    position: absolute;
    top: 10px;
    right: 0;
    z-index: 44;
}
form#listsearch >div{
    position: relative;
}

form#listsearch .searchbtn img{
    width: 17px;
    height: 17px;
}
.bbsread > ul{ display:flex; flex-wrap:wrap; justify-content: space-between; align-items: center;}
.bbsread > ul > li:nth-child(1){ order:0; width:calc(100% - 130px);}
.bbsread > ul > li:nth-child(2){ order:2; flex-grow:1;}
.bbsread > ul > li:nth-child(3){ order:1; margin-top:12px;}
.bbsread > ul > li:nth-child(4){ order:3; margin-top:8px;display:flex; justify-content:flex-end; flex-grow:1;}
.bbsread > ul > li:nth-child(5){ order:4; width:100%; text-align:right;}
.bbsread > ul > li:nth-child(6){ order:5; width:100%;}
.bbsread > ul > li:nth-child(7){ order:6; width:100%;}

.bbsread > ul > li > label{ font-size:20px; display:none;}
.bbsread > ul > li > div#readgubun{ font-size:24px; font-weight:500;}
.bbsread > ul > li > div#readtitle{ font-size:36px; font-weight:700;}
.bbsread > ul > li > div#readwrname{ font-size:24px;}
.bbsread > ul > li > div#readfile{ border-top:2px solid #000; margin:10px 0; background-color:#f4eeef;}
.bbsread > ul > li > div#readcontent{  border-bottom:1px solid #000; padding:20px; min-height:300px;}
.bbsread > ul > li > div#readhit{ font-size:16px; color:#717171; }
.bbsread > ul > li > div#readhit:before{ content:"HIT : ";}

.bbsread #readfile ul{ display:flex; flex-wrap:wrap; border-bottom:1px solid #000;}
.bbsread #readfile ul > li{ margin:15px;}
.bbsread #readfile ul > li > a:before{ font-size:12px; display:inline-block; padding:1px 0; width:50px; text-align:center; border:1px solid #1E2B6C; color:#1E2B6C; border-radius:3px; margin-right:6px; float:left; background-color:#fff;}
.bbsread #readfile ul > li > a:hover:before{ background-color:#004cff; color:#fff;}

a[data-ext='xls']:before{ content:"XLS"; }
a[data-ext='xlsx']:before{ content:"XLSX"; }
a[data-ext='hwp']:before{ content:"HWP"; }
a[data-ext='pdf']:before{ content:"PDF"; }
a[data-ext='doc']:before{ content:"DOC"; }
a[data-ext='docx']:before{ content:"DOCX"; }
a[data-ext='ppt']:before{ content:"PPT"; }
a[data-ext='pptx']:before{ content:"PPTX"; }


.bbsread > .BbsReadNav0{ margin:30px 0; display:flex; justify-content:flex-end;}
.bbsread > .BbsReadNav0 > a{
  width: 120px;
  height: 44.3px;
  display:flex; justify-content:center;align-items: center;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  letter-spacing: normal;
  border:1px solid #000;
  margin:8px;
}
.bbsread > .BbsReadNav0 > a:hover{ border:1px solid #004cff;}


.bbslist > ul.head{
  border-top:1.5px solid #000;
  border-bottom:1.5px solid #000;
}
.bbslist > ul.head > li > a{ pointer-events:none; }
.bbslist > ul.head > li > a > span{   font-size: 17px;
  color: #000;
}
.bbslist > ul > li > a > span{   font-size: 17px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  letter-spacing: normal;
  padding:25.9px 0;
}
.bbslist > ul.body > li{ border-bottom:1px solid #d2d2d2;}

.bbslist > ul > li > a {
    display: flex;
    width: 100%;
    justify-content: space-between;
}
.bbslist > ul > li > a > span{
 overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bbslist > ul > li > a > .no{ width:8%; min-width:8%; text-align:center;}
.bbslist > ul > li > a > .btype{ width:15%; min-width:15%; text-align:center;}
.bbslist > ul > li > a > .title { width:44%; min-width:44%; text-align:center; flex-grow: 1;  }
.bbslist > ul > li > a > .bname { width:8%; min-width:8%; text-align:center; }
.bbslist > ul > li > a > .regdate{ width:13.5%; min-width:10%; text-align:center;}
.bbslist > ul > li > a > .hit{ width:10%; min-width:10%; text-align:center;}

.bbslist .nolist{ display:flex;  align-items: center; justify-content:center; height:300px;}
.bbslist .nolist > a{ text-align:center;pointer-events:none; }
.bbslist .nolist > a > span{
  font-size: 19px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 2.21;
  letter-spacing: -0.48px;
  color: #b5b5b5;
  margin:auto;

}

.bbslist > ul > li.noticeselect > a > .title{
  flex-grow: 0;
  max-width: 45%;
  width: 45%;
  margin-left: 17%;
}
.bbslist > ul > li.noticeselect > a > .no{
  width: 10%;
  max-width: 10%;
}
.bbslist > ul > li.noticeselect > a > .hit{
  width: 8%;
  max-width: 8%;
}
.bbslist > ul > li.noticeselect > a > .regdate{
  margin-left: 2%;
}
.bbslist > ul > li.noticeselect > a {
  display: flex;
  justify-content: flex-start;
}

.bbsread .nolist{ display:flex;  align-items: center; justify-content:center; height:300px;}
.bbsread .nolist > a{ text-align:center; }
.bbsread .nolist > a.noevent{pointer-events:none;}
.bbsread .nolist > a > span{
  font-size: 19px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 2.21;
  letter-spacing: -0.48px;
  color: #b5b5b5;
  margin:auto;

}


.bbslist > ul.body > li > a > span.title{ text-align:center;}

.bbslist > nav.BbsListNav0{  margin-top:30px; margin-bottom:100px; display:flex; justify-content: space-around;}




.bbslist > nav.BbsListNav0 > a{   font-family: NotoSansKR;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 2.22;
  letter-spacing: normal;
  text-align: left;
  color: #004cff;
    display: flex;
    align-items: center;
    justify-content:center;
    width: 203.6px;
    height: 57.1px;
    border: solid 1px #004cff;
    background-color: #fff;
	margin:20px 0;
}








.bbslist > nav.pagelist {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    padding-top: 58px;
}

.bbslist > nav.pagelist > a,
.bbslist > nav.pagelist > span {
    font-size: 17px;
    display: inline-block;
}


.bbslist > nav.pagelist > span {
    font-weight: 700;
}
.bbslist > nav.pagelist span:first-child{
  margin-right: 14px;
}
.bbslist > nav.pagelist a
,.bbslist > nav.pagelist span{
  margin-left: 25px;
  position: relative;
}


.bbslist > nav.pagelist a:last-child{
  margin-left: 14px;
}
.bbslist > nav.pagelist a:last-child::before{
  display: none;
}

.bbswrite > ul > li{ margin-bottom:20px;}
.bbswrite > ul > li > label{ display:none;}
.Tagdiv{ display:flex;}
#EditorTag{ display:none; border:0; border-bottom:1px solid #000; font-size:24px; padding:8px 0;}
#EditorTag.active{ display:inline-block;}
#EditorTagText{ display:none;border:0; border-bottom:1px solid #000; font-size:24px; padding:8px 0;}
#EditorTagText.active{ display:inline-block;}

.bbswrite > nav{ margin-bottom:100px; display:flex; justify-content:center;}
.bbswrite > nav > a{  font-size: 22px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    color: #000;
    display: flex;
    align-items: center;
    justify-content: space-around;
    width: 203.6px;
    height: 57.1px;
    border: 1px solid #000;
    background-color: #fff;
	margin:20px;
}

#EditorTitle{ width:96%; border:0; border-bottom:1px solid #000; font-size:24px; padding:8px 0;}

.BbsReadRepdiv0 > #bbsreadform > div{ display:flex;}
.BbsReadRepdiv0 > #bbsreadform > div#BbsReadRepWriteDiv{ display:none;}
.BbsReadRepdiv0 > #bbsreadform > div#BbsReadRepWriteDiv.active{ display:flex;}
.BbsReadRepdiv0 > #bbsreadform > div > ul{ flex-grow:1;}
.BbsReadRepdiv0 > #bbsreadform > div > ul > li{ display:flex; justify-content:space-between;}
.BbsReadRepdiv0 > #bbsreadform > div > ul > li > label{ font-size:24px; font-weight:500; width:100px; text-align:center; display:none;}
.BbsReadRepdiv0 > #bbsreadform > div > ul > li > div{ flex-grow:1; justify-content:flex-start; display:flex; flex-wrap:wrap;}
.BbsReadRepdiv0 > #bbsreadform > div > ul > li > div > .reptarget{ width:100%;}
.BbsReadRepdiv0 > #bbsreadform > div > ul > li > div > textarea{ border:1px solid transparent; border-bottom:1px solid #000; font-size:20px; flex-grow:1; resize:none; width:100%; box-sizing: border-box;}
.BbsReadRepdiv0 > #bbsreadform > div > ul > li > div > textarea:focus{ border:1px solid #ddd; border-bottom:1px solid #000;}
.BbsReadRepdiv0 > #bbsreadform > div > nav{ display:flex; justify-content:space-between; align-items:flex-end; }
.BbsReadRepdiv0 > #bbsreadform > div > nav > a{
	width: 120px;
  height: 44.3px;
  display:flex; justify-content:center;align-items: center;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  letter-spacing: normal;
  border:1px solid #000;
  margin-left:8px; margin-right:8px;
}
.BbsReadRepdiv0 > #bbsreadform > div > nav > a:hover{ color:#fff; background-color:#004cff; border:1px solid #004cff;}

#BbsReadRepdiv1{ display:none;}
#BbsReadRepdiv1.active{ display:block;}

.BbsReadRepdiv1 > h3{ margin-top:30px; padding:10px; border-bottom:1px solid #000; font-size:24px;}

#BoardRepTargetNameBtn{ color:#004cff;}

#bbsreadform[data-type='write'] #repaddbtn{ display:flex;}
#bbsreadform[data-type='write'] #repeditbtn
,#bbsreadform[data-type='write'] #repdelbtn
,#bbsreadform[data-type='write'] #represtbtn{ display:none;}

#bbsreadform[data-type='edit'] #repaddbtn{ display:none;}
#bbsreadform[data-type='edit'] #repeditbtn
,#bbsreadform[data-type='edit'] #repdelbtn
,#bbsreadform[data-type='edit'] #represtbtn{ display:flex;}


.BbsReadRepul0 li{ }
.BbsReadRepul0 li > div{ display:flex; flex-wrap:wrap; border-bottom:1px solid #000; padding:8px 0; padding-top:16px; justify-content:flex-end;}
.BbsReadRepul0 li > div.target{ animation-name:targetshow; animation-iteration-count:3; animation-duration:0.3s;}
.BbsReadRepul0 li > div > div.rep_name{ width:160px; margin:0 20px;}
.BbsReadRepul0 li > div > div.rep_text{ margin-bottom:8px; width:calc(100% - 390px);}
.BbsReadRepul0 li > div > div.rep_date{ width:190px; text-align:center;}
.BbsReadRepul0 li > div > nav{ margin:16px 20px; margin-left:200px; width:calc(100% - 220px); height:30px; display:inline-block;}
.BbsReadRepul0 li > div > nav > a{ background-color:#fff; display:inline-block; padding:3px 20px; font-size:14px; border:1px solid #000; margin-right:8px; visibility:hidden;}
.BbsReadRepul0 li > div > nav > a:hover{ border:1px solid #004cff;}

.BbsReadRepul0 li > div:hover > nav > a{ visibility:visible;;}
@keyframes targetshow{ 
	0%{ background-color:rgba(0,0,0,0);}
	50%{ background-color:rgba(0,0,0,0.2);}
	100%{ background-color:rgba(0,0,0,0);}
}



.rep_target{ margin-right:8px; width:calc(100% - 208px);}
.rep_target > a{ color:#004cff;}
.rep_target > a:before{ content:"@";}

.deltext, .admindeltext{ color:rgba(0,0,0,0.5);}


.bbsflex{
  width: 100%;
  margin: 0 auto;
  margin-top: 220px;
  padding-bottom: 200px;
}
.bbsflex>nav{display: flex;
justify-content: flex-start;
align-items: center;
margin-bottom: 100px;
background-color: #fff;
box-shadow: 3px 5px 7px 0 rgb(0 0 0 / 8%);
padding-top: 36px;
padding-bottom: 36px;
padding-left: 40px;
}

.bbsflex>nav{
  width: 980px;
  display: flex;
  margin: 0 auto;
  margin-bottom: 100px;
}
.bbsflex>nav ul{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-left: 60px;
}
.bbsflex>nav ul li{
  margin-left: 40px;
  text-align: center;
}
.bbsflex>nav h2{
  font-size: 24px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.83;
  letter-spacing: normal;
  text-align: left;
  color: #000;
  position: relative;
}
.bbsflex>nav h2 a{
  font-size: 24px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.83;
  letter-spacing: normal;
  text-align: left;
  color: #000;
}

.bbsflex>nav ul li{
  font-family: NotoSansKR;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.82;
  letter-spacing: normal;
  text-align: left;
  color: #000;
  position: relative;
}
.bbsflex>nav ul li a{
  font-family: NotoSansKR;
  font-size: 17px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.82;
  letter-spacing: normal;
  text-align: left;
  color: #000;
}

.bbsflex>section{
  margin:0;
  display: block;
  margin-left: 30px;
}
.bbsflex>section .bbsheader h2{
  font-size: 30px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: normal;
  text-align: left;
  color: #000;
}
.bbsflex>section .bbsheader h2 span{
  color: #004cff;
  margin-bottom: 35px;
}
.bbsflex>section .bbssearch{
  margin-bottom: 58px;
  display: flex;
  justify-content: flex-start;
  align-items:center ;
  margin-top: 34px;
}
.bbsflex>section .bbssearch div:last-child{
  margin-left: 15px;
}

.bbssearch>div:last-child button{
  width: 194px;
  height: 47px;
  border-radius: 27px;
  border: solid 1px #004cff;
  text-align: center;
  background-color: #fff;
  margin-left: 15px;
}
.bbssearch>div:last-child button a{
  font-size: 17px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 2.35;
  letter-spacing: normal;
  text-align: left;
  color: #004cff;
}




/* 고객센터 처음 화면 꾸미기 */
.bbsmainsection .aintroflex{
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}

.bbsmain1 .aintroflex{
  display: flex;
  justify-content: space-between;
  align-items:center;
}


.bbsmainsection .aintroflex a{
  width: 50px;
  font-size: 17px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 2.35;
  letter-spacing: normal;
  text-align: left;
  color: #000;
}
.bbsmainsection .aintroflex h3{
  font-family: NotoSansKR;
  font-size: 20px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 2.05;
  letter-spacing: normal;
  text-align: left;
  color: #000;
}

.bbsmainsection .bbsmain1 > div > h3, .bbsmainsection .bbsmain2 > div > h3, .bbsmainsection .bbsmain3 > div > h3{
  margin-bottom: 25px;
}


.bbsflex>section.bbsmainsection  .bbssearch div:last-child{
  margin-left: 0;
}
.bbsflex>section.bbsmainsection  .bbssearch form#listsearch input[type=text]{
  width: 590px;
  height: 47px;
  border-radius: 27px;
  border: solid 1px #000;
  background-color: #fff;
  padding: 0 20px;
}
.bbsflex>section.bbsmainsection  .bbssearch form#listsearch a{
  margin-top: 4px;
}




.aintroflex form#listsearch input[type=text]{
  width: 400px;
  height: 47px;
  border-radius: 27px;
  border: solid 1px #000;
  background-color: #fff;
  padding: 0 20px;
  margin-bottom: 20px;
}
.aintroflex form#listsearch a{
  margin-top: 4px;
}


.bbslist > ul > li > a > .wdate{
  width: 12%;
  text-align: center;
}
.bbslist > ul > li > a > .status{
  width: 10%;
  text-align: center;
}
.bbslist > ul > li.contactflex > a{
  align-items: center;
}
.bbslist ul.body li.contactflex a span:last-child{
  width: 10%;
  text-align: center;
  width: 60px;
  border-radius: 20px;
  height: 35px;
  padding: 0;
  font-size: 16px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 2.5;
  letter-spacing: normal;
  text-align: center;
  color: #000;
  line-height: 35px;
  display: flex !important;
  justify-content: center;
  align-items: center;
  margin-right: 28px;
  margin-left: 36px;
}
.bbslist ul.body li.contactflex2 a span:last-child{
  margin-right: 32px;
  margin-left: 52px;
}



.bbslist ul.body li.contactflex a span.step0 {
    background-color: #e8e8e8;
    color: #000;

}
.bbslist ul.body li.contactflex a span.step1 {
    background-color: #5c89f3;
    color: rgb(248, 248, 248);
}
.bbslist ul.body li.contactflex a span.step2 {
    background-color: #004cff;
    color: #fff;
}

.bbslist ul.body li.contactflex a span.step0:before{ content:"접수";}
.bbslist ul.body li.contactflex a span.step1:before{ content:"확인중";}
.bbslist ul.body li.contactflex a span.step2:before{ content:"완료";}




.bbslist > ul > li.qnatext{
  border-bottom: solid 1.5px #bebebe;
}
.bbslist > ul.qnawrap li{
  padding-bottom: 28px;
  padding-top: 28px;
}
.bbslist > ul > li.qnatext:last-child{
  border-bottom: none;
}
.bbslist > ul > li.qnatext:first-child{
  border-bottom: solid 1.5px #bebebe;
}
.bbslist > ul.qnawrap{
  border-top:2px  solid #000;
  border-bottom:2px  solid #000;
  cursor: pointer;
}
.bbslist > ul.qnawrap li span{
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.bbslist > ul.qnawrap li span h2:nth-child(2){
  font-size: 17px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 2.35;
  letter-spacing: normal;
  text-align: left;
  color: #000;
  margin-left: 30px;
}

.bbslist > ul.qnawrap li span h2:first-child{
  font-family: NotoSansKR;
  font-size: 20px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 2;
  letter-spacing: normal;
  text-align: left;
  color: #004cff;
}
.bbslist > ul.qnawrap li span.title h2:first-child{
  opacity: .62;
  color: #000;
}
.bbslist > ul.qnawrap li span{
  position: relative;
}
.bbslist > ul.qnawrap li span img{
  top: 14px;
  right: 26px;
  position: absolute;
}

.bbslist > ul.qnawrap li span.qnacontent.active{
  display: flex;
}
.bbslist > ul.qnawrap li span.active h2:first-child{
  opacity: 1;
}
.bbslist > ul.qnawrap li span.title.active h2:nth-child(2){
  font-weight: bold;
}
.bbslist > ul.qnawrap li span:nth-child(2){
  margin-top: 20px;
  display: none;
}

.bbslist > ul.qnawrap li span h2:nth-child(2){
  font-size: 16px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.88;
  letter-spacing: normal;
  text-align: left;
  color: #000;
}



@media screen and (min-width:1501px){
  .bbsflex>section{
    margin:0;
    display: block;
    margin-left: 90px;
  }
  section > div{ width:90%;}
  .bbsflex{
    max-width: 1640px;
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: top;
    margin: 0 auto;
    padding-top: 220px;
    margin-bottom: 200px;
  }
  .bbsflex>nav{
    width: 140px;
    background-color:none;
    box-shadow: none;
    display: block;
  }
  .bbsflex>nav ul {
    display: block;
    margin-left: 0;
  }
  .bbsflex>nav ul li{
    margin-top: 55px;
    margin-left: 0;
  }
  .bbsflex>nav h2::after{
    position: absolute;
    content: "";
    width: 140px;
    height: 3px;
    background-color: #000;
    left: 0;
    bottom: -25px;
  }
  .bbsflex>nav ul li::after{
    width: 124px;
    height: 1px;
    background-color: #707070;
    position: absolute;
    content: "";
    left: 0;bottom: -28px;
  }
  
}