/*공통*/

.toparr { margin: auto; width: 5px; height: 30px; top:0; left:0;position: absolute; z-index:99999;}
.toparr a.top { position: fixed; right: 10%; bottom: 10%; display: none; opacity:1; }
.toparr a.top:hover{opacity:.8;}


.goto_btns{    position: fixed;    right: 0; top:100px;    z-index: 99;}

.goto_btns a{display:block; width: 32px;}
.goto_btns a img{display: inline-block;}
.goto_btns a:hover{opacity: .8;}


.htitle{clear: both; width: 100%;  margin: 0 auto 50px;   text-transform: uppercase; color:#2a2a2a;  }
.htitle h1{font-size: 2.3em;font-weight: 600; margin:0 auto;  }
.htitle h2{font-size: 2em;font-weight: 600; margin:0 auto;   }
.htitle h3{font-size: 1.5em;font-weight: 600;  margin:0 auto;  }
.htitle h4{font-size: 1.2em;margin:0 auto;  }
.htitle h5{font-size: 1.1em;margin:0 auto;  }
.htitle p{margin:10px auto 0; font-size: 1em;}

h1, h2, h3, h4, h5, h6{line-height: 180% !important; margin:0 auto !important;}
.shtitle{clear: both; width: 100%;  margin: 0 auto 30px;   text-transform: uppercase; color:#444;  }
.shtitle h2{font-size: 2.2em;font-weight: 600; border-bottom: 1px #999 solid;letter-spacing: -0.02em;padding:10px 0 10px 00px; color:#000; }






@media (max-width: 768px){
.goto_btns {    top: auto;    z-index: 99;    bottom: 82px;}	
.htitle h1{font-size: 1.8em;}
.htitle h2{font-size: 1.5em;}

.shtitle h2{    font-size: 1.5em;     padding: 0 0 5px 0;}


/*타블렛, 모바일 비노출*/
.mbnone{display: none !important;}


}






#footerarea{clear: both;    width: 100%;    background: #2b3643; padding: 50px 0; font-size:13px; color:#fff;}
#footerarea .footer_mn{margin-bottom: 20px;}
#footerarea .footer_mn a{color:#999 !important; padding:0 5px; }
#footerarea .footer_mn a:last-child{border-right:0;}
#footerarea .footer_mn a:first-child{padding-left:0;}

#footerarea ul li{display: block;}
#footerarea ul span{
    font-size: 15px!important;
    font-weight: 200!important;
    letter-spacing: 0.02em;
    display: inline-block;
    padding-right: 15px;
    position: relative;
    color: #dedede;
}
#footerarea ul b{font-size: 15px!important;
    font-weight: 200!important;
    letter-spacing: 0.02em; padding-right: 5px; display: inline-block; }

#footerarea .col-lg-3{text-align: center;}

#footerarea a{display: inline-block; color:#999;}


@media (max-width: 768px){
#footerarea{padding: 30px 0;}
#footerarea .col-lg-3{text-align: left;}
.footersubarea{border:0; padding:0 15px !important; }



}




/*메인*/

.ourworks{width:100%; margin:0 auto; padding: 80px 0; }
.ourworks a h2{color:#222;}
.ourworks p{color:#666; line-height: 160% !important; font-size: 16px !important; font-weight: 300 !important;}
.ourworks h2{font-size: 1.4em; margin:15px auto 0 !important; font-weight: 400;}
.ourworks h2 i{display: inline-block; float: right;color:#ddd; font-weight: 100;}
.ourworks ul:hover h2,
.ourworks ul:hover h2 i, 
.ourworks ul:hover li{color:#08297c;}
.ourworks ul:hover img{opacity: .6}

.ourworks ul li{padding:10px 25px !important;}

.ourworks ul li.btns-imgs{padding:0 !important; background: #08297c; overflow: hidden;}
.ourworks ul li.btns-imgs img{width: 100%; height: auto;}



.main-btns {  position: relative;  transition: all 0.2s ease 0s;
  -webkit-transform: translateY(0px) translateX(0px);
  transform: translateY(0px) translateX(0px);}

.main-btns:before,
.main-btns:after {
  display: inline-block;  position: absolute;
  content: " ";  width: 100%;  height: 3px;  background: #08297c;
  -webkit-transform: scaleX(0);    transform: scaleX(0); transition: all 0.2s ease;}

.main-btns:before {  top: 0;  left: 0;  -webkit-transform-origin: 0 0; transform-origin: 0 0;}
.main-btns:after {  bottom: 0;  left: 0;  -webkit-transform-origin: 100% 0; transform-origin: 100% 0;}
.main-btns:hover:after,
.main-btns:hover:before {  -webkit-transform: scaleX(1); transform: scaleX(1)}
.main-btns ul {  border: 1px solid #ddd;}

.main-btns ul:before,
.main-btns ul:after {  display: inline-block;
  position: absolute;  content: " ";  width: 3px;
  height: 100%;  background: #08297c;  -webkit-transform: scaleY(0);transform: scaleY(0);
  transition: all 0.2s ease 0.2s;}
.main-btns ul:before {  top: 0;  left: 0; transform-origin: 0 100%; -webkit-transform-origin: 0 100%;}
.main-btns ul:after {  top: 0;  right: 0;  transform-origin: 0 0; -webkit-transform-origin: 0 0;}
.main-btns ul:hover:after,
.main-btns ul:hover:before {  -webkit-transform: scaleY(1);transform: scaleY(1)}



@media (max-width: 1200px){
.ourworks{padding:50px 0 0;}    
.ourworks .row .col-md-6{margin-bottom: 50px;}

}



@media (max-width: 768px){

.ourworks h2 i{display: none;}
.ourworks h2{font-size: 1.2em;}
.ourworks ul li{padding:5px 10px !important;}
.ourworks a li p{font-size: 14px !important; letter-spacing: -0.02em; }

.ourworks .col-lg-3,.ourworks .col-xs-6, 
.ourworks .col-sm-6, .ourworks .col-md-6{padding:0 8px !important;}

.ourworks a li br{display: none;}
.ourworks a li:nth-child(2){min-height: 50px;}



}



.adv_divs {
    width: 100%;
    min-height: 623px;
    margin: 0 auto;
    padding: 120px 0;
    color: #fff;
    background: url('adv_divs.jpg')no-repeat center;
    background-size: cover;
}
.adv_divs h2 {
    font-size: 30px;
    font-weight: 300;
    margin: 0 auto 30px!important;
    letter-spacing: -0.05em;
}
.adv_divs h2 span {
    font-size: 32px;
    font-weight: 500;
}
.adv_divs .row{width: 96%; margin:0 auto;}
.adv_divs p {
    font-size: 18px!important;
    font-weight: 200!important;
    line-height: 1.8!important;
    margin-bottom: 2rem;
}
.adv_divs a {
    display: inline-block;
    margin: 15px auto 0;
    border: 1px #fff solid;
    color: #fff;
    padding: 0 55px;
    font-size: 14px;
    line-height: 45px;
    font-weight: 300;
}
.adv_divs a:hover{background:#fff; color:#000; }




.gallery_divs{width:100%; margin:0 auto; padding: 80px 0; }


@media (max-width: 768px){
.adv_divs{padding:100px 0;}	
.gallery_divs{padding:50px 0 30px;}
.adv_divs h2{font-size: 1.5em;}
.adv_divs a{line-height: 3; padding: 0 20px;}
}	



.mov_divs{width:100%; margin:0 auto; padding: 80px 0; background:#f1f1f1; }
.mov_divs iframe{display: inline-block; width: 100%; height: 550px;border:0;}

@media (max-width: 768px){
.mov_divs{padding:50px 0;}
.mov_divs iframe{width:98%; height: 280px;}

}	




.mainfooter{width:100%; margin:0 auto; padding: 80px 0; background:url('mainfooter_bg.jpg')no-repeat; background-size:cover; text-align: center; }
.mainmap{}
.mainmap iframe{display: block; height: 360px; width: 100%;  box-shadow: 10px 10px #9fd8df; }

.quickmn{width: 100%; max-width: 380px;}
.quickmn ul{ box-sizing: border-box; }
.quickmn ul li{    float: left;    position: relative;    width: 50%;    box-sizing: border-box; background: #fff;}
.quickmn a{display: block; color:#333;padding:30px; margin:0 auto; transition: all 0.2s ease;  }
.quickmn ul li:nth-child(2n+1) {    border-right: 1px solid #ddd;}
.quickmn ul li:nth-child(n+3) {  border-top: 1px solid #ddd;}


.quickmn i{display: inline-block;     font-style: normal;    font-size: 3.2em;    padding: 15px 0 0;}

.quickmn .quicktit{font-size: 16px !important; font-weight: 600; }
.quickmn a:hover{background:#9fd8df; color:#fff;}
.quickmn a:hover i{color:#333;}
.quickmn em{display:block; font-style:normal; font-size:13px; color:#08297c; font-weight: 600; text-transform: uppercase;}
.quickmn p{margin-bottom: 0;}





/*.noticeoutput tr {border-bottom: 1px #ddd solid; }*/
.noticeoutput tr td:nth-child(1){display:none;}
.noticeoutput tr td:nth-child(2){width:70%; text-align: left;}
.noticeoutput tr td:nth-child(3){width:30%; text-align: right; color: #999;}
.noticeoutput tr td{font-size: 13px !important; font-family: 'Noto Sans KR', 'Roboto', sans-serif !important; padding:0px 0 !important;}
.noticeoutput tr td a{font-family: 'Noto Sans KR', 'Roboto', sans-serif !important; font-size: 13px !important; }
.noticeoutput tr td a:hover{color:#333; text-decoration: none;}




@media (max-width: 768px){

.mainfooter{padding:50px 0;}	

.mainmap iframe{height: 280px;}
.quickmn{max-width: 100%;}
.quickmn a{    width: 100%;    text-align: left;    padding: 10px 20px;}
.quickmn a:nth-child(2){margin:20px 0;}
.quickmn img{display: inline-block; margin-right: 10px; margin-bottom: 0;max-height: 40px; width: auto; }


}

@media (max-width: 650px){
.mainfooter .col-md-5{margin-bottom: 50px; }
.quickmn i{font-size: 2em; padding:0;}
.mainmap {    width: 96%;}

}


.mail_notice_divs{width:100%; margin:0 auto; padding: 80px 0; background:#f5f5f5; }
.mail_notice_divs .mmailform{}
.mail_notice_divs .mmailform textarea{background:#fff;}
.mail_notice_divs iframe{display: block; width: 100%; height: 450px;}

.mailformtb{font-size: 14px; width: 99%; margin:0 auto;}
.mailformtb td{padding:5px 0 !important;}
.mailformtb td.formmail_title_bgcolor{width: 18%; background-color:transparent !important;text-align: left; line-height: 0}
.mailformtb td.formmail_cell_bgcolor{width: 80%; text-align: left; line-height: 0; padding:5px 0 5px 0 !important; background: transparent;}
.mailformtb td input:not([type]), 
.mailformtb td input[type="email" i], 
.mailformtb td input[type="number" i], 
.mailformtb td input[type="password" i], 
.mailformtb td input[type="tel" i], 
.mailformtb td input[type="url" i], 
.mailformtb td input[type="text"],
.mailformtb td input[type="text" i]
{width: 100% !important; border:0 !important; background:#fff !important; padding:4px !important;line-height: 30px; }

.mailformtb textarea{max-height: 80px; width: 100%;border:0 !important; min-height: 80px; background:#f1f1f1;}
.mailformtb .formmail_title_bgcolor, 
.mailformtb .formmail_cell_bgcolor{border-bottom: 0 !important;}
.mailformtb table td{font-size: 13px !important; vertical-align: middle;}
.mailformtb table textarea{height: 50px; color:#999;min-height: 50px;}

.subcontxt .mailformtb input[type='text']{width: 98.6% !important; border:0 !important; background:#f1f1f1 !important; padding:7px !important;}

.subcontxt .mailformtb textarea{max-height: 120px;}
.subcontxt .mailformtb td table{margin-top: 20px;}

.subcontxt .mailformtb td.formmail_cell_bgcolor{line-height: 30px;}
.subcontxt .mailformtb select{width: 100%; }


.mailform1{clear: both; width: 100%; margin-top: 10px;}
.mailform1 a{display: inline-block; background: #999; line-height: 35px; color:#fff; padding:0 15px; margin-right: 5px; font-size: 13px;}
.mailform1 a:last-child{margin-right: 0;}
.mailform1 a:hover{color:#fff; background:#666;}


.mmnotice{width:95%; margin-left:5%; text-align: left; }
.mail_notice_divs h2{font-size: 1.8em !important; font-weight: 600;}
.mail_notice_divs h2 i{display: inline-block; padding-left: 5px; vertical-align: middle; font-size: 18px !important;}
.mail_notice_divs h2 a{   color: #3f86cf;text-transform: uppercase;   }
.mail_notice_divs h3{text-transform: uppercase;     font-size: 1.4em;
    display: block;    color: #333 !important;    margin: 0 auto 20px !important;
    padding: 0 0 10px;    font-weight: 600; border-bottom: 1px #999 solid; }





@media (max-width: 811px){	
.mailformtb table td{display: inline-block; width: 100%;}
.mailformtb td{padding:0 !important;}
.mailformtb td.formmail_title_bgcolor{width: 30%; }
.mailformtb td.formmail_cell_bgcolor{width: 70%;line-height: 15px !important; }
/*.mailformtb td.formmail_cell_bgcolor br{display: none !important}*/

/*.subcontxt .mailformtb input[type='text']{width: 100% !important;}*/
.subcontxt .mailformtb select{margin-bottom: 10px;}

.mail_notice_divs iframe{height: 250px;}

.subcontxt .mailformtb td.formmail_title_bgcolor{line-height: 30px;}




.mmnotice{margin:50px auto 0; width: 98%;}
.noticeoutput tr td:nth-child(2),
/*.noticeoutput tr td:nth-child(3){display: inline-block !important; text-align: left !important; width: 100% !important; padding:5px 0 !important;}*/

}





/*서브*/

#subtitbg{clear: both; width:100%; margin:0 auto; padding: 100px 0 0; color:#fff;}
#subtitbg h2{font-size: 2.5em;font-weight: 600; text-transform: uppercase;margin: 0 auto !important; }
#subtitbg p{margin:0 auto; font-size: 1.1em !important;}
#subtitbg .row{padding:0; margin:0;}
#subtitbg .row .col-md-12{padding:0;}

.subbg1{background:url('subbg1.jpg')no-repeat center center; background-size:cover; }
.subbg2{background:url('subbg2.jpg')no-repeat center center; background-size:cover; }
.subbg3{background:url('subbg3.jpg')no-repeat center center; background-size:cover; }
.subbg4{background:url('subbg4.jpg')no-repeat center center; background-size:cover; }
.subbg5{background:url('subbg5.jpg')no-repeat center center; background-size:cover; }


.submn{clear: both; width:100%; margin:80px auto 0;    background:rgba(0,0,0,.4);}
.submn ul{display: inline-block; margin:0 auto !important; margin-top:-1px !important;}

.submn a{display: inline-block; color:#fff; font-size: 14px; line-height: 50px; text-align: center; min-width: 150px; padding:5px 30px; font-weight: 500; }
.submn a:hover{background:#fff; color:#08297c;border-top:1px #08297c solid !important;}

.submn ul li{display: inline-block; margin:0 -2px !important; }

.submn1 .submn ul li:nth-child(1) a{border-top:1px #08297c solid !important; background: #fff; color: #08297c;}
.submn2 .submn ul li:nth-child(2) a{border-top:1px #08297c solid !important; background: #fff; color: #08297c;}
.submn3 .submn ul li:nth-child(3) a{border-top:1px #08297c solid !important; background: #fff; color: #08297c;}
.submn4 .submn ul li:nth-child(4) a{border-top:1px #08297c solid !important; background: #fff; color: #08297c;}
.submn5 .submn ul li:nth-child(5) a{border-top:1px #08297c solid !important; background: #fff; color: #08297c;}
.submn6 .submn ul li:nth-child(6) a{border-top:1px #08297c solid !important; background: #fff; color: #08297c;}
.submn7 .submn ul li:nth-child(7) a{border-top:1px #08297c solid !important; background: #fff; color: #08297c;}
.submn8 .submn ul li:nth-child(8) a{border-top:1px #08297c solid !important; background: #fff; color: #08297c;}
.submn9 .submn ul li:nth-child(9) a{border-top:1px #08297c solid !important; background: #fff; color: #08297c;}
.submn10 .submn ul li:nth-child(10) a{border-top:1px #08297c solid !important; background: #fff; color: #08297c;}



.csinfo{clear: both; width:100%; margin:0 auto 30px;padding:10px; text-align: center; }
.csinfo h2{font-size: 1.1em;font-weight: 600;  letter-spacing: -0.02em; text-transform: uppercase; width: 100%; color:#000;}
.csinfo h3{font-size: 1.2em;font-weight: 600;  letter-spacing: -0.03em; text-transform: uppercase; width: 100%; color:#08297c;}
.csinfo p{margin:0 auto; font-size: 85% !important; letter-spacing: -0.02em;}

#subarea{clear: both; width:100%; margin:0 auto; padding: 80px 0;}
#subarea .row .col-lg-2, 
#subarea .row .col-lg-2.col-md-2 
{padding-left:0 !important;}



.mtableo{width:100%; height:auto; min-height:600px; text-align: center; padding: 0 15px;}
.mtableo iframe{display:inline-block; padding-bottom:50px; float:left; width:48%;margin-right:4%; text-align:center;height: 350px; }
.mtableo iframe:nth-child(2n){margin-right:0;}

a.mtableolink{background:#d42428; display: inline-block; padding:10px 25px; font-size: 1em; margin:0 auto; color:#fff; text-align: center;}

a.mtableolink span{display: inline-block; width: 100%; padding-bottom: 10px; }
a.mtableolink:hover{color:#fff; background:#444;}




@media (max-width: 811px){
#subarea{padding:50px 0;}	
.mtableo{padding:0;}

#subtitbg{padding:50px 0 0;}
.submn a{min-width: 80px; font-size:13px; line-height: 40px;}

#subtitbg h2{font-size: 1.5em;}	

.mtableo iframe{width:100%; float:none; margin:0;}	



}	


/**/


.subcontxt{clear: both; width: 100%; padding:0 20px!important;}
.subcontxt h1,.subcontxt h2, .subcontxt h3, .subcontxt h4, .subcontxt h5{text-transform: uppercase; color:#333; font-weight: 600;}
.subcontxt h1{font-size: 2.3em;}
.subcontxt h2{font-size: 2em;}
.subcontxt h3{font-size: 1.5em;
    color: #08297c;}
.subcontxt h4{font-size: 1.4em;}
.subcontxt h5{font-size: 1.2em;}

.subcontxt iframe{display: inline-block; width: 100%;}

.addarea{width: 100%;}
.addarea b{display: inline-block; padding-right: 5px; color: #333;}
.addarea p{margin-bottom: 5px;}

@media (max-width: 768px){
.subcontxt{padding:0;}
.subcontxt h1{font-size: 1.8em;}
.subcontxt h2{font-size: 1.5em;}
.subcontxt h3{font-size: 1.3em; }


}	




/**/

.his_list {    position: relative;    margin: 80px auto 0;    width: 96%;}

.his_list ul{margin:0 auto !important; padding:0 !important;}
.his_list ul li {    margin-bottom: 50px;
    list-style-type: none;    display: flex;
    flex-direction: row;    align-items: center;}

.his_point {    min-width: 12px;    height: 12px;
    background-color:#28abb9;    border-radius: 100%;    z-index: 2;
    border: 2px #333333 solid;    position: absolute;
    left: 50%;    margin-left: -4px;}

.his_list h3{margin-bottom: 20px !important;}
.his_list ul li .his_content {    width: 48%; }

.his_list ul li:nth-child(odd) .his_content {    padding-left: 0; }

.his_list ul li:nth-child(odd) .date {    padding-right: 0;}

.his_list ul li:nth-child(even) .his_content {    padding-right: 0;}

.his_list ul li:nth-child(even) .date {    padding-left: 0; }

.his_list ul li .date {    width: 50%;    padding: 0 20px;    font-weight: normal; }

.his_list ul li:nth-child(even) {    flex-direction: row-reverse;}

.his_list p{margin-bottom:5px; font-size: 14px !important}

.his_list::before {    content: "";    position: absolute;    height: 100%;
    width: 2px;    left: 50%;    background-color: #333;}
.his_box{    background: #f1f1f1;    padding: 30px;    }

.h_no{display: inline-block;    color: #08297c;    font-weight: 600; vertical-align: top;}
.h_cons{display: inline-block;padding-left: 10px;}
.h_cons br{display: inline-block !important;}


@media (max-width: 811px){

.his_point,
.his_list::before{left:0;}
.his_list ul li .his_content { width: 90%; margin-left: 10%;}
.his_list ul li:nth-child(even) { flex-direction: row;}

}	


@media (max-width: 480px){
.h_cons{display: block;}
.h_cons{padding-left: 0; letter-spacing: -0.02em;}

}	















/*갤러리*/

.btnlist, .pagelist{clear: both; width: 100%; margin:20px 0;}
.btnlist img, .pagelist img ,.searchlist img{width:auto !important; height: auto !important;min-width: auto !important; min-height: auto !important;}
.pagelist{text-align: center;}
.pagelist a{color:#999;}

.btnlist{text-align: right;}
.searchlist{text-align: center;}
.board_output_gallery_img{width: 100%;}



.gallery_title, 
.board_output_gallery_subject{display:block; font-size: 15px !important; margin:0 auto;line-height: 30px;}



.glist3{width:100%;}
.glist3 table{width:33.3%; display: inline-block; text-align: center; margin-bottom:20px; float:left;}

.glist3 img{ max-width: 100%;min-height: 100%; width: 320px;height: 240px; object-fit:cover; object-position:center; transition: .3s ease;}
.glist3 img:hover{opacity: .6;}



.glist3t{width:100%;}
.glist3t tr{ display:inline;    font-size:0;}
.glist3t td{display: inline-block; text-align: center; }
.glist3t td table{width: 96%; margin:0 auto;}

.glist3t img{ max-width: 100%;min-height: 100%;object-fit:cover; object-position:center; transition: .3s ease;}
.glist3t img:hover{opacity: .6;}

.glist3t .board_admin_bgcolor table{display: none;}
.glist3t input[type=checkbox], .glist3t input[type=radio]{display: none;}



.glist4t{width:100%;}
.glist4t tr{ display:inline;    font-size:0;}
.glist4t td{display: inline-block; text-align: center; }
.glist4t td table{width: 96%; margin:0 auto;}

.glist4t img{ max-width: 100%;min-height: 100%; width: 250px;height: 250px; object-fit:cover; object-position:center; transition: .3s ease;}
.glist4t img:hover{opacity: .6;}

.glist4t .board_admin_bgcolor table{display: none;}
.glist4t input[type=checkbox], .glist3t input[type=radio]{display: none;}







@media (max-width: 811px){

#search_table{width: 100% !important; margin:0 auto;}
#search_table td:nth-child(1){width:20%; text-align: right;}
#search_table td:nth-child(2){width:50%; text-align: left;}
#search_table td:nth-child(3){width:30%; text-align: left; }
#search_table td input[type="text"] { max-width: 90% !important;     width: 100%;}

.gallery_title, 
.board_output_gallery_subject{display:inline-block; width: 100%; font-size: 90% !important;}


.glist3 img{height: 160px !important; min-height: auto !important}
.glist3 table{width:48%; margin-right: 4%;}
.glist3 table:nth-child(2n){margin-right: 0;}
.glist3 table:nth-child(odd){margin-right: 4%;}	



.glist3t img{height: 160px !important; min-height: auto !important}
.glist3t td{width: 50%; height: auto;}
.glist3t td table td{width: 100%;} 
.glist3t td table{width: 97%;}

.glist4t img{height: 250px !important; width: 100%;min-height: auto !important}
.glist4t td{width: 50%; height: auto;}
.glist4t td table td{width: 100%;} 
.glist4t td table{width: 97%;}



}