@charset "utf-8";

header {
    border: none;
    background-color: white;
}

.mobile_nav li a {
    background-color: white;
}
.mobile_sub li a {
    background-color: #ececec;
}
.wrapper {
    height: auto;
    top: 80px;
}

/*랩*/
.wrap {
    width: 100%;
    height: auto;
    margin: 0 auto;
}

/*섹션 수정*/
.section .subtxt {
    width: 90%;
    font-size: 0.8rem;
    text-align: center;
    font-weight: lighter;
    word-break: keep-all;
    line-height: 1.5;
}
.section img {
    display: none;
}
.section.layout {
    height: auto; padding: 10px 0;
    margin-top: -10px;
}

/*이미지_설정*/
.img_set {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}
.img_set img {
    width: 45%;
}

/*배터리_헤더*/
.battery_wrap {
    width: 100%;
    padding: 80px 0 40px;
    text-align: center;
    color: #444444;
    line-height: 1.5;
    opacity: 0;
}
.battery_wrap .year {
    background-color: #fb0123;
    color: white;
    width: 150px;
    height: 50px;
    border-radius: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
}
.battery_wrap h2 {
    padding: 25px 20px;
    font-size: 1.2rem;
    font-weight: bold;
    word-break: keep-all;
}
.battery_wrap h3 {
    font-size: 1rem;
    font-weight: bold;
    word-break: keep-all;
    padding: 0 20px;
}
.battery_wrap p {
    max-width: 700px;
    padding: 0 20px;
    font-size: 0.8rem;
    margin: 0 auto;
    word-break: keep-all;
}
.battery_wrap span {
    color: #fb0123;;
    font-weight: bold;
}
.padding_set {
    padding: 30px 0 30px;
    margin-bottom: 20px;
}
.vertical_line {
    background-color: #acacac;
    width: 1px;
    height: 50px;
    margin: 0 auto;
    margin-top: 25px;
}

/*프로세스*/
.process_wrap {
    width: 100%;
    display: flex;
    flex-direction: column;
}
.process {
    width: 33.333%;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    opacity: 0;
}
/*동그라미*/
.process span:nth-child(1) {
    background-color: #fb0123;
    width: 50px;
    height: 50px;
    border-radius: 100%;
    margin: 50px 0 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
}
/*세로줄*/
.process span:nth-child(2) {
    background-color: rgba(68, 68, 68, 0.5);
    width: 1px;
    height: 35px;
    margin-bottom: 25px;
}
.process h2 {
    margin-bottom: 25px;
}

/*밸류*/
.value_container {
    display: flex;
    flex-wrap: wrap;
    color: #444444;
}
.value_wrap {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
}
.value_wrap h2{
    background-color: #f3f3f3;
    width: 95%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    font-weight: bold;
    border-top: 2px solid #444444;
    margin: 0 auto;
}
.value_wrap span {
    color: orange;
    font-weight: bold;
}
.value_wrap_imgWrap {
    width: 50%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
/*    opacity: 0;*/
}
.value_wrap_imgWrap h3 {
    font-weight: bold;
    padding: 20px;
}
.value_wrap_img {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    background-color: #eeeeee;
    border-radius: 100%;
/*
    width: 150px;
    height: 150px;
*/
    width: 100px;
    height: 100px;
    margin-top: 20px;
}
.bgImg_1 { background-image: url(../img/battery/bat_pro_1.png);}
.bgImg_2 { background-image: url(../img/battery/bat_pro_2.png);}
.bgImg_3 { background-image: url(../img/battery/bat_pro_3.png);}
.bgImg_4 { background-image: url(../img/battery/bat_pro_4.png);}
.bgImg_5 { background-image: url(../img/battery/bat_pro_5.png);}
.bgImg_6 { background-image: url(../img/battery/bat_pro_6.png);}
.bgImg_7 { background-image: url(../img/battery/bat_pro_7.png);}
.bgImg_8 { background-image: url(../img/battery/bat_pro_8.png);}
.bgImg_9 { background-image: url(../img/battery/bat_pro_9.png);}
.bgImg_10 { background-image: url(../img/battery/bat_pro_10.png);}

.value_wrap h2.width_full {width: 95%;}
.width_full { width: 100%;}
.widthSet_100_33 { width: 100%;}
.widthSet_100_50 { width: 100%;}
.imgSet { width: 250px; height: 250px; border-radius: 0; background-color: white;}
.imgSet2 { width: 150px; height: 150px; border-radius: 0; background-color: white;}
.borderSet { border-bottom: 2px solid #f3f3f3;}

/*PC:111111*/
@media screen and (min-width: 1024px) {

    /*순서변경*/
    .orderChange {
        order: 1;
    }

    /*섹션수정*/
    .section .subtxt {
        width: 70%;
        font-size: 1rem;
    }
    .section img {
        display: block;
        margin-bottom: 35px;
    }

    /*이미지설정*/
    .img_set img {
        width: 25%;
    }

    /*프로세스*/
    .process_wrap {
        flex-direction: row;
    }
    .process {
        width: 33.333%;
    }

    /*배터리_랩*/
    .battery_wrap {
        padding: 80px 0 40px;
    }
    .battery_wrap h2 {
        font-size: 1.5rem;
    }
    .battery_wrap h3 {
        font-size: 1.1rem;
    }
    .battery_wrap p {
        max-width: 100%;
        padding: 0 100px;
        font-size: 1rem;
    }

    /*밸류*/
    .value_wrap {
        width: 45%;
    }
    .value_wrap_imgWrap {
        width: 50%;
    }
    .value_wrap h2.width_full {width: 100%;}
    .width_full { width: 100%;}
    .widthSet_100_33 { width: 33.333%;}
    .widthSet_100_50 { width: 50%;}
    .borderSet { border-bottom: none;}
}/*END:미디어쿼리(PC)*/

.fade2,.fade3 {
    opacity: 0;
}
.grow1,.grow2 {
    opacity: 0;
}
/*
onTrigger,onTriggerItem1,onTriggerItem2 {
    opacity: 0;
}*/