


/*속통*/
.peh__h1__video { margin-top: 50px !important;}
.peh__h1__video video{ width: 100%; }
@media (max-width: 768px){ 
    .peh__h1__video{ transform: scale(1.3);  margin-bottom: 2em;}
}

.peh__container__da span{ 
display: block; 
font-weight: 400; line-height: 1.2; 
margin-bottom: 1em;}
.peh__container__da span strong{
font-family: 'Segoe UI Bold'; 
 font-size: 1.1em; line-height: 1.2;  
text-transform: uppercase;}
.peh__container__da ul{
display: flex;
justify-content: center;
align-items: center; 
gap: 3vw;


}
.peh__container__da ul li div{ 
    position: relative; 
    width: 9em; 
    height: 9em; 
    border-radius: 14em; 
    overflow: hidden; 
    padding:0; 
    margin: 0 auto;
    margin-bottom: 1em;  }
.peh__container__da ul li div img{ width: 100%; transform: scale(1.05);}
@media (max-width: 1280px){    }
@media (max-width: 768px){ 
    .peh__container__da ul li div{ 
        width: 8em; 
        height: 8em;             
        margin-bottom: 2em; 
    }
    .peh__container__da{ margin-bottom: 2em;}
}

.peh__container__db{ 
display: flex;
flex-direction: column;
gap: 0.7em;
overflow: hidden;
padding: 6em 0 0 0;

}
.peh__container__db>div:nth-child(1){ 
    width: 100%; box-sizing: border-box; 
display: flex;
flex-direction: column;
gap: 1em;
margin-bottom: 2em;
}
.peh__container__db>div:nth-child(1) div{ text-align: center;}
.peh__container__db>div:nth-child(2){width: 92%; max-width: 1000px; box-sizing: border-box; margin: 0 auto;  }
.peh__container__db>div:nth-child(2) img{width: 100%;}
.peh__container__db>div:nth-child(3){ display:flex ;
flex-direction: row; gap: 1em;
position: relative;
width: 92%; max-width: 1000px; margin: 0 auto;
top: 0em;
} @media (max-width: 768px){ 
.peh__container__db>div:nth-child(3){ 
    flex-direction: column;
    top: 0vw;
}
}
.peh__container__db>div:nth-child(3) div:nth-child(1){
    width: 100%;
}@media (max-width: 768px){ 
    .peh__container__db>div:nth-child(3) div:nth-child(1){
        width: 100%;
    }
}   
.peh__container__db>div:nth-child(3) div:nth-child(1) img{
    width: 100%;
}    
.peh__container__db>div:nth-child(3) div:nth-child(2){
    background-color: #e7e7e7;
    text-align: left;
    width: 100%;
    display: flex;
    flex-direction:column;
    justify-content: center;
    gap:6%;
    box-sizing: border-box ;
    padding:0 0 0 5.5%;
}
@media (max-width: 768px){ 
    .peh__container__db>div:nth-child(3) div:nth-child(2){
        width: 100%; margin: 0 auto;
        gap:1em;
        
        padding:3em 0 3em 31%; padding:3em 0 ;
        align-items: center
    }
}

.peh__container__db>div:nth-child(3) div:nth-child(2) div:first-child{ 
    text-align: left;
    font-size: 1.4em;
}
@media (max-width: 1280px){ 
    .peh__container__db>div:nth-child(3) div:nth-child(2) div:first-child{ 
        font-size: 2vw;
    }
    }
@media (max-width: 768px){ 
    .peh__container__db>div:nth-child(3) div:nth-child(2) div:first-child{ 
        font-size:0.9em;
        text-align: center;
    }

}
.peh__container__db>div:nth-child(3) div:nth-child(2) ul{
    flex-direction: column;
    gap: 0.5em;


}
.peh__container__db>div:nth-child(3) div:nth-child(2) ul li{
    text-align: left;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap:0.5em;
    

}
.peh__container__db>div:nth-child(3) div:nth-child(2) ul li img{
    width: 1.4em; 


}



