﻿
.searchBoxPC {
    padding-left: 10px;
    position: absolute;
    top: -15px;
    right: -100%;
    height: 40px;
    background-color: #e6e6e6;
    border-style: none;
    border-radius: 20PX;
    width: 280%;
}

.searchPC {
    position: absolute;
    top: -8px;
    right: -90%;
}



.searchBoxGoogleFrame {
    margin-left: 100px;
}

.searchBoxGoogle {
    padding-left:15px;
    position: absolute;
    top: 0px;
    left: 0px;
    height: 40px;
    background-color: #e6e6e6;
    border-style: none;
    border-radius: 20PX;
    width: 90%;
}


.searchGoogle {
    position: absolute;
    top: 9px;
    right: 150px;
}
.hotSearch {
    position: absolute;
    top: 45px;
    left: 10px;
}

@media (max-width: 1850px) {
    .searchBoxPC {
        right: -100%;
        width: 200%;
    }

    .searchPC {

        right: -90%;
    }
}


@media (max-width: 1750px) {
    .searchBoxPC {
        right: -100%;
        width: 200%;
    }

    .searchPC {
        right: -90%;
    }
}



@media (max-width: 1650px) {
    .searchBoxPC {
        right: -100%;
        width: 200%;
    }

    .searchPC {
        right: -90%;
    }
}


@media (max-width: 1550px) {
    .searchBoxPC {
        right: -100%;
        width: 200%;
    }

    .searchPC {
        right: -90%;
    }
}

@media (max-width: 1450px) {
    .searchBoxPC {
        right: -50%;
        width: 150%;
    }

    .searchPC {
        right: -40%;
    }
}



@media (max-width: 1350px) {
    .searchGoogle {
        top: 5px;
        right: 130px;
    }
}


@media (max-width: 1250px) {
    .searchGoogle {
        top: 5px;
        right: 120px;
    }
}



@media (max-width: 1150px) {
    .searchGoogle {
        top: 5px;
        right: 110px;
    }

}


@media (max-width: 1050px) {
    .searchBoxPC {
        right: -20%;
        width: 100%;
   }

    .searchPC {
        right: -10%;
    }
    .searchGoogle {
        top: 5px;
        right: 110px;
    }

}



.searchBoxBugFrame {
    display: none
}


@media (max-width: 991px) {
    .navHeight {
        margin-top: 40px;
    }


    .searchBoxPCFrame {
            display: none;
        }

        .searchBoxBugFrame {
            display: block;
        }

        .searchBoxBug {
            position: absolute;
            height: 40px;
            top: -0px;
            left: -20%;
            background-color: #e6e6e6;
            border-style: none;
            border-radius: 20PX;
            width: 140%;
        }

        .searchBug {
            position: absolute;
            top: 5px;
            right: -17%;
            background-color: #e6e6e6;
 

        }
        .searchGoogle {
            top: 4px;
            right: 100px;
        }
    }

@media (max-width: 850px) {
    .searchGoogle {
        top: 5px;
        right: 95px;
    }
}

@media (max-width:750px) {

    .searchGoogle {
        top: 4px;
        right: 90px;
    }

}

@media (max-width:650px) {

    .searchGoogle {
        top: 5px;
        right: 80px;
    }
}



    @media (max-width: 576px) {


        .searchBoxBug {
            left: 0%;
            width: 100%;
        }

        .searchBug {
            right: 3%;
        }

        .searchGoogle {
            top: 5px;
            right: 70px;
        }
    }



    @media (max-width: 450px) {


        .searchBoxBug {
            left: 10%;
            width: 80%;
        }

        .searchBug {
            right: 23%;
        }

        .searchGoogle {
            top: 5px;
            right: 60px;
        }
    }


    @media (max-width: 400px) {


        .searchBoxBug {
            left: 15%;
            width: 75%;
        }

        .searchBug {
            right: 28%;
        }
    }