/*
=========================================================================
헤더 css
=========================================================================
*/
#header{width: 100%; position: relative;}

/* gnb pc */
.gnb_pc{width: 100%; height: 95px; overflow: hidden; position: absolute; top:0; left: 0;  z-index: 500;}
.gnb_pc::after{position: absolute; top:90px; content: ''; display: none; width: 100%; height: 1px; background: #eee; z-index: -100;}
#header:hover .gnb_pc::after{display: block;}
.logo{
    position: absolute;
    top:25px; left:3%;
    display: block;
    width: 140px; height: 40px;
    background: url(../img/common/logo_w.png) no-repeat center /  100% auto;
}
.gnb_pc:hover .logo{background: url(../img/common/logo.png) no-repeat center /  100% auto;}
.gnb_pc_link{display: flex; justify-content: center; margin-top: 30px;}

.gnb_pc_menu .main{margin-right: 100px; white-space: nowrap; position: relative;}
.gnb_pc_menu .main:last-of-type{margin-right: 0;}
.gnb_pc_menu .main .m{line-height: 31px;  padding-bottom: 29px; font-weight: 500; color: #fff; display: inline-block; position: relative;}
.gnb_pc_menu .main .m::after {content:""; position: absolute; left: 50%; bottom: 0; width: 0; height: 3px;background-color: #58B531; transition: all .5s;}
.gnb_pc_menu .main .m::before {content:""; position: absolute; right: 50%; bottom: 0; width: 0; height: 3px; background-color: #58B531; transition: all .5s;}
.gnb_pc_menu .main:hover .m::after {width: 50%;}
.gnb_pc_menu .main:hover .m::before {width: 50%;}
.gnb_pc_menu .main .sub{position: absolute;  top:78px; font-size: 0.98em; line-height: 2.2; text-align: center; left: 50%; transform: translateX(-50%);}
.gnb_pc_menu .main .sub a{color: #222;}
.gnb_pc_menu .main .sub a:hover{color: #58B531; font-weight: 600;}
.gnb_pc_menu .hambuger{position: absolute; right:3%; top:30px; background: url(../img/common/icon_total_w.png) no-repeat center / 90%; width: 25px; height: 25px; z-index: 50; cursor: pointer;}
.gnb_pc:hover .hambuger{background: url(../img/common/icon_total.png) no-repeat center / 90%;}
.gnb_pc_subBG{position: absolute;top:-5px; left: 0;width:100%; height:300px;background: #fff;z-index: 100; border-bottom: 1px solid #eee;display: none;}

@media (max-width: 1300px) {
    .gnb_pc_menu .main{margin-right: 70px;}
}

@media (max-width: 1200px) {
    .gnb_pc{height: 85px;}
    .logo{width: 130px;}
    .gnb_pc_menu .main{margin-right: 50px;}    
    .gnb_pc_menu .main .m{padding-bottom: 31px;}
    .gnb_pc_subBG{height:250px;}

}
@media (max-width: 1000px) {
    .gnb_pc{display: none;}
}

/* 모바일 gnb */
.gnb_m{display: none; width: 100%; height: 80px; overflow: hidden; position: absolute; top:0; left: 0; z-index: 800;}
.mlogo{position: absolute; top:25px; left:20px; display: block; width: 120px; height: 34px; background: url(../img/common/logo_w.png) no-repeat center / 100% auto;}
.mhambuger{position: absolute; top:26px; right: 3%; background: url(../img/common/icon_total_w.png) no-repeat center / 90%; width: 26px; height: 26px; cursor: pointer;}
.mhambuger .line{width: 22px; height: 2px; background-color: #fff; margin-bottom: 6px;}
.mclose{position: absolute; top:37px; right: 3%; z-index: 900;}
.mclose .line{
    position: absolute; top:0; right: 0;
    width: 26px; height: 2px;
    background-color: #fff;
}
.mclose .line:nth-of-type(1){transform: rotate(45deg);}
.mclose .line:nth-of-type(2){transform: rotate(-45deg);}
.gnb_m_in{position:fixed; width:calc(80% - 60px); height:100vh; padding-top: 50px; padding-left: 60px; background-color:#222; top:0; right: -100%; z-index:30;}
.gnb_m_menu .main{padding-bottom: 10px;}
.gnb_m_menu .m{color: #ccc; font-size: 1.5em; font-weight: 600; line-height: 2.5;}
.gnb_m_menu .main .m::after{content: ''; display: inline-block; border-radius: 50%; width: 7px; height: 7px; margin-left: 10px; display: none; transform: translateY(2px); background: #58B531;}
.gnb_m_menu .main:hover .m{color: #fff;}
.gnb_m_menu .main:hover .m::after{display: inline-block;}
.gnb_m_menu .main .sub{font-size: 1em; line-height: 2; display: none;}
.gnb_m_menu .main .sub a{color: #fff;}
.gnb_m_menu .sub li:hover a{color: #58B531;}

@media (max-width: 1000px) {
    .gnb_m{display: block;}
}
@media (max-width: 600px) {
    .gnb_m_in{padding-left: 40px;}
}
/*
=========================================================================
컨테이너 css
=========================================================================
*/
#container{position:relative; min-width: 380px;}

/* 서브페이지 visual */
.svisual{width:100%; height:480px; background: #ccc; background-size: cover ; padding: 0 5%; position: relative; box-sizing: border-box; z-index: 50;}
.sv1{background: url('../img/content/s_vis01.jpg') no-repeat center;}
.sv2{background: url('../img/content/s_vis02.jpg') no-repeat center;}
.sv3{background: url('../img/content/s_vis03.jpg') no-repeat center;}
.sv4{background: url('../img/content/s_vis04.jpg') no-repeat center;}
.sv5{background: url('../img/content/s_vis05.jpg') no-repeat center;}
.sv6{background: url('../img/content/s_vis06.jpg') no-repeat center;}

.sv_tit{position: absolute; top:50%; left: 5%; transform: translateY(-50%);}
.svisual h1{font-size: 3em; color: #fff; white-space: nowrap;}
.svisual p{font-size: 1em; color: #fff; margin-left: 10px; font-family: 'Montserrat';}

@media (min-width: 1920px) {
    .svisual{background-size: 100% auto ;}
}
@media (max-width: 1200px) {    
    .svisual{height: 450px;}
}
@media (max-width: 900px) {
    .svisual{height: 400px; padding: 0 20px;}
    .svisual h1{font-size: 2.5em; margin-top: 20px;}
}
@media (max-width: 720px) {    
    .svisual{height:350px;}
    .sv_tit{text-align: center; left: 50%; transform: translate(-50%, -50%);}
}
@media (max-width: 600px) {
    .svisual h1{font-size: 2.2em;}
}

/* lnb */
#lnb{display: flex; align-items: center; z-index: 300; position: absolute; right: 0; bottom:0; background: #58B531; padding: 15px 5% 15px 30px;}

#lnb .home_btn{width: 30px; height: 30px; background: url(../img/common/icon_home.png) no-repeat center / 90% auto; border-radius: 50%; cursor: pointer;}
#lnb .lnb_arrow{background: url(../img/common/icon_lnb_arrow.png) no-repeat center / 5px auto; width: 50px; height: 30px;}
.selectBox * { box-sizing: border-box;}
.selectBox { position: relative; width: 190px; height: 50px; background: url(../img/common/select_arrow.png) no-repeat center right  20px / 10px auto;cursor: pointer; }
.selectBox1{width: 140px;}
.selectBox.active { background: url(../img/common/select_arrow_active.png) no-repeat center right 20px / 10px auto;}

.selectBox .lnb_label {display: flex;  align-items: center; width: inherit; height: inherit; /* border-bottom: 1px solid rgba(255,255,255,.7); */ outline: 0 none; background: transparent; cursor: pointer; color: #fff;}
.selectBox .optionList{position: absolute; top: 50px; left: 0; width: 100%;  background: #fff; color: #666; list-style-type: none; overflow: hidden; max-height: 0; box-shadow: 3px 3px 20px 0px rgba(0, 0, 0, 0.25); transition: all .5s;}
.selectBox .optionList::-webkit-scrollbar {width: 6px;}
.selectBox .optionList::-webkit-scrollbar-track {background: transparent; }
.selectBox .optionList::-webkit-scrollbar-thumb {background: #303030; border-radius: 45px;}
.selectBox .optionList::-webkit-scrollbar-thumb:hover {background: #303030;}

.selectBox.active .optionList {max-height: 500px;}
.selectBox .optionItem{padding: 0 20px 20px; font-size: .92em;}
.selectBox .optionItem:first-of-type{padding: 20px;}
.selectBox .optionItem:hover{color: #58B531; font-weight: 700;}

@media (max-width: 1200px) {    
    #lnb{padding: 10px 20px}
    .selectBox {background: url(../img/common/select_arrow.png) no-repeat center right / 8px auto;}
    .selectBox.active { background: url(../img/common/select_arrow_active.png) no-repeat center right / 8px auto;}
    .selectBox .optionList{top:45px;}
}
@media (max-width: 900px) {
    .selectBox{width: 180px; height: 40px;}
    .selectBox1{width: 120px;}

}
@media (max-width: 720px) {
    #lnb{display: none;}
}

/* lnb2 */
#lnb2{position:relative; margin:0 auto; width:100%; height:75px; background: #fff;}
#lnb2::after{display:block;clear:both;content:''}
#lnb2 ul li{position:relative;float:left;width:50%;text-align:center;border-bottom: 1px solid #ddd;}
#lnb2 ul li::before{content: '';border-left: 1px solid #eee;position: absolute;top: 23px;right: 0px;width: 1px;height: 30px;}
#lnb2 ul li:last-child::before{content: '';border-left:0}
#lnb2 ul li a{position:relative;display:block;padding:0 5px;  color:#333;line-height:75px;transition:all 0.2s ease;-webkit-transition:all 0.2s ease;}
#lnb2 ul li a:hover{color:#58B531;}
#lnb2 ul li a.hover::after{opacity:1}
#lnb2 ul li a span{display:inline-block; padding-bottom:4px; line-height:1.2; vertical-align:middle;}
#lnb2 ul li:first-child:nth-last-child(2),
#lnb2 ul li:first-child:nth-last-child(2) ~ li{width:50%}
#lnb2 ul li:first-child:nth-last-child(3),
#lnb2 ul li:first-child:nth-last-child(3) ~ li{width:33.33%}
#lnb2 ul li:first-child:nth-last-child(4),
#lnb2 ul li:first-child:nth-last-child(4) ~ li{width:25%}
#lnb2 ul li a span{display: inline-block;padding-bottom: 4px;line-height: 1.2;vertical-align: middle;}

@media (max-width: 900px) {
    #lnb2{height:60px;}
    #lnb2 ul li::before{top: 20px; height: 20px;}
    #lnb2 ul li a{line-height:60px;}    
}
@media (max-width: 550px) {
    #lnb2 ul li a{padding: 0; font-size: .9em;}
}

/*
=========================================================================
푸터 css
=========================================================================
*/
#footer{position: relative; background: #333; color: #aaa; font-size: .9em;}
.footerIn{padding: 50px 5% 70px; display: flex; justify-content: space-between;}
#footer .flogo{width: 130px; margin-right: 50px;}
#footer .flogo img{width: 100%; height: auto;}
#footer .ftop{display: flex; margin-bottom: 30px;}
#footer .flink{display: flex; margin-top: 5px;}
#footer .flink li{cursor: pointer; font-weight: 500;}
#footer .flink li:first-of-type::after{content: ''; width: 1px; height: 14px; background: #aaa; margin: 0 20px; display: inline-block;}
.finfo{display: flex; flex-wrap: wrap; width: calc(100% - 200px); max-width:800px;}
.finfo p::after{content: ''; width: 1px; height: 12px; background: #aaa; margin: 0 10px; display: inline-block}
.finfo p:last-of-type:after{display: none;}
.fcopyright{margin-top: 30px; color: #888; font-size: .95em;}

.fright{margin-right: 50px; white-space: nowrap;}
.fcall_tit{margin-bottom: 3px; font-size: 1.05em;}
.fcall_num{font-family: 'Montserrat'; font-weight: 700; font-size: 1.6em; letter-spacing: 1px; margin-bottom: 5px;}
.fcall_info{font-size: .95em}
.fcall_info i{font-size: .7em; transform: translateY(-2px); display: inline-block; margin: 0 5px;}
.ebook_btn{color: #ccc; padding: 5px; text-align: center; border: 1px solid #888; margin-top: 30px; display: block; width: 270px; border-radius: 3px;}
.ebook_btn:hover{background: rgba(255,255,255,.05);}
.ebook_btn span{font-weight: 500;}
.ebook_btn span::before{content: '';display: inline-block; width: 18px; height: 18px; background: url(../img/common/icon_ebook.png) no-repeat center/ auto 100% ; transform: translateY(2px); margin-right: 10px;}

@media all and (max-width:1200px){
    .finfo{width: calc(100% - 100px);}
    .fright{margin-right: 0;}
    .ebook_btn{width: 210px;}
    .ebook_btn span::before{width: 16px; height: 16px; margin-right: 6px;}
}

@media (max-width: 1200px) {
    .footerIn{padding: 40px 5% 60px;}
    #footer .flogo{width: 120px; margin-right: 30px;}    
    #footer .flink li:first-of-type::after{margin: 0 20px;}
    .finfo_tit{margin-right: 30px;}
}
@media (max-width: 900px) {        
    .footerIn{padding: 40px 20px 60px; flex-wrap: wrap;}    
    #footer .flogo{width: 110px; margin-right: 20px; margin-top: 3px;}
    .finfo{width: 100%;}
    .finfo p::after{height: 9px;}
    #footer .flink li:first-of-type::after{margin: 0 10px; height: 9px;}
    #footer .fleft{width: 100%;}
    #footer .fright{width: 100%;}
    #footer .fright .fcall{display: none;}
    .finfo_tit{margin-right: 20px;}
}
@media (max-width: 600px) {
    #footer{font-size: .85em;}
    #footer .flogo{margin-bottom: 15px; width: 100px;}
    #footer .ftop{flex-wrap: wrap;}
    #footer .flink{width: 100%;}
    #footer .ftop .fleft{flex-direction: column;}
    .finfo p{white-space: nowrap;}
} 

/* top_btn */
#top_btn{position: fixed; bottom: 10px; right: 10px; z-index: 100; cursor: pointer;}
#top_btn img{width: 50px; height: auto;}

@media (max-width: 1920px) {
    #top_btn img{width: 45px; height: auto;}
}
@media (max-width: 900px) {
    #top_btn img{width: 40px; height: auto;}
}
@media (max-width: 600px) {
    #top_btn img{width: 35px; height: auto;}
}


/*
=========================================================================
240723 추가 css
=========================================================================
*/
.ebook_btn{padding: 4px 15px; margin-top: 20px; font-size: .95em; box-sizing: border-box; display: flex; justify-content: space-between;}
.ebook_btn:nth-of-type(2), .ebook_btn:nth-of-type(3){margin-top: 10px;}
.ebook_btn:nth-of-type(1) span::before{background: url(../img/common/icon_ebook1.png) no-repeat center/ auto 100%;}
.ebook_btn:nth-of-type(2) span::before{background: url(../img/common/icon_ebook2.png) no-repeat center/ auto 100%;}
.ebook_btn:nth-of-type(3) span::before{background: url(../img/common/icon_ebook3.png) no-repeat center/ auto 100%;}

@media (max-width:1200px){
    .ebook_btn{width: 240px;}
}
@media (max-width:900px){
    .ebook_btn{margin-top: 30px;}
    .fcopyright{margin-top: 20px;}
}
@media (max-width:600px){
    .ebook_btn{width: 220px;}
    #footer .ftop{margin-bottom: 18px;}
}