.peh__container__dc{ -background-color: #ececec;   }
.peh__container__dc div:nth-child(1){ font-weight: 600; font-size: 1.3em; padding-bottom: 2em;}
.peh__container__dc ul:nth-child(2){
    display: flex;
    justify-content: center ;
    gap: 2em; width: 92%; margin: 0 auto; 
}
.peh__container__dc ul:nth-child(2) li{
    display: flex;
    flex-direction: column;
    justify-content: center; 
    
}
.peh__container__dc ul:nth-child(2) li div{ padding: 0;}
.peh__container__dc ul:nth-child(2) li div img{ width: 100%;}

.peh__container__dc ul:nth-child(2) li span{ display: block; height: 3em;} 
@media (max-width: 768px){
    .peh__container__dc{ padding: 15vw 0 15vw 0;   }


 }

.peh__container__ed{
    width: 100%; 
    position: relative;     
    padding: 0;
}
.peh__container__ed img{width: 100%; 
    position: relative;  }
    .peh__container__ed>div{ 
        position: absolute;            
        top:20%;
        left: 50%;
        display: flex;
        flex-direction: column;
        width: 50%;
        height: 10em;
        text-align: left;
    }
    .peh__container__ed div div,
    .peh__container__ed div div strong{ text-align: left;}
    .peh__container__ed div div:last-child{ margin-top: 1em !important;}


.peh__container__ec{ width: 92%; margin: 0 auto; max-width: 1000px; padding: 6em 0 6em 0;}
.peh__container__ec *{ text-align: left;}
.peh__container__ec div:nth-child(1){ font-weight: 600; padding-bottom: 1em; }
.peh__container__ec div:nth-child(2) strong strong{ font-size: 1.2em;}
.peh__container__ec ul:nth-child(3){
    margin-top:2em ;
    display: flex;
    gap: 1.3%;


}
.peh__container__ec ul:nth-child(3) li{ border-radius: 1em; overflow: hidden; line-height: 0;}
.peh__container__ec ul:nth-child(3) li img{ width: 100%;}



.peh__container__ef{
    width: 100%; 
    position: relative;     
    padding: 0;
    background-color: #000;
    line-height: 0;
}
.peh__container__ef img{width: 100%; 
    position: relative; line-height: 0; opacity: 0.45;  }
    .peh__container__ef>div{ 
        position: absolute;            
        top:40%;
        left: 00%;
        display: flex;
        flex-direction: column;
        width: 100%;
        height: 10em;
    }
    .peh__container__ef div div{ color: #fff;  }
    .peh__container__ef div div strong{ color: #fff; font-weight: 600; }
    .peh__container__ef div div:last-child{ margin-top: 1em !important;}






    /*���� ����*/



/* gray*/
.peh__container__bb{ 
    margin: 0 auto; 
    padding: 10vw 0 0 0;
    background-color: #3e3e3e; 
    width:92%; max-width: 1000px; 
    overflow: hidden; color: #fff; 

    display: flex;
    flex-direction: column;
    justify-content: center;

}
.peh__container__bb__icon{ 
    width: 4em;
    height: 4em;
    border-radius: 4em;
    line-height: 4em;
    color: #fff;
    background-color:#696259;
    margin: 0 auto;
    transform: scale(0.5);
    position: relative;
    top: 0.5em;
}


.peh__container__bb div:nth-child(1){}
.peh__container__bb div:nth-child(2){}
.peh__container__bb div:nth-child(3){}
.peh__container__bb div:nth-child(1){ font-weight: 400; }
.peh__container__bb div:nth-child(1) div:nth-child(1){ padding-bottom: 1.0em;  }
.peh__container__bb div:nth-child(1) strong{ font-weight: 600; }
.peh__container__bb div:nth-child(2){}
.peh__container__bb div:nth-child(2) img{ width: 100%;}
.peh__container__bb ul:nth-child(3){    display: flex;     justify-content: space-evenly;    }
.peh__container__bb ul:nth-child(3) li{ width: 7em;}
.peh__container__bb ul:nth-child(3) li div{ margin: 0 auto; }
.peh__container__bb ul:nth-child(3) li div img{ width: 100%;} 


.peh__container__bc{ margin-top: 3em;     padding: 7% 0 0% 0;}
.peh__container__bc>div{ font-weight: 400; transform: scale(0.9);}
.peh__container__bc>div strong{ font-weight: 600;}
.peh__container__bc>div strong font{  color: #725344}

.peh__container__bd{
    width: 92%; max-width: 1000px; 
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    justify-content: space-between;    
    gap:1.5vw;
}
.peh__container__bd>div{ 
    box-sizing: border-box;
    width: 100%;
    display: flex;
    flex-direction: column;
}
.peh__container__bd>div>div:nth-child(1){ 
    position: relative;
    width: 100%;
    overflow: hidden;
}
.peh__container__bd>div>div:nth-child(1) img{    width: 100%; transition: all 6s;  }
.peh__container__bd>div:hover>div:nth-child(1) img{  transform: scale(1.2); }

.peh__container__bd>div>div:nth-child(1) div{    
    width: 100%; 
    position: absolute; 
    left: 0%;
    top: 40%;
    color: #fff;
}
.peh__container__bd>div:nth-child(1){ background-color: #d1d1d1;}
.peh__container__bd>div:nth-child(2){ background-color: #dedad0;}
.peh__container__bd>div>div:nth-child(2){ 
    padding: 3vw 0  3vw 7vw; 
    text-align: left; 


}



/* 기존 css
.peh__container__ae{ margin-top: 6em;}
.peh__container__ae>div:nth-child(1){ font-weight: 400; transform: scale(0.9);}
.peh__container__ae>div:nth-child(1) strong{ font-weight: 600;}
.peh__container__ae>div:nth-child(1) strong font{  color: #725344}
    .peh__container__ae ul{ 
        padding: 5% 0;
        display: flex;
        justify-content: center;
        flex-direction: row;  
        gap: 1em;
    }
    .peh__container__ae ul li{
        display: flex;
        flex-direction: column;
    } 
    .peh__container__ae ul li div{ width: 92%; margin: 0 auto;  margin-bottom: 1.3em;}
    .peh__container__ae ul li div img{ width: 100%;}
    .peh__container__ae ul li strong{ line-height: 1.5; padding-bottom: 0.2em;}


    .peh__container__ae .peh__container__ae__table { 
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 2%;
    font-weight: 600;        }
    .peh__container__ae .peh__container__ae__table img{ transform: scale(0.9);}



/* .peh__container__ae    a.css 에서 css  가져옴 20211204 문제가 있다면 상단 css 로 원복*/

.peh__container__ae{ margin-top: 8em; margin-bottom: 3em;}
.peh__container__ae>div:nth-child(1){ font-weight: 400; transform: scale(0.9);}
.peh__container__ae>div:nth-child(1) strong{ font-weight: 600;}
.peh__container__ae>div:nth-child(1) strong font{  color: #725344}
    .peh__container__ae ul{ 
        padding: 5% 0;
        display: flex;
        justify-content: center;
        flex-direction: row;  
        gap: 1em;
        width: 80%;
        max-width: 700px;
        margin: 0 auto;
    }
    .peh__container__ae ul li{
        display: flex;
        flex-direction: column;
        width: 50%;
    } 
    .peh__container__ae ul li div:nth-child(1){ margin-bottom: 1em; }

    .peh__container__ae ul li div:nth-child(2){ width: 92%; margin: 0 auto;  margin-bottom: 0.5em;}
    .peh__container__ae ul li div:nth-child(2) img{ width: 100%;}
    .peh__container__ae ul li div:nth-child(3){ font-size: 1em; font-weight: 600; line-height: 1.5; padding-bottom: 0.2em;}
    .peh__container__ae ul li div:nth-child(4){  font-size: 0.7em; width: 100%;}




/**/






    .peh__container__ao {
        background-color: #eee; 
        padding: 5em 0 5em 0; 
        display: flex;
        width: 100%;
        justify-content: center;
        gap:3em;
    
    }
    .peh__container__ao>img{ width: 15em; height: 15em;}
    .peh__container__ao div:nth-child(2){ font-weight: 400; text-align: left;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .peh__container__ao div:nth-child(2) strong{ font-weight: 600; text-align: left;}
    .peh__container__ao div:nth-child(2) a div{
        display: block;
        background-color: #464544;
        color: #fff;
        width: 10em;
        font-size: 50%;
        line-height: 2.7;
        position: relative;
        margin-top: 0.9em;
        transition: all 1s;
    }
    .peh__container__ao div:nth-child(2) a:hover div{
        background-color:#222 ;
    }
    @media (max-width: 1280px){    }
    @media (max-width: 768px){ 
        .peh__container__ao { 
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }
    
    }
    
    