/********************************************
* animation delay 애니메이션 딜레이
********************************************/

body { animation: fadeIn 1s ease forwards; } 

@keyframes fadIn { 
 0% { opacity: 0; } 
 100% { opacity: 1; } 
 }


 /********************************************
* MAIN COMMON
********************************************/
.con { max-width: var(--middle-container); margin: 0 auto; } 
.main-sec .con { max-width: var(--max-container); } 
.main-sec .con { padding: 10rem 0; } 
.main-btn { display: flex; justify-content: center; align-items: center; width: 12rem; height: 4rem; border: 1px solid #818181; transition: all .3s; } 
.main-btn span { transition: all .3s; } 
.main-btn:hover { color: #fff; background-color: #818181; } 
.main-btn:hover span { color: #fff; } 
.main-sec h2 { font-size: 5rem; font-weight: 700; } 

/********************************************
* SUB COMMON
********************************************/
#content .page-header h1 { margin: 0 auto; padding-top: 10rem; text-align: center; font-size: 4rem; font-weight: 700; } 

.sub-tit-wrap h3 { font-size: 3.5rem; } 
.sub-area { padding: 7rem 0 10rem 0; } 
.sub-area2 { padding: 0 0 15rem 0; } 
.sub-tit-wrap em { display: block; margin-bottom: 2rem; font-size: 2rem; color: var(--main-color2); } 
.sub-tit-wrap h3 { font-size: 4.5rem; font-weight: 700; } 

.sub-tit2-wrap { margin-bottom: 5rem; } 
.sub-tit2-wrap h4 { position: relative; padding-bottom: 2rem; padding-left: 2rem; border-bottom: 1px solid #ddd; font-size: 3rem; font-weight: 700; } 
.sub-tit2-wrap h4:before { content: ""; position: absolute; left: 0; top: 1.3rem; width: 1rem; height: 1rem; background-color: var(--main-color2); } 

.sub-table-wrap table thead, .sub-table-wrap th, .sub-table-wrap td { border: 1px solid #eaeaea; } 
.sub-table-wrap th { background-color: var(--main-color2); } 
.sub-table-wrap th { color: #fff; } 
.sub-table-wrap td { text-align: center; font-weight: 300; color: #3b3b3b; } 

/********************************************
* SUB VISUAL
********************************************/
.sub-visual-txt { height: 50rem; display: flex; flex-direction: column; justify-content: center; align-items: center; max-width: 120rem; margin: 0 auto; padding-top: 10rem; } 
.sub-visual-txt h2 { margin-bottom: 3rem; font-size: 5rem; color: #fff; font-weight: 700; } 
.sub-visual-txt p { color: #fff; font-size: 2rem; } 

.elementor-location-header { position: relative; } 
#sub-lnb-wrap { position: absolute; left: 0; bottom: 0; } 
#sub-lnb-wrap .sub-lnb { width: auto; height: 55px; } 
#sub-lnb-wrap .sub-lnb .elementor-widget-container { justify-content: center; } 
#sub-lnb-wrap .sub-home .elementor-button { width: 100%; height: 55px; } 

#sub-lnb-wrap .sub-lnb nav ul li a { transition: all 0.3s; } 
#sub-lnb-wrap .sub-lnb nav ul li a:hover { color: #fff; } 
#sub-lnb-wrap .sub-home .e-font-icon-svg { height: 3rem; font-size: 2.2rem; } 

/********************************************
* BOARD 게시판
********************************************/

.sub-area .kboard-list a { display: flex; align-items: center; gap: 2rem; padding: 3rem 4rem; border-radius: 1rem; border: 2px solid #ddd; transition: all .3s; } 
.sub-area .kboard-list a:hover { border: 2px solid var(--main-color2); } 
.sub-area .kboard-list a + a { margin-top: 2rem; } 
.sub-area .kboard-list .kboard-list-title { margin-right: auto; } 
.sub-area .kboard-list-uid { min-width: 10rem; text-align: center; padding: 0.5rem 0; border-radius: 2rem; font-size: 1.8rem; background-color: #ddd; transition: all .3s; } 
.sub-area .kboard-list a:hover .kboard-list-uid { color: #fff; background-color: var(--main-color2); } 
.sub-area .kboard-list .kboard-list-title .kboard-default-cut-strings { font-size: 2rem; } 
.sub-area .kboard-list .kboard-list-date { font-size: 2rem; color: #999; font-weight: 300; } 

.sub-board-top-wrap { display: flex; justify-content: space-between; border-top: 2px solid var(--main-color2); padding: 3rem; } 
.content-view img { display: block !important; } 
.sub-area .detail-attr { display: flex; gap: 2rem; } 
.sub-area #kboard-default-document .kboard-title h1 { font-size: 3rem; color: var(--main-color2); } 
.sub-area #kboard-default-document .kboard-detail .detail-attr .detail-name { color: var(--main-color2); } 
.sub-area #kboard-default-document .kboard-detail .detail-attr .detail-value { color: #999; } 
.sub-area #kboard-default-document .kboard-content .content-view { border-radius: 2rem; border: 2px solid #ddd; padding: 5rem; font-size: 1.8rem; } 

.sub-area a.kboard-default-button-small, input.kboard-default-button-small, button.kboard-default-button-small { padding: 0.3rem 2rem; border-radius: 1rem; color: var(--main-color2) !important; font-size: 1.6rem !important; font-weight: 500 !important; } 
a.kboard-default-button-small:hover,
a.kboard-default-button-small:focus,
a.kboard-default-button-small:active,
input.kboard-default-button-small:hover,
input.kboard-default-button-small:focus,
input.kboard-default-button-small:active,
button.kboard-default-button-small:hover,
button.kboard-default-button-small:focus,
button.kboard-default-button-small:active { color: #fff !important; background-color: var(--main-color2) !important; opacity: 1 !important; } 



.top-btn { position: fixed; right: 6rem; bottom: 23rem; z-index: 999; display: none; } 
.top-btn .top-btn-wrap { display: flex; justify-content: center; align-items: center; width: 5.5rem; height: 5.5rem; border-radius: 100%; background-color: var(--main-color); cursor: pointer; transition: all .3s; } 
.top-btn:hover .top-btn-wrap { background-color: var(--main-color2); } 


@media screen and (max-width:1720px) {
  
  .main-sec .con
  {padding:100px 20px;}
  .con
  {padding:0 20px;}

  #mainGalleryCon .elementor-widget-container
  {padding:100px 0 100px 20px;}
}

@media screen and (max-width:1400px) {
  #mainGalleryCon .elementor-widget-container
  {padding:100px 20px;}
}
@media screen and (max-width:767px){
  .sub-visual-txt
  {height:35rem;}
  .sub-visual-txt h2
  {font-size:4rem;}
}