@charset "utf-8";



/* LNB */
.LNBIn div.LNBOn{ background-color: #e9c775;}

/* greeting */
#greeting{ width: calc( 100% - 160px); margin:  85px auto 120px;}
#greeting .greetingWrap{ display: flex; justify-content: space-between; margin-bottom: 80px;}
.greetingWrap .greetHalf{ width: 70%; display: flex; justify-content: space-between; flex-direction: column;}
.greetHalf .greetTit{ margin-bottom: 50px;}
.greetTit h3{ font-size: 36px; color: #000; }
.greetTit h3 strong{ font-size: 36px; font-weight: 800; color: #000;}
.greetTxt p{margin-bottom: 10px; font-size: 14px; line-height: 1.5em;}
.greetTxt p span{ display: block; line-height: 1.5em;}
.greetingWrap .greetHalf:last-child{ width: 30%; justify-content: flex-end; align-items: flex-end;}
.greetHalf .greetImg{ margin-bottom: 10px;}
.greetImg img{ width: 150px;}
.greetImg p{ text-align: right; }
.greetImg p span{ display: block;}
.greetingStepWrap .greetTit{ margin-bottom: 30px;} 
.greetingStepWrap .greetStep{ display: flex; justify-content: space-between; gap: 0 20px; }
.greetStep .greetCon{width: 33.333%; display: flex; flex-direction: column;}
.greetCon .greetConNum{ display: flex; align-items: center; }
.greetConNum p{ font-size: 150px; font-weight: 900; color: rgba(100, 167, 143, 0.1);}
.greetCon .greetConTxt{ display: flex; align-items: flex-end; flex-direction: column;}
.greetConTxt h4{ color: #595959; }
.greetConTxt h2{ font-size: 30px; font-weight: 600; color: #595959;}

/* 반응형 */
@media all and (max-width: 1440px){
    .greetConNum p{ font-size: 120px;}
    .greetConTxt h2{ font-size: 24px;}
}
@media all and (max-width: 1024px){


    #greeting{ width: calc( 100% - 60px); margin: 20px auto 80px;}
    .greetTit h3{ font-size: 30px;}
    .greetTit h3 strong{ font-size: 30px;}
}
@media all and (max-width: 768px){

    .greetTit h3{ font-size: 24px;}
    .greetTit h3 strong{ font-size: 24px;}
    .greetTxt p span{ display: inline;}
    .greetImg img{ width: 120px;}
    .greetImg p span{ font-size: 12px;}
    .greetConTxt h2{ font-size: 18px;}
    .greetConNum p{ font-size: 72px;}
}
@media all and (max-width: 520px){

    #greeting{ width: calc( 100% - 20px); margin: 0 auto 60px;}
    #greeting .greetingWrap{ flex-direction: column; align-items: flex-end;}
    .greetingWrap .greetHalf{ width: 100%;}
    .greetHalf .greetTit{ margin-bottom: 20px;}
    .greetTit h3{ display: inline; font-size: 18px;}
    .greetTit h3 strong{ font-size: 20px;}
    .greetHalf .greetImg{ margin: 30px 0 0;}
    .greetingStepWrap .greetStep{ flex-direction: column;}
    .greetingStepWrap .greetTit{ margin-bottom: 10px;}
    .greetStep .greetCon{ width: 100%; flex-direction: row; justify-content: space-between;}
    .greetCon .greetConTxt{ justify-content: center;}
    .greetConNum p{ font-size: 86px;}
    
}
@media all and (max-width: 320px){
    .greetConNum p{ font-size: 72px;}
}